@charset "UTF-8";
/* ZASH CONSULT - premium refinement, v3
   Same brand colour, refined hierarchy, depth and motion. */

:root{
  /* Colour — slightly cooler, tighter contrast */
  --ink:#0A1F29;
  --ink-soft:#3A5462;
  --ink-mute:#6F8693;
  --line:#E4ECF1;
  --line-soft:#EFF4F7;
  --paper:#FFFFFF;
  --paper-2:#F6F9FB;
  --paper-3:#EBF2F6;

  /* Brand — preserved */
  --brand:#4A9CB8;
  --brand-deep:#2E7A95;
  --brand-soft:#7FB3C7;
  --brand-tint:#D6E8F0;
  --brand-wash:#EEF6FA;

  /* Type */
  --font-display:"Space Grotesk","Helvetica Neue",Arial,sans-serif;
  --font-body:"Inter Tight","Inter","Helvetica Neue",Arial,sans-serif;
  --font-serif:"Fraunces",Georgia,serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;

  /* Type scale — tighter, more deliberate */
  --step--1:clamp(.82rem,.78rem + .18vw,.92rem);
  --step-0:clamp(.95rem,.90rem + .20vw,1.05rem);
  --step-1:clamp(1.08rem,1rem + .35vw,1.22rem);
  --step-2:clamp(1.30rem,1.15rem + .65vw,1.55rem);
  --step-3:clamp(1.65rem,1.40rem + 1vw,2.10rem);
  --step-4:clamp(2.10rem,1.70rem + 1.8vw,2.95rem);
  --step-5:clamp(2.60rem,2rem + 2.6vw,4.00rem);
  --step-6:clamp(2.90rem,2.20rem + 3.6vw,4.80rem);

  /* Radius */
  --r-sm:6px;--r-md:14px;--r-lg:20px;--r-xl:28px;

  /* Layout */
  --container:1200px;

  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  /* Elevation */
  --shadow-xs:0 1px 2px rgba(14,42,54,.04);
  --shadow-sm:0 1px 2px rgba(14,42,54,.04),0 4px 14px -6px rgba(14,42,54,.10);
  --shadow-md:0 1px 2px rgba(14,42,54,.05),0 12px 28px -10px rgba(14,42,54,.14);
  --shadow-lg:0 2px 4px rgba(14,42,54,.06),0 24px 48px -16px rgba(14,42,54,.18);
  --ring-brand:0 0 0 1px rgba(74,156,184,.18);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;overflow-x:hidden;font-family:var(--font-body);font-size:var(--step-0);line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01","cv11"}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
::selection{background:var(--brand-tint);color:var(--ink)}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:4px}

.container{max-width:var(--container);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.25rem)}
.section{padding:clamp(4.5rem,9vw,7.5rem) 0;position:relative}
.section-tone{background:var(--paper-2)}
.section-wash{background:var(--brand-wash)}

/* Eyebrows */
.eyebrow{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--brand-deep);display:inline-flex;align-items:center;gap:.65rem;font-weight:500}
.eyebrow::before{content:"";width:24px;height:1px;background:currentColor;display:inline-block;opacity:.6}

/* Headings */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;letter-spacing:-.025em;line-height:1.05;margin:0;color:var(--ink)}
h1{font-size:var(--step-6);letter-spacing:-.04em;line-height:1.02}
h2{font-size:var(--step-5);letter-spacing:-.035em;line-height:1.05}
h3{font-size:var(--step-3);letter-spacing:-.025em;line-height:1.1}
h4{font-size:var(--step-2);letter-spacing:-.015em}
p{margin:0 0 1em;color:var(--ink-soft);text-wrap:pretty}
.lead{font-size:var(--step-1);color:var(--ink-soft);max-width:62ch;line-height:1.55}
.italic-accent{font-family:var(--font-serif);font-style:italic;font-weight:400;color:var(--brand-deep)}

/* Buttons — refined premium feel */
.btn{display:inline-flex;align-items:center;gap:.55rem;padding:.85rem 1.35rem;border-radius:999px;font-weight:500;font-size:.94rem;line-height:1;letter-spacing:-.005em;transition:transform .25s var(--ease),background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),box-shadow .35s var(--ease);white-space:nowrap;will-change:transform}
.btn .arrow{transition:transform .35s var(--ease);display:inline-block}
.btn:hover .arrow{transform:translateX(3px)}
.btn:active{transform:translateY(0) scale(.98)}

.btn-primary{
  background:linear-gradient(180deg,#56adcb 0%,var(--brand) 60%,var(--brand-deep) 100%);
  color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 6px 18px -6px rgba(46,122,149,.55),0 1px 2px rgba(14,42,54,.10);
}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 12px 26px -10px rgba(46,122,149,.65),0 2px 4px rgba(14,42,54,.12)}
.btn-primary:focus-visible{outline-offset:4px}

.btn-ghost{color:var(--ink);border:1px solid var(--line);background:var(--paper)}
.btn-ghost:hover{background:var(--paper-2);border-color:var(--brand-soft);color:var(--brand-deep);transform:translateY(-1px);box-shadow:var(--shadow-xs)}

.btn-link{display:inline-flex;align-items:center;gap:.45rem;color:var(--brand-deep);font-weight:500;border-bottom:1px solid transparent;padding-bottom:2px;transition:border-color .25s var(--ease)}
.btn-link:hover{border-bottom-color:var(--brand-deep)}

/* Header */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(18px);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid rgba(228,236,241,.6);
  transition:border-color .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease)
}
.site-header.scrolled{
  border-bottom-color:var(--line);
  background:rgba(255,255,255,.94);
  box-shadow:0 1px 0 rgba(14,42,54,.02),0 10px 30px -18px rgba(14,42,54,.16)
}
/* Scroll progress bar */
.scroll-progress{position:absolute;top:0;left:0;height:2px;width:100%;background:transparent;z-index:60;overflow:hidden;pointer-events:none}
.scroll-progress::before{
  content:"";position:absolute;inset:0;width:var(--progress,0%);
  background:linear-gradient(90deg,var(--brand-soft),var(--brand) 45%,var(--brand-deep));
  transition:width .12s linear;
  box-shadow:0 0 14px rgba(74,156,184,.45)
}

.nav{display:flex;align-items:center;justify-content:space-between;height:78px;gap:1.5rem}
.brand{display:inline-flex;align-items:center;gap:.7rem;transition:opacity .25s var(--ease),transform .35s var(--ease);flex-shrink:0;min-width:0}
.brand:hover{opacity:.85;transform:translateY(-1px)}
.brand img{height:42px;width:auto;display:block}

.nav-links{display:flex;gap:2.4rem;align-items:center;list-style:none;padding:0;margin:0;flex-shrink:0}
.nav-links a{font-size:.92rem;color:var(--ink-soft);position:relative;transition:color .25s var(--ease);padding:.5rem 0;font-weight:500;letter-spacing:-.005em}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1.5px;background:var(--brand-deep);transition:right .4s var(--ease);border-radius:2px}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a.active::after,.nav-links a:hover::after{right:0}

.nav-cta{display:flex;align-items:center;gap:.85rem;flex-shrink:0;min-width:0}

