@import url('figma-mobile-nodes.css');
@font-face { font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/figma/Inter-Regular-v3.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/figma/Inter-Bold-v3.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:900; font-display:swap; src:url('../fonts/figma/Inter-Black-v3.woff2') format('woff2'); }

/* Mobile approved in Figma: Gloock, Cormorant Garamond, DM Sans, Inter.
   Compositional layers retain their measured relationships. Sections flow
   normally, and the FAQ/footer grow with content rather than overlap. */
:root { --cream:#f6f2e8; --wine:#500c11; --red:#f71319; --button:#a80910; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; interpolate-size:allow-keywords; }
body { margin:0; background:#000; color:#000; font-family:'DM Sans',sans-serif; font-size:16px; line-height:1.5; }
p,h1,h2,h3,figure { margin:0; font-size:inherit; font-weight:inherit; }
img { display:block; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; font:inherit; }
button:disabled { cursor:default; }
:focus-visible { outline:3px solid #f71319; outline-offset:4px; }
.page-shell { width:100%; max-width:560px; margin-inline:auto; container-type:inline-size; }
.approved-page { --u:calc(100cqw / 440); position:relative; isolation:isolate; width:100%; background:#000; overflow:hidden; }
.art-layers { position:absolute; inset:0; pointer-events:none; z-index:0; }
.thread-composite { position:absolute; left:0; top:calc(1878 * var(--u)); width:100%; height:calc(403 * var(--u)); overflow:hidden; }
.offer-surface { position:absolute; left:0; top:calc(4776 * var(--u)); width:100%; height:calc(981 * var(--u)); }
.thread-composite img { width:100%; height:calc(981 * var(--u)); }
.offer-surface img { width:100%; height:100%; }
.composition { position:relative; width:100%; z-index:1; }
.action-hit { position:absolute; display:block; padding:0; margin:0; background:transparent; border:0; border-radius:calc(10.233 * var(--u)); z-index:4; }
.action-hit:not([disabled]):hover { box-shadow:inset 0 0 0 1px rgb(255 255 255 / .3); }
.play-hit { border-radius:50%; transition:box-shadow .2s ease; }
.play-hit:hover { box-shadow:0 0 0 calc(5 * var(--u)) rgb(246 242 232 / .18); }
.reader-track { position:absolute; inset:0; transition:transform .5s cubic-bezier(.22,1,.36,1); }
.third-reader { position:absolute; inset:0; transform:translateX(calc(368 * var(--u))); }
.active-dot { display:none; position:absolute; top:calc(806 * var(--u)); left:calc(190 * var(--u)); width:calc(14 * var(--u)); height:calc(14 * var(--u)); border-radius:50%; background:var(--cream); }
.faq-section::before { content:''; position:absolute; inset:calc(8 * var(--u)) 0 0; background:var(--cream); z-index:-1; }
.faq-flow { position:relative; padding:calc(251 * var(--u)) 0 calc(17.5 * var(--u)); }
.question { width:calc(384 * var(--u)); margin:0 0 calc(5 * var(--u)) calc(28 * var(--u)); border:0; box-shadow:inset 0 0 0 calc(1.356 * var(--u)) rgb(58 53 48 / .3); border-radius:calc(15 * var(--u)); color:#000; background:var(--cream); }
.question summary { position:relative; min-height:var(--closed); display:flex; align-items:center; padding:0 calc(46 * var(--u)) 0 calc(30 * var(--u)); list-style:none; cursor:pointer; font-size:calc(18 * var(--u)); line-height:1.25; letter-spacing:calc(-.54 * var(--u)); font-weight:700; font-variation-settings:'opsz' 14; }
.question summary > span { position:relative; top:calc(-.5 * var(--u)); }
.question:nth-of-type(3) summary > span { top:calc(-.75 * var(--u)); }
.question:nth-of-type(4) summary > span,.question:nth-of-type(5) summary > span { top:calc(-1.5 * var(--u)); }
.question:first-child[open] summary { min-height:calc(62.5 * var(--u)); }
.question:first-child[open] summary > span { top:0; }
.question summary::-webkit-details-marker { display:none; }
.question summary img { position:absolute; right:calc(20.5 * var(--u)); width:auto; height:auto; scale:var(--asset-scale,1); transform-origin:center; transition:rotate .25s ease; }
.question[open] summary { color:var(--wine); }
.question[open] summary img { rotate:90deg; }
.question:first-child[open] summary img { top:calc(46.64 * var(--u)); }
.question p { padding:0 calc(28.644 * var(--u)) calc(19 * var(--u)); margin-top:calc(-12 * var(--u)); font-size:calc(14 * var(--u)); font-weight:400; line-height:1.4; letter-spacing:calc(-.42 * var(--u)); font-variation-settings:'opsz' 9; color:#3a3530; }
.question:first-child p { padding:0 calc(30 * var(--u)) calc(22.48 * var(--u)); margin-top:calc(-20 * var(--u)); }
.question:first-child p > span { display:block; }
.question:first-child p > span:first-child { line-height:1.68; }
.question:first-child p > span:last-child { line-height:1.25; }
.question::details-content { block-size:0; overflow:clip; transition:block-size .3s ease,content-visibility .3s allow-discrete; }
.question[open]::details-content { block-size:auto; }
.purchase-button { position:relative; display:flex; align-items:center; justify-content:center; gap:calc(12 * var(--u)); width:calc(383.327 * var(--u)); min-height:calc(68.479 * var(--u)); margin-left:calc(28 * var(--u)); border:calc(.787 * var(--u)) solid #ed161f; border-radius:calc(10.233 * var(--u)); background:var(--button); color:#fcf6f0; font-family:'DM Sans',sans-serif; font-weight:700; font-variation-settings:'opsz' 14; font-size:calc(17.69 * var(--u)); line-height:1.15; letter-spacing:calc(-.5307 * var(--u)); text-transform:uppercase; text-decoration:none; }
.purchase-button:hover { background:#bb0910; }
.purchase-button img { width:auto; height:auto; zoom:var(--asset-scale,1); }
.faq-flow > .purchase-button { margin-top:calc(-1 * var(--u)); }
.signature-wrap { width:calc(248 * var(--u)); height:calc(53.6225 * var(--u)); margin:calc(36.5 * var(--u)) 0 0 calc(93 * var(--u)); }
.signature-wrap img { width:auto; height:auto; zoom:var(--asset-scale,1); }
.social-visual { position:relative; width:calc(91.478 * var(--u)); height:calc(25.5383 * var(--u)); margin:calc(26.4 * var(--u)) 0 0 calc(171 * var(--u)); }
.social-visual > img { width:auto; height:auto; zoom:var(--asset-scale,1); }
.social-visual button { position:absolute; top:0; bottom:0; width:30%; padding:0; background:transparent; border:0; }
.social-visual button:nth-of-type(1) { left:0; }
.social-visual button:nth-of-type(2) { left:35%; }
.social-visual button:nth-of-type(3) { right:0; }
.copyright { position:relative; z-index:1; display:grid; place-items:center; height:calc(82 * var(--u)); color:white; background:var(--wine); font-size:calc(15 * var(--u)); line-height:1.25; letter-spacing:calc(-.45 * var(--u)); text-align:center; font-variation-settings:'opsz' 14; }
[data-node-id="61:115"] > span { letter-spacing:calc(-1.47 * var(--u)); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; z-index:100; top:8px; left:8px; padding:10px; background:var(--cream); color:var(--wine); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.menu-panel { position:fixed; z-index:20; right:max(12px,calc((100vw - 560px) / 2 + 12px)); top:28px; width:min(310px,calc(100vw - 24px)); padding:54px 24px 24px; background:var(--cream); color:var(--wine); border-radius:20px; box-shadow:0 16px 80px rgb(0 0 0 / .5); }
.menu-panel[hidden] { display:none; }
.menu-panel a { display:block; padding:12px 0; border-bottom:1px solid #ded4c8; font-weight:600; text-decoration:none; }
.menu-close,.modal-close { position:absolute; right:12px; top:8px; border:0; padding:6px 10px; color:var(--wine); background:transparent; font-size:30px; line-height:1; }
.modal { width:min(440px,calc(100vw - 28px)); max-height:90svh; border:0; border-radius:18px; padding:0; background:var(--cream); color:var(--wine); }
.modal::backdrop { background:rgb(0 0 0 / .8); }
.modal-body { padding:46px 24px 28px; }
.modal-body h2 { font-family:'Gloock',serif; font-size:30px; line-height:1.05; margin-bottom:16px; }
.modal-body p { font-size:16px; line-height:1.45; }
.modal .purchase-button { --u:1px; width:100%; margin:24px 0 0; min-height:50px; font-size:14px; }
.video-modal { width:min(900px,calc(100vw - 28px)); }
#video-slot iframe,#video-slot video { width:100%; aspect-ratio:16/9; border:0; display:block; }
#video-slot iframe.is-vertical { aspect-ratio:9/16; max-height:70svh; }
@media (prefers-reduced-motion:no-preference) {
 .menu-panel:not([hidden]) { animation:menu-in .25s ease-out; }
 .modal[open] { animation:modal-in .2s ease-out; }
 @keyframes menu-in { from { opacity:0; transform:translateY(-8px); } }
 @keyframes modal-in { from { opacity:0; transform:scale(.98); } }
}
@media (prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} *,*::before,*::after { animation:none!important; transition:none!important; } }
