:root{
  --black:#070706;
  --black-2:#0d0d0b;
  --paper:#f6f3ea;
  --paper-dim:#e9e4d4;
  --white:#ffffff;
  --gold:#c6a15b;
  --gold-bright:#e6c789;
  --gold-dim:#8a6f3c;
  --line-on-black:rgba(246,243,234,0.16);
  --line-on-black-strong:rgba(246,243,234,0.34);
  --line-on-paper:rgba(7,7,6,0.14);
  --line-on-paper-strong:rgba(7,7,6,0.4);
  --serif:'Fraunces',ui-serif,Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --maxw:1180px;
  --section-pad: clamp(64px, 9vw, 128px);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top: calc(78px + env(safe-area-inset-top,0px));}
body{
  margin:0;
  background:var(--black);
  color:var(--paper);
  font-family:var(--sans);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  padding-top: env(safe-area-inset-top,0px);
  padding-bottom: env(safe-area-inset-bottom,0px);
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
}

img,svg{max-width:100%;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
section{position:relative;}

/* ---------- Blueprint grid backdrop ---------- */
.grid-field{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line-on-black) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-on-black) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 85%);
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 85%);
  opacity:0.55;
}
.on-paper .grid-field{
  background-image:
    linear-gradient(var(--line-on-paper) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-on-paper) 1px, transparent 1px);
}

/* corner registration ticks, like a technical drawing sheet */
.tick-frame{position:absolute; inset:18px; pointer-events:none; border:0;}
.tick-frame::before,.tick-frame::after{content:"";position:absolute;width:18px;height:18px;}
.crosshair{position:absolute; width:22px; height:22px; opacity:0.5;}
.crosshair svg{width:100%; height:100%;}

/* ---------- Type ---------- */
h1,h2,h3,h4{font-family:var(--serif); font-weight:500; margin:0; letter-spacing:-0.01em;}
h1{font-size:clamp(2.6rem,6vw,4.6rem); line-height:1.02; font-weight:500;}
h2{font-size:clamp(1.9rem,3.6vw,3rem); line-height:1.08;}
h3{font-size:clamp(1.2rem,2vw,1.5rem); line-height:1.25;}
p{margin:0;}
.lede{font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--paper-dim); max-width:52ch; line-height:1.65;}
.on-paper .lede{color:#3a352a;}
.eyebrow{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.14em;
  color:var(--gold); display:flex; align-items:center; gap:10px;
}
.eyebrow .num{color:var(--gold-dim);}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--gold); display:inline-block;}
.kicker-line{display:flex;align-items:center;gap:14px;margin-bottom:18px;}

.gold-italic{font-style:italic; color:var(--gold-bright);}

/* ---------- Nav ---------- */
header.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding-top:env(safe-area-inset-top,0px);
  background:rgba(7,7,6,0.86); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-on-black);
}
.nav-inner{
  max-width:var(--maxw); margin:0 auto; padding:16px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand{display:flex; align-items:center; gap:10px; font-family:var(--serif); font-size:1.18rem; letter-spacing:0.01em; text-decoration:none; color:var(--white);}
.brand svg{width:30px;height:30px;flex:none;}
.brand b{font-weight:600;}
.brand .brand-sub{font-family:var(--mono); font-size:0.6rem; letter-spacing:0.18em; color:var(--gold); display:block; margin-top:2px;}
nav.links{display:flex; gap:30px; align-items:center;}
nav.links a{
  font-size:0.86rem; text-decoration:none; color:var(--paper-dim);
  position:relative; padding:4px 0; transition:color .2s ease;
}
nav.links a:hover, nav.links a:focus-visible{color:var(--white);}
nav.links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--gold);
  transition:right .25s ease;
}
nav.links a:hover::after,nav.links a:focus-visible::after{right:0;}
.nav-cta{
  font-family:var(--mono); font-size:0.76rem; letter-spacing:0.04em;
  border:1px solid var(--gold); color:var(--gold-bright); padding:9px 18px;
  text-decoration:none; white-space:nowrap; transition:background .2s ease,color .2s ease;
}
.nav-cta:hover{background:var(--gold); color:var(--black);}
.nav-toggle{display:none; background:none; border:1px solid var(--line-on-black-strong); width:42px;height:42px; color:var(--white); align-items:center; justify-content:center;}

