/* =====================================================================
   spiro-site.v1.css · shared performance + accessibility layer
   Loaded on index.html, index-v2.html, index-au.html, index-lean.html
   ===================================================================== */

/* Performance: the browser skips style, layout and paint for sections
   that are off screen until the visitor scrolls near them. */
body > section:not(.hero), body > footer{content-visibility:auto; contain-intrinsic-size:auto 900px}

/* Readable small text inside the plan cards (WCAG AA 4.5:1) */
.bb-opt .bb-name small, .bb-opt .bb-bill, .bb-opt .bb-price i, .bb-opt .bb-price s{color:#46524b !important}
.bb-opt .bb-name em.lite{color:#33403a !important}

/* Timeline: steps not yet reached stay legible */
.tl-step, .tl-step.is-on{opacity:1 !important}

/* Keyboard users can always see where they are */
a:focus-visible, button:focus-visible, summary:focus-visible, [role="tab"]:focus-visible{
  outline:3px solid #2f9457 !important; outline-offset:3px !important; border-radius:6px}

/* Comfortable tap targets for the overlapping proof and certificate fans */
.fan-c{min-width:44px; min-height:44px}

/* Respect "reduce motion" */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important}
}

/* When the visitor jumps to a section (#offer, #faq...) render everything first so the jump lands exactly */
html.cv-off body > section, html.cv-off body > footer{content-visibility:visible !important}