/* Editorial rhythm: generous section spacing, open Chinese type, readable copy. */
:root{--gutter:6vw;--section-space:clamp(112px,8.5vw,152px)}
.skip-link{clip-path:inset(50%)}
.skip-link:focus{clip-path:none}

.hero{height:auto;min-height:max(800px,calc(100svh - 90px));max-height:none}
.hero-content{padding:clamp(88px,10vh,120px) 0 156px var(--gutter);max-width:1040px}
.hero h1{font-size:clamp(64px,6.1vw,104px);font-weight:750;line-height:1.38;letter-spacing:.018em;margin:38px 0 44px}
.hero-eyebrow{letter-spacing:.2em;line-height:1.8}
.hero-copy{font-size:16px;line-height:2.2;letter-spacing:.05em;max-width:38em}
.hero .button{margin-top:40px;min-height:58px;padding:17px 28px;letter-spacing:.06em}
.hero-bottom{bottom:32px;padding-top:25px;line-height:2;letter-spacing:.13em}
.fresh-ribbon{height:80px;gap:44px;letter-spacing:.1em}

main h2{line-height:1.4;letter-spacing:.02em;font-weight:700}
.signature,.stores{padding-top:var(--section-space);padding-bottom:var(--section-space)}
.section-topline{padding-bottom:28px;gap:28px}
.signature-heading{margin:54px 0 72px;gap:64px}
.signature-heading>p{font-size:14px;line-height:2.2;letter-spacing:.04em}
.signature-layout{gap:10%}
.product-notes h3{font-size:35px;line-height:1.5;letter-spacing:.025em;margin:28px 0 30px}
.product-description{font-size:15px;line-height:2.2;letter-spacing:.035em;max-width:28em}
.ingredient-notes{margin:38px 0 36px}
.ingredient-notes>div{padding:22px 0;gap:28px;line-height:2;letter-spacing:.035em}
.ingredient-notes dd{font-size:13px}
.text-link{padding-bottom:13px;letter-spacing:.05em;line-height:1.8}
.product-note{margin-top:24px;line-height:2}
.product-poster figcaption strong{line-height:1.5;margin:7px 0 12px;letter-spacing:.06em}

.daily{padding:var(--section-space) 0 56px}
.daily-header{gap:36px 72px}
.daily-header h2{line-height:1.42;letter-spacing:.02em}
.daily-header>p:last-child{font-size:14px;line-height:2.2;letter-spacing:.04em;max-width:30em}
.film-link{margin-top:28px;gap:15px;padding:12px 0;letter-spacing:.04em}
.daily-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.45fr);gap:10%;margin-top:76px;align-items:start}
.process-tab{padding:34px 0;gap:28px}
.process-tab strong{font-size:25px;line-height:1.65;letter-spacing:.08em}
.process-tab small{font-size:10px;line-height:1.8;letter-spacing:.14em;margin-top:14px}
.step-no{margin-top:10px;line-height:1.5}
.process-panel figcaption{left:40px;right:40px;bottom:36px}
.process-panel figcaption>span{line-height:1.8;letter-spacing:.14em}
.process-panel h3{font-size:25px;line-height:1.5;letter-spacing:.035em;margin:18px 0 16px}
.process-panel p{font-size:14px;line-height:2.1;letter-spacing:.035em;max-width:32em}
.campaign-panel figcaption{inset:auto;padding:36px 40px 40px}
.daily-foot{margin-top:64px;gap:36px;line-height:2.1;letter-spacing:.025em}

.care{padding-top:var(--section-space);padding-bottom:var(--section-space);gap:14%}
.care-intro h2{margin:34px 0 36px}
.care-intro>p:last-child{font-size:14px;line-height:2.2;letter-spacing:.035em}
.care-points article{padding:32px 0;gap:32px}
.care-points h3{margin-bottom:14px;line-height:1.6;letter-spacing:.06em}
.care-points p{font-size:13px;line-height:2.1;letter-spacing:.035em}
.story-content{padding:104px 12%}
.story-content h2{line-height:1.45;letter-spacing:.025em;margin:40px 0}
.story-content>p:not(.eyebrow){font-size:14px;line-height:2.3;letter-spacing:.035em;margin-top:28px;max-width:29em}
.story-content>p.story-lead{font-size:18px;line-height:2.1;letter-spacing:.025em}
.story-signoff{margin-top:48px;padding-top:32px;gap:28px;line-height:2}

.stores-heading{margin:52px 0;gap:40px}
.store-row{padding:36px 0;gap:24px}
.store-row h3{line-height:1.6;letter-spacing:.025em}
.store-row p{font-size:12px;line-height:2;letter-spacing:.035em;margin-top:13px}
.store-disclaimer{margin-top:28px;line-height:2}
.partnership{padding:96px var(--gutter);gap:56px}
.partnership .eyebrow{margin-bottom:30px;line-height:1.8}
.partnership h2{line-height:1.45;letter-spacing:.025em}
.partnership-action p{line-height:2;margin-bottom:26px}
.footer{padding:72px var(--gutter) 32px}
.footer-top{gap:40px;padding-bottom:44px}
.footer-top>p,.footer-bottom{line-height:2}
.footer-bottom{padding-top:30px}

@media(min-width:1800px){:root{--gutter:calc((100vw - 1560px)/2)}}

