/* Site completion pass: final CTA, About, FAQ, footer. Builds on /assets/site.css tokens. */

/* ── Final CTA ── */
.final.final-cta{padding:clamp(84px,11vw,128px) 0}
.final-cta .final-art img{animation:ctaDrift 38s ease-in-out infinite alternate;transform-origin:50% 45%}
@keyframes ctaDrift{from{transform:scale(1.04) translateY(0)}to{transform:scale(1.1) translateY(-14px)}}
.final-cta .final-glow{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(60% 55% at 50% 58%,hsl(204 70% 80%/.28),transparent 70%),
             radial-gradient(40% 35% at 50% 40%,hsl(44 80% 70%/.22),transparent 70%)}
.final-cta .final-dust{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.55;
  background-image:radial-gradient(1.5px 1.5px at 12% 30%,hsl(44 90% 80%) 50%,transparent 51%),
    radial-gradient(1px 1px at 28% 70%,#fff 50%,transparent 51%),
    radial-gradient(1.5px 1.5px at 46% 22%,hsl(200 80% 88%) 50%,transparent 51%),
    radial-gradient(1px 1px at 64% 62%,hsl(44 90% 80%) 50%,transparent 51%),
    radial-gradient(1.5px 1.5px at 82% 34%,#fff 50%,transparent 51%),
    radial-gradient(1px 1px at 90% 76%,hsl(200 80% 88%) 50%,transparent 51%);
  animation:ctaDust 16s linear infinite}
@keyframes ctaDust{from{transform:translateY(0)}to{transform:translateY(-40px)}}
.final-eyebrow{font-size:.74rem;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-dark);
  font-weight:600;margin-bottom:12px}
.final-cta .pb-final{transition:transform .35s ease,filter .35s ease}
.final-cta .pb-final:hover,.final-cta .pb-final:focus-visible{transform:translateY(-2px) scale(1.03);
  filter:drop-shadow(0 0 14px hsl(44 90% 65%/.6)) drop-shadow(0 0 28px hsl(204 80% 70%/.35))}
@media (prefers-reduced-motion:reduce){.final-cta .final-art img,.final-cta .final-dust{animation:none}}

/* ── Footer ── */
.sf .sf-grid{grid-template-columns:1.7fr 1fr 1fr 1fr}
.sf::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.05;
  background:url(/assets/art/archive-home.webp) center/cover;mix-blend-mode:luminosity}
.sf .wrap{position:relative;z-index:1}
.sf .sf-brand p{color:hsl(210 20% 72%)}
.sf-social{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:16px}
/* Below 1080px the site's plain `nav` rule turns every <nav> into the slide-in menu panel:
   fixed to the viewport, a cream backdrop, parked off-screen until the burger opens it. The
   footer row is a <nav> too, so it opts out of that panel and stays an ordinary inline row. */
.sf .sf-social{position:static;inset:auto;transform:none;background:none;backdrop-filter:none;
  box-shadow:none;padding:0;margin-left:0;flex-direction:row;font-weight:400;text-transform:none;
  transition:none}
/* Both marks keep their own silhouette at the same size, so neither sits inside a drawn ring. */
.sf .sf-social a{display:inline-flex;align-items:center;justify-content:center;position:relative;
  width:40px;height:40px;padding:0;border:0;font-size:.82rem;letter-spacing:.06em;color:var(--gold-body);
  transition:color .28s ease,transform .28s ease,filter .28s ease}
.sf .sf-social a:hover,.sf .sf-social a:focus-visible{color:var(--gold-light);transform:translateY(-2px);
  filter:drop-shadow(0 0 9px rgba(201,162,39,.55))}
.sf-ico{display:block;width:23px;height:23px;fill:currentColor}
/* The shared footer nav sits inside a <nav>, so the site's link-underline rule would draw a
   gold bar under a glyph that has no word to underline. */
