/* Loaded after guides.css; only what the admin guide adds. */
.ag-shot{margin:18px 0 4px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--raise)}
.ag-shot img{display:block;width:100%;height:auto}
.ag-shot figcaption{padding:9px 13px;font-family:var(--mono);font-size:11.5px;letter-spacing:.02em;color:var(--mut);border-top:1px solid var(--line);background:var(--ink-2)}
.ag-steps{margin:12px 0 0;padding:0 0 0 20px}
.ag-steps li{margin:7px 0;padding-left:4px}
.ag-note{margin-top:14px;padding:12px 14px;border-left:2px solid var(--gold);background:var(--gold-soft);border-radius:0 10px 10px 0}
.ag-note strong{color:var(--ink-br,inherit)}
.ag-legend{margin:14px 0 0;padding:0;list-style:none;counter-reset:agl}
.ag-legend li{position:relative;padding-left:34px;margin:11px 0}
.ag-legend li::before{counter-increment:agl;content:counter(agl);position:absolute;left:0;top:1px;width:23px;height:23px;border-radius:7px;background:var(--gold-soft);color:var(--gold-br);border:1px solid var(--line-2);font-family:var(--mono);font-size:11.5px;display:flex;align-items:center;justify-content:center}
.ag-legend b{font-weight:600}
@media (max-width:640px){
.ag-shot figcaption{font-size:11px}
}

/* ---------------------------------------------------------------------------
   No-JavaScript fallback.

   Reveal-on-scroll, the FAQ accordions, the feature rows and the staggered hero
   copy all start hidden and are uncovered by script. With scripting off or
   broken that left every page blank below the hero — 127 FAQ paragraphs and 25
   reveal blocks on the home page alone, and nothing said so.

   These undo the hidden state. The .js class is set in the <head> by build.js,
   so none of this applies when a script actually ran. Decorative things that
   start at opacity 0 — spinners, glows, hover underlines, the demo mockups —
   are deliberately left alone: the point is that the page reads, not that the
   animations are simulated.
   --------------------------------------------------------------------------- */
html:not(.js) .rv,
html:not(.js) .reveal,
html:not(.js) .frow,
html:not(.js) .blur-in,
html:not(.js) .faq-item,
html:not(.js) .pp-fig,
html:not(.js) .faq-a p,
html:not(.js) .rv h2,
html:not(.js) .list-intro,
html:not(.js) .trust-strip,
html:not(.js) .hero-ctas,
html:not(.js) .tier-note h3,
html:not(.js) .price,
html:not(.js) .sg-stack li,
html:not(.js) .ph figcaption span,
html:not(.js) .hs-eyebrow,
html:not(.js) .hs-copy .lede,
html:not(.js) .hs-copy .hv-ctas,
html:not(.js) .hs-lede-m,
html:not(.js) .hs-copy h1 .hl>span,
html:not(.js) .hv-line.l2{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
html:not(.js) .faq-a{grid-template-rows:1fr}

/* Skip link and the main landmark (see AGENTS.md).
   Off-screen rather than display:none, so it stays in the tab order and can be
   reached by the very first Tab press; it flies in on focus. #main takes
   tabindex="-1" so following the link actually moves focus, not just the
   viewport, and the scroll-margin keeps the fixed nav off the heading. */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 20px;background:#0E121B;color:#E4C570;border:1px solid currentColor;border-radius:0 0 10px 0;font-size:15px;font-weight:600;line-height:1;text-decoration:none}
.skip-link:focus{left:0}
#main{scroll-margin-top:90px}
#main:focus{outline:none}

/* Tap targets on touch devices (TCH-04).
   The footer's column links measured 33px and the Privacy/Terms pair 14px,
   against the 44px WCAG asks for. Padding rather than height, so the footer
   keeps its proportions on a pointer device — where these are fine already. */
@media (hover:none){
  footer .foot-col a{padding-block:11px}
  footer .fb-links a{display:inline-block;padding-block:15px}
}

/* The drawer's second group heading (see index.css note). */
.mp-eyebrow-2{margin-top:14px}