/* ===========================================================
   TecheVision — FUTURISTIC / SCI-FI dark theme
   Fonts: Lato (display) + Lusitana (serif body)
   Neon teal/mint accent over deep-space navy. Glassmorphism.
   =========================================================== */

:root{
  --navy:        #061624;   /* deep (used as dark text on neon buttons) */
  --bg:          #040b14;   /* deep space */
  --bg-2:        #07121f;
  --bg-3:        #0a1a2b;
  --panel:       rgba(125,205,200,.05);
  --panel-2:     rgba(125,205,200,.08);
  --border:      rgba(129,253,218,.16);
  --border-soft: rgba(255,255,255,.08);
  --ink:         #ecf6f7;   /* headings */
  --text:        #aebfca;   /* body */
  --muted:       #7e93a2;
  --accent:      #81fdda;   /* neon mint */
  --accent-2:    #4fc0a4;   /* teal */
  --accent-deep: #2f8f78;
  --teal-1:#37766c; --teal-2:#52a890; --teal-3:#81fdda;
  --glow:        0 0 24px rgba(129,253,218,.45);
  --glow-soft:   0 0 40px rgba(79,192,164,.22);
  --radius:6px; --radius-lg:14px;
  --shadow:      0 24px 60px rgba(0,0,0,.45);
  --maxw:1440px;
  --serif:"Lusitana", Georgia, "Times New Roman", serif;
  --sans:"Lato", Arial, Helvetica, sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0; font-family:var(--serif); color:var(--text); line-height:1.75; font-size:1.04rem;
  background:var(--bg); -webkit-font-smoothing:antialiased; overflow-x:hidden; position:relative;
}
/* deep-space backdrop: aurora glows + faint grid + starlight */
body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(900px 600px at 12% -5%, rgba(47,143,120,.18), transparent 60%),
    radial-gradient(1000px 700px at 100% 10%, rgba(79,192,164,.14), transparent 55%),
    radial-gradient(1200px 800px at 50% 120%, rgba(33,90,120,.30), transparent 60%),
    linear-gradient(180deg, #040b14 0%, #05101c 50%, #040a12 100%);
}
body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.5), transparent),
    radial-gradient(1px 1px at 70% 60%, rgba(129,253,218,.5), transparent),
    radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.35), transparent),
    radial-gradient(1px 1px at 85% 25%, rgba(255,255,255,.4), transparent),
    radial-gradient(1px 1px at 55% 15%, rgba(129,253,218,.4), transparent),
    linear-gradient(rgba(129,253,218,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(129,253,218,.025) 1px, transparent 1px);
  background-size:auto,auto,auto,auto,auto,64px 64px,64px 64px;
}

h1,h2,h3,h4{ font-family:var(--sans); color:var(--ink); line-height:1.12; margin:0 0 .5em; }
h1{ font-size:clamp(2.4rem,5.6vw,4.1rem); font-weight:300; letter-spacing:.03em; text-transform:uppercase; }
h2{ font-size:clamp(1.7rem,3.6vw,2.7rem); font-weight:300; letter-spacing:.03em; text-transform:uppercase; }
h3{ font-size:1.25rem; font-weight:700; letter-spacing:.01em; }
h4{ font-weight:700; }
p{ margin:0 0 1rem; }
a{ color:var(--accent); text-decoration:none; transition:color .2s var(--ease); }
a:hover{ color:#fff; text-shadow:var(--glow); }
img{ max-width:100%; display:block; }
strong{ color:var(--ink); }

.container{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px, 4vw, 60px); }
.container--narrow{ max-width:920px; }
.section{ padding:96px 0; position:relative; }
.section--alt{ background:linear-gradient(180deg, rgba(10,26,43,.5), rgba(7,18,31,.5)); border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft); }
.section--tight{ padding:66px 0; }
.center{ text-align:center; }
.lead{ font-size:1.2rem; color:var(--muted); max-width:740px; }
.center .lead{ margin-left:auto; margin-right:auto; }
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

.eyebrow{ display:inline-flex; align-items:center; gap:10px; font-family:var(--sans);
  text-transform:uppercase; letter-spacing:.26em; font-size:.76rem; font-weight:700; color:var(--accent);
  margin-bottom:1rem; text-shadow:0 0 16px rgba(129,253,218,.5); }
.eyebrow::before{ content:""; width:28px; height:2px; background:var(--accent); box-shadow:var(--glow); display:inline-block; }
.center .eyebrow{ justify-content:center; }
.section-head{ max-width:760px; } .center .section-head{ margin:0 auto; }
/* Left-align section intros so they line up with the content/grids below */
.section-head.center{ text-align:left; margin:0; }
.section-head.center .eyebrow{ justify-content:flex-start; }
.section-head.center .lead{ margin-left:0; margin-right:0; }

