/* =========================================================
   AstraShilp — laptop calibration (13 Sep 2026)
   ---------------------------------------------------------
   On laptops the site only looked right at 80% browser zoom. Browser
   zoom shrinks every px length and leaves vw / vh alone (they are
   fractions of the window at any zoom). This does the same thing
   without zoom: every px length in the site's CSS is written as
   calc(N * var(--u, 1px)), and --u is how big one CSS pixel is drawn.

     window up to 1024px   1px            phones, tablets: unchanged
     1024 -> 1280          1px -> .8px    eased in, no jump
     1280 -> 1536          .8px           the 80% look
     1536 -> 1920          .8px -> 1px    every laptop gets the 1920
                                          layout, scaled to fit
     1920 and wider        1px            desktops: unchanged

   Media queries can't read var(), so the breakpoints between 1024 and
   1600 were moved to the window width at which the scaled layout reaches
   them (max-width 1380px -> 1195.31px, and so on). With the fallback of
   1px, a page that failed to load this file looks exactly as before.

   Editing the site: write new lengths as calc(N * var(--u, 1px)) to
   keep them in step; a plain px value will stay full size on laptops.
   ========================================================= */
:root { --u: clamp(.8px, max(1.8px - 100vw / 1280, 100vw / 1920), 1px); }
html { font-size: calc(16 * var(--u, 1px)); }

/* Form controls don't inherit font-size: the browser gives them 13.33px of its
   own, which browser zoom shrinks and a CSS rule doesn't. Every visible field
   on the site sets its own size; this catches the rest (the hidden spam-trap
   field on connect was 30px too wide on laptops). At full size it is exactly
   the browser's 13.33px, so nothing changes on desktops or phones. */
input, select, textarea, button { font-size: calc(40 / 3 * var(--u, 1px)); }