@media (max-width: 900px){
  nav.links{position:fixed; inset:78px 0 0 0; background:var(--black); flex-direction:column; padding:36px 28px; gap:28px; transform:translateX(100%); transition:transform .3s ease; overflow-y:auto;}
  nav.links.open{transform:translateX(0);}
  nav.links a{font-size:1.2rem;}
  .nav-toggle{display:flex;}
  .nav-cta{display:none;}
  nav.links .nav-cta{display:inline-block; margin-top:6px;}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:0.8rem; letter-spacing:0.05em;
  padding:16px 30px; text-decoration:none; border:1px solid var(--gold);
  color:var(--gold-bright); background:transparent;
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .2s ease;
}
.btn:hover{background:var(--gold); color:var(--black); transform:translateY(-1px);}
.btn.ghost{border-color:var(--line-on-black-strong); color:var(--paper);}
.btn.ghost:hover{background:var(--paper); color:var(--black); border-color:var(--paper);}
.on-paper .btn.ghost{color:var(--black); border-color:var(--line-on-paper-strong);}
.on-paper .btn.ghost:hover{background:var(--black); color:var(--paper); border-color:var(--black);}
.btn svg{width:16px;height:16px;}
.btn-row{display:flex; gap:16px; flex-wrap:wrap;}

/* ---------- infographic-style reveal: pieces assemble in sequence ---------- */
.line-draw{overflow:visible;}
.line-draw path,.line-draw line,.line-draw polyline{stroke-linecap:round; stroke-linejoin:round;}
.line-draw > *{
  opacity:0;
  transform:translateY(7px) scale(0.96);
  transform-origin:center;
  transition:opacity .5s cubic-bezier(.16,.84,.44,1), transform .5s cubic-bezier(.16,.84,.44,1);
}
.line-draw.in > *{
  opacity:1;
  transform:translateY(0) scale(1);
}
@media (prefers-reduced-motion: reduce){
  .line-draw > *{opacity:1; transform:none; transition:none;}
}

/* ---------- reveal ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}

/* ================= HERO ================= */
.hero{padding:calc(var(--section-pad) + 70px) 0 var(--section-pad); overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center;}
.hero-copy .eyebrow{margin-bottom:26px;}
.hero h1{margin-bottom:26px;}
.hero .lede{margin-bottom:36px;}
.hero-stats{display:flex; gap:38px; margin-top:56px; flex-wrap:wrap;}
.hero-stat b{font-family:var(--serif); font-size:2.1rem; color:var(--white); display:block; font-weight:500;}
.hero-stat span{font-family:var(--mono); font-size:0.7rem; color:var(--gold); letter-spacing:0.06em;}
.hero-art{position:relative; aspect-ratio:1/1;}
.hero-art svg{width:100%; height:100%;}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-art{max-width:420px; margin:0 auto;}
}

/* ================= WHY / MARQUEE STRIP ================= */
.strip{
  border-top:1px solid var(--line-on-black); border-bottom:1px solid var(--line-on-black);
  padding:22px 0; overflow:hidden; white-space:nowrap;
}
.strip-track{display:inline-flex; gap:56px; animation:scrollstrip 34s linear infinite;}
.strip-track span{font-family:var(--mono); font-size:0.8rem; letter-spacing:0.08em; color:var(--paper-dim); display:inline-flex; align-items:center; gap:14px;}
.strip-track span::after{content:"◆"; color:var(--gold); font-size:0.55rem;}
@keyframes scrollstrip{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ================= SECTION HEAD ================= */
.section-head{max-width:640px; margin-bottom:64px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* ================= WHY GRID ================= */
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black);}
.why-card{background:var(--black); padding:38px 32px; display:flex; flex-direction:column; gap:18px;}
.why-card svg{width:44px;height:44px;}
.why-card h3{color:var(--white);}
.why-card p{color:var(--paper-dim); font-size:0.94rem;}
@media (max-width:820px){.why-grid{grid-template-columns:1fr;}}

/* ================= HOW IT WORKS ================= */
.how-grid{display:grid; grid-template-columns:1fr 0.95fr; gap:64px; align-items:start;}
.how-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:26px;}
.how-list li{display:flex; gap:18px;}
.how-num{font-family:var(--mono); font-size:0.72rem; color:var(--gold-dim); padding-top:3px; flex:none; width:26px;}
.how-list h3{color:var(--white); font-size:1.05rem; margin-bottom:6px;}
.how-list p{color:var(--paper-dim); font-size:0.9rem;}
.how-card{border:1px solid var(--line-on-black-strong); padding:28px; background:var(--black-2);}
.how-card-top{display:flex; justify-content:space-between; margin-bottom:18px;}
.how-tag{font-family:var(--mono); font-size:0.66rem; letter-spacing:0.06em; color:var(--gold);}
.how-tag.dim{color:var(--paper-dim);}
.how-art{width:100%; display:block; margin-bottom:22px;}
.how-price-row{display:flex; justify-content:space-between; margin-bottom:18px;}
.how-price-row > div{display:flex; flex-direction:column; gap:6px;}
.how-price-row > div:last-child{text-align:right;}
.how-label{font-family:var(--mono); font-size:0.62rem; letter-spacing:0.08em; color:var(--paper-dim);}
.how-value{font-family:var(--serif); font-size:1.5rem; color:var(--white);}
.how-progress{height:3px; background:var(--line-on-black); margin-bottom:8px;}
.how-progress-fill{height:100%; width:84%; background:var(--gold);}
.how-progress-labels{display:flex; justify-content:space-between; font-family:var(--mono); font-size:0.68rem; color:var(--paper-dim); margin-bottom:26px;}
.how-cta{width:100%; justify-content:center;}
@media (max-width:900px){.how-grid{grid-template-columns:1fr;}}

