/* Hallmark v2 — Dusk material adapted for Spectrum Global Solutions.
   Source material: Dusk / Wix Madefor Display + Text / fog + periwinkle-apricot / glass.
   Brand adaptation preserves Spectrum logo and geospatial imagery. */
@layer base {
  :root{
    --color-paper:oklch(17.5% .014 268);
    --color-paper-2:oklch(21% .016 268);
    --color-paper-3:oklch(25% .017 268);
    --color-ink:oklch(96% .006 75);
    --color-ink-2:oklch(85% .010 262);
    --color-muted:oklch(70% .016 262);
    --color-rule:oklch(30% .016 266);
    --color-light:oklch(100% 0 0);
    --color-shade:oklch(10% .022 268);
    --color-accent:oklch(77% .10 274);
    --color-accent-ink:oklch(19% .035 274);
    --color-accent-hi:oklch(84% .085 274);
    --color-accent-deep:oklch(44% .13 274);
    --color-accent-soft:oklch(91% .038 274);
    --color-focus:oklch(80% .10 274);
    --color-accent-2:oklch(83% .095 62);
    --color-dusk:oklch(70% .12 330);
    --color-day-ink:oklch(22% .022 268);
    --color-day-muted:oklch(38% .022 266);
    --color-fog:oklch(94% .012 70);
    --color-well:oklch(95.5% .008 75);
    --color-well-2:oklch(92% .010 75);
    --color-well-ink:oklch(21% .016 268);
    --color-well-muted:oklch(47% .016 265);
    --color-well-rule:oklch(87.5% .009 75);
    --color-card:oklch(99.5% .003 75);
    --glass:oklch(22% .018 268 / .58);
    --glass-blur:22px;
    --glass-hi:inset 0 1px 0 oklch(100% 0 0 / .10),inset 0 0 0 1px oklch(100% 0 0 / .06);
    --shadow-card:0 1px 0 oklch(100% 0 0 / .06) inset,0 40px 80px -32px oklch(8% .02 268 / .7);
    --font-display:"Wix Madefor Display",ui-sans-serif,system-ui,sans-serif;
    --font-body:"Wix Madefor Text",ui-sans-serif,system-ui,sans-serif;
    --radius-card:18px;
    --radius-inner:10px;
    --radius-pill:999px;
    --tracking-display:-.022em;
    --display-weight:500;
  }
  html{scroll-behavior:smooth;background:var(--color-paper)}
  body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);font-size:17px;line-height:1.55;overflow-x:hidden}
  h1,h2,h3{font-family:var(--font-display);font-weight:var(--display-weight)!important;letter-spacing:var(--tracking-display)!important}
  ::selection{background:var(--color-accent);color:var(--color-accent-ink)}
  img{display:block;max-width:100%} a{color:inherit;text-decoration:none}
}
.shell{width:min(1180px,calc(100% - 2rem));margin-inline:auto}
@media(min-width:768px){.shell{width:min(1220px,calc(100% - 4rem))}}