.sf .sf-social a::after{display:none}
.sf-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){.sf .sf-social a{transition:none}}
.sf-cookie{background:none;border:0;padding:4px 0;font:inherit;color:rgba(251,246,236,.72);cursor:pointer}
.sf-cookie:hover{color:var(--gold-bright)}
.sf .ft-end{justify-content:center}
.sf .stamp:empty,.sf .stamp{margin-top:14px}
@media (max-width:820px){.sf .sf-grid{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.sf .sf-grid{grid-template-columns:1fr}}

/* ── About ── */
.ab h2{margin-top:40px}
.ab-list{list-style:none;margin:6px 0 10px!important;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 34px;counter-reset:ab}
.ab-list li{counter-increment:ab;position:relative;padding:14px 0 14px 46px;border-bottom:1px solid rgba(201,162,39,.2);margin:0!important}
.ab-list li::before{content:counter(ab,upper-roman);position:absolute;left:0;top:14px;width:32px;
  font-family:var(--f-d);color:var(--gold-dark);font-size:1rem;text-align:center}
.ab-list b{display:block;font-family:var(--f-d);font-weight:400!important;font-size:1.06rem;letter-spacing:.04em;margin-bottom:3px}
.ab-list span{color:#33465c;font-size:.95rem;line-height:1.55}
.ab-addr{font-family:var(--f-d);color:var(--blue)}
.ab-mail{font-family:var(--f-d);font-size:1.2rem}
#contact{scroll-margin-top:110px}

/* ── Contact ── */
.doc-back{display:inline-block;margin-bottom:22px;font-family:var(--f-d);font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dark)}
.doc-back:hover{color:var(--blue)}
.ct h2{margin-top:36px}
.ct h2:first-child{margin-top:0}
.sheet-doc .ct-list{margin:6px 0 0;display:block}
.ct-list div{padding:14px 0;border-bottom:1px solid rgba(201,162,39,.2)}
.ct-list dt{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dark);font-weight:600;margin-bottom:4px}
/* Number and address in the prose face: Marcellus draws 1 as I and 0 as O, which misreads a company number. */
.sheet-doc .ct-list dd{margin:0;font-family:var(--f-u);color:var(--blue);font-size:1.08rem;overflow-wrap:anywhere}
.ct-list dd .ab-mail{font-size:1.2rem}
@media (max-width:700px){.ab-list{grid-template-columns:1fr}}

/* ── FAQ ── */
.faq{max-width:860px;margin:0 auto;padding:18px 44px;border-radius:22px;
  background:linear-gradient(180deg,rgba(255,252,244,.94),rgba(248,240,222,.9));
  border:1px solid rgba(201,162,39,.32);box-shadow:0 22px 60px rgba(20,40,70,.1)}
.faq-row{border-bottom:1px solid rgba(201,162,39,.24)}
.faq-row:last-child{border-bottom:0}
.faq-row summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;
  padding:20px 2px;font-family:var(--f-d);font-size:1.18rem;color:var(--blue);transition:color .25s}
.faq-row summary::-webkit-details-marker{display:none}
.faq-row summary span{flex:1}
.faq-row summary:hover{color:var(--gold-dark)}
.faq-row summary i{position:relative;width:14px;height:14px;flex:none}
.faq-row summary i::before,.faq-row summary i::after{content:'';position:absolute;left:0;right:0;top:6px;height:2px;
  background:var(--gold);transition:transform .3s}