/* ================= PROCESS ================= */
.process-wrap{display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative;}
.process-step{padding:0 28px 0 0; position:relative;}
.process-step + .process-step{padding-left:40px;}
.process-line{position:absolute; top:26px; left:0; right:0; height:1px; background:var(--line-on-black); z-index:0;}
.process-num{
  font-family:var(--mono); font-size:0.78rem; color:var(--gold-bright); background:var(--black);
  border:1px solid var(--gold-dim);
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  position:relative; z-index:1; margin-bottom:26px;
}
.process-step h3{margin-bottom:12px; color:var(--white);}
.process-step p{color:var(--paper-dim); font-size:0.95rem;}
@media (max-width:820px){
  .process-wrap{grid-template-columns:1fr; gap:44px;}
  .process-line{display:none;}
  .process-step + .process-step{padding-left:0;}
}

/* ================= COMPLIANCE (paper section) ================= */
.on-paper{background:var(--paper); color:var(--black);}
.on-paper h2,.on-paper h3{color:var(--black);}
.on-paper .how-list p{color:#3a352a;}
.on-paper .eyebrow{color:var(--gold-dim);}
.compliance-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
.compliance-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0;}
.compliance-list li{
  display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line-on-paper); align-items:flex-start;
}
.compliance-list li svg{flex:none; width:22px; height:22px; margin-top:2px;}
.compliance-list li span{font-size:0.95rem; color:#2c2820;}
.compliance-art{position:relative;}
.compliance-art svg{width:100%; height:auto;}
@media (max-width:820px){.compliance-grid{grid-template-columns:1fr; gap:40px;}}

/* ================= FEATURES ================= */
.feat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black);}
.feat-card{background:var(--black); padding:30px 24px; min-height:190px; display:flex; flex-direction:column; gap:14px; transition:background .25s ease;}
.feat-card:hover{background:var(--black-2);}
.feat-card svg{width:32px;height:32px;}
.feat-card h4{font-family:var(--sans); font-weight:600; font-size:0.98rem; color:var(--white);}
.feat-card p{font-size:0.84rem; color:var(--paper-dim); line-height:1.55;}
.feat-tag{font-family:var(--mono); font-size:0.62rem; color:var(--gold); letter-spacing:0.08em;}
@media (max-width:980px){.feat-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.feat-grid{grid-template-columns:1fr;}}

/* ================= GAMES ================= */
.games-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black); margin-top:60px;}
.game-card{background:var(--black); padding:52px 44px;}
.game-card .eyebrow{margin-bottom:20px;}
.game-art{width:100%; max-width:240px; margin:34px 0;}
.game-card ul{list-style:none; margin:26px 0 0; padding:0; display:flex; flex-direction:column; gap:12px;}
.game-card li{font-size:0.9rem; color:var(--paper-dim); display:flex; gap:10px;}
.game-card li::before{content:"—"; color:var(--gold);}
@media (max-width:820px){.games-grid{grid-template-columns:1fr;}}

/* ================= APP BANNER ================= */
.app-banner{
  border:1px solid var(--line-on-black); padding:56px; margin-top:72px;
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px; align-items:center; position:relative;
}
.app-art{justify-self:end;}
.app-art svg{width:220px;}
.app-badges{display:flex; gap:14px; margin-top:26px;}
.app-badges span{font-family:var(--mono); font-size:0.72rem; border:1px solid var(--line-on-black-strong); padding:9px 14px; color:var(--paper-dim);}
@media (max-width:820px){.app-banner{grid-template-columns:1fr; text-align:left;} .app-art{justify-self:start;}}

