/* ===== New Tech shared design system (loaded on every page, after page CSS) =====
   Tokens, page hero, section rhythm, buttons/cards polish, scroll reveal, motion helpers.
   All motion is gated by html.nt-motion (set by js/nt-motion.js only when the visitor has not
   asked for reduced motion) and frozen by html.nt-paused (the "Pause animations" button). */
:root{--nt-navy:#0B1E3A;--nt-navy-2:#13294B;--nt-navy-3:#1B3560;--nt-gold:#FFC72C;--nt-gold-l:#FFD54F;--nt-gold-d:#E0A800;--nt-champ:#F3E5C0;--nt-ink:#F7F9FC;--nt-ink-2:#D6E4F5;
  --nt-grad:linear-gradient(135deg,#FFE58A 0%,#FFC72C 40%,#FFF0B8 60%,#F5B800 100%);--nt-r:20px;--nt-ease:cubic-bezier(.22,.8,.24,1);--nt-ring:0 0 0 1px rgba(255,213,79,.35);--nt-glow:0 18px 50px rgba(0,0,0,.35),0 0 30px rgba(255,199,44,.08)}
/* Ambient aurora behind every page (fixed, transform-only) */
body{position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:-20vmax;z-index:-1;pointer-events:none;background:radial-gradient(35vmax 25vmax at 20% 15%,rgba(255,199,44,.10),transparent 70%),radial-gradient(40vmax 30vmax at 85% 60%,rgba(91,140,210,.14),transparent 70%),radial-gradient(30vmax 25vmax at 40% 95%,rgba(243,229,192,.07),transparent 70%)}
.nt-motion body::before{animation:nt-aurora 38s ease-in-out infinite alternate}
@keyframes nt-aurora{to{transform:translate3d(4vmax,-3vmax,0) rotate(8deg) scale(1.08)}}
/* Typography rhythm */
main h2{scroll-margin-top:6rem}
main p,main li{max-width:72ch}
.lead{color:var(--nt-ink-2)!important}
/* Focus: unmistakable, not color-only (thick outline + offset) */
:focus-visible{outline:4px solid var(--nt-gold-l)!important;outline-offset:3px!important;box-shadow:0 0 0 8px rgba(11,30,58,.9)!important}
/* Page hero pattern: applied to the first h1 block of each page by nt-motion.js (.nt-pagehero) */
.nt-pagehero{position:relative;isolation:isolate;overflow:hidden;margin:0 0 2rem;padding:2.2rem 2rem 2rem;border-radius:var(--nt-r);background:linear-gradient(135deg,rgba(19,41,75,.92),rgba(11,30,58,.92));border:1px solid rgba(255,213,79,.45);box-shadow:var(--nt-glow)}
.nt-pagehero::before{content:"";position:absolute;inset:-40%;z-index:-1;background:conic-gradient(from 0deg at 50% 50%,rgba(255,199,44,.0),rgba(255,199,44,.16),rgba(91,140,210,.14),rgba(255,199,44,.0) 60%);filter:blur(30px)}
.nt-pagehero::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,229,138,.13),transparent);transform:skewX(-18deg)}
.nt-motion .nt-pagehero::before{animation:nt-spin 26s linear infinite}
.nt-motion .nt-pagehero::after{animation:nt-sweep 7s var(--nt-ease) infinite}
@keyframes nt-spin{to{transform:rotate(360deg)}}
@keyframes nt-sweep{0%,55%{transform:translateX(0) skewX(-18deg)}100%{transform:translateX(560%) skewX(-18deg)}}
.nt-pagehero h1{margin-top:0;color:#fff}
.nt-pagehero h1::after{content:"";display:block;width:4rem;height:4px;margin-top:.6rem;border-radius:2px;background:var(--nt-grad)}
.nt-pagehero>*:last-child{margin-bottom:0}
@media(max-width:600px){.nt-pagehero{padding:1.4rem 1.1rem;border-radius:16px}}
/* Buttons: one consistent gold primary + navy/gold secondary, large hit areas */
.btn{border-radius:14px;min-height:56px;letter-spacing:.01em}
.nt-motion .btn{transition:transform .2s var(--nt-ease),box-shadow .2s var(--nt-ease),background-color .2s,filter .2s}
.nt-motion .btn:hover{transform:translateY(-2px)}
.nt-motion .btn:active{transform:translateY(1px) scale(.98)}
/* Cards: hover lift + gold edge (pointer devices only) */
@media(hover:hover){.nt-motion .card{transition:transform .35s var(--nt-ease),box-shadow .35s var(--nt-ease),border-color .35s}
  .nt-motion a.card:hover,.nt-motion .card.nt-lift:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(0,0,0,.4),0 0 0 1px rgba(255,213,79,.6)}}
