/* =====================================================================
   base.css — site-v4 integrator
   The whole page is one fixed 1280px-wide design canvas (#stage).
   A tiny script scales that canvas UNIFORMLY to the window width, so the
   design fills the width with NO side bars and NO stretching — exactly
   as drawn in Figma. Nothing is "filled" or bled; every section is the
   Figma code positioned in the 1280 canvas.
   ===================================================================== */

*{margin:0;padding:0;box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; }
html,body{ background:#0a1420; }
body{ overflow-x:hidden; font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased; }

/* The fixed design canvas — page background gradient from the Figma frame */
#stage{
  position:relative;
  width:1280px;
  height:6722px;                 /* true Figma frame height — page ends exactly at the footer copyright */
  transform-origin:top left;
  overflow:hidden;
  /* Figma frame gradient spans exactly the 6722px frame; area below (footer bleed) is footer navy */
  background-image:linear-gradient(180deg,#f1fbff 0%, #98a8ba 67.31%, #213a5d 100%);
  background-size:100% 6722px;
  background-repeat:no-repeat;
  background-color:#203148;
}

/* Section wrappers are invisible positioning shells (children are absolutely
   positioned) — but several carry big explicit heights, which makes them swallow
   clicks for everything ABOVE their content. Disable hit-testing on the shells
   and restore it on real interactive elements. */
#stage > [class^="sec-"] { pointer-events: none; }
#stage > [class^="sec-"] a,
#stage > [class^="sec-"] button,
#stage > [class^="sec-"] [data-filter],
#stage > [class^="sec-"] [role="button"],
#stage > [class^="sec-"] .svc-arrow-btn,
#stage > [class^="sec-"] .cert-carousel-arrow { pointer-events: auto; }

/* Every section is placed at the canvas origin; its own children carry the
   exact frame-relative y coordinates. Enforced here so all sections anchor
   identically regardless of what each section stylesheet set. */
#stage > [class^="sec-"]{
  position:absolute;
  left:0;
  top:0;
  width:1280px;
}