/* Stadtler Technologies — design tokens from the approved handoff spec. */
:root{
  --bg:#060c1a; --surface:#0f1b33; --surface-alt:#0b1428;
  --border:#1c2a45; --border-subtle:#16223a; --border-strong:#2a3b5c;
  --chip-bg:#14264a; --chip-border:#1e3a6b; --chip-text:#8fbcff;
  --accent:#3d8bfd; --accent-hover:#6ea6ff; --accent-deep:#1663c7;
  --text:#eef3fb; --text-2:#c9d6ea; --text-3:#a9b8d1;
  --text-muted:#8a9bb8; --text-faint:#6b7a94; --disabled-text:#3a4a66;
  --success:#1fa971; --success-bg:#12392a; --success-text:#4ade80;
  --inverse-hover:#dbe7fb;
  --wrap:1200px; --gutter:24px;
  --shadow-img:0 40px 80px -30px rgba(0,0,0,.8);
  --shadow-float:0 10px 30px rgba(0,0,0,.4);
  --shadow-menu:0 20px 50px rgba(0,0,0,.5);
}
*,*::before,*::after{box-sizing:border-box}
/* Class-level display:flex would otherwise beat the [hidden] attribute. */
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Manrope',system-ui,-apple-system,sans-serif;
  line-height:1.5;text-wrap:pretty;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover)}
/* Keep width/height attrs for CLS, but let aspect-ratio drive the box. */
img{max-width:100%}
input,textarea,select,button{font-family:inherit}
input::placeholder,textarea::placeholder{color:var(--text-faint)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;padding:12px 18px;border-radius:0 0 8px 0;font-weight:700;z-index:100}
.skip:focus{left:0;color:#fff}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- animation ---------- */
@keyframes floatA{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes floatB{0%,100%{transform:translate(0,0)}50%{transform:translateY(18px) translateX(10px)}}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(40px,-30px) scale(1.08)}66%{transform:translate(-30px,25px) scale(.95)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(31,169,113,.6)}70%{box-shadow:0 0 0 10px rgba(31,169,113,0)}}
.floatA{animation:floatA 7s ease-in-out infinite}
.floatB{animation:floatB 6s ease-in-out infinite}
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal].tile{transition:opacity .6s ease,transform .6s ease}
@media print{[data-reveal]{opacity:1!important;transform:none!important}.orbs,.site-header,.topbar{display:none}}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important}
  html{scroll-behavior:auto}
  [data-reveal]{opacity:1;transform:none;transition:none}
}