/* Header: clear over the hour, slate glass after the hero begins to leave. */
.site-header{position:sticky;top:0;z-index:50;background:transparent;border-bottom:1px solid transparent;transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;color:var(--color-day-ink)}
.site-header.is-scrolled{background:color-mix(in oklab,var(--color-paper) 86%,transparent);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);border-color:color-mix(in oklab,var(--color-light) 10%,transparent);box-shadow:0 10px 30px rgba(0,0,0,.13);color:var(--color-ink)}
.brand-wrap{position:relative;display:block;width:min(500px,64vw);height:72px}
.brand-logo{position:absolute;left:0;top:50%;transform:translateY(-50%);width:auto;height:64px;max-width:100%;object-fit:contain;object-position:left center;transition:opacity .25s ease}
.logo-on-photo{opacity:1}.logo-on-slate{opacity:0}.site-header.is-scrolled .logo-on-photo{opacity:0}.site-header.is-scrolled .logo-on-slate{opacity:1}
@media(min-width:768px){.brand-wrap{height:82px;width:min(560px,48vw)}.brand-logo{height:76px}}
@media(min-width:1280px){.brand-wrap{height:88px;width:570px}.brand-logo{height:82px}}
.nav-link{position:relative;color:inherit;font:500 14px/1 var(--font-body);transition:opacity .2s ease}.nav-link:hover,.nav-link.active{opacity:.68}.nav-link.active:after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:1px;background:currentColor;opacity:.4}
.nav-services{position:relative;display:flex;align-items:center;gap:5px}.nav-services-toggle{display:flex;align-items:center;gap:6px}.nav-services-toggle svg{width:12px;height:12px;transition:transform .2s}.nav-services:hover .nav-services-toggle svg,.nav-services:focus-within .nav-services-toggle svg{transform:rotate(180deg)}
.services-dropdown{position:absolute;left:-26px;top:calc(100% + 22px);width:270px;padding:10px;background:var(--color-well);color:var(--color-well-ink);border:1px solid var(--color-well-rule);border-radius:16px;box-shadow:0 24px 60px rgba(7,10,20,.22);opacity:0;visibility:hidden;transform:translateY(-7px);transition:.2s ease}
.nav-services:hover .services-dropdown,.nav-services:focus-within .services-dropdown{opacity:1;visibility:visible;transform:none}.services-dropdown:before{content:"";position:absolute;left:0;right:0;top:-24px;height:24px}
.services-dropdown a{display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:center;padding:11px 12px;border-radius:10px;font-size:14px;color:var(--color-well-ink)}.services-dropdown a:hover,.services-dropdown a:focus{background:var(--color-card);outline:none}.service-index{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--color-accent-soft);color:var(--color-accent-deep);font-size:11px;font-weight:600}

/* Dusk hero — a real dusk landscape is the loudest material. */
.dusk-hero{position:relative;isolation:isolate;overflow:hidden;min-height:620px;background:var(--color-paper);border-bottom:8px solid color-mix(in oklab,var(--color-light) 70%,transparent)}
.dusk-hero:before{content:"";position:absolute;inset:0;z-index:-3;background-image:url("../images/GAL-4.jpg");background-size:cover;background-position:center 42%;transform:scale(1.03);animation:duskDrift 48s ease-in-out infinite alternate}
.dusk-hero:after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse 55% 72% at 22% 52%,color-mix(in oklab,var(--color-fog) 84%,transparent) 0%,color-mix(in oklab,var(--color-fog) 58%,transparent) 48%,transparent 78%),linear-gradient(to bottom,rgba(255,255,255,.06) 0%,transparent 66%,var(--color-paper) 100%)}
.dusk-hero .grid-field,.dusk-hero .world-lines,.dusk-hero .aurora,.dusk-hero .orbit{display:none!important}
.dusk-hero .hero-copy{position:relative;z-index:2;color:var(--color-day-ink)!important}
.dusk-hero .hero-copy h1,.dusk-hero .hero-copy h2,.dusk-hero .hero-copy h3,.dusk-hero .hero-copy .text-white,.dusk-hero .hero-copy .metric{color:var(--color-day-ink)!important}
.dusk-hero .hero-copy .kicker,.dusk-hero .hero-copy p,.dusk-hero .hero-copy .text-slate-500,.dusk-hero .hero-copy .text-slate-400{color:var(--color-day-muted)!important}
.dusk-hero .hero-copy .border-white\/10{border-color:color-mix(in oklab,var(--color-day-ink) 18%,transparent)!important}
.photo-credit{position:absolute;right:18px;bottom:12px;z-index:6;color:rgba(255,255,255,.78);font-size:10px;text-shadow:0 1px 8px rgba(0,0,0,.75)}
.photo-credit a{text-decoration:underline;text-underline-offset:2px}
@keyframes duskDrift{from{transform:scale(1.03) translateX(0)}to{transform:scale(1.09) translateX(-2.5%)}}