/* ================= PRICING ================= */
.pricing-toggle{display:inline-flex; border:1px solid var(--line-on-black-strong); margin-bottom:56px;}
.pricing-toggle button{
  font-family:var(--mono); font-size:0.8rem; letter-spacing:0.04em; padding:12px 26px; background:none; border:none;
  color:var(--paper-dim); cursor:pointer; transition:background .2s ease,color .2s ease;
}
.pricing-toggle button.active{background:var(--gold); color:var(--black);}
.price-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black);}
.price-card{background:var(--black); padding:44px 36px; display:flex; flex-direction:column; position:relative;}
.price-card.popular{background:var(--black-2);}
.price-card .pill{
  position:absolute; top:0; right:0; font-family:var(--mono); font-size:0.62rem; letter-spacing:0.08em;
  background:var(--gold); color:var(--black); padding:6px 14px;
}
.price-card h3{color:var(--white); margin-bottom:10px;}
.price-card .desc{font-size:0.86rem; color:var(--paper-dim); margin-bottom:30px; min-height:42px;}
.price-amount{display:flex; align-items:baseline; gap:6px; margin-bottom:4px;}
.price-amount .sym{font-family:var(--serif); font-size:1.4rem; color:var(--gold);}
.price-amount .num{font-family:var(--serif); font-size:3rem; color:var(--white); font-weight:500;}
.price-amount .per{font-family:var(--mono); font-size:0.78rem; color:var(--paper-dim);}
.price-sub{font-family:var(--mono); font-size:0.72rem; color:var(--gold-dim); margin-bottom:32px;}
.price-card ul{list-style:none; margin:0 0 36px; padding:0; display:flex; flex-direction:column; gap:13px; flex:1;}
.price-card li{font-size:0.87rem; color:var(--paper-dim); display:flex; gap:10px; align-items:flex-start;}
.price-card li svg{width:15px;height:15px; flex:none; margin-top:3px; stroke:var(--gold);}
.price-card .btn{justify-content:center; width:100%;}
.price-view{display:none;}
.price-view.active{display:grid;}
@media (max-width:980px){.price-grid{grid-template-columns:1fr;}}

/* ================= COMPARE ================= */
.compare-table{width:100%; border-collapse:collapse; margin-top:20px;}
.compare-table th,.compare-table td{padding:16px 18px; border-bottom:1px solid var(--line-on-black); text-align:left; font-size:0.88rem;}
.compare-table thead th{font-family:var(--mono); font-size:0.74rem; letter-spacing:0.05em; color:var(--paper-dim); font-weight:400;}
.compare-table thead th.us{color:var(--gold);}
.compare-table td.center,.compare-table th.center{text-align:center;}
.compare-table tbody td:first-child{color:var(--paper); font-family:var(--sans);}
.compare-table svg.yes{stroke:var(--gold); width:17px;height:17px;}
.compare-table svg.no{stroke:var(--line-on-black-strong); width:17px;height:17px;}
.compare-scroll{overflow-x:auto;}

/* ================= FAQ ================= */
.faq-list{max-width:820px; margin:0 auto; display:flex; flex-direction:column;}
.faq-item{border-bottom:1px solid var(--line-on-black);}
.faq-item summary{
  list-style:none; cursor:pointer; padding:26px 0; display:flex; align-items:center; justify-content:space-between; gap:24px;
  font-family:var(--serif); font-size:1.08rem; color:var(--white);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-plus{position:relative; width:20px; height:20px; flex:none;}
.faq-plus::before,.faq-plus::after{content:""; position:absolute; background:var(--gold); transition:transform .3s ease;}
.faq-plus::before{left:0;top:9px;width:20px;height:1px;}
.faq-plus::after{left:9px;top:0;width:1px;height:20px;}
.faq-item[open] .faq-plus::after{transform:rotate(90deg); opacity:0;}
.faq-body{padding:0 0 28px; color:var(--paper-dim); font-size:0.95rem; max-width:70ch;}

/* ================= REVIEWS ================= */
.review-strip{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-paper); border:1px solid var(--line-on-paper); margin-top:56px;}
.review-card{background:var(--paper); padding:32px 28px;}
.stars{color:var(--gold-dim); font-size:0.9rem; margin-bottom:16px; letter-spacing:2px;}
.review-card p{font-size:0.92rem; color:#3a352a; line-height:1.6; margin-bottom:18px;}
.review-name{font-family:var(--mono); font-size:0.74rem; color:var(--gold-dim);}
@media (max-width:820px){.review-strip{grid-template-columns:1fr;}}

/* ================= CTA / CONTACT ================= */
.cta{padding:var(--section-pad) 0; text-align:center; position:relative;}
.cta h2{max-width:760px; margin:0 auto 28px;}
.cta .lede{margin:0 auto 44px;}
.contact-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black); margin-top:64px; text-align:left;}
.contact-card{background:var(--black); padding:34px 30px;}
.contact-card svg{width:26px;height:26px; margin-bottom:18px;}
.contact-card h4{font-family:var(--sans); font-weight:600; color:var(--white); font-size:0.9rem; margin-bottom:8px;}
.contact-card p, .contact-card a{font-size:0.92rem; color:var(--paper-dim); text-decoration:none;}
.contact-card a:hover{color:var(--gold);}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr;}}

