/* ==========================================================================
   Imperial Automation & Controls — Light Glass Theme (Responsive)
   Fonts: Saira (headings 600), Roboto (body)
   Brand: #081B25
   NOTE: Full CSS for index.html + site.js hooks
   ==========================================================================
*/

:root{
  --brand:#081B25;         /* rgb(8,27,37) */
  --ink:#0E2330;           /* body text */
  --muted:#5B6D77;         /* secondary text */
  --accent:#0F3142;        /* links/accents */
  --warning:#FFB155;
  --success:#1d9e6e;
  --skyshade:#9fc7ff;
  --sky-1:#e6f3ff;   /* very light sky */
  --sky-2:#ffffff;   /* white blend */
  --sky-ink:#0F3142; /* deep blue ink */

  --maxw:1200px;
  --radius:16px;
  --maxvh:1400px;
  --sticky-offset:72px; /* updated by JS */

  /* Light glass theme */
  --bg-0:#ffffff00;
  --bg-1:#ffffff;
  --glass: rgba(255,255,255,.8);
  --stroke: rgba(8,27,37,.10);
  --shadow: 0 10px 20px rgba(8,27,37,.08), inset 0.5px 1.5px 0 rgba(255,255,255,.8);

  /* Layering */
  --z-header: 60;
  --z-modal: 11000;
  --z-modal-dialog: 11001;
  --z-login-modal: 12000;
  --z-overlay: 13000;
  --z-preloader: 14000;
}

/* Base Reset */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(1200px 800px at 10% -10%, var(--bg-1) 0%, var(--bg-0) 45%, #FFFFFF 100%);
  font: 400 clamp(16px, 0.95vw, 18px)/1.6 "Roboto", ui-sans-serif, system-ui, -apple-system, Segoe UI, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  overflow-x:hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.is-preloading{overflow:hidden}

.site-preloader{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  background:#e2e2e2;
  color:#081b25;
  z-index:var(--z-preloader);
  transition:opacity 1s ease, visibility 1s ease;
  overflow:hidden;
}

.site-preloader.is-hidden{opacity:0; visibility:hidden; pointer-events:none;}

.site-preloader__inner{display:grid; gap:18px; justify-items:center; text-align:center; position:relative; z-index:1;}

.site-preloader .preloader-icon{
  width:clamp(112px,18vw,160px);
  height:auto;
  filter:drop-shadow(0 22px 48px rgba(8,27,37,.18));
  transform-origin:center;
  transform:scale(.5);
  animation:preloaderZoom 1.2s cubic-bezier(.55,.1,.2,.9) forwards .4s;
}

.site-preloader .cls-1,
.site-preloader .cls-1-2{transform-box:fill-box; transform-origin:center;}

.site-preloader .cls-1{
  opacity:0;
  fill:#011c26;
  animation:preloaderAssemble 1.2s cubic-bezier(.55,.1,.2,.9) forwards;
  animation-iteration-count:1;
  animation-fill-mode:forwards;
}

.site-preloader .cls-1-2{
  opacity:0;
  animation:preloaderSlice 1.2s cubic-bezier(.55,.1,.2,.9) forwards;
  animation-iteration-count:1;
  animation-delay:.2s;
  animation-fill-mode:forwards;
}

.site-preloader .cls-2{
  opacity:0;
  animation:preloaderPanel 1.2s ease-out forwards;
  animation-iteration-count:1;
  animation-delay:.4s;
  animation-fill-mode:forwards;
  fill:#c9d1d9;
}

@keyframes preloaderAssemble{
  0%{opacity:0; transform:translate(-32px,-32px) scale(.78);}
  60%{opacity:1; transform:translate(6px,6px) scale(1.04);}
  100%{opacity:1; transform:translate(0,0) scale(1);}
}

@keyframes preloaderSlice{
  0%{opacity:0; transform:translate(30px,24px) rotate(18deg) scale(.76);}
  55%{opacity:1; transform:translate(-4px,-4px) rotate(-6deg) scale(1.05);}
  100%{opacity:1; transform:translate(0,0) rotate(0deg) scale(1);}
}

@keyframes preloaderPanel{
  0%{opacity:0; transform:translateY(24px) scale(.68);}
  45%{opacity:.95; transform:translateY(-4px) scale(1.03);}
  100%{opacity:1; transform:translateY(0) scale(1);}
}

@keyframes preloaderZoom{
  0%{transform:scale(.5);}
  100%{transform:scale(.9);}
}

@media (prefers-reduced-motion: reduce){
  .site-preloader,
  .site-preloader .cls-1,
  .site-preloader .cls-1-2,
  .site-preloader .cls-2{
    animation:none !important;
    transition:none !important;
  }
  .site-preloader .cls-1,
  .site-preloader .cls-1-2,
  .site-preloader .cls-2{opacity:1 !important; transform:none !important;}
}
a{color:inherit; text-decoration:none}
img{max-width:100%; height:auto; display:block}
:focus-visible{ outline:2px solid var(--brand); outline-offset:2px }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }

/* Headings: Saira 600 */
h1,h2,h3,h4,h5,h6,.section-title{
  font-family:"Saira", sans-serif;
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--brand);
}

/* Highlighted Section Titles */
.section-title, h2 {
  position: relative;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.2;
  margin-bottom: 18px;
  text-align: center;
  background: linear-gradient(90deg, var(--brand), #0B3A52, #5B6D77);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.section-title::after {
  content: "";
  display: block;
  width: 80px;
  height: 4px;
  margin: 10px auto 0;
  border-radius: 2px;
  background: linear-gradient(90deg, #0B3A52, var(--skyshade), #0B3A52);
  animation: pulse 4s infinite;
}
@keyframes pulse { 0%, 100% { opacity: 0.4; transform: scaleX(2.9); } 50% { opacity: 1; transform: scaleX(3); } }

/* Sub Paragraphs */
.section-sub, .sub, section p {
  font-size: 1rem;
  line-height: 1.8;
  max-width: 820px;
  margin: 0 auto 18px;
  color: #2d3f4a;
  text-align: center;
  font-weight: 400;
  opacity: 0.95;
  transition: color 0.3s ease;
}
.section-sub:hover, .sub:hover { color: var(--brand); }

/* Emphasize auto-filled service name in Notes */
#note.note-prefilled { font-weight: 600; }

/* Subtle grid & noise overlays */
.bg-grid:before, .bg-noise:after{ content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; }
.bg-grid:before{
  background-image:
    linear-gradient(rgba(8,27,37,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,27,37,.04) 1px, transparent 1px);
  background-size: 60px 60px, 60px 60px;
  mask-image: radial-gradient(1000px 1000px at 50% 10%, #000 40%, transparent 100%);
}
.bg-noise:after{
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="140" height="140"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="2" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23n)" opacity="0.03"/></svg>');
  mix-blend-mode: multiply; opacity:.25;
}

/* Layout */
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(16px, 5vw, 24px)}

@media (min-width:1280px){
  :root{ --maxw:1240px; }
}

@media (min-width:1536px){
  :root{ --maxw:1320px; }
  .wrap{ padding-inline: clamp(24px, 3.5vw, 40px); }
}

@media (min-width:1800px){
  :root{ --maxw:1440px; }
}

@media (min-width:1400px){
  section{ padding: clamp(64px, 6vw, 120px) 0; }
}
section{padding: clamp(48px, 5vw, 96px) 0}
@media (max-width: 640px){ .mobile-hide{display: none; } .section-sub, .sub, section p {
    font-size: 0.9rem;} }

/* Header */
.site-header{
  position:sticky; top:0; z-index:50;
  backdrop-filter:saturate(1.15) blur(10px);
  background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.6));
  border-bottom:1px solid var(--stroke);
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 12px}
.brand{display:flex; align-items:center; gap:12px}
.logo{height:50px; display:grid; place-items:center}
.logo img{height:50px; width:auto}