/* Scroll reveal (added by nt-motion.js; content is visible by default without JS or with reduced motion) */
.nt-motion .nt-rv{opacity:0;transform:translate3d(0,28px,0);transition:opacity .8s var(--nt-ease),transform .8s var(--nt-ease)}
.nt-motion .nt-rv.nt-in{opacity:1;transform:none}
/* "Next steps" band shared by many pages */
section.next{border-radius:var(--nt-r)}
/* Pause-animations control (injected into the header by nt-motion.js) */
.nt-pause{display:inline-flex;align-items:center;gap:.45rem;min-height:48px;padding:.4rem .9rem;border-radius:999px;border:2px solid rgba(255,213,79,.7);background:rgba(11,30,58,.6);color:var(--nt-gold-l);font:700 .85rem/1.1 Montserrat,Arial,sans-serif;cursor:pointer}
.nt-pause:hover{background:rgba(255,199,44,.15)}
.nt-pause .nt-pi{display:inline-block;width:.9em;height:.9em;position:relative}
.nt-pause .nt-pi::before,.nt-pause .nt-pi::after{content:"";position:absolute;top:0;bottom:0;width:32%;background:currentColor;border-radius:2px}
.nt-pause .nt-pi::before{left:8%}.nt-pause .nt-pi::after{right:8%}
.nt-pause[aria-pressed=true] .nt-pi::before{left:15%;width:0;height:0;background:none;border-style:solid;border-width:.45em 0 .45em .78em;border-color:transparent transparent transparent currentColor;border-radius:0}
.nt-pause[aria-pressed=true] .nt-pi::after{display:none}
/* Paused: freeze every CSS animation on the page shell */
.nt-paused *,.nt-paused *::before,.nt-paused *::after,.nt-paused body::before{animation-play-state:paused!important}
/* Reduced motion: no animation at all */
@media (prefers-reduced-motion:reduce){.nt-rv{opacity:1!important;transform:none!important}body::before{animation:none!important}}
/* Footer polish */
footer.site nav a{text-underline-offset:4px}
footer.site{position:relative}
/* Phone header: one row (logo + Menu); settings live at the top of the opened Menu */
.nt-menu-tools{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;padding:.6rem 0 .8rem;margin-bottom:.4rem;border-bottom:1px solid rgba(255,213,79,.35)}
.nt-menu-tools .textsize{flex-wrap:wrap}
@media(max-width:760px){
  header.site .bar{flex-wrap:nowrap;padding:.45rem 0;gap:.5rem}
  header.site .logo-svg{width:180px;height:40px}
  header.site .menu-btn{min-height:48px;padding:.4rem 1rem;flex:none}
}

/* Footer pause-animations text link (replaces the old header button) */
.nt-foot-motion{margin:.6rem 0 0;font-size:.9rem}
.nt-pause.nt-pause-foot{display:inline;min-height:0;padding:.5rem 0;border:0;border-radius:0;background:none;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;opacity:.85}
.nt-pause.nt-pause-foot:hover{background:none;opacity:1}
.nt-pause.nt-pause-foot .nt-pi{display:none}
.nt-pause.nt-pause-foot:focus-visible{outline:3px solid var(--nt-gold-l,#FFD54F);outline-offset:3px}