.display{letter-spacing:var(--tracking-display)!important;line-height:1.03!important;text-wrap:balance}
.gradient-text{background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;color:inherit!important}
.kicker{color:var(--color-muted);line-height:1.65;max-width:68ch}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;color:var(--color-muted)!important;font:500 14px/1.2 var(--font-body)!important;letter-spacing:0!important;text-transform:none!important}.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--color-accent)}

.glass{background:var(--glass)!important;border:0!important;border-radius:var(--radius-card)!important;-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.35);backdrop-filter:blur(var(--glass-blur)) saturate(1.35);box-shadow:var(--glass-hi),var(--shadow-card)}
.panel{background:var(--color-paper-2);border:1px solid var(--color-rule);box-shadow:var(--shadow-card)}
.hairline{border-color:var(--color-rule)}
.dusk-hero .glass{color:var(--color-ink)}

.btn-primary{min-height:48px;padding:0 1.35rem!important;border:0!important;border-radius:var(--radius-pill)!important;background:var(--color-accent)!important;color:var(--color-accent-ink)!important;font:600 15px/1 var(--font-body)!important;box-shadow:inset 0 1px 0 color-mix(in oklab,var(--color-light) 35%,transparent)!important;transition:background .2s ease,box-shadow .2s ease,transform .2s ease}.btn-primary:hover{background:var(--color-accent-hi)!important;box-shadow:inset 0 1px 0 color-mix(in oklab,var(--color-light) 35%,transparent),0 0 0 5px color-mix(in oklab,var(--color-accent) 15%,transparent)!important;transform:translateY(-1px)!important;filter:none!important}
.btn-ghost{min-height:48px;border:1px solid color-mix(in oklab,var(--color-light) 14%,transparent)!important;background:color-mix(in oklab,var(--color-light) 4%,transparent)!important;border-radius:var(--radius-pill)!important;font:500 15px/1 var(--font-body)!important;transition:.2s}.btn-ghost:hover{background:color-mix(in oklab,var(--color-light) 8%,transparent)!important;transform:none!important}
.dusk-hero .hero-copy .btn-ghost{border-color:color-mix(in oklab,var(--color-day-ink) 20%,transparent)!important;background:rgba(255,255,255,.25)!important;color:var(--color-day-ink)!important;backdrop-filter:blur(8px)}

/* Product panes and technical imagery */
.image-frame{position:relative;overflow:hidden;border:0!important;border-radius:var(--radius-card)!important;background:var(--glass)!important;box-shadow:var(--glass-hi),var(--shadow-card);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.2);backdrop-filter:blur(var(--glass-blur)) saturate(1.2)}
.image-frame img{transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .5s}.image-frame:hover img{transform:scale(1.025);filter:saturate(1.04) contrast(1.02)}.image-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(8,11,19,.28));pointer-events:none}
.scan:after{display:none!important}