.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em}
.lang-switch button{padding:.4rem .7rem;border-radius:999px;color:var(--ink-mute);text-transform:uppercase;transition:background .25s var(--ease),color .25s var(--ease);font-weight:500}
.lang-switch button.active{background:var(--ink);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 4px 10px -4px rgba(14,42,54,.3)}
.lang-switch button:hover:not(.active){color:var(--ink)}

.menu-btn{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:999px;align-items:center;justify-content:center;background:var(--paper);transition:border-color .2s var(--ease)}
.menu-btn:hover{border-color:var(--brand-soft)}
.menu-btn span{display:block;width:16px;height:1.5px;background:var(--ink);position:relative;transition:background .2s var(--ease)}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--ink);transition:transform .3s var(--ease),top .3s var(--ease)}
.menu-btn span::before{top:-5px}
.menu-btn span::after{top:5px}
.menu-open .menu-btn span{background:transparent}
.menu-open .menu-btn span::before{top:0;transform:rotate(45deg)}
.menu-open .menu-btn span::after{top:0;transform:rotate(-45deg)}
.nav-mobile{position:fixed;top:72px;left:0;right:0;background:rgba(255,255,255,.97);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line);transform:translateY(-110%);opacity:0;transition:transform .5s var(--ease-out),opacity .35s var(--ease);padding:1.25rem clamp(1.25rem,4vw,2.25rem) 2rem;z-index:49;box-shadow:0 20px 50px -20px rgba(14,42,54,.18)}
body.menu-open .nav-mobile{transform:translateY(0);opacity:1}
/* Backdrop dim */
.menu-backdrop{position:fixed;inset:0;background:rgba(10,31,41,.35);opacity:0;pointer-events:none;transition:opacity .35s var(--ease);z-index:48;backdrop-filter:blur(2px)}
body.menu-open .menu-backdrop{opacity:1;pointer-events:auto}
.nav-mobile ul{list-style:none;padding:0;margin:0;display:grid;gap:.2rem}
.nav-mobile a{font-family:var(--font-display);font-size:var(--step-3);color:var(--ink);padding:.65rem 0;display:block;border-bottom:1px solid var(--line-soft);letter-spacing:-.02em;transition:color .2s var(--ease)}
.nav-mobile a:hover{color:var(--brand-deep)}
.nav-mobile-foot{display:none}

/* Hero */
.hero{padding:clamp(3rem,7vw,5.5rem) 0 clamp(3rem,7vw,5rem);position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(55% 45% at 88% 18%,var(--brand-tint) 0%,transparent 60%),
    radial-gradient(45% 45% at 8% 92%,var(--brand-wash) 0%,transparent 60%);
  pointer-events:none;z-index:0;opacity:.85
}
.hero>*{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.hero-title{font-size:var(--step-6);line-height:1.02;letter-spacing:-.04em;margin:1.1rem 0 1.4rem}
.hero-sub{max-width:48ch;font-size:var(--step-1);color:var(--ink-soft);margin-bottom:2.2rem;line-height:1.55}
.hero-cta{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}
.hero-meta{margin-top:clamp(2.5rem,5vw,3.5rem);display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;border-top:1px solid var(--line);padding-top:1.5rem;max-width:560px}
.hero-meta .stat-num{font-family:var(--font-display);font-size:var(--step-3);letter-spacing:-.025em;color:var(--ink);display:block;line-height:1}
.hero-meta .stat-label{font-size:.78rem;color:var(--ink-mute);margin-top:.5rem;display:block;line-height:1.35;letter-spacing:.005em}

/* Hero visual — real photo, cover-fit, refined frame */
.hero-visual{position:relative;aspect-ratio:4/5;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-md);background:var(--paper-2)}
.hero-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,31,41,0) 50%,rgba(10,31,41,.35) 100%);
  pointer-events:none;z-index:1
}
.hero-visual img{width:100%;height:100%;object-fit:cover;transform:scale(1.001);transition:transform 1.4s var(--ease-out)}
.hero-visual:hover img{transform:scale(1.03)}
.hero-tag{position:absolute;top:1rem;left:1rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);background:rgba(255,255,255,.92);padding:.42rem .65rem;border-radius:999px;border:1px solid rgba(255,255,255,.6);backdrop-filter:blur(6px);z-index:2;box-shadow:var(--shadow-xs)}
.hero-corner{position:absolute;bottom:1rem;right:1rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;color:rgba(255,255,255,.92);text-transform:uppercase;z-index:2;text-shadow:0 1px 2px rgba(0,0,0,.25)}

/* Hero visual — logo variant (light tonal card) */
.hero-visual.hero-visual-logo{
  background:
    radial-gradient(70% 60% at 50% 40%, var(--paper) 0%, var(--brand-wash) 60%, var(--brand-tint) 100%);
  display:flex;align-items:center;justify-content:center
}
.hero-visual.hero-visual-logo::after{
  background:
    radial-gradient(45% 35% at 50% 50%, rgba(74,156,184,.18), transparent 70%),
    linear-gradient(180deg, transparent 70%, rgba(74,156,184,.06) 100%)
}
.hero-visual.hero-visual-logo img{
  width:auto;height:auto;max-width:62%;max-height:48%;object-fit:contain;
  filter:drop-shadow(0 22px 44px rgba(46,122,149,.22));
  transform:translateY(0);transition:none;
  animation:logo-float 7s cubic-bezier(.22,.61,.36,1) infinite
}
.hero-visual.hero-visual-logo:hover img{transform:translateY(0)}
.hero-visual.hero-visual-logo .hero-corner{color:var(--ink-mute);text-shadow:none}
@keyframes logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* Hero visual — animated antenna scene (premium centerpiece) */
.hero-visual.hero-visual-antenna{
  background:linear-gradient(180deg,#EEF6FA 0%,#D6E8F0 60%,#B7D4E0 100%);
  display:block;overflow:hidden
}
.hero-visual.hero-visual-antenna::after{display:none;content:none}
.hero-antenna-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-visual.hero-visual-antenna .hero-corner{color:rgba(10,31,41,.6);text-shadow:none}
.hero-visual.hero-visual-antenna .hero-tag{
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.7);box-shadow:var(--shadow-sm)
}

/* Coords ticker (top-right) */
.hero-coords{
  position:absolute;top:1rem;right:1rem;z-index:2;
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;
  color:rgba(10,31,41,.55);text-transform:uppercase;
  background:rgba(255,255,255,.7);backdrop-filter:blur(8px);
  padding:.3rem .55rem;border-radius:6px;border:1px solid rgba(228,236,241,.7)
}

/* Live indicator (bottom-left, above info bar) */
.hero-live{
  position:absolute;left:1rem;bottom:3.4rem;z-index:2;
  display:inline-flex;align-items:center;gap:.45rem;
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:#1f5b71;
  background:rgba(255,255,255,.85);backdrop-filter:blur(8px);
  padding:.3rem .55rem .3rem .5rem;border-radius:999px;
  border:1px solid rgba(228,236,241,.7);box-shadow:var(--shadow-xs)
}
.hero-live-dot{
  width:7px;height:7px;border-radius:50%;background:#3bbf7c;
  box-shadow:0 0 0 0 rgba(59,191,124,.65);
  animation:live-pulse 1.8s cubic-bezier(.22,.61,.36,1) infinite
}
@keyframes live-pulse{
  0%{box-shadow:0 0 0 0 rgba(59,191,124,.6)}
  70%{box-shadow:0 0 0 8px rgba(59,191,124,0)}
  100%{box-shadow:0 0 0 0 rgba(59,191,124,0)}
}

