/* ============================================================
   The AI Insider Risk Index. Shared design system
   Palette and type from Anzenna's tokens (paper/ink/wine, Fraunces).
   One warm, art-directed research publication: paper -> raised panel
   -> recessed valley, lit by ink-tinted shadows; one canonical
   five-band exposure ramp; one border/radius/elevation/focus grammar.
   ============================================================ */
:root{
  --bg:#f4ece0; --panel:#faf6ee; --sink:#ece1ce; --ink:#2a2520; --body:#5a4f44;
  --faint:#736657; --line:#d9cdb9; --line-strong:#cbbda4;
  --accent:#8a4a56; --accent-deep:#733c47; --accent-soft:#f0e3de; --warm:#c08a6b;
  /* canonical five-band exposure ramp, Contained -> Critical */
  --sage:#8ca67d; --amber:#c9a24a; --terra:#c0784a; --rust:#a8503a; --wine:#8a4a56;
  --serif:"Fraunces","Cormorant Garamond","Times New Roman",serif;
  --radius-sm:12px; --radius:16px; --radius-lg:20px; --pill:999px;
  --sh-sm:0 1px 2px rgba(42,37,32,.05),0 1px 3px rgba(42,37,32,.05);
  --sh-md:0 6px 18px rgba(58,44,34,.08),0 1px 3px rgba(42,37,32,.05);
  --sh-lg:0 16px 40px rgba(58,44,34,.13),0 3px 10px rgba(42,37,32,.06);
  --ring:0 0 0 3px rgba(138,74,86,.22);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
fieldset{border:0;min-width:0}
legend{padding:0;display:block;width:100%}
html{scroll-behavior:smooth}
body{font-family:"Inter Tight",system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.55;font-optical-sizing:auto}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
.wrap.narrow{max-width:820px}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}
::selection{background:var(--accent-soft)}
:where(.btn,.navcta,.card,.crumbs a,.flinks a,nav.links a,.deeper a):focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}

/* page grain overlay */
body::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.26;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E")}

/* spectrum motif = five exposure bands, Contained to Critical */
.spectrum{height:6px;background:linear-gradient(90deg,var(--sage) 0 20%,var(--amber) 20% 40%,var(--terra) 40% 60%,var(--rust) 60% 80%,var(--wine) 80% 100%)}
.spectrum.mini{height:3px;max-width:280px;margin:20px auto 0;border-radius:99px}

