/* ============================================================
   Saideep Automation Solutions — design tokens
   ============================================================ */
:root{
  --ink:#0B1C2C;
  --ink-soft:#3A4C5C;
  --paper:#FFFFFF;
  --surface:#F5F8FB;
  --surface-deep:#EBF1F7;

  --blue-900:#042C53;
  --blue-800:#0C447C;
  --blue-700:#12518F;
  --blue-600:#185FA5;
  --blue-400:#00B0F0;
  --blue-200:#7DDAF8;
  --blue-100:#BDECFB;
  --blue-50:#E8F9FF;

  --amber-800:#8A6A00;
  --amber-600:#9A7800;
  --amber-500:#C5A900;
  --amber-400:#E0C000;
  --amber-300:#F2D400;
  --amber-100:#FFF09A;
  --amber-50:#FFFBE0;

  --radius-sm:4px;
  --radius:10px;
  --radius-lg:18px;

  --shadow-card: 0 1px 2px rgba(4,44,83,.06), 0 6px 20px rgba(4,44,83,.08);
  --container-max: 1200px;
}

/* ============================================================
   Base
   ============================================================ */
html{ scroll-behavior:smooth; }

body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-size:1rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,.display-font{
  font-family:'Barlow Semi Condensed', 'Inter', sans-serif;
  font-weight:600;
  letter-spacing:.2px;
  color:var(--blue-900);
  line-height:1.15;
}

h1{ font-weight:700; }

p{ color:var(--ink-soft); }

a{ color:var(--blue-600); text-decoration:none; }
a:hover{ color:var(--blue-800); }

.container-xl{
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:1.25rem;
}

section{ padding:5rem 0; }
@media (max-width:767.98px){ section{ padding:3.25rem 0; } }

.kicker{
  font-size:.8125rem;
  font-weight:600;
  color:var(--amber-600);
  text-transform:none;
  letter-spacing:.3px;
  margin-bottom:.5rem;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}
.kicker::before{
  content:"";
  width:22px;
  height:2px;
  background:var(--amber-500);
  display:inline-block;
}

.section-head{ max-width:640px; margin-bottom:2.75rem; }
.section-head.centered{ margin-inline:auto; text-align:center; }

.text-amber{ color:var(--amber-500) !important; }
.bg-surface{ background:var(--surface); }
.bg-navy{ background:var(--blue-900); }
.bg-blue-50{ background:var(--blue-50); }

/* Blueprint grid texture — nods to schematic drawings, used sparingly */
.blueprint{
  position:relative;
  background-color:var(--blue-900);
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:34px 34px;
}
.blueprint-light{
  background-color:var(--surface);
  background-image:
    linear-gradient(rgba(4,44,83,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(4,44,83,.05) 1px, transparent 1px);
  background-size:34px 34px;
}

/* ============================================================
   Buttons
   ============================================================ */
.btn{
  font-family:'Inter', sans-serif;
  font-weight:600;
  border-radius:var(--radius-sm);
  padding:.7rem 1.5rem;
  font-size:.95rem;
  border-width:1.5px;
}
.btn-amber{
  background:var(--amber-500);
  border-color:var(--amber-500);
  color:#241300;
}
.btn-amber:hover{
  background:var(--amber-400);
  border-color:var(--amber-400);
  color:#241300;
}
.btn-outline-light-line{
  border-color:rgba(255,255,255,.55);
  color:#fff;
}
.btn-outline-light-line:hover{
  background:rgba(255,255,255,.1);
  border-color:#fff;
  color:#fff;
}
.btn-navy{
  background:var(--blue-800);
  border-color:var(--blue-800);
  color:#fff;
}
.btn-navy:hover{
  background:var(--blue-900);
  border-color:var(--blue-900);
  color:#fff;
}
.btn-outline-navy{
  border-color:var(--blue-700);
  color:var(--blue-800);
}
.btn-outline-navy:hover{
  background:var(--blue-800);
  color:#fff;
}

/* ============================================================
   Navbar
   ============================================================ */
.navbar-sas{
  background:var(--paper);
  padding:.85rem 0;
  border-bottom:1px solid rgba(4,44,83,.08);
  transition:box-shadow .2s ease, padding .2s ease;
}
.navbar-sas.is-scrolled{
  box-shadow:0 4px 20px rgba(4,44,83,.09);
  padding:.55rem 0;
}
.navbar-brand-sas{
  display:flex;
  align-items:center;
  gap:.65rem;
}
.navbar-brand-sas img{ height:42px; width:auto; }
.navbar-brand-sas .brand-text{
  font-family:'Barlow Semi Condensed', sans-serif;
  line-height:1.05;
}
.navbar-brand-sas .brand-text strong{
  display:block;
  font-size:1.2rem;
  font-weight:700;
  color:var(--blue-900);
}
.navbar-brand-sas .brand-text span{
  display:block;
  font-size:.68rem;
  color:var(--amber-600);
  font-weight:600;
  letter-spacing:.3px;
}
.navbar-sas .nav-link{
  font-weight:500;
  color:var(--ink);
  padding:.5rem 1rem !important;
  font-size:.95rem;
}
.navbar-sas .nav-link.active,
.navbar-sas .nav-link:hover{ color:var(--blue-700); }
.navbar-sas .nav-cta{
  margin-left:.5rem;
}

/* ============================================================
   Hero
   ============================================================ */
.hero{
  position:relative;
  background:var(--blue-900);
  color:#fff;
  overflow:hidden;
  padding:4.5rem 0 5.5rem;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:36px 36px;
  pointer-events:none;
}
.hero .row{ position:relative; z-index:1; }
.hero h1{
  color:#fff;
  font-size:clamp(2.1rem, 4vw, 3.4rem);
  max-width:620px;
}
.hero p.lead{
  color:var(--blue-100);
  max-width:520px;
  font-size:1.1rem;
}
.hero-eyebrow{
  color:var(--amber-300);
  font-weight:600;
  font-size:.85rem;
  letter-spacing:.4px;
  margin-bottom:.85rem;
  display:block;
}
.hero-media{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.hero-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-stats{
  position:relative;
  z-index:2;
  margin-top:-3.25rem;
}
.hero-stats .stat-card{
  background:#fff;
  border-radius:var(--radius);
  box-shadow:var(--shadow-card);
  padding:1.5rem 1rem;
  text-align:center;
}
.hero-stats .stat-card .num{
  font-family:'Barlow Semi Condensed', sans-serif;
  font-size:2.1rem;
  font-weight:700;
  color:var(--blue-800);
  display:block;
}
.hero-stats .stat-card .label{
  font-size:.82rem;
  color:var(--ink-soft);
}

/* Page header (non-home hero) */
.page-header{
  background:var(--blue-900);
  color:#fff;
  padding:3.5rem 0 3rem;
  position:relative;
  overflow:hidden;
}
.page-header::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:36px 36px;
}
.page-header .container-xl{ position:relative; z-index:1; }
.page-header h1{ color:#fff; margin-bottom:.5rem; }
.page-header p{ color:var(--blue-100); max-width:640px; margin-bottom:0; }
.breadcrumb-sas{
  font-size:.85rem;
  color:var(--blue-200);
  margin-bottom:1rem;
}
.breadcrumb-sas a{ color:var(--blue-200); }
.breadcrumb-sas a:hover{ color:#fff; }

/* ============================================================
   Cards
   ============================================================ */
.service-card{
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  padding:1.75rem 1.5rem;
  height:100%;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.service-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-card);
  border-color:transparent;
}
.service-card .icon-badge{
  width:52px; height:52px;
  border-radius:var(--radius-sm);
  background:var(--blue-50);
  color:var(--blue-700);
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem;
  margin-bottom:1.1rem;
}
.service-card h3{ font-size:1.2rem; margin-bottom:.5rem; }
.service-card p{ font-size:.93rem; margin-bottom:0; }

.project-card{
  background:#fff;
  border-radius:var(--radius);
  border:1px solid rgba(4,44,83,.08);
  padding:1.6rem;
  height:100%;
}
.project-card .platform-tag{
  display:inline-block;
  font-size:.72rem;
  font-weight:600;
  padding:.25rem .6rem;
  border-radius:100px;
  background:var(--amber-50);
  color:var(--amber-600);
  margin-bottom:.75rem;
}
.project-card h3{ font-size:1.05rem; margin-bottom:.4rem; }
.project-card .client{ font-size:.85rem; color:var(--blue-700); font-weight:600; margin-bottom:.5rem; }
.project-card p{ font-size:.9rem; margin-bottom:0; }

.value-card{
  text-align:left;
  padding:1.5rem;
}
.value-card .num{
  font-family:'Barlow Semi Condensed', sans-serif;
  font-size:1.6rem;
  font-weight:700;
  color:var(--amber-500);
}

/* Gallery */
.gallery-item{
  position:relative;
  border-radius:var(--radius-sm);
  overflow:hidden;
  aspect-ratio: 4/3;
  background:var(--surface-deep);
  cursor:zoom-in;
}
.gallery-item img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .35s ease;
}
.gallery-item:hover img{ transform:scale(1.06); }
.gallery-item .tag{
  position:absolute; left:.6rem; bottom:.6rem;
  background:rgba(4,28,44,.75);
  color:#fff;
  font-size:.72rem;
  padding:.2rem .55rem;
  border-radius:100px;
}
.filter-pills .btn{
  border-radius:100px;
  font-size:.85rem;
  padding:.4rem 1.1rem;
  font-weight:500;
}

/* Client logo grid */
.client-logo{
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center;
  padding:1.1rem;
  height:96px;
}
.client-logo img{
  max-width:100%; max-height:100%;
  object-fit:contain;
  transition:transform .2s ease;
}
.client-logo:hover img{ transform:scale(1.05); }

/* Brand strip */
.brand-strip{
  display:flex; align-items:center; justify-content:center;
  height:60px;
}
.brand-strip img{
  max-height:38px; max-width:100%;
  object-fit:contain;
}

/* Testimonial */
.testimonial-card{
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  padding:1.9rem;
  height:100%;
}
.testimonial-card .quote-mark{
  font-family:'Barlow Semi Condensed', sans-serif;
  font-size:2.6rem;
  color:var(--amber-300);
  line-height:1;
  display:block;
  margin-bottom:.25rem;
}
.testimonial-card p.quote{
  font-size:.98rem;
  color:var(--ink);
  margin-bottom:1.1rem;
}
.testimonial-card .who{ font-size:.85rem; }
.testimonial-card .who strong{ display:block; color:var(--blue-900); }
.testimonial-card .who span{ color:var(--ink-soft); }

/* Applications table */
.app-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:.92rem;
}
.app-table th{
  background:var(--blue-900);
  color:#fff;
  font-weight:600;
  padding:.75rem 1rem;
  text-align:left;
  font-family:'Barlow Semi Condensed', sans-serif;
  letter-spacing:.2px;
}
.app-table th:first-child{ border-top-left-radius:var(--radius-sm); }
.app-table th:last-child{ border-top-right-radius:var(--radius-sm); }
.app-table td{
  padding:.65rem 1rem;
  border-bottom:1px solid rgba(4,44,83,.08);
  color:var(--ink-soft);
}
.app-table tr:hover td{ background:var(--blue-50); }