/* Bottom info bar */
.hero-info{
  position:absolute;left:1rem;right:1rem;bottom:1rem;z-index:2;
  display:flex;justify-content:space-between;gap:.7rem;
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(10,31,41,.7);
  background:rgba(255,255,255,.8);backdrop-filter:blur(10px);
  padding:.55rem .75rem;border-radius:8px;
  border:1px solid rgba(228,236,241,.7)
}

/* Antenna — ring pulse animation */
.ha-ring{transform-origin:center;transform-box:fill-box}
.ha-ring-1{animation:ring-pulse 4s cubic-bezier(.22,.61,.36,1) infinite}
.ha-ring-2{animation:ring-pulse 4s cubic-bezier(.22,.61,.36,1) infinite;animation-delay:1.33s}
.ha-ring-3{animation:ring-pulse 4s cubic-bezier(.22,.61,.36,1) infinite;animation-delay:2.66s}
@keyframes ring-pulse{
  0%{transform:scale(.45);opacity:0}
  10%{opacity:.95}
  100%{transform:scale(4.2);opacity:0}
}

/* Antenna — tip glow */
.ha-tip{transform-origin:center;transform-box:fill-box;animation:tip-glow 2.4s cubic-bezier(.22,.61,.36,1) infinite}
@keyframes tip-glow{
  0%,100%{transform:scale(1);opacity:.85}
  50%{transform:scale(1.5);opacity:.25}
}

/* Antenna — beam fade */
.ha-beam{stroke-dasharray:6 8;animation:beam-flow 6s linear infinite}
.ha-beams .ha-beam:nth-child(2){animation-duration:8s}
.ha-beams .ha-beam:nth-child(3){animation-duration:10s}
@keyframes beam-flow{to{stroke-dashoffset:-140}}

/* Antenna — data point pulses */
.ha-point-pulse{transform-origin:center;transform-box:fill-box;animation:point-pulse 2.8s cubic-bezier(.22,.61,.36,1) infinite}
.ha-point-2 .ha-point-pulse{animation-delay:.7s}
.ha-point-3 .ha-point-pulse{animation-delay:1.4s}
.ha-point-4 .ha-point-pulse{animation-delay:2.1s}
@keyframes point-pulse{
  0%{transform:scale(1);opacity:.9}
  100%{transform:scale(5);opacity:0}
}

/* Tower subtle drift */
.ha-tower{transform-origin:240px 500px;transform-box:fill-box;animation:tower-drift 12s ease-in-out infinite}
@keyframes tower-drift{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-3px) rotate(-.12deg)}
}

/* Marquee — calmer */
.marquee-strip{margin-top:clamp(3rem,6vw,5rem);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.15rem 0;overflow:hidden;position:relative;background:var(--paper)}
.marquee-strip::before,.marquee-strip::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.marquee-strip::before{left:0;background:linear-gradient(90deg,var(--paper),transparent)}
.marquee-strip::after{right:0;background:linear-gradient(-90deg,var(--paper),transparent)}
.marquee-track{display:flex;gap:3.5rem;width:max-content;animation:marquee 60s linear infinite}
.marquee-track span{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);white-space:nowrap;display:inline-flex;align-items:center;gap:3.5rem}
.marquee-track span::after{content:"·";color:var(--brand-soft);font-size:1.4em;line-height:0}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Section heads */
.section-head{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem)}
.section-head h2{max-width:18ch;margin-top:.8rem}

/* Image gallery — real photos, refined */
.image-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-auto-rows:230px;gap:.85rem}
.image-card{position:relative;background:var(--paper-2);border-radius:var(--r-md);overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-xs);transition:box-shadow .35s var(--ease),transform .5s var(--ease-out)}
.image-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.image-card.tall{grid-row:span 2}
.image-card>img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.image-card:hover>img{transform:scale(1.04)}
.image-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,31,41,0) 55%,rgba(10,31,41,.55) 100%);pointer-events:none}
.image-card .caption{position:absolute;bottom:.85rem;left:.95rem;right:.95rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;display:flex;justify-content:space-between;z-index:1;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.image-placeholder{background:linear-gradient(135deg,var(--brand-wash) 0%,var(--paper-2) 100%);position:relative}
.image-placeholder::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 50%,rgba(74,156,184,.10),transparent 70%)}
.image-placeholder::after{content:attr(data-label);background:none;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-deep);display:flex;align-items:center;justify-content:center;text-shadow:none;font-weight:500}
.image-placeholder .caption{display:none}

/* Image gallery — stat card variant */
.image-card.stat-card{
  background:var(--paper);border:1px solid var(--line);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;
  padding:1.5rem 1.5rem 1.4rem;gap:.45rem
}
.image-card.stat-card::after{display:none}
.image-card.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--brand-soft)}
.image-card.stat-card .top{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--brand-deep);font-weight:500;margin-bottom:auto
}
.image-card.stat-card .num{
  font-family:var(--font-display);font-size:clamp(2.4rem,5vw,3.4rem);font-weight:500;
  letter-spacing:-.035em;color:var(--ink);line-height:1;display:inline-flex;align-items:flex-start
}
.image-card.stat-card .num-plus{font-size:.55em;color:var(--brand);margin-left:.1em;line-height:1.1}
.image-card.stat-card .lbl{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-mute);max-width:22ch;line-height:1.5
}

/* Service cards */
.services{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-xs)}
.service-card{background:var(--paper);padding:clamp(1.85rem,3vw,2.5rem);display:flex;flex-direction:column;gap:1rem;min-height:300px;transition:background .35s var(--ease)}
.service-card:hover{background:var(--paper-2)}
.service-num{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;color:var(--brand-deep);font-weight:500}
.service-card h3{font-size:var(--step-2);max-width:14ch;margin-top:.2rem}
.service-card p{color:var(--ink-soft);margin:0;max-width:42ch}
.service-card ul{list-style:none;padding:1.1rem 0 0;margin:auto 0 0;border-top:1px solid var(--line-soft);display:flex;flex-wrap:wrap;gap:.4rem 1rem}
.service-card li{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;color:var(--ink-mute);text-transform:uppercase}
.service-card li::before{content:"—";margin-right:.4rem;color:var(--brand)}

/* Process — timeline feel */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.process-step{position:relative;border-top:1px solid var(--line);padding-top:1.4rem;display:flex;flex-direction:column;gap:.6rem}
.process-step::before{content:"";position:absolute;top:-3px;left:0;width:36px;height:5px;background:var(--brand);border-radius:999px}
.process-step .num{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;color:var(--brand-deep);font-weight:500}
.process-step h4{font-size:var(--step-1);font-weight:500;letter-spacing:-.012em}
.process-step p{font-size:var(--step--1);color:var(--ink-soft);margin:0}