/* Slate below the hour. Cards are quieter and ruled, not neon tiles. */
section:not(.dusk-hero){background:var(--color-paper)}
.data-card{position:relative;overflow:hidden;background:var(--color-paper-2)!important;border:1px solid var(--color-rule)!important;border-radius:var(--radius-card)!important;box-shadow:0 1px 0 rgba(255,255,255,.03) inset;transition:border-color .25s ease,transform .25s ease}.data-card:before{display:none!important}.data-card:hover{transform:translateY(-2px)!important;border-color:color-mix(in oklab,var(--color-accent) 30%,var(--color-rule))!important;box-shadow:none!important}
.section-line{height:1px;background:var(--color-rule)}
.logo-rail{mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker{display:flex;width:max-content;animation:marquee 36s linear infinite}@keyframes marquee{to{transform:translateX(-50%)}}

/* Bone wells for light breathing spaces */
.bone-well{background:var(--color-well)!important;color:var(--color-well-ink)!important}.bone-well h2,.bone-well h3,.bone-well .text-white{color:var(--color-well-ink)!important}.bone-well p,.bone-well .text-slate-400{color:var(--color-well-muted)!important}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .65s ease,transform .65s ease}.reveal.in{opacity:1;transform:none}
.mobile-panel{transform:translateX(100%);transition:transform .35s cubic-bezier(.2,.8,.2,1);background:var(--color-paper)!important}.mobile-panel.open{transform:translateX(0)}
.mobile-service-list{margin:.25rem 0 .75rem 1rem;border-left:1px solid var(--color-rule);padding-left:1rem}.mobile-service-list a{display:block;padding:.55rem 0;color:var(--color-muted);font-size:15px}.mobile-service-list a:hover{color:var(--color-ink)}
.faq-item{border-top:1px solid var(--color-rule)}.faq-answer{max-height:0;overflow:hidden;opacity:.72;transition:max-height .35s ease,opacity .35s ease,padding .35s ease}.faq-item.open .faq-answer{max-height:360px;opacity:1;padding-bottom:1.25rem}.faq-plus{transition:transform .3s ease}.faq-item.open .faq-plus{transform:rotate(45deg)}
.form-input{width:100%;border:1px solid var(--color-rule)!important;background:color-mix(in oklab,var(--color-light) 4%,transparent)!important;color:var(--color-ink)!important;border-radius:12px!important;padding:.95rem 1rem;outline:none;transition:.2s;font-family:var(--font-body)}.form-input:focus{border-color:var(--color-accent)!important;box-shadow:0 0 0 4px color-mix(in oklab,var(--color-accent) 12%,transparent)!important}.form-input::placeholder{color:var(--color-muted)}
.map-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 0 7px color-mix(in oklab,var(--color-accent) 12%,transparent)}