/* CTA banner */
.cta-banner{
  background:var(--blue-800);
  border-radius:var(--radius-lg);
  padding:3rem;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.cta-banner::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:30px 30px;
}
.cta-banner *{ position:relative; z-index:1; }
.cta-banner h2{ color:#fff; }
.cta-banner p{ color:var(--blue-100); }

/* Timeline (about) */
.mini-fact{
  border-left:2px solid var(--amber-400);
  padding-left:1rem;
}

/* ============================================================
   Footer
   ============================================================ */
.footer-sas{
  background:var(--blue-900);
  color:var(--blue-100);
  padding:4rem 0 0;
}
.footer-sas h5{
  color:#fff;
  font-size:1rem;
  margin-bottom:1.1rem;
}
.footer-sas a{ color:var(--blue-100); }
.footer-sas a:hover{ color:var(--amber-300); }
.footer-sas ul{ list-style:none; padding:0; margin:0; }
.footer-sas li{ margin-bottom:.6rem; font-size:.92rem; }
.footer-sas .footer-brand{
  display:flex; align-items:center; gap:.65rem; margin-bottom:1rem;
}
.footer-sas .footer-brand img{ height:38px; }
.footer-sas .footer-brand strong{
  font-family:'Barlow Semi Condensed', sans-serif;
  color:#fff; font-size:1.15rem; display:block;
}
.footer-sas .footer-brand span{ font-size:.7rem; color:var(--amber-300); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:2.5rem;
  padding:1.25rem 0;
  font-size:.82rem;
  color:var(--blue-200);
}
.social-dot{
  width:36px; height:36px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff;
  margin-right:.5rem;
}
.social-dot:hover{ background:var(--amber-500); border-color:var(--amber-500); color:#241300; }

/* ============================================================
   Contact page
   ============================================================ */
.contact-card{
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  padding:1.5rem;
  height:100%;
}
.contact-card .icon-badge{
  width:46px; height:46px;
  border-radius:50%;
  background:var(--amber-50);
  color:var(--amber-600);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.9rem;
  font-size:1.2rem;
}
.form-control, .form-select{
  border-radius:var(--radius-sm);
  border-color:rgba(4,44,83,.18);
  padding:.65rem .9rem;
  font-size:.95rem;
}
.form-control:focus, .form-select:focus{
  border-color:var(--blue-500);
  box-shadow:0 0 0 .2rem rgba(24,95,165,.15);
}
.form-label{ font-size:.88rem; font-weight:600; color:var(--blue-900); }
.map-frame{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(4,44,83,.08);
  height:100%;
  min-height:320px;
}
.map-frame iframe{ width:100%; height:100%; min-height:320px; border:0; display:block; }

/* Lightbox */
.lightbox-overlay{
  position:fixed; inset:0;
  background:rgba(4,20,32,.92);
  display:none;
  align-items:center; justify-content:center;
  z-index:2000;
  padding:2rem;
}
.lightbox-overlay.active{ display:flex; }
.lightbox-overlay img{
  max-width:100%; max-height:88vh;
  border-radius:var(--radius-sm);
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.lightbox-close{
  position:absolute; top:1.5rem; right:1.75rem;
  color:#fff; font-size:2rem; cursor:pointer; line-height:1;
  background:none; border:0;
}

/* Back to top */
.back-to-top{
  position:fixed;
  right:1.25rem; bottom:1.25rem;
  width:44px; height:44px;
  border-radius:50%;
  background:var(--blue-800);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(4,44,83,.3);
  opacity:0; visibility:hidden;
  transform:translateY(10px);
  transition:all .2s ease;
  z-index:999;
  border:0;
}
.back-to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover{ background:var(--amber-500); color:#241300; }

/* Utilities */
.divider-amber{
  width:56px; height:3px;
  background:var(--amber-500);
  margin:1rem 0 1.5rem;
}
.text-navy{ color:var(--blue-900) !important; }
.text-soft{ color:var(--ink-soft) !important; }
.fw-600{ font-weight:600; }

/* ============================================================
   Motion system — scroll reveals, marquee, micro-interactions
   ============================================================ */

/* Page fade-in on load — pure CSS so it still works if JS is blocked */
@keyframes pageFadeIn{ from{ opacity:0; } to{ opacity:1; } }
body{ animation:pageFadeIn .5s ease both; }

/* Scroll-reveal (progressive enhancement — only hides content once JS is ready) */
body.js-reveal-ready .reveal-target{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .65s cubic-bezier(.16,.8,.3,1), transform .65s cubic-bezier(.16,.8,.3,1);
  will-change:opacity, transform;
}
body.js-reveal-ready .reveal-target.in-view{
  opacity:1;
  transform:none;
}

/* Keyframes */
@keyframes floatY{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}
@keyframes pulseRing{
  0%{ box-shadow:0 0 0 0 rgba(186,117,23,.45); }
  70%{ box-shadow:0 0 0 14px rgba(186,117,23,0); }
  100%{ box-shadow:0 0 0 0 rgba(186,117,23,0); }
}
@keyframes marqueeScroll{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-50%); }
}
@keyframes gridDrift{
  0%{ background-position:0 0, 0 0; }
  100%{ background-position:120px 0, 0 120px; }
}
@keyframes fadeScaleIn{
  from{ opacity:0; transform:scale(.94); }
  to{ opacity:1; transform:scale(1); }
}
@keyframes shimmer{
  0%{ background-position:-200% 0; }
  100%{ background-position:200% 0; }
}

/* Hero media gentle float */
.hero-media{ animation:floatY 6s ease-in-out infinite; }

/* Blueprint texture drifts very slowly — subtle "live schematic" feel */
.hero::after, .page-header::after, .cta-banner::after{
  animation:gridDrift 22s linear infinite;
}

/* Hero eyebrow / heading staggered entrance (runs once on load, not scroll-based) */
.hero-eyebrow, .hero h1, .hero p.lead, .hero .d-flex.gap-3{
  opacity:0;
  animation:fadeScaleIn .7s cubic-bezier(.16,.8,.3,1) forwards;
}
.hero-eyebrow{ animation-delay:.05s; }
.hero h1{ animation-delay:.16s; }
.hero p.lead{ animation-delay:.28s; }
.hero .d-flex.gap-3{ animation-delay:.4s; }

/* Primary CTA pulse ring — used sparingly on hero / banner buttons */
.btn-amber.btn-lg.pulse-cta{ animation:pulseRing 2.6s ease-out infinite; }

/* Buttons: subtle lift + shine on hover */
.btn{ position:relative; overflow:hidden; transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease; }
.btn:hover{ transform:translateY(-2px); }
.btn-amber:hover, .btn-navy:hover{ box-shadow:0 10px 24px rgba(4,44,83,.22); }

/* Cards: stronger, springier hover lift */
.service-card, .project-card, .value-card.service-card, .contact-card, .testimonial-card{
  transition:transform .28s cubic-bezier(.16,.8,.3,1), box-shadow .28s ease, border-color .28s ease;
}
.service-card:hover, .project-card:hover, .contact-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 34px rgba(4,44,83,.14);
  border-color:transparent;
}
.service-card .icon-badge{ transition:transform .3s cubic-bezier(.34,1.56,.64,1), background-color .3s ease, color .3s ease; }
.service-card:hover .icon-badge{
  transform:scale(1.12) rotate(-6deg);
  background:var(--amber-500);
  color:#fff;
}
.contact-card .icon-badge{ transition:transform .3s cubic-bezier(.34,1.56,.64,1); }
.contact-card:hover .icon-badge{ transform:scale(1.12) rotate(6deg); }

/* Project card platform tag: gentle pop on card hover */
.project-card .platform-tag{ transition:transform .25s ease, background-color .25s ease, color .25s ease; }
.project-card:hover .platform-tag{ background:var(--amber-500); color:#fff; transform:translateY(-1px); }

/* Stat cards: pop-in handled by reveal-target; add hover tilt */
.stat-card{ transition:transform .25s ease, box-shadow .25s ease; }
.stat-card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(4,44,83,.16); }
.stat-card .num{ font-variant-numeric:tabular-nums; }

/* Gallery: zoom + overlay affordance */
.gallery-item{ transition:box-shadow .25s ease; }
.gallery-item::after{
  content:"\1F50D"; /* magnifying-glass emoji — renders via system font, no icon-font dependency */
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1.7rem;
  background:rgba(4,44,83,0);
  opacity:0;
  transition:opacity .25s ease, background-color .25s ease;
  pointer-events:none;
}
.gallery-item:hover::after{ opacity:1; background:rgba(4,20,32,.28); }
.gallery-item:hover{ box-shadow:0 14px 30px rgba(4,44,83,.22); }

/* Client logos: lift + color on hover (kept, refined) */
.client-logo{ transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.client-logo:hover{ transform:translateY(-3px); box-shadow:0 10px 22px rgba(4,44,83,.12); border-color:transparent; }

/* Nav link animated underline */
.navbar-sas .nav-link{ position:relative; }
.navbar-sas .nav-link::after{
  content:"";
  position:absolute; left:1rem; right:1rem; bottom:.25rem;
  height:2px; background:var(--amber-500);
  transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.navbar-sas .nav-link:hover::after,
.navbar-sas .nav-link.active::after{ transform:scaleX(1); }

/* Logo mark: tiny idle flicker to suggest the "flame" — very subtle, slow */
@keyframes flameFlicker{
  0%,100%{ filter:brightness(1); }
  50%{ filter:brightness(1.08); }
}
.navbar-brand-sas img, .footer-brand img{ animation:flameFlicker 3.2s ease-in-out infinite; }

/* ============================================================
   Marquee (auto-scrolling logo strip)
   ============================================================ */
.marquee{
  overflow:hidden;
  position:relative;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee-track{
  display:flex;
  align-items:center;
  gap:3.5rem;
  width:max-content;
  animation:marqueeScroll 32s linear infinite;
}
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-track .brand-strip,
.marquee-track .client-logo{ flex:0 0 auto; }
.marquee-track .brand-strip{ width:140px; }
.marquee-track .client-logo{ width:150px; }

/* ============================================================
   Testimonial carousel refinements
   ============================================================ */
.testimonial-carousel .carousel-inner{ padding:.5rem .25rem 2.5rem; }
.testimonial-carousel .carousel-indicators{ bottom:-.5rem; }
.testimonial-carousel .carousel-indicators button{
  width:8px; height:8px; border-radius:50%;
  background-color:var(--blue-200);
  opacity:1; border:0; margin:0 4px;
}
.testimonial-carousel .carousel-indicators button.active{ background-color:var(--amber-500); }
.testimonial-carousel .carousel-control-prev,
.testimonial-carousel .carousel-control-next{
  width:44px; height:44px; top:40%; border-radius:50%;
  background:#fff; box-shadow:var(--shadow-card); opacity:1;
}
.testimonial-carousel .carousel-control-prev{ left:-12px; }
.testimonial-carousel .carousel-control-next{ right:-12px; }
.testimonial-carousel .carousel-control-prev-icon,
.testimonial-carousel .carousel-control-next-icon{ filter:invert(20%) sepia(60%) saturate(900%) hue-rotate(180deg); width:1rem; height:1rem; }

@media (max-width:767.98px){
  .testimonial-carousel .carousel-control-prev,
  .testimonial-carousel .carousel-control-next{ display:none; }
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce){
  .hero-media, .hero::after, .page-header::after, .cta-banner::after,
  .hero-eyebrow, .hero h1, .hero p.lead, .hero .d-flex.gap-3,
  .btn-amber.btn-lg.pulse-cta, .marquee-track, .navbar-brand-sas img, .footer-brand img{
    animation:none !important;
  }
  body.js-reveal-ready .reveal-target{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
}

/* ============================================================
   Navbar dropdown (Achievements)
   ============================================================ */
.navbar-sas .dropdown-menu{
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  box-shadow:0 16px 34px rgba(4,44,83,.16);
  padding:.5rem;
  margin-top:.5rem;
}
.navbar-sas .dropdown-item{
  border-radius:6px;
  padding:.55rem .8rem;
  font-size:.92rem;
  color:var(--ink);
  transition:background-color .15s ease, color .15s ease;
}
.navbar-sas .dropdown-item:hover,
.navbar-sas .dropdown-item:focus{
  background:var(--blue-50);
  color:var(--blue-800);
}
.navbar-sas .dropdown-item.active{
  background:var(--blue-800);
  color:#fff;
}
.navbar-sas .dropdown-toggle::after{ vertical-align:.15em; }

/* ============================================================
   Panel-type info sections (Panels / Gallery page)
   ============================================================ */
.panel-type-section:nth-of-type(even){ background:var(--surface); }
.panel-type-head{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:.75rem;
  margin-bottom:1.75rem;
}
.panel-type-head .icon-badge{
  width:56px; height:56px;
  font-size:1.6rem;
  flex-shrink:0;
}
.panel-spec-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:.6rem .5rem;
}
.panel-spec-list li{
  font-size:.9rem;
  color:var(--ink-soft);
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  padding:.4rem .6rem;
  background:#fff;
  border:1px solid rgba(4,44,83,.07);
  border-radius:var(--radius-sm);
}
.panel-type-section:nth-of-type(even) .panel-spec-list li{ background:var(--paper); }
.panel-spec-list li i{ color:var(--amber-500); margin-top:.15rem; }

.no-photo-note{
  border:1.5px dashed var(--blue-200);
  border-radius:var(--radius);
  padding:1.25rem 1.5rem;
  background:var(--blue-50);
  color:var(--blue-800);
  font-size:.92rem;
}

/* ============================================================
   Achievements & Certifications pages
   ============================================================ */
.achievement-stat{
  text-align:center;
  padding:1.75rem 1rem;
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  height:100%;
}
.achievement-stat .num{
  font-family:'Barlow Semi Condensed', sans-serif;
  font-size:2.4rem;
  font-weight:700;
  color:var(--blue-800);
  display:block;
}
.achievement-stat .label{ font-size:.88rem; color:var(--ink-soft); }

.cert-card{
  background:#fff;
  border:1px solid rgba(4,44,83,.08);
  border-radius:var(--radius);
  padding:1.6rem;
  height:100%;
}
.cert-card .icon-badge{ width:50px; height:50px; }
.cert-status{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-size:.78rem;
  font-weight:600;
  padding:.25rem .65rem;
  border-radius:100px;
  background:var(--amber-50);
  color:var(--amber-600);
  margin-bottom:.75rem;
}

.client-name{text-align:center;font-size:.78rem;font-weight:600;color:var(--blue-800);line-height:1.25;margin-top:.45rem;min-height:2.1em;}
.clients-grid .client-name{white-space:nowrap;}


/* ============================================================
   Achievements dropdown — open on hover on desktop
   ============================================================ */
@media (min-width: 992px){
  .navbar-sas .nav-item.dropdown{
    position: relative;
  }

  .navbar-sas .nav-item.dropdown:hover > .dropdown-menu,
  .navbar-sas .nav-item.dropdown:focus-within > .dropdown-menu{
    display: block;
    margin-top: 0;
  }

  .navbar-sas .nav-item.dropdown:hover > .dropdown-toggle::after{
    transform: rotate(180deg);
  }
}

/* The dropdown parent should use the same amber hover color as other links. */
.navbar-sas .dropdown-toggle:hover,
.navbar-sas .dropdown-toggle.active:hover{
  color: var(--amber-600) !important;
}

/* ============================================================
   Final Achievements hover dropdown refinement
   ============================================================ */
@media (min-width: 992px){
  .navbar-sas .nav-item.dropdown{
    position: relative;
    isolation: isolate;
  }

  /* Keep the dropdown directly below Achievements and hidden until hover. */
  .navbar-sas .nav-item.dropdown > .dropdown-menu{
    display: block;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 8px);
    min-width: 245px;
    margin: 0 !important;
    padding: .45rem;
    background: #fff;
    border: 1px solid rgba(4, 44, 83, .12);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(4, 44, 83, .16);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  }

  .navbar-sas .nav-item.dropdown:hover > .dropdown-menu,
  .navbar-sas .nav-item.dropdown:focus-within > .dropdown-menu{
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, 0);
  }

  /* Do not give the dropdown parent a brown background. */
  .navbar-sas .nav-item.dropdown > .dropdown-toggle,
  .navbar-sas .nav-item.dropdown > .dropdown-toggle.active{
    background: transparent !important;
  }

  .navbar-sas .nav-item.dropdown > .dropdown-toggle:hover,
  .navbar-sas .nav-item.dropdown:hover > .dropdown-toggle,
  .navbar-sas .nav-item.dropdown:hover > .dropdown-toggle.active{
    color: #d88916 !important;
  }

  .navbar-sas .dropdown-menu .dropdown-item,
  .navbar-sas .dropdown-menu .dropdown-item.active{
    display: block;
    width: 100%;
    background: transparent !important;
    color: var(--ink) !important;
    border-radius: 6px;
  }

  .navbar-sas .dropdown-menu .dropdown-item:hover,
  .navbar-sas .dropdown-menu .dropdown-item:focus{
    background: #fff7e9 !important;
    color: #c8750d !important;
  }
}

/* ============================================================
   Achievements navigation hover — match Panels styling
   ============================================================ */
.navbar-sas .nav-item.dropdown > .dropdown-toggle:hover,
.navbar-sas .nav-item.dropdown:hover > .dropdown-toggle,
.navbar-sas .nav-item.dropdown:hover > .dropdown-toggle.active,
.navbar-sas .nav-item.dropdown > .dropdown-toggle.active:hover {
  color: var(--blue-700) !important;
  background: transparent !important;
}

.navbar-sas .nav-item.dropdown > .dropdown-toggle:hover::after,
.navbar-sas .nav-item.dropdown:hover > .dropdown-toggle::after,
.navbar-sas .nav-item.dropdown > .dropdown-toggle.active:hover::after {
  transform: scaleX(1) !important;
}

/* Keep the dropdown itself clean and separate from the nav-link hover style. */
@media (min-width: 992px) {
  .navbar-sas .nav-item.dropdown > .dropdown-menu {
    left: 0;
    transform: translateY(8px);
  }

  .navbar-sas .nav-item.dropdown:hover > .dropdown-menu,
  .navbar-sas .nav-item.dropdown:focus-within > .dropdown-menu {
    transform: translateY(0);
  }
}
/* ==========================================================
   MODERN INDUSTRIAL HOMEPAGE REDESIGN
   ========================================================== */
:root{--modern-navy:#081a2b;--modern-blue:#102c43;--modern-orange:#f28c28;--modern-light:#f1f5f8;--modern-ink:#172b3a}
body{font-family:'Inter',sans-serif;color:var(--modern-ink);background:#fff}.navbar-sas{background:rgba(255,255,255,.97);backdrop-filter:blur(12px)}
.new-hero{margin-top:74px;min-height:650px;padding:90px 0 105px;background:linear-gradient(125deg,#071827 0%,#0b2940 58%,#123b55 100%);color:#fff;position:relative;overflow:hidden}.hero-grid{position:absolute;inset:0;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.35) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent 85%)}.new-hero h1{font-size:clamp(3rem,5.3vw,5.4rem);line-height:.98;letter-spacing:-2px;font-weight:800;margin:18px 0 25px}.new-hero h1 em{font-style:normal;color:#f6a04a}.hero-eyebrow,.section-kicker{font-size:.75rem;letter-spacing:2px;font-weight:800;color:var(--modern-orange)}.hero-eyebrow span{display:inline-block;width:28px;height:2px;background:var(--modern-orange);vertical-align:middle;margin-right:8px}.hero-copy{max-width:530px;color:#c4d3df;font-size:1.08rem;line-height:1.8}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:32px}.hero-text-link,.link-arrow{color:inherit;text-decoration:none;font-weight:700}.hero-text-link:hover,.link-arrow:hover{color:var(--modern-orange)}.hero-trust{margin-top:48px;color:#8fa9ba;font-size:.78rem;display:flex;gap:10px;align-items:center}.hero-trust i{color:var(--modern-orange);font-size:1.2rem}.hero-visual{position:relative;min-height:450px}.visual-frame{position:absolute;right:0;top:0;width:88%;height:410px;border:1px solid rgba(255,255,255,.2);padding:12px;transform:rotate(2deg);background:rgba(255,255,255,.04);box-shadow:0 30px 70px rgba(0,0,0,.35)}.visual-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}.visual-tag{position:absolute;bottom:8px;left:0;background:#fff;color:var(--modern-ink);padding:18px 22px;display:flex;gap:14px;align-items:center;box-shadow:0 15px 35px rgba(0,0,0,.25)}.visual-tag i{font-size:1.7rem;color:var(--modern-orange)}.visual-tag strong,.visual-tag small{display:block}.visual-tag small{font-size:.72rem;color:#6a7b87;margin-top:3px}.visual-orbit{position:absolute;width:150px;height:150px;border:1px solid rgba(242,140,40,.55);border-radius:50%;right:-45px;bottom:15px}.stats-ribbon{background:var(--modern-orange);color:#fff}.stat-modern{padding:26px 20px;border-right:1px solid rgba(255,255,255,.25);text-align:center}.stat-modern:last-child{border:0}.stat-modern strong{display:block;font-size:2.2rem;font-weight:800}.stat-modern strong span{font-size:1.3rem}.stat-modern small{font-size:.75rem;letter-spacing:.5px;text-transform:uppercase;opacity:.9}.section-modern{padding:105px 0}.image-stack{height:450px;position:relative}.shot-frame{overflow:hidden}.shot-frame-main{width:78%;height:390px}.shot-frame-small{position:absolute;width:45%;height:190px;right:0;bottom:0;border:12px solid #fff}.main-shot,.small-shot{width:100%;height:100%;object-fit:cover;display:block}.image-label{position:absolute;left:0;bottom:24px;background:var(--modern-navy);color:#fff;padding:12px 18px;font-size:.65rem;letter-spacing:1.5px;font-weight:700}.about-modern h2,.expertise-section h2,.applications-section h2,.cta-modern h2{font-size:clamp(2.1rem,3.6vw,3.5rem);line-height:1.08;font-weight:800;letter-spacing:-1.5px;margin:15px 0 25px}.about-modern p{color:#637480;line-height:1.8}.large-copy{font-size:1.12rem;color:var(--modern-ink)!important}.solutions-section{padding:100px 0;background:var(--modern-navy);color:#fff}.section-kicker.light{color:#f6a04a}.section-heading-row{display:flex;justify-content:space-between;align-items:end;margin-bottom:42px}.solutions-section h2{font-size:clamp(2.1rem,3.5vw,3.4rem);max-width:650px;line-height:1.1;margin-top:15px}.outline-light-link{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:8px}.solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.solution-card{color:#fff;text-decoration:none;padding:28px 24px;min-height:330px;background:linear-gradient(145deg,#12334b,#0d2538);border:1px solid rgba(255,255,255,.1);position:relative;transition:.3s}.solution-card:hover{transform:translateY(-8px);border-color:var(--modern-orange);color:#fff}.solution-feature{background:linear-gradient(145deg,#f28c28,#c9670f)}.solution-number{font-size:.72rem;opacity:.65;position:absolute;top:22px;right:22px}.solution-card i{font-size:2rem;color:#f6a04a;margin-top:35px;display:block}.solution-feature i{color:#fff}.solution-card h3{font-size:1.35rem;margin:25px 0 15px}.solution-card p{color:#a9bfcc;font-size:.88rem;line-height:1.7}.solution-feature p{color:#fff}.solution-card span{position:absolute;bottom:25px;font-size:.75rem;font-weight:700}.solution-card span i{font-size:.9rem;display:inline;margin:0 0 0 5px}.expertise-section{padding:105px 0;background:#fff}.expertise-section h2 span{color:#2f80ed}.expertise-section> .container-xl> .row> .col-lg-5>p{color:#667985;line-height:1.8;max-width:440px}.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.tech-card{padding:28px;background:var(--modern-light);min-height:220px;border-left:3px solid transparent;transition:.3s}.tech-card:hover{border-color:var(--modern-orange);transform:translateY(-4px)}.tech-card small{float:right;color:#9aabb5}.tech-card i{font-size:1.7rem;color:#2f80ed}.tech-card h3{font-size:1.15rem;margin:20px 0 12px}.tech-card p{font-size:.82rem;line-height:1.7;color:#657783}.applications-section{padding:90px 0;background:#e8eef2}.applications-section p{color:#657783;line-height:1.7}.application-pills{display:flex;flex-wrap:wrap;gap:12px}.application-pills span{background:#fff;padding:17px 22px;font-weight:700;font-size:.85rem;border:1px solid #d9e2e7;transition:.2s}.application-pills span:hover{background:var(--modern-navy);color:#fff;border-color:var(--modern-navy)}.cta-modern{padding:35px 0;background:#e8eef2}.cta-inner{background:linear-gradient(120deg,#0b263b,#123f5a);padding:55px 65px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:30px;position:relative;overflow:hidden}.cta-inner:after{content:'';position:absolute;width:300px;height:300px;border:1px solid rgba(242,140,40,.3);border-radius:50%;right:-100px;top:-130px}.cta-modern h2{margin:12px 0 10px}.cta-modern p{color:#b7cad6;margin:0}.footer-sas{background:#071522;color:#a7bbc7;padding:65px 0 0}.footer-sas h3{color:#fff}.footer-sas strong{color:#fff}.footer-sas p{line-height:1.8;font-size:.85rem}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:35px;padding:20px 0;font-size:.75rem}
@media(max-width:991px){.new-hero{padding:65px 0 85px}.hero-visual{min-height:400px}.solution-grid{grid-template-columns:1fr 1fr}.section-heading-row{display:block}.outline-light-link{display:inline-block;margin-top:20px}.navbar-sas .nav-link{padding:.55rem 0!important}.nav-cta{margin-left:0!important;margin-top:10px}.cta-inner{padding:40px 30px;display:block}.cta-inner .btn{margin-top:25px}}@media(max-width:575px){.new-hero h1{font-size:3.1rem}.hero-actions{display:block}.hero-text-link{display:inline-block;margin-top:22px}.hero-visual{min-height:330px}.visual-frame{height:300px;width:92%}.visual-tag{padding:12px;bottom:0}.image-stack{height:350px}.shot-frame-main{height:300px}.shot-frame-small{height:145px}.solution-grid,.tech-grid{grid-template-columns:1fr}.solution-card{min-height:270px}.stat-modern{padding:20px 8px}.stat-modern strong{font-size:1.7rem}.stat-modern small{font-size:.62rem}.cta-inner{padding:32px 22px}}


/* Logo-contrast palette: based on the SAS logo's cyan, yellow and white */
.site-header, header { background:#FFFFFF; }
.site-header .brand img, header .brand img, .navbar-brand img { background:transparent; }
.hero, .hero-section, .page-hero { background:linear-gradient(135deg,#061B33 0%,#0B3558 65%,#006B91 100%); }
.btn-primary, .button-primary { background:#00B0F0; border-color:#00B0F0; color:#061B33; }
.btn-primary:hover, .button-primary:hover { background:#F2D400; border-color:#F2D400; color:#061B33; }
.section-label, .kicker, .eyebrow { color:#B08C00; }

/* ============================================================
   Final visual refinement — stronger contrast and navigation states
   ============================================================ */
:root{
  --ink:#163047;
  --ink-soft:#536B7D;
  --heading:#062C50;
  --accent-cyan:#00A9E8;
  --accent-yellow:#E3BE00;
}

body{ color:var(--ink); background:#fff; }
h1,h2,h3,h4,h5,h6{ color:var(--heading); }
p{ color:var(--ink-soft); }

/* Make the navigation readable, polished and consistent. */
.navbar-sas .nav-link,
.navbar-sas .dropdown-toggle{
  color:#163047 !important;
  font-weight:600;
  transition:color .2s ease;
}
.navbar-sas .nav-link:hover,
.navbar-sas .nav-link:focus,
.navbar-sas .nav-link.active,
.navbar-sas .dropdown-toggle:hover,
.navbar-sas .dropdown-toggle:focus,
.navbar-sas .dropdown-toggle.active{
  color:#145D95 !important;
}
.navbar-sas .nav-link::after{
  background:#E3BE00;
  height:3px;
  border-radius:3px;
  bottom:.12rem;
}
/* The Achievements parent gets exactly the same active/hover treatment as Projects. */
.navbar-sas .nav-item.dropdown > .dropdown-toggle::after{
  border-top-color:currentColor;
}
.navbar-sas .nav-item.dropdown > .dropdown-toggle::before{
  content:"";
  position:absolute;
  left:1rem;
  right:1rem;
  bottom:.12rem;
  height:3px;
  border-radius:3px;
  background:#E3BE00;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}
.navbar-sas .nav-item.dropdown > .dropdown-toggle:hover::before,
.navbar-sas .nav-item.dropdown > .dropdown-toggle.active::before,
.navbar-sas .nav-item.dropdown:hover > .dropdown-toggle::before,
.navbar-sas .nav-item.dropdown:focus-within > .dropdown-toggle::before{
  transform:scaleX(1);
}

/* Stronger typography and spacing for inner pages. */
.page-header{
  background:linear-gradient(115deg,#062C50 0%,#0A4778 72%,#087FAE 100%);
  padding:4.6rem 0 3.8rem;
}
.page-header::before{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-70px;
  top:-110px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(255,255,255,.035),0 0 0 56px rgba(255,255,255,.025);
}
.page-header h1{
  font-size:clamp(2.5rem,5vw,4.25rem);
  font-weight:700;
  letter-spacing:-.8px;
  text-shadow:0 2px 8px rgba(0,0,0,.16);
}
.page-header p{ color:#E4F6FC; font-size:1.02rem; }
.breadcrumb-sas,.breadcrumb-sas a{ color:#AEEBFA; }

.section-head h2{
  font-size:clamp(2rem,3.5vw,3rem);
  font-weight:700;
  letter-spacing:-.35px;
}
.section-head p{ font-size:1rem; color:#5B7181; }

.achievement-stat,
.service-card,
.project-card,
.cert-card,
.testimonial-card{
  box-shadow:0 8px 24px rgba(6,44,80,.07);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.achievement-stat:hover,
.service-card:hover,
.project-card:hover,
.cert-card:hover,
.testimonial-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 34px rgba(6,44,80,.13);
  border-color:rgba(0,169,232,.35);
}
.achievement-stat .num{ color:#0A6DAB; }
.achievement-stat .label{ color:#536B7D; font-weight:500; }

/* Make light-section text less muddy. */
.bg-surface{ background:#F3F8FB; }
.text-soft{ color:#536B7D !important; }

@media (max-width:991.98px){
  .navbar-sas .nav-item.dropdown > .dropdown-toggle::before{ display:none; }
  .navbar-sas .nav-link::after{ left:0; right:auto; width:42px; }
}

/* ============================================================
   Accessibility and contrast refinements
   ============================================================ */
.new-hero h1,
.new-hero h1 strong {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .22);
}
.new-hero h1 em {
  color: #ffd84a !important;
}
.new-hero .hero-copy {
  color: #eef7fc !important;
  text-shadow: 0 1px 5px rgba(0, 0, 0, .2);
}
.new-hero .hero-eyebrow {
  color: #ffd84a !important;
}
.new-hero .hero-trust {
  color: #d9e9f2 !important;
}

/* Lighter cards: maintain contrast without using near-black surfaces */
.solutions-section {
  background: #eaf3f8;
  color: #102c43;
}
.solutions-section h2 {
  color: #0b3557;
}
.solutions-section .section-kicker.light {
  color: #b17b00;
}
.solutions-section .outline-light-link {
  color: #0b4f83;
  border-color: #8aaabd;
}
.solution-card,
.solution-card.solution-feature {
  background: #ffffff;
  color: #12334b;
  border: 1px solid #c8dce7;
  box-shadow: 0 8px 24px rgba(11, 53, 87, .08);
}
.solution-card:hover,
.solution-card.solution-feature:hover {
  background: #f7fcff;
  color: #12334b;
  border-color: #00a9df;
  box-shadow: 0 14px 30px rgba(11, 53, 87, .14);
}
.solution-card.solution-feature {
  background: linear-gradient(145deg, #0b5b89, #087ca8);
  color: #ffffff;
  border-color: #087ca8;
}
.solution-card.solution-feature:hover {
  background: linear-gradient(145deg, #08658f, #0791bd);
  color: #ffffff;
}
.solution-card h3,
.solution-card.solution-feature h3 {
  color: #12334b !important;
}
.solution-card.solution-feature h3 {
  color: #ffffff !important;
}
.solution-card p {
  color: #526b7a !important;
}
.solution-card.solution-feature p {
  color: #eefaff !important;
}
.solution-card i {
  color: #087ca8;
}
.solution-card.solution-feature i,
.solution-card span,
.solution-card.solution-feature span {
  color: inherit;
}
.solution-card span {
  color: #0b5b89;
}
.solution-card.solution-feature span {
  color: #ffffff;
}
.solution-number {
  color: #5f7b8c;
}
.solution-card.solution-feature .solution-number {
  color: rgba(255,255,255,.75);
}

/* Technical-information cards */
.tech-card {
  background: #f4f9fc;
  border: 1px solid #d6e5ed;
  border-left: 3px solid #00a9df;
  box-shadow: 0 6px 18px rgba(11, 53, 87, .06);
}
.tech-card h3 {
  color: #12334b !important;
}
.tech-card p {
  color: #526b7a !important;
}
.tech-card i {
  color: #087ca8;
}


/* ============================================================
   Services page enhancement — animated cards and application panel
   ============================================================ */
.service-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid #dce8f1;
  border-radius:18px;
  padding:2rem 1.65rem 1.65rem;
  box-shadow:0 10px 28px rgba(4,44,83,.06);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
}
.service-card::before{
  content:"";
  position:absolute;
  width:130px;
  height:130px;
  right:-55px;
  top:-55px;
  border-radius:50%;
  background:linear-gradient(135deg, rgba(0,176,240,.16), rgba(242,212,0,.12));
  z-index:-1;
  transition:transform .5s ease;
}
.service-card::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--blue-400),var(--amber-400));
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .35s ease;
}
.service-card:hover{
  transform:translateY(-10px) rotateX(1deg);
  box-shadow:0 20px 42px rgba(4,44,83,.14);
  border-color:#a9dced;
}
.service-card:hover::before{ transform:scale(2.1); }
.service-card:hover::after{ transform:scaleY(1); }
.service-card .icon-badge{
  position:relative;
  width:58px;
  height:58px;
  border-radius:16px;
  background:linear-gradient(135deg,#e7f8ff,#fff8d5);
  color:var(--blue-800);
  box-shadow:0 7px 16px rgba(0,120,180,.10);
  transition:transform .35s ease, background .35s ease;
}
.service-card:hover .icon-badge{
  transform:rotate(-8deg) scale(1.08);
  background:linear-gradient(135deg,#c9f2ff,#ffef9b);
}
.service-card h3{ margin-top:.15rem; font-size:1.28rem; }
.service-card p{ line-height:1.75; }
.service-card:nth-child(3n+2){ transform-origin:center; }
.service-card:nth-child(3n+2):hover{ transform:translateY(-10px) rotateX(1deg) rotateZ(.35deg); }

/* Decorative section background */
.bg-surface:has(.service-card){
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f5f9fc 0%,#eef8fc 55%,#fffdf0 100%);
}
.bg-surface:has(.service-card)::before{
  content:"";
  position:absolute;
  width:340px;height:340px;
  border:1px solid rgba(0,176,240,.12);
  border-radius:50%;
  right:-150px;top:40px;
  box-shadow:0 0 0 35px rgba(0,176,240,.035),0 0 0 70px rgba(0,176,240,.025);
  animation:slowOrbit 18s linear infinite;
  pointer-events:none;
}
@keyframes slowOrbit{to{transform:rotate(360deg)}}

/* Application table: framed, decorative, readable */
.application-panel{
  position:relative;
  padding:1.4rem;
  border:1px solid #d6e7f0;
  border-radius:24px;
  background:linear-gradient(145deg,#ffffff,#f3faff);
  box-shadow:0 18px 45px rgba(4,44,83,.09);
  overflow:hidden;
}
.application-panel::before{
  content:"";
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(0,176,240,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(0,176,240,.045) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom,black,transparent 75%);
  pointer-events:none;
}
.application-panel-top,.application-panel-footer{position:relative;z-index:1}
.application-panel-top{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.3rem .35rem 1.25rem;
}
.application-label{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--blue-800);font-size:.75rem;font-weight:800;letter-spacing:1.3px;
}
.application-label i{color:var(--amber-600)}
.application-intro{margin:.35rem 0 0;color:var(--ink-soft);font-size:.9rem}
.application-search{
  min-width:255px;display:flex;align-items:center;gap:.6rem;
  background:#fff;border:1px solid #cfe1ec;border-radius:12px;padding:.6rem .85rem;
  box-shadow:0 5px 15px rgba(4,44,83,.05);
}
.application-search i{color:var(--blue-600)}
.application-search input{border:0;outline:0;width:100%;background:transparent;color:var(--ink);font-size:.9rem}
.app-table{border-collapse:separate;border-spacing:0 7px;font-size:.93rem;position:relative;z-index:1}
.app-table thead th{background:var(--blue-900);padding:1rem 1.1rem;border:0;text-transform:uppercase;font-size:.74rem;letter-spacing:1px}
.app-table thead th:first-child{border-radius:12px 0 0 12px}
.app-table thead th:last-child{border-radius:0 12px 12px 0}
.app-table tbody{counter-reset:application}
.app-table tbody tr{counter-increment:application;transition:transform .25s ease,filter .25s ease}
.app-table tbody tr:hover{transform:translateX(5px)}
.app-table tbody td{background:#fff;border:0;padding:.82rem 1.1rem;color:var(--ink);box-shadow:0 3px 10px rgba(4,44,83,.045)}
.app-table tbody td:first-child{border-radius:12px 0 0 12px;font-weight:600;color:var(--blue-900)}
.app-table tbody td:first-child::before{content:counter(application,decimal-leading-zero);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-right:.7rem;border-radius:8px;background:#e8f8fd;color:var(--blue-700);font-size:.7rem;font-weight:800}
.app-table tbody td:last-child{border-radius:0 12px 12px 0;color:var(--blue-700);font-weight:700}
.app-table tbody td:last-child::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--amber-400);margin-right:.55rem;vertical-align:middle}
.app-table tbody tr:hover td{background:#f0fbff}
.application-panel-footer{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.15rem .35rem .1rem;color:var(--ink-soft);font-size:.8rem}
.application-panel-footer i{color:var(--blue-600);margin-right:.3rem}
@media(max-width:767.98px){
  .application-panel-top{align-items:stretch;flex-direction:column}
  .application-search{min-width:0;width:100%}
  .application-panel{padding:.8rem}
  .app-table{min-width:620px}
}
@media(prefers-reduced-motion:reduce){
  .service-card,.service-card::before,.service-card::after,.service-card .icon-badge,.bg-surface:has(.service-card)::before{animation:none!important;transition:none!important}
}

/* Homepage content inspired by the SAS company profile */
.section-intro-light{max-width:650px;color:rgba(255,255,255,.72);margin-top:14px}.activity-bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.activity-card{position:relative;display:flex;gap:18px;align-items:flex-start;min-height:245px;padding:30px;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:linear-gradient(145deg,#123d62,#0a2948);color:#fff;text-decoration:none;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}.activity-card:before{content:"";position:absolute;width:180px;height:180px;border:1px solid rgba(42,196,220,.18);border-radius:50%;right:-65px;bottom:-75px;transition:transform .5s ease}.activity-card:hover{transform:translateY(-9px);box-shadow:0 22px 45px rgba(0,0,0,.2);border-color:#f3c928;color:#fff}.activity-card:hover:before{transform:scale(1.35)}.activity-wide{grid-column:span 2;min-height:190px}.activity-icon{flex:0 0 54px;height:54px;display:grid;place-items:center;border-radius:16px;background:#f3c928;color:#092b4c;font-size:24px}.activity-label{display:block;color:#f3c928;font-size:11px;letter-spacing:1.5px;font-weight:800;margin-bottom:9px}.activity-card h3{font-size:25px;margin:0 0 10px;font-weight:800}.activity-card p{color:rgba(255,255,255,.75);line-height:1.7;margin:0;max-width:700px}.activity-arrow{position:absolute;right:24px;top:24px;color:#f3c928;font-size:22px}.product-expertise-section{padding:110px 0;background:#f3f8fb}.expertise-mini-list{margin-top:26px;display:grid;gap:13px}.expertise-mini-list div{display:flex;align-items:center;gap:10px;font-weight:700;color:#163957}.expertise-mini-list i{color:#10a8bd;font-size:20px}.product-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.product-tile{position:relative;padding:28px;border-radius:22px;background:#fff;border:1px solid #dceaf0;min-height:220px;box-shadow:0 12px 30px rgba(8,42,70,.06);transition:transform .3s ease,box-shadow .3s ease}.product-tile:hover{transform:translateY(-8px);box-shadow:0 20px 38px rgba(8,42,70,.13)}.product-tile-accent{background:#0c3558;color:#fff;border-color:#0c3558}.product-tile i{font-size:32px;color:#0fa9bd}.product-tile-accent i{color:#f3c928}.product-tile h3{font-size:22px;margin:18px 0 9px}.product-tile p{font-size:14px;line-height:1.65;color:#64798a}.product-tile-accent p{color:rgba(255,255,255,.75)}.product-tile-number{position:absolute;right:20px;top:18px;font-size:12px;font-weight:800;color:#9db4c1}.technology-section{padding:110px 0;background:#fff}.section-intro{max-width:700px;color:#63788a}.technology-layout{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:35px}.technology-brand-card{padding:25px;border:1px solid #dbe8ee;border-radius:20px;background:linear-gradient(180deg,#fff,#f5fafc);min-height:340px;transition:transform .3s ease,box-shadow .3s ease}.technology-brand-card:hover{transform:translateY(-8px);box-shadow:0 18px 35px rgba(8,42,70,.1)}.technology-brand-card>img{width:100%;height:70px;object-fit:contain;object-position:left center;margin-bottom:18px}.technology-brand-card h3{font-size:20px;color:#103554;margin-bottom:12px}.technology-brand-card p{font-size:13px;line-height:1.7;color:#64798a}.tech-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.tech-tags span{font-size:10px;letter-spacing:.7px;text-transform:uppercase;font-weight:800;padding:6px 9px;border-radius:20px;background:#e4f5f7;color:#087d91}.partner-logos{background:#0b3153;color:#fff}.partner-logos h3{color:#fff;margin-top:20px}.partner-logos p{color:rgba(255,255,255,.72)}.partner-logo-row{display:flex;align-items:center;gap:15px;margin-bottom:12px}.partner-logo-row img{width:46%;height:42px;object-fit:contain;background:#fff;border-radius:8px;padding:5px}
@media(max-width:991px){.technology-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.activity-card h3{font-size:22px}}
@media(max-width:575px){.activity-bento,.product-showcase,.technology-layout{grid-template-columns:1fr}.activity-wide{grid-column:span 1}.activity-card{min-height:auto;padding:23px}.technology-brand-card{min-height:auto}}
.technical-visual-section{padding:95px 0;background:linear-gradient(135deg,#f7fbfd,#eaf5f8);position:relative;overflow:hidden}.technical-visual-section:before{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(15,169,189,.16);border-radius:50%;right:-180px;top:-180px}.technical-visual-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:32px}.technical-visual-heading h2{margin:8px 0 10px;color:#103554}.technical-visual-heading p{max-width:650px;color:#64798a;margin:0}.technical-visual-badge{white-space:nowrap;background:#fff;border:1px solid #d5e7ed;border-radius:999px;padding:11px 16px;color:#0a7890;font-size:12px;font-weight:800}.technical-visual-badge i{margin-right:7px}.technical-visual-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.technical-visual-grid figure{margin:0;background:#fff;border:1px solid #dbe9ee;border-radius:22px;padding:12px;box-shadow:0 12px 30px rgba(8,42,70,.07);overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}.technical-visual-grid figure:hover{transform:translateY(-9px);box-shadow:0 22px 42px rgba(8,42,70,.14)}.technical-visual-grid img{display:block;width:100%;height:190px;object-fit:cover;object-position:center;border-radius:15px}.technical-visual-grid figcaption{padding:17px 8px 8px;display:flex;flex-direction:column;gap:5px}.technical-visual-grid figcaption strong{font-size:18px;color:#103554}.technical-visual-grid figcaption span{font-size:13px;color:#718695}@media(max-width:767px){.technical-visual-heading{display:block}.technical-visual-badge{display:inline-block;margin-top:20px}.technical-visual-grid{grid-template-columns:1fr}}

/* ============================================================
   Final refinement: aligned activity cards + complete Slide 4 gallery
   ============================================================ */
.activity-bento{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  align-items:stretch;
}
.activity-card{
  min-height:300px;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:0;
  padding:30px 28px 28px;
  border-radius:24px;
  background:linear-gradient(145deg,#123f64 0%,#0b2d4d 100%);
  border:1px solid rgba(125,220,239,.22);
  box-shadow:0 14px 30px rgba(0,0,0,.13);
}
.activity-card.activity-wide{grid-column:span 2;min-height:270px;}
.activity-card:nth-child(2){background:linear-gradient(145deg,#155879,#0b3b5b)}
.activity-card:nth-child(3){background:linear-gradient(145deg,#174b68,#10344f)}
.activity-card:nth-child(4){background:linear-gradient(145deg,#164565,#0c2d4c)}
.activity-card:nth-child(5){background:linear-gradient(145deg,#0f4d68,#0a304f)}
.activity-icon{margin-bottom:25px;width:58px;height:58px;flex-basis:58px;border-radius:18px;box-shadow:0 8px 18px rgba(0,0,0,.15);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease;}
.activity-card:hover .activity-icon{transform:translateY(-4px) rotate(-7deg) scale(1.08);box-shadow:0 12px 24px rgba(243,201,40,.18)}
.activity-card h3{font-size:clamp(1.25rem,1.7vw,1.65rem);line-height:1.18;margin:0 0 13px;max-width:520px;}
.activity-card p{font-size:.93rem;line-height:1.75;color:rgba(255,255,255,.78);max-width:650px;}
.activity-card>div:nth-child(2){flex:1;}
.activity-arrow{top:25px;right:25px;transition:transform .3s ease,color .3s ease;}
.activity-card:hover .activity-arrow{transform:translate(4px,-4px);color:#fff;}
.activity-card:after{content:"";position:absolute;left:28px;right:28px;bottom:0;height:3px;border-radius:5px;background:linear-gradient(90deg,#f3c928,#20c4d8);transform:scaleX(0);transform-origin:left;transition:transform .4s ease;}
.activity-card:hover:after{transform:scaleX(1);}
.technical-visual-grid-expanded{grid-template-columns:repeat(4,minmax(0,1fr));}
.technical-visual-grid-expanded figure{display:flex;flex-direction:column;height:100%;padding:14px;border-radius:24px;}
.technical-visual-grid-expanded figure:nth-child(5){grid-column:span 2;}
.technical-visual-grid-expanded img{height:175px;object-fit:contain;background:#fff;padding:5px;}
.technical-visual-grid-expanded figcaption{flex:1;}
.technical-visual-grid-expanded figcaption strong{line-height:1.25;}
@media(max-width:991px){
 .activity-bento{grid-template-columns:repeat(2,minmax(0,1fr));}
 .activity-card.activity-wide{grid-column:span 2;}
 .technical-visual-grid-expanded{grid-template-columns:repeat(2,minmax(0,1fr));}
 .technical-visual-grid-expanded figure:nth-child(5){grid-column:span 1;}
}
@media(max-width:575px){
 .activity-bento{grid-template-columns:1fr;}
 .activity-card.activity-wide{grid-column:span 1;}
 .technical-visual-grid-expanded{grid-template-columns:1fr;}
}


/* Homepage gallery preview */
.homepage-gallery-section{padding:6rem 0;background:#f5f9fc;position:relative;overflow:hidden}
.homepage-gallery-section:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(4,44,83,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(4,44,83,.035) 1px,transparent 1px);background-size:34px 34px;pointer-events:none}
.homepage-gallery-section>.container-xl{position:relative;z-index:1}
.gallery-heading-row{align-items:flex-end;margin-bottom:2rem}
.homepage-gallery-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;grid-template-rows:220px 220px;gap:1rem}
.home-gallery-card{position:relative;display:block;overflow:hidden;border-radius:22px;min-height:220px;background:#082c4d;box-shadow:0 14px 35px rgba(4,44,83,.12);isolation:isolate}
.home-gallery-card.home-gallery-large{grid-row:span 2}
.home-gallery-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(3,22,38,.85) 100%);z-index:1}
.home-gallery-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s ease}
.home-gallery-card span{position:absolute;left:1.25rem;right:1.25rem;bottom:1.1rem;color:#fff;z-index:2;display:flex;flex-direction:column;gap:.2rem}
.home-gallery-card strong{font-family:'Barlow Semi Condensed',sans-serif;font-size:1.45rem;letter-spacing:.01em}
.home-gallery-card small{color:#d8ebf7;font-size:.8rem}
.home-gallery-card:hover img{transform:scale(1.08);filter:saturate(1.12)}
.home-gallery-card:hover{box-shadow:0 20px 45px rgba(4,44,83,.22)}
.fire-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:.5rem}
.fire-gallery-card{aspect-ratio:4/3;margin:0;cursor:default;background:#eaf3f8;box-shadow:0 12px 30px rgba(4,44,83,.1)}
.fire-gallery-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.5rem 1rem .9rem;background:linear-gradient(transparent,rgba(4,25,42,.9));color:#fff;display:flex;flex-direction:column;gap:.15rem}
.fire-gallery-card figcaption strong{font-family:'Barlow Semi Condensed',sans-serif;font-size:1.15rem}
.fire-gallery-card figcaption span{font-size:.75rem;color:#d8ebf7}
@media(max-width:767px){.homepage-gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:220px 180px 180px}.home-gallery-card.home-gallery-large{grid-row:span 1;grid-column:span 2}.fire-gallery-grid{grid-template-columns:1fr}}


/* ============================================================
   FINAL QA PASS — contrast, layout and brand consistency
   Everything below is the last stylesheet block on purpose:
   it resolves the conflicts left by the earlier override
   sections. Do not add rules after this block.
   ============================================================ */

/* --- 1. Brand tokens (single source of truth) ------------- */
:root{
  --sas-navy:#08203A;
  --sas-navy-2:#0B2E4F;
  --sas-blue:#0C447C;
  --sas-cyan:#00B0F0;
  --sas-gold:#F2C200;        /* logo yellow — use on DARK only */
  --sas-gold-ink:#9A7800;    /* readable gold — use on LIGHT only */
  --nav-h:74px;
  --topbar-h:38px;
  /* retire the stray orange palette: map it onto the SAS gold */
  --modern-orange:var(--sas-gold);
}

/* --- 2. Kill horizontal scrolling ------------------------- */
html,body{ max-width:100%; overflow-x:hidden; }
*,*::before,*::after{ min-width:0; }
img,svg,video{ max-width:100%; height:auto; }
.container-xl{ width:100%; }
html{ scroll-padding-top:calc(var(--nav-h) + 16px); }

/* --- 2a. Leadership / team cards (photo-ready) ------------ */
.team-card{
  height:100%; text-align:center; padding:38px 26px 30px;
  background:#fff; border:1px solid #e2ebf1; border-radius:20px;
  box-shadow:0 12px 30px rgba(8,42,70,.06);
  transition:transform .3s ease, box-shadow .3s ease;
}
.team-card:hover{ transform:translateY(-8px); box-shadow:0 20px 38px rgba(8,42,70,.12); }
.team-avatar{
  width:96px; height:96px; margin:0 auto 20px; border-radius:50%;
  display:grid; place-items:center; font-size:2.1rem; color:#fff;
  background:linear-gradient(145deg,var(--sas-blue),var(--sas-navy));
  border:3px solid var(--sas-gold); overflow:hidden;
}
.team-avatar img{ width:100%; height:100%; object-fit:cover; border-radius:50%; }
.team-card h3{ font-size:1.15rem; margin-bottom:4px; }
.team-role{
  display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.4px;
  color:var(--sas-gold-ink); background:var(--amber-50);
  padding:4px 12px; border-radius:20px; margin-bottom:14px;
}
.team-card p{ font-size:.9rem; color:var(--ink-soft); line-height:1.7; margin:0; }

/* --- 2b. Top utility bar (contact strip above main nav) --- */
.topbar-sas{
  position:fixed; top:0; left:0; right:0; z-index:1052;
  height:var(--topbar-h);
  background:var(--sas-navy);
  color:#cfe3ee;
  font-size:.78rem;
  display:flex; align-items:center;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.topbar-sas .container-xl{ display:flex; justify-content:space-between; align-items:center; gap:16px; }
.topbar-sas a{ color:#cfe3ee; text-decoration:none; }
.topbar-sas a:hover{ color:var(--sas-gold); }
.topbar-left{ display:flex; align-items:center; gap:22px; min-width:0; overflow:hidden; white-space:nowrap; }
.topbar-left span{ color:#9fb8c8; }
.topbar-right{ display:flex; align-items:center; gap:18px; flex:0 0 auto; }
.topbar-hours{ color:#9fb8c8; white-space:nowrap; }
.topbar-sas i{ margin-right:5px; color:var(--sas-gold); font-size:.82rem; }
.topbar-cta{
  background:var(--sas-gold); color:var(--sas-navy) !important; font-weight:700;
  padding:5px 14px; border-radius:20px; white-space:nowrap; transition:filter .2s ease;
}
.topbar-cta:hover{ filter:brightness(1.08); color:var(--sas-navy) !important; }
.navbar-sas.fixed-top{ top:0; }
@media(max-width:767px){
  .topbar-sas{ display:none; }
  .navbar-sas.fixed-top{ top:0; }
  :root{ --nav-h:74px; }
}

/* --- 3. Navbar: fits on one line, never wraps ------------- */
.navbar-sas{ padding:.7rem 0; }
.navbar-sas.is-scrolled{ padding:.45rem 0; }
.navbar-brand-sas img{ height:40px; }
.navbar-brand-sas .brand-text strong{ font-size:1.12rem; white-space:nowrap; }
.navbar-brand-sas .brand-text span{ font-size:.66rem; white-space:nowrap; }
.navbar-sas .nav-link{
  padding:.5rem .62rem !important;
  font-size:.92rem;
  white-space:nowrap;
}
@media (min-width:1400px){
  .navbar-sas .nav-link{ padding:.5rem .8rem !important; font-size:.95rem; }
}
.navbar-sas .nav-cta{ margin-left:.65rem; }
.navbar-sas .nav-cta .btn{
  white-space:nowrap;
  padding:.55rem 1.05rem;
  font-weight:700;
  border-radius:10px;
}
.navbar-sas .dropdown-menu{ min-width:16rem; }

/* Collapsed (mobile / tablet) menu */
@media (max-width:1199.98px){
  .navbar-sas .navbar-collapse{
    margin-top:.75rem;
    padding:.5rem .25rem 1rem;
    border-top:1px solid rgba(4,44,83,.1);
    max-height:78vh;
    overflow-y:auto;
  }
  .navbar-sas .nav-link{ padding:.6rem .25rem !important; }
  .navbar-sas .nav-cta{ margin:.75rem 0 0; }
  .navbar-sas .nav-cta .btn{ display:block; text-align:center; }
  .navbar-sas .nav-link::after{ display:none; }
}

/* --- 4. Fixed navbar clearance on inner pages ------------- */
.page-header{
  position:relative;
  overflow:hidden;
  padding:calc(var(--nav-h) + 3.6rem) 0 3.8rem;
  color:#fff;
}
.page-header > .container-xl{ position:relative; z-index:1; }
.page-header h1{ color:#fff; }
.breadcrumb-sas{ margin-bottom:.75rem; font-size:.85rem; }
.breadcrumb-sas a:hover{ color:var(--sas-gold); }
.new-hero{ margin-top:var(--nav-h); }

/* --- 5. Headings on dark surfaces -------------------------
   The global h1–h5 rule paints headings dark navy, which made
   several headings invisible on dark cards. Restore them. */
.new-hero h1,.new-hero h2,.new-hero h3,
.hero h1,.hero h2,.hero h3,
.page-header h1,.page-header h2,
.bg-navy h1,.bg-navy h2,.bg-navy h3,.bg-navy h4,.bg-navy h5,
.blueprint h1,.blueprint h2,.blueprint h3,
.activity-card h3,
.product-tile-accent h3,
.partner-logos h3,
.cta-inner h2,.cta-inner h3,
.cta-modern h2,
.home-gallery-card strong,
.solution-card.solution-feature h3,
.footer-sas h3,.footer-sas h4,.footer-sas h5,
.testimonial-card.is-dark h3{
  color:#fff !important;
}
.activity-card p,
.product-tile-accent p,
.partner-logos p,
.cta-inner p,.cta-modern p{ color:rgba(255,255,255,.82) !important; }

/* --- 6. "Our activities" section (light bg, dark cards) --- */
.solutions-section{ background:#EAF2F8; }
.solutions-section h2{ color:var(--sas-navy-2) !important; }
.solutions-section .section-kicker,
.solutions-section .section-kicker.light{ color:var(--sas-gold-ink) !important; }
/* was white text on a light background — unreadable */
.section-intro-light{ color:#4C6377 !important; max-width:660px; }
.solutions-section .outline-light-link{
  color:var(--sas-blue);
  border-bottom-color:rgba(12,68,124,.4);
}
.solutions-section .outline-light-link:hover{ color:var(--sas-gold-ink); }
.activity-card{ color:#fff; }
.activity-card:hover h3{ color:#fff !important; }
.activity-label{ color:var(--sas-gold) !important; }
.activity-arrow{ color:var(--sas-gold); }

/* --- 7. Accent colour: gold, readable on each background -- */
.section-kicker,.kicker{ color:var(--sas-gold-ink); }
.section-kicker.light,.hero-eyebrow{ color:var(--sas-gold); }
.hero-eyebrow span{ background:var(--sas-gold); }
.new-hero h1 em{ color:var(--sas-gold); }
.hero-trust i,.visual-tag i{ color:var(--sas-gold); }
.link-arrow{ color:var(--sas-blue); }
.link-arrow:hover{ color:var(--sas-gold-ink); }
.hero-text-link{ color:#fff; }
.hero-text-link:hover{ color:var(--sas-gold); }
.visual-orbit{ border-color:rgba(242,194,0,.5); }
.image-label{ background:var(--sas-navy); }
.cta-inner:after{ border-color:rgba(242,194,0,.28); }
.tech-card i,.solution-card i{ color:var(--sas-cyan); }

/* --- 8. Stats ribbon: gold band, navy type ---------------- */
.stats-ribbon{
  background:linear-gradient(90deg,#F2C200 0%,#E4B000 100%);
  color:var(--sas-navy);
}
.stat-modern{ border-right:1px solid rgba(8,32,58,.18); }
.stat-modern strong{ color:var(--sas-navy); }
.stat-modern small{ color:rgba(8,32,58,.78); opacity:1; font-weight:600; }
@media (max-width:767.98px){
  .stat-modern:nth-child(2){ border-right:0; }
}

/* --- 9. Product / technology imagery --------------------- */
.technical-visual-grid-expanded img,
.technical-visual-grid img{
  height:172px;
  object-fit:contain;
  background:#fff;
  padding:14px;
  border-radius:16px;
  border:1px solid #EDF3F6;
}
.technical-visual-grid figcaption{ padding:14px 8px 6px; }
.technical-visual-grid figcaption strong{ color:var(--sas-navy-2); }
.technology-brand-card > img{ height:58px; }
.partner-logo-row img{ height:44px; object-fit:contain; background:#fff; }

/* --- 10. Product tiles ----------------------------------- */
.product-tile-accent{ background:linear-gradient(145deg,#0C3558,#0A2740); }
.product-tile-accent i{ color:var(--sas-gold); }
.product-tile-accent .product-tile-number{ color:rgba(255,255,255,.6); }
.product-tile i{ color:var(--sas-cyan); }

/* --- 11. CTA band ---------------------------------------- */
.cta-modern{ padding:0 0 5rem; background:#fff; }
.cta-inner{ border-radius:24px; }
@media (max-width:767.98px){ .cta-inner{ border-radius:18px; } }

/* --- 12. Footer ------------------------------------------ */
.footer-sas{ background:var(--sas-navy); color:#B7C9D6; padding:4.25rem 0 0; }
.footer-sas h5{ color:#fff; font-size:.95rem; letter-spacing:.4px; margin-bottom:1rem; }
.footer-sas p,.footer-sas li{ color:#B7C9D6; }
.footer-sas a{ color:#D3E2ED; }
.footer-sas a:hover{ color:var(--sas-gold); }
.footer-sas .footer-brand span{ color:var(--sas-gold); letter-spacing:.6px; }
.footer-about{ font-size:.92rem; max-width:340px; }
.footer-bottom{ color:#8FA6B6; }
.footer-sas li i{ color:var(--sas-cyan); }

/* --- 13. Buttons ----------------------------------------- */
.btn-amber{ background:var(--sas-gold); border-color:var(--sas-gold); color:#241300; font-weight:700; }
.btn-amber:hover,.btn-amber:focus{ background:#DCB000; border-color:#DCB000; color:#241300; }
.back-to-top{ z-index:1030; }

/* --- 14. Vertical rhythm --------------------------------- */
.section-modern{ padding:6rem 0; }
.product-expertise-section,.technology-section{ padding:6rem 0; }
.technical-visual-section,.homepage-gallery-section{ padding:5.5rem 0; }
.solutions-section{ padding:6rem 0; }
@media (max-width:767.98px){
  .section-modern,.product-expertise-section,.technology-section,
  .technical-visual-section,.homepage-gallery-section,.solutions-section,
  .applications-section{ padding:3.5rem 0 !important; }
  .new-hero{ padding:3.5rem 0 4rem; min-height:0; }
  .image-stack{ height:320px; }
  .shot-frame-main{ height:270px; }
  .shot-frame-small{ height:130px; }
  .section-heading-row,.technical-visual-heading,.gallery-heading-row{ display:block; }
}

/* --- 15. Accessibility ----------------------------------- */
a:focus-visible,button:focus-visible,.nav-link:focus-visible{
  outline:3px solid var(--sas-cyan);
  outline-offset:2px;
  border-radius:4px;
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* --- 16. Grid gap-fills and spacing corrections ---------- */
/* The stats ribbon inherited the global 5rem section padding */
.stats-ribbon{ padding:0 !important; }

/* Last activity card ran as span-2 in a 3-col grid, leaving a hole */
.activity-bento > .activity-card:last-child{ grid-column:1 / -1; min-height:0; }
@media (max-width:991.98px){
  .activity-bento > .activity-card:last-child{ grid-column:1 / -1; }
}

/* Homepage gallery: fill the empty cell in the 3x2 grid */
.homepage-gallery-grid{ grid-auto-rows:220px; }

/* Section heading rows: keep the side link aligned to the heading */
.section-heading-row,.technical-visual-heading,.gallery-heading-row{ gap:2rem; }
.section-heading-row > a,.gallery-heading-row > a{ white-space:nowrap; }

/* --- 17. Activity bento: 3 + 2 with no empty cell -------- */
.activity-bento > .activity-card:last-child{ grid-column:auto; }
.activity-bento > .activity-card:first-child{ grid-column:span 2; }
@media (max-width:991.98px){
  .activity-bento > .activity-card:first-child{ grid-column:span 2; }
}
@media (max-width:575.98px){
  .activity-bento > .activity-card:first-child{ grid-column:span 1; }
}

/* --- 18. Small-screen hero + misc ------------------------ */
@media (max-width:575.98px){
  .hero-actions{
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    gap:1rem;
  }
  .hero-actions .btn{ width:100%; text-align:center; }
  .hero-text-link{ margin-top:0 !important; }
  .new-hero h1{ font-size:2.6rem; letter-spacing:-1px; }
  .visual-tag{ position:static; margin-top:1rem; }
  .hero-visual{ min-height:0; }
  .visual-frame{ position:static; width:100%; height:260px; transform:none; }
  .visual-orbit{ display:none; }
  .homepage-gallery-grid{ grid-template-columns:1fr; grid-auto-rows:200px; }
  .home-gallery-card.home-gallery-large{ grid-row:span 1; grid-column:span 1; }
}
/* Hero image should never crowd the copy on tablets either */
@media (max-width:991.98px){
  .hero-visual{ margin-top:2.5rem; }
}

/* --- 19. Fix: stray blue bar on "Achievements" dropdown ---
   The generic .nav-link::after underline rule was also matching
   .dropdown-toggle, merging with Bootstrap's caret-arrow ::after
   (border-top: .3em solid currentColor). That stretched the caret's
   blue border into a full-width bar, stacking with the gold
   .dropdown-toggle::before underline already used for this item.
   Reset ::after back to a plain small caret; keep the gold bar
   living only on ::before. */
.navbar-sas .dropdown-toggle::after{
  position:static !important;
  left:auto !important; right:auto !important; bottom:auto !important;
  width:auto !important; height:auto !important;
  background:transparent !important;
  transform:none !important;
  display:inline-block;
  margin-left:.4em;
  vertical-align:.15em;
  border-top:.32em solid currentColor;
  border-right:.32em solid transparent;
  border-left:.32em solid transparent;
  border-bottom:0;
  border-radius:0;
  transition:transform .2s ease;
}
.navbar-sas .nav-item.dropdown:hover > .dropdown-toggle::after,
.navbar-sas .nav-item.dropdown:focus-within > .dropdown-toggle::after{
  transform:rotate(180deg);
}

/* ============================================================
   REFERENCE-SITE PATTERNS — 15 Sep 2026
   Structural patterns pulled from client-supplied reference
   sites (industrial B2B peers: Whitelight Autolamp, Continual
   Renewable Energy), not their visuals — colours/type/spacing
   stay SAS's own per the original brief.
   ============================================================ */

/* --- WhatsApp float button --------------------------------- */
.whatsapp-float{
  position:fixed;
  right:1.25rem; bottom:5.5rem;
  width:52px; height:52px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.55rem;
  box-shadow:0 10px 24px rgba(37,211,102,.4);
  z-index:1000;
  transition:transform .2s ease, box-shadow .2s ease;
}
.whatsapp-float:hover{
  color:#fff;
  transform:translateY(-3px) scale(1.05);
  box-shadow:0 14px 30px rgba(37,211,102,.5);
}
/* Stack back-to-top above the WhatsApp button instead of overlapping it */
.back-to-top{ bottom:1.25rem; }
@media (max-width:575.98px){
  .whatsapp-float{ right:1rem; bottom:4.75rem; width:48px; height:48px; font-size:1.4rem; }
  .back-to-top{ right:1rem; bottom:1rem; }
}

/* --- Client logo marquee ------------------------------------ */
.logo-marquee-section{ padding:5rem 0 4.5rem; background:#fff; }
.logo-marquee-section .section-heading-row{ margin-bottom:2.25rem; }
.marquee-viewport{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.marquee-track{
  display:flex;
  align-items:center;
  gap:3.25rem;
  width:max-content;
  animation:marqueeScroll 34s linear infinite;
}
.marquee-viewport:hover .marquee-track{ animation-play-state:paused; }
.marquee-logo{
  flex:0 0 auto;
  height:52px;
  display:flex; align-items:center;
}
.marquee-logo img{
  max-height:100%;
  max-width:150px;
  width:auto;
  object-fit:contain;
  transition:transform .25s ease;
}
@keyframes marqueeScroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
@media (prefers-reduced-motion:reduce){
  .marquee-track{ animation:none; overflow-x:auto; }
}
@media (max-width:767.98px){
  .logo-marquee-section{ padding:3.5rem 0; }
  .marquee-logo{ height:42px; }
  .marquee-logo img{ max-width:120px; }
}

/* --- Numbered service cards (Core services grid only) -------
   Scoped to .row-numbered so the Technical Expertise grid,
   which reuses .service-card for equipment tiles, is untouched. */
.row-numbered{ counter-reset:svcnum; }
.row-numbered .service-card{ position:relative; }
.row-numbered .service-card::before{
  counter-increment:svcnum;
  content:counter(svcnum,decimal-leading-zero);
  position:absolute;
  top:1.1rem; right:1.3rem;
  font-family:'Barlow Semi Condensed',sans-serif;
  font-size:1.6rem;
  font-weight:800;
  color:#D7E4EC;
  z-index:0;
  line-height:1;
}
.row-numbered .service-card > *{ position:relative; z-index:1; }

/* ============================================================
   REFERENCE-SITE MOTION PASS (15 Sep 2026)
   Card + hero animation upgrades modelled on the animation
   language used across the client's reference sites (staggered
   entrance on load, image zoom + icon lift on card hover, a
   light sweep on primary buttons, lift-and-glow on logo/pill
   chips). Purely additive — nothing above this block is edited.
   ============================================================ */

/* --- Hero entrance: headline block rises in on load, staggered --- */
@keyframes heroRise{
  from{ opacity:0; transform:translateY(22px); }
  to{ opacity:1; transform:translateY(0); }
}
.new-hero .hero-eyebrow{ animation:heroRise .7s cubic-bezier(.16,.8,.3,1) both; animation-delay:.05s; }
.new-hero h1{ animation:heroRise .8s cubic-bezier(.16,.8,.3,1) both; animation-delay:.16s; }
.new-hero .hero-copy{ animation:heroRise .8s cubic-bezier(.16,.8,.3,1) both; animation-delay:.28s; }
.new-hero .hero-actions{ animation:heroRise .8s cubic-bezier(.16,.8,.3,1) both; animation-delay:.4s; }
.new-hero .hero-trust{ animation:heroRise .8s cubic-bezier(.16,.8,.3,1) both; animation-delay:.5s; }
.new-hero .hero-visual{ animation:heroRise 1s cubic-bezier(.16,.8,.3,1) both; animation-delay:.3s; }
.new-hero .visual-tag{ animation:heroRise .9s cubic-bezier(.16,.8,.3,1) both; animation-delay:.65s; }

/* Inner-page headers get the same rise, lighter stagger */
.page-header .breadcrumb-sas{ animation:heroRise .6s cubic-bezier(.16,.8,.3,1) both; animation-delay:.04s; }
.page-header h1{ animation:heroRise .7s cubic-bezier(.16,.8,.3,1) both; animation-delay:.14s; }
.page-header p{ animation:heroRise .7s cubic-bezier(.16,.8,.3,1) both; animation-delay:.24s; }

/* --- Buttons: light-sweep on hover, matches reference-site CTAs --- */
.btn-amber, .btn-navy{ position:relative; overflow:hidden; isolation:isolate; }
.btn-amber::before, .btn-navy::before{
  content:"";
  position:absolute; top:0; left:-60%;
  width:45%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg);
  transition:left .55s ease;
  z-index:1; pointer-events:none;
}
.btn-amber:hover::before, .btn-navy:hover::before{ left:130%; }
.btn-amber > *, .btn-navy > *{ position:relative; z-index:2; }

/* --- Icon badges: gentle pop wherever they appear in a hover card --- */
.icon-badge, .tech-card i, .value-card i, .contact-card .icon-badge{
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .35s ease;
}

/* --- Technology / product / activity cards: image or icon breathes on hover --- */
.technology-brand-card:hover > img{ transform:scale(1.06); transition:transform .4s ease; }
.technology-brand-card > img{ transition:transform .4s ease; }
.product-tile:hover i{ transform:translateY(-3px) scale(1.12); }
.product-tile i{ transition:transform .35s cubic-bezier(.34,1.56,.64,1); }

/* --- Logo chips (brand strip, marquee, partner rows): lift on hover --- */
.marquee-logo, .partner-logo-row img, .client-logo{
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), filter .3s ease, box-shadow .3s ease;
}
.marquee-logo:hover{ transform:translateY(-4px) scale(1.04); }
.partner-logo-row img:hover{ transform:translateY(-3px) scale(1.06); }

/* --- Application / capability pills: lift + shadow instead of flat color-swap only --- */
.application-pills span{ transition:background .25s ease, color .25s ease, border-color .25s ease, transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease; }
.application-pills span:hover{ transform:translateY(-4px); box-shadow:0 12px 24px rgba(4,44,83,.16); }

/* --- Figures / gallery images across the site: consistent slow-zoom crop --- */
.technical-visual-grid figure:hover img,
.fire-gallery-card:hover img,
.panel-photo-card:hover img{ transform:scale(1.05); }
.technical-visual-grid figure img,
.fire-gallery-card img,
.panel-photo-card img{ transition:transform .5s cubic-bezier(.2,.7,.2,1); }

/* --- Stat numbers: soft pop on hover to invite attention to the counters --- */
.stat-modern{ transition:transform .3s ease; }
.stat-modern:hover{ transform:translateY(-3px); }

/* Respect reduced-motion users: kill load-in animation, keep hover states simple */
@media (prefers-reduced-motion:reduce){
  .new-hero .hero-eyebrow, .new-hero h1, .new-hero .hero-copy, .new-hero .hero-actions,
  .new-hero .hero-trust, .new-hero .hero-visual, .new-hero .visual-tag,
  .page-header .breadcrumb-sas, .page-header h1, .page-header p{
    animation:none; opacity:1; transform:none;
  }
  .btn-amber::before, .btn-navy::before{ display:none; }
}

/* ============================================================
   HERO BACKGROUND VIDEO (15 Sep 2026)
   Muted, looping background video behind the hero copy — the
   pattern used across the reference sites. Falls back to the
   existing photo (poster attribute) while the video loads.
   ============================================================ */
.new-hero{ position:relative; overflow:hidden; }
.hero-video{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  pointer-events:none;
}
.hero-video-overlay{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(100deg,rgba(5,17,29,.72) 0%,rgba(6,22,36,.5) 32%,rgba(6,22,36,.22) 58%,rgba(6,22,36,.1) 100%);
}
.new-hero .hero-grid{ z-index:2; }
.new-hero .container-xl{ z-index:3; }
.new-hero{ min-height:720px; display:flex; align-items:center; padding:130px 0 90px; }
.hero-content-block{ max-width:640px; }
.hero-scroll-cue{
  position:absolute; left:50%; bottom:34px; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:rgba(255,255,255,.75); text-decoration:none;
  font-size:.72rem; letter-spacing:2px; text-transform:uppercase; font-weight:700;
}
.hero-scroll-cue:hover{ color:#fff; }
.scroll-cue-line{
  width:1px; height:34px;
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,0));
  animation:scrollCue 1.8s ease-in-out infinite;
}
@keyframes scrollCue{
  0%{ transform:scaleY(.3); transform-origin:top; opacity:.4; }
  50%{ transform:scaleY(1); transform-origin:top; opacity:1; }
  100%{ transform:scaleY(.3); transform-origin:bottom; opacity:.4; }
}
@media(max-width:767.98px){
  .new-hero{ min-height:0; padding:110px 0 70px; }
  .hero-scroll-cue{ display:none; }
}

@media (prefers-reduced-motion:reduce){
  .hero-video{ display:none; }
  .new-hero{
    background-image:linear-gradient(125deg,rgba(7,24,39,.92) 0%,rgba(11,41,64,.86) 52%,rgba(18,59,85,.8) 100%),
      url('../assets/img/panels/panel-22.jpeg');
    background-size:cover; background-position:center;
  }
}

/* ============================================================
   Two-slide hero: separate video + text per slide, crossfading
   on a timer. Falls back to slide 1 only if JS never runs.
   ============================================================ */
.hero-slide{
  position:absolute; inset:0; z-index:0;
  opacity:0; visibility:hidden;
  transition:opacity 1.1s ease;
}
.hero-slide.is-active{ opacity:1; visibility:visible; z-index:0; }
.hero-content-slider{ position:relative; }
.hero-content-slider .hero-content-block{
  transition:opacity .6s ease, transform .6s ease;
}
.hero-content-slider .hero-content-block[hidden]{ display:none !important; }
.hero-content-slider .hero-content-block:not(.is-active){
  position:absolute; top:0; left:0; width:100%;
  opacity:0; visibility:hidden; transform:translateY(14px);
  pointer-events:none; z-index:0;
}
.hero-content-slider .hero-content-block.is-active{
  position:relative; opacity:1; visibility:visible; transform:translateY(0);
  pointer-events:auto; z-index:1;
}
.hero-slide-dots{
  position:absolute; right:0; bottom:40px; z-index:4;
  display:flex; gap:10px;
}
.hero-slide-dots button{
  width:28px; height:3px; padding:0; border:0;
  background:rgba(255,255,255,.35); cursor:pointer;
  transition:background .25s ease, transform .25s ease;
}
.hero-slide-dots button.active{ background:var(--sas-gold); }
@media(max-width:767.98px){
  .hero-slide-dots{ right:auto; left:0; bottom:14px; }
}

/* ============================================================
   PANEL TYPES — reference info grid (15 Sep 2026)
   ============================================================ */
.panel-type-lead{ color:#082d52; font-weight:800; font-size:1.2rem; margin:6px 0 18px; }
.panel-type-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px;
  margin-bottom:40px;
}
.panel-type-card{
  padding:26px 24px; border-radius:20px; background:#fff;
  border:1px solid #dce7ef; box-shadow:0 10px 25px rgba(8,45,82,.06);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.panel-type-card:hover{ transform:translateY(-6px); box-shadow:0 18px 36px rgba(8,45,82,.13); border-color:#19a9d5; }
.panel-type-icon{
  width:48px; height:48px; border-radius:14px; display:grid; place-items:center;
  background:#edf7fb; color:#0a7ea8; font-size:22px; margin-bottom:16px;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1);
}
.panel-type-card:hover .panel-type-icon{ transform:rotate(-6deg) scale(1.08); }
.panel-type-card h3{ font-size:1.08rem; color:#082d52; margin:0 0 10px; line-height:1.3; }
.panel-type-card h3 span{ display:block; font-size:.72rem; font-weight:700; letter-spacing:.04em; color:#7691a3; text-transform:uppercase; margin-top:3px; }
.panel-type-card p{ font-size:.87rem; line-height:1.7; color:#516475; margin:0 0 14px; }
.panel-type-standard{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.72rem; font-weight:800; letter-spacing:.02em;
  color:#0a7ea8; background:#edf7fb; padding:6px 11px; border-radius:999px;
}
@media(max-width:991px){ .panel-type-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:575px){ .panel-type-grid{ grid-template-columns:1fr; } }

/* ============================================================
   FINAL DESIGN-ONLY PASS — INDUSTRIAL AUTOMATION VISUAL SYSTEM
   Structure/content/layout intentionally unchanged.
   ============================================================ */
:root{
  --sas-navy:#08233a;
  --sas-navy-2:#0d3554;
  --sas-blue:#0b67b2;
  --sas-blue-2:#2a8acb;
  --sas-cyan:#0fa8bd;
  --sas-gold:#f2c400;
  --sas-line:#d6e1e8;
  --sas-surface:#f3f6f8;
  --sas-text:#183247;
  --sas-muted:#637888;
}

body{color:var(--sas-text);background:#fff}

/* Header: clean engineering / OEM feel */
.navbar-sas{
  background:#fff!important;
  border-bottom:1px solid #d8e2e9!important;
  box-shadow:0 3px 16px rgba(8,35,58,.06);
}
.navbar-sas .nav-link{
  color:#274357!important;
  font-weight:650;
  letter-spacing:.15px;
}
.navbar-sas .nav-link:hover,.navbar-sas .nav-link.active{color:var(--sas-blue)!important}
.navbar-sas .nav-link::after{background:var(--sas-gold)!important;height:2px}
.navbar-brand-sas .brand-text strong{color:var(--sas-navy)!important}
.navbar-brand-sas .brand-text span{color:#9a7700!important;letter-spacing:.9px}

/* Industrial hero: stronger machine-room contrast, less generic marketing styling */
.new-hero{
  margin-top:0!important;
  min-height:650px;
  background:#071c2d!important;
  border-bottom:4px solid var(--sas-gold);
}
.hero-video{filter:saturate(.72) contrast(1.06)!important}
.hero-video-overlay{
  background:linear-gradient(90deg,rgba(4,20,33,.92) 0%,rgba(5,28,46,.78) 46%,rgba(5,28,46,.42) 76%,rgba(5,28,46,.64) 100%)!important;
}
.hero-grid{opacity:.11!important;background-size:34px 34px!important}
.hero-content-block{max-width:650px!important}
.hero-eyebrow{color:var(--sas-gold)!important;letter-spacing:2.2px!important;font-size:.72rem!important}
.hero-eyebrow span{background:var(--sas-gold)!important}
.new-hero h1{font-size:clamp(3rem,5.1vw,5.25rem)!important;letter-spacing:-1.5px!important}
.new-hero h1 em{color:#f4c91a!important}
.hero-copy{color:#c9d6df!important}
.hero-trust{color:#9eb2c0!important}
.hero-trust i{color:var(--sas-gold)!important}
.hero-scroll-cue{color:#b8c8d2!important}

/* Section headings: technical hierarchy rather than soft consumer UI */
.section-kicker,.kicker{color:#0b67b2!important;letter-spacing:1.7px!important;font-weight:800!important}
.section-kicker.light{color:var(--sas-gold)!important}
.section-kicker::before,.kicker::before{background:var(--sas-gold)!important}
h1,h2,h3,h4,h5{color:var(--sas-navy)}
.section-head{max-width:760px!important}

/* Stats: engineered strip, not floating cards */
.stats-ribbon{background:#0b3150!important;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.stat-modern{background:transparent!important;border-right:1px solid rgba(255,255,255,.15)!important;padding:25px 18px!important}
.stat-modern strong{font-family:'Barlow Semi Condensed',sans-serif;letter-spacing:.3px}
.stat-modern small{color:#b8cbd7;letter-spacing:1.1px}

/* All icon modules: eliminate black boxes / pastel bubbles */
.icon-badge,.service-icon,.card-icon,.activity-icon,.contact-card .icon-badge,.cert-card .icon-badge,.panel-type-head .icon-badge{
  background:#eef4f8!important;
  color:var(--sas-blue)!important;
  border:1px solid #c9d9e3!important;
  border-radius:5px!important;
  box-shadow:none!important;
}
.icon-badge i,.service-icon i,.card-icon i,.activity-icon i,.contact-card .icon-badge i,.cert-card .icon-badge i,.panel-type-head .icon-badge i{color:var(--sas-blue)!important}

/* Main service cards — same 3-column grid, completely industrial visual language */
.row-numbered .service-card,.service-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  min-height:285px;
  padding:27px 27px 24px!important;
  border:1px solid var(--sas-line)!important;
  border-top:3px solid var(--sas-blue)!important;
  border-radius:5px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(8,35,58,.06)!important;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease!important;
}
.row-numbered .service-card:before,.service-card:before{
  content:"";
  position:absolute;
  inset:auto 0 0 auto;
  width:42%;height:100%;
  z-index:-2;
  opacity:.09;
  background-position:center right;
  background-size:cover;
  background-repeat:no-repeat;
  clip-path:polygon(26% 0,100% 0,100% 100%,0 100%);
}
.row-numbered .service-card:after,.service-card:after{
  content:"";
  position:absolute;
  left:27px;right:27px;bottom:0;height:2px;
  background:linear-gradient(90deg,var(--sas-gold) 0 34px,#dce5eb 34px 100%);
}
.row-numbered .service-card:nth-child(1):before{background-image:url('../assets/img/panels/panel-02.jpeg')}
.row-numbered .service-card:nth-child(2):before{background-image:url('../assets/img/panels/panel-08.jpeg')}
.row-numbered .service-card:nth-child(3):before{background-image:url('../assets/img/panels/panel-18.jpeg')}
.row-numbered .service-card:nth-child(4):before{background-image:url('../assets/img/panels/panel-15.jpeg')}
.row-numbered .service-card:nth-child(5):before{background-image:url('../assets/img/panels/panel-20.jpeg')}
.row-numbered .service-card:nth-child(6):before{background-image:url('../assets/img/panels/panel-23.jpeg')}
.row-numbered .service-card:nth-child(7):before{background-image:url('../assets/img/panels/panel-04.jpeg')}
.row-numbered .service-card:nth-child(8):before{background-image:url('../assets/img/panels/panel-28.jpeg')}
.row-numbered .service-card:nth-child(9):before{background-image:url('../assets/img/panels/panel-30.jpeg')}
.row-numbered .service-card:hover,.service-card:hover{
  transform:translateY(-5px)!important;
  border-color:#b9cbd6!important;
  border-top-color:var(--sas-gold)!important;
  box-shadow:0 16px 34px rgba(8,35,58,.12)!important;
}
.row-numbered .service-card .icon-badge,.service-card .icon-badge{
  width:54px!important;height:54px!important;
  margin-bottom:24px!important;
  border-radius:5px!important;
  background:#f0f5f8!important;
  color:var(--sas-blue)!important;
  border:1px solid #cbdbe5!important;
}
.row-numbered .service-card:hover .icon-badge,.service-card:hover .icon-badge{
  transform:none!important;background:#e8f2f8!important;color:var(--sas-blue)!important;
}
.row-numbered .service-card h3,.service-card h3{
  color:var(--sas-navy)!important;
  font-size:1.36rem!important;
  font-weight:750!important;
  line-height:1.12!important;
  margin-bottom:10px!important;
  max-width:82%;
}
.row-numbered .service-card p,.service-card p{color:var(--sas-muted)!important;font-size:.92rem!important;line-height:1.72!important}
.row-numbered .service-card h3:before{
  content:"ENGINEERING CAPABILITY";
  display:block;
  margin-bottom:8px;
  color:var(--sas-blue);
  font-family:'Inter',sans-serif;
  font-size:.58rem;
  font-weight:800;
  letter-spacing:1.5px;
}
.row-numbered .service-card:nth-child(1) h3:before{content:"PANEL MANUFACTURING"}
.row-numbered .service-card:nth-child(2) h3:before{content:"CONTROL SOFTWARE"}
.row-numbered .service-card:nth-child(3) h3:before{content:"ENERGY OPTIMISATION"}
.row-numbered .service-card:nth-child(4) h3:before{content:"FACTORY AUTOMATION"}
.row-numbered .service-card:nth-child(5) h3:before{content:"PROCESS CONTROL"}
.row-numbered .service-card:nth-child(6) h3:before{content:"LINE AUTOMATION"}
.row-numbered .service-card:nth-child(7) h3:before{content:"FIELD ENGINEERING"}
.row-numbered .service-card:nth-child(8) h3:before{content:"DOCUMENTATION"}
.row-numbered .service-card:nth-child(9) h3:before{content:"SITE SUPPORT"}

/* Numbering stays, but becomes a faint engineering reference mark */
.row-numbered{counter-reset:svcnum}
.row-numbered .service-card{counter-increment:svcnum}
.row-numbered .service-card .icon-badge:before{
  content:counter(svcnum,decimal-leading-zero);
  position:absolute;right:21px;top:18px;
  color:#d6e2e9;font-family:'Barlow Semi Condensed',sans-serif;
  font-size:2.35rem;font-weight:700;line-height:1;
}

/* Homepage activity cards: technical panels instead of rounded marketing tiles */
.activity-bento{gap:14px!important}
.activity-card{
  border-radius:4px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:linear-gradient(135deg,#103b5b,#071f34)!important;
  box-shadow:none!important;
  min-height:230px!important;
  padding:28px!important;
}
.activity-card:before{border-radius:0!important;border:0!important;width:280px;height:280px;right:-130px;bottom:-150px;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:22px 22px;opacity:.45}
.activity-card:hover{transform:translateY(-5px)!important;box-shadow:0 18px 36px rgba(0,0,0,.22)!important;border-color:var(--sas-gold)!important}
.activity-icon{width:52px!important;height:52px!important;flex-basis:52px!important;border-radius:4px!important;background:#edf4f7!important;box-shadow:none!important}
.activity-card:hover .activity-icon{transform:none!important;box-shadow:none!important}
.activity-label{color:var(--sas-gold)!important;letter-spacing:1.7px!important}
.activity-card h3{color:#fff!important;font-size:1.55rem!important}
.activity-card p{color:#b9cbd5!important}
.activity-arrow{color:var(--sas-gold)!important}
.activity-card:after{height:2px!important;border-radius:0!important;background:linear-gradient(90deg,var(--sas-gold),#1fa9c1)!important}

/* Product / panel tiles */
.product-showcase{gap:14px!important}
.product-tile{
  border-radius:5px!important;
  border:1px solid var(--sas-line)!important;
  box-shadow:0 8px 24px rgba(8,35,58,.06)!important;
  background:#fff!important;
}
.product-tile:hover{transform:translateY(-5px)!important;box-shadow:0 16px 32px rgba(8,35,58,.11)!important}
.product-tile-accent{background:#0b3554!important;border-color:#0b3554!important}
.product-tile i{color:var(--sas-blue)!important}.product-tile-accent i{color:var(--sas-gold)!important}

/* Technology / brands */
.technology-layout{gap:14px!important}
.technology-brand-card{border-radius:5px!important;border:1px solid var(--sas-line)!important;background:#fff!important;box-shadow:0 8px 22px rgba(8,35,58,.05)!important;border-top:3px solid #d9e4ea}
.technology-brand-card:hover{transform:translateY(-5px)!important;border-top-color:var(--sas-gold);box-shadow:0 15px 30px rgba(8,35,58,.1)!important}
.tech-tags span{border-radius:3px!important;background:#eef4f8!important;color:#1a5f8e!important}
.partner-logos{background:#0b3150!important}

/* Project cards / case-study style */
.project-card{
  border-radius:5px!important;
  border:1px solid var(--sas-line)!important;
  border-left:3px solid var(--sas-blue)!important;
  box-shadow:0 8px 22px rgba(8,35,58,.05)!important;
}
.project-card:hover{border-left-color:var(--sas-gold)!important}
.project-card .platform-tag{border-radius:3px!important;background:#eef4f8!important;color:#17679b!important;text-transform:uppercase;letter-spacing:.8px}
.project-card:hover .platform-tag{background:#eef4f8!important;color:#17679b!important;transform:none!important}
.project-card .client{color:var(--sas-blue)!important}

/* Gallery / panel images: sharper, engineering portfolio presentation */
.gallery-item{border-radius:4px!important;border:1px solid #d3dfe6!important;box-shadow:0 8px 20px rgba(8,35,58,.06)!important}
.gallery-item:hover{box-shadow:0 14px 28px rgba(8,35,58,.14)!important}
.gallery-item::after{background:rgba(5,25,40,.45)!important}
.gallery-item .tag{border-radius:3px!important;background:#0b3554!important;color:#fff!important}

/* Client / logo areas */
.client-logo,.brand-strip{border-radius:4px!important;border:1px solid #d9e3e9!important;background:#fff!important;box-shadow:none!important}
.client-logo:hover{border-color:#b8ccd8!important;box-shadow:0 10px 22px rgba(8,35,58,.09)!important}

/* Contact cards */
.contact-card{
  border-radius:5px!important;
  border:1px solid var(--sas-line)!important;
  border-top:3px solid var(--sas-blue)!important;
  box-shadow:0 8px 22px rgba(8,35,58,.05)!important;
}
.contact-card:hover{border-top-color:var(--sas-gold)!important}
.contact-card .icon-badge{border-radius:4px!important}
.contact-card:hover .icon-badge{transform:none!important}

/* Certifications / achievement cards */
.cert-card,.achievement-stat,.value-card{
  border-radius:5px!important;
  border:1px solid var(--sas-line)!important;
  box-shadow:0 8px 22px rgba(8,35,58,.05)!important;
}
.cert-status{border-radius:3px!important;background:#eef4f8!important;color:#1b658f!important}
.achievement-stat .num{color:var(--sas-blue)!important}
.value-card .num{color:#a17a00!important}

/* Panel specification lists */
.panel-type-section:nth-of-type(even){background:#f4f7f9!important}
.panel-spec-list li{border-radius:4px!important;border:1px solid #d9e3e9!important;background:#fff!important}
.panel-spec-list li i{color:var(--sas-blue)!important}
.panel-type-head .icon-badge{border-radius:4px!important}

/* Tables and forms */
.app-table{border-collapse:separate;border-spacing:0;overflow:hidden}
.app-table th{background:#0b3554!important;color:#fff!important}
.app-table td{border-color:#dce5ea!important}
.app-table tr:hover td{background:#f1f6f9!important}
.form-control,.form-select{border-radius:4px!important;border-color:#c9d8e1!important}
.form-control:focus,.form-select:focus{border-color:var(--sas-blue)!important;box-shadow:0 0 0 .18rem rgba(11,103,178,.12)!important}

/* Page headers: engineering document cover */
.page-header{background:#09263e!important;border-bottom:3px solid var(--sas-gold);padding:calc(var(--nav-h) + 2.2rem) 0 2.8rem!important}
.page-header::after{opacity:.5;background-size:30px 30px!important}
.page-header h1{letter-spacing:.2px}
.breadcrumb-sas{color:#a9bfcc!important}.breadcrumb-sas a{color:#9cc5dc!important}

/* CTA: square, strong and technical */
.cta-inner{border-radius:4px!important;background:linear-gradient(120deg,#09263e,#0d3c5d)!important;border:1px solid rgba(255,255,255,.1)}
.cta-modern h2{color:#fff!important}
.cta-modern p{color:#b9ccd7!important}

/* Footer: strong industrial base */
.footer-sas{background:#061925!important;border-top:4px solid var(--sas-gold)!important}
.footer-bottom{border-top-color:rgba(255,255,255,.12)!important}
.social-dot{border-radius:4px!important}

/* Remove playful rotations/bounces from the previous visual pass */
.hero-media,.navbar-brand-sas img,.footer-brand img{animation:none!important}
.btn:hover{transform:translateY(-1px)!important}

/* Mobile keeps exactly the same layout logic, only tightens the visual rhythm */
@media(max-width:767.98px){
  .new-hero{min-height:600px!important}
  .row-numbered .service-card,.service-card{min-height:0!important;padding:24px 22px 22px!important}
  .row-numbered .service-card:before,.service-card:before{width:32%;opacity:.06}
  .activity-card{padding:23px!important;min-height:210px!important}
  .activity-wide{grid-column:span 2!important}
}

@media(prefers-reduced-motion:reduce){
  .service-card,.activity-card,.project-card,.contact-card,.product-tile,.technology-brand-card,.client-logo{transition:none!important}
}


/* ============================================================
   FINAL ALIGNMENT + LIVE STATS CORRECTION
   Keeps the existing HTML/layout structure unchanged.
   ============================================================ */

/* Stats: high-contrast engineering strip + animated values. */
.stats-ribbon{
  padding:0 !important;
  background:#0b3150 !important;
  color:#fff !important;
  border-top:3px solid #f2c200 !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
}
.stats-ribbon .container-xl{padding-left:0 !important;padding-right:0 !important;}
.stats-ribbon .row{margin-left:0 !important;margin-right:0 !important;}
.stat-modern{
  min-height:128px !important;
  padding:24px 18px 22px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  background:#0b3150 !important;
  border-right:1px solid rgba(255,255,255,.16) !important;
}
.stat-modern:last-child{border-right:0 !important;}
.stat-modern strong{
  display:block !important;
  min-height:50px;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-family:'Barlow Semi Condensed',sans-serif !important;
  font-size:3.15rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.2px !important;
  font-variant-numeric:tabular-nums;
}
.stat-modern strong span{color:#f2c200 !important;-webkit-text-fill-color:#f2c200 !important;}
.stat-modern small{
  display:block !important;
  margin-top:8px !important;
  color:#d3e0e8 !important;
  -webkit-text-fill-color:#d3e0e8 !important;
  font-family:'Inter',sans-serif !important;
  font-size:.73rem !important;
  font-weight:800 !important;
  letter-spacing:1.25px !important;
  text-transform:uppercase !important;
}

/* The technical-expertise row keeps four equal-height cards and aligned content. */
.technology-layout{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:16px !important;
  align-items:stretch !important;
}
.technology-brand-card{
  min-height:360px !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  padding:24px !important;
  border-radius:5px !important;
  border:1px solid #d5e1e8 !important;
  border-top:3px solid #0b67b2 !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(8,35,58,.06) !important;
}
.technology-brand-card:hover{border-top-color:#f2c200 !important;}
.technology-brand-card > img{
  width:100% !important;
  height:72px !important;
  flex:0 0 72px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 0 18px !important;
}
.technology-brand-card h3{
  min-height:44px !important;
  margin:0 0 10px !important;
  color:#0b3150 !important;
  font-family:'Barlow Semi Condensed',sans-serif !important;
  font-size:1.34rem !important;
  line-height:1.05 !important;
  font-weight:750 !important;
}
.technology-brand-card p{
  margin:0 !important;
  color:#647b8d !important;
  font-size:.86rem !important;
  line-height:1.65 !important;
}
.technology-brand-card .tech-tags{
  margin-top:auto !important;
  padding-top:18px !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:7px !important;
}
.technology-brand-card .tech-tags span{
  border-radius:3px !important;
  background:#eef4f8 !important;
  color:#17669a !important;
  border:1px solid #d7e4eb !important;
  padding:6px 9px !important;
}

/* Partner card uses the same 72px visual header height as the three brand cards. */
.technology-brand-card.partner-logos{
  background:#0b3150 !important;
  color:#fff !important;
  border-color:#0b3150 !important;
  border-top-color:#f2c200 !important;
}
.partner-logo-row{
  height:32px !important;
  margin:0 0 8px !important;
  gap:10px !important;
}
.partner-logo-row:first-child{margin-top:0 !important;}
.partner-logo-row img{
  width:calc(50% - 5px) !important;
  height:32px !important;
  object-fit:contain !important;
  background:#fff !important;
  border-radius:4px !important;
  padding:4px !important;
}
.technology-brand-card.partner-logos h3{
  min-height:44px !important;
  margin-top:10px !important;
  color:#fff !important;
}
.technology-brand-card.partner-logos p{color:#c4d3dc !important;}

/* Client testimonials: same card height, with names anchored consistently. */
.testimonial-card{
  height:100% !important;
  min-height:420px !important;
  display:flex !important;
  flex-direction:column !important;
  padding:34px 30px 28px !important;
  border:1px solid #d7e2e8 !important;
  border-top:3px solid #0b67b2 !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(8,35,58,.06) !important;
}
.testimonial-card .quote{margin-bottom:0 !important;}
.testimonial-card .who{margin-top:auto !important;padding-top:24px !important;}
.testimonial-card .quote-mark{color:#f2c200 !important;}
.testimonial-card:hover{border-top-color:#f2c200 !important;}

/* Prevent any generic reveal rule from leaving a stats strip visually blank. */
body.js-reveal-ready .stats-ribbon .stat-modern.in-view{opacity:1 !important;transform:none !important;}

@media (max-width:991.98px){
  .technology-layout{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media (max-width:767.98px){
  .stat-modern{min-height:108px !important;padding:20px 10px !important;}
  .stat-modern strong{font-size:2.5rem !important;}
  .stat-modern small{font-size:.62rem !important;letter-spacing:.8px !important;}
  .testimonial-card{min-height:0 !important;}
}
@media (max-width:575.98px){
  .technology-layout{grid-template-columns:1fr !important;}
}


/* ============================================================
   TECHNICAL EXPERTISE — vertical tree diagram (per vendor)
   ============================================================ */
.tech-tree-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:38px}
.tech-tree-card{border:1px solid #d9e8f5;border-radius:24px;background:rgba(255,255,255,.94);box-shadow:0 16px 38px rgba(19,74,130,.07);padding:28px 26px 30px;text-align:center;transition:transform .35s ease,box-shadow .35s ease}
.tech-tree-card:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(19,74,130,.12)}
.tech-tree-logo{height:52px;max-width:170px;object-fit:contain;margin:0 auto 12px;display:block}
.tech-tree-name{font-weight:800;color:#071b35;font-size:1.15rem;margin-bottom:8px}
.tech-tree-status{display:inline-block;font-size:9px;font-weight:900;letter-spacing:1px;padding:6px 11px;border-radius:999px;background:#eaf3ff;color:#0b4f9c}
.tech-tree-trunk{width:2px;height:26px;background:linear-gradient(180deg,#b9d3ec,rgba(185,211,236,.3));margin:14px auto 0}
.tech-tree-branches{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;position:relative;padding-top:16px}
.tech-tree-branches::before{content:"";position:absolute;top:0;left:10%;right:10%;height:2px;background:#b9d3ec}
.tech-tree-branches-single::before{display:none}
.tech-tree-cat{position:relative;flex:1;min-width:150px;padding-top:16px;text-align:center}
.tech-tree-cat::before{content:"";position:absolute;top:-16px;left:50%;width:2px;height:16px;background:#b9d3ec}
.tech-tree-branches-single .tech-tree-cat::before{display:none}
.tech-tree-cat b{display:block;font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;color:#0b4f9c;margin-bottom:9px}
.tech-tree-cat span{display:inline-block;margin:3px;padding:6px 10px;border-radius:999px;background:#f6faff;border:1px solid #dce9f5;color:#204259;font-size:11px;font-weight:700}
.tech-tree-card-partners{background:linear-gradient(160deg,#0b3153,#123b5c);border-color:#0b3153}
.tech-tree-card-partners .tech-tree-name,
.tech-tree-card-partners .tech-tree-note{color:#fff!important}
.tech-tree-card-partners .tech-tree-note{color:rgba(255,255,255,.75)!important;line-height:1.75;margin:18px auto 0;max-width:460px}
.tech-tree-status-alt{background:#f6c515;color:#3a2c00}
.tech-tree-card-partners .tech-tree-trunk{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.05))}
.tech-tree-card-partners .tech-tree-branches::before{background:rgba(255,255,255,.25)}
.tech-tree-card-partners .tech-tree-cat::before{background:rgba(255,255,255,.25)}
.tech-tree-card-partners .tech-tree-cat b{color:#f6c515}
.tech-tree-card-partners .tech-tree-cat span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff}
.tech-tree-partner-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:10px}
.tech-tree-partner-logos img{width:54px;height:38px;object-fit:contain;background:#fff;padding:4px;border-radius:7px}
@media(max-width:991px){
  .tech-tree-cat{min-width:130px}
}
@media(max-width:767.98px){
  .tech-tree-grid{grid-template-columns:1fr}
  .tech-tree-branches{gap:20px 12px}
  .tech-tree-cat{min-width:100%}
  .tech-tree-branches::before{display:none}
  .tech-tree-cat::before{display:none}
}

/* FINAL: supplied technical-expertise tree, styled to match the industrial theme */
.technology-map-section{
  background:linear-gradient(160deg,#eef4f8 0%,#f7fafc 100%) !important;
  position:relative; overflow:hidden;
}
.technology-map-section::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(11,99,182,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(11,99,182,.045) 1px,transparent 1px);
  background-size:42px 42px; pointer-events:none;
}
.technology-map-section > .container-xl{position:relative;z-index:1;}
.tech-tree-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.tech-tree-card{
  border-radius:8px !important;
  border:1px solid #d2e0ea !important;
  border-top:3px solid #0b63b6 !important;
  background:#fff !important;
  box-shadow:0 12px 28px rgba(7,39,67,.07) !important;
  text-align:left !important;
  padding:28px 28px 30px !important;
}
.tech-tree-card:hover{
  transform:translateY(-6px);
  border-top-color:#f2c200 !important;
  box-shadow:0 20px 42px rgba(7,39,67,.12) !important;
}
.tech-tree-logo{margin-left:0 !important;margin-right:0 !important;}
.tech-tree-name{color:#0b355c !important;}
.tech-tree-status{border-radius:3px !important;letter-spacing:1.25px;}
.tech-tree-branches{justify-content:flex-start !important;}
.tech-tree-cat{text-align:left !important;}
.tech-tree-cat::before{left:12px !important;}
.tech-tree-cat b{color:#0b63b6 !important;}
.tech-tree-cat span{
  border-radius:3px !important;
  background:#f3f7fa !important;
  border-color:#d7e4ec !important;
}
.tech-tree-card-partners{
  background:linear-gradient(145deg,#0b3150,#123e61) !important;
  border-color:#0b3150 !important;
  border-top-color:#f2c200 !important;
}
.tech-tree-card-partners .tech-tree-name,
.tech-tree-card-partners .tech-tree-note{color:#fff !important;}
.tech-tree-card-partners .tech-tree-cat b{color:#f2c200 !important;}
.tech-tree-card-partners .tech-tree-cat span{
  border-radius:3px !important;
  background:rgba(255,255,255,.08) !important;
}
@media(max-width:767.98px){
  .tech-tree-grid{grid-template-columns:1fr !important;}
  .tech-tree-card{padding:24px 22px 26px !important;}
}


/* Final card-number cleanup: remove numbering only, preserve card layout/content. */
.row-numbered .service-card::before{content:none!important;display:none!important;}
.row-numbered .service-card .icon-badge:before{content:none!important;display:none!important;}
.product-tile-number,.solution-number{display:none!important;}

/* ===== Continual-inspired industrial refinement =====
   Keeps the existing SAS section structure while strengthening the visual hierarchy. */
.stats-ribbon{background:#0b3150!important;color:#fff!important;position:relative;overflow:hidden}
.stats-ribbon:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:42px 42px;opacity:.28;pointer-events:none}
.stats-ribbon .container-xl,.stats-ribbon .row{position:relative;z-index:1}
.stat-modern{min-height:145px!important;padding:22px 20px 25px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid rgba(255,255,255,.16)!important}
.stat-modern .stat-icon{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(243,201,40,.55);color:#f3c928;background:rgba(255,255,255,.045);font-size:19px;margin-bottom:8px}
.stat-modern strong{font-size:2.25rem!important;line-height:1!important;color:#fff!important;font-weight:800!important;letter-spacing:-.5px}
.stat-modern small{margin-top:7px;color:#c7d7e2!important;font-size:.72rem!important;font-weight:700;letter-spacing:1.15px!important}

/* Capability cards: more like engineering case/capability modules than generic UI cards. */
.activity-bento{gap:14px!important}
.activity-card{border-radius:6px!important;background:#0d3554!important;border:1px solid rgba(255,255,255,.12)!important;min-height:235px!important;box-shadow:0 12px 30px rgba(3,24,40,.18);padding:30px!important}
.activity-card:after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:#f3c928;transform:scaleX(.22);transform-origin:left;transition:transform .35s ease}
.activity-card:hover:after{transform:scaleX(1)}
.activity-card:before{border-radius:0!important;width:230px!important;height:230px!important;right:-110px!important;bottom:-125px!important;border-color:rgba(243,201,40,.12)!important}
.activity-icon{border-radius:5px!important;width:52px!important;height:52px!important;background:#f3c928!important;color:#0a2d4c!important;box-shadow:none!important}
.activity-card h3{font-size:23px!important;line-height:1.1!important}

/* Make the existing gallery slot behave like the reference site's project-highlight area. */
.project-highlights-section{background:#f3f7f9!important}
.project-highlights-section:after{content:"";position:absolute;right:-120px;top:40px;width:360px;height:360px;border:1px solid rgba(11,99,182,.1);transform:rotate(45deg);pointer-events:none}
.project-highlight-grid{position:relative;z-index:1}
.project-highlight-grid .home-gallery-card{border-radius:5px!important;box-shadow:0 12px 30px rgba(8,42,70,.10)!important;border:1px solid #d6e2e8!important}
.project-highlight-grid .home-gallery-card:after{background:linear-gradient(180deg,transparent 34%,rgba(5,26,43,.9) 100%)!important}
.project-highlight-grid .home-gallery-card span{left:22px!important;bottom:20px!important}
.project-highlight-grid .home-gallery-card strong{font-size:1.15rem!important;letter-spacing:.1px}
.project-highlight-grid .home-gallery-card small{font-size:.7rem!important;letter-spacing:1px;text-transform:uppercase}

/* Applications become a stronger industrial footprint block, without changing the grid. */
.applications-section{background:#edf3f6!important;position:relative;overflow:hidden}
.applications-section:before{content:"";position:absolute;right:-90px;top:-100px;width:430px;height:430px;background-image:linear-gradient(rgba(11,99,182,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(11,99,182,.09) 1px,transparent 1px);background-size:30px 30px;transform:rotate(12deg);opacity:.8}
.applications-section>.container-xl{position:relative;z-index:1}
.application-pills{gap:10px!important}
.application-pills span{border-radius:3px!important;background:#fff!important;border-left:3px solid #0b63b6!important;box-shadow:0 7px 18px rgba(8,42,70,.05);padding:15px 18px!important;transition:transform .25s ease,background .25s ease,color .25s ease}
.application-pills span:hover{transform:translateY(-3px);background:#0b3150!important;color:#fff!important}

/* Reference-style client relationship band: keep the current marquee, make it more premium. */
.logo-marquee-section{background:#fff!important;border-top:1px solid #e2ebf0;border-bottom:1px solid #e2ebf0}
.marquee-logo{border:1px solid #dce6eb!important;border-radius:4px!important;background:#fff!important;box-shadow:0 8px 22px rgba(8,42,70,.045)}

@media(max-width:767px){
 .stat-modern{min-height:125px!important}
 .stat-modern .stat-icon{width:36px;height:36px;font-size:16px}
 .stat-modern strong{font-size:1.9rem!important}
 .project-highlights-section:after{display:none}
}

/* ============================================================
   Project & certification cards — animated treatment to match
   the polish already used on service cards site-wide.
   ============================================================ */
.project-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:16px;
}
.project-card::before{
  content:"";
  position:absolute;
  width:110px; height:110px;
  right:-45px; top:-45px;
  border-radius:50%;
  background:linear-gradient(135deg, rgba(0,176,240,.14), rgba(242,194,0,.14));
  z-index:-1;
  transition:transform .5s ease;
}
.project-card::after{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--blue-400),var(--amber-400));
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .35s ease;
}
.project-card:hover{ transform:translateY(-8px) rotateX(1deg)!important; }
.project-card:hover::before{ transform:scale(1.9); }
.project-card:hover::after{ transform:scaleY(1); }
.project-card h3{ transition:color .3s ease; }
.project-card:hover h3{ color:var(--blue-700); }
.project-card .client{ transition:color .3s ease; }
.project-card:hover .client{ color:var(--amber-600); }

.cert-card{ position:relative; overflow:hidden; }
.cert-card .icon-badge{ transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .35s ease, color .35s ease; }
.cert-card:hover .icon-badge{
  transform:rotate(-8deg) scale(1.1);
  background:var(--amber-500);
  color:#fff;
}
.cert-card .cert-status{ transition:transform .25s ease, background-color .25s ease, color .25s ease; }
.cert-card:hover .cert-status{ background:var(--amber-500); color:#fff; transform:translateY(-1px); }

@media (prefers-reduced-motion: reduce){
  .project-card, .project-card::before, .project-card::after,
  .project-card h3, .project-card .client,
  .cert-card .icon-badge, .cert-card .cert-status{
    animation:none!important; transition:none!important;
  }
}

/* ============================================================
   Animation techniques adapted from a 3D card reference:
   - forward "pop toward the viewer" hover (perspective + translateZ
     + spring-bounce easing) instead of a flat lift
   - deepened glow / brightened edge on hover
   - a soft idle "breathing" pulse on icon badges (toned down from
     a hard status-dot blink)
   - a hidden micro-cue that reveals only on hover
   Colours and surface styling stay the site's own blue/amber —
   only the motion techniques are borrowed.
   ============================================================ */

/* Give card grids real depth so translateZ reads as forward motion */
.row:has(.service-card),
.row:has(.project-card),
.row:has(.cert-card),
.row:has(.panel-type-card),
.activity-bento,
.product-showcase,
.technology-layout{
  perspective:1400px;
}

.service-card,.project-card,.cert-card,.panel-type-card,
.activity-card,.product-tile,.technology-brand-card{
  transform-style:preserve-3d;
}

.service-card:hover{
  transform:translateY(-10px) translateZ(50px) scale(1.035) rotateX(1deg)!important;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .45s ease, border-color .45s ease!important;
  box-shadow:0 30px 55px rgba(4,44,83,.22)!important;
}
.project-card:hover{
  transform:translateY(-8px) translateZ(45px) scale(1.03)!important;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .45s ease!important;
  box-shadow:0 26px 48px rgba(4,44,83,.2)!important;
}
.cert-card:hover{
  transform:translateY(-8px) translateZ(40px) scale(1.03)!important;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1), box-shadow .45s ease, border-color .45s ease!important;
  box-shadow:0 24px 46px rgba(4,44,83,.18)!important;
}
.panel-type-card:hover{
  transform:translateY(-8px) translateZ(40px) scale(1.03)!important;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .4s ease, border-color .4s ease!important;
}
.activity-card:hover{
  transform:translateY(-6px) translateZ(40px) scale(1.02)!important;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .4s ease, border-color .4s ease!important;
}
.product-tile:hover{
  transform:translateY(-6px) translateZ(35px) scale(1.03)!important;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .4s ease!important;
}
.technology-brand-card:hover{
  transform:translateY(-6px) translateZ(35px) scale(1.03)!important;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .4s ease, border-color .4s ease!important;
}

/* Title underline sweep on project cards (their ::before/::after
   are already used for the corner glow + left accent bar, so the
   "reveal" cue lives on the heading instead of a pseudo-element). */
.project-card h3{
  background-image:linear-gradient(var(--amber-500),var(--amber-500));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:0% 2px;
  transition:background-size .35s ease, color .3s ease;
  padding-bottom:2px;
}
.project-card:hover h3{ background-size:100% 2px; }

/* Hover-only reveal cue (progressive disclosure, like the demo's
   hidden detail panel) — a small arrow that fades and slides in,
   reserving no layout space so nothing shifts on hover. */
.cert-card, .panel-type-card, .technology-brand-card, .product-tile{
  position:relative;
}
.cert-card::after, .panel-type-card::after,
.technology-brand-card::after, .product-tile::after{
  content:"\2192";
  position:absolute;
  right:20px; bottom:16px;
  font-size:1.15rem;
  font-weight:700;
  color:var(--sas-blue,#0b67b2);
  opacity:0;
  transform:translateX(-8px);
  transition:opacity .3s ease, transform .3s ease;
  pointer-events:none;
}
.cert-card:hover::after, .panel-type-card:hover::after,
.technology-brand-card:hover::after, .product-tile:hover::after{
  opacity:.85;
  transform:translateX(0);
}

/* Soft idle "breathing" glow on icon badges — the same continuous-
   pulse idea as a status dot, slowed down and recoloured so it reads
   as calm rather than alarming. Pauses on hover so it doesn't fight
   the hover animation. */
@keyframes iconIdlePulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(0,120,180,.16); }
  50%{ box-shadow:0 0 0 8px rgba(0,120,180,0); }
}
.service-card .icon-badge,
.cert-card .icon-badge,
.panel-type-head .icon-badge,
.panel-type-icon{
  animation:iconIdlePulse 2.8s ease-in-out infinite;
}
.service-card:hover .icon-badge,
.cert-card:hover .icon-badge,
.panel-type-card:hover .panel-type-icon{
  animation-play-state:paused;
}

@media (prefers-reduced-motion: reduce){
  .service-card, .project-card, .cert-card, .panel-type-card,
  .activity-card, .product-tile, .technology-brand-card,
  .service-card .icon-badge, .cert-card .icon-badge,
  .panel-type-head .icon-badge, .panel-type-icon,
  .cert-card::after, .panel-type-card::after,
  .technology-brand-card::after, .product-tile::after,
  .project-card h3{
    animation:none!important; transition:none!important;
  }
}

/* Slow "breathing" zoom on the About-section photos */
@keyframes slowKenBurns{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.12); }
}
.main-shot, .small-shot{
  animation:slowKenBurns 16s ease-in-out infinite;
}
.small-shot{ animation-delay:1.5s; }

@media (prefers-reduced-motion: reduce){
  .main-shot, .small-shot{ animation:none!important; }
}


/* ============================================================
   Homepage "Panel types" section, shared heading styles.
   Desktop (≥900px) gets the scroll-driven geodesic sphere below;
   narrower screens and reduced-motion users get a plain static
   grid of the same five cards — see .panel-showcase-mobile.
   ============================================================ */
.panel-geo-section{ padding:60px 0 0; background:#0f2c46; color:#fff; }
.panel-geo-section .section-kicker{ color:var(--amber-400); }
.panel-geo-section h2{ color:#fff; }
.panel-geo-section .section-intro{ color:rgba(255,255,255,.68); }
.panel-geo-section .link-arrow{ color:#fff; }
.panel-geo-section .link-arrow:hover{ color:var(--amber-400); }

/* Static-grid fallback: hidden on desktop, shown below 900px or
   when the visitor asks for reduced motion. Reuses the original
   card styling, unchanged. */
.panel-showcase-mobile{ display:none; padding-top:16px; padding-bottom:60px; }
.panel-showcase-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
  margin-top:16px;
}

.panel-showcase-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
  margin-top:16px;
}
.panel-showcase-card{
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:#fff;
  border-radius:12px;
  overflow:hidden;
  background:linear-gradient(160deg,#0d3355,#082948);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 14px 30px rgba(0,0,0,.25);
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.panel-showcase-media{
  height:150px;
  overflow:hidden;
}
.panel-showcase-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.85);
  transition:transform .5s ease, filter .3s ease;
}
.panel-showcase-body{ padding:16px 16px 4px; flex:1 0 auto; }
.panel-showcase-body i{ color:var(--amber-400); font-size:1.3rem; }
.panel-showcase-body h3{
  color:#fff;
  font-size:1rem;
  font-weight:700;
  margin:10px 0 0;
  line-height:1.3;
}
.panel-showcase-detail{
  display:block;
  margin:8px 0 0;
  font-size:.82rem;
  line-height:1.6;
  color:rgba(255,255,255,.72);
}
.panel-showcase-more{
  display:flex;
  align-items:center;
  gap:5px;
  margin:12px 16px 16px;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--amber-400);
}

.panel-showcase-card:hover{
  transform:translateY(-6px);
  color:#fff;
  border-color:rgba(224,192,0,.55);
  box-shadow:0 24px 44px rgba(0,0,0,.4), 0 0 0 1px rgba(224,192,0,.25);
}
.panel-showcase-card:hover .panel-showcase-media img{
  transform:scale(1.08);
  filter:saturate(1);
}

@media(max-width:1199px){
  .panel-showcase-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:767px){
  .panel-showcase-grid{ grid-template-columns:repeat(2,1fr); }
  .panel-showcase-media{ height:130px; }
}
@media(max-width:575px){
  .panel-showcase-grid{ grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce){
  .panel-showcase-card, .panel-showcase-media img{
    transition:none!important;
  }
}

/* ============================================================
   Desktop geodesic sphere. A lighter navy backdrop (not the
   near-black of the original neon reference) with a soft
   amber/blue glow, a rotating dot-and-line sphere on canvas, and
   five real panel cards fixed at 72° apart. Scrolling through the
   pinned wrapper below turns the sphere in five discrete stops —
   whichever card lands facing the camera settles there and stays
   sharp, so nothing is ever caught mid-spin.
   ============================================================ */
.panel-geo-pinned{ position:relative; height:1780px; }
/* Position is toggled in JS between static / fixed / absolute-at-
   bottom as the page scrolls (see main.js). This site sets
   overflow-x:hidden on html,body to keep other sections from
   causing horizontal scroll, which in Chromium silently disables
   position:sticky on any descendant — so the pin is done by hand
   here instead of relying on sticky. */
.panel-geo-sticky{
  position:absolute; top:0; left:0; width:100%;
  height:780px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(224,192,0,.16) 0%, rgba(47,128,237,.10) 38%, transparent 68%),
    linear-gradient(165deg,#123a5c 0%,#0f2f4c 55%,#0c2843 100%);
}
.panel-geo-sticky.is-pinned{ position:fixed; top:0; }

.panel-geo-active-label{
  position:relative; z-index:5;
  display:flex; align-items:center; gap:12px;
  margin-bottom:6px;
}
.geo-active-index{
  font-size:.72rem; font-weight:800; letter-spacing:.1em;
  color:var(--amber-400);
  border:1px solid rgba(224,192,0,.4);
  border-radius:20px;
  padding:4px 12px;
}
.geo-active-name{
  font-size:1rem; font-weight:700; color:#fff;
}

.panel-geo-viewport{
  position:relative;
  perspective:1400px;
  width:100%;
  height:620px;
  display:flex; justify-content:center; align-items:center;
  overflow:hidden;
}
.panel-geo-canvas{
  position:absolute; top:50%; left:50%;
  width:740px; height:740px;
  margin:-370px 0 0 -370px;
  pointer-events:none;
  z-index:1;
}
.panel-geo-sphere{
  position:relative; z-index:2;
  width:1px; height:1px;
  transform-style:preserve-3d;
  transform:rotateY(0deg);
  transition:transform .8s cubic-bezier(.16,1,.3,1);
}

.geo-ring{
  position:absolute; top:50%; left:50%;
  width:330px; height:330px;
  margin:-165px 0 0 -165px;
  border-radius:50%;
  border:1px dashed rgba(0,176,240,.28);
  pointer-events:none;
}
.geo-ring-1{ transform:rotateX(78deg); }
.geo-ring-2{ width:264px; height:264px; margin:-132px 0 0 -132px; transform:rotateX(78deg) rotateZ(55deg); border-color:rgba(224,192,0,.22); }

.geo-core{
  position:absolute; top:50%; left:50%;
  width:24px; height:24px;
  margin:-12px 0 0 -12px;
  border-radius:50%;
  background:var(--amber-400);
  box-shadow:0 0 18px var(--amber-400), 0 0 40px rgba(224,192,0,.4);
}

.geo-card{
  position:absolute; top:50%; left:50%;
  width:250px;
  margin:-130px 0 0 -125px;
  transform:rotateY(var(--angle)) translateZ(310px);
  backface-visibility:hidden;
  display:block;
  text-decoration:none;
  color:#fff;
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(160deg,#12395c,#0a2843);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 14px 30px rgba(0,0,0,.35);
  opacity:.55;
  transition:opacity .6s ease, border-color .6s ease, box-shadow .6s ease, transform .8s cubic-bezier(.16,1,.3,1);
}
.geo-card img{
  width:100%; height:115px;
  object-fit:cover; display:block;
  filter:saturate(.85);
}
.geo-card-body{ padding:14px 16px 16px; }
.geo-card-body h3{
  color:#fff; font-size:1rem; font-weight:700;
  margin:0; line-height:1.25;
}
.geo-card-info i{ color:var(--amber-400); font-size:1.2rem; }
.geo-card-info p{
  display:block; margin:8px 0 0;
  font-size:.85rem; line-height:1.5;
  color:rgba(255,255,255,.7);
}
.geo-card-more{
  display:flex; align-items:center; gap:5px;
  margin-top:10px;
  font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
  color:var(--amber-400);
}

/* Collapsed by default: only the image + name show. The icon,
   description and "more info" link live in here and only open
   up once the card is clicked/selected (see .is-selected below). */
.geo-card-info{
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease;
}
.geo-card.is-selected .geo-card-info{
  max-height:260px;
  opacity:1;
  margin-top:10px;
  transition:max-height .45s ease, opacity .35s ease .1s, margin-top .45s ease;
}

/* The card currently facing the camera — set by JS via
   .is-active, not :hover, since which card is "front" is a
   function of sphere rotation, not pointer position. */
.geo-card.is-active{
  opacity:1;
  z-index:10;
  border-color:rgba(255,255,255,.3);
  box-shadow:0 20px 40px rgba(0,0,0,.4);
}

.panel-geo-dots{
  position:relative; z-index:5;
  display:flex; gap:10px;
  margin-top:14px;
}
.geo-dot{
  width:9px; height:9px;
  padding:0; border-radius:50%;
  border:1px solid rgba(255,255,255,.4);
  background:transparent;
  cursor:pointer;
  transition:background .3s ease, border-color .3s ease, transform .3s ease;
}
.geo-dot.active{
  background:var(--amber-400);
  border-color:var(--amber-400);
  transform:scale(1.2);
}

@media(min-width:900px){
  .panel-showcase-mobile{ display:none!important; }
}

@media(max-width:899px){
  .panel-geo-pinned{ display:none; }
  .panel-showcase-mobile{ display:block; }
}

@media (prefers-reduced-motion: reduce){
  .panel-geo-pinned{ display:none; }
  .panel-showcase-mobile{ display:block; }
}

/* ============================================================
   Interactive panel sphere: selected-card glow + detail drawer
   ============================================================ */
.panel-geo-sticky{ isolation:isolate; }
.panel-geo-viewport{ overflow:visible; }
.geo-card{ cursor:pointer; user-select:none; }
.geo-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  border-radius:14px;
  opacity:0;
  background:radial-gradient(ellipse at center, rgba(0,211,255,.38), transparent 68%);
  filter:blur(13px);
  transition:opacity .35s ease;
}
.geo-card.is-selected{
  border-color:rgba(224,192,0,.95);
  box-shadow:0 30px 60px rgba(0,0,0,.52), 0 0 0 1px rgba(224,192,0,.45), 0 0 28px rgba(224,192,0,.42), 0 0 65px rgba(0,190,255,.2);
}
.geo-card.is-selected::before{ opacity:1; }
.geo-card.is-selected .geo-card-more{ color:#fff; }
.geo-card.is-selected .geo-card-more i{ transform:translate(3px,-3px); }
.geo-card-more i{ transition:transform .25s ease; }


/* Curved brand header, shared by every page. */
.navbar-sas{
  transform:translateY(0);
  transition:transform .65s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;
}
.navbar-sas.is-hidden{
  /* Include the curved logo extending below the navigation bar. */
  transform:translateY(calc(-100% - 80px));
  pointer-events:none;
}
@media (prefers-reduced-motion:reduce){
  .navbar-sas{ transition:none; }
}
.navbar-sas.fixed-top{ border-bottom:0 !important; }
.navbar-sas ~ .page-header{ padding-top:calc(var(--nav-h) + 4.5rem) !important; }
.navbar-sas,
.navbar-sas.is-scrolled{
  padding:0;
  min-height:76px;
  background:#fff;
  backdrop-filter:none;
  border-bottom:0;
  box-shadow:0 2px 12px rgba(4,44,83,.09);
}
.navbar-sas > .container-xl{
  position:relative;
  max-width:1500px;
  min-height:76px;
  padding-inline:32px;
}
.navbar-brand-sas{
  position:relative;
  isolation:isolate;
  align-self:flex-start;
  justify-content:center;
  flex:0 0 260px;
  width:260px;
  height:76px;
  padding:0;
  margin:0 24px 0 0;
}
.navbar-brand-sas::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  left:50%;
  width:360px;
  height:140px;
  transform:translateX(-50%);
  background:url('../assets/img/logo/header-curve.svg') center top / 100% 100% no-repeat;
  pointer-events:none;
}
.navbar-brand-sas img{
  position:absolute;
  top:8px;
  width:100px;
  height:116px;
  max-width:none;
  object-fit:contain;
  animation:none;
}
.navbar-brand-sas .brand-text{ display:none; }
.navbar-sas .navbar-collapse{ min-width:0; }
.navbar-sas .navbar-nav{ width:100%; justify-content:space-between; gap:2px; }
.navbar-sas .nav-link{
  padding:26px 9px !important;
  font-size:.875rem;
  font-weight:700;
  white-space:nowrap;
}
.navbar-sas .nav-link:not(.dropdown-toggle)::after{
  left:9px;
  right:9px;
  bottom:17px;
}
.navbar-sas .nav-cta{ margin-left:20px; }
.navbar-sas .nav-cta .btn{
  background:#f2c200;
  border-color:#f2c200;
  color:#142331;
  border-radius:9px;
  padding:12px 20px;
  font-size:.875rem;
  white-space:nowrap;
  box-shadow:0 3px 10px rgba(242,194,0,.18);
}
.navbar-sas .nav-cta .btn:hover{ background:#ffda32; border-color:#ffda32; }
.navbar-sas .navbar-toggler{ margin-block:18px; border-color:#dce4e9; }
html{ scroll-padding-top:calc(var(--nav-h) + 68px); }
@media (min-width:1200px) and (max-width:1399.98px){
  .navbar-sas > .container-xl{ padding-inline:24px; }
  .navbar-brand-sas{ flex-basis:210px; width:210px; margin-right:16px; }
  .navbar-brand-sas::before{ width:300px; }
  .navbar-sas .nav-link{ padding-inline:7px !important; font-size:.81rem; }
  .navbar-sas .nav-cta{ margin-left:10px; }
  .navbar-sas .nav-cta .btn{ padding-inline:14px; }
}
@media (max-width:1199.98px){
  .navbar-sas > .container-xl{ padding-inline:24px; }
  .navbar-brand-sas{ flex-basis:180px; width:180px; margin-right:0; }
  .navbar-brand-sas::before{ width:260px; height:120px; }
  .navbar-brand-sas img{ width:82px; height:98px; top:7px; }
  .navbar-sas .navbar-collapse{
    position:relative;
    z-index:1;
    flex-basis:100%;
    margin-top:44px;
    padding:12px 0 20px;
    max-height:calc(100dvh - 130px);
    overflow-y:auto;
    background:#fff;
  }
  .navbar-sas .nav-link{ padding:11px 12px !important; font-size:.95rem; }
  .navbar-sas .nav-cta{ margin:10px 12px 0; }
  .navbar-sas .nav-link.active{ background:#f0faff; border-radius:6px; }
}
@media (max-width:575.98px){
  .navbar-sas > .container-xl{ padding-inline:18px; }
  .navbar-brand-sas{ flex-basis:140px; width:140px; }
  .navbar-brand-sas::before{ width:210px; height:112px; }
  .navbar-brand-sas img{ width:76px; height:90px; }
}

/* Hero typography: precision assembly reveal with a gentle machine-idle float. */
#heroSlider .hero-content-block > :is(.hero-eyebrow, h1, .hero-copy, .hero-actions, .hero-trust){
  animation:none;
}
#heroSlider .hero-content-block.is-active .hero-eyebrow{
  opacity:1;
  animation:machineAssemble .7s cubic-bezier(.16,1,.3,1) .6s both;
}
#heroSlider .hero-content-block.is-active h1{
  animation:machineAssemble .95s cubic-bezier(.16,1,.3,1) .8s backwards,
    machineFloat 5.5s ease-in-out 1.75s infinite;
}
#heroSlider .hero-copy{
  position:relative;
  padding-left:18px;
  border-left:1px solid rgba(244,201,26,.3);
}
#heroSlider .hero-content-block.is-active .hero-copy{
  animation:machineAssemble .95s cubic-bezier(.16,1,.3,1) 1.75s backwards,
    machineFloat 6.5s ease-in-out 2.7s infinite;
}
#heroSlider .hero-copy::before{
  content:"";
  position:absolute;
  left:-2px;
  top:0;
  width:3px;
  height:22px;
  background:#f4c91a;
  box-shadow:0 0 10px rgba(244,201,26,.3);
  pointer-events:none;
}
#heroSlider .hero-content-block.is-active .hero-copy::before{
  animation:machineScan 4s ease-in-out infinite;
}
#heroSlider .hero-content-block.is-active .hero-eyebrow > span{
  transform-origin:left;
  animation:machineSignal 3s ease-in-out infinite;
}
#heroSlider .hero-content-block.is-active .hero-actions{
  animation:machineAssemble .8s cubic-bezier(.16,1,.3,1) 2.7s backwards;
}
#heroSlider .hero-content-block.is-active .hero-trust{
  animation:machineAssemble .8s cubic-bezier(.16,1,.3,1) 3s backwards;
}
@keyframes machineAssemble{
  from{opacity:0;transform:translate3d(-16px,12px,0);clip-path:inset(0 100% 0 0)}
  to{opacity:1;transform:translate3d(0,0,0);clip-path:inset(0 0 0 0)}
}
@keyframes machineFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-5px,0)}
}
@keyframes machineScan{
  0%,100%{top:0;opacity:.65}
  50%{top:calc(100% - 22px);opacity:1}
}
@keyframes machineSignal{
  0%,100%{transform:scaleX(1);opacity:1}
  50%{transform:scaleX(.5);opacity:.5}
}
@media (prefers-reduced-motion:reduce){
  #heroSlider .hero-content-block.is-active > :is(.hero-eyebrow, h1, .hero-copy, .hero-actions, .hero-trust),
  #heroSlider .hero-content-block.is-active .hero-copy::before,
  #heroSlider .hero-content-block.is-active .hero-eyebrow > span{
    animation:none;
    opacity:1;
    transform:none;
    clip-path:none;
  }
}

/* =====================================================================
   Panel names (from the client's Elect_Panels PPT) shown on each photo
   ===================================================================== */
.gallery-item .panel-name{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:2.2rem .85rem .7rem;
  background:linear-gradient(transparent, rgba(4,25,42,.92));
  color:#fff;
  font-family:'Barlow Semi Condensed',sans-serif;
  font-size:1rem; font-weight:600; line-height:1.2; letter-spacing:.01em;
  pointer-events:none;
}
/* the category pill moves to the top so it never covers the name */
.gallery-item.has-name .tag{ top:.6rem; bottom:auto; z-index:2; }

/* name under the photo when it is opened full-screen */
.lightbox-caption{
  position:absolute; left:0; right:0; bottom:1.2rem;
  text-align:center; color:#fff; padding:0 1rem;
  font-family:'Barlow Semi Condensed',sans-serif; font-size:1.25rem; font-weight:600;
  text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.lightbox-caption:empty{ display:none; }
.lightbox-overlay img{ max-height:80vh; }


/* Field electrification (turnkey E&C) featured card on Projects page */
.field-ec-card{ padding:1.75rem 1.9rem; }
.field-ec-card h3{ font-size:1.35rem; }
.field-ec-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:1rem 1.5rem; }
.field-ec-list li{ display:flex; gap:.8rem; align-items:flex-start; }
.field-ec-list li > i{
  flex:0 0 38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; background:#eef4f8; color:#17679b; font-size:1.1rem;
  transition:background-color .25s ease, color .25s ease, transform .3s ease;
}
.field-ec-list li:hover > i{ background:#F2D400; color:#061B33; transform:rotate(-6deg) scale(1.06); }
.field-ec-list li span{ font-size:.9rem; line-height:1.5; color:var(--ink-soft); }
.field-ec-list li strong{ display:block; color:var(--ink); font-size:.95rem; margin-bottom:.1rem; }
@media(max-width:767px){ .field-ec-list{ grid-template-columns:1fr; } .field-ec-card{ padding:1.4rem 1.2rem; } }