/* Page hero (sub-pages) */
.page-hero{padding:clamp(4rem,8vw,6.5rem) 0 clamp(3rem,5vw,4.5rem);background:linear-gradient(180deg,var(--brand-wash) 0%,var(--paper) 100%);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(40% 60% at 90% 0%,var(--brand-tint),transparent 60%);pointer-events:none;opacity:.5}
.page-hero>*{position:relative}
.page-hero h1{font-size:var(--step-5);max-width:20ch;margin-top:.85rem}
.page-hero p{max-width:62ch;margin-top:1.1rem;font-size:var(--step-1);color:var(--ink-soft)}
.crumbs{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute)}
.crumbs a{color:var(--brand-deep);transition:color .2s var(--ease)}
.crumbs a:hover{color:var(--ink)}
.crumbs span{margin:0 .55rem;opacity:.45}

/* Service detail */
.svc-detail{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(2rem,5vw,5rem);align-items:start;padding:clamp(3.5rem,7vw,5.5rem) 0;border-bottom:1px solid var(--line)}
.svc-detail:last-of-type{border-bottom:0}
.svc-detail .svc-num{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.2em;color:var(--brand-deep);font-weight:500}
.svc-detail h2{font-size:var(--step-4);margin-top:.85rem;max-width:14ch}
.svc-detail .lead{margin-top:1.1rem}
.svc-detail-points{list-style:none;padding:0;margin:1.6rem 0 0;display:grid;gap:0}
.svc-detail-points li{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:baseline;padding:1.1rem 0;border-top:1px solid var(--line)}
.svc-detail-points li:last-child{border-bottom:1px solid var(--line)}
.svc-detail-points .num{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;color:var(--brand-deep);font-weight:500;padding-top:.15rem}
.svc-detail-points strong{font-family:var(--font-display);font-weight:500;font-size:var(--step-1);display:block;margin-bottom:.3rem;color:var(--ink);letter-spacing:-.01em}
.svc-detail-points span.sub{color:var(--ink-soft);font-size:var(--step--1);line-height:1.55}
.svc-figure{position:sticky;top:96px;aspect-ratio:1/1;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);background:var(--paper-2)}
.svc-figure img{width:100%;height:100%;object-fit:cover}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.about-figure{position:relative;aspect-ratio:3/4;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.about-figure img{width:100%;height:100%;object-fit:cover}
.about-figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,31,41,0) 55%,rgba(10,31,41,.45) 100%);pointer-events:none}
.about-figure figcaption{position:absolute;bottom:1rem;left:1rem;right:1rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;display:flex;justify-content:space-between;z-index:1;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.about-points{list-style:none;padding:0;margin:0;display:grid;gap:0;border-top:1px solid var(--line)}
.about-points li{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:baseline;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.about-points .num{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.18em;color:var(--brand-deep);font-weight:500;padding-top:.15rem}
.about-points strong{font-family:var(--font-display);font-weight:500;font-size:var(--step-1);display:block;margin-bottom:.3rem;color:var(--ink);letter-spacing:-.01em}
.about-points span.sub{color:var(--ink-soft);font-size:var(--step--1);line-height:1.55}

/* Values */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.value{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:1.85rem;transition:border-color .3s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);box-shadow:var(--shadow-xs)}
.value:hover{border-color:var(--brand-soft);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.value h4{font-size:var(--step-1);margin-bottom:.65rem;font-weight:500;letter-spacing:-.01em}
.value p{font-size:var(--step--1);color:var(--ink-soft);margin:0;line-height:1.55}
.value .v-num{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;color:var(--brand-deep);margin-bottom:.9rem;display:block;font-weight:500}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,5rem);align-items:start}
.contact-list{list-style:none;padding:0;margin:0;display:grid;gap:0;border-top:1px solid var(--line)}
.contact-list li{display:grid;grid-template-columns:130px 1fr;gap:1.5rem;align-items:baseline;font-size:var(--step-0);padding:1.1rem 0;border-bottom:1px solid var(--line)}
.contact-list .label{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);font-weight:500}
.contact-list a{transition:color .2s var(--ease)}
.contact-list a:hover{color:var(--brand-deep)}
.contact-form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.85rem,3vw,2.5rem);display:grid;gap:1.05rem;box-shadow:var(--shadow-md)}
.field{display:grid;gap:.4rem}
.field label{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);font-weight:500}
.field input,.field textarea,.field select{font:inherit;padding:.85rem .95rem;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper-2);color:var(--ink);transition:border-color .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease)}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--brand);background:var(--paper);box-shadow:var(--ring-brand)}
.contact-form .actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.4rem;flex-wrap:wrap}
.contact-form small{color:var(--ink-mute);font-size:.78rem;max-width:30ch;line-height:1.5}
.form-success{display:none;padding:1rem 1.2rem;background:var(--brand-wash);border:1px solid var(--brand-tint);color:var(--brand-deep);border-radius:var(--r-sm);font-size:.92rem}
.form-success.show{display:block}

/* Map card — refined */
.map-card{
  margin-top:1.75rem;aspect-ratio:16/9;border-radius:var(--r-md);border:1px solid var(--line);position:relative;overflow:hidden;
  background:
    linear-gradient(135deg,var(--brand-wash) 0%,var(--paper-2) 100%);
  box-shadow:var(--shadow-xs)
}
.map-card::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(0deg,rgba(74,156,184,.06) 1px,transparent 1px) 0 0/100% 36px,
    linear-gradient(90deg,rgba(74,156,184,.06) 1px,transparent 1px) 0 0/36px 100%;
  pointer-events:none
}
.map-card::before{content:"";position:absolute;top:50%;left:50%;width:14px;height:14px;background:var(--brand);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 6px rgba(74,156,184,.18),0 0 0 14px rgba(74,156,184,.08),0 4px 12px rgba(46,122,149,.35);z-index:1;animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 6px rgba(74,156,184,.18),0 0 0 14px rgba(74,156,184,.08),0 4px 12px rgba(46,122,149,.35)}50%{box-shadow:0 0 0 8px rgba(74,156,184,.22),0 0 0 18px rgba(74,156,184,.10),0 4px 12px rgba(46,122,149,.35)}}
.map-card .pin-label{position:absolute;top:calc(50% + 18px);left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--paper);padding:.35rem .7rem;border-radius:6px;border:1px solid var(--line);white-space:nowrap;z-index:2;box-shadow:var(--shadow-xs)}

/* Map card — live (real iframe map) */
.map-card-live{aspect-ratio:16/10;background:var(--paper-2);margin-top:0}
.map-card-live::before,.map-card-live::after{display:none;animation:none;content:none}
.map-card-live iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;filter:saturate(.92) contrast(.97)}
.map-card-live .pin-label{
  top:auto;bottom:1rem;left:50%;transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:.25rem;
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);background:var(--paper);padding:.45rem .8rem;border-radius:999px;
  border:1px solid var(--line);box-shadow:var(--shadow-md);
  text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s var(--ease)
}
.map-card-live .pin-label:hover{transform:translateX(-50%) translateY(-1px);box-shadow:var(--shadow-lg);color:var(--brand-deep)}

/* Contact action buttons */
.contact-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.75rem}

