.product-page { --product-yellow:#fff2bf; --product-paper:#fff9e3; }
.product-page main { overflow:clip; }
.product-page [hidden] { display:none!important; }
.product-page .container { width:min(calc(100% - 2 * var(--gutter)),var(--measure)); }
.product-kicker { font-size:12px; letter-spacing:.2em; text-transform:uppercase; font-weight:600; }
.product-page h1,.product-page h2 { font-family:Syne,sans-serif; font-weight:800; letter-spacing:-.06em; line-height:1.04; }
.product-page h2 { font-size:clamp(38px,4.8vw,74px); margin:24px 0; }
.product-page p { line-height:1.5; }
.product-hero { background:#f5f6f8; padding:clamp(58px,7vw,110px) 0; }
.product-hero-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:60px; }
.product-hero h1 { font-size:clamp(65px,8vw,130px); margin:28px 0; }
.product-hero h1 span { color:#9ea8b8; }
.product-hero .product-lead { font-size:clamp(23px,2.3vw,35px); font-style:italic; margin-bottom:20px; line-height:1.25; }
.product-hero p:not(.product-kicker):not(.product-lead) { font-size:20px; max-width:520px; }
.product-hero .button { margin-top:32px; gap:28px; }
.product-hero-art { position:relative; isolation:isolate; padding:35px 0; }
.product-hero-art>img { width:100%; height:auto; display:block; border-radius:50%; position:relative; }
.product-disc { position:absolute; width:95%; aspect-ratio:1; border-radius:50%; background:var(--product-yellow); top:-10%; right:-22%; z-index:-1; }
.product-art-note { position:absolute; right:-2%; bottom:5%; background:var(--product-yellow); padding:23px 28px; border-radius:16px; font-size:14px; font-weight:600; line-height:1.5; transform:rotate(-5deg); }
.product-story,.product-advice { padding:clamp(70px,9vw,140px) 0; }
.product-story-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,7vw,110px); }
.product-story-grid>div:last-child { padding-top:20px; }
.product-story-grid p:not(.product-kicker) { font-size:clamp(19px,1.8vw,26px); margin-bottom:26px; }
.product-link { display:inline-flex; font-weight:600; border-bottom:1px solid; padding-block:10px; font-size:16px; }
.product-statement { background:#171717; color:var(--product-paper); padding:clamp(80px,10vw,145px) 0; overflow:hidden; }
.product-statement .container { position:relative; }
.product-statement p { font:800 clamp(45px,6vw,98px)/1.05 Syne,sans-serif; letter-spacing:-.05em; position:relative; z-index:1; }
.product-statement span { position:absolute; width:clamp(130px,22vw,350px); aspect-ratio:1; border-radius:50%; background:#383a3e; right:-5%; top:-20%; }
.product-salons { margin-top:28px; display:grid; gap:14px; font-weight:600; }
.product-faq { background:#f5f6f8; padding:60px 0 90px; }
.product-faq h2 { margin-bottom:40px; }
.product-faq details { border-top:1px solid #bbb; padding:24px 0; }
.product-faq summary { font-size:clamp(19px,2vw,26px); font-weight:600; cursor:pointer; display:flex; justify-content:space-between; gap:20px; list-style:none; }
.product-faq summary::-webkit-details-marker { display:none; }
.product-faq details p { max-width:750px; padding-top:20px; font-size:18px; }
.product-faq details[open] summary span { transform:rotate(45deg); }
.product-page button:focus-visible,.product-page a:focus-visible,.product-page summary:focus-visible { outline:3px solid #171717; outline-offset:5px; }
@media(max-width:900px) {
 .product-hero-grid { gap:25px; }
 .product-hero h1 { font-size:clamp(56px,8vw,90px); }
}
@media(max-width:680px) {
 .product-page .container { width:calc(100% - 44px); }
 .product-hero { padding-top:48px; }
 .product-hero h1 { font-size:clamp(62px,16vw,100px); }
 .product-hero-art { max-width:360px; width:100%; margin:38px auto 0; }
 .product-art-note { bottom:0; right:0; padding:16px 22px; }
 .product-story-grid { gap:15px; }
 .product-page h2 { font-size:clamp(35px,9vw,52px); }
 .product-statement p { font-size:clamp(38px,10vw,65px); }
}
@media(prefers-reduced-motion:reduce) { .product-page * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

.product-editorial { padding:clamp(70px,8vw,120px) 0; background:var(--product-paper); }
.product-editorial-heading { display:grid; grid-template-columns:1.2fr 1fr; gap:0 80px; align-items:end; margin-bottom:55px; }
.product-editorial-heading .product-kicker { grid-column:1/-1; }
.product-editorial-heading h2 { max-width:660px; }
.product-editorial-heading>p:last-child { font-size:21px; max-width:470px; padding-bottom:26px; }
.product-moments { display:grid; grid-template-columns:1fr 1fr 1fr; gap:26px; align-items:start; margin-bottom:46px; }
.product-moment { margin:0; min-width:0; }
.product-moment:nth-child(2) { margin-top:100px; --bottle-lift:-22px; --bottle-turn:-2deg; --bottle-scale:1.065; }
.product-moment:nth-child(3) { margin-top:38px; --bottle-lift:-18px; --bottle-turn:2deg; --bottle-scale:1.055; }
.product-moment-art { position:relative; overflow:hidden; isolation:isolate; background:var(--product-paper); display:grid; grid-template-rows:auto minmax(0,1fr); gap:18px; padding:12px 0 0; aspect-ratio:3/4; }
.product-moment-art::before { content:""; position:absolute; width:92%; aspect-ratio:1; border-radius:50%; bottom:2%; left:4%; background:#e9ebef; z-index:-1; }
.product-moment:nth-child(2) .product-moment-art::before { background:#ffedb2; width:78%; left:11%; bottom:2%; }
.product-moment:nth-child(3) .product-moment-art::before { background:#e2e5ea; width:72%; left:14%; bottom:2%; }
.product-moment-art img { width:100%; height:100%; min-height:0; object-fit:contain; display:block; mix-blend-mode:multiply; position:relative; transform:rotate(-3deg); transform-origin:50% 65%; }
.product-moment:nth-child(2) .product-moment-art img { transform:rotate(3deg); }
.product-moment:nth-child(3) .product-moment-art img { transform:rotate(-2deg); }
.product-moment-word { display:block; position:relative; font:800 clamp(40px,5.8vw,86px)/1.12 Syne,sans-serif; letter-spacing:-.06em; color:#171717; padding:0 3%; }
.product-moment figcaption { padding-top:24px; }
.product-moment figcaption .product-kicker { font-size:10px; letter-spacing:.1em; }
.product-moment h3 { font:700 clamp(25px,2.3vw,36px)/1.15 Syne,sans-serif; letter-spacing:-.03em; margin:16px 0; }
.product-moment figcaption>p:last-child { font-size:18px; }
.product-advice { scroll-margin-top:105px; }
.product-salma-note { font-size:16px!important; margin-top:28px; }
@media(prefers-reduced-motion:no-preference) {
 .product-moment-art img,.product-moment-art::before { transition:transform .7s cubic-bezier(.22,1,.36,1); }
 @media(hover:hover) and (pointer:fine) {
  .product-moment .product-moment-art:hover img { transform:translateY(var(--bottle-lift,-8px)) rotate(var(--bottle-turn,0deg)) scale(var(--bottle-scale,1.035)); }
  .product-moment-art:hover::before { transform:translateY(5px) scale(.96); }
 }
 @supports(animation-timeline:view()) {
  .product-moment-art { animation:product-arrive linear both; animation-timeline:view(); animation-range:entry 0% entry 75%; }
 }
}
@keyframes product-arrive { from { opacity:.65; translate:0 22px; } to { opacity:1; translate:0 0; } }
@media(max-width:680px) {
 .product-hero-grid,.product-story-grid { grid-template-columns:1fr; }
 .product-editorial-heading { display:block; margin-bottom:35px; }
 .product-editorial-heading>p:last-child { font-size:19px; padding:0; }
 .product-moments { grid-template-columns:1fr; gap:50px; }
 .product-moment:nth-child(2),.product-moment:nth-child(3) { margin-top:0; }
 .product-moment-art { aspect-ratio:3/4; gap:12px; }
 .product-moment-word { font-size:clamp(56px,17vw,72px); }
 .product-moment:nth-child(2) { padding-left:25px; }
 .product-moment:nth-child(3) { padding-right:25px; }
}

.product-breadcrumb { display:flex; gap:12px; padding-block:20px; font-size:13px; }
.product-breadcrumb a { text-decoration:underline; text-underline-offset:4px; }