:root{--green:#091c12;--deep:#06130c;--gold:#e9bd70;--gold2:#bd8947;--cream:#f3e7ca;--muted:#bdc6b5;--line:rgba(233,189,112,.24);color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--green);color:var(--cream);font:17px/1.65 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input,select{font:inherit}button{cursor:pointer}h1,h2,h3,h4{font-family:Georgia,serif;font-weight:400;line-height:1.1;margin:0 0 25px;letter-spacing:-.035em}h2{font-size:clamp(2.7rem,5vw,5rem)}h3{font-size:1.7rem}p{margin:0 0 1.2em}em{color:var(--gold);font-weight:400}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:5px}[hidden]{display:none!important}.skip{position:fixed;top:-90px;left:10px;z-index:100;background:var(--gold);color:var(--green);padding:10px}.skip:focus{top:10px}header{height:94px;padding:0 4.5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:#091c12fa;position:sticky;top:0;z-index:20}.wordmark{font:bold 1.2rem/1.2 Georgia,serif;letter-spacing:.03em;flex-shrink:0}.wordmark span{color:var(--gold)}.wordmark small{display:block;font:400 .65rem Arial,sans-serif;letter-spacing:.27em;text-align:center;padding-top:6px;color:var(--muted)}nav{display:flex;align-items:center;gap:30px;font-size:.88rem}nav a{padding:9px 0;border-bottom:1px solid transparent}nav a:hover{color:var(--gold);border-bottom-color:var(--gold)}.nav-cta{border:1px solid var(--gold2);padding:11px 18px;color:var(--gold)}#menu-button{display:none}.hero{max-width:1600px;margin:auto;min-height:695px;position:relative;display:grid;grid-template-columns:1fr 1.12fr;align-items:center;padding:70px 4.5% 85px;overflow:hidden}.hero h1{font-size:clamp(3.5rem,6.7vw,6.7rem);line-height:1.06;letter-spacing:-.06em;margin-bottom:30px}.hero h1 em{white-space:nowrap}.hero-copy{position:relative;z-index:1}.eyebrow{font-size:.75rem;line-height:1.7;font-weight:600;letter-spacing:.15em;color:var(--gold);text-transform:uppercase;margin-bottom:28px}.intro{max-width:490px;font-size:1.08rem;color:var(--muted)}.hero-art{width:116%;margin-left:-5%}.hero-art img{width:100%;height:auto}.actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:30px}.button{display:inline-flex;min-height:52px;align-items:center;justify-content:center;padding:14px 24px;font-size:.9rem;font-weight:600;line-height:1.45;background:var(--gold);color:#132117;border:1px solid var(--gold);text-align:center;transition:background .2s,transform .2s}.button:hover{background:#f4d497;transform:translateY(-2px)}.text-link{font-size:.9rem;border-bottom:1px solid var(--gold2);padding-bottom:4px}.text-link:hover{color:var(--gold)}.facts{display:flex;gap:32px;margin-top:42px}.facts>div{border-left:1px solid var(--gold2);padding-left:16px}.facts strong{display:block;font:400 1.1rem Georgia,serif}.facts span{font-size:.8rem;color:var(--muted)}.hero-bottom{position:absolute;bottom:0;left:4.5%;right:4.5%;display:flex;align-items:center;justify-content:center;gap:28px;color:var(--gold);font-size:.75rem;letter-spacing:.19em;padding:22px 0 0;border-top:1px solid var(--line);margin:0}.section{padding:85px 6%;max-width:1600px;margin:auto}.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:25px;border-top:1px solid var(--line);padding-top:23px;margin-bottom:40px}.section-head .eyebrow{margin:0}.section-head>span{font-size:.8rem;color:var(--muted)}.split{display:grid;grid-template-columns:1.06fr 1fr;gap:9%;align-items:center;margin-bottom:25px}.split>div>p{color:var(--muted)}.lead{font-size:1.3rem;line-height:1.55;color:var(--cream)!important}.highlight{font:1.3rem/1.5 Georgia,serif;color:var(--gold)!important}.pack-preview{width:100%;background:var(--deep);padding:0;border:1px solid var(--line);text-align:left;overflow:hidden;margin:10px 0 40px}.pack-preview>img{width:100%;height:clamp(230px,31vw,430px);object-fit:cover;object-position:center 28%;transition:transform .5s}.pack-preview:hover>img{transform:scale(1.02)}.pack-preview>span{display:flex;justify-content:space-between;gap:16px;padding:17px 24px;color:var(--muted);font-size:.75rem;letter-spacing:.08em;position:relative;background:var(--deep)}.pack-preview b{font-weight:400;color:var(--gold);letter-spacing:.02em}.three-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.three-cols small{font-size:.8rem;color:var(--gold2);display:block;margin-bottom:18px}.three-cols h3{margin-bottom:15px}.three-cols p{font-size:1rem;color:var(--muted);margin:0}.legend{max-width:none;display:grid;grid-template-columns:.85fr 1fr;gap:10%;background:var(--cream);color:#203124;padding:95px max(6%,calc((100vw - 1408px)/2));border-block:7px double var(--gold2);color-scheme:light}.legend .eyebrow{color:#71511f}.legend em{color:#7d5820}.ornament{display:block;color:#997237;font-size:2.4rem;margin:20px 0}.aside{font:1.2rem/1.6 Georgia,serif;color:#6a654d}.story{font:1.17rem/1.8 Georgia,serif;max-width:680px}.dropcap:first-letter{float:left;font-size:4.8rem;line-height:.8;padding:12px 12px 0 0;color:#775526}.story details{margin-top:24px;border-top:1px solid #b9a982}.story summary{cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;list-style:none;color:#57421e;font: .9rem/1.5 Arial,sans-serif}.story summary::-webkit-details-marker{display:none}.story summary span{font-size:1.6rem;line-height:1}.story details[open] summary span{transform:rotate(45deg)}.story blockquote{font-size:1.65rem;line-height:1.5;color:#75511b;padding-left:24px;border-left:2px solid #9c753a;margin:28px 0}.signature{font:.9rem/1.8 Arial,sans-serif;letter-spacing:.1em;color:#775526;margin:35px 0 0}.customizer{display:grid;grid-template-columns:1fr .86fr;gap:10%;align-items:start}.customizer h2{font-size:clamp(3.2rem,6.3vw,6rem)}.customizer>div>p{max-width:490px;color:var(--muted)}form{margin-top:35px;max-width:450px}label{display:block;font-size:.9rem;margin:24px 0 9px}label>span{font-size:.8rem;color:var(--muted);margin-left:8px}input,select{width:100%;min-height:50px;background:#10271a;color:var(--cream);border:1px solid #64704f;border-radius:0;padding:12px 15px;font-size:1rem}input::placeholder{color:#aeb6a5}input[type=file]{padding:0;min-height:47px;border-style:dashed;font-size:.8rem;line-height:47px}input[type=file]::file-selector-button{height:47px;padding:0 12px;background:#1f3525;border:0;border-right:1px solid #64704f;color:var(--cream);margin-right:10px;cursor:pointer}.file-hint{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:32px;margin-top:4px;font-size:.75rem;color:var(--muted)}.file-hint button{border:0;background:none;text-decoration:underline;color:var(--gold);font-size:.75rem;padding:4px 0}.download{width:100%;margin-top:25px}.download:disabled{opacity:.65;cursor:wait}.status{min-height:2.8em;font-size:.85rem;margin-top:13px;color:var(--muted);line-height:1.5}.status.error{color:#ffbe9b}.poster-stage{position:sticky;top:120px;max-width:490px;width:100%;margin:auto}.poster-label{display:flex;justify-content:space-between;gap:15px;font-size:.75rem;color:var(--gold);margin-bottom:16px}.poster{border:1px solid #c99d53;box-shadow:0 24px 65px #0008;background:#07170e;transform:rotate(1deg);transition:transform .3s}.poster:hover{transform:rotate(0)}#poster-art{width:100%;height:auto}.business-band{padding:15px 20px;display:flex;gap:16px;align-items:center;justify-content:center;min-height:90px;border-top:2px solid var(--gold2)}.business-band>img{max-width:70px;max-height:65px;object-fit:contain}.business-band>div{text-align:center;min-width:0}.business-band small{font-size:.65rem;letter-spacing:.15em;color:var(--gold);display:block;margin-bottom:5px}.business-band strong{font:400 clamp(1.02rem,1.6vw,1.45rem)/1.2 Georgia,serif;color:var(--cream);display:block;overflow-wrap:anywhere}.poster-note{font-size:.8rem;color:var(--muted);text-align:center;margin-top:20px}.distribution{background:#10271a;max-width:none;padding-inline:max(6%,calc((100vw - 1408px)/2))}.distribution h2{font-size:clamp(2.5rem,4.7vw,4.7rem)}.distribution .lead{font-size:1.16rem;color:var(--muted)!important}.offers{margin:35px 0 55px}.offers article{border-top:1px solid var(--gold2);padding-top:22px}.offers h3{font-size:1.5rem}.rollout{display:grid;grid-template-columns:.7fr 1fr;gap:10%;border-top:1px solid var(--line);padding-top:40px}.rollout .eyebrow{font-size:.75rem;margin-bottom:18px}.rollout>div>h3{font-size:2.9rem;line-height:1.2}.rollout p{font-size:.95rem;color:var(--muted)}.rollout ol{list-style:none;margin:0;padding:0;counter-reset:phase}.rollout li{padding:0 0 22px 40px;position:relative;counter-increment:phase}.rollout li:before{content:'0' counter(phase);color:var(--gold2);position:absolute;left:0;top:2px;font-size:.8rem}.rollout h4{font-size:1.4rem;letter-spacing:0;margin-bottom:8px}.rollout li p{margin:0}.recipe{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:35px}.recipe li{border-top:1px solid var(--line);padding-top:25px}.recipe span{font:2.6rem/1 Georgia,serif;color:var(--gold2);display:block;margin-bottom:18px}.recipe h3{font-size:1.55rem}.recipe p{font-size:1rem;color:var(--muted)}.recipe strong{color:var(--cream)}.closing{text-align:center;background:var(--cream);color:var(--green);padding:85px 6%}.closing .eyebrow{color:#85602e;margin-bottom:18px}.closing h2{font-size:clamp(4.5rem,13vw,10rem);margin:0 0 12px}.closing>p:not(.eyebrow){font:1.5rem Georgia,serif}.closing .button{margin-top:20px;background:var(--green);border-color:#9a773c;color:var(--cream)}.closing .button:hover{background:#193822}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:36px 4.5%;font-size:.8rem;color:var(--muted)}footer p{margin:0}footer .wordmark{font-size:1rem}dialog{width:min(1300px,94vw);max-height:92vh;border:1px solid var(--gold);padding:25px;background:var(--green);color:var(--cream)}dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.dialog-top h2{font-size:1.5rem;margin:0;letter-spacing:0}.dialog-top button{border:1px solid var(--gold2);background:transparent;color:var(--cream);padding:10px 15px;font-size:.85rem}dialog img{width:100%}dialog p{font-size:.85rem;margin:15px 0 0;color:var(--muted)}
@media(max-width:1050px){header{height:80px;padding:0 4%}nav{gap:18px}.hero{padding-top:55px;min-height:620px}.hero h1{font-size:5.7vw}.intro{font-size:1rem}.hero-art{width:124%;margin-left:-8%}.facts{margin-top:30px;gap:20px}.actions{gap:18px}.button{padding:13px 18px}.section{padding:65px 5%}.customizer{gap:6%;grid-template-columns:1fr .95fr}.three-cols{gap:25px}.recipe{gap:20px}.poster-stage{top:100px}}
@media(max-width:740px){html{scroll-padding-top:84px}header{height:76px;padding:0 6%}.wordmark{font-size:1.04rem}#menu-button{display:block;color:var(--gold);background:transparent;border:1px solid var(--line);font-size:.85rem;padding:8px 12px}header nav{display:none;position:absolute;top:75px;left:0;right:0;background:var(--green);border-bottom:1px solid var(--gold2);padding:20px 6%;gap:10px;align-items:stretch;flex-direction:column;font-size:1rem}header nav.open{display:flex}header nav a{padding:10px}.hero{display:flex;flex-direction:column;padding:42px 6% 65px;min-height:0}.hero-copy{width:100%}.eyebrow{font-size:.7rem;letter-spacing:.1em;margin-bottom:20px}.hero h1{font-size:clamp(3.1rem,10.2vw,5rem);letter-spacing:-.05em;margin-bottom:22px}.hero h1 em{white-space:normal}.intro{max-width:100%;font-size:1rem}.actions{margin-top:25px;gap:20px}.facts{margin-top:26px;gap:30px}.hero-art{width:112%;margin:12px -6% 0}.hero-bottom{font-size:.65rem;letter-spacing:.08em;gap:12px;left:6%;right:6%;padding-top:16px;bottom:8px;text-align:center}.section{padding:50px 6%}.section-head{margin-bottom:30px;padding-top:18px;gap:15px}.section-head>span{font-size:.75rem;text-align:right;max-width:130px}.section-head .eyebrow{max-width:190px}.split,.legend,.customizer,.rollout{display:block}h2{font-size:3rem;line-height:1.1;letter-spacing:-.045em;margin-bottom:24px}.lead{font-size:1.17rem}.pack-preview{margin-top:12px;margin-bottom:30px}.pack-preview>img{height:220px;object-position:80% 10%}.pack-preview>span{padding:12px;font-size:.65rem;letter-spacing:.02em}.three-cols{display:block}.three-cols article{margin-bottom:28px}.three-cols article:last-child{margin-bottom:0}.three-cols small{margin-bottom:10px}.three-cols h3{font-size:1.5rem;margin-bottom:10px}.legend{padding-block:48px}.ornament{display:none}.aside{font-size:1.03rem;margin-bottom:30px}.story{font-size:1.12rem;line-height:1.8}.story blockquote{font-size:1.4rem}.customizer h2{font-size:3.7rem}.customizer .lead{font-size:1.12rem}form{max-width:none;margin-top:26px}.poster-stage{position:static;margin-top:35px;max-width:440px}.poster{transform:none}.business-band strong{font-size:1.3rem}.distribution h2{font-size:2.65rem;overflow-wrap:normal}.distribution .lead{font-size:1.1rem}.offers{margin:28px 0 35px}.offers article{padding-top:18px}.rollout{padding-top:28px}.rollout>div>h3{font-size:2.65rem}.rollout ol{margin-top:28px}.recipe{grid-template-columns:1fr 1fr;gap:26px 24px}.recipe h3{font-size:1.4rem;line-height:1.2;margin-bottom:13px}.recipe span{font-size:2.2rem;margin-bottom:15px}.closing{padding:60px 6%}.closing .eyebrow{font-size:.65rem}.closing h2{font-size:clamp(4.3rem,16vw,6rem)}.closing>p:not(.eyebrow){font-size:1.1rem}footer{flex-direction:column;text-align:center;gap:16px;padding:30px 6%}dialog{padding:14px}.dialog-top h2{font-size:1.1rem}.dialog-top button{padding:8px 10px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Product shown assembled, with all faces visible on every viewport. */
.pack-preview>img{height:clamp(340px,48vw,650px);object-fit:contain;object-position:center;background:#eee9df}.pack-preview:hover>img{transform:none}#pack-dialog>img{max-height:70vh;object-fit:contain;background:#eee9df}

/* Standalone brand lettering and the three-line closing slogan. */
.legend-brand{width:min(100%,428px);margin:34px 0 0}.legend-brand img{width:100%;height:auto}.legend-brand+.signature{margin-top:22px;font-weight:700;font-size:clamp(1rem,1.65vw,1.2rem);line-height:1.8;letter-spacing:.025em;color:var(--green)}

.name-nuestro{font-weight:700;font-style:italic;color:#775526}

/* Legend copy follows the wordmark’s dark green; its native green/gold gradients remain intact. */
.legend{--legend-ink:#17351d;color:var(--legend-ink)}.legend .eyebrow,.legend em,.legend .ornament,.legend .aside,.legend .dropcap:first-letter,.legend summary,.legend blockquote,.legend .signature,.legend .name-nuestro{color:var(--legend-ink)}

/* Fine serif lettering and restrained green/gold detail across the legend accents. */
.legend .legend-brand+.signature{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(1rem,1.5vw,1.12rem);line-height:2.15;letter-spacing:.08em;margin-top:32px}
.legend .signature span{display:block;width:fit-content;max-width:100%}
.legend h2,.legend .ornament,.legend .dropcap:first-letter,.legend .signature span{font-family:Georgia,"Times New Roman",serif;font-weight:400;color:var(--legend-ink);text-shadow:.45px .65px 0 rgba(189,137,71,.65)}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
.legend h2,.legend .ornament,.legend .dropcap:first-letter,.legend .signature span{background-image:linear-gradient(180deg,#102b19 0%,#2b5835 44%,#102b19 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-stroke:.2px rgba(189,137,71,.7)}
.legend h2 em{color:inherit}
}

/* Clear gold edge on the lighter, spaced closing slogans. */
.legend .signature span{-webkit-text-stroke:.4px #c79a3b;text-shadow:.7px .9px .4px rgba(91,59,15,.55);background-image:linear-gradient(180deg,#071c0d 0%,#315d26 43%,#0b2913 100%)}
.legend .ornament{width:1em;height:1em;line-height:1;background:none;-webkit-text-stroke:0;text-shadow:none}.legend .ornament img{width:100%;height:100%}

/* Brand artwork supplies the heading and initial; their layout keeps the prior scale. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.legend h2.legend-title{background:none;-webkit-text-stroke:0;text-shadow:none;color:var(--legend-ink)}
.legend-title-art{display:block;width:100%;height:2.2em}.legend-title-art img{width:100%;height:100%;object-fit:contain;object-position:left top}
.initial-d{float:left;display:block;font-size:4.8rem;width:.78em;height:.8em;margin:.14em .14em 0 0}.initial-d img{width:100%;height:100%;object-fit:contain}

/* Keep the closing slogans at their established scale and line spacing. */
.legend .signature.slogan-relief .slogan-line{display:flex;align-items:center;width:fit-content;max-width:100%;height:2.15em;background:none;-webkit-text-stroke:0;text-shadow:none}
.slogan-line img{display:block;height:1.15em;width:auto;max-width:100%}

/* A single brand treatment for every textual El nuestro occurrence. */
.our-brand{display:inline-block;max-width:100%;vertical-align:baseline;line-height:1;background:none!important;-webkit-text-stroke:0;text-shadow:none}
.our-brand>img{display:inline-block;width:auto;height:.9em;max-width:100%;vertical-align:-.07em;object-fit:contain}
.wordmark small{font-size:.875rem;letter-spacing:0}.wordmark small .our-brand>img{height:1em}


.litres-brand{display:inline-block;width:min(100%,500px);height:auto;vertical-align:middle}.ritual-glass{height:180px;width:125px;object-fit:contain;object-position:center;margin:18px 0 24px}@media(max-width:600px){.ritual-glass{height:150px;width:105px}}

/* Warm brand gold: parchment highlights with brown edges. */
:root{--brand-gold:linear-gradient(165deg,#b78036 0%,#e7b85c 18%,#ffe3a0 38%,#ebbc65 56%,#c38b40 78%,#966029 100%);--gold:#e8b960;--gold2:#bc8438}
.button:not(.closing .button){background:radial-gradient(ellipse at 48% 38%,#ffe4a2 0%,#e7b75d 45%,#bd8136 80%,#8b5726 100%);border-color:#b47c32;box-shadow:inset 0 1px 2px #fff0b988,inset 0 -2px 4px #663b2370;color:#182b18}
.button:not(.closing .button):hover{background:radial-gradient(ellipse at 48% 38%,#ffebbb 0%,#efc477 45%,#c88e42 80%,#99632c 100%)}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
body em:not(.legend em),.wordmark>span,.eyebrow:not(.legend .eyebrow):not(.closing .eyebrow),.nav-cta,.hero-bottom,.highlight,.pack-preview b,.three-cols small,.file-hint button,.poster-label,.business-band small,.rollout li::before,.recipe span,#menu-button,nav a:hover,.text-link:hover{background-image:var(--brand-gold);background-clip:text;-webkit-background-clip:text;color:transparent!important}
}

/* The same finish on decorative rules and numbered accents. */
.facts>div,.offers article,.business-band,.recipe li,.section-head,.hero-bottom,.rollout{border-image:var(--brand-gold) 1}.poster{border-color:#be8842}.nav-cta{border-image:var(--brand-gold) 1}

.brand-period{display:inline-block;color:#315d26!important;background-image:linear-gradient(180deg,#0b2913 0%,#426b32 43%,#102b19 100%)!important;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:.55px #c79a3b;text-shadow:.7px .9px .4px rgba(91,59,15,.55)}

.hero h1>em{font-size:.82em;letter-spacing:-.025em}

.litres-gold{background-image:var(--brand-gold);background-clip:text;-webkit-background-clip:text;color:transparent;display:inline-block}

.conversation-brand{display:inline-block;background-image:linear-gradient(180deg,#143c22 0%,#57834a 40%,#315d26 55%,#102b19 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-stroke:.6px #c79a3b;text-shadow:.7px .9px .4px rgba(91,59,15,.55)}

.brand-period{width:.16em;height:.16em;margin-left:.035em;vertical-align:-.01em;background:none!important;-webkit-text-stroke:0;text-shadow:none;line-height:0}.brand-period>img{width:100%;height:100%;display:block}

.conversation-brand{background-image:var(--brand-gold);-webkit-text-stroke:0;text-shadow:none}

/* Match the packaging presentation to the legend cream surface. */
.pack-preview{background:var(--cream);isolation:isolate}
.pack-preview>img{background:transparent;mix-blend-mode:multiply}
#pack-dialog{background:var(--cream);color:var(--green);isolation:isolate}
#pack-dialog>img{background:transparent;mix-blend-mode:multiply}

/* One continuous original studio backdrop, including the caption. */
.pack-preview{position:relative;background:#e8e1d7;border:0;isolation:auto}
.pack-preview>img{height:auto;object-fit:contain;mix-blend-mode:normal;background:none}
.pack-preview:hover>img{transform:none}
.pack-preview>span{position:absolute;inset:auto 0 0;background:transparent;color:#203124;padding:18px 24px}
.pack-preview b{background:none!important;background-clip:initial!important;-webkit-background-clip:initial!important;color:#624b25!important}
#pack-dialog{padding:0;background:#e8e1d7;isolation:auto}
#pack-dialog>img{mix-blend-mode:normal;background:none}
#pack-dialog .dialog-top{margin:0;padding:18px 24px}
#pack-dialog>p{margin:0;padding:18px 24px;color:#203124}
#pack-dialog .dialog-top button{color:#203124}
@media(max-width:740px){.pack-preview>span{padding:10px 12px;font-size:.7rem}}

/* Keep the approved phone layout; fit the complete box on larger screens. */
@media(min-width:741px){
  .pack-preview{display:block;width:min(100%,620px,60vh);width:min(100%,620px,60svh);margin:10px auto 40px}
  .pack-preview>img{width:100%;height:auto}
  #pack-dialog{width:min(94vw,760px)}
  #pack-dialog>img{width:auto;max-width:100%;max-height:65vh;max-height:65svh;margin-inline:auto;object-fit:contain}
}


/* Shared lettering: the existing placement and heading sizes stay intact. */
.brand-raster{display:block;max-width:100%;overflow:hidden}
.our-brand>.brand-raster{display:inline-block;width:4.405714em;height:.9em;max-width:100%;vertical-align:-.07em}
.wordmark small .our-brand>.brand-raster{width:4.895238em;height:1em}
.legend-title-art>.brand-raster{width:100%;height:100%}
.initial-d>.brand-raster{width:100%;height:100%}
.legend-brand>.brand-raster{width:100%;height:auto;aspect-ratio:2160/375}
.brand-period>.brand-raster{width:100%;height:100%}

/* Every slogan uses the same cap height and 0.28-cap word spacing.
   The long line receives its natural width; it is never independently shrunk. */
.brand-slogan{display:inline-block;flex:none;width:calc(var(--slogan-width)*var(--slogan-cap,1em));height:calc(var(--slogan-height)*var(--slogan-cap,1em));max-width:none;overflow:hidden;vertical-align:middle}
.legend .story{container-type:inline-size}
.legend .signature.slogan-relief{--slogan-cap:min(27.6px,6.1cqw)}
.legend .signature.slogan-relief .slogan-line{max-width:none;height:auto;min-height:calc(var(--slogan-cap)*1.9)}
.hero-bottom{--slogan-cap:.74em}
.closing-slogans{--slogan-cap:7.08cqw;container-type:inline-size;width:min(100%,1000px);margin:12px auto 24px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(12px,2vw,26px)}
.closing-slogans .brand-slogan-1{--slogan-cap:8.1052cqw}
.closing-slogans .brand-slogan-2{--slogan-cap:6.6552cqw}
.closing-slogans .brand-slogan-3{--slogan-cap:5.664cqw}
.closing .button{margin-top:44px}
@media(max-width:740px){.hero-bottom{column-gap:10px;row-gap:0;flex-wrap:wrap}}

/* Natural lettering width avoids invisible space before decorative periods. */
.our-brand>.brand-raster.brand-air{width:calc(var(--brand-ratio)*.9em);height:.9em}
.wordmark small .our-brand>.brand-raster.brand-air{width:calc(var(--brand-ratio)*1em);height:1em}
.legend-title-art>.brand-raster.title-air{width:100%;height:100%}

/* Parchment appears only with the expanded legend. */
.legend-map{margin:32px 0 0;width:100%}.legend-map img{width:100%;height:auto;display:block;filter:contrast(1.22) saturate(.92) drop-shadow(0 8px 9px rgba(67,40,15,.22))}.legend-map[hidden]{display:none!important}
@media(max-width:800px){.legend-map{width:min(100%,360px);margin:28px auto 0}}

/* Preserve the dark introduction while the expanded story and map stay cream. */
.legend{grid-template-columns:1fr 1fr;gap:0;padding:0;background:var(--cream)}
.legend>div:first-child{padding:0;background:var(--cream)}
.legend .legend-intro{padding:95px 12%;background:var(--green);color:#fff;color-scheme:dark}
.legend .legend-intro .eyebrow,.legend .legend-intro .aside,.legend .legend-intro .name-nuestro{color:#fff}
.legend>.story{padding:95px 12%;background:var(--cream)}
.legend:not(:has(details[open]))>div:first-child{background:var(--green)}
.legend .legend-map{width:76%;margin:32px auto}
@media(max-width:740px){.legend .legend-intro,.legend>.story{padding:48px 6%}.legend .legend-intro .aside{margin-bottom:0}.legend .legend-map{width:min(88%,360px)}}

/* Balance the upper-left dark panel with a lower-right closing panel. */
.legend .legend-closing{margin:36px -15.7894737% -95px;padding:36px 15.7894737% 95px;background:var(--green);color:#fff;color-scheme:dark}
.legend .legend-closing>p:first-child,.legend .legend-closing>p:first-child .name-nuestro{color:#fff}
.legend .legend-map{background:var(--cream)}
@media(max-width:740px){.legend .legend-closing{margin:30px -6.8181818% -48px;padding:30px 6.8181818% 48px}}

/* Expanded map column stays beige all the way to the section bottom. */
.legend:has(details[open])>div:first-child{background:var(--cream);align-self:stretch}
.legend:has(details[open]) .legend-intro{padding-bottom:32px}
.legend:has(details[open]) .legend-map{box-sizing:border-box;width:100%;margin:0;padding:32px 12% 48px;background:var(--cream)}
@media(max-width:740px){.legend:has(details[open]) .legend-intro{padding-bottom:24px}.legend:has(details[open]) .legend-map{width:100%;max-width:none;margin:0;padding:24px 6% 48px}.legend:has(details[open]) .legend-map img{max-width:360px;margin:auto}}

/* Closing green panel reaches the right edge without a cream strip. */
.legend>.story{--story-pad:6vw;padding-inline:var(--story-pad)}
.legend .legend-closing{margin-inline:calc(-1 * var(--story-pad));padding-inline:var(--story-pad)}
@media(max-width:740px){.legend>.story{--story-pad:6vw}}

/* Fill the stretched story column below the closing panel. */
.legend>.story{max-width:none;min-width:0;overflow:hidden}
.legend .legend-closing{box-shadow:0 100vmax 0 100vmax var(--green)}
.legend .legend-closing .signature.slogan-relief{--slogan-cap:min(27.6px,5.5cqw)}

/* Small tracking increase for native decorative text, including capacity. */
.facts strong,.pack-preview b,.hero h1 em,.closing h2,.wordmark>span{letter-spacing:.035em}

.facts strong,.pack-preview b,.hero h1 em,.closing h2,.wordmark>span{letter-spacing:.055em}

/* Keep the opening tagline and its period clear of the hero logo. */
.hero h1>em{font-size:.74em}

.closing{background:var(--green);color:#fff}.closing .eyebrow{color:#fff}

/* Match the established green of the February 2027 distribution panel. */
.legend,.closing{--legend-panel-green:#10271a}
.legend .legend-intro,.legend .legend-closing,.legend:not(:has(details[open]))>div:first-child,.closing{background:var(--legend-panel-green)}
.legend .legend-closing{box-shadow:0 100vmax 0 100vmax var(--legend-panel-green)}
.closing .button{border:2px solid transparent;border-image:var(--brand-gold) 1}

@media(max-width:1100px){.facts strong,.pack-preview b,.hero h1 em,.closing h2,.wordmark>span{letter-spacing:.075em}}

@media(max-width:740px){.closing{padding-inline:2%}.closing-slogans{width:100%;gap:22px}.closing-slogans .brand-slogan{display:block;width:100%;max-width:100%;height:auto}.closing-slogans .brand-slogan-3{display:block}}

@media(max-width:740px){.legend .legend-closing{padding-inline:2vw}.legend .legend-closing .legend-brand{width:100%;max-width:none}.legend .legend-closing .signature.slogan-relief{width:100%}.legend .legend-closing .signature.slogan-relief .slogan-line{width:100%;max-width:100%;min-height:0;margin-block:18px}.legend .legend-closing .signature.slogan-relief .brand-slogan{width:100%;max-width:100%;height:auto}}

/* Moderate the phone-only enlargement while preserving tracking. */
@media(max-width:740px){.closing-slogans .brand-slogan{width:85%}.legend .legend-closing .signature.slogan-relief .brand-slogan{width:85%}.legend .legend-closing .signature.slogan-relief .slogan-line{justify-content:center}.legend .legend-closing .legend-brand{width:85%;margin-inline:auto}}

@media(max-width:740px){.closing-slogans .brand-slogan-1,.legend .legend-closing .signature.slogan-relief .brand-slogan-1{width:45%}.closing-slogans .brand-slogan-2,.legend .legend-closing .signature.slogan-relief .brand-slogan-2{width:55%}.closing-slogans .brand-slogan-3,.legend .legend-closing .signature.slogan-relief .brand-slogan-3{width:100%}.closing-slogans{align-items:center}.legend .legend-closing .signature.slogan-relief .slogan-line{justify-content:center;margin-inline:auto}}

@media(max-width:740px){.closing-slogans .brand-slogan-1{width:60%}}

@media(max-width:740px){.legend .legend-closing .signature.slogan-relief .brand-slogan-1{width:100%}}

@media(max-width:740px){.legend .legend-closing-phrase{font-size:1.22rem;line-height:1.6;text-align:center}.legend-closing-phrase>span{display:block;white-space:nowrap}}

@media(max-width:740px){.legend .legend-intro .aside{font-size:1.18rem;line-height:1.65}}

@media(min-width:741px) and (max-width:1100px){.legend .legend-intro .aside{font-size:1.18rem;line-height:1.65}.legend .legend-closing-phrase{font-size:1.22rem;line-height:1.6}}

@media(max-width:740px){.legend .legend-closing .legend-brand{width:92%}.legend .legend-closing .signature.slogan-relief .brand-slogan-1{width:65%}}

@media(max-width:740px){.closing-slogans .brand-slogan-3{width:calc(100% - 12px);transform:translateX(4px)}}

/* Match the product artwork edge so the expanded view has one continuous beige background. */
.pack-preview,#pack-dialog{background:#dcd2c5}
#pack-dialog .dialog-top,#pack-dialog>p,#pack-dialog>img{background:#dcd2c5}

/* Keep the mobile section divider gold without the cream stripe between double borders. */
@media(max-width:740px){.legend{background:var(--legend-panel-green);border-block:1px solid var(--gold2)}}

/* One gold divider at both ends of the legend, across phone, tablet and desktop. */
.legend{border-block:1px solid var(--gold2);background:var(--legend-panel-green)}