/* ================= REVIEWS ================= */
.reviews-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:0;}
.review-widget{display:grid; grid-template-columns:0.8fr 2fr; gap:1px; background:var(--line-on-paper); border:1px solid var(--line-on-paper); margin-top:56px;}
.review-widget-id{background:var(--paper); padding:36px 28px; display:flex; flex-direction:column; align-items:flex-start;}
.review-mark{width:40px; height:40px; margin-bottom:16px;}
.review-mark-name{font-family:var(--serif); font-size:1.05rem; color:#070706;}
.review-mark-sub{font-family:var(--mono); font-size:0.68rem; color:#8a6f3c; margin-top:4px;}
.review-mark-count{font-size:0.86rem; color:#3a352a; margin-bottom:6px;}
.review-mark-google{font-family:var(--mono); font-size:0.68rem; color:#8a6f3c;}
.review-widget .review-strip{grid-template-columns:repeat(3,1fr); border:none; background:var(--line-on-paper); margin-top:0;}
@media (max-width:900px){.review-widget{grid-template-columns:1fr;} .review-widget .review-strip{grid-template-columns:1fr;}}

/* ================= FOOT EXTRAS ================= */
.foot-resources{
  display:flex; flex-wrap:wrap; gap:12px 28px; padding:28px 0; margin-top:8px;
  border-top:1px solid var(--line-on-black); font-family:var(--mono); font-size:0.72rem;
}
.foot-resources a{color:var(--paper-dim); text-decoration:none;}
.foot-resources a:hover{color:var(--gold);}
.foot-banner{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:28px;
  margin-top:56px; padding:40px 0; border-top:1px solid var(--line-on-black);
}
.foot-banner-eyebrow{font-size:0.9rem; color:var(--paper-dim); margin-bottom:8px;}
.foot-banner-title{font-family:var(--serif); font-size:clamp(1.6rem,3vw,2.3rem); color:var(--white); font-weight:500;}
.foot-banner-right{display:flex; align-items:center; gap:28px; flex-wrap:wrap;}
.dmca-badge{display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:0.62rem; letter-spacing:0.03em; color:var(--paper-dim); line-height:1.3;}
.dmca-badge svg{width:24px;height:24px; flex:none;}

/* ================= FOOTER ================= */
footer{border-top:1px solid var(--line-on-black); padding:64px 0 40px;}
.foot-brand-mark{margin-bottom:48px; text-decoration:none;}
.foot-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:40px;}
.foot-brand p{color:var(--paper-dim); font-size:0.88rem; margin-top:16px; max-width:32ch;}
.foot-col h5{font-family:var(--mono); font-size:0.7rem; letter-spacing:0.08em; color:var(--gold); margin-bottom:18px; font-weight:400;}
.foot-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
.foot-col a{color:var(--paper-dim); text-decoration:none; font-size:0.86rem;}
.foot-col a:hover{color:var(--white);}
.foot-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  padding-top:28px; border-top:1px solid var(--line-on-black);
  font-family:var(--mono); font-size:0.72rem; color:var(--paper-dim);
}
.foot-bottom a{text-decoration:underline; text-underline-offset:3px;}
@media (max-width:820px){.foot-grid{grid-template-columns:1fr 1fr; row-gap:36px;}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr;}}

::selection{background:var(--gold); color:var(--black);}

/* ================= THEME ADDITIONS ================= */

/* breadcrumb / page intro (used on inner pages) */
.page-intro{padding:calc(var(--section-pad) + 40px) 0 72px;}
.breadcrumb{font-family:var(--mono); font-size:0.72rem; color:var(--paper-dim); letter-spacing:0.04em; margin-bottom:24px; display:flex; gap:8px; align-items:center;}
.on-paper .breadcrumb{color:#6b6250;}
.breadcrumb a{color:var(--paper-dim); text-decoration:none;}
.breadcrumb a:hover{color:var(--gold);}
.on-paper .breadcrumb a{color:#6b6250;}

/* owner / no-hidden-fees banner */
.owner-banner{
  display:flex; align-items:center; gap:20px; border:1px solid var(--gold-dim);
  padding:22px 26px; margin-top:40px; max-width:640px;
}
.owner-banner svg{width:34px;height:34px; flex:none;}
.owner-banner strong{display:block; color:var(--white); font-family:var(--serif); font-size:1.02rem; margin-bottom:4px;}
.owner-banner span{font-size:0.86rem; color:var(--paper-dim);}
.owner-banner.center{margin-left:auto; margin-right:auto; max-width:720px;}

.owner-strip-outer{
  border-top:1px solid var(--line-on-black); border-bottom:1px solid var(--line-on-black);
  margin:0 0 var(--section-pad);
}
.owner-strip{
  display:flex; flex-wrap:wrap; gap:1px; background:var(--line-on-black);
}
.owner-strip > div{flex:1 1 260px; background:var(--black); padding:30px 28px; display:flex; gap:14px; align-items:flex-start;}
.owner-strip svg{width:22px;height:22px; flex:none; margin-top:2px;}
.owner-strip strong{display:block; color:var(--white); font-size:0.92rem; margin-bottom:4px;}
.owner-strip span{font-size:0.83rem; color:var(--paper-dim);}

/* product page (spin wheel / scratch card) hero */
.product-hero{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; padding-bottom:var(--section-pad);}
.product-hero-art{aspect-ratio:1/1;}
.product-hero-art svg{width:100%;height:100%;}
@media (max-width:900px){.product-hero{grid-template-columns:1fr;} .product-hero-art{max-width:380px; margin:0 auto;}}

.spec-list{list-style:none; margin:32px 0 0; padding:0; display:flex; flex-direction:column; gap:16px;}
.spec-list li{display:flex; gap:14px; font-size:0.94rem; color:var(--paper-dim);}
.spec-list li svg{width:18px;height:18px; flex:none; margin-top:3px; stroke:var(--gold);}

/* demos grid */
.demos-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black); margin-top:56px;}
.demo-card{background:var(--black); padding:34px 28px; display:flex; flex-direction:column; gap:14px; text-decoration:none; transition:background .2s ease;}
.demo-card:hover{background:var(--black-2);}
.demo-card .demo-num{font-family:var(--mono); font-size:0.7rem; color:var(--gold-dim);}
.demo-card h3{color:var(--white); font-size:1.1rem;}
.demo-card .demo-visit{font-family:var(--mono); font-size:0.72rem; color:var(--gold); display:inline-flex; align-items:center; gap:8px; margin-top:auto;}
.demo-card .demo-visit svg{width:13px;height:13px;}
@media (max-width:900px){.demos-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.demos-grid{grid-template-columns:1fr;}}

/* faq search */
.faq-search-wrap{max-width:520px; margin:0 auto 48px;}
.faq-search-wrap input{
  width:100%; background:transparent; border:1px solid var(--line-on-black-strong); color:var(--paper);
  font-family:var(--sans); font-size:0.95rem; padding:14px 18px; outline:none;
}
.faq-search-wrap input:focus{border-color:var(--gold);}
.faq-search-wrap input::placeholder{color:var(--paper-dim);}

/* simple content page (legal-style, if ever needed) */
.prose{max-width:72ch;}
.prose p{color:var(--paper-dim); margin-bottom:18px; line-height:1.7;}
.prose h2{color:var(--white); margin:40px 0 16px;}

/* contact form placeholder */
.form-placeholder{
  border:1px dashed var(--line-on-black-strong); padding:48px 32px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.form-placeholder svg{width:34px;height:34px;}
.form-placeholder strong{color:var(--white); font-family:var(--serif); font-size:1.1rem;}
.form-placeholder span{color:var(--paper-dim); font-size:0.88rem; max-width:40ch;}
.form-placeholder code{font-family:var(--mono); font-size:0.78rem; color:var(--gold); background:var(--black-2); padding:4px 10px; border:1px solid var(--line-on-black-strong);}

/* admin setup screen (renders in wp-admin, kept simple/system font) */
.rwd-setup-wrap{max-width:960px;}
.rwd-setup-wrap table.widefat td, .rwd-setup-wrap table.widefat th{vertical-align:middle;}
.rwd-status-ok{color:#1a7a37; font-weight:600;}
.rwd-status-missing{color:#a34d00; font-weight:600;}

/* ================= NAV DROPDOWN (Games) ================= */
.nav-drop{position:relative;}
.nav-drop > a::after{content:"▾"; font-size:0.6rem; margin-left:6px; opacity:0.7;}
.nav-drop-menu{
  list-style:none; margin:0; padding:10px 0; display:none; position:absolute; top:100%; left:0;
  background:var(--black); border:1px solid var(--line-on-black-strong); min-width:220px; z-index:20;
}
.nav-drop:hover .nav-drop-menu, .nav-drop:focus-within .nav-drop-menu{display:block;}
.nav-drop-menu li a{display:block; padding:10px 18px; font-size:0.85rem; color:var(--paper-dim); text-decoration:none;}
.nav-drop-menu li a:hover{color:var(--white); background:var(--black-2);}
@media (max-width:900px){
  .nav-drop-menu{display:block; position:static; border:none; background:none; padding:6px 0 6px 18px;}
  .nav-drop > a::after{display:none;}
  .nav-drop-menu li a{font-size:1rem; padding:8px 0; color:var(--paper-dim);}
}

/* current page indicator */
nav.links a.current{color:var(--white);}
nav.links a.current::after{right:0;}

/* skip link */
.skip-link{
  position:absolute; left:-999px; top:auto; background:var(--gold); color:var(--black);
  padding:12px 18px; z-index:200; font-family:var(--mono); font-size:0.8rem; text-decoration:none;
}
.skip-link:focus{left:12px; top:12px;}

/* contact page two-column layout */
.contact-layout{display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:start;}
@media (max-width:860px){.contact-layout{grid-template-columns:1fr;}}

/* ================= ELEGANCE PASS ================= */

/* Subtle film-grain texture, the signature most template sites skip.
   Fixed, ultra-low opacity, sits above every section including on-paper
   ones, never intercepts clicks. */
body::before{
  content:"";
  position:fixed; inset:0; z-index:999; pointer-events:none;
  opacity:0.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size:180px 180px;
}

/* Card hover: lift + soft gold-tinted shadow + a top accent line, instead
   of a flat background swap. Applied to every grid-cell card type. */
.why-card, .feat-card, .demo-card, .game-card, .price-card, .contact-card{
  position:relative;
  transition:background .25s ease, transform .35s cubic-bezier(.16,.84,.44,1), box-shadow .35s ease;
}
.why-card::before, .feat-card::before, .demo-card::before, .contact-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--gold); transform:scaleX(0); transform-origin:left;
  transition:transform .4s cubic-bezier(.16,.84,.44,1);
}
.why-card:hover, .feat-card:hover, .demo-card:hover, .contact-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px -18px rgba(0,0,0,0.55);
  z-index:2;
}
.why-card:hover::before, .feat-card:hover::before, .demo-card:hover::before, .contact-card:hover::before{
  transform:scaleX(1);
}
.price-card:hover{ transform:translateY(-4px); box-shadow:0 22px 40px -20px rgba(0,0,0,0.6); z-index:2; }

/* Corner registration ticks, reused as a running signature on every inner
   page intro, not just the hero and the compliance certificate. */
.page-intro{position:relative;}
.page-intro::before, .page-intro::after,
.page-intro .wrap::before, .page-intro .wrap::after{
  content:""; position:absolute; width:16px; height:16px; opacity:0.45; pointer-events:none;
}
.page-intro::before{top:20px; left:20px; border-left:1px solid var(--gold-dim); border-top:1px solid var(--gold-dim);}
.page-intro::after{top:20px; right:20px; border-right:1px solid var(--gold-dim); border-top:1px solid var(--gold-dim);}

/* Refined focus states, visible and on-brand rather than the browser default */
a:focus-visible, button:focus-visible, input:focus-visible, .btn:focus-visible, summary:focus-visible{
  outline:1.5px solid var(--gold);
  outline-offset:3px;
}

/* Slightly more considered button micro-interaction */
.btn{ letter-spacing:0.06em; }
.btn:active{ transform:translateY(0); }

/* Inline text links inside prose/FAQ bodies get the same underline-draw
   treatment as the nav, so the whole site feels like one hand drew it */
.faq-body a, .prose a{
  color:var(--gold-bright); text-decoration:none; position:relative; padding-bottom:1px;
  background-image:linear-gradient(var(--gold),var(--gold));
  background-repeat:no-repeat; background-position:0 100%; background-size:0% 1px;
  transition:background-size .3s ease;
}
.faq-body a:hover, .prose a:hover{ background-size:100% 1px; }

/* Slightly more generous card padding so grids read as a gallery, not a
   spreadsheet */
.feat-card{ padding:34px 28px; }
.why-card{ padding:42px 34px; }

/* Marquee strip: tighten tracking a touch, feels less templated */
.strip-track span{ letter-spacing:0.1em; }

/* ================= FEATURES PAGE, DETAILED ================= */
.feat-detail-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black);}
.feat-detail-card{background:var(--black); padding:44px 40px; display:flex; flex-direction:column; gap:18px;}
.feat-detail-card .icon-row{display:flex; align-items:center; gap:18px;}
.feat-detail-card .icon-row svg{width:52px; height:52px; flex:none;}
.feat-detail-card h3{font-family:var(--sans); font-weight:600; font-size:1.08rem; color:var(--white);}
.feat-detail-card p{color:var(--paper-dim); font-size:0.96rem; line-height:1.7;}
.feat-detail-card ul{list-style:none; margin:2px 0 0; padding:0; display:flex; flex-direction:column; gap:8px;}
.feat-detail-card li{font-size:0.85rem; color:var(--paper-dim); display:flex; gap:9px;}
.feat-detail-card li svg{width:13px;height:13px; flex:none; margin-top:4px; stroke:var(--gold);}
@media (max-width:900px){.feat-detail-grid{grid-template-columns:1fr;}}