.faq-row summary i::after{transform:rotate(90deg)}
.faq-row[open] summary i::after{transform:rotate(0)}
.faq-a{padding:0 2px 20px;color:#33465c;max-width:68ch}
.faq-a p{margin-bottom:10px}
.faq-a a{color:var(--blue-light);text-decoration:underline;text-underline-offset:3px}
@media (max-width:700px){.faq{padding:6px 20px;border-radius:16px}.faq-row summary{font-size:1.04rem;padding:17px 0}}

/* ── Final CTA polish: less haze, smaller plaque, one-line subtitle ── */
.final-cta .final-art::after{background:linear-gradient(180deg,rgba(251,246,236,.72),rgba(251,246,236,.18) 42%,rgba(251,246,236,.5))}
.final-cta .final-art img{filter:saturate(1.12)}
.final-cta .pb-final{width:285px}
.final-cta .final-in>p:not(.final-eyebrow){color:#2c3a4e;font-weight:500;text-shadow:0 0 12px rgba(251,246,236,.9),0 0 3px rgba(251,246,236,.8)}
@media (min-width:761px){.final-cta .final-in>p:not(.final-eyebrow){white-space:nowrap;max-width:none}}
@media (max-width:760px){.final-cta .pb-final{width:245px}}

/* ── Compact footer ── */
footer.sf{padding:40px 0 22px}
.sf .sf-grid{grid-template-columns:minmax(210px,1.15fr) 1.15fr .95fr .8fr 1.25fr;gap:28px 26px;max-width:1120px;margin:0 auto}
.sf .sf-game{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-content:start}
.sf .sf-game h5{grid-column:1/-1}
.sf .ft a{padding:3px 0}
.sf .sf-brand img{width:96px}
.sf .sf-brand p{font-size:.86rem}
@media (max-width:820px){.sf .sf-grid{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.sf .sf-grid{grid-template-columns:1fr}}

.final-cta .final-art::after{background:linear-gradient(180deg,rgba(251,246,236,.6),rgba(251,246,236,.35) 30%,rgba(251,246,236,.35) 70%,rgba(251,246,236,.6))}
.final-cta .final-in{position:relative}
.final-cta .final-in::before{content:'';position:absolute;inset:-40px -12%;z-index:-1;background:radial-gradient(ellipse at center,rgba(251,246,236,.85) 0,rgba(251,246,236,.6) 45%,transparent 72%);pointer-events:none}
.final-cta .final-in{isolation:isolate}

@media (max-width:600px){
  body{font-size:16px}
  .wrap{padding-left:16px;padding-right:16px}
  header .hd{padding-left:12px;padding-right:12px;gap:8px}
  header.stuck .brand img{width:104px}
  header nav{top:54px;max-height:calc(100svh - 54px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(12px,env(safe-area-inset-bottom))}
  header nav:not(.open){visibility:hidden;pointer-events:none}
  header nav a{padding:11px 20px}
  header .pb-head{width:112px}
  .doc{padding:92px 0 50px}
  .doc-head{margin-bottom:30px}
  .doc-head h1{font-size:clamp(2rem,11vw,2.75rem);overflow-wrap:anywhere}
  .doc-head p{font-size:.94rem;line-height:1.55}
  .sheet-doc{padding:24px 16px 28px;border-radius:12px}
  .sheet-doc h2{font-size:1.42rem;line-height:1.2;margin-top:30px}
  .sheet-doc h3{font-size:1.1rem}
  .sheet-doc p,.sheet-doc li{overflow-wrap:anywhere}
  .sheet-doc table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .faq{padding:4px 14px}
  .faq-row summary{gap:10px;font-size:1rem;line-height:1.35}
  footer.sf{padding:32px 0 18px}
  .sf .sf-grid{grid-template-columns:1fr 1fr;gap:22px 18px}
  .sf .sf-brand{grid-column:1/-1}
  .sf .sf-game{grid-template-columns:1fr 1fr}
  .back{right:10px;bottom:10px}
}
@media (max-width:340px){.sf .sf-grid{grid-template-columns:1fr}.sf .sf-brand{grid-column:auto}}

/* Adult-only notices use the existing type and palette. */
.hero .age-notice{font-family:var(--f-b);font-size:.8rem;line-height:1.5;color:var(--ivory-warm);text-shadow:0 1px 3px var(--navy-deep),0 0 12px var(--navy-deep);margin:0;max-width:38ch;padding:0 12px;text-align:center}
.final-cta .final-in>p.age-notice{font-size:.8rem;line-height:1.5;white-space:normal;max-width:38ch;margin:12px auto 0;font-weight:400}
.sf .sf-age{text-align:center;font-size:.8rem;line-height:1.5}
.sf .sf-co{border-top:0;padding-top:8px}
@media (max-width:760px){.sf .sf-co{padding-right:60px;padding-left:60px}}

/* Legal documents (Terms, Privacy, Refund, Cookie) — approved texts, word for word */
.legal-doc .legal-title{font-size:1.6rem;margin:0 0 4px}
.legal-doc .legal-brand{letter-spacing:.18em;font-weight:600;margin:0 0 2px}
.legal-doc .legal-meta{opacity:.75;font-size:.92rem;margin:0 0 18px}
.legal-doc h2{margin-top:34px}
.legal-doc p.cl{margin:14px 0 6px;font-weight:600}
.legal-doc ul{margin:6px 0 14px;padding-left:22px}
.legal-doc li{margin:3px 0}