/* ---------- Buttons ---------- */
.btn{ display:inline-flex; align-items:center; gap:9px; font-family:var(--sans);
  padding:15px 32px; border-radius:var(--radius); font-weight:700; font-size:.9rem; letter-spacing:.08em;
  text-transform:uppercase; cursor:pointer; border:1px solid transparent; white-space:nowrap; position:relative;
  transition:transform .2s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .2s var(--ease); }
.btn svg{ width:17px; height:17px; }
.btn--primary{ background:linear-gradient(135deg,var(--accent-2),var(--accent)); color:#04221b;
  box-shadow:0 0 0 1px rgba(129,253,218,.4), 0 10px 30px rgba(79,192,164,.35); }
.btn--primary:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--accent), 0 0 28px rgba(129,253,218,.65), 0 16px 40px rgba(79,192,164,.45); color:#04221b; }
.btn--ghost{ background:rgba(129,253,218,.04); color:var(--accent); border-color:var(--border); }
.btn--ghost:hover{ background:rgba(129,253,218,.10); color:#fff; border-color:var(--accent); box-shadow:var(--glow); transform:translateY(-3px); }
.btn--dark{ background:rgba(255,255,255,.04); color:var(--ink); border-color:var(--border-soft); }
.btn--dark:hover{ background:rgba(129,253,218,.08); color:#fff; border-color:var(--accent); box-shadow:var(--glow); transform:translateY(-3px); }

/* ---------- Header / nav ---------- */
.site-header{ position:sticky; top:0; z-index:60; background:rgba(4,11,20,.72);
  backdrop-filter:blur(14px) saturate(150%); border-bottom:1px solid var(--border-soft); }
.nav{ display:flex; align-items:center; justify-content:space-between; min-height:78px; }
.brand{ display:inline-flex; align-items:center; gap:13px; } .brand:hover{ color:inherit; text-shadow:none; }
.brand-logo{ height:44px; width:auto; display:block; filter:drop-shadow(0 0 10px rgba(129,253,218,.35)); }
.brand-mark{ width:32px; height:28px; flex:none; filter:drop-shadow(0 0 8px rgba(129,253,218,.55)); }
.brand-word{ display:flex; flex-direction:column; line-height:1; }
.brand-name{ font-family:var(--sans); font-weight:700; font-size:1.55rem; letter-spacing:.07em; color:#fff; }
.brand-tag{ font-family:var(--serif); font-style:italic; font-size:.66rem; letter-spacing:.02em; color:var(--accent); margin-top:4px; }
.nav-links{ display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0; }
.nav-links a{ font-family:var(--serif); color:#bccad6; font-size:1.04rem; position:relative; padding:6px 0; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--accent); box-shadow:var(--glow); transition:width .25s var(--ease); }
.nav-links a:hover, .nav-links a.active{ color:#fff; text-shadow:none; }
.nav-links a:hover::after, .nav-links a.active::after{ width:100%; }
.nav-cta{ margin-left:6px; }
.nav-links a.btn--primary{ background:transparent; color:var(--accent); border:1.5px solid rgba(129,253,218,.4); box-shadow:none; padding:11px 26px; letter-spacing:.1em; text-shadow:none; }
.nav-links a.btn--primary:hover{ background:rgba(129,253,218,.1); color:#fff; border-color:var(--accent); box-shadow:0 0 18px rgba(129,253,218,.4); transform:translateY(-2px); }
.nav-toggle{ display:none; background:none; border:0; cursor:pointer; padding:8px; }
.nav-toggle span{ display:block; width:25px; height:2px; background:#fff; margin:5px 0; transition:.3s var(--ease); }
@media (max-width:940px){
  .nav-toggle{display:block} .nav-cta{display:none}
  .nav-links{ position:absolute; top:78px; left:0; right:0; flex-direction:column; gap:0;
    background:rgba(7,18,31,.97); backdrop-filter:blur(14px); max-height:0; overflow:hidden;
    transition:max-height .35s var(--ease); border-bottom:1px solid var(--border-soft); }
  .nav-links.open{ max-height:520px; }
  .nav-links li{ width:100%; } .nav-links a{ display:block; padding:16px 26px; border-top:1px solid var(--border-soft); }
}

/* ---------- HERO ---------- */
.hero{ position:relative; overflow:hidden; color:#fff; padding:70px 0; min-height:90vh; display:flex; align-items:center;
  background:
    radial-gradient(1100px 600px at 78% 10%, rgba(79,192,164,.16), transparent 60%),
    radial-gradient(900px 600px at -5% 110%, rgba(47,143,120,.20), transparent 55%); }
.hero-fx{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.9; }
.hero::after{ /* synthwave perspective grid floor */
  content:""; position:absolute; left:0; right:0; bottom:0; height:42%; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(129,253,218,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(129,253,218,.14) 1px, transparent 1px);
  background-size:60px 60px; transform:perspective(420px) rotateX(64deg); transform-origin:bottom;
  mask-image:linear-gradient(to top, #000 0%, transparent 90%); opacity:.5; }
.hero .container{ position:relative; z-index:3; width:100%; max-width:var(--maxw); }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:center; }
@media (max-width:980px){ .hero-grid{ grid-template-columns:1fr; gap:40px; } }
.hero h1{ color:#fff; max-width:16ch; text-shadow:0 0 30px rgba(79,192,164,.35); }
.hero h1 .hl{ background:linear-gradient(120deg,var(--accent),#bfffe9); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hero p{ font-family:var(--serif); color:#c2d2dc; font-size:1.24rem; max-width:560px; margin:1.4rem 0 2.2rem; }
.hero .btn-row{ display:flex; gap:16px; flex-wrap:wrap; }
.hero-badges{ display:flex; gap:24px; flex-wrap:wrap; margin-top:36px; }
.hero-badge{ display:flex; align-items:center; gap:9px; color:#9fb3c0; font-family:var(--sans); font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; }
.hero-badge svg{ width:18px; height:18px; color:var(--accent); filter:drop-shadow(0 0 6px rgba(129,253,218,.6)); }
.hero--inner{ min-height:60vh; padding:56px 0; }
.hero--inner .hero-grid{ grid-template-columns:1fr; }
.hero--inner h1{ max-width:20ch; }
.hero--inner p{ max-width:640px; }
.hero-art{ position:relative; z-index:3; }
.hero-art svg{ width:100%; height:auto; filter:drop-shadow(0 0 30px rgba(129,253,218,.25)); }
.node{ animation:pulse 3.4s var(--ease) infinite; transform-origin:center; }
.node:nth-child(2){animation-delay:.5s}.node:nth-child(3){animation-delay:1s}
.node:nth-child(4){animation-delay:1.5s}.node:nth-child(5){animation-delay:2s}
@keyframes pulse{ 0%,100%{opacity:.5}50%{opacity:1} }
.dash{ stroke-dasharray:6 8; animation:flow 6s linear infinite; }
@keyframes flow{ to{ stroke-dashoffset:-120 } }
@media (max-width:980px){ .hero-art{ max-width:440px; margin:0 auto } }
@media (prefers-reduced-motion: reduce){ .node,.dash{ animation:none } }

/* ---------- value strip ---------- */
.valuestrip{ background:linear-gradient(180deg, rgba(10,26,43,.6), rgba(6,16,28,.6)); border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft); color:#fff; }
.valuestrip .container{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
@media (max-width:880px){ .valuestrip .container{ grid-template-columns:repeat(2,1fr); } }
.value{ padding:34px 26px; border-right:1px solid var(--border-soft); display:flex; gap:14px; align-items:flex-start; }
.valuestrip .container .value:last-child{ border-right:0; }
.value .icon{ color:var(--accent); flex:none; filter:drop-shadow(0 0 8px rgba(129,253,218,.5)); } .value .icon svg{ width:26px; height:26px; }
.value h4{ color:#fff; margin:0 0 3px; font-size:1rem; letter-spacing:.02em; }
.value p{ color:#8ba0af; margin:0; font-size:.92rem; font-family:var(--sans); }
@media (max-width:880px){ .value:nth-child(2){border-right:0} .value{border-bottom:1px solid var(--border-soft)} }

/* ---------- Cards (glass) ---------- */
.grid{ display:grid; gap:28px; }
.grid-3{ grid-template-columns:repeat(3,1fr); } .grid-2{ grid-template-columns:repeat(2,1fr); } .grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:980px){ .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:680px){ .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; } }
.card{ position:relative; background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius-lg);
  padding:36px 32px; backdrop-filter:blur(8px); overflow:hidden;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease), background .25s var(--ease); }
.card::before{ content:""; position:absolute; left:0; top:0; height:3px; width:100%;
  background:linear-gradient(90deg,var(--teal-1),var(--teal-3)); box-shadow:var(--glow); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.card:hover{ transform:translateY(-8px); background:var(--panel-2); border-color:var(--border); box-shadow:0 0 0 1px var(--border), 0 30px 60px rgba(0,0,0,.5), 0 0 40px rgba(79,192,164,.12); }
.card:hover::before{ transform:scaleX(1); }
.card .icon{ width:58px; height:58px; border-radius:14px; display:grid; place-items:center; margin-bottom:20px;
  background:linear-gradient(135deg,var(--teal-1),var(--teal-3)); color:#04221b; box-shadow:0 0 24px rgba(129,253,218,.35); }
.card .icon svg{ width:28px; height:28px; }
.card h3{ margin-bottom:.5rem; } .card p{ color:var(--muted); margin:0; }

/* service tiles */
.service-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.service{ display:flex; align-items:center; gap:16px; padding:24px; border-radius:var(--radius-lg);
  background:var(--panel); border:1px solid var(--border-soft); backdrop-filter:blur(8px);
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease); }
.service:hover{ transform:translateY(-6px); border-color:var(--border); box-shadow:0 20px 44px rgba(0,0,0,.45), 0 0 28px rgba(79,192,164,.12); }
.service .icon{ width:50px; height:50px; border-radius:12px; flex:none; display:grid; place-items:center; color:#04221b;
  background:linear-gradient(135deg,var(--teal-1),var(--teal-3)); box-shadow:0 0 18px rgba(129,253,218,.35); }
.service .icon svg{ width:24px; height:24px; }
.service strong{ font-family:var(--sans); color:var(--ink); font-size:1.05rem; letter-spacing:.01em; display:block; }
.service span{ color:var(--muted); font-size:.9rem; font-family:var(--sans); }

/* tech chips */
.stack{ display:flex; flex-wrap:wrap; gap:14px; justify-content:flex-start; }
.chip{ font-family:var(--sans); font-weight:700; font-size:.92rem; letter-spacing:.03em; color:var(--ink);
  background:var(--panel); border:1px solid var(--border-soft); border-radius:999px; padding:11px 22px; backdrop-filter:blur(6px);
  transition:transform .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease); }
.chip:hover{ transform:translateY(-4px); color:var(--accent); border-color:var(--accent); box-shadow:var(--glow); }

/* process steps */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
@media (max-width:860px){ .steps{ grid-template-columns:1fr; } }
.step .num{ font-family:var(--sans); font-weight:900; font-size:2.6rem; line-height:1; display:block; margin-bottom:12px;
  background:linear-gradient(120deg,var(--accent),#bfffe9); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; filter:drop-shadow(0 0 14px rgba(129,253,218,.4)); }
.step h3{ margin-bottom:.4rem; } .step p{ color:var(--muted); margin:0; }

/* split */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; }
@media (max-width:880px){ .split{ grid-template-columns:1fr; gap:34px; } }
.media{ border-radius:var(--radius-lg); min-height:340px; position:relative; overflow:hidden;
  background:linear-gradient(135deg, rgba(10,26,43,.9), rgba(4,11,20,.9)); border:1px solid var(--border);
  display:grid; place-items:center; color:var(--accent); box-shadow:inset 0 0 60px rgba(79,192,164,.10), 0 0 40px rgba(0,0,0,.4); }
.media::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(129,253,218,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(129,253,218,.07) 1px,transparent 1px); background-size:32px 32px; mask-image:radial-gradient(circle at center,#000,transparent 75%); }
.media svg{ width:110px; height:110px; position:relative; filter:drop-shadow(0 0 18px rgba(129,253,218,.5)); }
.checklist{ list-style:none; padding:0; margin:14px 0 0; }
.checklist li{ position:relative; padding-left:34px; margin-bottom:14px; color:var(--text); }
.checklist li::before{ content:""; position:absolute; left:0; top:3px; width:22px; height:22px; border-radius:50%;
  background:linear-gradient(135deg,var(--teal-1),var(--teal-3)); box-shadow:0 0 12px rgba(129,253,218,.5); }
.checklist li::after{ content:""; position:absolute; left:7px; top:9px; width:8px; height:4px; border-left:2px solid #04221b; border-bottom:2px solid #04221b; transform:rotate(-45deg); }

/* FAQ */
.faq{ max-width:1060px; margin:0 auto; }
.faq details{ background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius-lg);
  padding:6px 26px; margin-bottom:14px; backdrop-filter:blur(8px); transition:border-color .2s var(--ease), box-shadow .2s var(--ease); }
.faq details[open]{ border-color:var(--border); box-shadow:0 0 30px rgba(79,192,164,.10); }
.faq summary{ font-family:var(--sans); cursor:pointer; font-weight:700; color:var(--ink); padding:20px 0; list-style:none; position:relative; padding-right:38px; font-size:1.02rem; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; position:absolute; right:4px; top:14px; font-size:1.7rem; color:var(--accent); transition:transform .25s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ color:var(--muted); padding-bottom:20px; margin:0; }

/* Forms */
.form{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius-lg); padding:36px; backdrop-filter:blur(10px); box-shadow:0 0 40px rgba(79,192,164,.08); }
.form label{ font-family:var(--sans); display:block; font-weight:700; color:var(--ink); margin:16px 0 6px; font-size:.84rem; letter-spacing:.05em; text-transform:uppercase; }
.form input,.form textarea{ width:100%; padding:14px 15px; border:1px solid var(--border-soft); border-radius:var(--radius); font:inherit; color:var(--ink); background:rgba(0,0,0,.25); transition:border-color .2s var(--ease), box-shadow .2s var(--ease); }
.form input::placeholder,.form textarea::placeholder{ color:#5f7385; }
.form input:focus,.form textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(129,253,218,.15), 0 0 18px rgba(129,253,218,.2); }
.form .btn{ margin-top:24px; width:100%; justify-content:center; }
.form input[type=file]{ padding:10px 14px; color:var(--text); cursor:pointer; }
.form input[type=file]::file-selector-button{ font-family:var(--sans); font-weight:700; font-size:.76rem; letter-spacing:.04em; text-transform:uppercase; background:rgba(129,253,218,.1); color:var(--accent); border:1px solid var(--border); border-radius:6px; padding:8px 14px; margin-right:12px; cursor:pointer; transition:background .2s; }
.form input[type=file]::file-selector-button:hover{ background:rgba(129,253,218,.2); }
.form select{ width:100%; padding:14px 15px; border:1px solid var(--border-soft); border-radius:var(--radius); font:inherit; color:var(--ink); background:rgba(0,0,0,.25); cursor:pointer; appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2381fdda' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 15px center; padding-right:40px; }
.form select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(129,253,218,.15), 0 0 18px rgba(129,253,218,.2); }
.form select option{ background:#0a1f33; color:var(--ink); }
.form-note{ font-size:.82rem; color:var(--muted); margin-top:14px; }
.info-row{ display:flex; gap:14px; align-items:flex-start; margin-bottom:16px; color:var(--text); }
.info-row .icon{ color:var(--accent); flex:none; margin-top:3px; filter:drop-shadow(0 0 6px rgba(129,253,218,.5)); }
.info-row a{ color:var(--text); } .info-row a:hover{ color:var(--accent); text-shadow:none; }
.hours-table{ width:100%; border-collapse:collapse; margin-top:6px; }
.hours-table td{ padding:10px 0; border-bottom:1px solid var(--border-soft); color:var(--muted); }
.hours-table td:first-child{ font-family:var(--sans); }
.hours-table td:last-child{ text-align:right; color:var(--ink); font-weight:700; font-family:var(--sans); font-size:.92rem; }

/* Bands */
.band{ position:relative; overflow:hidden; border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft);
  background:radial-gradient(800px 400px at 80% 0%, rgba(79,192,164,.16), transparent 60%), linear-gradient(180deg, rgba(8,18,31,.7), rgba(4,11,20,.7)); color:#fff; }
.band h2,.band h3{ color:#fff; } .band .lead{ color:#c2d2dc; }
.cta-band{ text-align:center; padding:90px 0; } .cta-band h2{ max-width:18ch; margin:0 auto .4em; }
.quote-band{ text-align:center; padding:92px 0; }
.quote{ font-family:var(--serif); font-style:italic; font-size:clamp(1.5rem,3vw,2.15rem); color:#fff; max-width:880px; margin:0 auto; line-height:1.5; text-shadow:0 0 30px rgba(79,192,164,.25); }
.quote-author{ font-family:var(--sans); color:var(--accent); margin-top:20px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.9rem; text-shadow:var(--glow); }

/* Footer */
.site-footer{ background:rgba(3,8,14,.7); border-top:1px solid var(--border-soft); color:#8ba0af; padding:66px 0 30px; }
.footer-grid{ display:grid; grid-template-columns:2.2fr 1fr 1fr 1.4fr; gap:40px; }
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:30px; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr; } }
.site-footer .brand{ margin-bottom:16px; }
.site-footer p{ font-size:.96rem; }
.site-footer h4{ font-family:var(--sans); color:#fff; font-size:.92rem; margin-bottom:16px; letter-spacing:.08em; text-transform:uppercase; }
.site-footer a{ color:#8ba0af; } .site-footer a:hover{ color:var(--accent); text-shadow:none; }
.footer-links{ list-style:none; padding:0; margin:0; } .footer-links li{ margin-bottom:10px; }
.footer-bottom{ border-top:1px solid var(--border-soft); margin-top:44px; padding-top:22px; font-size:.88rem; color:#5f7385; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }

/* ---------- Tech constellation (Learn page) ---------- */
.constellation-wrap{ display:grid; place-items:center; margin-top:34px; width:100%; }
.constellation{ width:100%; max-width:760px; height:auto; overflow:visible; }
.constellation .hub{ fill:#0a1f33; stroke:var(--accent); stroke-width:2.5; filter:drop-shadow(0 0 18px rgba(129,253,218,.6)); }
.constellation .hub-label{ fill:var(--accent); font-family:var(--sans); font-weight:800; font-size:22px; letter-spacing:2px; text-anchor:middle; dominant-baseline:middle; }
.constellation .ring{ fill:none; stroke:rgba(95,224,192,.16); stroke-dasharray:3 11; transform-origin:400px 400px; animation:spin 44s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg) } }
.tech-node{ cursor:pointer; }
.tech-node line{ stroke:rgba(95,224,192,.22); stroke-width:1.5; transition:.25s var(--ease); }
.tech-node .dot{ fill:#0a1f33; stroke:var(--accent); stroke-width:2; transition:.25s var(--ease); }
.tech-node .halo{ fill:rgba(129,253,218,0); transition:.25s var(--ease); }
.tech-node text{ fill:#aebfca; font-family:var(--sans); font-weight:700; font-size:19px; letter-spacing:.4px; transition:.25s var(--ease); }
.tech-node:hover line, .tech-node:focus line{ stroke:var(--accent); stroke-width:3; filter:drop-shadow(0 0 6px rgba(129,253,218,.85)); }
.tech-node:hover .dot, .tech-node:focus .dot{ fill:var(--accent); r:14; filter:drop-shadow(0 0 12px rgba(129,253,218,.95)); }
.tech-node:hover .halo, .tech-node:focus .halo{ fill:rgba(129,253,218,.12); }
.tech-node:hover text, .tech-node:focus text{ fill:#fff; }
.node-pulse{ animation:nodepulse 3s var(--ease) infinite; }
@keyframes nodepulse{ 0%,100%{ opacity:.55 } 50%{ opacity:1 } }
.constellation-hint{ text-align:center; color:var(--muted); font-family:var(--sans); font-size:.86rem; letter-spacing:.05em; text-transform:uppercase; margin-top:26px; }

/* ---------- Learn sections ---------- */
.tech-sec{ scroll-margin-top:96px; }
.split--rev .rev-a{ order:2; }
@media (max-width:880px){ .split--rev .rev-a{ order:0; } }
.learn-card{ background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:30px 32px; backdrop-filter:blur(8px); }
.learn-card + .learn-card{ margin-top:20px; }
.learn-card h4{ font-family:var(--sans); color:var(--ink); font-size:.84rem; letter-spacing:.06em; text-transform:uppercase; margin:0 0 16px; }
.learn-card .checklist{ margin:0; } .learn-card .checklist li{ margin-bottom:12px; }

/* Scroll reveal */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s } .reveal.d2{ transition-delay:.2s } .reveal.d3{ transition-delay:.3s }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* ---------- Job board ---------- */
.jobs-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(440px, 1fr)); gap:24px; }
.job{ background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:28px 30px; backdrop-filter:blur(8px); transition:transform .22s var(--ease), border-color .22s var(--ease), box-shadow .22s var(--ease); }
.job:hover{ transform:translateY(-5px); border-color:var(--border); box-shadow:0 24px 50px rgba(0,0,0,.45), 0 0 30px rgba(79,192,164,.12); }
.job-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.job-head h3{ margin:0; font-size:1.32rem; }
.job-type{ font-family:var(--sans); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); border:1px solid var(--border); border-radius:999px; padding:6px 14px; box-shadow:var(--glow); white-space:nowrap; }
.job-meta{ font-family:var(--sans); color:var(--muted); font-size:.9rem; margin:12px 0 14px; display:flex; gap:16px; flex-wrap:wrap; }
.job-meta span{ display:inline-flex; align-items:center; gap:7px; }
.job-meta svg{ width:15px; height:15px; color:var(--accent); }
.job p{ color:var(--text); margin:0 0 16px; }
.job-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.job-tags span{ font-family:var(--sans); font-size:.8rem; color:var(--ink); background:rgba(129,253,218,.06); border:1px solid var(--border-soft); border-radius:6px; padding:5px 12px; }
.job .btn{ padding:11px 26px; }
.job-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.job-actions .btn{ padding:11px 24px; }
.job-tags .more{ color:var(--accent); align-self:center; font-family:var(--sans); font-size:.8rem; font-weight:700; }

/* ---------- Job filters / search ---------- */
.job-filters{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:0 0 14px; }
.job-search{ position:relative; flex:1 1 260px; }
.job-search svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--muted); pointer-events:none; }
.job-search input{ width:100%; padding:13px 14px 13px 44px; border:1px solid var(--border-soft); border-radius:var(--radius); background:rgba(0,0,0,.25); color:var(--ink); font:inherit; }
.job-search input::placeholder{ color:#5f7385; }
.job-search input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(129,253,218,.15); }
.job-filters select{ padding:12px 38px 12px 14px; border:1px solid var(--border-soft); border-radius:var(--radius); background:rgba(0,0,0,.25); color:var(--ink); font:inherit; cursor:pointer; appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2381fdda' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; }
.job-filters select:focus{ outline:none; border-color:var(--accent); }
.job-filters select option{ background:#0a1f33; color:var(--ink); }
.job-filters .btn{ padding:12px 20px; }
.job-count{ margin:0 0 24px; color:var(--muted); font-family:var(--sans); font-size:.84rem; letter-spacing:.04em; }

/* ---------- Job detail modal grid ---------- */
.jd-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px 28px; margin:20px 0 6px; }
@media (max-width:520px){ .jd-grid{ grid-template-columns:1fr; } }
.jd-row{ display:flex; flex-direction:column; gap:3px; padding:11px 0; border-bottom:1px solid var(--border-soft); }
.jd-row span{ font-family:var(--sans); font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); }
.jd-row strong{ color:var(--ink); }

/* ---------- Clickable service cards ---------- */
.card--service{ text-align:left; width:100%; font:inherit; cursor:pointer; color:inherit; display:block; }
.card--service .card-more{ display:inline-flex; align-items:center; gap:7px; margin-top:16px; font-family:var(--sans); font-weight:700; font-size:.76rem; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.card--service .card-more svg{ width:15px; height:15px; transition:transform .2s var(--ease); }
.card--service:hover .card-more svg{ transform:translateX(4px); }

/* ---------- Modal ---------- */
.svc-source{ display:none; }
.modal{ position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px; }
.modal.open{ display:flex; }
.modal-overlay{ position:absolute; inset:0; background:rgba(2,7,13,.74); backdrop-filter:blur(6px); }
.modal-card{ position:relative; z-index:1; width:100%; max-width:640px; max-height:88vh; overflow-y:auto; padding:40px;
  background:linear-gradient(180deg, rgba(11,28,46,.99), rgba(6,15,26,.99)); border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:0 40px 90px rgba(0,0,0,.6), 0 0 60px rgba(79,192,164,.15); animation:modalIn .32s var(--ease); }
@keyframes modalIn{ from{ opacity:0; transform:translateY(22px) scale(.98) } to{ opacity:1; transform:none } }
.modal-close{ position:absolute; top:16px; right:16px; width:40px; height:40px; border-radius:8px; cursor:pointer;
  background:rgba(255,255,255,.05); border:1px solid var(--border-soft); color:var(--ink); font-size:1.4rem; line-height:1; display:grid; place-items:center; transition:.2s var(--ease); }
.modal-close:hover{ border-color:var(--accent); color:var(--accent); box-shadow:var(--glow); }
.modal-icon{ width:60px; height:60px; border-radius:14px; display:grid; place-items:center; margin-bottom:18px;
  background:linear-gradient(135deg,var(--teal-1),var(--teal-3)); color:#04221b; box-shadow:0 0 24px rgba(129,253,218,.35); }
.modal-icon svg{ width:30px; height:30px; }
.modal-body h3{ font-size:1.7rem; margin-bottom:4px; }
.modal-tag{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.14em; font-size:.76rem; font-weight:700; color:var(--accent); margin-bottom:18px; }
.modal-body > p{ color:var(--text); }
.modal-body h4{ font-family:var(--sans); color:var(--ink); font-size:.86rem; letter-spacing:.06em; text-transform:uppercase; margin:24px 0 12px; }
.svc-list{ list-style:none; padding:0; margin:0; }
.svc-list li{ position:relative; padding-left:30px; margin-bottom:11px; color:var(--text); }
.svc-list li::before{ content:""; position:absolute; left:0; top:4px; width:18px; height:18px; border-radius:50%; background:linear-gradient(135deg,var(--teal-1),var(--teal-3)); box-shadow:0 0 10px rgba(129,253,218,.5); }
.svc-list li::after{ content:""; position:absolute; left:6px; top:9px; width:6px; height:3px; border-left:2px solid #04221b; border-bottom:2px solid #04221b; transform:rotate(-45deg); }
.modal-body .btn{ margin-top:26px; }
.form--bare{ background:transparent; border:0; box-shadow:none; padding:0; backdrop-filter:none; }

/* ---------- Services interactive orbit ---------- */
.hero--split .hero-grid{ grid-template-columns:1.05fr .95fr; }
@media (max-width:980px){ .hero--split .hero-grid{ grid-template-columns:1fr; } }
.svc-orbit-svg{ width:100%; height:auto; overflow:visible; user-select:none; -webkit-user-select:none; touch-action:pan-y; }
.svc-ambient{ fill:rgba(129,253,218,.55); pointer-events:none; }

/* ---------- Contact page ---------- */
.contact-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:760px){ .contact-cards{ grid-template-columns:1fr; } }
.contact-card{ display:block; text-align:center; color:inherit; }
.contact-card:hover{ color:inherit; text-decoration:none; }
.contact-card:hover .cc-value{ color:var(--accent); }
.contact-card .icon{ margin:0 auto 18px; }
.contact-card .cc-label{ font-family:var(--sans); text-transform:uppercase; letter-spacing:.09em; font-size:.72rem; color:var(--muted); }
.contact-card .cc-value{ color:var(--ink); font-family:var(--sans); font-weight:700; font-size:1.06rem; margin-top:5px; transition:color .2s var(--ease); }
.map-frame{ border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); }
.map-frame iframe{ width:100%; height:400px; border:0; display:block; filter:invert(0.9) hue-rotate(185deg) brightness(0.95) contrast(0.9); }
@media (max-width:600px){ .map-frame iframe{ height:300px; } }

/* ---------- FAQ search ---------- */
.faq-search{ position:relative; max-width:580px; margin:0 auto 34px; }
.faq-search svg{ position:absolute; left:18px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--muted); pointer-events:none; }
.faq-search input{ width:100%; padding:15px 18px 15px 48px; border:1px solid var(--border-soft); border-radius:999px; background:rgba(0,0,0,.25); color:var(--ink); font:inherit; }
.faq-search input::placeholder{ color:#5f7385; }
.faq-search input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(129,253,218,.15); }
.faq-none{ text-align:center; color:var(--muted); }

/* ---------- Accessibility: visible keyboard focus ---------- */
a:focus-visible, button:focus-visible, .btn:focus-visible, summary:focus-visible,
[tabindex]:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
.tech-node:focus-visible, .svc-onode:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:3px; }

/* ---------- Cookie banner ---------- */
.cookie-banner{ position:fixed; left:20px; right:20px; bottom:20px; z-index:120; max-width:660px; margin:0 auto;
  background:rgba(10,26,43,.97); border:1px solid var(--border); border-radius:var(--radius-lg); backdrop-filter:blur(12px);
  box-shadow:0 20px 60px rgba(0,0,0,.55); padding:20px 24px; display:flex; flex-wrap:wrap; align-items:center; gap:16px; justify-content:space-between;
  transform:translateY(30px); opacity:0; transition:transform .3s var(--ease), opacity .3s var(--ease); }
.cookie-banner.show{ transform:none; opacity:1; }
.cookie-banner p{ margin:0; color:var(--text); font-size:.92rem; flex:1 1 300px; }
.cookie-banner a{ color:var(--accent); }
.cookie-actions{ display:flex; gap:10px; }
.cookie-actions .btn{ padding:10px 22px; }
@media (max-width:520px){ .cookie-banner{ left:12px; right:12px; bottom:12px; flex-direction:column; align-items:stretch; } .cookie-actions{ justify-content:flex-end; } }

/* ---------- Legal / long-form ---------- */
.legal{ max-width:820px; }
.legal h2{ font-size:1.5rem; margin-top:2.2rem; text-transform:none; letter-spacing:0; font-weight:700; }
.legal h3{ margin-top:1.6rem; }
.legal p, .legal li{ color:var(--text); }
.legal ul{ padding-left:22px; } .legal li{ margin-bottom:8px; }
.legal a{ color:var(--accent); }
.legal .muted{ color:var(--muted); font-size:.9rem; }
.svc-ring{ fill:none; stroke:rgba(95,224,192,.13); }
.svc-hub{ fill:#0a1f33; stroke:var(--accent); stroke-width:2.5; filter:drop-shadow(0 0 16px rgba(129,253,218,.55)); }
.svc-onode{ cursor:pointer; }
.svc-onode line{ stroke:rgba(95,224,192,.16); stroke-width:1.2; transition:.2s var(--ease); }
.svc-onode .d{ fill:#0a1f33; stroke:var(--accent); stroke-width:2; transition:.2s var(--ease); }
.svc-onode .h{ fill:rgba(129,253,218,0); transition:.2s var(--ease); }
.svc-onode text{ fill:#fff; font-family:var(--sans); font-weight:700; font-size:16px; letter-spacing:.3px; opacity:0; transition:.2s var(--ease); pointer-events:none; }
.svc-onode:hover line, .svc-onode:focus line{ stroke:var(--accent); stroke-width:2.4; filter:drop-shadow(0 0 5px rgba(129,253,218,.8)); }
.svc-onode:hover .d, .svc-onode:focus .d{ fill:var(--accent); r:11; filter:drop-shadow(0 0 10px rgba(129,253,218,.95)); }
.svc-onode:hover .h, .svc-onode:focus .h{ fill:rgba(129,253,218,.14); }
.svc-onode:hover text, .svc-onode:focus text{ opacity:1; }
.modal-body .modal-tag[hidden]{ display:none; }