/* ================= THEME SALES PAGE ================= */
.tpl-price-block{
  border:1px solid var(--gold-dim); padding:40px 36px; margin-top:36px; max-width:420px;
  display:flex; flex-direction:column; gap:6px;
}
.tpl-price-block .tpl-amount{display:flex; align-items:baseline; gap:8px;}
.tpl-price-block .tpl-amount .sym{font-family:var(--serif); font-size:1.6rem; color:var(--gold);}
.tpl-price-block .tpl-amount .num{font-family:var(--serif); font-size:3.4rem; color:var(--white); font-weight:500;}
.tpl-price-block .tpl-amount .per{font-family:var(--mono); font-size:0.8rem; color:var(--paper-dim);}
.tpl-price-block .tpl-sub{font-size:0.86rem; color:var(--paper-dim); margin-bottom:18px;}
.tpl-price-block .btn{width:100%; justify-content:center;}

.tpl-includes{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; max-width:520px;}
.tpl-includes li{display:flex; gap:12px; font-size:0.94rem; color:var(--paper-dim);}
.tpl-includes li svg{width:17px;height:17px; flex:none; margin-top:3px; stroke:var(--gold);}

.compat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-on-black); border:1px solid var(--line-on-black); margin-top:56px;}
.compat-card{background:var(--black); padding:30px 24px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px;}
.compat-card svg{width:38px;height:38px;}
.compat-card strong{font-family:var(--sans); font-weight:600; color:var(--white); font-size:0.9rem;}
.compat-card span{font-size:0.78rem; color:var(--paper-dim);}
@media (max-width:900px){.compat-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.compat-grid{grid-template-columns:1fr;}}