/* CTA strip */
.cta-strip{
  position:relative;color:#fff;border-radius:var(--r-xl);padding:clamp(2.5rem,5vw,4rem);
  display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center;
  background:
    radial-gradient(120% 100% at 0% 0%,#5fb0cc 0%,transparent 60%),
    linear-gradient(135deg,var(--brand) 0%,var(--brand-deep) 100%);
  box-shadow:var(--shadow-lg);
  overflow:hidden
}
.cta-strip::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(60% 70% at 100% 100%,rgba(255,255,255,.15),transparent 60%);
  pointer-events:none
}
.cta-strip>*{position:relative}
.cta-strip h3{color:#fff;font-size:var(--step-4);max-width:18ch;letter-spacing:-.03em;line-height:1.05}
.cta-strip p{color:rgba(255,255,255,.85);margin:.85rem 0 0;max-width:50ch}
.cta-strip .actions{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:flex-end}
.cta-strip .btn-primary{background:#fff;color:var(--brand-deep);box-shadow:0 1px 2px rgba(14,42,54,.15),0 6px 16px -6px rgba(0,0,0,.25)}
.cta-strip .btn-primary:hover{background:var(--paper-3);transform:translateY(-1px)}
.cta-strip .btn-ghost{color:#fff;border-color:rgba(255,255,255,.32);background:transparent}
.cta-strip .btn-ghost:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.6);color:#fff}

/* Footer */
.site-footer{background:var(--paper-2);border-top:1px solid var(--line);padding:clamp(3.5rem,5vw,5rem) 0 1.75rem;margin-top:clamp(3rem,6vw,5rem)}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:2.5rem}
.footer-grid h5{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 1.1rem;font-weight:500}
.footer-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:.65rem}
.footer-grid a,.footer-grid li{color:var(--ink-soft);font-size:.93rem;transition:color .2s var(--ease)}
.footer-grid a:hover{color:var(--brand-deep)}
.footer-brand p{color:var(--ink-soft);max-width:38ch;margin-top:1.1rem;font-size:.93rem;line-height:1.6}
.footer-base{border-top:1px solid var(--line);padding-top:1.25rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:.72rem;color:var(--ink-mute);letter-spacing:.08em}

/* ============================================================
   CAPABILITY BAND — chips of bands/standards/tools
   ============================================================ */
.capability-band{padding:clamp(2rem,4vw,3rem) 0;background:var(--paper);border-bottom:1px solid var(--line)}
.cap-grid{display:grid;grid-template-columns:1fr 2fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.cap-head h3{font-size:var(--step-1);font-weight:500;letter-spacing:-.015em;margin-top:.65rem;max-width:22ch;line-height:1.3}
.cap-chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.5rem}
.cap-chips li{
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);
  padding:.5rem .8rem;border-radius:999px;
  background:var(--paper-2);border:1px solid var(--line);
  transition:border-color .25s var(--ease),color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease)
}
.cap-chips li:hover{border-color:var(--brand-soft);color:var(--brand-deep);background:var(--brand-wash);transform:translateY(-1px)}

/* ============================================================
   COVERAGE MAP
   ============================================================ */
.section-coverage{background:linear-gradient(180deg,var(--paper) 0%,var(--brand-wash) 100%)}
.coverage-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.coverage-map{
  position:relative;aspect-ratio:5/4;border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(135deg,#F6F9FB 0%,#EBF2F6 100%);
  border:1px solid var(--line);box-shadow:var(--shadow-md)
}
.cov-grid-bg{
  position:absolute;inset:0;
  background:
    linear-gradient(0deg,rgba(74,156,184,.07) 1px,transparent 1px) 0 0/100% 28px,
    linear-gradient(90deg,rgba(74,156,184,.07) 1px,transparent 1px) 0 0/28px 100%;
  pointer-events:none
}
.cov-svg{position:absolute;inset:0;width:100%;height:100%}
.cov-corner{
  position:absolute;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-mute);background:rgba(255,255,255,.85);
  padding:.32rem .55rem;border-radius:6px;border:1px solid var(--line);z-index:2;backdrop-filter:blur(6px)
}
.cov-corner-tl{top:1rem;left:1rem}
.cov-corner-br{bottom:1rem;right:1rem}
.cov-pulse{transform-origin:center;transform-box:fill-box;animation:cov-pulse 3s cubic-bezier(.22,.61,.36,1) infinite}
.cov-s2 .cov-pulse{animation-delay:.4s}
.cov-s3 .cov-pulse{animation-delay:.8s}
.cov-s4 .cov-pulse{animation-delay:1.2s}
.cov-s5 .cov-pulse{animation-delay:1.6s}
.cov-s6 .cov-pulse{animation-delay:.2s}
.cov-s7 .cov-pulse{animation-delay:1s}
.cov-s8 .cov-pulse{animation-delay:1.8s}
.cov-s9 .cov-pulse{animation-delay:.6s}
.cov-s10 .cov-pulse{animation-delay:1.4s}
.cov-s11 .cov-pulse{animation-delay:2.2s}
.cov-s12 .cov-pulse{animation-delay:.9s}
.cov-s13 .cov-pulse{animation-delay:1.7s}
.cov-s14 .cov-pulse{animation-delay:2.5s}
.cov-s15 .cov-pulse{animation-delay:.3s}
@keyframes cov-pulse{
  0%{transform:scale(1);opacity:.9}
  100%{transform:scale(5);opacity:0}
}
.coverage-side{display:flex;flex-direction:column;gap:1.75rem;align-items:flex-start}
.cov-stats{list-style:none;padding:0;margin:0;display:grid;gap:0;width:100%;border-top:1px solid var(--line)}
.cov-stats li{
  display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:baseline;
  padding:1.1rem 0;border-bottom:1px solid var(--line)
}
.cov-stats .k{
  font-family:var(--font-display);font-size:var(--step-3);font-weight:500;letter-spacing:-.025em;
  color:var(--ink);line-height:1;min-width:3.4ch
}
.cov-stats .v{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-mute);line-height:1.5
}

/* ============================================================
   BRAND MARK — about page logo showcase
   ============================================================ */