@media(min-width:761px) and (max-width:1050px){
  .hero h1{font-size:68px}
  .hero-content{padding-right:var(--gutter)}
  .signature-layout{gap:7%}
  .product-notes h3{font-size:30px}
  .product-description{font-size:14px}
  .ingredient-notes>div{gap:16px}
  .daily-layout{grid-template-columns:1fr;gap:48px;margin-top:64px}
  .process-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
  .process-tab{gap:20px;padding:28px 0}
  .process-tab strong{font-size:22px}
  .process-tab small{font-size:9px}
  .care{gap:9%}
  .story-content{padding:76px 9%}
  .story-content>p:not(.eyebrow){font-size:13px}
  .story-content>p.story-lead{font-size:16px}
  .story-signoff{flex-wrap:wrap}
  .store-row{grid-template-columns:30px 1fr 145px 45px;gap:16px}
  .partnership{gap:36px}
  .partnership-action p{max-width:22em}
}

@media(max-width:760px){
  :root{--gutter:28px;--section-space:84px}
  main h2{font-size:36px;line-height:1.46;letter-spacing:.018em}
  .hero{min-height:860px}
  .hero-content{padding:64px var(--gutter) 320px;max-width:none}
  .hero h1{font-size:clamp(42px,10.4vw,68px);line-height:1.42;letter-spacing:.018em;margin:34px 0 38px}
  .hero-eyebrow{font-size:9px;letter-spacing:.15em;gap:12px}
  .hero-copy{font-size:14px;line-height:2.15;letter-spacing:.025em;max-width:30em}
  .hero .button{margin-top:32px;padding:15px 21px;min-height:54px;font-size:12px;gap:30px}
  .hero-bottom{left:var(--gutter);right:var(--gutter);bottom:26px;padding-top:22px;font-size:9px}
  .fresh-stamp{right:28px;bottom:120px}
  .fresh-ribbon{height:64px;font-size:15px;gap:32px;padding:0 var(--gutter)}
  .section-topline{padding-bottom:22px;gap:18px}
  .signature-heading{margin:36px 0 44px}
  .signature-heading>p{font-size:13px;line-height:2.1;margin-top:28px}
  .signature-layout{gap:48px}
  .product-notes h3{font-size:29px;line-height:1.5;margin:25px 0}
  .product-description{font-size:14px;line-height:2.2;max-width:30em}
  .ingredient-notes{margin:30px 0}
  .ingredient-notes>div{padding:20px 0;gap:18px}
  .ingredient-notes dd{font-size:12px}
  .product-poster figcaption strong{margin:5px 0 9px;line-height:1.4}
  .daily{padding-bottom:40px}
  .daily-header h2{font-size:36px;line-height:1.46;margin:30px 0}
  .daily-header>p:last-child{font-size:13px;line-height:2.15;text-align:left}
  .film-link{margin-top:23px;padding:12px 0}
  .daily-layout{gap:36px;margin-top:40px}
  .process-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
  .process-tab{display:flex;align-items:center;gap:12px;padding:22px 0;min-height:74px}
  .step-no{font-size:10px;align-self:center;margin:0;line-height:1.5}
  .process-tab strong{font-size:15px;line-height:1.6;letter-spacing:.07em;white-space:nowrap}
  .process-tab small,.step-arrow{display:none}
  .process-panel figcaption{left:24px;right:24px;bottom:28px}
  .campaign-panel figcaption{inset:auto;padding:28px 24px 32px}
  .process-panel h3{font-size:22px;line-height:1.55;margin:17px 0 14px;max-width:none}
  .process-panel p{font-size:13px;line-height:2.1;max-width:none}
  .process-panel figcaption>span{font-size:9px;letter-spacing:.09em}
  .daily-foot{margin-top:38px;line-height:2.1}
  .daily-foot p{font-size:10px;margin-top:14px}
  .care{gap:44px}
  .care-intro h2{margin:28px 0 30px}
  .care-intro>p:last-child{font-size:13px;line-height:2.2}
  .care-points article{padding:28px 0;gap:24px}
  .care-points p{font-size:13px}
  .story-content{padding:64px var(--gutter) 68px}
  .story-content h2{font-size:35px;line-height:1.5;margin:32px 0}
  .story-content>p:not(.eyebrow){font-size:14px;line-height:2.25;margin-top:26px;max-width:30em}
  .story-content>p.story-lead{font-size:16px;line-height:2.15}
  .story-signoff{margin-top:38px;padding-top:28px;gap:16px;flex-wrap:wrap}
  .stores-heading{flex-direction:column;align-items:start;gap:32px;margin:38px 0}
  .stores-heading h2{font-size:36px}
  .stores-heading>div{width:100%;max-width:260px;gap:12px}
  .store-row{grid-template-columns:20px minmax(0,1fr) 38px;gap:12px;padding:29px 0}
  .store-row h3{font-size:17px;line-height:1.7}
  .store-row p{font-size:11px;line-height:2;margin-top:10px}
  .store-disclaimer{margin-top:24px;line-height:2.1}
  .partnership{padding:68px var(--gutter) 72px}
  .partnership h2{font-size:34px;line-height:1.5}
  .partnership .eyebrow{margin-bottom:28px}
  .partnership-action{margin-top:38px}
  .partnership-action p{margin-bottom:24px}
  .footer{padding:52px var(--gutter) 28px}
  .footer-top{gap:30px 16px;padding-bottom:34px}
  .footer-bottom{padding-top:25px}
}

@media(max-width:360px){
  :root{--gutter:22px}
  .hero h1{font-size:39px}
  main h2,.daily-header h2,.stores-heading h2{font-size:32px}
  .process-tabs{column-gap:18px}
  .process-tab{gap:10px}
  .process-tab strong{font-size:14px}
  .campaign-panel figcaption{padding:26px 20px 30px}
  .process-panel h3{font-size:20px}
  .story-content h2{font-size:32px}
  .store-row h3{font-size:15px}
  .partnership h2{font-size:31px}
}