.spec-table{width:100%; border-collapse:collapse; margin-top:24px;}
.spec-table tr{border-bottom:1px solid var(--line-on-black);}
.spec-table td{padding:16px 4px; font-size:0.9rem; color:var(--paper-dim);}
.spec-table td:first-child{color:var(--white); font-family:var(--sans); font-weight:500; width:40%;}

.license-note{
  border:1px dashed var(--line-on-black-strong); padding:28px 30px; margin-top:40px;
  font-size:0.88rem; color:var(--paper-dim); max-width:640px;
}
.license-note strong{color:var(--white); display:block; margin-bottom:8px; font-family:var(--serif); font-size:1.02rem;}

/* ================= WPFORMS OVERRIDES ================= */
/* WPForms ships its own light-theme styles (black labels, default sans,
   rounded grey inputs). These override it to match the theme, scoped to
   .wpforms-container so nothing outside the form is touched. */
.wpforms-container{max-width:100%;}
.wpforms-container .wpforms-field-label,
.wpforms-container .wpforms-field-sublabel,
.wpforms-container legend.wpforms-field-label{
  color:var(--paper) !important;
  font-family:var(--sans) !important;
  font-weight:500 !important;
  font-size:0.9rem !important;
}
.wpforms-container .wpforms-field-required{color:var(--gold) !important;}
.wpforms-container .wpforms-field-description{
  color:var(--paper-dim) !important; font-family:var(--sans) !important; font-size:0.82rem !important;
}
.wpforms-container .wpforms-field{margin-bottom:22px !important;}
.wpforms-container .wpforms-field input[type=text],
.wpforms-container .wpforms-field input[type=email],
.wpforms-container .wpforms-field input[type=tel],
.wpforms-container .wpforms-field input[type=url],
.wpforms-container .wpforms-field input[type=number],
.wpforms-container .wpforms-field input[type=password],
.wpforms-container .wpforms-field select,
.wpforms-container .wpforms-field textarea{
  background:var(--black-2) !important;
  border:1px solid var(--line-on-black-strong) !important;
  border-radius:0 !important;
  color:var(--paper) !important;
  font-family:var(--sans) !important;
  font-size:0.92rem !important;
  padding:13px 16px !important;
  box-shadow:none !important;
  transition:border-color .2s ease;
}
.wpforms-container .wpforms-field input::placeholder,
.wpforms-container .wpforms-field textarea::placeholder{color:var(--paper-dim) !important; opacity:0.7;}
.wpforms-container .wpforms-field input:focus,
.wpforms-container .wpforms-field select:focus,
.wpforms-container .wpforms-field textarea:focus{
  border-color:var(--gold) !important; outline:none !important;
}
.wpforms-container .wpforms-submit-container{margin-top:8px;}
.wpforms-container button.wpforms-submit,
.wpforms-container input.wpforms-submit{
  font-family:var(--mono) !important; font-size:0.82rem !important; letter-spacing:0.06em !important;
  padding:16px 30px !important; border:1px solid var(--gold) !important; border-radius:0 !important;
  color:var(--gold-bright) !important; background:transparent !important;
  transition:background .25s ease, color .25s ease; cursor:pointer;
}
.wpforms-container button.wpforms-submit:hover,
.wpforms-container input.wpforms-submit:hover{background:var(--gold) !important; color:var(--black) !important;}
.wpforms-container .wpforms-error,
.wpforms-container label.wpforms-error,
.wpforms-container em.wpforms-error{
  color:#e88a7a !important; font-size:0.8rem !important; font-family:var(--sans) !important;
}
.wpforms-container .wpforms-field input.wpforms-error,
.wpforms-container .wpforms-field textarea.wpforms-error,
.wpforms-container .wpforms-field select.wpforms-error{border-color:#e88a7a !important;}
.wpforms-container .wpforms-confirmation-container,
.wpforms-container .wpforms-confirmation-container-full{
  border:1px solid var(--gold-dim) !important; background:transparent !important;
  color:var(--paper) !important; font-family:var(--sans) !important; padding:24px !important;
}