/* Huzaifa Rafiq — shared styles for content pages */
:root{
  --bg:#07050d; --bg2:#0d0916; --ink:#f3eefb; --ink-dim:#a99fc0;
  --royal:#7c3aed; --electric:#b14bff; --deep:#3b1080;
  --line:rgba(177,75,255,.16); --easing:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:"Space Grotesk",system-ui,-apple-system,sans-serif;overflow-x:hidden;line-height:1.6}
::selection{background:var(--electric);color:#0a0612}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.anton{font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.01em}
.mono{font-family:"Space Mono",monospace}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:999;background:var(--electric);color:#0a0612;padding:10px 16px;border-radius:6px}

/* header */
.hdr{position:sticky;top:0;z-index:60;backdrop-filter:blur(14px);background:rgba(7,5,13,.82);border-bottom:1px solid var(--line)}
.hdr .in{max-width:1180px;margin:0 auto;padding:16px clamp(18px,4vw,40px);display:flex;align-items:center;justify-content:space-between;gap:20px}
.hdr .brand{font-family:"Anton",sans-serif;text-transform:uppercase;font-size:1.15rem;letter-spacing:.04em;line-height:1.05}
.hdr .brand small{display:block;font-family:"Space Mono",monospace;font-size:.56rem;letter-spacing:.24em;color:var(--ink-dim);margin-top:4px}
.hdr nav{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:flex-end}
.hdr nav a{font-family:"Space Mono",monospace;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);transition:color .3s}
.hdr nav a:hover,.hdr nav a[aria-current]{color:var(--electric)}
@media(max-width:640px){.hdr nav a{font-size:.6rem;letter-spacing:.12em}}

/* breadcrumb */
.crumb{max-width:1180px;margin:0 auto;padding:22px clamp(18px,4vw,40px) 0;font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim)}
.crumb a:hover{color:var(--electric)}
.crumb span{opacity:.5;margin:0 8px}