.section-mark{padding:clamp(1.5rem,4vw,3rem) 0 clamp(3rem,6vw,5rem)}
.brand-mark{
  position:relative;
  aspect-ratio:16/9;
  max-height:560px;
  border-radius:var(--r-xl);
  overflow:hidden;
  background:
    radial-gradient(80% 60% at 50% 35%, var(--paper) 0%, var(--brand-wash) 55%, var(--brand-tint) 100%);
  border:1px solid var(--line);
  box-shadow:var(--shadow-lg);
  display:flex;align-items:center;justify-content:center;
  margin:0
}
.bm-grid{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(0deg,rgba(74,156,184,.06) 1px,transparent 1px) 0 0/100% 32px,
    linear-gradient(90deg,rgba(74,156,184,.06) 1px,transparent 1px) 0 0/32px 100%;
  mask-image:radial-gradient(75% 70% at 50% 50%, #000 30%, transparent 80%);
  -webkit-mask-image:radial-gradient(75% 70% at 50% 50%, #000 30%, transparent 80%)
}
.bm-glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(35% 30% at 50% 45%, rgba(74,156,184,.28), transparent 70%);
  filter:blur(2px)
}
.bm-rings{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;animation:bm-rings-drift 18s ease-in-out infinite}
@keyframes bm-rings-drift{
  0%,100%{transform:scale(1) rotate(0deg);opacity:.9}
  50%{transform:scale(1.04) rotate(.5deg);opacity:1}
}

.bm-tag-tl,.bm-tag-tr{
  position:absolute;top:1.25rem;z-index:3;
  font-family:var(--font-mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);
  background:rgba(255,255,255,.85);backdrop-filter:blur(8px);
  padding:.4rem .65rem;border-radius:6px;border:1px solid rgba(228,236,241,.7);
  box-shadow:var(--shadow-xs)
}
.bm-tag-tl{left:1.25rem}
.bm-tag-tr{right:1.25rem;color:var(--brand-deep)}

.bm-logo{
  position:relative;z-index:2;
  width:auto;height:auto;
  max-width:48%;max-height:50%;
  object-fit:contain;
  filter:drop-shadow(0 30px 60px rgba(46,122,149,.32)) drop-shadow(0 4px 8px rgba(46,122,149,.14));
  animation:bm-logo-float 8s cubic-bezier(.22,.61,.36,1) infinite
}
@keyframes bm-logo-float{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-8px) scale(1.012)}
}

.bm-meta{
  position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);z-index:3;
  display:flex;align-items:center;gap:.85rem;
  background:rgba(255,255,255,.88);backdrop-filter:blur(10px);
  padding:.55rem .95rem;border-radius:999px;
  border:1px solid rgba(228,236,241,.7);box-shadow:var(--shadow-sm);
  white-space:nowrap;max-width:calc(100% - 2.5rem)
}
.bm-name{font-family:var(--font-display);font-size:.92rem;font-weight:500;color:var(--ink);letter-spacing:-.012em}
.bm-line{display:inline-block;width:1px;height:14px;background:var(--line);flex-shrink:0}
.bm-sub{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);overflow:hidden;text-overflow:ellipsis}

/* ============================================================
   QUOTE / PRINCIPLE
   ============================================================ */
.section-quote{padding:clamp(4.5rem,9vw,7.5rem) 0;background:var(--paper-2);position:relative;overflow:hidden}
.section-quote::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(60% 60% at 80% 30%,var(--brand-wash),transparent 60%);
  pointer-events:none
}
.quote-block{position:relative;max-width:920px;margin:0 auto;text-align:center}
.quote-mark{width:48px;height:auto;color:var(--brand);margin:0 auto 1.5rem;display:block}
.quote-block blockquote{
  font-family:var(--font-display);font-weight:500;
  font-size:clamp(1.45rem,3vw,2.2rem);letter-spacing:-.025em;line-height:1.25;
  color:var(--ink);margin:0 0 2rem;
  text-wrap:balance
}
.quote-block figcaption{display:flex;flex-direction:column;align-items:center;gap:.3rem}
.q-name{font-family:var(--font-display);font-size:var(--step-0);font-weight:500;color:var(--ink);letter-spacing:-.01em}
.q-role{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-deep)}

/* Reveal — premium fade-up */
.reveal{opacity:0;transform:translate3d(0,18px,0);transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}
.reveal.in{opacity:1;transform:translate3d(0,0,0)}

/* Card glow — mouse-tracked spotlight */
.has-glow{position:relative;isolation:isolate}
.has-glow::before{
  content:"";position:absolute;inset:0;
  border-radius:inherit;pointer-events:none;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(74,156,184,.12),transparent 60%);
  opacity:0;transition:opacity .35s var(--ease);z-index:0
}
.has-glow:hover::before{opacity:1}
.has-glow > *{position:relative;z-index:1}

/* Magnetic buttons — smoother base transition */
.btn-primary,.btn-ghost{transition:transform .35s var(--ease),background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),box-shadow .35s var(--ease)}

/* ============================================================
   RESPONSIVE — mobile-first, three breakpoints
   960px  tablet / large phone landscape
   640px  phone portrait
   390px  small phone (iPhone SE etc.)
   ============================================================ */

/* -- 960px: tablet & below ---------------------------------- */
@media(max-width:960px){

  /* Nav */
  .nav-links{display:none}
  .menu-btn{display:inline-flex}
  .nav-cta .btn{display:none}
  .nav-cta>.lang-switch{display:none}

  /* Nav */
  .nav{height:72px;gap:1rem}
  .brand img{height:38px}

  /* Mobile nav drawer — refined */
  .nav-mobile{
    top:72px;
    padding:0;
    display:flex;flex-direction:column;
    max-height:calc(100vh - 72px);overflow-y:auto
  }
  .nav-mobile ul{
    padding:0.5rem clamp(1.25rem,5vw,2.25rem) 0.5rem;
    gap:0
  }
  .nav-mobile a{
    font-size:var(--step-2);
    padding:1rem 0;
    letter-spacing:-.02em;
    border-bottom:1px solid var(--line-soft)
  }
  .nav-mobile a:last-child{border-bottom:0}
  .nav-mobile-foot{
    display:flex;align-items:center;justify-content:space-between;
    gap:1rem;flex-wrap:wrap;
    padding:1.25rem clamp(1.25rem,5vw,2.25rem) 1.75rem;
    border-top:1px solid var(--line);
    margin-top:.5rem
  }
  .nav-mobile-foot .btn{flex-shrink:0}

  /* Hero */
  .hero{padding:2rem 0 1.75rem}
  .hero-grid{grid-template-columns:1fr;gap:2rem}
  .hero-title{margin:.7rem 0 1rem}
  .hero-sub{max-width:none;margin-bottom:1.5rem}
  .hero-visual{
    aspect-ratio:5/4;
    max-width:none;
    margin:0;
    border-radius:var(--r-lg)
  }
  .hero-visual.hero-visual-logo{aspect-ratio:16/9}
  .hero-visual.hero-visual-antenna{aspect-ratio:5/4}
  .hero-meta{
    max-width:none;
    grid-template-columns:repeat(3,1fr);
    gap:1rem;
    margin-top:2rem;
    padding-top:1.25rem
  }
  .hero-meta .stat-num{font-size:var(--step-2)}
  .hero-meta .stat-label{font-size:.74rem}

  /* Sections */
  .section{padding:clamp(3rem,7vw,5rem) 0}
  .section-head{
    grid-template-columns:1fr;
    gap:1rem;
    align-items:start;
    margin-bottom:2rem
  }
  .section-head h2{margin-top:.6rem;max-width:none}

  /* Services */
  .services{grid-template-columns:1fr;gap:1px;border-radius:var(--r-md)}
  .service-card{min-height:auto;gap:.85rem;padding:1.6rem 1.5rem}
  .service-card h3{font-size:var(--step-1)}
  .service-card ul{padding-top:.95rem}

  /* Gallery */
  .image-grid{
    grid-template-columns:1fr 1fr;
    grid-auto-rows:190px;
    gap:.6rem
  }
  .image-card.tall{grid-row:auto}
  .image-card.stat-card .num{font-size:clamp(1.8rem,4vw,2.6rem)}

  /* Process */
  .process{grid-template-columns:repeat(2,1fr);gap:1.5rem}

  /* Page hero (sub-pages) */
  .page-hero{padding:3rem 0 2.5rem}
  .page-hero h1{font-size:var(--step-4)}

  /* Service detail */
  .svc-detail{
    grid-template-columns:1fr;
    gap:2rem;
    padding:2.5rem 0
  }
  .svc-figure{position:relative;top:auto;aspect-ratio:4/3;order:-1}

  /* About */
  .about-grid{grid-template-columns:1fr;gap:2rem}
  .about-figure{aspect-ratio:4/3;max-width:none}
  .values{grid-template-columns:1fr 1fr;gap:1rem}

  /* Contact */
  .contact-grid{grid-template-columns:1fr;gap:2rem}
  .contact-list li{grid-template-columns:1fr;gap:.3rem;padding:.85rem 0}
  .map-card-live{aspect-ratio:4/3}

  /* CTA strip */
  .cta-strip{
    grid-template-columns:1fr;
    padding:2.25rem;
    gap:1.5rem;
    border-radius:var(--r-lg)
  }
  .cta-strip h3{font-size:var(--step-3)}
  .cta-strip .actions{justify-content:flex-start}

  /* Footer */
  .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .footer-brand{grid-column:span 2}
  .site-footer{margin-top:2rem;padding:2.5rem 0 1.5rem}
}