/* ---------- ambient orbs ---------- */
.orbs{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.orb{position:absolute;border-radius:50%}
.orb-a{top:-120px;left:-80px;width:520px;height:520px;
  background:radial-gradient(circle,rgba(61,139,253,.22),rgba(61,139,253,0) 70%);
  animation:drift 22s ease-in-out infinite}
.orb-b{top:40%;right:-160px;width:600px;height:600px;
  background:radial-gradient(circle,rgba(22,99,199,.18),rgba(22,99,199,0) 70%);
  animation:drift 28s ease-in-out infinite reverse}
.page{position:relative;z-index:1}

/* ---------- top bar ---------- */
.topbar{background:rgba(3,8,18,.5);border-bottom:1px solid var(--border-subtle);
  color:var(--text-3);font-size:13px;padding:8px var(--gutter);
  display:flex;justify-content:center;gap:24px;flex-wrap:wrap}
.topbar a{color:#fff;font-weight:600}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:20;background:rgba(6,12,26,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border-subtle)}
.header-inner{max-width:var(--wrap);margin:0 auto;padding:12px var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;background:#fff;border-radius:10px;padding:4px 10px;flex-shrink:0}
.logo img{height:48px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:26px;font-size:15px;font-weight:600;flex-wrap:wrap;justify-content:flex-end}
.nav > a,.nav-toggle{color:var(--text-2)}
.nav > a:hover,.nav-toggle:hover{color:#fff}
.nav > a[aria-current="page"]{color:#fff}
.nav-toggle{background:none;border:0;font-size:15px;font-weight:600;cursor:pointer;padding:0;
  display:flex;align-items:center;gap:6px}
.nav-toggle .caret{font-size:10px;transition:transform .2s}
.nav-toggle[aria-expanded="true"] .caret{transform:rotate(180deg)}
.has-menu{position:relative}
.menu{position:absolute;top:32px;left:-12px;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;padding:8px;display:flex;flex-direction:column;min-width:300px;
  box-shadow:var(--shadow-menu);z-index:30}
.menu[hidden]{display:none}
.menu a{color:var(--text-2);padding:10px 12px;border-radius:8px;font-size:14px}
.menu a:hover{background:#16243f;color:#fff}
.nav-cta{background:var(--accent);color:#fff!important;padding:11px 20px;border-radius:8px;font-weight:700;
  box-shadow:0 8px 24px -8px rgba(61,139,253,.7)}
.nav-cta:hover{background:var(--accent-hover)}
.hamburger{display:none;background:none;border:1px solid var(--border-strong);border-radius:8px;
  color:#fff;width:42px;height:42px;cursor:pointer;font-size:18px;line-height:1}
@media (max-width:900px){
  .hamburger{display:block}
  .nav{position:absolute;top:100%;left:0;right:0;background:rgba(6,12,26,.98);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--border-subtle);flex-direction:column;align-items:stretch;
    justify-content:flex-start;gap:4px;padding:12px var(--gutter) 20px;font-size:16px}
  .nav[hidden]{display:none}
  .nav > a,.nav-toggle{padding:12px 0}
  .has-menu{position:static}
  .menu{position:static;box-shadow:none;border:0;background:transparent;padding:0 0 0 12px;min-width:0}
  .nav-cta{text-align:center;margin-top:8px}
  .header-inner{position:relative}
}

/* ---------- type ---------- */
.eyebrow{color:var(--accent);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.eyebrow-muted{color:var(--text-muted)}
h1,h2,h3{margin:0;color:#fff}
.h1{font-size:clamp(36px,4.6vw,60px);line-height:1.06;font-weight:800;letter-spacing:-.02em}
.h1-sm{font-size:clamp(34px,4.2vw,54px);line-height:1.08;font-weight:800;letter-spacing:-.02em}
.h1-mid{font-size:clamp(36px,4.4vw,56px);line-height:1.08;font-weight:800;letter-spacing:-.02em}
.h2{font-size:clamp(28px,3vw,38px);font-weight:800;letter-spacing:-.015em}
.h2-sm{font-size:clamp(26px,2.8vw,36px);font-weight:800;letter-spacing:-.015em}
.h2-lg{font-size:clamp(30px,3.4vw,46px);font-weight:800;letter-spacing:-.015em}
.h2-band{font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.015em}
.h2-group{font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-.015em}
.lead{margin:0;font-size:19px;color:var(--text-3);max-width:52ch}
.lead-18{margin:0;font-size:18px;color:var(--text-3)}
.body-17{margin:0;font-size:17px;color:var(--text-3)}
.body-16{margin:0;font-size:16px;color:var(--text-3)}
.body-15{margin:0;font-size:15px;color:var(--text-3)}
.meta{font-size:13.5px;color:var(--text-muted);font-weight:600}

/* ---------- buttons / chips ---------- */
.btn{display:inline-block;padding:14px 24px;border-radius:8px;font-weight:700;font-size:16px;
  border:1px solid transparent;cursor:pointer;text-align:center;transition:background .2s,border-color .2s,color .2s}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover);color:#fff}
.btn-primary.glow{box-shadow:0 12px 30px -10px rgba(61,139,253,.8)}
.btn-sm{padding:13px 22px}
.btn-outline{background:transparent;color:#fff;border-color:var(--border-strong)}
.btn-outline:hover{border-color:var(--accent);color:var(--chip-text)}
.btn-inverse{background:#fff;color:var(--bg)}
.btn-inverse:hover{background:var(--inverse-hover);color:var(--bg)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.self-start{align-self:flex-start}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--chip-bg);color:var(--chip-text);
  border:1px solid var(--chip-border);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700}
.chip-eyebrow{letter-spacing:.04em;text-transform:uppercase}
a.chip:hover{border-color:var(--accent);color:var(--chip-text)}
.chip-row{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- layout helpers ---------- */
.stack{display:flex;flex-direction:column}
.gap-6{gap:6px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-14{gap:14px}.gap-16{gap:16px}
.gap-18{gap:18px}.gap-20{gap:20px}.gap-22{gap:22px}.gap-28{gap:28px}.gap-32{gap:32px}
.gap-36{gap:36px}.gap-40{gap:40px}.gap-48{gap:48px}.gap-56{gap:56px}
.grid{display:grid}
.grid > *{min-width:0}
.panel{min-width:0}
.cols-300{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.cols-280{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.cols-260{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.cols-240{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.cols-180{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.fill-200{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.center-items{align-items:center}
.start-items{align-items:start}
.end-items{align-items:end}
.max-640{max-width:640px}.max-680{max-width:680px}.max-700{max-width:700px}
.max-54{max-width:54ch}.max-56{max-width:56ch}.max-18{max-width:18ch}.max-16{max-width:16ch}
section{position:relative}
.sec-64{padding:64px var(--gutter)}
.sec-80{padding:80px var(--gutter)}
.sec-hero{padding:80px var(--gutter) 72px}
.sec-page-head{padding:88px var(--gutter) 64px}
.sec-tail-80{padding:0 var(--gutter) 80px}
.sec-tail-88{padding:0 var(--gutter) 88px}
.sec-tail-96{padding:0 var(--gutter) 96px}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;
  transition:border-color .3s,background .3s}
.card:hover{border-color:var(--accent)}
.card-pad{padding:28px 24px}
.card-r16{border-radius:16px}.card-r18{border-radius:18px}.card-r20{border-radius:20px}
.numbox{width:44px;height:44px;border-radius:10px;background:var(--chip-bg);color:var(--chip-text);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px}
.panel{background:linear-gradient(135deg,var(--surface),var(--surface-alt));border:1px solid var(--border);
  border-radius:20px;padding:48px 40px}
@media (max-width:600px){.panel{padding:32px 22px}}

/* ---------- hero ---------- */
.hero-media{position:relative;min-height:340px}
.hero-media img{width:100%;height:100%;min-height:340px;object-fit:cover;border-radius:18px;
  display:block;border:1px solid var(--border);box-shadow:var(--shadow-img)}
.float-card{position:absolute;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;box-shadow:var(--shadow-float)}
.float-status{left:20px;bottom:20px;padding:14px 18px;display:flex;align-items:center;gap:12px;
  animation:floatB 6s ease-in-out infinite}
.dot{width:10px;height:10px;border-radius:50%;background:var(--success);display:block;
  animation:pulse 2.4s ease-out infinite}
.float-status span:last-child{font-size:14px;font-weight:700;color:#fff}
.float-stat{right:-14px;top:24px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;
  animation:floatB 8s ease-in-out infinite reverse}
.float-stat .k{font-size:11px;color:var(--text-muted);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.float-stat .v{font-size:22px;font-weight:800;color:#fff;line-height:1}
.trust{display:flex;gap:28px;flex-wrap:wrap;font-size:14px;color:var(--text-muted);font-weight:600}

/* ---------- image bands ---------- */
.band{position:relative;overflow:hidden;border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}
.band > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35;display:block}
.band::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(6,12,26,.97) 0%,rgba(6,12,26,.75) 60%,rgba(6,12,26,.4) 100%)}
.band-inner{position:relative;z-index:1;max-width:var(--wrap);margin:0 auto;padding:88px var(--gutter);
  display:flex;flex-direction:column;gap:18px}
.band-round{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--border);
  max-width:var(--wrap);margin:0 auto}
.band-round > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3;display:block}
.band-round::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(6,12,26,.97),rgba(6,12,26,.6))}
.band-round-inner{position:relative;z-index:1;padding:64px 48px;display:flex;flex-direction:column;gap:16px;max-width:680px}
@media (max-width:600px){.band-round-inner{padding:40px 24px}}

/* ---------- pillars ---------- */
.pillar{display:flex;flex-direction:column;gap:16px;color:#fff;padding:8px 0}
.pillar:hover{color:#fff}
.pillar img{width:64px;height:64px;border-radius:14px;object-fit:cover;display:block;border:1px solid var(--border)}
.pillar h3{font-size:22px;font-weight:700;line-height:1.25}
.pillar p{margin:0;font-size:15.5px;color:var(--text-3)}
.pillar .more{color:var(--accent);font-weight:700;font-size:14px}

/* ---------- stats ---------- */
.stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:520px){.stat-grid{grid-template-columns:1fr}}
.stat{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:22px 18px;
  display:flex;flex-direction:column;gap:6px}
.stat .v{font-size:clamp(26px,3vw,38px);font-weight:800;color:var(--accent);letter-spacing:-.02em;line-height:1}
.stat .l{font-size:13.5px;color:var(--text-3);font-weight:600}

/* ---------- about teaser ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.duo img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:14px;display:block;border:1px solid var(--border)}
.duo img:first-child{animation:floatA 9s ease-in-out infinite}
.duo img:last-child{margin-top:36px;animation:floatA 9s ease-in-out infinite 1.5s}
.portrait{position:relative;animation:floatA 8s ease-in-out infinite}
.portrait img{width:100%;height:auto;max-width:420px;margin:0 auto;aspect-ratio:2/3;object-fit:cover;
  border-radius:18px;display:block;border:1px solid var(--border);box-shadow:var(--shadow-img)}
.portrait .float-card{left:0;bottom:28px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;
  animation:floatB 7s ease-in-out infinite}
.portrait .n{font-size:15px;font-weight:800;color:#fff}
.portrait .r{font-size:12.5px;color:var(--text-muted);font-weight:600}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:var(--text-3)}
.field input,.field textarea{background:var(--bg);border:1px solid var(--border);border-radius:8px;
  padding:12px 14px;font-size:15px;color:#fff;outline:none;width:100%}
.field textarea{resize:vertical}
.field input:focus,.field textarea:focus{border-color:var(--accent)}
.form-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:32px;
  display:flex;flex-direction:column;gap:16px}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.form-card button[type=submit]{background:var(--accent);color:#fff;border:0;padding:14px 22px;
  border-radius:8px;font-weight:700;font-size:16px;cursor:pointer}
.form-card button[type=submit]:hover{background:var(--accent-hover)}
@media (max-width:600px){.form-card{padding:24px 20px}}

/* ---------- contact ---------- */
.contact{padding:88px var(--gutter);background:var(--surface-alt);border-top:1px solid var(--border-subtle)}
.contact-grid{max-width:var(--wrap);margin:0 auto;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:start}
.contact-lines{display:flex;flex-direction:column;gap:8px;margin-top:12px;font-size:16px;color:var(--text-3)}
.contact-lines a{color:#fff;font-weight:700}
.thanks{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:40px 32px;
  display:flex;flex-direction:column;gap:10px}
.thanks h3{font-size:24px;font-weight:800}
.thanks p{margin:0;color:var(--text-3)}

/* ---------- footer ---------- */
.site-footer{background:rgba(3,8,18,.5);border-top:1px solid var(--border-subtle);color:var(--text-muted);
  padding:48px var(--gutter) 32px;font-size:14px}
.footer-grid{max-width:var(--wrap);margin:0 auto;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:36px}
.footer-grid a{color:var(--text-muted)}
.footer-grid a:hover{color:#fff}
.footer-col{display:flex;flex-direction:column;gap:10px}
.footer-col .head{color:#fff;font-weight:700}
.footer-logo{height:64px;width:auto;display:block;background:#fff;border-radius:8px;padding:6px 10px;align-self:flex-start}
.footer-bottom{max-width:var(--wrap);margin:32px auto 0;padding-top:20px;border-top:1px solid var(--border-subtle);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.footer-bottom a{color:#fff;font-weight:600}

/* ---------- blog ---------- */
.cat-row{display:flex;gap:10px;flex-wrap:wrap}
.cat{background:var(--surface);color:#fff;border:1px solid var(--border);padding:9px 16px;
  border-radius:999px;font-size:14px;font-weight:700;cursor:pointer;transition:border-color .2s,background .2s}
.cat:hover{border-color:var(--accent)}
.cat[aria-pressed="true"]{background:var(--accent);border-color:var(--accent)}
.featured{max-width:var(--wrap);margin:0 auto;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));background:var(--surface);
  border:1px solid var(--border);border-radius:20px;overflow:hidden;color:#fff;transition:border-color .3s}
.featured:hover{border-color:var(--accent);color:#fff}
.featured .media{position:relative;min-height:300px;background:linear-gradient(135deg,var(--chip-bg),var(--surface-alt))}
.featured .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.featured .body{padding:40px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.featured h2{font-size:clamp(24px,2.6vw,34px);font-weight:800;letter-spacing:-.015em;line-height:1.2}
.featured p{margin:0;font-size:16px;color:var(--text-3)}
.featured .eyebrow{font-size:12.5px}
@media (max-width:600px){.featured .body{padding:26px 22px}}
.post-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);
  border-radius:16px;overflow:hidden;color:#fff;transition:border-color .3s}
.post-card:hover{border-color:var(--accent);color:#fff}
.post-card .media{aspect-ratio:16/9;background:linear-gradient(135deg,var(--chip-bg),var(--surface-alt));
  position:relative;overflow:hidden}
.post-card .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.post-card .tag{position:absolute;left:14px;top:14px;background:rgba(6,12,26,.8);color:var(--chip-text);
  font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;
  border-radius:999px;border:1px solid var(--chip-border)}
.post-card .body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.post-card h3{font-size:18px;font-weight:700;line-height:1.3}
.post-card p{margin:0;font-size:14.5px;color:var(--text-3);flex:1}
.post-card .meta{font-size:13px}
.empty{color:var(--text-muted);font-size:16px;padding:40px 0}

/* ---------- areas ---------- */
.group-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-bottom:1px solid var(--border);padding-bottom:14px}
.group-head .count{font-size:14px;color:var(--text-muted);font-weight:600}
.tile{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface);
  border:1px solid var(--border);border-radius:12px;padding:16px 18px;color:#fff;font-weight:700;
  font-size:15px;transition:border-color .3s,background .3s}
.tile:hover{border-color:var(--accent);background:var(--chip-bg);color:#fff}
.tile .arrow{color:var(--accent)}
.search-field{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:700;color:var(--text-3)}
.search-field input{background:var(--surface);border:1px solid var(--border);border-radius:10px;
  padding:14px 16px;font-size:16px;color:#fff;outline:none}
.search-field input:focus{border-color:var(--accent)}

/* ---------- landing ---------- */
.back-link{color:var(--text-muted);font-size:14px;font-weight:600}
.back-link:hover{color:#fff}
.city-media{position:relative;animation:floatA 8s ease-in-out infinite;margin-bottom:48px}
.city-media > img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:18px;display:block;
  border:1px solid var(--border);box-shadow:var(--shadow-img)}
.quote-card{position:absolute;left:-10px;right:-10px;bottom:-24px;background:var(--surface);
  border:1px solid var(--border);border-radius:14px;padding:18px 22px;display:flex;flex-direction:column;
  gap:6px;box-shadow:0 20px 40px rgba(0,0,0,.5);animation:floatB 7s ease-in-out infinite;margin:0}
.quote-card p{margin:0;font-size:15px;color:var(--text-2);font-style:italic}
.quote-card cite{font-size:13px;font-weight:700;color:var(--accent);font-style:normal}
@media (max-width:520px){.quote-card{left:0;right:0}}
.check-row{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;padding:14px 18px}
.check{width:22px;height:22px;border-radius:50%;background:var(--chip-bg);color:var(--chip-text);
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex-shrink:0;margin-top:1px}
.check-row span:last-child{font-size:15px;color:#e1e8f5}
.step .n{font-size:32px;font-weight:800;color:var(--accent);line-height:1;letter-spacing:-.02em}
.step h3{font-size:17px;font-weight:700}
.step p{margin:0;font-size:14px;color:var(--text-3)}
.row-link{display:flex;justify-content:space-between;gap:16px;align-items:center;background:var(--surface);
  border:1px solid var(--border);border-radius:12px;padding:16px 18px;color:#fff;font-weight:700;
  font-size:15px;transition:border-color .3s}
.row-link:hover{border-color:var(--accent);color:#fff}
.row-link .arrow{color:var(--accent)}

/* ---------- booking ---------- */
.book-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;align-items:start}
.book-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:28px;
  display:flex;flex-direction:column;gap:18px}
.book-card.form{gap:14px}
@media (max-width:600px){.book-card{padding:22px 20px}}
.book-card h2{font-size:24px;font-weight:800;letter-spacing:-.01em}
.label-k{font-size:12.5px;font-weight:700;color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase}
.divide-top{border-top:1px solid var(--border);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.selection{font-size:17px;font-weight:700;color:#fff}
.cal-head{display:flex;justify-content:space-between;align-items:center}
.cal-nav{background:var(--chip-bg);border:1px solid var(--chip-border);color:#fff;width:36px;height:36px;
  border-radius:8px;cursor:pointer;font-size:16px;line-height:1}
.cal-nav:hover{border-color:var(--accent)}
.cal-month{font-size:17px;font-weight:800;color:#fff}
.dow{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center;font-size:12px;
  font-weight:700;color:var(--text-muted)}
.days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.day{aspect-ratio:1;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:#fff;
  font-size:14px;font-weight:700;cursor:pointer;padding:0}
.day:hover:not(:disabled){border-color:var(--accent)}
.day:disabled{background:transparent;border-color:transparent;color:var(--disabled-text);cursor:default}
.day.blank{background:transparent;border-color:transparent;color:transparent;cursor:default}
.day[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.times{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.time{padding:10px 8px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:#fff;
  font-size:13.5px;font-weight:700;cursor:pointer}
.time:hover{border-color:var(--accent)}
.time[aria-pressed="true"]{background:var(--accent);border-color:var(--accent)}
.book-submit{background:var(--border-strong);color:#fff;border:0;padding:14px 22px;border-radius:8px;
  font-weight:700;font-size:16px;cursor:not-allowed;margin-top:4px}
.book-submit:enabled{background:var(--accent);cursor:pointer}
.book-submit:enabled:hover{background:var(--accent-hover)}
.helper{font-size:12.5px;color:var(--text-faint)}
.confirm{max-width:640px;background:var(--surface);border:1px solid var(--border);border-radius:20px;
  padding:48px 40px;display:flex;flex-direction:column;gap:14px}
.confirm .tick{width:48px;height:48px;border-radius:50%;background:var(--success-bg);color:var(--success-text);
  display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800}
.confirm h2{font-size:30px;font-weight:800;letter-spacing:-.015em}
.confirm p{margin:0}
.confirm .p1{font-size:17px;color:var(--text-3)}
.confirm .p2{font-size:15px;color:var(--text-muted)}
.confirm button{align-self:flex-start;background:transparent;border:1px solid var(--border-strong);color:#fff;
  padding:12px 20px;border-radius:8px;font-weight:700;cursor:pointer;margin-top:8px}
.confirm button:hover{border-color:var(--accent)}
@media (max-width:600px){.confirm{padding:32px 24px}}

/* ============ Business IT Support (sales funnel) ============ */
.sec-biz-hero{padding:72px var(--gutter) 64px}
.biz-hero{max-width:880px;margin:0 auto;align-items:center;text-align:center}
.eyebrow-wide{font-size:12.5px;letter-spacing:.08em}
.h1-biz{font-size:clamp(34px,4.4vw,56px);line-height:1.08;font-weight:800;letter-spacing:-.02em;max-width:20ch}
.h2-biz{font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.015em}
.biz-hero-copy{align-items:center;max-width:640px;margin-top:10px}
.biz-bold{margin:0;font-size:19px;font-weight:700;color:#fff}
.biz-body{margin:0;font-size:16.5px;color:var(--text-3)}
.btn-hero{padding:15px 28px;margin-top:4px}
.biz-reassure{font-size:13.5px;color:var(--text-muted);font-weight:600}
.biz-phone{font-size:14px;color:var(--text-3)}
.biz-phone a{color:#fff;font-weight:700}
.biz-cred{margin-top:8px;font-size:12.5px;color:var(--text-muted);font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;border-top:1px solid var(--border);padding-top:14px}
.biz-strong{margin:0;font-size:17px;color:#fff;font-weight:600}
.biz-disclaimer{margin:0;font-size:14px;color:var(--text-muted);max-width:70ch}
.biz-footnote{margin:0;font-size:14px;color:var(--text-muted);border-top:1px solid var(--border);padding-top:18px}
.biz-subblock{border-top:1px solid var(--border);padding-top:18px;display:flex;flex-direction:column;gap:8px;margin-top:6px}

/* video */
.vid{width:100%;max-width:800px;margin-top:8px}
.vid-poster{position:relative;display:block;width:100%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;
  border:1px solid var(--border);background:var(--surface);padding:0;text-align:left;
  box-shadow:var(--shadow-img);transition:border-color .3s}
button.vid-poster{cursor:pointer}
button.vid-poster:hover{border-color:var(--accent)}
.vid-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;
  display:block;opacity:.55}
.vid-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,12,26,.1) 0%,rgba(6,12,26,.85) 100%)}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-56%);width:84px;height:84px;
  border-radius:50%;background:var(--accent);box-shadow:0 20px 40px -10px rgba(61,139,253,.8);
  display:flex;align-items:center;justify-content:center}
.vid-play::after{content:"";width:0;height:0;border-style:solid;border-width:15px 0 15px 26px;
  border-color:transparent transparent transparent #fff;margin-left:6px}
.vid-caption{position:absolute;left:28px;right:28px;bottom:24px;display:flex;flex-direction:column;gap:4px;text-align:left}
.vid-title{font-size:clamp(18px,2.2vw,24px);font-weight:800;color:#fff;letter-spacing:-.01em}
.vid-sub{font-size:14.5px;color:var(--text-2);font-weight:600}
.vid-player{width:100%;aspect-ratio:16/9;border-radius:18px;border:1px solid var(--border);
  background:#000;display:block;box-shadow:var(--shadow-img)}
@media (max-width:600px){.vid-caption{left:18px;right:18px;bottom:16px}.vid-play{width:64px;height:64px}}

/* illustrative plan card */
.plan-card{background:linear-gradient(135deg,var(--surface),var(--surface-alt));padding:22px}
.plan-card:hover{border-color:var(--border)}
.plan-paper{background:#eef3fb;border-radius:8px;padding:18px;display:flex;flex-direction:column;gap:9px;
  flex:1;animation:floatA 10s ease-in-out infinite}
.plan-title{font-size:11px;font-weight:800;color:var(--bg);letter-spacing:.04em}
.plan-paper .bar{border-radius:3px;background:var(--text-muted);opacity:.5;height:6px;display:block}
.plan-paper .b1{height:8px;width:60%;background:var(--surface-alt);opacity:.85;border-radius:4px}
.plan-paper .b2{width:90%}.plan-paper .b3{width:75%}.plan-paper .b4{width:85%}.plan-paper .b5{width:55%}
.plan-blocks{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:6px}
.plan-blocks span{height:34px;background:var(--inverse-hover);border-radius:4px;display:block}

/* ongoing tiles */
.tile-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:22px 20px;
  transition:border-color .3s}
.tile-card:hover{border-color:var(--accent)}

/* manufacturing placeholder */
.mfg-media{position:relative;margin-bottom:28px}
.placeholder-4x3{width:100%;aspect-ratio:4/3;border-radius:18px;border:1px dashed var(--border-strong);
  background:var(--surface-alt);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;text-align:center;padding:24px;box-shadow:var(--shadow-img)}
.ph-note{font-size:14.5px;color:var(--text-3);max-width:32ch}
.mfg-card{left:20px;bottom:-18px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;
  animation:floatB 7s ease-in-out infinite}
.mfg-card .k{font-size:11px;color:var(--text-muted);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.mfg-card .v2{font-size:14px;font-weight:700;color:#fff}

/* meet jim */
.pull-line{margin:0;font-size:18px;font-weight:700;color:#fff;border-left:2px solid var(--accent);padding-left:16px}
.reserved{margin-top:10px;border:1px dashed var(--border-strong);border-radius:12px;padding:18px 20px;
  display:flex;flex-direction:column;gap:4px;background:var(--surface-alt)}
.portrait-45{position:relative;animation:floatA 8s ease-in-out infinite}
.portrait-45 img{width:100%;height:auto;max-width:440px;margin:0 auto;aspect-ratio:4/5;object-fit:cover;
  border-radius:18px;display:block;border:1px solid var(--border);box-shadow:var(--shadow-img)}
.portrait-45 .float-card{left:0;bottom:24px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;
  animation:floatB 7s ease-in-out infinite}
.portrait-45 .n{font-size:15px;font-weight:800;color:#fff}
.portrait-45 .r{font-size:12.5px;color:var(--text-muted);font-weight:600}

/* steps + investment */
.step-n{font-size:36px;font-weight:800;color:var(--accent);line-height:1;letter-spacing:-.02em}
.h3-invest{font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-.015em}

/* FAQ */
.faq-wrap{max-width:880px;margin:0 auto;padding:0 var(--gutter)}
.faq-item{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;
  transition:border-color .3s}
.faq-item.is-open{border-color:var(--accent)}
.faq-q{width:100%;background:none;border:0;color:#fff;text-align:left;padding:18px 22px;display:flex;
  justify-content:space-between;align-items:center;gap:16px;font-size:16.5px;font-weight:700;cursor:pointer}
.faq-icon{color:var(--accent);font-size:20px;line-height:1;flex-shrink:0}
.faq-a p{margin:0;padding:0 22px 20px;font-size:15.5px;color:var(--text-3)}

/* select needs the same treatment as inputs */
.field select{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:12px 14px;
  font-size:15px;color:#fff;outline:none;width:100%}
.field select:focus{border-color:var(--accent)}

/* imported city/service copy */
.sec-imported{padding:0 var(--gutter) 40px}
.sec-imported + .sec-imported{padding-top:0}
/* A single readable column reads better than prose hugging the left of a
   1200px grid with half the row empty. */
.sec-imported .wrap{max-width:880px}
.prose{max-width:72ch}

/* Group headings on the imported service pages — a heading with no copy of its
   own introduces the sub-sections that follow it. Without this every heading on
   a 4,000-word page rendered at the same weight and the page could not be
   scanned. See renderImported() in scripts/pages.mjs. */
.sec-group{padding-top:28px}
.sec-group + .sec-imported{padding-top:0}
.sec-group h2{border-bottom:1px solid var(--border);padding-bottom:14px}
.sec-imported .h3-sm{font-size:clamp(19px,1.5vw,22px);font-weight:700;letter-spacing:-.01em}

/* Extra imported testimonials. The hero .quote-card is absolutely positioned
   against the city photo and holds exactly one quote, but several source pages
   carried two or three distinct ones, so the rest render below the copy. Same
   type treatment as .quote-card so they read as the same object; the card
   frame comes from .card. See renderQuotes() in scripts/pages.mjs. */
.quote-item{display:flex;flex-direction:column;gap:6px;padding:18px 22px;margin:0}
.quote-item p{margin:0;font-size:15px;color:var(--text-2);font-style:italic}
.quote-item cite{font-size:13px;font-weight:700;color:var(--accent);font-style:normal}