/* ============================================================
   account-takeover.css — TOTAL Account Takeover page
   Reuses the shared product-page system (styles.css + idv.css).
   The page-specific pieces are the attack-surface grid (his Paper
   design) in section 2 and the Identity-vs-Persona thesis in section 3.
   Orange stays reserved for ONE thing: the Persona.
   ============================================================ */

/* Persona foundation pill stretches the full content width. */
.idv-foundation { max-width: none; margin-left: 0; margin-right: 0; }

/* ---- "Why takeover works": the attack-surface grid (his Paper design) ----
   3x2 hairline grid; each factor (white) + bypass (grey) with a bespoke
   monochrome icon illustration. Ported 1:1 from his Paper export; the panel
   is 1100px (idv-wrap inner) = the artboard width, so the absolute icon
   positions (kept inline in the HTML) line up. Monochrome only; no orange. */
.at-surface { position: relative; box-sizing: border-box; display: grid; grid-template-columns: repeat(3, 1fr); margin: 48px 0 0; background: #0c0c0d; border: .5px solid #282828; border-radius: 16px; box-shadow: 0 50px 130px -58px rgba(0,0,0,.92); overflow: clip; -webkit-font-smoothing: antialiased; }
.at-cell { box-sizing: border-box; position: relative; display: flex; flex-direction: column; gap: 13px; height: 186px; padding: 30px 32px; overflow: clip; border-right: .5px solid #282828; border-bottom: .5px solid #282828; }
.at-cell:nth-child(3n) { border-right: none; }
.at-cell:nth-child(n+4) { border-bottom: none; }
.at-f { color: rgba(255,255,255,.9); font-family: "Inter Tight", system-ui, sans-serif; font-size: 17px; font-weight: 500; line-height: 160%; }
.at-b { display: inline-block; width: fit-content; color: #5f5f5f; font-family: "Inter Tight", system-ui, sans-serif; font-size: 11.5px; font-weight: 600; letter-spacing: 1.61px; line-height: 160%; text-transform: uppercase; }
@media (max-width: 820px) {
  .at-surface { grid-template-columns: 1fr; }
  .at-cell { border-right: none; }
  .at-cell:last-child { border-bottom: none; }
}