*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{
    background:var(--mustard);
    color:var(--ink);
    font-family:'Space Grotesk',system-ui,sans-serif;
    overflow-x:hidden;
    min-height:100vh;
  }
  ::selection{background:var(--ink);color:var(--mustard)}

/* ============ giant cropped brand ============ */
  .brand-band{
    position:relative;
    padding:18px 24px 0;
    overflow:hidden;
    pointer-events:none;
    user-select:none;
  }
  .brand-giant{
    font-family:'Anton',sans-serif;
    font-size:clamp(90px, 17vw, 260px);
    line-height:.82;
    letter-spacing:-.01em;
    text-transform:uppercase;
    white-space:nowrap;
    margin-left:-.04em;
    transform:translateY(.12em);
    display:block;
  }
  .brand-giant .alt{
    color:transparent;
    -webkit-text-stroke:2.5px var(--ink);
  }
  .marquee{
    display:flex;
    overflow:hidden;
    border-top:2px solid var(--ink);
    border-bottom:2px solid var(--ink);
    margin-top:6px;
    background:var(--ink);
    color:var(--mustard);
  }
  .marquee-track{
    display:flex;
    flex-shrink:0;
    animation:scroll 22s linear infinite;
  }
  .marquee span{
    font-family:'IBM Plex Mono',monospace;
    font-size:12px;
    font-weight:600;
    letter-spacing:.28em;
    text-transform:uppercase;
    padding:8px 0;
    white-space:nowrap;
  }
  .marquee span::after{content:"✶";margin:0 22px;color:var(--pink)}
  @keyframes scroll{to{transform:translateX(-100%)}}

