:root { --pale: #eef4fa; }
body { font-family: 'Avenir Next', Avenir, 'Helvetica Neue', Arial, sans-serif; background: #fff; }
.wordmark span { letter-spacing: 2px; font-size: 11px; }
.hero { grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; padding-top: 52px; padding-bottom: 60px; }
.hero h1 { font-size: clamp(44px, 4.35vw, 66px); }
.hero-panel { margin: 0; padding: 0; min-height: 0; height: 570px; border-radius: 18px; background: #e5f0fa; overflow: hidden; position: relative; box-shadow: none; }
.hero-panel img { width: 100%; height: 100%; object-fit: cover; object-position: 53% center; display: block; }
.hero-panel figcaption { position: absolute; bottom: 18px; left: 18px; color: #243955; background: #fffffff0; border-radius: 3px; padding: 8px 12px; font-size: 10px; letter-spacing: 1.1px; }
.hero-actions { flex-wrap: wrap; }
.hero-note { margin-top: 28px; }
.button { border-radius: 4px; }
.service-row { padding: 24px 12px; }
.service-list { border-top: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 24px; }
.service-photo-card { padding: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; align-items: stretch; gap: 0; background: #fff; }
.service-thumbnail { display: block; width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; }
.service-photo-card > div { padding: 22px; display: grid; grid-template-columns: 1fr 24px; gap: 12px; }
.service-photo-card .index { grid-column: 1 / -1; }
.service-photo-card h3 { font-size: 19px; line-height: 1.4; }
.service-photo-card > div > span:last-child { color: var(--blue); }
@media(max-width:1050px) { .service-list { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:760px) { .service-list { grid-template-columns: 1fr; gap: 22px; } .service-photo-card { padding: 0; } }
.beauty-stories { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 64px; }
.beauty-card { display: block; background: #f3f7fb; border-radius: 14px; overflow: hidden; }
.beauty-card img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; transition: filter .2s; }
.beauty-card:hover img { filter: brightness(1.035); }
.beauty-card > div { padding: 30px; }
.beauty-card .eyebrow { margin-bottom: 14px; }
.beauty-card h3 { font-size: 30px; line-height: 1.2; font-weight: 500; letter-spacing: -.8px; margin-bottom: 18px; }
.beauty-card p:not(.eyebrow) { color: var(--muted); max-width: 440px; }
.text-link { color: var(--blue); font-size: 14px; font-weight: 600; }
.imagery-note { font-size: 12px; color: var(--muted); margin: 18px 0 0; }
.final-cta { border-radius: 14px; background: #edf4fc; }
.service-image { width: 100%; height: 320px; object-fit: cover; border-radius: 12px; display: block; margin-bottom: 28px; }
.packaging-detail h3, .production-detail h3 { font-size: 26px; font-weight: 500; line-height: 1.3; max-width: 700px; }
.production-detail ul { padding-left: 22px; }
.production-detail li { margin-bottom: 14px; }
.local-coordinator { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding: 36px; margin-top: 36px; background: #eef4fb; border-radius: 12px; }
.local-coordinator h3 { font-size: 30px; font-weight: 500; line-height: 1.2; margin-bottom: 0; }
.local-coordinator .eyebrow { margin-bottom: 16px; }
@media(max-width:760px) { .local-coordinator { grid-template-columns: 1fr; gap: 24px; padding: 26px; } }
.packaging-detail > p:not(.eyebrow) { max-width: 800px; }
.packaging-detail ul { padding-left: 22px; line-height: 1.9; }
.placeholder, .upload { border-radius: 10px; }
.service-scope { margin-top: 28px; padding: 28px 30px; border: 1px solid var(--line); background: #eee9df; border-radius: 10px; }
.service-scope .eyebrow { margin-bottom: 12px; }
.service-scope > p:not(.eyebrow) { max-width: 760px; margin: 0; color: var(--muted); line-height: 1.7; }
.service-scope > div { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 20px; }
.service-scope > div span { border: 1px solid #c5bba9; padding: 7px 10px; font-size: 10px; letter-spacing: 1px; color: #6b6456; }
input:not([type=checkbox]):not([type=file]), textarea { border-radius: 6px; }
@media(max-width:1050px) { .hero { gap: 28px; } .hero-panel { height: 510px; } .beauty-card > div { padding: 24px; } }
@media(max-width:760px) { .hero { grid-template-columns: 1fr; padding-top: 40px; gap: 30px; } .hero-panel { height: auto; aspect-ratio: 4 / 3; border-radius: 12px; } .hero h1 { font-size: clamp(39px, 11.4vw, 48px); } .hero .lead { font-size: 16px; } .beauty-stories { grid-template-columns: 1fr; gap: 24px; margin-top: 38px; } .beauty-card h3 { font-size: 28px; } .service-image { height: auto; aspect-ratio: 4 / 3; } .hero-actions { gap: 10px; } .hero-actions .button { font-size: 13px; gap: 14px; } }
@media(prefers-reduced-motion:reduce) { .beauty-card img { transition: none; } }