/* -- 640px: phone portrait ---------------------------------- */
@media(max-width:640px){

  /* Nav */
  .nav{height:64px}
  .nav-mobile{top:64px;max-height:calc(100vh - 64px)}
  .brand img{height:34px}
  .menu-btn{width:40px;height:40px}

  /* Hero */
  .hero{padding:1.75rem 0 1.5rem}
  .hero-title{letter-spacing:-.035em}
  .hero-cta{gap:.55rem}
  .hero-cta .btn{padding:.85rem 1.2rem;font-size:.9rem}
  .hero-visual{aspect-ratio:4/3;border-radius:var(--r-md)}
  .hero-visual.hero-visual-logo{aspect-ratio:16/9}
  .hero-visual.hero-visual-antenna{aspect-ratio:4/3}
  .hero-meta{
    grid-template-columns:1fr 1fr;
    gap:.85rem 1rem
  }
  .hero-meta .stat:last-child{grid-column:span 2}
  .hero-meta .stat-num{font-size:var(--step-2)}

  /* Gallery */
  .image-grid{
    grid-template-columns:1fr;
    grid-auto-rows:220px;
    gap:.55rem
  }
  .image-card.stat-card{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    gap:1.25rem;
    padding:1.25rem 1.5rem
  }
  .image-card.stat-card .top{margin-bottom:0;flex-shrink:0}
  .image-card.stat-card .num{font-size:clamp(2rem,7vw,2.8rem)}
  .image-card.stat-card .lbl{max-width:16ch}

  /* Process */
  .process{grid-template-columns:1fr;gap:1.25rem}

  /* About */
  .values{grid-template-columns:1fr;gap:.85rem}

  /* Service detail */
  .svc-detail-points li{grid-template-columns:auto 1fr;gap:.85rem}

  /* CTA strip */
  .cta-strip{padding:1.85rem;border-radius:var(--r-md)}
  .cta-strip h3{font-size:var(--step-2)}
  .cta-strip p{font-size:.9rem}
  .cta-strip .actions{gap:.55rem}
  .cta-strip .btn{padding:.8rem 1.1rem;font-size:.88rem}

  /* Contact */
  .contact-actions{gap:.55rem}
  .contact-actions .btn{width:100%;justify-content:center}
  .map-card-live{aspect-ratio:3/2}

  /* Footer */
  .footer-grid{grid-template-columns:1fr;gap:1.75rem}
  .footer-brand{grid-column:span 1}
  .site-footer{padding:2rem 0 1.25rem}

  /* Sections */
  .section{padding:2.5rem 0}
  .section-head{margin-bottom:1.75rem}
}

/* -- 390px: small phone (SE, older Android) ----------------- */
@media(max-width:390px){
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta .btn{justify-content:center}
  .hero-meta{grid-template-columns:1fr;gap:.75rem}
  .hero-meta .stat:last-child{grid-column:auto}
  .cta-strip .actions{flex-direction:column}
  .cta-strip .actions .btn{width:100%;justify-content:center}
  .nav-mobile-foot{flex-direction:column;align-items:stretch}
  .nav-mobile-foot .btn{width:100%;justify-content:center}
}

/* ============================================================
   MOBILE CONSISTENCY POLISH — pulls the new pieces in line
   with the rest of the site on small screens
   ============================================================ */
@media(max-width:960px){
  /* Marquee — slower & lighter on mobile */
  .marquee-strip{padding:.95rem 0;margin-top:clamp(2rem,5vw,3.5rem)}
  .marquee-track{animation-duration:80s;gap:2.5rem}
  .marquee-track span{font-size:.7rem;gap:2.5rem}
  .marquee-strip::before,.marquee-strip::after{width:60px}

  /* Section heads — consistent rhythm */
  .section-head .eyebrow{font-size:.68rem}

  /* Page hero (subpages) */
  .page-hero{padding:2.5rem 0 2rem}
  .page-hero h1{font-size:var(--step-4);max-width:none}
  .page-hero .lead,.page-hero p{font-size:var(--step-0);margin-top:.85rem}

  /* Hero meta — keep clean rhythm */
  .hero-meta{border-top:1px solid var(--line);padding-top:1.25rem}

  /* Tap feedback for cards (no hover on touch) */
  .service-card:active,.value:active,.image-card:active,.cap-chips li:active{
    transform:translateY(0);background:var(--paper-2)
  }
}

@media(max-width:640px){
  /* Marquee — even tighter */
  .marquee-strip{padding:.85rem 0}
  .marquee-track{animation-duration:90s;gap:2rem}
  .marquee-track span{font-size:.66rem;letter-spacing:.16em;gap:2rem}

  /* Page hero */
  .page-hero{padding:2rem 0 1.75rem}
  .page-hero h1{font-size:var(--step-3);letter-spacing:-.03em}
  .crumbs{font-size:.66rem}

  /* Services — tighter padding */
  .service-card{padding:1.4rem 1.35rem;gap:.7rem}
  .service-card h3{font-size:var(--step-1);max-width:none}
  .service-card p{font-size:.92rem;max-width:none}
  .service-card ul{padding-top:.85rem;gap:.35rem .85rem}
  .service-card li{font-size:.66rem}

  /* Process steps */
  .process-step{padding-top:1.1rem;gap:.45rem}
  .process-step::before{width:30px;height:4px;top:-2px}
  .process-step h4{font-size:var(--step-0);font-weight:500}

  /* Gallery — keep stat-card breathing */
  .image-card.stat-card{padding:1.1rem 1.3rem;gap:.8rem}
  .image-card.stat-card .top{font-size:.62rem;letter-spacing:.16em}
  .image-card.stat-card .lbl{font-size:.62rem;letter-spacing:.14em}

  /* CTA strip mobile */
  .cta-strip{padding:1.6rem 1.5rem;gap:1.25rem}
  .cta-strip h3{font-size:var(--step-2);max-width:none}
  .cta-strip p{font-size:.88rem;margin-top:.6rem}

  /* Footer — typographic consistency */
  .footer-grid h5{font-size:.68rem;letter-spacing:.18em}
  .footer-grid a,.footer-grid li{font-size:.88rem}
  .footer-base{font-size:.66rem;flex-direction:column;align-items:flex-start;gap:.4rem}
  .footer-brand p{font-size:.88rem}

  /* About grid — tighter */
  .about-grid{gap:1.75rem}
  .about-figure{aspect-ratio:5/4}
  .about-points li{padding:.95rem 0;gap:.85rem}
  .values{gap:.85rem}
  .value{padding:1.4rem 1.35rem}
  .value h4{font-size:var(--step-0)}

  /* Service detail */
  .svc-detail{padding:2rem 0;gap:1.75rem}
  .svc-figure{aspect-ratio:5/4;border-radius:var(--r-md)}
  .svc-detail h2{font-size:var(--step-3);max-width:none}
  .svc-detail-points li{padding:.95rem 0;gap:.85rem}
  .svc-detail-points strong{font-size:var(--step-0)}

  /* Contact list */
  .contact-list li{padding:.95rem 0}
  .contact-list .label{font-size:.66rem}
  .contact-actions{margin-top:1.25rem}

  /* Reveal — tighter timing on mobile so feels snappier */
  .reveal{transition-duration:.6s;transform:translate3d(0,12px,0)}
}