/* Existing utility-heavy markup corrections: Dusk is quiet, sentence-case and not black-weight. */
.font-black{font-weight:600!important}.uppercase{text-transform:none!important}.tracking-\[\.12em\],.tracking-\[\.15em\],.tracking-\[\.18em\],.tracking-\[\.2em\],.tracking-\[\.22em\]{letter-spacing:0!important}
.text-\[10px\],.text-\[11px\]{font-size:12px!important}
.text-\[\#8beeff\],.text-\[\#9eefff\],.text-\[\#b99cff\]{color:var(--color-accent)!important}
.bg-white\/\[\.02\],.bg-white\/\[\.018\]{background:transparent!important}
.border-white\/10{border-color:var(--color-rule)!important}

@media(max-width:1023px){.dusk-hero:after{background:linear-gradient(90deg,color-mix(in oklab,var(--color-fog) 88%,transparent),color-mix(in oklab,var(--color-fog) 62%,transparent) 60%,rgba(255,255,255,.10)),linear-gradient(to bottom,transparent 68%,var(--color-paper))}.dusk-hero:before{background-position:58% center}.photo-credit{right:10px;bottom:7px}.brand-wrap{width:min(390px,70vw)}}
@media(max-width:640px){.dusk-hero{min-height:auto}.brand-wrap{width:min(310px,72vw);height:64px}.brand-logo{height:56px}.dusk-hero .hero-copy{padding-top:.5rem}.photo-credit{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.dusk-hero:before,.ticker{animation:none}.reveal{opacity:1;transform:none;transition:none}.data-card,.image-frame img,.btn-primary,.btn-ghost{transition:none}}

/* =========================================================
   Hallmark V2 Dusk — dual theme + always-legible header
   ========================================================= */
:root{
  color-scheme:dark;
  --header-bg:oklch(15.5% .014 268 / .94);
  --header-border:oklch(100% 0 0 / .10);
  --header-shadow:0 14px 40px rgba(3,7,18,.18);
  --footer-bg:oklch(12% .018 268);
  --theme-track:oklch(24% .018 268);
  --theme-track-border:oklch(100% 0 0 / .14);
  --theme-knob:oklch(82% .10 274);
}
html[data-theme="light"]{
  color-scheme:light;
  --color-paper:oklch(97.3% .009 75);
  --color-paper-2:oklch(99% .004 75);
  --color-paper-3:oklch(94.5% .010 75);
  --color-ink:oklch(22% .020 268);
  --color-ink-2:oklch(32% .018 268);
  --color-muted:oklch(46% .018 266);
  --color-rule:oklch(87% .012 75);
  --color-light:oklch(100% 0 0);
  --color-shade:oklch(22% .020 268);
  --color-accent:oklch(72% .105 274);
  --color-accent-ink:oklch(20% .035 274);
  --color-accent-hi:oklch(78% .095 274);
  --color-accent-deep:oklch(44% .13 274);
  --color-accent-soft:oklch(91.5% .036 274);
  --color-focus:oklch(68% .12 274);
  --color-accent-2:oklch(78% .10 62);
  --color-dusk:oklch(66% .12 330);
  --color-day-ink:oklch(20% .023 268);
  --color-day-muted:oklch(36% .022 266);
  --color-fog:oklch(96% .011 70);
  --color-well:oklch(99.2% .004 75);
  --color-well-2:oklch(95.5% .008 75);
  --color-well-ink:oklch(21% .016 268);
  --color-well-muted:oklch(45% .016 265);
  --color-well-rule:oklch(88% .010 75);
  --color-card:oklch(100% 0 0);
  --glass:oklch(100% 0 0 / .72);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.9),inset 0 0 0 1px rgba(45,48,62,.07);
  --shadow-card:0 1px 0 rgba(255,255,255,.9) inset,0 28px 68px -34px rgba(26,30,46,.28);
  --header-bg:oklch(98.5% .006 75 / .92);
  --header-border:oklch(32% .015 268 / .10);
  --header-shadow:0 12px 36px rgba(31,35,50,.10);
  --footer-bg:oklch(95.7% .008 75);
  --theme-track:oklch(91% .010 75);
  --theme-track-border:oklch(30% .015 268 / .13);
  --theme-knob:oklch(28% .03 268);
}

/* The header is a surface of its own. It never inherits an unreadable
   foreground from the hero/body beneath it. */
.site-header,
.site-header.is-scrolled{
  position:sticky;
  top:0;
  z-index:60;
  background:var(--header-bg)!important;
  color:var(--color-ink)!important;
  border-bottom:1px solid var(--header-border)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.22);
  backdrop-filter:blur(22px) saturate(1.22);
  box-shadow:var(--header-shadow);
}
.site-header .nav-link{color:var(--color-ink)!important;opacity:.84}
.site-header .nav-link:hover,.site-header .nav-link.active{opacity:1}
.site-header .nav-link.active:after{background:var(--color-accent);opacity:1;height:2px;border-radius:99px}
.site-header #menuOpen{color:var(--color-ink)!important;background:color-mix(in oklab,var(--color-ink) 4%,transparent)!important;border-color:color-mix(in oklab,var(--color-ink) 15%,transparent)!important}
.site-header .btn-primary{white-space:nowrap}

/* Logo selection follows the theme, not scroll position. */
.logo-on-photo,.site-header.is-scrolled .logo-on-photo{opacity:0!important}
.logo-on-slate,.site-header.is-scrolled .logo-on-slate{opacity:1!important}
html[data-theme="light"] .logo-on-photo,
html[data-theme="light"] .site-header.is-scrolled .logo-on-photo{opacity:1!important}
html[data-theme="light"] .logo-on-slate,
html[data-theme="light"] .site-header.is-scrolled .logo-on-slate{opacity:0!important}