/* ---- masthead + nav (identical on every page) ---- */
.issue{border-bottom:1px solid var(--line);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.issue .wrap{display:flex;justify-content:space-between;align-items:center;height:34px}
.issue .nameplate{color:var(--ink);font-weight:500}
header.nav{position:sticky;top:0;z-index:50;background:rgba(244,236,224,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--line),0 6px 16px -12px rgba(58,44,34,.2)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-family:var(--serif);font-weight:600;font-size:19px;letter-spacing:-.2px}
.logo span{color:var(--accent)}
nav.links{display:flex;align-items:center;gap:24px;font-size:13.5px;color:var(--body)}
nav.links a:not(.navcta){padding:4px 0;transition:color .15s}
nav.links a:hover{color:var(--ink)}
nav.links a.active{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.navcta{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;background:var(--ink);color:var(--bg)!important;padding:10px 20px;border-radius:var(--pill);font-size:13px;font-weight:500;box-shadow:none!important;transition:background .15s,transform .15s}
.navcta:hover{background:#3a332c}
.navtoggle{display:none;background:none;border:1px solid var(--line);border-radius:10px;width:40px;height:38px;font-size:20px;color:var(--ink);cursor:pointer;line-height:1}
@media (max-width:820px){
  .navtoggle{display:block}
  nav.links{position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--bg);border-bottom:1px solid var(--line);padding:8px 32px 16px;display:none;box-shadow:var(--sh-md)}
  nav.links.open{display:flex}
  nav.links a:not(.navcta){width:100%;padding:12px 0;border-bottom:1px solid var(--line)}
  nav.links a.navcta{margin-top:10px;width:auto;border:1px solid var(--line)}
}

/* ---- buttons: one pill grammar, never clip text ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;line-height:1.1;font-size:14.5px;font-weight:500;padding:13px 27px;border-radius:var(--pill);border:1.5px solid var(--ink);cursor:pointer;transition:background .15s,color .15s,transform .15s,box-shadow .15s}
.btn.primary{background:var(--ink);color:var(--bg)}
.btn.primary:hover{background:#3a332c;transform:translateY(-1px);box-shadow:var(--sh-md)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:#ece2d0}
.btn.wine{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.wine:hover{background:var(--accent-deep);transform:translateY(-1px);box-shadow:var(--sh-md)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn[disabled],.btn:disabled{background:var(--line);color:var(--body);border-color:var(--line);cursor:not-allowed;box-shadow:none;transform:none}

/* ---- shared type helpers ---- */
.overline{display:inline-flex;align-items:center;gap:14px;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--faint);font-weight:500;margin-bottom:24px}
.overline::before{content:"";width:26px;height:1px;background:var(--accent)}
.eyebrow{font-family:"Inter Tight",sans-serif;font-weight:500;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}

/* ---- interior page header (breadcrumb + title) ---- */
.pagehead{padding:56px 0 40px;background:radial-gradient(52% 46% at 84% 4%, rgba(138,74,86,.12), transparent 66%)}
.crumbs{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:20px;font-weight:500}
.crumbs a:hover{color:var(--accent)}
.crumbs span{color:var(--line-strong)}
.pagehead h1{font-family:var(--serif);font-weight:500;font-size:clamp(32px,4.6vw,52px);line-height:1.05;letter-spacing:-.4px;max-width:20ch;text-wrap:balance}
.pagehead .stand{font-size:18px;color:var(--body);max-width:56ch;margin-top:20px;text-wrap:pretty}
.pagemeta{display:flex;gap:18px;flex-wrap:wrap;font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-top:24px}

/* ---- long-form prose / articles ---- */
.prose{padding:16px 0 24px}
.lede{font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink);max-width:34em;text-wrap:pretty;margin-bottom:8px}
.lede::first-letter{font-family:var(--serif);font-size:56px;line-height:.82;float:left;padding:6px 12px 0 0;color:var(--accent)}
.prose h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,32px);line-height:1.14;letter-spacing:-.2px;max-width:24ch;margin:44px 0 4px;padding-top:22px;border-top:2px solid var(--ink)}
.prose h3{font-family:var(--serif);font-weight:500;font-size:20px;margin:28px 0 6px}
.prose p{font-size:17px;color:var(--body);line-height:1.7;max-width:38em;margin-top:16px;text-wrap:pretty}
.prose p a,.prose li a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.prose ul,.prose ol{max-width:38em;margin:16px 0 0 22px;color:var(--body);font-size:17px;line-height:1.7}
.prose li{margin-top:8px}
.pullstat{margin:34px 0;padding:26px 30px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;max-width:40em;box-shadow:var(--sh-sm)}
.pullstat .n{font-family:var(--serif);font-weight:500;font-size:22px;color:var(--ink);line-height:1.4}
.pullstat .src{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:10.5px;color:var(--faint);margin-top:10px;letter-spacing:.04em}
.takeaways{margin:8px 0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px;max-width:40em;box-shadow:var(--sh-sm)}
.takeaways .tl{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-bottom:12px}
.takeaways ul{list-style:none;margin:0}
.takeaways li{position:relative;padding-left:20px;font-size:15px;color:var(--body);line-height:1.55;margin-top:10px}
.takeaways li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--accent)}
.takeaways li a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---- shared FAQ (details) ---- */
.faqwrap{max-width:800px;margin-top:8px}
.qa{border-bottom:1px solid var(--line)}
.qa:first-child{border-top:2px solid var(--ink)}
.qa summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:16px;padding:20px 4px;font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.35}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:19px;color:var(--accent);flex:none;line-height:1;margin-left:auto}
.qa[open] summary::after{content:"\2212"}
.qa summary:hover{color:var(--accent)}
.qa summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.qa .qa-a{padding:0 4px 22px;font-size:15.5px;color:var(--body);line-height:1.65;max-width:64ch}
.qa .qa-a a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---- research hub cards ---- */
.hubgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:8px}
@media (max-width:760px){.hubgrid{grid-template-columns:1fr}}
.card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--sh-sm);transition:transform .18s var(--ease),border-color .18s,box-shadow .18s}
.card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:var(--sh-md)}
.card.feature{grid-column:1 / -1;background:radial-gradient(120% 140% at 100% 0%,#362f28,#2a2520);color:var(--bg);border-color:#3a332c}
.card .ktag{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;font-weight:500}
.card.feature .ktag{color:var(--warm)}
.card h3{font-family:var(--serif);font-weight:500;font-size:23px;line-height:1.18;margin-bottom:10px}
.card.feature h3{font-size:28px}
.card p{font-size:14.5px;color:var(--body);line-height:1.55;max-width:46ch}
.card.feature p{color:#cfc4b4}
.card .rd{margin-top:16px;font-size:13px;font-weight:600;color:var(--accent)}
.card:hover .rd{text-decoration:underline;text-underline-offset:2px}
.card.feature .rd{color:var(--warm)}

/* ---- glossary ---- */
.glossgrid{max-width:820px;margin-top:8px}
.term{border-top:1px solid var(--line);padding:22px 0;display:grid;grid-template-columns:220px 1fr;gap:28px}
.term:first-child{border-top:2px solid var(--ink)}
@media (max-width:640px){.term{grid-template-columns:1fr;gap:8px}}
.term dt{font-family:var(--serif);font-weight:500;font-size:20px;color:var(--ink)}
.term dd{font-size:15.5px;color:var(--body);line-height:1.6;max-width:52ch}
.term dd a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---- methodology tables / definition rows ---- */
.deftable{border-top:2px solid var(--ink);margin-top:8px;max-width:860px}
.defrow{display:grid;grid-template-columns:200px 1fr 60px;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);align-items:baseline}
@media (max-width:640px){.defrow{grid-template-columns:1fr;gap:6px}}
.defrow .dname{font-family:var(--serif);font-weight:500;font-size:19px}
.defrow .ddesc{font-size:15px;color:var(--body);line-height:1.55}
.defrow .dwt{font-family:var(--serif);font-size:22px;color:var(--accent);text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:640px){.defrow .dwt{text-align:left}}
.bandrow{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.bandrow:first-child{border-top:2px solid var(--ink)}
@media (max-width:640px){.bandrow{grid-template-columns:1fr;gap:4px}}
.bandrow .bn{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px}
.bandrow .bn i{width:12px;height:12px;border-radius:4px;flex:none;box-shadow:inset 0 0 0 1px rgba(42,37,32,.12)}
.bandrow .bd{font-size:15px;color:var(--body);line-height:1.55}

/* ---- shared section rhythm: paper -> recessed valley ---- */
section.block{padding:52px 0}
section.block.alt{background:var(--sink);border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:inset 0 8px 20px -14px rgba(58,44,34,.18),inset 0 -8px 20px -14px rgba(58,44,34,.12)}
.block h2.sec{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,34px);line-height:1.14;letter-spacing:-.2px;max-width:24ch;border-top:2px solid var(--ink);padding-top:20px}
.block .lead{font-size:17px;color:var(--body);max-width:62ch;margin-top:16px;text-wrap:pretty}
.block .lead a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---- CTA band (dark, warm top-light) ---- */
.ctaband{background:radial-gradient(60% 80% at 50% -10%,#362f28,#2a2520);color:var(--bg);text-align:center;padding:72px 0}
.ctaband h2{font-family:var(--serif);font-weight:500;font-size:clamp(26px,3.4vw,38px);color:var(--bg);margin:0 auto;max-width:22ch}
.ctaband p{color:#cfc4b4;font-size:16px;max-width:52ch;margin:16px auto 26px}
.ctaband .btn.wine{box-shadow:var(--sh-md)}
.ctaband .btn.wine:hover{background:#cf9c7d;color:#2a2520}
.ctaband .btn.ghost{color:var(--bg);border-color:#6b6157}
.ctaband .btn.ghost:hover{background:#3a332c}

/* ---- go-deeper Anzenna link-back block ---- */
.deeper{margin-top:8px;border-top:1px solid var(--line);padding-top:22px;font-size:15px;color:var(--faint);max-width:40em}
.deeper a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---- footer / colophon (identical every page) ---- */
footer.site{background:var(--bg);padding:0 0 44px;border-top:1px solid var(--line);margin-top:0}
footer.site .fmain{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;flex-wrap:wrap;padding-top:44px}
.fbrand .logo{font-size:17px}
.fbrand p{font-size:13.5px;color:var(--faint);margin-top:8px;max-width:38ch}
.flinks{display:flex;gap:20px;font-size:13.5px;color:var(--body);margin-top:16px;flex-wrap:wrap}
.flinks a{transition:color .15s}
.flinks a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.byline{font-size:14px;color:var(--body)}
.byline b{color:var(--ink);font-weight:600}
.colophon{margin-top:30px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:var(--faint);max-width:62ch;line-height:1.6}
.ver{margin-top:10px;font-size:11px;color:var(--faint)}