/* ===========================================================
   Op-SETT Technologies — Design Tokens
   Palette:  --navy-900 #0A1A30 (deep structural)
             --navy-700 #102D52 (panels)
             --navy-500 #1B4A85 (mid accents, links)
             --orange-500 #F4791F (primary accent / CTA)
             --orange-300 #FFA866 (hover / highlight)
             --paper #F4F5F7 (light section bg)
             --ink #0E1A2B (body text on light)
             --steel #6E7A8A (muted text)
   Type: Display = 'Space Grotesk' (technical, geometric)
         Body    = 'Inter'
         Mono    = 'JetBrains Mono' (spec callouts / labels)
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --navy-900:#0A1A30;
  --navy-800:#0D2240;
  --navy-700:#102D52;
  --navy-600:#163C6B;
  --navy-500:#1B4A85;
  --orange-600:#D9650F;
  --orange-500:#F4791F;
  --orange-300:#FFA866;
  --paper:#F4F5F7;
  --paper-dim:#E8EAEE;
  --ink:#0E1A2B;
  --steel:#6E7A8A;
  --steel-200:#C7CDD6;
  --white:#FFFFFF;

  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;

  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:14px;

  --shadow-soft: 0 12px 32px rgba(10,26,48,0.10);
  --shadow-deep: 0 20px 50px rgba(10,26,48,0.28);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea,button{max-width:100%;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{font-family:var(--font-display);margin:0;line-height:1.1;}
p{margin:0;}

:focus-visible{
  outline:2px solid var(--orange-500);
  outline-offset:3px;
}

.container{
  width:100%;
  max-width:1240px;
  margin-inline:auto;
  padding-inline:32px;
}

.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--orange-500);
  display:flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:18px;height:1px;
  background:var(--orange-500);
  display:inline-block;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:0;
  padding:13px 26px;
  border-radius:var(--radius-sm);
  font-weight:600;
  font-size:15px;
  line-height:1.25;
  text-align:center;
  border:1px solid transparent;
  transition:transform .15s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.btn:active{transform:translateY(1px);}
.btn-primary{
  background:var(--orange-500);
  color:var(--white);
}
.btn-primary:hover{background:var(--orange-600);}
.btn-ghost{
  background:transparent;
  border-color:rgba(255,255,255,0.28);
  color:var(--white);
}
.btn-ghost:hover{border-color:var(--orange-500);color:var(--orange-300);}
.btn-outline-navy{
  background:transparent;
  border-color:var(--navy-700);
  color:var(--navy-700);
}
.btn-outline-navy:hover{background:var(--navy-700);color:var(--white);}
.btn-block{width:100%;}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

@media (max-width:560px){
  .container{padding-inline:20px;}
  .btn{width:100%;padding-inline:18px;}
}