/* Premium compact light/dark control. */
.theme-toggle{display:inline-grid;place-items:center;flex:0 0 auto;border:0;background:transparent;padding:0;cursor:pointer;border-radius:999px;outline:none}
.theme-toggle:focus-visible{box-shadow:0 0 0 3px color-mix(in oklab,var(--color-accent) 28%,transparent)}
.theme-toggle-track{position:relative;display:grid;grid-template-columns:28px 28px;align-items:center;width:62px;height:34px;padding:2px;border:1px solid var(--theme-track-border);border-radius:999px;background:var(--theme-track);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:background .25s ease,border-color .25s ease}
.theme-icon{position:relative;z-index:2;display:grid;place-items:center;width:28px;height:28px;color:var(--color-muted);transition:color .25s ease,transform .25s ease}
.theme-icon svg{width:16px;height:16px}
.theme-toggle-knob{position:absolute;z-index:1;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:var(--theme-knob);box-shadow:0 5px 16px rgba(0,0,0,.18);transition:transform .3s cubic-bezier(.2,.8,.2,1),background .25s ease}
html[data-theme="dark"] .theme-toggle-knob{transform:translateX(28px)}
html[data-theme="dark"] .theme-icon-moon{color:var(--color-accent-ink)}
html[data-theme="light"] .theme-icon-sun{color:#fff}
.mobile-header-actions{display:flex;align-items:center;gap:.55rem}
@media(min-width:1280px){.mobile-header-actions{display:none!important}}
.theme-toggle-mobile .theme-toggle-track{width:56px;grid-template-columns:25px 25px}
.theme-toggle-mobile .theme-icon{width:25px;height:28px}.theme-toggle-mobile .theme-toggle-knob{width:24px;height:24px;top:4px;left:4px}html[data-theme="dark"] .theme-toggle-mobile .theme-toggle-knob{transform:translateX(24px)}

/* Light-mode utility remapping for the existing Tailwind-heavy markup. */
html[data-theme="light"] body{background:var(--color-paper);color:var(--color-ink)}
html[data-theme="light"] section:not(.dusk-hero){background:var(--color-paper)!important}
html[data-theme="light"] .bg-\[\#040711\],
html[data-theme="light"] .bg-\[\#080d1d\],
html[data-theme="light"] .bg-\[\#090f20\]{background:var(--color-paper-3)!important}
html[data-theme="light"] .text-white{color:var(--color-ink)!important}
html[data-theme="light"] .text-slate-300{color:var(--color-ink-2)!important}
html[data-theme="light"] .text-slate-400,
html[data-theme="light"] .text-slate-500{color:var(--color-muted)!important}
html[data-theme="light"] .bg-white\/10,
html[data-theme="light"] .bg-white\/\[\.035\]{background:color-mix(in oklab,var(--color-ink) 4%,transparent)!important}
html[data-theme="light"] .border-white\/10,
html[data-theme="light"] .border-white\/15{border-color:var(--color-rule)!important}
html[data-theme="light"] footer{background:var(--footer-bg)!important}
html[data-theme="light"] .mobile-panel{background:var(--color-well)!important}
html[data-theme="light"] .mobile-panel .text-white{color:var(--color-ink)!important}
html[data-theme="light"] .mobile-panel .border-white\/10,
html[data-theme="light"] .mobile-panel .border-white\/15{border-color:var(--color-rule)!important}
html[data-theme="light"] .form-input{background:var(--color-card)!important}
html[data-theme="light"] .image-frame:after{background:linear-gradient(180deg,transparent 68%,rgba(24,27,38,.12))}

/* The dusk photograph remains the signature in both themes. The light theme
   simply breathes more fog/bone into it. */
html[data-theme="light"] .dusk-hero:after{background:radial-gradient(ellipse 58% 74% at 23% 50%,color-mix(in oklab,var(--color-fog) 92%,transparent) 0%,color-mix(in oklab,var(--color-fog) 67%,transparent) 50%,transparent 78%),linear-gradient(to bottom,rgba(255,255,255,.10) 0%,transparent 66%,var(--color-paper) 100%)}
html[data-theme="dark"] .dusk-hero:after{background:radial-gradient(ellipse 58% 74% at 23% 50%,rgba(232,231,226,.80) 0%,rgba(232,231,226,.54) 48%,rgba(16,18,25,.10) 77%),linear-gradient(to bottom,rgba(255,255,255,.02) 0%,transparent 65%,var(--color-paper) 100%)}
html[data-theme="dark"] .dusk-hero .hero-copy{color:oklch(20% .024 268)!important}
html[data-theme="dark"] .dusk-hero .hero-copy h1,
html[data-theme="dark"] .dusk-hero .hero-copy h2,
html[data-theme="dark"] .dusk-hero .hero-copy h3,
html[data-theme="dark"] .dusk-hero .hero-copy .text-white,
html[data-theme="dark"] .dusk-hero .hero-copy .metric{color:oklch(20% .024 268)!important}
html[data-theme="dark"] .dusk-hero .hero-copy p,
html[data-theme="dark"] .dusk-hero .hero-copy .kicker,
html[data-theme="dark"] .dusk-hero .hero-copy .text-slate-300,
html[data-theme="dark"] .dusk-hero .hero-copy .text-slate-400,
html[data-theme="dark"] .dusk-hero .hero-copy .text-slate-500{color:oklch(37% .022 266)!important}

@media(max-width:1279px){
  .site-header .shell{gap:.75rem}
  .brand-wrap{width:min(480px,58vw)}
}
@media(max-width:640px){
  .theme-toggle-track{width:56px;grid-template-columns:25px 25px}
  .theme-toggle .theme-icon{width:25px}
  .theme-toggle .theme-toggle-knob{width:24px;height:24px;top:4px;left:4px}
  html[data-theme="dark"] .theme-toggle .theme-toggle-knob{transform:translateX(24px)}
}

/* =========================================================
   Control rhythm / optical alignment pass
   Keeps all buttons, pills and navigation controls vertically centered.
   ========================================================= */
.btn-primary,
.btn-ghost{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.45rem;
  min-height:48px;
  padding-block:0!important;
  vertical-align:middle;
  line-height:1.1!important;
  text-align:center;
}
button.btn-primary,
button.btn-ghost{
  appearance:none;
  -webkit-appearance:none;
}
.site-header nav>.nav-link,
.nav-services-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  line-height:1.1!important;
  padding-block:0;
}
.nav-services{
  min-height:44px;
  align-items:center;
}
.nav-services-toggle svg{
  flex:0 0 auto;
  margin-top:1px;
}
.services-dropdown a{
  min-height:48px;
  line-height:1.25;
}
.service-index{
  line-height:1;
}
.dusk-hero .hero-copy span.rounded-full.border,
[data-filter]{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:36px;
  padding-top:0!important;
  padding-bottom:0!important;
  line-height:1.1!important;
  vertical-align:middle;
}
[data-filter]{
  min-height:38px;
}
.eyebrow{
  min-height:24px;
  align-items:center;
}
.theme-toggle,
.theme-toggle-track,
.theme-icon{
  vertical-align:middle;
}
#menuOpen,#menuClose{
  line-height:1!important;
}
.mobile-service-list a{
  display:flex;
  align-items:center;
  min-height:42px;
  padding-top:0;
  padding-bottom:0;
  line-height:1.2;
}
.faq-button{
  min-height:64px;
  align-items:center!important;
}
.faq-plus{
  display:inline-grid;
  place-items:center;
  width:30px;
  height:30px;
  line-height:1;
  flex:0 0 auto;
}

@media(max-width:640px){
  .btn-primary,.btn-ghost{min-height:46px}
  .dusk-hero .hero-copy span.rounded-full.border,[data-filter]{min-height:34px}
}

/* Theme-aware footer and mobile branding.
   Light surfaces use the navy mark; dark surfaces use the white mark. */
.footer-brand{position:relative;width:min(420px,100%);height:80px}
.footer-logo{position:absolute;inset:0 auto auto 0;height:80px;width:auto;max-width:100%;object-fit:contain;object-position:left center;transition:opacity .22s ease}
.footer-logo-for-light{opacity:0}
.footer-logo-for-dark{opacity:1}
html[data-theme="light"] .footer-logo-for-light{opacity:1}
html[data-theme="light"] .footer-logo-for-dark{opacity:0}
.mobile-brand{position:relative;width:min(320px,76vw);height:64px}
.mobile-brand-logo{position:absolute;left:0;top:50%;transform:translateY(-50%);height:56px;width:auto;max-width:100%;object-fit:contain;object-position:left center;transition:opacity .22s ease}
.mobile-logo-for-light{opacity:0}
.mobile-logo-for-dark{opacity:1}
html[data-theme="light"] .mobile-logo-for-light{opacity:1}
html[data-theme="light"] .mobile-logo-for-dark{opacity:0}
@media(max-width:640px){.footer-brand{height:64px}.footer-logo{height:64px}}

/* =========================================================
   Final production QA hardening
   ========================================================= */
.skip-link{position:fixed;left:1rem;top:.75rem;z-index:1000;transform:translateY(-160%);background:var(--color-accent);color:var(--color-accent-ink);padding:.7rem 1rem;border-radius:999px;font:600 14px/1 var(--font-body);box-shadow:0 10px 30px rgba(0,0,0,.22);transition:transform .18s ease}
.skip-link:focus{transform:translateY(0)}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}
.services-dropdown a:focus-visible{outline:2px solid var(--color-focus);outline-offset:-2px}
.site-header .brand-wrap:focus-visible,.footer-brand:focus-visible{outline:2px solid var(--color-focus);outline-offset:4px;border-radius:8px}
.footer-brand,.mobile-brand{isolation:isolate}
footer a{transition:color .18s ease,opacity .18s ease}
footer a:hover{color:var(--color-ink);opacity:1}
footer a[href^="mailto:"]{overflow-wrap:anywhere}
.dusk-attribution{font-size:10px;line-height:1.45;opacity:.72}
.dusk-attribution a{text-decoration:underline;text-underline-offset:2px}

/* Use a smaller Wikimedia rendition for the decorative dusk backdrop.
   GAL-4 remains a local fallback if the remote background is unavailable. */
.dusk-hero:before{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/1/12/Vishakapatnam_dusk_panorama.jpg/1280px-Vishakapatnam_dusk_panorama.jpg"),url("../images/GAL-4.jpg")}

/* Better compact-header fit around the xl breakpoint while retaining the large brand. */
@media(min-width:1280px){.brand-wrap{width:clamp(430px,30vw,540px);height:88px}.brand-logo{height:80px}}
@media(max-width:640px){.brand-wrap{width:min(250px,52vw);height:58px}.brand-logo{height:50px}.site-header .shell{min-height:72px!important}.mobile-header-actions{gap:.4rem}.photo-credit{display:none}.dusk-attribution{display:block;width:100%}}
@media(max-width:360px){.theme-toggle-mobile .theme-toggle-track{width:50px;grid-template-columns:22px 22px}.theme-toggle-mobile .theme-icon{width:22px}.theme-toggle-mobile .theme-toggle-knob{width:22px;height:22px;top:5px;left:4px}html[data-theme="dark"] .theme-toggle-mobile .theme-toggle-knob{transform:translateX(22px)}#menuOpen{width:40px!important;height:40px!important}.brand-wrap{width:50vw}.brand-logo{height:46px}}

/* Off-canvas menu should not intercept pointer events while closed. */
.mobile-panel{pointer-events:none;visibility:hidden}
.mobile-panel.open{pointer-events:auto;visibility:visible}

/* Prevent accidental layout shifts/overflow in long CTA labels and controls. */
.btn-primary,.btn-ghost{max-width:100%;white-space:normal;text-wrap:balance}
.site-header .btn-primary{white-space:nowrap}
.form-input{min-height:50px}
textarea.form-input{min-height:160px}
select.form-input{cursor:pointer}

@media(prefers-reduced-motion:reduce){.skip-link,.mobile-panel,.theme-toggle-knob,.faq-answer,.faq-plus{transition:none!important}}
.services-dropdown a.current{background:var(--color-card);color:var(--color-accent-deep)}
.mobile-service-list a.current{color:var(--color-accent);font-weight:600}
@media(max-width:640px){.brand-logo{width:100%!important;height:auto!important;max-height:50px}.mobile-brand-logo{width:100%!important;height:auto!important;max-height:56px}}
@media(max-width:360px){.mobile-brand-logo{width:100%!important;height:auto!important;max-height:52px}}