:root {
  --paper: #f4f1e9;
  --paper-2: #ebe6d9;
  --ink: #18251d;
  --muted: #667168;
  --green: #1f5a38;
  --green-deep: #103623;
  --lime: #b8dd69;
  --line: rgba(24, 37, 29, .16);
  --page: min(1320px, calc(100vw - 64px));
  --ease: cubic-bezier(.16, 1, .3, 1);
  --hero-glow: rgba(255, 151, 44, .38);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
body.dialog-open { overflow: hidden; }
body.dialog-open::before { position: fixed; z-index: 90; inset: 0; background: rgba(8,24,15,.55); backdrop-filter: blur(12px); content: ""; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { margin-bottom: 0; font-weight: 730; letter-spacing: -.065em; line-height: .91; }
h2 { font-size: clamp(56px, 7.4vw, 112px); }

.skip-link { position: fixed; z-index: 100; top: 10px; left: 12px; padding: 12px 16px; border-radius: 999px; background: #fff; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
:focus-visible { outline: 3px solid #f3ae31; outline-offset: 4px; }

.brand-filter-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.menu-header { --header-x: 50%; --header-y: 50%; --header-light: 0; position: fixed; z-index: 60; isolation: isolate; overflow: hidden; top: 16px; left: 50%; width: var(--page); height: 68px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 6px 8px 6px 18px; border: 1px solid rgba(255,255,255,.65); border-radius: 22px; background: rgba(248,247,242,.7); box-shadow: 0 12px 40px rgba(30,50,35,.08); backdrop-filter: blur(18px) saturate(125%); transform: translateX(-50%); transition: background .35s ease, box-shadow .35s ease; }
.menu-header::before { position: absolute; z-index: 0; inset: 0; border-radius: inherit; background: radial-gradient(240px circle at var(--header-x) var(--header-y), rgba(61,244,255,.16), rgba(255,79,216,.08) 27%, rgba(184,221,105,.12) 42%, transparent 72%); content: ""; opacity: var(--header-light); transition: opacity .3s ease; pointer-events: none; }
.menu-header > * { position: relative; z-index: 1; }
.menu-header.is-scrolled { background: rgba(248,247,242,.92); box-shadow: 0 16px 46px rgba(30,50,35,.13); }
.brand { --brand-rx: 0deg; --brand-ry: 0deg; --brand-x: 0px; --brand-y: 0px; --holo-x: 50%; --holo-y: 50%; position: relative; width: 58px; height: 52px; display: flex; align-items: center; border-radius: 15px; perspective: 650px; }
.brand::before { position: absolute; inset: 0 -7px -5px; border-radius: 50%; background: radial-gradient(ellipse, rgba(61,244,255,.42), rgba(255,79,216,.18) 34%, transparent 72%); filter: blur(5px); content: ""; opacity: 0; transform: scale(.62); transition: opacity .22s ease, transform .45s var(--ease); }
.brand::after { position: absolute; left: 4px; right: 4px; bottom: -5px; height: 38px; background: linear-gradient(to top, rgba(61,244,255,.36), rgba(184,221,105,.12) 42%, transparent 82%); clip-path: polygon(36% 100%, 64% 100%, 88% 0, 12% 0); content: ""; filter: blur(3px); opacity: 0; pointer-events: none; transform: translateY(8px) scaleX(.4); transform-origin: 50% 100%; transition: opacity .22s ease, transform .48s var(--ease); }
.brand-logo { position: relative; z-index: 1; width: 58px; height: 52px; display: block; transform: translate3d(var(--brand-x), var(--brand-y), 0) rotateX(var(--brand-rx)) rotateY(var(--brand-ry)); transform-style: preserve-3d; transition: transform .45s var(--ease); }
.brand-logo::before, .brand-logo::after { position: absolute; z-index: 2; inset: 1px; content: ""; opacity: 0; pointer-events: none; -webkit-mask: url("assets/logo-transparent.png") center / contain no-repeat; mask: url("assets/logo-transparent.png") center / contain no-repeat; transition: opacity .22s ease; }
.brand-logo::before { background: repeating-linear-gradient(to bottom, rgba(233,255,253,.94) 0 1px, rgba(61,244,255,.2) 1px 3px, transparent 3px 6px); background-size: 100% 12px; mix-blend-mode: screen; }
.brand-logo::after { background: radial-gradient(circle at var(--holo-x) var(--holo-y), rgba(255,255,255,.98), rgba(61,244,255,.5) 16%, transparent 34%), conic-gradient(from 120deg, #3df4ff, #b8dd69, #ff4fd8, #3df4ff); filter: blur(.35px); mix-blend-mode: screen; }
.brand img { position: absolute; inset: 0; width: 58px; height: 52px; object-fit: contain; transform-origin: 50% 50%; backface-visibility: hidden; transition: transform .46s var(--ease), opacity .2s ease, filter .2s ease; }
.brand-logo-outline { opacity: 0; filter: grayscale(1) sepia(1) hue-rotate(126deg) saturate(7.5) contrast(1.18) brightness(1.24) drop-shadow(-1.4px 0 0 rgba(255,79,216,.72)) drop-shadow(1.4px 0 0 rgba(61,244,255,.9)) drop-shadow(0 0 7px rgba(61,244,255,.88)) drop-shadow(0 0 15px rgba(255,79,216,.36)); transform: rotateY(-24deg) scale(.88); }
.desktop-nav { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 650; }
.desktop-nav a { position: relative; padding: 11px 12px; border-radius: 999px; transition: color .2s ease, background .25s ease, transform .35s var(--ease), box-shadow .25s ease; }
.desktop-nav a::after { position: absolute; right: 100%; bottom: 6px; left: 0; height: 1px; background: var(--green); content: ""; transition: right .35s var(--ease); }
.desktop-nav a:hover, .desktop-nav a:focus-visible { color: var(--green-deep); background: rgba(31,90,56,.075); box-shadow: inset 0 0 0 1px rgba(31,90,56,.07); transform: translateY(-1px); }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after { right: 0; }
.brand:focus-visible::before { opacity: 1; transform: scale(1.16); }
.brand:focus-visible::after { opacity: .8; transform: translateY(0) scaleX(1); }
.brand:focus-visible .brand-logo-full { opacity: .03; transform: rotateY(78deg) scale(.9); }
.brand:focus-visible .brand-logo-outline { opacity: .9; transform: rotateY(0) scale(1.09); animation: holo-jitter 2.8s steps(1,end) infinite; }
.brand:focus-visible .brand-logo::before { opacity: .82; animation: holo-scan .72s linear infinite; }
.brand:focus-visible .brand-logo::after { opacity: .42; animation: holo-spectrum 2.4s ease-in-out infinite; }
@media (hover: hover) and (pointer: fine) {
  .brand:hover::before { opacity: 1; transform: scale(1.16); }
  .brand:hover::after { opacity: .8; transform: translateY(0) scaleX(1); }
  .brand:hover .brand-logo-full { opacity: .03; transform: rotateY(78deg) scale(.9); }
  .brand:hover .brand-logo-outline { opacity: .9; transform: rotateY(0) scale(1.09); animation: holo-jitter 2.8s steps(1,end) infinite; }
  .brand:hover .brand-logo::before { opacity: .82; animation: holo-scan .72s linear infinite; }
  .brand:hover .brand-logo::after { opacity: .42; animation: holo-spectrum 2.4s ease-in-out infinite; }
}
@keyframes holo-scan { from { background-position: 0 -12px; } to { background-position: 0 12px; } }
@keyframes holo-spectrum { 0%,100% { transform: translate3d(-3%,0,5px) scale(.94); filter: blur(.35px) hue-rotate(0deg); } 50% { transform: translate3d(4%,-2%,8px) scale(1.08); filter: blur(.2px) hue-rotate(34deg); } }
@keyframes holo-jitter { 0%,89%,100% { clip-path: inset(0); } 90% { clip-path: inset(8% 0 62% 0); transform: translateX(1.5px) rotateY(0) scale(1.09); } 92% { clip-path: inset(52% 0 17% 0); transform: translateX(-1px) rotateY(0) scale(1.09); } 94% { clip-path: inset(0); } }
.menu-header > .button { justify-self: end; }
.menu-toggle, .mobile-menu { display: none; }

.button { --mag-x: 0px; --mag-y: 0px; --mag-rx: 0deg; --mag-ry: 0deg; position: relative; isolation: isolate; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 25px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--green) 78%, white); border-radius: 999px; background: linear-gradient(180deg, #337952 0%, var(--green) 55%, #15472c 100%); color: #fff; font-size: 14px; font-weight: 720; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -5px 10px rgba(5,31,17,.22), 0 4px 0 #0f3d25, 0 16px 30px rgba(31,90,56,.18); transform: translate3d(var(--mag-x), var(--mag-y), 0) perspective(600px) rotateX(var(--mag-rx)) rotateY(var(--mag-ry)); transform-style: preserve-3d; transition: transform .45s var(--ease), box-shadow .3s ease, filter .3s ease; }
.button::before { position: absolute; z-index: -1; inset: 1px 8% auto; height: 44%; border-radius: inherit; background: linear-gradient(rgba(255,255,255,.28), transparent); content: ""; }
.button::after { position: absolute; z-index: -1; inset: -80% -30%; background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.32) 50%, transparent 60%); content: ""; transform: translateX(-60%) rotate(10deg); transition: transform .75s var(--ease); }
.button:hover { filter: brightness(1.05) saturate(1.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -4px 9px rgba(5,31,17,.17), 0 5px 0 #0f3d25, 0 21px 40px rgba(31,90,56,.24); }
.button:hover::after { transform: translateX(58%) rotate(10deg); }
.button:active { transform: translateY(3px) scale(.985); box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 0 #0f3d25, 0 8px 18px rgba(31,90,56,.18); }
.button-small { min-width: 160px; min-height: 52px; padding-inline: 20px; }
.button-light { border-color: #fff; background: linear-gradient(#fff, #eae4d8); color: var(--green-deep); box-shadow: inset 0 1px 0 #fff, 0 4px 0 #d6cebf, 0 18px 34px rgba(0,0,0,.18); }
.text-link { min-height: 48px; display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; }
.text-link span { transition: transform .3s var(--ease); }
.text-link:hover span { transform: translate(3px,-3px); }

.eyebrow, .section-index { margin-bottom: 28px; font-size: 10px; font-weight: 760; letter-spacing: .15em; text-transform: uppercase; }
.section-index { color: var(--green); }
.section-index-light { color: rgba(255,255,255,.62); }

.menu-hero { position: relative; min-height: 100svh; display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: 30px; width: var(--page); margin: 0 auto; padding: 135px 0 72px; }
.hero-copy { position: relative; z-index: 4; padding-left: clamp(0px, 3vw, 54px); }
.hero-copy h1 { max-width: 760px; font-size: clamp(68px, 7.4vw, 122px); }
.hero-copy h1 em { color: var(--green); font-family: Georgia, serif; font-weight: 400; }
.hero-intro { max-width: 540px; margin: 34px 0 30px; color: var(--muted); font-size: clamp(17px, 1.4vw, 21px); line-height: 1.5; }
.hero-actions { display: flex; align-items: center; gap: 25px; }
.hero-product-meta { max-width: 510px; display: grid; grid-template-columns: 72px 1fr; gap: 22px; align-items: start; margin-top: 68px; padding-top: 18px; border-top: 1px solid var(--line); }
.hero-product-meta > span { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .09em; }
.hero-product-meta div { min-height: 52px; display: grid; gap: 7px; }
.hero-product-meta strong { font-size: 24px; letter-spacing: -.04em; }
.hero-product-meta small { color: var(--muted); font-size: 13px; line-height: 1.4; }
.reveal { opacity: 0; transform: translateY(28px); animation: reveal-in .9s var(--ease) forwards; }
.reveal:nth-child(2) { animation-delay: .07s; }.reveal:nth-child(3) { animation-delay: .14s; }.reveal:nth-child(4) { animation-delay: .21s; }
@keyframes reveal-in { to { opacity: 1; transform: none; } }

.bottle-universe { --pointer-x: 0deg; --pointer-y: 0deg; position: relative; min-height: min(760px, 75vh); display: grid; place-items: center; perspective: 1300px; transform-style: preserve-3d; }
.universe-halo { position: absolute; width: min(39vw, 590px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 44% 38%, rgba(255,255,255,.94) 0 8%, var(--hero-glow) 36%, rgba(255,255,255,0) 69%); filter: saturate(1.12); transform: translateZ(-120px) rotateX(var(--pointer-x)) rotateY(var(--pointer-y)); transition: background .8s ease, transform .3s ease-out; }
.orbit-line { position: absolute; width: min(43vw, 650px); aspect-ratio: 1; border: 1px solid rgba(31,90,56,.18); border-radius: 50%; transform-style: preserve-3d; animation: orbit-turn 16s linear infinite; }
.orbit-line::after { position: absolute; top: 9%; left: 15%; width: 13px; aspect-ratio: 1; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 8px rgba(31,90,56,.08); content: ""; }
.orbit-line-two { width: min(35vw, 520px); border-color: rgba(231,61,48,.2); animation-duration: 23s; animation-direction: reverse; transform: rotateX(67deg) rotateZ(17deg); }
.orbit-line-two::after { top: 68%; left: 90%; width: 9px; background: #e46d3e; }
@keyframes orbit-turn { to { rotate: 1 1 .2 360deg; } }
.hero-bottle { --slot-x: 0px; --slot-z: 0px; --slot-r: 0deg; position: absolute; z-index: 3; width: clamp(150px, 19vw, 285px); height: clamp(370px, 55vh, 650px); padding: 0; border: 0; background: transparent; cursor: pointer; opacity: .28; filter: saturate(.7) blur(.2px); transform: translate3d(var(--slot-x), 12px, var(--slot-z)) rotateY(var(--slot-r)) scale(.68); transform-style: preserve-3d; transition: transform .9s var(--ease), opacity .65s ease, filter .65s ease; }
.hero-bottle img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 30px 27px rgba(23,38,27,.25)); pointer-events: none; }
.hero-bottle.is-active { z-index: 8; opacity: 1; filter: none; transform: translate3d(0, -4%, 120px) rotateX(var(--pointer-x)) rotateY(var(--pointer-y)) scale(1); animation: hero-float 4.6s ease-in-out infinite alternate; }
.hero-bottle[data-position="left"] { --slot-x: -190px; --slot-z: -110px; --slot-r: 18deg; }
.hero-bottle[data-position="right"] { --slot-x: 190px; --slot-z: -110px; --slot-r: -18deg; }
.hero-bottle[data-position="back"] { --slot-x: 0px; --slot-z: -220px; --slot-r: 6deg; opacity: .12; }
@keyframes hero-float { to { transform: translate3d(0, calc(-4% - 12px), 120px) rotateX(var(--pointer-x)) rotateY(var(--pointer-y)) scale(1.015); } }
.bottle-platform { position: absolute; z-index: 1; bottom: 9%; width: min(33vw, 470px); height: 88px; border: 1px solid rgba(255,255,255,.74); border-radius: 50%; background: radial-gradient(ellipse, rgba(24,37,29,.22), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.94), rgba(225,219,204,.68)); box-shadow: inset 0 8px 18px rgba(255,255,255,.75), 0 28px 45px rgba(24,37,29,.17); transform: rotateX(69deg) translateZ(-36px); }
.bottle-platform i { position: absolute; inset: 14px 9%; border: 1px solid rgba(31,90,56,.16); border-radius: 50%; }
.universe-arrow { position: absolute; z-index: 10; bottom: 6%; width: 52px; aspect-ratio: 1; border: 1px solid rgba(24,37,29,.13); border-radius: 50%; background: rgba(255,255,255,.68); cursor: pointer; box-shadow: inset 0 1px 0 #fff, 0 5px 0 rgba(24,37,29,.1), 0 14px 24px rgba(24,37,29,.08); backdrop-filter: blur(10px); transition: transform .3s var(--ease), background .2s ease; }
.universe-arrow:hover { background: #fff; transform: translateY(-4px); }
.arrow-prev { left: 22%; }.arrow-next { right: 22%; }
.drag-note { position: absolute; right: 0; bottom: 7.5%; margin: 0; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.hero-scroll { position: absolute; right: 0; bottom: 30px; left: 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.hero-scroll i { height: 1px; overflow: hidden; background: var(--line); }
.hero-scroll i::after { display: block; width: 25%; height: 100%; background: var(--green); content: ""; animation: scroll-line 2.5s ease-in-out infinite; }
@keyframes scroll-line { 0% { transform: translateX(-110%); } 70%,100% { transform: translateX(420%); } }

.signature { width: var(--page); margin: 0 auto; padding: 170px 0 190px; }
.signature-copy { display: grid; grid-template-columns: 1fr .7fr; gap: 50px; align-items: end; margin-bottom: 80px; }
.signature-copy .section-index { grid-column: 1 / -1; margin-bottom: -18px; }
.signature-copy h2 { max-width: 820px; }
.signature-copy > p:last-child { max-width: 520px; margin: 0 0 10px; color: var(--muted); font-size: 17px; line-height: 1.6; }
.signature-stage { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; perspective: 1200px; }
.signature-card { --rx: 0deg; --ry: 0deg; --lift: 0px; position: relative; min-height: 570px; display: grid; grid-template-rows: 1fr auto; padding: 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 34px; background: linear-gradient(145deg, rgba(255,255,255,.93), var(--tone, #eee7d9)); box-shadow: inset 0 1px 0 #fff, 0 24px 70px rgba(24,37,29,.09); transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift)); transform-style: preserve-3d; transition: transform .45s var(--ease), box-shadow .45s ease; }
.signature-card:hover { --lift: -12px; box-shadow: inset 0 1px 0 #fff, 0 38px 75px rgba(24,37,29,.18); }
.signature-card::before { position: absolute; inset: 10% -25% 35%; border-radius: 50%; background: radial-gradient(circle, var(--glow), transparent 65%); content: ""; transform: translateZ(-50px); }
.tone-orange { --tone: #f1d3a7; --glow: rgba(244,147,45,.55); }.tone-red { --tone: #e7c3bc; --glow: rgba(198,46,68,.45); }.tone-yellow { --tone: #eee0a8; --glow: rgba(246,204,76,.55); }.tone-green { --tone: #cad9b5; --glow: rgba(103,170,76,.48); }
.signature-card img { position: relative; z-index: 2; align-self: end; justify-self: center; width: 88%; height: 365px; object-fit: contain; filter: drop-shadow(0 28px 22px rgba(24,37,29,.24)); transform: translateZ(58px) rotateZ(-2deg); transition: transform .55s var(--ease); }
.signature-card:nth-child(even) img { transform: translateZ(58px) rotateZ(2deg); }
.signature-card:hover img { transform: translateZ(82px) rotateZ(0deg) scale(1.035); }
.card-number { position: absolute; top: 24px; right: 24px; color: rgba(24,37,29,.48); font-size: 10px; font-weight: 750; letter-spacing: .1em; }
.signature-card > div { position: relative; z-index: 3; transform: translateZ(30px); }
.signature-card h3 { margin: 0 0 8px; font-size: 25px; letter-spacing: -.04em; }
.signature-card p { min-height: 40px; margin: 0; color: rgba(24,37,29,.65); font-size: 12px; line-height: 1.5; }

.catalogue { min-height: 100vh; padding: 160px max(32px, calc((100vw - 1320px)/2)) 180px; background: #102a1c; color: #fff; }
.catalogue-heading { display: grid; grid-template-columns: 1.25fr .75fr; gap: 70px; align-items: end; }
.catalogue-heading h2 { max-width: 800px; }
.catalogue-heading > p { max-width: 470px; margin: 0 0 10px; color: rgba(255,255,255,.6); font-size: 17px; line-height: 1.6; }
.filter-shell { position: sticky; z-index: 15; top: 98px; display: flex; gap: 8px; margin: 70px 0 34px; padding: 8px; overflow-x: auto; border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: rgba(16,42,28,.74); box-shadow: 0 18px 40px rgba(0,0,0,.16); backdrop-filter: blur(18px) saturate(120%); scrollbar-width: none; }
.filter-shell::-webkit-scrollbar { display: none; }
.filter-shell button { flex: 0 0 auto; min-height: 48px; padding: 0 19px; border: 0; border-radius: 15px; background: transparent; color: rgba(255,255,255,.58); font-size: 12px; font-weight: 700; cursor: pointer; transition: background .3s ease, color .3s ease, transform .3s var(--ease); }
.filter-shell button:hover { color: #fff; transform: translateY(-2px); }
.filter-shell button.is-active { background: #fff; color: var(--green-deep); box-shadow: 0 7px 18px rgba(0,0,0,.18); }
.filter-shell button span { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin-left: 6px; padding-inline: 5px; border-radius: 999px; background: rgba(31,90,56,.1); font-size: 9px; }
.catalogue-status { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; margin-bottom: 24px; color: rgba(255,255,255,.43); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.catalogue-status i { height: 1px; background: rgba(255,255,255,.13); }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; perspective: 1200px; }
.product-card { --rx: 0deg; --ry: 0deg; --accent: #f2a246; position: relative; min-height: 390px; display: grid; grid-template-rows: 1fr auto; padding: 25px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 30px; background: rgba(255,255,255,.055); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.08); transform: none; transform-style: preserve-3d; transition: background .35s ease, border-color .35s ease, opacity .35s ease; }
.product-card::before { position: absolute; inset: -35% -20% 37%; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 44%, transparent), transparent 68%); content: ""; opacity: .8; transform: translateZ(-60px); }
.product-card:hover { border-color: rgba(255,255,255,.23); background: rgba(255,255,255,.085); transform: none; }
.product-card.is-entering { animation: card-enter .55s var(--ease) both; animation-delay: calc(var(--i) * 28ms); }
@keyframes card-enter { from { opacity: 0; transform: perspective(900px) translateY(30px) scale(.96); } }
.product-visual { position: relative; min-height: 270px; display: grid; place-items: center; transform: translateZ(48px); }
.product-visual img { width: 148px; height: 245px; object-fit: contain; filter: drop-shadow(0 24px 20px rgba(0,0,0,.32)); transition: transform .5s var(--ease); }
.product-visual img.product-cutout { width: 182px; height: 274px; }
.product-visual img.product-photo { width: min(100%, 205px); height: 280px; border: 1px solid rgba(255,255,255,.18); border-radius: 24px; object-fit: cover; filter: none; box-shadow: 0 26px 45px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.35); }
.product-card:hover .product-visual img { transform: translateY(-8px) rotateZ(2deg) scale(1.025); }
.product-card:hover .product-visual img.product-photo { transform: translateY(-10px) rotateZ(0) scale(1.025); }
.juice-object { position: relative; width: 128px; height: 168px; border-radius: 42% 42% 48% 48% / 35% 35% 54% 54%; background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 42%, white), var(--accent) 52%, color-mix(in srgb, var(--accent) 68%, black)); box-shadow: inset 16px 8px 25px rgba(255,255,255,.3), inset -13px -15px 26px rgba(0,0,0,.2), 0 32px 35px rgba(0,0,0,.25); transform: rotate(-6deg); transition: transform .55s var(--ease); }
.juice-object::before { position: absolute; top: -21px; left: 41px; width: 48px; height: 29px; border-radius: 12px 12px 8px 8px; background: linear-gradient(90deg, #ddd8cd, #fff 45%, #ccc7bc); box-shadow: 0 3px 0 rgba(0,0,0,.12); content: ""; }
.juice-object::after { position: absolute; top: 56px; right: 10px; left: 10px; height: 63px; display: grid; place-items: center; border-radius: 8px; background: linear-gradient(120deg, #d7b37c, #f1d19e); color: #392916; content: attr(data-monogram); font-family: Georgia, serif; font-size: 25px; font-style: italic; box-shadow: inset 0 1px 0 rgba(255,255,255,.5); }
.product-card:hover .juice-object { transform: translateY(-9px) rotate(4deg) scale(1.04); }
.product-topline { position: absolute; z-index: 2; top: 23px; right: 23px; left: 23px; display: flex; justify-content: space-between; color: rgba(255,255,255,.5); font-size: 9px; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.product-body { position: relative; z-index: 2; transform: translateZ(28px); }
.product-body h3 { margin: 0 0 9px; font-size: 28px; letter-spacing: -.045em; }
.product-body p { min-height: 38px; margin: 0 0 21px; color: rgba(255,255,255,.55); font-size: 12px; line-height: 1.5; }
.product-footer { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.11); }
.product-footer small { display: block; margin-bottom: 4px; color: rgba(255,255,255,.4); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.price-list { display: grid; gap: 4px; }
.price-line { display: grid; grid-template-columns: minmax(42px, auto) auto; justify-content: start; gap: 9px; font-size: 13px; font-weight: 700; line-height: 1.25; }
.price-size { color: rgba(255,255,255,.58); font-variant-numeric: tabular-nums; }
.price-amount { color: #fff; font-variant-numeric: tabular-nums; }
.card-actions { display: flex; gap: 8px; }
.card-actions button { width: 42px; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; background: rgba(255,255,255,.08); color: #fff; cursor: pointer; box-shadow: 0 3px 0 rgba(0,0,0,.2); transition: transform .25s var(--ease), background .2s ease; }
.card-actions button:hover { background: #fff; color: var(--green-deep); transform: translateY(-3px); }
.card-actions .add-button.is-added { background: var(--lime); color: var(--green-deep); }
.noscript-note { padding: 24px; border: 1px solid rgba(255,255,255,.16); border-radius: 20px; }

.detox-feature { width: var(--page); display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(50px, 8vw, 120px); align-items: center; margin: 0 auto; padding: 190px 0; }
.detox-image { --rx: 0deg; --ry: 0deg; position: relative; border-radius: 38px; background: #ddd; box-shadow: 0 35px 85px rgba(24,37,29,.18); transform: perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d; transition: transform .45s var(--ease); }
.detox-image img { width: 100%; min-height: 620px; border-radius: inherit; object-fit: cover; }
.detox-image span { position: absolute; right: 22px; bottom: 22px; padding: 14px 17px; border: 1px solid rgba(255,255,255,.7); border-radius: 999px; background: rgba(255,255,255,.79); color: var(--green-deep); font-size: 10px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; box-shadow: 0 15px 35px rgba(0,0,0,.12); backdrop-filter: blur(15px); transform: translateZ(55px); }
.detox-content h2 { font-size: clamp(58px, 6.2vw, 92px); }
.detox-prices { display: grid; margin-top: 55px; border-top: 1px solid var(--line); }
.detox-prices button { display: grid; grid-template-columns: 1fr auto 40px; align-items: center; gap: 20px; padding: 22px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; cursor: pointer; transition: padding .35s var(--ease), color .25s ease; }
.detox-prices button:hover { padding-inline: 12px; color: var(--green); }
.detox-prices span { font-size: 17px; font-weight: 700; }.detox-prices strong { font-size: 15px; }.detox-prices i { width: 38px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #fff; font-style: normal; box-shadow: 0 3px 0 #0f3d25; }

.order-cta { position: relative; min-height: 780px; display: grid; place-content: center; justify-items: center; padding: 120px 24px; overflow: hidden; background: var(--green-deep); color: #fff; text-align: center; }
.order-cta::before { position: absolute; width: 560px; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(184,221,105,.21), transparent 66%); content: ""; }
.order-cta h2 { position: relative; z-index: 2; font-size: clamp(66px, 8.8vw, 138px); }
.order-cta > p:not(.section-index) { position: relative; z-index: 2; max-width: 570px; margin: 35px auto 34px; color: rgba(255,255,255,.61); font-size: 17px; line-height: 1.6; }
.order-actions { position: relative; z-index: 3; display: flex; align-items: center; gap: 25px; }
.phone-link { min-height: 48px; display: inline-flex; align-items: center; color: rgba(255,255,255,.76); font-size: 14px; font-weight: 700; }
.order-orbit { position: absolute; width: min(70vw, 850px); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; animation: cta-orbit 28s linear infinite; }
.order-orbit::before, .order-orbit::after, .order-orbit i { position: absolute; border-radius: 50%; content: ""; }
.order-orbit::before { inset: 14%; border: 1px solid rgba(255,255,255,.1); }.order-orbit::after { inset: 31%; border: 1px solid rgba(255,255,255,.08); }
.order-orbit i { width: 18px; aspect-ratio: 1; background: #f0a840; box-shadow: 0 0 0 9px rgba(240,168,64,.1); }
.order-orbit i:nth-child(1) { top: 8%; left: 23%; }.order-orbit i:nth-child(2) { right: 10%; bottom: 23%; width: 12px; background: #e65845; }.order-orbit i:nth-child(3) { bottom: 7%; left: 38%; width: 14px; background: var(--lime); }
@keyframes cta-orbit { to { transform: rotate(360deg); } }

.order-tray { position: fixed; z-index: 80; right: 24px; bottom: 24px; width: min(520px, calc(100vw - 48px)); display: grid; gap: 14px; padding: 20px; border: 1px solid rgba(255,255,255,.72); border-radius: 28px; background: rgba(248,247,242,.94); box-shadow: 0 24px 70px rgba(11,29,19,.24); backdrop-filter: blur(20px) saturate(130%); opacity: 0; pointer-events: none; transform: translateY(calc(100% + 48px)); transition: transform .55s var(--ease), opacity .35s ease; }
.order-tray.is-open { opacity: 1; pointer-events: auto; transform: none; }
.tray-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.tray-head > div { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; }
.tray-head small { grid-column: 1 / -1; color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.tray-head strong { font-size: 17px; }.tray-head span { color: var(--green); font-size: 15px; font-weight: 760; }
.tray-clear { min-height: 44px; padding: 0 13px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--muted); font-size: 11px; font-weight: 700; cursor: pointer; }
.cart-lines { max-height: min(300px, 38vh); display: grid; gap: 8px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.cart-line { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 12px; border: 1px solid rgba(31,90,56,.1); border-radius: 18px; background: rgba(255,255,255,.65); }
.cart-line > div:first-child { min-width: 0; display: grid; gap: 3px; }.cart-line > div:first-child strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.cart-line > div:first-child span { color: var(--muted); font-size: 11px; }
.cart-line > b { min-width: 70px; font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; }
.cart-quantity, .quantity-stepper { display: grid; grid-template-columns: 38px 34px 38px; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.cart-quantity button, .quantity-stepper button { width: 38px; min-height: 38px; border: 0; border-radius: 50%; background: transparent; color: var(--ink); font-size: 19px; cursor: pointer; }
.cart-quantity button:hover, .quantity-stepper button:hover { background: rgba(31,90,56,.09); }
.cart-quantity output, .quantity-stepper output { text-align: center; font-size: 13px; font-weight: 760; font-variant-numeric: tabular-nums; }
.tray-send { min-height: 54px; padding: 0 20px; border: 0; border-radius: 17px; background: var(--green); color: #fff; font-size: 12px; font-weight: 720; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 4px 0 #0f3d25; }

.product-dialog { width: min(920px, calc(100vw - 32px)); max-height: min(780px, calc(100vh - 32px)); padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.75); border-radius: 38px; background: var(--paper); color: var(--ink); box-shadow: 0 45px 120px rgba(8,24,15,.38); }
.product-dialog[open] { position: fixed; z-index: 100; top: 50%; left: 50%; display: grid; grid-template-columns: 1fr 1fr; margin: 0; translate: -50% -50%; animation: dialog-in .45s var(--ease); }
.product-dialog::backdrop { background: rgba(8,24,15,.55); backdrop-filter: blur(12px); }
@keyframes dialog-in { from { opacity: 0; transform: translateY(28px) scale(.96); } }
.dialog-close { position: absolute; z-index: 3; top: 18px; right: 18px; width: 44px; aspect-ratio: 1; border: 0; border-radius: 50%; background: rgba(255,255,255,.83); font-size: 23px; cursor: pointer; box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.dialog-visual { --dialog-accent: #ef9c3a; position: relative; min-height: 600px; display: grid; place-items: center; overflow: hidden; background: color-mix(in srgb, var(--dialog-accent) 24%, #efeae0); }
.dialog-orb { position: absolute; width: 430px; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.9), var(--dialog-accent) 48%, color-mix(in srgb, var(--dialog-accent) 65%, black)); box-shadow: inset 25px 17px 45px rgba(255,255,255,.36), inset -30px -24px 60px rgba(0,0,0,.2), 0 35px 60px rgba(24,37,29,.18); animation: dialog-orb 8s ease-in-out infinite alternate; }
@keyframes dialog-orb { to { transform: rotate(8deg) scale(1.04); } }
.dialog-visual img { position: relative; z-index: 2; width: 60%; height: 450px; object-fit: contain; filter: drop-shadow(0 30px 26px rgba(24,37,29,.3)); animation: dialog-product 4s ease-in-out infinite alternate; }
.dialog-visual img.is-photo { width: min(74%, 360px); height: 500px; border: 1px solid rgba(255,255,255,.5); border-radius: 30px; object-fit: cover; filter: none; box-shadow: 0 35px 70px rgba(24,37,29,.28); }
@keyframes dialog-product { to { transform: translateY(-11px) rotate(2deg); } }
.dialog-visual img[src=""] { display: none; }
.dialog-copy { display: flex; flex-direction: column; justify-content: center; padding: 48px 50px; overflow-y: auto; }
.dialog-copy > span { margin-bottom: 20px; color: var(--green); font-size: 10px; font-weight: 760; letter-spacing: .14em; text-transform: uppercase; }
.dialog-copy h2 { margin-bottom: 18px; font-size: clamp(45px, 4.5vw, 70px); }
.dialog-copy > p { color: var(--muted); font-size: 16px; line-height: 1.6; }
.size-picker { min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 20px 0 18px; padding: 20px 0 0; border: 0; border-top: 1px solid var(--line); }
.size-picker legend, .quantity-picker > span { color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.size-picker legend { float: left; width: 100%; margin-bottom: 12px; }
.size-option { position: relative; min-height: 58px; display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 0 14px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.5); cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .25s var(--ease); }
.size-option:only-of-type { grid-column: 1 / -1; }
.size-option:hover { transform: translateY(-2px); }.size-option.is-selected { border-color: var(--green); background: rgba(31,90,56,.09); box-shadow: inset 0 0 0 1px var(--green); }
.size-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }.size-option span { font-size: 14px; font-weight: 760; }.size-option strong { font-size: 12px; font-variant-numeric: tabular-nums; }
.size-option:has(input:focus-visible) { outline: 3px solid rgba(31,90,56,.28); outline-offset: 2px; }
.quantity-picker { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.quantity-stepper { grid-template-columns: 44px 42px 44px; }.quantity-stepper button { width: 44px; min-height: 44px; }
.dialog-copy .dialog-add { width: 100%; align-self: stretch; }
.dialog-feedback { min-height: 20px; margin: 9px 0 0; color: var(--green) !important; font-size: 12px !important; text-align: center; }

footer { display: grid; grid-template-columns: 150px 1fr 1fr auto; gap: 50px; align-items: start; padding: 90px max(32px, calc((100vw - 1320px)/2)) 34px; }
footer img { width: 110px; } footer > p { font-size: clamp(30px, 3vw, 47px); line-height: 1.05; letter-spacing: -.05em; } footer div { display: grid; gap: 12px; padding-top: 8px; color: var(--muted); font-size: 13px; } footer > span { align-self: end; color: var(--muted); font-size: 10px; }

@media (max-width: 1050px) {
  :root { --page: calc(100vw - 32px); }
  .menu-header { top: 8px; height: 62px; grid-template-columns: 1fr auto; border-radius: 18px; }
  .desktop-nav, .menu-header > .button { display: none; }
  .menu-toggle { width: 50px; height: 50px; display: grid; place-content: center; gap: 7px; border: 0; border-radius: 50%; background: var(--green); cursor: pointer; }
  .menu-toggle span { width: 20px; height: 1.5px; background: #fff; transition: transform .3s var(--ease); }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4.25px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4.25px) rotate(-45deg); }
  .mobile-menu { position: fixed; z-index: 55; inset: 0; display: grid; place-items: center; padding: 100px 24px 32px; visibility: hidden; background: rgba(244,241,233,.97); opacity: 0; transform: translateY(-12px); transition: opacity .3s ease, transform .4s var(--ease), visibility .3s; }
  .mobile-menu.is-open { visibility: visible; opacity: 1; transform: none; }
  .mobile-menu nav { width: 100%; display: grid; text-align: center; }.mobile-menu nav > a:not(.button) { padding: 12px; font-size: 36px; font-weight: 720; letter-spacing: -.05em; }.mobile-menu .button { margin-top: 28px; }
  .menu-hero { grid-template-columns: 1fr; padding: 130px 12px 75px; }
  .hero-copy { padding-left: 0; }.hero-copy h1 { max-width: 780px; }.hero-product-meta { margin-top: 42px; }
  .bottle-universe { min-height: 700px; margin-top: -30px; }.universe-halo { width: min(78vw, 590px); }.orbit-line { width: min(82vw, 650px); }.orbit-line-two { width: min(65vw, 520px); }.hero-bottle { width: min(31vw, 270px); }.bottle-platform { width: min(61vw, 470px); }.drag-note { right: 4%; }
  .signature-copy { grid-template-columns: 1fr; }.signature-copy .section-index { margin-bottom: -22px; }.signature-stage { grid-template-columns: 1fr 1fr; }.signature-card { min-height: 540px; }
  .catalogue { padding-inline: 16px; }.catalogue-heading { grid-template-columns: 1fr; }.filter-shell { top: 80px; }.product-grid { grid-template-columns: 1fr 1fr; }
  .detox-feature { grid-template-columns: 1fr; }.detox-image img { min-height: 540px; }.detox-content { max-width: 780px; }
  footer { grid-template-columns: 120px 1fr 1fr; } footer > span { grid-column: 1 / -1; }
}

@media (max-width: 650px) {
  h2 { font-size: clamp(52px, 15vw, 74px); }
  .menu-hero { min-height: auto; padding-top: 122px; }
  .hero-copy h1 { font-size: clamp(60px, 17vw, 82px); }.hero-intro { margin-top: 26px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 8px; }.hero-product-meta { grid-template-columns: 58px 1fr; margin-top: 34px; }
  .bottle-universe { min-height: 560px; margin: -8px -12px 0; }.hero-bottle { width: min(46vw, 220px); height: 430px; }.hero-bottle[data-position="left"] { --slot-x: -115px; }.hero-bottle[data-position="right"] { --slot-x: 115px; }.universe-arrow { bottom: 4%; }.arrow-prev { left: 26%; }.arrow-next { right: 26%; }.drag-note { display: none; }.hero-scroll { display: none; }.bottle-platform { bottom: 9%; width: 70vw; }
  .signature { padding: 120px 0; }.signature-copy { margin-bottom: 50px; }.signature-copy > p:last-child { font-size: 15px; }.signature-stage { grid-template-columns: repeat(4, 82vw); margin-right: calc((100vw - var(--page))/ -2); padding-right: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }.signature-stage::-webkit-scrollbar { display: none; }.signature-card { min-height: 535px; scroll-snap-align: center; }
  .catalogue { padding-block: 120px; }.catalogue-heading { gap: 32px; }.catalogue-heading > p { font-size: 15px; }.filter-shell { margin-top: 48px; }.product-grid { grid-template-columns: 1fr; }.product-card { min-height: 375px; }
  .detox-feature { padding: 120px 0; }.detox-image img { min-height: 440px; }.detox-content h2 { font-size: clamp(52px, 15vw, 73px); }.detox-prices { margin-top: 40px; }
  .order-cta { min-height: 680px; }.order-cta h2 { font-size: clamp(61px, 17vw, 88px); }.order-actions { flex-direction: column; }.order-orbit { width: 130vw; }
  .order-tray { right: 10px; bottom: 10px; width: calc(100vw - 20px); max-height: calc(100dvh - 92px); padding: 16px; }.tray-send { width: 100%; }.cart-lines { max-height: min(300px, 38dvh); }.cart-line { grid-template-columns: minmax(0, 1fr) auto; }.cart-line > b { grid-column: 1; grid-row: 2; text-align: left; }.cart-quantity { grid-column: 2; grid-row: 1 / span 2; }
  .product-dialog[open] { grid-template-columns: 1fr; overflow-y: auto; }.dialog-visual { min-height: 280px; }.dialog-orb { width: 270px; }.dialog-visual img { width: 45%; height: 235px; }.dialog-visual img.is-photo { width: min(58%, 205px); height: 270px; border-radius: 22px; }.dialog-copy { padding: 30px 24px 36px; overflow: visible; }.dialog-copy h2 { font-size: 48px; }.size-picker { grid-template-columns: 1fr 1fr; }.size-option { min-height: 55px; padding-inline: 12px; }.size-option strong { font-size: 11px; }
  footer { grid-template-columns: 1fr; gap: 24px; } footer > span { grid-column: auto; }
}

@media (pointer: coarse) {
  .drag-note { display: none; }
  [data-tilt], .product-card { --rx: 0deg !important; --ry: 0deg !important; }
  .product-card, .product-card:hover { transform: none; transform-style: flat; }
  .product-visual, .product-body { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .menu-header::before { opacity: 0 !important; }
  .brand-logo, .brand-logo-full, .brand-logo-outline { transform: none !important; }
  .hero-bottle.is-active { transform: translate3d(0,-4%,120px) scale(1); }
  [data-tilt], .product-card { --rx: 0deg !important; --ry: 0deg !important; }
}

@media (prefers-reduced-transparency: reduce) {
  .menu-header, .filter-shell, .order-tray { background: var(--paper); backdrop-filter: none; }
  .filter-shell { background: #102a1c; }
}

/* Phone experience: compact browse cards, bottom-sheet ordering, safe-area chrome. */
html { scroll-padding-top: 86px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overscroll-behavior-x: none; }

@media (max-width: 1050px) {
  .menu-header { top: calc(8px + env(safe-area-inset-top)); padding-left: 12px; }
  .menu-toggle { min-width: 50px; min-height: 50px; touch-action: manipulation; }
  .mobile-menu { padding-top: calc(96px + env(safe-area-inset-top)); padding-bottom: calc(30px + env(safe-area-inset-bottom)); }
  .mobile-menu nav > a:not(.button) { min-height: 58px; display: grid; place-items: center; }
  .mobile-menu .button { width: min(100%, 330px); justify-self: center; }
  .menu-hero { padding-top: calc(112px + env(safe-area-inset-top)); }
  .signature-stage, .filter-shell { touch-action: pan-x; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 650px) {
  :root { --page: calc(100vw - 28px); }
  .reveal { opacity: 1; transform: none; animation: none; }
  .menu-header { width: calc(100vw - 16px); height: 60px; border-radius: 19px; }
  .brand, .brand-logo, .brand img { width: 54px; height: 48px; }
  .menu-toggle { width: 48px; height: 48px; }
  h2 { margin-bottom: 30px; font-size: clamp(43px, 12vw, 57px); line-height: .98; }
  .eyebrow, .section-index { margin-bottom: 20px; }

  .menu-hero { gap: 4px; padding: calc(105px + env(safe-area-inset-top)) 14px 42px; }
  .hero-copy h1 { margin-bottom: 24px; font-size: clamp(51px, 14vw, 63px); line-height: .96; }
  .hero-intro { max-width: 34rem; margin: 22px 0 22px; font-size: 16px; }
  .hero-actions { width: 100%; }
  .hero-actions .button { width: 100%; }
  .hero-actions .text-link { min-height: 48px; display: inline-flex; align-items: center; }
  .hero-product-meta { grid-template-columns: 48px 1fr; gap: 12px; margin-top: 24px; padding-top: 14px; }
  .hero-product-meta strong { font-size: 21px; }
  .bottle-universe { min-height: 470px; margin: -4px -8px 0; touch-action: pan-y; }
  .universe-halo { width: min(92vw, 360px); }
  .orbit-line { width: 94vw; }.orbit-line-two { width: 76vw; }
  .hero-bottle { width: min(45vw, 182px); height: 350px; }
  .hero-bottle[data-position="left"] { --slot-x: -92px; }.hero-bottle[data-position="right"] { --slot-x: 92px; }
  .universe-arrow { width: 48px; height: 48px; bottom: 4%; }
  .arrow-prev { left: 22%; }.arrow-next { right: 22%; }
  .bottle-platform { bottom: 10%; width: 72vw; }

  .signature { padding: 88px 0; }
  .signature-copy { margin-bottom: 36px; }
  .signature-copy > p:last-child { font-size: 14px; }
  .signature-stage { grid-template-columns: repeat(4, 84vw); gap: 12px; padding-right: 14px; scroll-padding-inline: 8px; scroll-snap-type: x mandatory; }
  .signature-card { min-height: 455px; padding: 22px; border-radius: 28px; }
  .signature-card img { height: 300px; }

  .catalogue { padding: 94px 14px 110px; }
  .catalogue-heading { gap: 20px; }
  .catalogue-heading > p { font-size: 15px; }
  .filter-shell { top: calc(76px + env(safe-area-inset-top)); margin: 34px 0 24px; padding: 6px; border-radius: 18px; }
  .filter-shell button { min-height: 48px; padding-inline: 16px; }
  .catalogue-status { gap: 9px; font-size: 9px; }
  .product-grid { gap: 12px; }
  .product-card { min-height: 0; grid-template-columns: 118px minmax(0,1fr); grid-template-rows: auto; gap: 12px; padding: 48px 15px 17px; border-radius: 24px; content-visibility: auto; contain-intrinsic-size: 0 265px; }
  .product-card::before { inset: -12% 52% 6% -35%; }
  .product-topline { top: 17px; right: 15px; left: 15px; }
  .product-visual { min-height: 190px; align-self: center; }
  .product-visual img { width: 94px; height: 168px; }
  .product-visual img.product-cutout { width: 112px; height: 184px; }
  .product-visual img.product-photo { width: 104px; height: 170px; border-radius: 17px; }
  .juice-object { scale: .72; }
  .product-body { min-width: 0; }
  .product-body h3 { margin-bottom: 7px; font-size: 23px; }
  .product-body p { min-height: 0; margin-bottom: 14px; font-size: 11px; }
  .product-footer { display: grid; grid-template-columns: 1fr; gap: 13px; padding-top: 13px; }
  .price-line { grid-template-columns: 40px auto; gap: 7px; font-size: 12px; }
  .card-actions { gap: 9px; }
  .card-actions button { width: 48px; min-height: 48px; touch-action: manipulation; }

  .detox-feature { gap: 44px; padding: 94px 0; }
  .detox-image { border-radius: 28px; }
  .detox-image img { min-height: 330px; }
  .detox-image span { right: 12px; bottom: 12px; padding: 11px 13px; }
  .detox-content h2 { font-size: clamp(43px, 12vw, 57px); }
  .detox-prices { margin-top: 30px; }
  .detox-prices button { min-height: 70px; grid-template-columns: 1fr auto 40px; gap: 10px; }

  .order-cta { min-height: 610px; padding: 88px 18px; }
  .order-cta h2 { font-size: clamp(50px, 14vw, 65px); }
  .order-cta > p:not(.section-index) { margin: 24px auto 28px; font-size: 16px; }
  .order-actions { width: 100%; gap: 10px; }
  .order-actions .button { width: 100%; }
  .phone-link { min-height: 52px; justify-content: center; }

  .order-tray { right: 0; bottom: 0; width: 100%; max-height: calc(72dvh - env(safe-area-inset-bottom)); padding: 17px 14px calc(14px + env(safe-area-inset-bottom)); border-radius: 25px 25px 0 0; }
  .cart-lines { max-height: min(310px, 40dvh); }
  .cart-quantity { grid-template-columns: 44px 34px 44px; }
  .cart-quantity button { width: 44px; min-height: 44px; }

  .product-dialog { width: calc(100vw - 12px); max-height: calc(100dvh - 8px); border-radius: 28px 28px 0 0; }
  .product-dialog[open] { top: auto; right: 6px; bottom: 0; left: 6px; grid-template-columns: 1fr; grid-template-rows: 195px auto; overflow-y: auto; translate: none; animation: dialog-sheet-in .42s var(--ease); }
  @keyframes dialog-sheet-in { from { opacity: 0; transform: translateY(35px); } }
  .dialog-close { top: 12px; right: 12px; width: 46px; }
  .dialog-visual { min-height: 195px; }
  .dialog-orb { width: 210px; }
  .dialog-visual img { width: 36%; height: 170px; }
  .dialog-visual img.is-photo { width: min(45%, 155px); height: 180px; border-radius: 18px; }
  .dialog-copy { padding: 24px 18px calc(24px + env(safe-area-inset-bottom)); overflow: visible; }
  .dialog-copy > span { margin-bottom: 11px; }
  .dialog-copy h2 { margin-bottom: 10px; font-size: clamp(36px, 11vw, 46px); }
  .dialog-copy > p { font-size: 14px; line-height: 1.45; }
  .size-picker { gap: 7px; margin: 16px 0 14px; padding-top: 15px; }
  .size-option { min-height: 56px; }
  .quantity-picker { margin-bottom: 15px; }

  footer { gap: 20px; padding: 68px 18px calc(24px + env(safe-area-inset-bottom)); }
  footer img { width: 92px; }
  footer > p { font-size: 35px; }
  footer div a { min-height: 44px; display: inline-flex; align-items: center; }
}

@media (max-width: 370px) {
  .hero-copy h1 { font-size: 48px; }
  h2 { font-size: 41px; }
  .product-card { grid-template-columns: 102px minmax(0,1fr); padding-inline: 13px; }
  .product-visual img.product-cutout { width: 98px; }
  .product-body h3 { font-size: 21px; }
  .price-line { font-size: 11px; }
}

@media (pointer: coarse) {
  .bottle-universe { transform: none !important; }
  .hero-bottle { will-change: auto; }
  .button, .filter-shell button, .card-actions button { touch-action: manipulation; }
}

@media (prefers-contrast: more) {
  .menu-header, .mobile-menu, .order-tray { border-color: var(--ink); background: var(--paper); backdrop-filter: none; }
  .filter-shell { background: #102a1c; backdrop-filter: none; }
}

@media (forced-colors: active) {
  .button, .menu-toggle, .card-actions button, .universe-arrow { border: 2px solid ButtonText; }
}