/* Primary Nav */
.primary-nav{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.primary-nav a{ opacity:.9; padding:10px 12px; border-radius:12px; border:1px solid transparent; font-weight:500; }
.primary-nav a:hover{border-color:var(--stroke); background:rgba(8,27,37,.05)}
.primary-nav .profile-button{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 22px; border-radius:999px; border:1px solid rgba(120,176,238,.55);
  background:linear-gradient(135deg, rgba(146,190,255,.35), rgba(40,115,196,.85));
  color:#f4fbff; font-weight:600;
  cursor:pointer; transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  box-shadow:0 14px 32px rgba(28,96,162,.28), inset 0 1px 0 rgba(255,255,255,.42);
  backdrop-filter: blur(12px) saturate(1.25);
}
.primary-nav .profile-button:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(28,96,162,.32);
  background:linear-gradient(135deg, rgba(168,208,255,.45), rgba(26,92,168,.88));
}
.primary-nav .profile-button:active{
  transform:translateY(0);
  box-shadow:0 10px 24px rgba(28,96,162,.3);
}
.profile-button__icon{ display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.18); box-shadow:inset 0 1px 2px rgba(255,255,255,.35); }
.primary-nav .profile-button svg{ color:inherit; }
.profile-button__label{ display:inline-block; letter-spacing:.01em; }
.primary-nav .profile-button:focus-visible{ outline:2px solid #2269b2; outline-offset:2px; }

/* Mobile nav toggle */
.nav-toggle{ display:inline-flex; flex-direction:column; gap:4px; padding:10px 8px; border:1px solid var(--stroke); border-radius:10px; background:rgba(255,255,255,.7); }
.nav-toggle-bar{width:22px; height:2px; background:var(--brand); display:block}
@media (min-width:980px){ .nav-toggle{display:none} }

/* Mobile nav behavior */
@media (max-width:979.98px){
  .primary-nav{
    position:fixed; right:16px; left:16px;
    top: var(--sticky-offset, 72px);
    display:grid; gap:6px; padding:12px;
    background:rgba(255,255,255,.95); border:1px solid var(--stroke);
    border-radius:16px; transform: translateY(-12px) scale(.98);
    opacity:0; pointer-events:none; transition: .25s ease;
    box-shadow: 0 16px 40px rgba(8,27,37,.12);
  }
  .primary-nav.open{ opacity:1; pointer-events:auto; transform: translateY(0) scale(1); }
  .primary-nav .profile-button{ width:100%; justify-content:center; }
}

/* Buttons */
.btn{
  font-family:inherit;
  font-size:16px;
  background: linear-gradient(to bottom, #0F3142 0%, #081B25 100%);
  color:#ffffff;
  padding:.75em 1.1em;
  display:inline-flex; align-items:center; justify-content:center;
  border:none; border-radius:25px;
  box-shadow:0 5px 10px rgba(0,0,0,.2);
  transition: transform .3s, box-shadow .3s, background .3s, color .3s;
  white-space:nowrap;
}
.btn:hover{ transform: translateY(-3px); box-shadow:0 8px 15px rgba(0,0,0,.3);  color:#b3d6f2; }
.btn:active{ transform: scale(.97); box-shadow:0 2px 5px rgba(0,0,0,.2) }
.btn span{ display:block; margin-left:.4em; transition: all .3s }
.btn svg{ width:18px; height:18px; fill:#ffffff; transition: transform .3s }
.btn .svg-wrapper{ display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background-color: rgba(255,255,255,.2); margin-right:.5em; transition: background-color .3s }
.btn:hover .svg-wrapper{ background-color: rgba(10, 34, 79, 0.5) }
.btn:hover svg{ transform: rotate(45deg) }
.cta-button{ color:white}
.cta-button:hover {color:#081B25;}
.svg-wrapper-1{ display:flex; align-items:center }

/* Secondary pill */
.pill{
  padding:10px 14px;
  border-radius:14px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.7);
  color:var(--brand);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.pill .pill__icon{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  flex-shrink:0;
  display:block;
}
.pill span{ display:inline-block; }

/* Hover lift */
.hover-raise{transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s}
.hover-raise:hover{transform: translateY(-3px); box-shadow: 0 16px 40px rgba(8,27,37,.12)}

/* Hero */
.hero{position:relative; min-height:88vh; display:grid; place-items:center}
.hero-inner{display:grid; gap:20px; text-align:center}
.eyebrow{color:var(--muted); letter-spacing:.28em; text-transform:uppercase; font-weight:600; font-size:.8rem}
.headline{line-height:1.06; font-size:clamp(35px, 6.6vw, 64px); margin:0; font-weight:700}
.sub{color:#354d5a; max-width:820px; margin:0 auto}

/* Cards / Glass */
.glass{
  background: linear-gradient(45deg, rgba(230, 243, 255, 0.85) 0%, rgba(255, 255, 255, 0.88) 100%);
  border:0.5px solid var(--stroke);
  border-radius:var(--radius);
  backdrop-filter: blur(12px) saturate(1.05);
  box-shadow: var(--shadow);
}
.hero-card{display:flex; gap:12px; align-items:center; justify-content:center; padding:12px; flex-wrap:wrap}

/* Split */
.split{display:grid; gap:24px; align-items:start}
@media (min-width:900px){ .split{grid-template-columns: 1.1fr .9fr} }

/* ================================
Services Grid + Cards
================================ */
.services-grid{ display:grid; gap:14px; grid-template-columns:1fr; margin-top:16px; }
@media (min-width:700px){ .services-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (min-width:1080px){ .services-grid{ grid-template-columns: repeat(3, 1fr); } }
.service-item{ position:relative; padding:18px; text-align:left; cursor:pointer; border-radius:18px; border:1px solid rgba(8,27,37,.10); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.service-item h3{ margin:6px 0 4px; font-size:18px; color:var(--brand) }
.service-item p{ margin:0; color:#2d3f4a; font-size:14px; text-align:left; }


/* Modern check badge */
.service-item .check{
position:absolute; right:12px; top:12px;
width:40px; height:40px; border-radius:5rem;
background: linear-gradient(180deg, #0F3142, #081B25);
border: 1px solid rgba(8,27,37,.18);
box-shadow: 0 6px 14px rgba(8,27,37,.25), inset 0 2px 4px rgba(255,255,255,.15);
display:flex; align-items:center; justify-content:center;
transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
overflow:hidden; /* for the sheen */
}
/* vector check using CSS mask (crisp on any DPI) */
.service-item .check::before{
content:""; width:25px; height:25px; background:#fff;
-webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="white" d="M7.6 14.6L3.3 10.3l1.4-1.4 2.9 2.9 7.1-7.1 1.4 1.4z"/></svg>') center/contain no-repeat;
mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="white" d="M7.6 14.6L3.3 10.3l1.4-1.4 2.9 2.9 7.1-7.1 1.4 1.4z"/></svg>') center/contain no-repeat;
opacity:.92;
}
/* subtle animated sheen */
.service-item .check::after{
content:""; position:absolute; inset:-40%; transform: rotate(25deg) translateX(-140%);
background: linear-gradient(90deg, transparent 0%, rgb(255 255 255 / 35%) 45%, rgba(255,255,255,.2) 60%, transparent 100%);
transition: transform .6s ease;
}
.service-item:hover .check,
.service-item:focus-within .check{ transform: translateY(-2px); box-shadow: 0 10px 22px rgb(8 27 37 / 15%), inset 0 3px 6px rgba(255,255,255,.2); }
.service-item:hover .check::after,
.service-item:focus-within .check::after{ transform: rotate(25deg) translateX(40%); }

/* PLC Jobs */
.plc-jobs{ margin-top:72px; min-height:100vh; padding:80px 0; display:flex; align-items:center; }
.plc-jobs__layout{ display:grid; gap:32px; justify-items:center; align-items:center; width:100%; text-align:center; }
.plc-jobs__visual{ position:relative; width:min(700px, 100%); aspect-ratio:16/10; border-radius:32px; overflow:hidden; box-shadow:0 28px 64px rgba(1,28,38,.28); background:linear-gradient(155deg, rgba(1,28,38,.75), rgba(1,28,38,.45)); isolation:isolate; }
.plc-jobs__visual-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.35) brightness(1); transition:transform .6s ease, filter .6s ease; }
.plc-jobs__visual::after{ content:\"\"; position:absolute; inset:0; background:linear-gradient(180deg, rgba(1,28,38,.05) 0%, rgba(1,28,38,.05) 100%); mix-blend-mode:none; pointer-events:none; }
.plc-jobs__visual:hover .plc-jobs__visual-img{ transform:scale(1.05); filter:saturate(.5) brightness(.88); }
.plc-jobs__badge{ position:absolute; left:32px; bottom:32px; display:flex; align-items:center; justify-content:center; width:132px; height:132px; border-radius:28px; background:rgba(1,28,38,.9); box-shadow:0 24px 48px rgba(1,28,38,.42), inset 0 2px 6px rgba(255,255,255,.12); }
.plc-jobs__badge img{ width:60%; height:auto; display:block; filter:drop-shadow(0 8px 18px rgba(0,0,0,.35)); }
.plc-jobs__content{ display:grid;margin-left: 2rem; gap:28px; max-width:580px; justify-items:center; }
.plc-jobs__head{ display:grid; gap:14px; justify-items:center; text-align:center; }
.plc-jobs__head .view-catalogue{ margin:10px auto 0; }
.plc-jobs__grid{ display:grid; gap:14px; grid-template-columns:1fr; }
.plc-job-card{ min-height:160px; }
.plc-job-card h3{ font-size:17px; }
.plc-job-card p{ font-size:13.5px; }

@media (min-width:700px){
  .plc-jobs__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width:900px){
  .plc-jobs__layout{ grid-template-columns:minmax(320px, .95fr) minmax(360px, 1fr); justify-items:start; text-align:left; }
  .plc-jobs__content{ justify-items:start; text-align:left; }
  .plc-jobs__head{ max-width:none; }
  .plc-jobs__head .view-catalogue{ margin:14px 0 0; }
}
@media (min-width:1080px){
  .plc-jobs__visual{ width:min(580px, 45vw); aspect-ratio:16/9; }
  .plc-jobs__badge{ width:148px; height:148px; left:40px; bottom:40px; }
}
@media (min-width:1200px){
  .plc-jobs__grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.modal--plc .modal-dialog{ max-width:min(100%, 960px); }
.modal--plc .modal-body{ max-height:70vh; overflow-y:auto; }
.contact-modal .modal-dialog{ max-width:min(100%, 760px); width:min(100%, 760px); padding:0; }
.contact-modal__dialog{ padding:0; }
.contact-modal__content{ padding:32px 28px; border-radius:inherit; display:block; }
.contact-modal .contact-card{ margin:0 auto; max-width:640px; }
.contact-modal .modal-close{ top:14px; right:16px; }
@media (max-width:720px){
  .contact-modal__content{ padding:26px 18px; }
}
/* Optional selected state if you add .selected or aria-pressed="true" on card */
.service-item.selected .check,
.service-item[aria-pressed="true"] .check{
background: linear-gradient(180deg, #1c9e6e, #157d56);
border-color: rgba(21,125,86,.6);
}


.service-item:hover{ transform: translateY(-3px); border-color: rgba(8,27,37,.18); box-shadow: 0 16px 40px rgba(8,27,37,.10) }


/* ================================
Modal (Services Details)
================================ */
.modal{ position:fixed; inset:0; z-index:var(--z-modal); display:grid; place-items:center; padding:20px; opacity:0; pointer-events:none; transition: opacity .25s ease; }
.modal[aria-hidden="false"]{ opacity:1; pointer-events:auto; }
.modal-backdrop{ position:absolute; inset:0; z-index:0; background:rgba(8,27,37,.45); backdrop-filter: blur(4px); }
.modal-dialog{ position:relative; z-index:var(--z-modal-dialog); max-width:760px; width:min(100%, 760px); padding:18px; }
.modal-close{ position:absolute; top:10px; right:12px; background:transparent; border:none; font-size:28px; line-height:1; cursor:pointer; color:#345; }
.modal-head{ padding:6px 6px 0 6px; }
.modal-head h3{ margin:4px 0; font-size:22px }
.modal-sub{ margin:0 0 8px 0; color:#4a5c66; text-align:left }
.modal-body{ padding:6px }
.modal-bullets{ margin:0; padding-left:18px; display:grid; gap:6px; color:#2f4554 }
.modal-actions{ display:flex; justify-content:flex-end; padding:10px 6px 6px 6px }

/* ================================
   Industries — Glass Sky Blue Cards
   ================================ */
.industries { position: relative; }
.industries-grid{ display:grid; gap:16px; grid-template-columns: 1fr; margin-top: 14px; }
@media (min-width:760px){ .industries-grid{ grid-template-columns: repeat(2,1fr); } }
@media (min-width:1140px){ .industries-grid{ grid-template-columns: repeat(3,1fr); } }
.industry-card{ position:relative; display:grid; gap:10px; padding:20px; border-radius:20px; border:1px solid rgba(8,27,37,.12); color: var(--sky-ink); transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease; outline: none; }
.industry-card p{ font-size: 1rem; text-align: left; }
.industry-card:focus-visible{ box-shadow: 0 0 0 4px rgba(8,27,37,.12); }
.glass-sky{ background: linear-gradient(45deg, var(--sky-1) 0%, var(--sky-2) 100%); backdrop-filter: blur(14px) saturate(1.06); box-shadow: 0 14px 40px rgba(8,27,37,.12), inset 0.5px 1.5px 0 rgba(255,255,255,.8); }
.industry-card:hover{ transform: translateY(-5px) scale(1.02); border-color: rgba(8,27,37,.18); box-shadow: 0 20px 54px rgba(8,27,37,.16), inset 0.5px 1.5px 0 rgba(255,255,255,.85); }
.industry-head{ display:flex; align-items:center; gap:12px; }
.industry-head h3{ margin:0; font-size:18px; color: var(--brand); }
.industry-icon{ display:grid; place-items:center; width:36px; height:36px; border-radius:12px; background: linear-gradient(180deg, #0F3142, #081B25); color:#fff; box-shadow: 0 6px 14px rgba(8,27,37,.25), inset 0 2px 4px rgba(255,255,255,.15); }
.industry-bullets{ margin:0; padding-left:18px; display:grid; gap:6px; color:#2f4554; font-size: 14px; }
.industry-bullets li{ line-height:1.5; }
.industry-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:2px; }
.industry-chips .chip{ background: rgba(8,27,37,.06); border: 1px solid rgba(8,27,37,.1); color:#4B5A62; padding:6px 10px; font-size:12px; }
.industry-card::after{ content:""; position:absolute; inset:0; background: radial-gradient(600px 200px at 10% -10%, rgba(255,255,255,.6), transparent 60%); opacity:0; transition: opacity .35s ease; pointer-events:none; }
.industry-card:hover::after{ opacity:.5; }
@media (prefers-reduced-motion: reduce){ .industry-card, .industry-card::after{ transition:none } }

/* ================================
   Partners (with Background Image)
   ================================ */
#partners{ position:relative; overflow:hidden; padding: clamp(56px, 7vw, 104px) 0; color:var(--brand); border-radius:1rem; background:linear-gradient(160deg, rgba(230,243,255,.86), rgba(255,255,255,.92)); }
#partners::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 15% 25%, rgba(88,164,215,.22), transparent 60%), radial-gradient(circle at 80% 30%, rgba(8,27,37,.12), transparent 70%); z-index:-2; }
#partners::after{ content:""; position:absolute; inset:0; background: radial-gradient(circle at 16% 30%, rgba(88,164,215,.22), transparent 60%), radial-gradient(circle at 82% 36%, rgba(8,27,37,.16), transparent 70%); z-index:-1; opacity:.35; }
#partners .section-title{ margin-bottom: clamp(18px, 3vw, 28px); }
#partners .section-sub{ max-width:960px; margin:0 auto clamp(28px, 5vw, 44px); color:var(--muted); background:rgba(255,255,255,.78); border-radius:22px; padding: clamp(18px, 5vw, 32px); border:1px solid rgba(8,27,37,.08); box-shadow:0 18px 48px rgba(8,27,37,.08); }

.logo-strip{ position:relative; overflow:hidden; display:flex; gap: clamp(24px, 5vw, 48px); padding-inline: clamp(18px, 4vw, 32px); mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.82) 14%, rgba(0,0,0,.82) 86%, transparent 100%); -webkit-mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.82) 14%, rgba(0,0,0,.82) 86%, transparent 100%); }
.strip-track{ display:flex; align-items:center; gap: clamp(16px, 4vw, 36px); padding-block: clamp(14px, 3vw, 22px); animation: partners-marquee 60s linear infinite; flex:0 0 auto; min-width:100%; }
.strip-track img{ width: clamp(160px, 18vw, 220px); height: clamp(72px, 8vw, 96px); object-fit:contain; filter:grayscale(10%); opacity:.94; transition: transform .3s ease, filter .3s ease, opacity .3s ease; padding-inline: clamp(10px, 2.4vw, 16px); flex:0 0 auto; background: linear-gradient(135deg, #eaf6ff, #cfe8ff); border-radius:1rem; box-shadow:0 14px 34px rgba(8,27,37,.12); padding-block: clamp(12px, 3.4vw, 18px); }
.strip-track img:hover{ transform:scale(1.05); filter:none; opacity:1; }
.strip-track[aria-hidden="true"]{ animation: partners-marquee 60s linear infinite; animation-delay:-30s; }

@keyframes partners-marquee{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}

@media (max-width:640px){
  .logo-strip{ mask-image:none; -webkit-mask-image:none; gap:24px; }
  .strip-track{ gap:36px; }
  .strip-track img{ width: clamp(140px, 46vw, 190px); height: 72px; }
}

@media (prefers-reduced-motion: reduce){
  .strip-track, .strip-track[aria-hidden="true"]{ animation:none; }
  .logo-strip{ flex-wrap:wrap; justify-content:center; gap: clamp(18px, 5vw, 28px); }
}

/* ================================
   Reviews Slider
   ================================ */
.reviews-slider{
  display: none;
  background:none;
  padding: clamp(48px, 7vw, 96px) 0;
}
.reviews-slider .reviews-intro{
  text-align:center;
  max-width:640px;
  margin:0 auto clamp(32px, 6vw, 48px);
}
.reviews-slider .reviews-intro .section-sub{ color:var(--muted); }
.reviews-slider .container{
  position:relative;
  overflow:hidden;
  border-radius:1rem;
  margin-inline:auto;
  max-width:var(--maxw);
  box-shadow:0 30px 80px rgba(8,27,37,.28);
}
@media (max-width:1000px){ .reviews-slider .container{ border-radius:1rem; } }
@media (max-width:680px){
  .reviews-slider .container{ border-radius:1rem; }
  .reviews-slider .slider{ border-radius:0.75rem; }
}

.reviews-slider .slider{
  display:flex;
  width:500%;
  height:clamp(360px, 52vw, 520px);
  transition:transform .45s cubic-bezier(.23,.76,.32,1);
}
@media (max-width:1000px){
  .reviews-slider .slider{ height:clamp(380px, 68vh, 520px); }
}
@media (max-width:650px){
  .reviews-slider .slider{ height:clamp(420px, 82vh, 560px); }
}

.reviews-slider .slider .box{
  height:100%;
  width:100%;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  align-items:center;
  overflow:hidden;
  position:relative;
}
@media (max-width:650px){
  .reviews-slider .slider .box{
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
  }
}

.reviews-slider .slider .bg{
  background:rgba(255,255,255,.05);
  width:67%;
  transform:skewX(8deg);
  position:absolute;
  inset:0 auto 0 -12%;
  transform-origin:0 100%;
  filter:blur(0.2px);
}
.reviews-slider .slider .bg::before{
  content:"";
  position:absolute;
  inset:0;
  background:inherit;
  transform:skewX(10deg);
}
@media (max-width:800px){
  .reviews-slider .slider .bg{ width:70%; }
}
@media (max-width:650px){
  .reviews-slider .slider .bg{
    width:98%;
    inset:auto 0 0 0;
    height:52%;
    transform:skewX(0deg);
  }
  .reviews-slider .slider .bg::before{ transform:skewX(0deg); }
}

.reviews-slider .details{
  padding: clamp(32px, 6vw, 64px);
  padding-right: clamp(28px, 6vw, 56px);
  padding-left: clamp(64px, 9vw, 128px);
  z-index:2;
  grid-column:1 / span 1;
  grid-row:1 / -1;
  max-width:420px;
  text-align:left;
}
@media (max-width:650px){
  .reviews-slider .details{
    grid-row:2 / span 1;
    grid-column:1 / -1;
    padding: clamp(24px, 8vw, 40px);
    padding-left: clamp(32px, 11vw, 52px);
    margin-inline:auto;
    text-align:left;
  }
}
.reviews-slider .details h1{
  font-size: clamp(2.1rem, 4vw, 3rem);
  font-weight:600;
  margin:0 0 1rem;
  color:#fff;
}
.reviews-slider .details p{
  font-size:0.9rem;
  line-height:1.7;
  color:rgba(227,240,247,.86);
  margin:0 0 1.6rem;
  text-align:left;
}
@media (max-width:800px){ .reviews-slider .details p{ margin-right:0; } }
.reviews-slider .details .rating{
  font-size:1.1rem;
  letter-spacing:.2em;
  color:#ffcf4d;
  text-shadow:0 4px 8px rgba(8,27,37,.35);
  margin-top:1.2rem;
  display:inline-block;
}

.reviews-slider .illustration{
  grid-column:2 / -1;
  grid-row:1 / -1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding-inline: clamp(16px, 4vw, 32px);
}
@media (max-width:650px){
  .reviews-slider .illustration{
    grid-row:1 / span 1;
    grid-column:1 / -1;
    padding-bottom: clamp(12px, 4vw, 24px);
  }
}
.reviews-slider .illustration .inner{
  height: clamp(220px, 28vw, 300px);
  width: clamp(150px, 18vw, 210px);
  border-radius:32px;
  background:linear-gradient(160deg, rgba(255,255,255,.14) 0%, rgba(32,103,143,.9) 45%, rgba(8,27,37,.95) 100%);
  position:relative;
  transform:skewX(-8deg);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(8,27,37,.35);
}
.reviews-slider .illustration .inner::after,
.reviews-slider .illustration .inner::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.12), transparent);
}
.reviews-slider .illustration .inner::after{ transform:translate(3.6rem, -1rem); opacity:.4; }
.reviews-slider .illustration .inner::before{ transform:translate(2rem, -2.2rem); opacity:.25; }
@media (max-width:800px){
  .reviews-slider .illustration .inner{ transform:skewX(-4deg); }
}

.reviews-slider .box1{
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.08), transparent 40%),
    linear-gradient(135deg, #081b25, #0f3142);
}
.reviews-slider .box2{
  background:
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.07), transparent 45%),
    linear-gradient(135deg, #0f3142, #185068);
}
.reviews-slider .box3{
  background:
    radial-gradient(circle at 20% 15%, rgba(255,255,255,.07), transparent 45%),
    linear-gradient(135deg, #0e2330, #123b52);
}
.reviews-slider .box4{
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.07), transparent 45%),
    linear-gradient(135deg, #0b2635, #154b60);
}
.reviews-slider .box5{
  background:
    radial-gradient(circle at 22% 16%, rgba(255,255,255,.07), transparent 45%),
    linear-gradient(135deg, #0f3142, #20506a);
}

.reviews-slider .prev,
.reviews-slider .next,
.reviews-slider .trail{
  z-index:10;
  position:absolute;
  color: white;
}
.reviews-slider .prev,
.reviews-slider .next{
  width:3.2rem;
  cursor:pointer;
  top:50%;
  transform:translateY(-50%);
  filter:drop-shadow(0 12px 20px rgba(8,27,37,.35));
  transition:transform .3s ease, filter .3s ease, opacity .3s ease;
  opacity:.65;
}
.reviews-slider .prev:hover,
.reviews-slider .next:hover{ transform:translateY(-50%) scale(1.05); opacity:1; filter:drop-shadow(0 18px 28px rgba(8,27,37,.4)); }
.reviews-slider .prev{ left:2%; }
.reviews-slider .next{ right:2%; }
@media (max-width:650px){
  .reviews-slider .prev,
  .reviews-slider .next{ display:none; }
}

.reviews-slider .trail{
  bottom:6%;
  left:50%;
  transform:translateX(-50%);
  width:min(72%, 620px);
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:0.75rem;
  text-align:center;
  font-size:1.2rem;
}
.reviews-slider .trail div{
  padding:1rem;
  border-top:3px solid rgba(255,255,255,.38);
  cursor:pointer;
  opacity:.38;
  transition:opacity .3s ease, transform .3s ease;
  font-weight:500;
}
.reviews-slider .trail div:hover{ opacity:.7; transform:translateY(-2px); }
@media (max-width:650px){
  .reviews-slider .trail{
    width:90%;
    bottom:10%;
    font-size:1rem;
  }
  .reviews-slider .trail div{ padding:0.75rem; }
}

.reviews-slider .trail .active{
  opacity:1 !important;
  font-weight:600;
  border-top-color:#58a4d7;
}

.reviews-slider .slider .box{ color:#fff; }
/* ================================
   Facility + Map Card
   ================================ */
.facility-banner{ display:grid; gap:10px; padding:18px }
.facility-badge{ display:inline-block; background: #e7f3ff; color:#0b3650; border:1px solid rgba(8,27,37,.12); border-radius:999px; padding:6px 10px; font-size:12px; font-weight:600; width:max-content }
.facility-h{ margin:0; font-size:20px }
.facility-sub{ margin:0; color:#456; text-align:left; }
.equip-list{ margin:8px 0 0 0; padding-left:18px; display:grid; gap:6px; color:#2f4554 }

.map-card{ display:grid; gap:12px; padding:16px }
.map-card h1{ margin:0 0 6px 0; font-size:18px }
.map-embed{ box-sizing:border-box; height:580px; max-height:580px; min-height:400px; border-radius:14px; border:1px solid rgba(8,27,37,.1); box-shadow: 0 10px 30px rgba(8,27,37,.10) }
.map-open{ width:max-content; }

/* ================================
   Contact Button (Custom CTA)
   ================================ */
.contact-btn { display: inline-flex; align-items: center; justify-content: center; padding: 11px 20px; text-decoration: none; font-size: 18px; color: white; background: #081B25; transition: box-shadow .3s, transform .2s; box-shadow: 6px 6px 0 #939292; transform: skewX(-15deg); border: none; cursor: pointer; border-radius: 10px; }
.contact-btn:hover { box-shadow: 8px 8px 0 #8dd2fd; transform: skewX(-15deg) translateY(-2px); }
.contact-span { transform: skewX(15deg); }
.contact-icon { width: 20px; height: 20px; margin-left: 18px; position: relative; top: 0; }
.contact-one, .contact-two, .contact-three { stroke: white; stroke-width: 2; }
.contact-one { transition: .4s; transform: translateX(-60%); }
.contact-two { transition: .5s; transform: translateX(-30%); }
.contact-btn:hover .contact-three { animation: contact-color-anim 1s infinite .2s; }
.contact-btn:hover .contact-one { transform: translateX(0%); animation: contact-color-anim 1s infinite .6s; }
.contact-btn:hover .contact-two { transform: translateX(0%); animation: contact-color-anim 1s infinite .4s; }
@keyframes contact-color-anim { 0% { stroke: white; } 50% { stroke: #c2d1ff; } 100% { stroke: white; } }

/* ===== CONTACT: Modern gradient + 3D ===== */
.contact-gradient{ position: relative; color: var(--brand); border-radius: 22px; padding: clamp(8px, 2vw, 64px); box-shadow: none; overflow: hidden; }
.contact-gradient::before{ content:""; position:absolute; inset:auto 0 0 0; height: 60%; background: radial-gradient(closest-side, rgba(255,255,255,.35), transparent 65%); transform: translate3d(0,0,1px) rotate(12deg); pointer-events:none; opacity:.6; transition: transform 1s ease, box-shadow 1s ease-in; }

.contact-card.glass{ background: linear-gradient(45deg, #e6f3ff 0%, #ffffff 100%); border-radius: 20px; padding: clamp(18px, 4vw, 28px); border: 0.05px solid rgba(8,27,37,.7); box-shadow: var(--shadow), 0 18px 50px rgba(8,27,37,.12); backdrop-filter: blur(16px) saturate(1.08); transform: rotateX(0deg) rotateY(0deg) translateZ(0); transition: transform .55s cubic-bezier(.22,.8,.24,1), box-shadow .55s ease, filter .55s ease; transform-style:preserve-3d; }
.contact-head{ text-align:center; margin-bottom: 10px; }
.contact-head .section-title{ color: var(--brand); }
.contact-head .section-sub{ color: #4C5F6A; }

/* Form grid */
.contact-simple{ display: grid; grid-template-columns: 1fr; gap: 14px; max-width: 920px; margin: 0 auto; }
@media (min-width: 800px){ .contact-simple{ grid-template-columns: repeat(2, 1fr); } .contact-simple .field-full{ grid-column: 1 / -1; } .actions{ grid-column: 1 / -1; } }
@media (min-width: 640px){ .contact-gradient{padding: clamp(36px, 6vw, 64px);} }
.contact-simple .form-message{ grid-column:1 / -1; margin:0; font-size:.95rem; line-height:1.4; min-height:1.4rem; color:rgba(8,27,37,.8); }
.contact-simple .form-message.is-error{ color:#b4231a; }
.contact-simple .form-message.is-success{ color:#146c43; }
@media (max-width: 640px){ section{ padding: 36px 0; } }

/* Fields (floating labels) */
.field{ position: relative; display: grid; }
.field input, .field textarea{width: 100%;border: 1px solid rgba(8,27,37,.15);border-radius: 14px;padding: 14px;background: rgb(255 255 255);color: var(--brand);outline: none;transition: border-color .2s, box-shadow .2s, background .2s;}
.field textarea{ resize: vertical; min-height: 150px; }
.field input::placeholder, .field textarea::placeholder{ color: #00000000; }
.field label{ position: absolute; left: 12px; top: 8px;border-radius: 2rem;border: 1px solid #081b257d; padding: 0px 10px; color: var(--muted); background: #f0f8ff; transition: transform .15s ease, color .2s ease; pointer-events:none; }
.field input:focus, .field textarea:focus{ border-color: rgba(8,27,37,.35); box-shadow: 0 8px 24px rgba(8,27,37,.10); background:#fff; }
.field input:not(:placeholder-shown) + label,
.field textarea:not(:placeholder-shown) + label,
.field input:focus + label,
.field textarea:focus + label{ transform: translateY(-18px) scale(.92); color: var(--brand); }

.actions{ display:flex; justify-content:center; }
.connect-btn{ padding-inline: 22px }

/* ===== Overlays: visibility control ===== */
.submit-overlay,
.success-overlay{
  display:none;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
}
.submit-overlay{ background:#e8e8e8; z-index: var(--z-overlay); }
.success-overlay{
  background:#e8e8e8;
  z-index: calc(var(--z-overlay) + 1);
  opacity: 0;
  transform: scale(1.02);
  transition: opacity .25s ease, transform .25s ease;
}
.submit-overlay.show{ display:flex; }
.success-overlay.show{ display:flex; opacity:1; transform: scale(1); }

/* ===== Success popup card ===== */
.success-card{
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 18px 22px;
  border-radius: 16px;
  border: 1px solid rgba(8,27,37,.14);
  background: rgba(255,255,255,.75);
  color: var(--brand, #081B25);
  box-shadow: 0 18px 50px rgba(8,27,37,.18);
  transform: translateY(6px);
  animation: pop-in .5s ease forwards;
}
.success-icon{
  display:grid; place-items:center;
  width:56px; height:56px; border-radius:50%;
  background: linear-gradient(180deg, #0F3142, #081B25);
  color: #fff;
  box-shadow: 0 8px 16px rgba(8,27,37,.25);
}
@keyframes pop-in{
  0%{ transform: translateY(6px) scale(.98); opacity:.6 }
  100%{ transform: translateY(0) scale(1); opacity:1 }
}

/* ===== 3D Loader (boxes) ===== */
.loader {
  --duration: 3s;
  --primary: rgba(7, 27, 45, 1);
  --primary-light: #081B25;
  --primary-rgba: rgba(10, 30, 254, 0);
  width: 200px; height: 320px; position: relative; transform-style: preserve-3d;
}
@media (max-width: 480px){ .loader { zoom: 0.44; } }
.loader:before,
.loader:after {
  --r: 20.5deg;
  content: ""; width: 320px; height: 140px; position: absolute; right: 32%; bottom: -11px;
  background: #e8e8e8; transform: translateZ(200px) rotate(var(--r));
  animation: mask var(--duration) linear infinite forwards;
}
.loader:after { --r: -20.5deg; right: auto; left: 32%; }

/* ground plane */
.loader .ground{ position: absolute; left: -50px; bottom: -120px; transform-style: preserve-3d; transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1); }
.loader .ground div{
  transform: rotateX(90deg) translate(-48px, -120px) translateZ(100px) scale(0);
  width: 200px; height: 200px;
  background: linear-gradient(45deg, var(--primary) 10%, var(--primary) 30%, var(--primary-light) 20%, var(--primary-light) 100%);
  transform-style: preserve-3d;
  animation: ground var(--duration) linear infinite forwards;
}
.loader .ground div:before,
.loader .ground div:after{
  --rx: 90deg; --ry: 0deg; --x: 44px; --y: 162px; --z: -50px;
  content: ""; width: 156px; height: 300px; opacity: 0;
  background: linear-gradient(var(--primary), var(--primary-rgba));
  position: absolute;
  transform: rotateX(var(--rx)) rotateY(var(--ry)) translate(var(--x), var(--y)) translateZ(var(--z));
  animation: ground-shine var(--duration) linear infinite forwards;
}
.loader .ground div:after { --rx: 90deg; --ry: 90deg; --x: 0; --y: 177px; --z: 150px; }

/* boxes */
.loader .box { --x: 0; --y: 0; position: absolute; animation: var(--duration) linear infinite forwards; transform: translate(var(--x), var(--y)); }
.loader .box div{
  background-color: var(--primary);
  width: 48px; height: 48px; position: relative;
  transform-style: preserve-3d;
  animation: var(--duration) ease infinite forwards;
  transform: rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0);
}
.loader .box div:before,
.loader .box div:after{
  --rx: 90deg; --ry: 0deg; --z: 24px; --y: -24px; --x: 0; --b: 1.2;
  content: ""; position: absolute; background-color: inherit;
  width: inherit; height: inherit; filter: brightness(var(--b,1.2));
  transform: rotateX(var(--rx)) rotateY(var(--ry)) translate(var(--x), var(--y)) translateZ(var(--z));
}
.loader .box div:after{ --rx: 0deg; --ry: 90deg; --x: 24px; --y: 0; --b: 1.4; }

/* positions + names */
.loader .box.box0{ --x:-220px; --y:-120px; left:58px; top:108px; }   .loader .box0{ animation-name: box-move0; } .loader .box0 div{ animation-name: box-scale0; }
.loader .box.box1{ --x:-260px; --y:120px;  left:25px;  top:120px; }   .loader .box1{ animation-name: box-move1; } .loader .box1 div{ animation-name: box-scale1; }
.loader .box.box2{ --x:120px;  --y:-190px; left:58px;  top:64px;  }   .loader .box2{ animation-name: box-move2; } .loader .box2 div{ animation-name: box-scale2; }
.loader .box.box3{ --x:280px;  --y:-40px;  left:91px;  top:120px; }   .loader .box3{ animation-name: box-move3; } .loader .box3 div{ animation-name: box-scale3; }
.loader .box.box4{ --x:60px;   --y:200px;  left:58px;  top:132px; }   .loader .box4{ animation-name: box-move4; } .loader .box4 div{ animation-name: box-scale4; }
.loader .box.box5{ --x:-220px; --y:-120px; left:25px;  top:76px;  }   .loader .box5{ animation-name: box-move5; } .loader .box5 div{ animation-name: box-scale5; }
.loader .box.box6{ --x:-260px; --y:120px;  left:91px;  top:76px;  }   .loader .box6{ animation-name: box-move6; } .loader .box6 div{ animation-name: box-scale6; }
.loader .box.box7{ --x:-240px; --y:200px;  left:58px;  top:87px;  }   .loader .box7{ animation-name: box-move7; } .loader .box7 div{ animation-name: box-scale7; }

@keyframes box-move0{12%{transform:translate(var(--x),var(--y))}25%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale0{6%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}14%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move1{16%{transform:translate(var(--x),var(--y))}29%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale1{10%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}18%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move2{20%{transform:translate(var(--x),var(--y))}33%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale2{14%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}22%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move3{24%{transform:translate(var(--x),var(--y))}37%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale3{18%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}26%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move4{28%{transform:translate(var(--x),var(--y))}41%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale4{22%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}30%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move5{32%{transform:translate(var(--x),var(--y))}45%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale5{26%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}34%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move6{36%{transform:translate(var(--x),var(--y))}49%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale6{30%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}38%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}
@keyframes box-move7{40%{transform:translate(var(--x),var(--y))}53%,52%{transform:translate(0,0)}80%{transform:translate(0,-32px)}90%,100%{transform:translate(0,188px)}}
@keyframes box-scale7{34%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(0)}42%,100%{transform:rotateY(-47deg) rotateX(-15deg) rotateZ(15deg) scale(1)}}

@keyframes ground{
  0%,65%{transform:rotateX(90deg) translate(-48px,-120px) translateZ(100px) scale(0)}
  75%,90%{transform:rotateX(90deg) translate(-48px,-120px) translateZ(100px) scale(1)}
  100%{transform:rotateX(90deg) translate(-48px,-120px) translateZ(100px) scale(0)}
}
@keyframes ground-shine{ 0%,70%{opacity:0} 75%,87%{opacity:.2} 100%{opacity:0} }
@keyframes mask{ 0%,65%{opacity:0} 66%,100%{opacity:1} }


/* Footer */
.site-footer{ margin-top: clamp(48px, 6vw, 96px); padding: clamp(36px, 6vw, 72px) 0 36px; background: linear-gradient(160deg, rgba(196,226,255,.22), rgba(32,91,140,.4)); backdrop-filter: blur(16px); color:rgba(6,23,32,.86); position:relative; overflow:hidden; border-top:1px solid rgba(255,255,255,.25); }
.site-footer::before{ content:""; position:absolute; inset:-40% 0 0 0; background: radial-gradient(circle at 12% 18%, rgba(188,220,255,.6), transparent 60%), radial-gradient(circle at 80% 20%, rgba(32,91,140,.4), transparent 65%); opacity:.6; pointer-events:none; filter:blur(2px); animation: footerGlow 18s linear infinite; }
.site-footer .wrap{ position:relative; z-index:1; }
.site-footer::after{ content:""; position:absolute; inset:0; background: radial-gradient(circle at 16% 30%, rgba(88,164,215,.22), transparent 60%), radial-gradient(circle at 82% 36%, rgba(8,27,37,.16), transparent 70%); opacity:.35; pointer-events:none; animation: footerSweep 24s ease-in-out infinite; }
.footer-grid{ display:grid; gap: clamp(24px, 4vw, 48px); grid-template-columns: repeat(3, minmax(0, 1fr)); align-items:start; }
.footer-brand{ max-width:320px; display:grid; gap:12px; }
.footer-logo img{ display:block; max-width:180px; filter: drop-shadow(0 8px 18px rgba(32,91,140,.35)); }
.footer-desc{ margin:0; font-size:.95rem; line-height:1.8; color:rgba(6,23,32,.7); }
.footer-nav h3,
.footer-contact h3{ margin:0 0 10px; font-size:1rem; text-transform:uppercase; letter-spacing:.12em; color:rgba(6,23,32,.6); }
.footer-nav ul,
.footer-contact ul{ list-style:none; margin:0; padding:0; display:grid; gap:10px; font-size:.95rem; }
.footer-nav a,
.footer-contact a{ color:#1f4d72; text-decoration:none; border-bottom:1px solid transparent; transition:color .25s ease, border-color .25s ease; }
.footer-nav a:hover,
.footer-contact a:hover{ color:#2269b2; border-color:#2269b2; }
.footer-contact span{ color:rgba(6,23,32,.7); }
.footer-bottom{ margin-top: clamp(28px, 4vw, 48px); padding-top:24px; border-top:1px solid rgba(255,255,255,.25); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.9rem; color:rgba(6,23,32,.62); }
.footer-credits{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.made-by a{ color:#1f4d72; font-weight:600; text-decoration:none; border-bottom:1px solid transparent; transition:color .25s ease, border-color .25s ease; }
.made-by a:hover{ color:#2269b2; border-color:#2269b2; }
.skip-top{ color:#1f4d72; text-decoration:none; border-bottom:1px solid transparent; transition:color .25s ease, border-color .25s ease; }
.skip-top:hover{ color:#2269b2; border-color:#2269b2; }

@media (max-width:860px){
  .footer-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:640px){
  .footer-grid{ grid-template-columns:1fr; }
  .footer-brand{ max-width:none; }
}
.skip-top{font-size:.9rem; text-decoration:underline}

/* Utilities */
.mt-18{ margin-top:18px }
.center{text-align:center; display:grid; gap:12px; padding:28px}

/* Login Modal */
.login-modal{ position:fixed; inset:0; z-index:var(--z-login-modal); display:grid; place-items:center; padding:24px; background:rgba(8,27,37,.45); backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition: opacity .25s ease; }
.login-modal.is-open{ opacity:1; pointer-events:auto; }
.login-modal__backdrop{ position:absolute; inset:0; }
.login-modal__dialog{ position:relative; max-width:520px; width:100%; background:linear-gradient(145deg, rgba(232,244,255,.96), #ffffff); border-radius:24px; padding:28px 28px 32px; border:1px solid rgba(8,27,37,.1); box-shadow:0 28px 60px rgba(8,27,37,.22); display:grid; gap:18px; }
.login-modal__close{ position:absolute; top:12px; right:12px; border:none; background:rgba(8,27,37,.08); color:var(--brand); width:34px; height:34px; border-radius:50%; font-size:22px; line-height:1; cursor:pointer; display:grid; place-items:center; }
.login-modal__close:hover{ background:rgba(8,27,37,.16); }
.login-modal__intro{ color:#2a3f4c; margin:0 0 4px; }
.login-modal__choice-grid{ display:grid; gap:12px; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); }
.login-modal__choice{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:16px 20px; border-radius:25px; border:1px solid rgba(255,255,255,.25); background:linear-gradient(145deg, #0F3142 0%, #081B25 100%); color:#f7fbff; cursor:pointer; text-align:left; box-shadow:0 16px 36px rgba(8,27,37,.24); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; width:100%; }
.login-modal__choice:focus-visible{ outline:2px solid #58a4d7; outline-offset:3px; }
.login-modal__choice--outline{ background:linear-gradient(145deg, rgba(232,244,255,.95), #ffffff); color:var(--brand); border:1px solid rgba(8,27,37,.18); box-shadow:0 12px 30px rgba(8,27,37,.18); }
.login-modal__choice:hover{ transform:translateY(-4px); box-shadow:0 20px 44px rgba(8,27,37,.28); border-color:rgba(255,255,255,.4); }
.login-modal__choice--outline:hover{ border-color:rgba(8,27,37,.28); }
.login-modal__choice-title{ font:600 1.05rem "Saira",sans-serif; color:inherit; }
.login-modal__choice--outline .login-modal__choice-title{ color:var(--brand); }
.login-modal__choice-sub{ font-size:.85rem; color:rgba(247,251,255,.8); }
.login-modal__choice--outline .login-modal__choice-sub{ color:#2a3f4c; }
.login-modal__view{ display:grid; gap:16px; }
.login-modal__view[hidden]{ display:none; }
.login-modal__back{ justify-self:start; padding:10px 14px; border-radius:999px; border:1px solid rgba(8,27,37,.2); background:rgba(255,255,255,.8); color:var(--brand); cursor:pointer; }
.login-modal__form{ display:grid; gap:14px; }
.login-modal__form-grid{ display:grid; gap:12px; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); }
.login-modal__field{ font-size:.9rem; color:#1f3240; display:grid; gap:6px; }
.login-modal__field input,
.login-modal__field select{ padding:10px 12px; border-radius:12px; border:1px solid rgba(8,27,37,.18); background:white; font-family:inherit; }
.login-modal__field select{ cursor:pointer; }
.login-modal__field input:focus{ outline:2px solid #2269b2; border-color:#2269b2; }
.login-modal__field select:focus{ outline:2px solid #2269b2; border-color:#2269b2; }
.login-modal__field--position[hidden]{ display:none; }
.login-modal__submit{ justify-self:start; }
.login-modal__submit--client{ background:linear-gradient(135deg, #8bd4ff 0%, #4faef7 100%); box-shadow:0 12px 32px rgba(79,174,247,.32); }
.login-modal__submit--client:hover{ color:#0e2f44; box-shadow:0 16px 36px rgba(79,174,247,.38); }
.login-modal__hint{ margin:4px 0 0; font-size:.8rem; color:#2a3f4c; }
.login-modal__hint--credentials{ text-align:center; margin-top:8px; }
.login-modal__hint strong{ color:var(--brand); }
.login-modal__error{ display:none; margin:0 0 6px; color:#c0392b; font-size:.85rem; font-weight:600; }
.login-modal__error.is-visible{ display:block; }
.login-modal__field input.is-invalid{ border-color:#c0392b; box-shadow:0 0 0 2px rgba(192,57,43,.18); }
.login-modal__field input.shake{ animation: loginShake .45s ease both; }

@media (max-width:520px){
  .login-modal__dialog{ padding:24px 20px 28px; }
  .login-modal__form-grid{ grid-template-columns:1fr; }
}

@keyframes loginShake{
  0%{ transform:translateX(0); }
  20%{ transform:translateX(-8px); }
  40%{ transform:translateX(8px); }
  60%{ transform:translateX(-6px); }
  80%{ transform:translateX(6px); }
  100%{ transform:translateX(0); }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Print */
@media print{
  .nav-toggle, .primary-nav, .submit-overlay, .success-overlay, .review-nav{ display:none !important }
  .glass, .glass-sky{ box-shadow:none !important; border-color:#ccc }
}
.logo-strip{ position:relative; overflow:hidden; display:flex; gap: clamp(36px, 6vw, 72px); padding-inline: clamp(18px, 4vw, 32px); mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.82) 14%, rgba(0,0,0,.82) 86%, transparent 100%); -webkit-mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.82) 14%, rgba(0,0,0,.82) 86%, transparent 100%); }
.strip-track{ display:flex; align-items:center; gap: clamp(16px, 4vw, 36px); padding-block: clamp(14px, 3vw, 22px); animation: partners-marquee 60s linear infinite; }
.strip-track img{ width: clamp(160px, 18vw, 220px); height: clamp(72px, 8vw, 96px); object-fit:contain; filter:grayscale(10%); opacity:.94; transition: transform .3s ease, filter .3s ease, opacity .3s ease; margin-inline: clamp(10px, 2.4vw, 16px); background: linear-gradient(135deg, #eaf6ff, #cfe8ff); border-radius:1rem; box-shadow:0 0px 14px rgba(8,27,37,.15); padding-block: clamp(12px, 3.4vw, 18px); padding-inline: clamp(10px, 2.4vw, 16px); }
.strip-track img + img{ margin-left: clamp(12px, 3vw, 18px); }
.strip-track img:hover{ transform:scale(1.05); filter:none; opacity:1; }
.strip-track[aria-hidden="true"]{ animation: partners-marquee 60s linear infinite; animation-delay:-30s; }

@keyframes footerGlow{
  0%{ transform:translateY(0) scale(1); opacity:.6; }
  50%{ transform:translateY(8%) scale(1.06); opacity:.5; }
  100%{ transform:translateY(0) scale(1); opacity:.6; }
}

@keyframes footerSweep{
  0%{ transform:translateX(-4%) rotate(0.4deg); opacity:.28; }
  50%{ transform:translateX(4%) rotate(-0.4deg); opacity:.38; }
  100%{ transform:translateX(-4%) rotate(0.4deg); opacity:.28; }
}