/* iq-theme.css: the Identity Quest(TM) gold on mashmancg.com's /identity-quest,
   the same palette the game and identitypositioning.com/identity-quest/ use.
   Opt in with <body class="iq-theme">. Layered on site.css; the page is Ink
   throughout, because the gold is only legible on dark grounds
   (#F3C228 on Ink is 12.3:1, on white 1.6:1). */
.iq-theme{
  --iq-gold:#F3C228;
  --iq-gold-lt:#F8DC7E;
  --iq-gold-dim:#8C6E12;
  --iq-glow:243,194,40;
  --iq-panel:#131314;
  --iq-line:#262729;
}

/* Hero: the gold glow, the logo, and the board in a browser frame */
.iq-theme .page-hero::before{
  background:radial-gradient(closest-side, rgba(var(--iq-glow),0.16), rgba(var(--iq-glow),0.05) 45%, rgba(var(--iq-glow),0) 100%);
}
.iq-hero-grid{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:clamp(32px, 4vw, 56px); align-items:center;}
.iq-hero-grid h1{max-width:18ch; font-size:clamp(38px, 4.2vw, 58px);}
.iq-logo{display:block; width:auto; height:64px; margin:0 0 22px;}
.iq-chips{list-style:none; margin:28px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px;}
.iq-chips li{font-family:var(--display); font-size:10.5px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--iq-gold-lt); border:1px solid rgba(var(--iq-glow),0.35); background:rgba(var(--iq-glow),0.06); padding:6px 10px;}
.iq-hero-shot{margin:0; border:1px solid #3A3B3E; background:var(--ink); box-shadow:0 40px 90px -30px rgba(0,0,0,0.9), 0 0 0 1px rgba(var(--iq-glow),0.12), 0 30px 80px -40px rgba(var(--iq-glow),0.35);}
.iq-hero-shot img{display:block; width:100%; height:auto;}
.iq-frame{display:flex; align-items:center; gap:6px; padding:8px 12px; border-bottom:1px solid var(--iq-line); background:#121213;}
.iq-frame span{width:8px; height:8px; border-radius:50%; background:#2E2F31;}
.iq-frame span:first-child{background:var(--iq-gold);}
.iq-frame b{margin-left:10px; font-family:var(--body); font-weight:500; font-size:11.5px; color:var(--steel); letter-spacing:0.02em;}
@media (min-width:981px){ .iq-hero-shot{transform:perspective(1400px) rotateY(-4deg) rotateX(1deg); transform-origin:left center;} }
@media (max-width:980px){ .iq-hero-grid{grid-template-columns:1fr;} }

/* At a glance: four numbers, each under a short gold rule */
.iq-stats{display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:1px; background:var(--iq-line); border:1px solid var(--iq-line);}
.iq-stats > div{position:relative; background:var(--iq-panel); padding:24px 22px; display:flex; flex-direction:column; gap:8px;}
.iq-stats > div::before{content:""; position:absolute; top:-1px; left:0; width:44px; height:2px; background:var(--iq-gold);}
.iq-stats b{font-family:var(--display); font-weight:800; font-size:clamp(30px, 3vw, 38px); line-height:1; color:var(--iq-gold);}
.iq-stats span{font-size:13.5px; line-height:1.5; color:var(--steel);}
@media (max-width:760px){ .iq-stats{grid-template-columns:repeat(2, minmax(0, 1fr));} }

/* Headlines, eyebrows, numbers, and labels in gold */
.iq-theme h1 em,.iq-theme h2 em{color:var(--iq-gold);}
.iq-theme .eyebrow{color:var(--iq-gold);}
.iq-theme .eyebrow::before{background:var(--iq-gold);}
.iq-theme .cell-num,.iq-theme .step-n{color:var(--iq-gold);}
.iq-theme .specs dt{color:var(--iq-gold);}

/* Cards: the hover edge in gold */
@media (hover:hover){ .iq-theme .grid > .cell::after{background:var(--iq-gold);} }

/* Buttons: the primary takes the gold, the outline picks it up on hover */
.iq-theme .btn-light,.iq-theme .btn-light:link,.iq-theme .btn-light:visited{background:var(--iq-gold); color:var(--ink); border-color:var(--iq-gold);}
.iq-theme .btn-light:hover,.iq-theme .btn-light:focus-visible,.iq-theme .btn-light:active{background:var(--iq-gold-lt); color:var(--ink); border-color:var(--iq-gold-lt);}
.iq-theme .btn-outline-light:hover,.iq-theme .btn-outline-light:focus-visible{border-color:var(--iq-gold); color:var(--iq-gold-lt); background:transparent;}

/* Links, questions, and focus */
.iq-theme .ilink{text-decoration-color:var(--iq-gold);}
.iq-theme .qa summary::after{border-color:var(--iq-gold);}
.iq-theme a:focus-visible,.iq-theme button:focus-visible,.iq-theme summary:focus-visible{outline-color:var(--iq-gold);}

/* Screens: a gold edge on the frames */
.iq-theme .iq-shots figure{border-color:#3A3B3E; background:var(--iq-panel);}
.iq-theme .iq-shots figure:first-child{box-shadow:inset 0 2px 0 var(--iq-gold);}

/* The closing call: a crisp gold rule, no glow */
.iq-theme .cta.s-ink{border-top:2px solid var(--iq-gold);}
.iq-theme{--to-top-hi:#F3C228;}

/* Update Notes: the newest three releases, carried from identityquest.press/updates
   by netlify/functions/iq-updates-sync.mjs (between the iq:updates markers). */
.iq-theme .split-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px 40px; margin-bottom:clamp(36px, 4.5vw, 56px);}
.iq-theme .split-head .section-head{margin-bottom:0;}
.iq-notes{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1px; background:var(--iq-line); border:1px solid var(--iq-line);}
@media (max-width:980px){ .iq-notes{grid-template-columns:1fr;} }
.iq-note{background:var(--iq-panel); padding:clamp(24px, 2.6vw, 34px);}
.iq-note.is-latest{box-shadow:inset 0 2px 0 var(--iq-gold);}
.iq-note-meta{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 12px; margin:0 0 14px; font-family:var(--display); font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--graphite);}
.iq-note-ver{color:var(--iq-gold-lt); text-transform:none;}
.iq-note-new{padding:3px 7px; border:1px solid rgba(var(--iq-glow),0.45); color:var(--iq-gold-lt); letter-spacing:0.16em;}
.iq-note h3{margin:0 0 10px; font-size:clamp(18px, 1.7vw, 21px);}
.iq-note h3 a{color:var(--white); text-decoration:none;}
.iq-note h3 a:hover,.iq-note h3 a:focus-visible{color:var(--iq-gold-lt);}
.iq-note-items{margin:16px 0 0; padding:0; list-style:none; border-top:1px solid var(--iq-line);}
.iq-note-items li{padding:9px 0; border-bottom:1px solid var(--iq-line); font-size:14px; line-height:1.45; color:var(--platinum);}

/* The world (v4.4): the Walk and the Office, side by side; one column on a phone */
.iq-place{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(14px, 1.8vw, 22px); align-items:start;}
.iq-place figure{margin:0; border:1px solid #3A3B3E; background:var(--iq-panel); overflow:hidden; box-shadow:inset 0 2px 0 var(--iq-gold);}
.iq-place img{display:block; width:100%; height:auto;}
.iq-place figcaption{padding:14px 18px 16px; border-top:1px solid #3A3B3E; font-size:13.5px; line-height:1.6; color:var(--steel);}
.iq-place figcaption b{color:var(--white); font-family:var(--display); font-weight:600;}
.iq-place figure:first-child{grid-column:1 / -1;}
@media (max-width:760px){ .iq-place{grid-template-columns:1fr;} }