/* ============ SEO sections (PC only) ============ */
  .seo-statement{
    margin-top:40px;
    border-top:2px solid var(--ink);
    overflow:hidden;
    padding:8px 0 0;
  }
  .seo-statement .line{
    font-family:'Anton',sans-serif;
    font-size:clamp(70px,10.5vw,150px);
    line-height:.92;
    text-transform:uppercase;
    white-space:nowrap;
    letter-spacing:-.01em;
  }
  .seo-statement .line.o{
    color:transparent;
    -webkit-text-stroke:2.2px var(--ink);
    margin-left:6vw;
  }
  .seo-statement .line.p{color:var(--pink);-webkit-text-stroke:2.2px var(--ink);margin-left:2vw}

  .seo-main{
    max-width:1180px;margin:0 auto;padding:80px 24px 90px;
    display:grid;grid-template-columns:1fr 1fr;gap:70px;
  }
  .seo-col h1{
    font-family:'Anton',sans-serif;
    font-size:clamp(34px,4.2vw,54px);line-height:1.05;text-transform:uppercase;letter-spacing:.01em;
    margin-bottom:18px;
  }
  .seo-col h1 span{color:var(--pink);text-shadow:2.5px 2.5px 0 var(--ink)}
  .seo-col p{font-size:16px;line-height:1.75;margin-bottom:14px;max-width:52ch}
  .seo-col p b{background:var(--ink);color:var(--mustard);padding:0 6px;border-radius:5px;font-weight:500}
  .seo-kicker{
    font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
    letter-spacing:.26em;text-transform:uppercase;color:var(--muted);
    display:block;margin-bottom:14px;
  }

  /* numbered feature rows */
  .feat{border-top:2px solid var(--ink)}
  .feat-row{
    display:flex;align-items:baseline;gap:22px;
    padding:20px 4px;border-bottom:2px solid var(--ink);
    transition:background .25s;
  }
  .feat-row:hover{background:rgba(255,255,255,.5)}
  .feat-row .num{
    font-family:'Anton',sans-serif;font-size:26px;
    color:transparent;-webkit-text-stroke:1.4px var(--ink);
    flex-shrink:0;
  }
  .feat-row h3{font-family:'Space Grotesk',sans-serif;font-size:17px;font-weight:700;margin-bottom:4px}
  .feat-row p{font-size:14px;line-height:1.6;color:#4d4636;margin:0;max-width:48ch}

  /* crawlable game guide links */
  .game-guides{max-width:1180px;margin:0 auto;padding:0 24px 90px}
  .game-guides h2{
    font-family:'Anton',sans-serif;font-size:clamp(34px,4.5vw,56px);
    line-height:1;text-transform:uppercase;margin-bottom:24px;
  }
  .guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .guide-link{
    min-height:150px;padding:22px;border:2px solid var(--ink);border-radius:22px;
    color:var(--ink);text-decoration:none;background:rgba(255,255,255,.34);
    display:flex;flex-direction:column;justify-content:space-between;gap:24px;
    transition:transform .2s,box-shadow .2s,background .2s;
  }
  .guide-link:hover{transform:translateY(-4px);box-shadow:5px 6px 0 var(--ink);background:var(--paper)}
  .guide-link strong{font-family:'Anton',sans-serif;font-size:25px;text-transform:uppercase;letter-spacing:.02em}
  .guide-link span{font-size:14px;line-height:1.5;color:#4d4636}

  /* FAQ accordion */
  .faq{
    max-width:1180px;margin:0 auto;padding:0 24px 110px;
  }
  .faq-head{display:flex;align-items:baseline;gap:20px;margin-bottom:26px}
  .faq-head h2{
    font-family:'Anton',sans-serif;font-size:clamp(40px,5vw,64px);
    text-transform:uppercase;line-height:1;
  }
  .faq-head .tag{
    font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
    letter-spacing:.22em;text-transform:uppercase;
    background:var(--ink);color:var(--mustard);padding:6px 14px;border-radius:999px;
    transform:rotate(-3deg);
  }
  .faq-group{
    margin:34px 0 12px;font-family:'IBM Plex Mono',monospace;font-size:12px;
    font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#4d4636;
  }
  .faq-item{
    border-top:2px solid var(--ink);
  }
  .faq-item:last-child{border-bottom:2px solid var(--ink)}
  .faq-item summary{
    list-style:none;cursor:pointer;
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    padding:22px 6px;
    font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;
    transition:padding-left .25s;
  }
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary:hover{padding-left:16px}
  .faq-item summary .plus{
    flex-shrink:0;width:34px;height:34px;border-radius:50%;
    border:2px solid var(--ink);
    display:grid;place-items:center;
    font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:18px;
    transition:transform .3s cubic-bezier(.3,1.2,.4,1),background .3s,color .3s;
  }
  .faq-item[open] summary .plus{transform:rotate(135deg);background:var(--ink);color:var(--mustard)}
  .faq-item[open] summary{color:#000}
  .faq-body{
    padding:0 6px 26px;max-width:64ch;
    font-size:15px;line-height:1.75;color:#3d382c;
  }
  .faq-item[open]{animation:faqopen .35s cubic-bezier(.2,.8,.2,1)}
  @keyframes faqopen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}

  @media (max-width:980px){
    .seo-main{grid-template-columns:1fr;gap:50px;padding:60px 20px 70px}
    .seo-statement .line{font-size:clamp(54px,13vw,120px)}
    .faq{padding:0 20px 80px}
    .guide-grid{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width:760px){
    .seo-statement{margin-top:26px}
    .seo-statement .line{font-size:clamp(44px,15vw,80px)}
    .seo-statement .line.o{margin-left:8vw}
    .seo-main{padding:50px 16px 60px}
    .game-guides{padding:0 16px 60px}
    .guide-grid{grid-template-columns:1fr 1fr}
    .guide-link{min-height:128px;padding:17px}
    .guide-link strong{font-size:21px}
    .seo-col h1{font-size:34px}
    .seo-col p{font-size:15px}
    .feat-row{padding:16px 2px;gap:16px}
    .feat-row .num{font-size:20px}
    .faq{padding:0 16px 70px}
    .faq-head h2{font-size:40px}
    .faq-item summary{font-size:16px;padding:18px 4px}
    .faq-body{font-size:14px;padding:0 4px 22px}
    .foot{padding-bottom:max(16px,env(safe-area-inset-bottom))}
  }

  /* reveal on scroll */
  .reveal{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}
  .reveal.in{opacity:1;transform:translateY(0)}

  /* footer strip */
  .foot{
    display:flex;justify-content:space-between;align-items:center;
    padding:18px 28px;border-top:2px solid var(--ink);
    font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
    letter-spacing:.18em;text-transform:uppercase;
  }
  .foot a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--pink)}
  .foot .dot{color:var(--pink)}