/* Calm composition: one photograph, readable type, consistent alignment. */
.home-page{--paper:#f5f1e8;--ink:#49342e;--pink:#7d1f23;--soft-ink:#716255;--line:#d8cec1;--mei-wine:#7d1f23}
.home-page .editorial-hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);max-width:none;min-height:620px;padding:40px max(6%,calc((100vw - 1268px)/2));gap:8%;background:#7d1f23;color:#f5f1e8;align-items:center}
.home-page .editorial-copy{padding:18px 0;min-width:0}
.home-page .editorial-copy .eyebrow{font-size:10px;letter-spacing:.12em;color:#dfcda0;margin-bottom:24px}
.home-page .editorial-copy h1{font-size:clamp(64px,7.1vw,100px);line-height:1.05;letter-spacing:0;color:#f5f1e8;text-wrap:initial}
.home-page .editorial-copy h1 span{color:#f5f1e8}
.home-page .editorial-lede{max-width:370px;font-size:15px;line-height:1.85;margin:25px 0 27px;color:#eee4d8}
.home-page .hero-buy{width:300px;background:#f5f1e8;color:#7d1f23;justify-content:space-between;border:1px solid #f5f1e8}
.home-page .hero-buy:hover{background:#e9ddb9;color:#7d1f23;border-color:#e9ddb9}
.home-page .hero-buy:focus-visible{outline-color:#f5f1e8}
.home-page .hero-price-note,.home-page .hero-price-note strong{font-size:12px;color:#eee4d8;margin:14px 0 0}
.hero-photowork{min-width:0;width:100%;max-width:500px;justify-self:end}
.home-page .editorial-photo{height:540px;min-height:0;margin:0;background:#d8ccbb;transform:none}
.home-page .editorial-photo>img{object-position:center 60%}
.home-page .editorial-photo{outline:1px solid #dfcda04d;outline-offset:7px}
.home-page .editorial-copy .eyebrow::before{content:'';display:inline-block;width:28px;height:1px;margin-right:12px;background:currentColor;vertical-align:middle}
.home-page .shop-feature{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10%;padding-block:88px}
.home-page .feature-image{display:flex;align-items:center;justify-content:center;height:490px;background:#ebe4d6;position:relative}
.home-page .feature-image::before{content:'';position:absolute;width:120px;height:120px;right:30px;bottom:30px;background:var(--pink);mask:url('assets/mei-tea-blossom.webp') center/contain no-repeat;opacity:.055;pointer-events:none}
.home-page .feature-image::after{content:'';position:absolute;inset:18px;border:1px solid #bfa46670;pointer-events:none}
.home-page .feature-image img{position:relative;z-index:1}
.home-page .feature-image img{width:76%;height:76%;margin:0;transform:none;filter:drop-shadow(0 14px 14px #49342e22)}
.home-page .feature-copy .eyebrow{font-size:10px;color:var(--pink);margin-bottom:18px}
.home-page .feature-title h2{font-size:64px;letter-spacing:-.018em;color:var(--pink)}
.home-page .feature-title>span{font-size:20px}
.home-page .feature-copy>.button{max-width:none;margin-top:25px}
.home-page .feature-copy>p:not(.eyebrow){max-width:440px;font-size:14px;line-height:1.9}
.home-page .blend-details{margin-top:25px;border-block:1px solid var(--line)}
.home-page .blend-details summary{display:flex;align-items:center;justify-content:space-between;list-style:none;padding:18px 0;font-size:12px;cursor:pointer;color:var(--pink)}
.blend-details summary::-webkit-details-marker{display:none}
.blend-details[open] summary span{transform:rotate(45deg)}
.home-page .feature-facts{margin:0;padding:6px 0 24px;border:0;gap:20px}
.home-page .taste-line{padding:0 0 20px}
.home-page .taste-line span{font-size:11px;padding-inline:10px}
.home-page .taste-line span:first-child{padding-left:0}
.home-page .daily-ritual{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10%;padding-block:80px;border-top:1px solid var(--line)}
.home-page .cup-copy{grid-column:1;grid-row:1;min-width:0}
.home-page .cup-photo{grid-column:2;grid-row:1;height:510px;overflow:hidden;padding:0;background:#ded5c5}
.home-page .cup-photo img{object-position:center 45%}
.home-page .cup-photo figcaption{display:none}
.home-page .cup-copy .eyebrow{font-size:10px;color:var(--pink)}
.home-page .cup-copy h2{font-size:clamp(40px,4.5vw,60px);letter-spacing:-.018em;color:var(--pink)}
.home-page .cup-switch{background:transparent;border:0;border-bottom:1px solid var(--line);padding:0;gap:24px;margin:24px 0}
.home-page .cup-switch button{flex:0 1 auto;min-height:48px;padding:12px 0;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;box-shadow:none;background:transparent;font-size:13px;text-align:left}
.home-page .cup-switch button[aria-pressed='true']{background:transparent;border-bottom-color:var(--pink);color:var(--pink)}
.home-page .cup-instructions{min-height:160px}
.home-page .order-explainer{max-width:none;padding:52px max(6%,calc((100vw - 1268px)/2));gap:6%;background:#eae2d2;color:var(--ink)}
.home-page .explainer-intro h2{font-size:36px;line-height:1.12;letter-spacing:-.018em;color:var(--pink)}
.home-page .order-explainer .eyebrow,.home-page .order-explainer li>span{color:var(--pink)}
.home-page .order-explainer li{border-color:#cbbda7}
.home-page .order-explainer h3{font-size:14px}
.home-page .order-explainer li p{font-size:12px;line-height:1.8;color:var(--soft-ink)}
.home-page .explainer-intro a{font-size:12px;border-color:#b8a082}
.home-page .journal-section{padding-block:80px}
.home-page .journal-heading{align-items:end;margin-bottom:28px}
.home-page .journal-heading h2{font-size:50px;letter-spacing:-.018em;line-height:1.06;color:var(--pink)}
.home-page .journal-heading h2 br{display:none}
.home-page .journal-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.home-page .journal-grid>a{margin:0}
.home-page .journal-grid img{aspect-ratio:4/5;object-fit:cover}
.home-page .journal-grid>a:first-child img{object-position:center bottom}
.home-page .journal-grid>a>span{gap:12px;align-items:center;padding-block:15px;font-size:12px}
.journal-caption{display:block;line-height:1.7}
.journal-caption small{display:block;font-size:9px;letter-spacing:.1em;color:var(--soft-ink);margin-bottom:5px}
.home-page .journal-grid b{font-size:18px}
@media(min-width:751px) and (max-width:1100px){
 .home-page .editorial-hero{padding:36px 5%;gap:7%;min-height:540px}
 .home-page .editorial-copy h1{font-size:clamp(55px,7.2vw,78px)}
 .home-page .editorial-photo{height:480px}
 .home-page .shop-feature,.home-page .daily-ritual{gap:7%;padding-block:64px}
 .home-page .feature-image,.home-page .cup-photo{height:450px}
 .home-page .feature-title h2{font-size:48px}
 .home-page .feature-title small{font-size:18px;margin-left:4px}
 .home-page .feature-title>span{font-size:17px}
 .home-page .cup-copy h2{font-size:42px}
 .home-page .journal-grid{gap:18px}
}
@media(max-width:750px){
 .home-page .editorial-hero{grid-template-columns:1fr;min-height:0;padding:26px 6% 30px;gap:24px}
 .home-page .editorial-copy{display:block;padding:0}
 .home-page .editorial-copy .eyebrow{font-size:9px;margin-bottom:16px}
 .home-page .editorial-copy h1{font-size:clamp(50px,14vw,82px);line-height:1.03;letter-spacing:0;margin:0}
 .home-page .editorial-lede{font-size:13px;line-height:1.75;max-width:360px;margin:16px 0 20px}
 .home-page .hero-buy{width:100%;max-width:none;min-height:50px}
 .home-page .hero-price-note{font-size:11px;margin-top:12px}
 .home-page .editorial-photo{height:clamp(260px,80vw,330px);margin:0;min-height:0}
 .home-page .editorial-photo>img{object-position:center 65%}
 .home-page .shop-feature{grid-template-columns:1fr;gap:28px;padding-block:48px}
 .home-page .feature-image{height:360px}
 .home-page .feature-title h2{font-size:50px}
 .home-page .feature-title small{font-size:20px}
 .home-page .feature-title>span{font-size:18px}
 .home-page .feature-copy .eyebrow{margin-bottom:14px}
 .home-page .feature-copy>p:not(.eyebrow){font-size:13px}
 .home-page .feature-facts dd{font-size:13px}
 .home-page .daily-ritual{grid-template-columns:1fr;gap:30px;padding-block:48px}
 .home-page .cup-copy{grid-column:1;grid-row:1}
 .home-page .cup-photo{grid-column:1;grid-row:2;height:390px}
 .home-page .cup-copy h2{font-size:45px}
 .home-page .cup-instructions{min-height:0}
 .home-page .order-explainer{padding-block:36px;gap:26px}
 .home-page .explainer-intro h2{font-size:32px}
 .home-page .order-explainer ol{gap:20px}
 .home-page .journal-section{padding-block:48px}
 .home-page .journal-heading{align-items:start;margin-bottom:20px;gap:18px}
 .home-page .journal-heading h2{font-size:36px}
 .home-page .journal-heading>a{max-width:115px;line-height:1.7;font-size:11px}
 .home-page .journal-grid>a{flex-basis:83%}
 .home-page .journal-grid img{aspect-ratio:4/5}
}
@media(max-width:360px){
 .home-page .editorial-copy h1{font-size:46px}
 .home-page .feature-image{height:310px}
 .home-page .feature-title h2{font-size:44px}
 .home-page .feature-title>span{font-size:16px}
 .home-page .cup-photo{height:330px}
}

/* The purchase action carries the price; exploration remains secondary. */
.home-page .hero-shopping{display:flex;align-items:center;flex-wrap:wrap;gap:18px 24px}
.home-page .hero-buy{font-size:13px;white-space:nowrap;min-height:56px}
.hero-buy-price{display:inline-flex;align-items:center;gap:20px;font-variant-numeric:tabular-nums;font-size:12px}
.hero-buy-price b{font-size:15px;font-weight:400;transition:transform 280ms ease}
.home-page .hero-buy:hover>.hero-buy-price{transform:none}
.home-page .hero-buy:hover .hero-buy-price b{transform:translate(3px,-2px)}
.hero-discover{display:inline-flex;align-items:center;gap:14px;color:#f5f1e8;min-height:44px;font-size:12px;border-bottom:1px solid #ddcdb688}
.hero-discover span{transition:transform 280ms ease}
.hero-discover:hover span{transform:translateY(3px)}
.hero-discover:focus-visible{outline-color:#f5f1e8}
@media(min-width:751px) and (max-width:1100px){
 .home-page .hero-shopping{gap:10px 20px}
 .home-page .hero-buy{width:100%;max-width:310px}
 .home-page .editorial-copy .eyebrow{font-size:9px}
 .home-page .editorial-lede{font-size:14px}
}
@media(max-width:750px){
 .hero-photowork{max-width:none}
 .home-page .hero-shopping{gap:8px;display:grid;grid-template-columns:1fr}
 .home-page .hero-shopping .hero-buy{max-width:none;width:100%;min-height:52px;font-size:14px}
 .home-page .hero-discover{justify-self:start;border-bottom:0;min-height:44px;font-size:12px}
 .home-page .hero-price-note{margin-top:4px;font-size:11px;color:#dfcda0}
}
@media(min-width:501px) and (max-width:750px) and (min-height:741px){
 .hero-photowork{max-width:480px;justify-self:center}
 .home-page .editorial-photo{height:540px}
}
@media(max-width:750px) and (max-height:740px){
 .home-page .editorial-copy h1{font-size:clamp(46px,13vw,60px)}
 .home-page .editorial-hero{padding-top:22px;gap:20px}
 .home-page .editorial-photo{height:230px}
}