/* hero */
.phero{position:relative;max-width:1180px;margin:0 auto;padding:clamp(46px,7vw,86px) clamp(18px,4vw,40px) clamp(34px,5vw,56px)}
.phero::before{content:"";position:absolute;inset:-20% -30% auto -20%;height:80%;background:radial-gradient(60% 60% at 30% 40%,rgba(124,58,237,.22),transparent 70%);pointer-events:none;z-index:-1}
.eyebrow{font-family:"Space Mono",monospace;font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;color:var(--electric);margin-bottom:18px}
h1{font-family:"Anton",sans-serif;text-transform:uppercase;font-size:clamp(2rem,5.2vw,4.2rem);line-height:.98;letter-spacing:.01em;max-width:18ch}
h1 em{font-style:normal;color:var(--electric);text-shadow:0 0 30px rgba(177,75,255,.5)}
.lede{margin-top:24px;max-width:72ch;font-size:clamp(1rem,1.45vw,1.18rem);line-height:1.72;color:#ded6f0}

/* body */
main{max-width:1180px;margin:0 auto;padding:0 clamp(18px,4vw,40px) clamp(70px,10vw,120px)}
main h2{font-family:"Anton",sans-serif;text-transform:uppercase;font-size:clamp(1.45rem,3vw,2.4rem);line-height:1.02;margin:clamp(48px,6vw,76px) 0 14px}
main h2 em{font-style:normal;color:var(--electric)}
main > h2:first-child{margin-top:clamp(20px,3vw,34px)}
main h3{font-size:1.08rem;font-weight:700;margin:30px 0 8px}
main p{max-width:74ch;margin-bottom:16px;color:#cfc6e2}
main p strong{color:var(--ink)}
main a:not(.card):not(.btn):not(.pill){color:var(--electric);border-bottom:1px solid rgba(177,75,255,.34);transition:border-color .3s}
main a:not(.card):not(.btn):not(.pill):hover{border-color:var(--electric)}
main ul,main ol{max-width:74ch;margin:0 0 18px 20px;color:#cfc6e2}
main li{margin-bottom:9px}
main li::marker{color:var(--electric)}
hr{border:0;border-top:1px solid var(--line);margin:44px 0}

.pill{display:inline-block;font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  padding:7px 13px;border:1px solid var(--line);border-radius:100px;color:var(--ink-dim);margin:0 7px 8px 0}
.pillrow{margin:20px 0 6px}

.cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:24px}
.card{display:block;padding:22px 20px;border:1px solid var(--line);border-radius:13px;
  background:linear-gradient(160deg,rgba(177,75,255,.07),rgba(255,255,255,.015));
  transition:transform .45s var(--easing),border-color .45s var(--easing)}
.card:hover{transform:translateY(-4px);border-color:rgba(177,75,255,.5)}
.card h3{margin:0 0 8px;font-size:1rem}
.card p{font-size:.88rem;color:var(--ink-dim);margin:0;line-height:1.62}
.card .go{display:inline-block;margin-top:12px;font-family:"Space Mono",monospace;font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--electric)}

.videowrap{position:relative;padding-top:56.25%;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:28px 0 6px;background:#000}
.videowrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
figcaption{font-family:"Space Mono",monospace;font-size:.68rem;letter-spacing:.12em;color:var(--ink-dim);margin-bottom:24px}

.facts{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.facts li{background:var(--bg2);padding:18px 18px;margin:0}
.facts .k{display:block;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--electric);margin-bottom:7px}
.facts .v{font-size:.95rem;color:var(--ink)}

.faq{border-top:1px solid var(--line);margin-top:22px}
.faq details{border-bottom:1px solid var(--line);padding:18px 4px}
.faq summary{cursor:pointer;list-style:none;font-weight:700;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:"Space Mono",monospace;color:var(--electric)}
.faq details[open] summary::after{content:"–"}
.faq p{margin:12px 0 0;color:var(--ink-dim);font-size:.94rem}

.cta{margin-top:clamp(52px,7vw,84px);padding:clamp(30px,4.5vw,52px);border:1px solid var(--line);border-radius:18px;
  background:radial-gradient(90% 140% at 0% 0%,rgba(124,58,237,.22),transparent 62%),linear-gradient(160deg,rgba(177,75,255,.06),rgba(255,255,255,.01))}
.cta h2{margin-top:0}
.btn{display:inline-block;margin:14px 12px 0 0;padding:14px 26px;border-radius:100px;font-family:"Space Mono",monospace;
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--electric);color:var(--ink);
  transition:background .35s var(--easing),color .35s var(--easing)}
.btn:hover{background:var(--electric);color:#0a0612}
.btn.ghost{border-color:var(--line);color:var(--ink-dim)}
.btn.ghost:hover{background:transparent;border-color:var(--electric);color:var(--electric)}

.worklist{list-style:none;border-top:1px solid var(--line);margin:24px 0 0}
.worklist li{border-bottom:1px solid var(--line);margin:0}
.worklist a{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1.4fr) auto;gap:16px;align-items:baseline;padding:18px 6px;border:0!important;color:inherit!important;transition:background .3s,padding .3s}
.worklist a:hover{background:rgba(177,75,255,.08);padding-left:14px}
.worklist .n{font-family:"Space Mono",monospace;font-size:.72rem;color:var(--electric)}
.worklist .t{font-family:"Anton",sans-serif;text-transform:uppercase;font-size:clamp(.98rem,1.7vw,1.3rem)}
.worklist .d{color:var(--ink-dim);font-size:.85rem;line-height:1.55}
.worklist .y{font-family:"Space Mono",monospace;font-size:.7rem;color:var(--ink-dim);text-align:right;white-space:nowrap}
@media(max-width:760px){.worklist a{grid-template-columns:40px 1fr;gap:4px 12px}.worklist .d,.worklist .y{grid-column:2/-1;text-align:left}}

footer.ftr{border-top:1px solid var(--line);background:var(--bg2)}
footer.ftr .in{max-width:1180px;margin:0 auto;padding:44px clamp(18px,4vw,40px) 54px}
footer.ftr nav{display:flex;flex-wrap:wrap;gap:10px 22px;margin-bottom:26px}
footer.ftr nav a{font-family:"Space Mono",monospace;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);transition:color .3s}
footer.ftr nav a:hover{color:var(--electric)}
footer.ftr .mail{font-family:"Anton",sans-serif;text-transform:lowercase;font-size:clamp(1.1rem,3vw,2rem);letter-spacing:.01em;display:inline-block;margin-bottom:18px}
footer.ftr .mail:hover{color:var(--electric)}
footer.ftr .fine{font-family:"Space Mono",monospace;font-size:.66rem;letter-spacing:.1em;color:var(--ink-dim);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;border-top:1px solid var(--line);padding-top:20px;margin-top:8px}