/* New sections — responsive */
@media(max-width:960px){
  /* Capability band */
  .capability-band{padding:2.25rem 0}
  .cap-grid{grid-template-columns:1fr;gap:1.5rem}
  .cap-head h3{max-width:none;font-size:var(--step-2);margin-top:.55rem}
  .cap-chips{gap:.5rem}

  /* Coverage section */
  .coverage-grid{grid-template-columns:1fr;gap:2rem}
  .coverage-map{aspect-ratio:5/4;max-width:100%}
  .cov-svg text{font-size:11px;font-weight:600}
  .cov-corner{font-size:.58rem;padding:.28rem .5rem}
  .cov-corner-tl{top:.85rem;left:.85rem}
  .cov-corner-br{bottom:.85rem;right:.85rem}

  /* Quote */
  .section-quote{padding:clamp(3rem,7vw,4.5rem) 0}
  .quote-block blockquote{font-size:clamp(1.3rem,3.5vw,1.9rem);line-height:1.3}

  /* Hero antenna — keep aspect ratio close to SVG to avoid heavy cropping */
  .hero-visual.hero-visual-antenna{aspect-ratio:1/1}
  .hero-tag{font-size:.62rem;padding:.36rem .58rem;top:.85rem;left:.85rem}
  .hero-coords{font-size:.58rem;top:.85rem;right:.85rem;padding:.28rem .5rem}
  .hero-live{bottom:3.2rem;font-size:.58rem;padding:.28rem .55rem;left:.85rem}
  .hero-info{font-size:.58rem;padding:.5rem .7rem;left:.85rem;right:.85rem;bottom:.85rem}
  .hero-corner{font-size:.6rem;bottom:.85rem;right:.85rem}

  /* Brand mark */
  .brand-mark{aspect-ratio:4/3;border-radius:var(--r-lg)}
  .bm-logo{max-width:55%;max-height:48%}
}

@media(max-width:640px){
  /* Capability band — give it more presence */
  .capability-band{padding:2rem 0}
  .cap-head .eyebrow{font-size:.66rem}
  .cap-head h3{font-size:var(--step-1);line-height:1.35;margin-top:.65rem}
  .cap-chips{gap:.4rem}
  .cap-chips li{padding:.46rem .7rem;font-size:.66rem;letter-spacing:.1em}

  /* Coverage map — readable at small size */
  .coverage-map{aspect-ratio:4/3}
  .cov-svg text{font-size:13px;font-weight:600}
  .cov-svg .cov-site circle:first-of-type{r:5}
  .cov-svg .cov-site:not(.cov-s1):not(.cov-s2):not(.cov-s3):not(.cov-s4):not(.cov-s5) circle:first-of-type{r:4}
  .cov-corner{font-size:.56rem;padding:.26rem .48rem}

  .cov-stats li{padding:.95rem 0;gap:.85rem;grid-template-columns:auto 1fr}
  .cov-stats .k{font-size:var(--step-2)}
  .cov-stats .v{font-size:.66rem;letter-spacing:.12em}

  /* Quote */
  .section-quote{padding:2.75rem 0}
  .quote-block blockquote{font-size:1.18rem;line-height:1.35;text-wrap:pretty}
  .quote-mark{width:34px;margin-bottom:1rem}
  .q-name{font-size:.92rem}
  .q-role{font-size:.62rem;letter-spacing:.14em}

  /* Hero antenna — phone */
  .hero-visual.hero-visual-antenna{aspect-ratio:1/1;border-radius:var(--r-lg)}
  .hero-tag{font-size:.6rem;padding:.32rem .55rem;top:.75rem;left:.75rem;letter-spacing:.16em}
  .hero-coords{display:none}
  .hero-live{bottom:3rem;font-size:.56rem;padding:.24rem .5rem;left:.75rem}
  .hero-live-dot{width:6px;height:6px}
  .hero-info{font-size:.56rem;padding:.45rem .65rem;left:.75rem;right:.75rem;bottom:.75rem;letter-spacing:.16em}
  .hero-corner{font-size:.58rem;bottom:.75rem;right:.75rem}

  /* Brand mark */
  .brand-mark{aspect-ratio:5/4;border-radius:var(--r-md)}
  .bm-logo{max-width:60%;max-height:46%}
  .bm-tag-tl,.bm-tag-tr{font-size:.56rem;padding:.3rem .5rem;top:.75rem;letter-spacing:.18em}
  .bm-tag-tl{left:.75rem}
  .bm-tag-tr{right:.75rem}
  .bm-meta{padding:.42rem .75rem;gap:.6rem;bottom:.85rem;max-width:calc(100% - 1.5rem)}
  .bm-name{font-size:.78rem}
  .bm-sub{font-size:.56rem;letter-spacing:.14em}
  .bm-line{height:10px}
  .section-mark{padding:.5rem 0 2rem}
}

@media(max-width:480px){
  /* Brand mark — at very small sizes, drop the corner tags so the logo breathes */
  .bm-tag-tr{display:none}
  .bm-tag-tl{font-size:.52rem;padding:.26rem .45rem}
}

@media(max-width:390px){
  .hero-info{flex-direction:column;align-items:flex-start;gap:.2rem;letter-spacing:.14em}
  .cap-head h3{font-size:var(--step-0)}

  /* Brand mark — simplify further */
  .brand-mark{aspect-ratio:1/1}
  .bm-logo{max-width:65%;max-height:42%}
  .bm-meta{flex-wrap:wrap;justify-content:center;text-align:center;gap:.35rem .65rem;padding:.4rem .7rem}
  .bm-line{display:none}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
  .map-card::before{animation:none}
  .ha-ring,.ha-tip,.ha-beam,.ha-point-pulse,.ha-tower,.cov-pulse,.hero-live-dot{animation:none}
}