/* =========================================================================
   FIXMAN PRO — landing page
   Design language adapted from the Triple/NewPower "v3" system:
   Fabs display type, near-monochrome navy base + brand-blue accent,
   hairline borders, restrained motion, line icons.
   ========================================================================= */

/* ---- Fabs — configured EXACTLY like the NewPower / TripleIL sites ----
   Only 3 weights exist (300 / 500 / 800). Never request 400/600/700/900:
   Windows will synthesise a fake weight and the Hebrew renders wrong.
   Fallback chain is Windows-native (Segoe UI / Tahoma) so PC users get
   proper Hebrew if Fabs hasn't loaded. Filenames are case-exact for
   Vercel's case-sensitive Linux filesystem. */
@font-face { font-family:"Fabs"; src:url("../fonts/fabs-LIght.ttf") format("truetype"); font-weight:300; font-display:swap; }
@font-face { font-family:"Fabs"; src:url("../fonts/fabs-Medium.ttf") format("truetype"); font-weight:500; font-display:swap; }
@font-face { font-family:"Fabs"; src:url("../fonts/fabs-extra-bold.ttf") format("truetype"); font-weight:800; font-display:swap; }

:root{
  --font: "Fabs","Segoe UI",Tahoma,sans-serif;

  --bg:#ffffff;
  --bg-soft:#f5f8fc;
  --bg-2:#eef3fa;
  --ink:#0c1a2e;
  --ink-2:#22344b;
  --fog:#566578;
  --fog-2:#8493a4;
  --line:#e7edf4;
  --line-2:#dde5ee;

  --brand:#0050bd;
  --brand-700:#013f96;
  --brand-600:#0a59cc;
  --brand-50:#eaf1fb;
  --brand-100:#d6e5f8;
  --red:#ed1c24;
  --gold:#f5b301;
  --wa:#25d366;

  --shadow-sm:0 1px 2px rgba(12,26,46,.05);
  --shadow:0 14px 36px -16px rgba(12,26,46,.20);
  --shadow-lg:0 30px 70px -28px rgba(12,26,46,.32);

  --r-sm:12px;
  --r:16px;
  --r-lg:24px;
  --pill:999px;

  --ease:cubic-bezier(.2,0,0,1);
  --dur:.32s;

  --wrap:1180px;
  --nav-h:72px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:clip; max-width:100%; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:var(--font);
  font-weight:300;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3{ margin:0; font-weight:800; letter-spacing:-.02em; line-height:1.05; }
p{ margin:0; }
strong{ font-weight:800; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:24px; }

/* line-icon defaults */
.ic{
  width:24px; height:24px; flex:none;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}

.skip-link{
  position:absolute; inset-inline-start:12px; top:-100px; z-index:200;
  background:var(--brand); color:#fff; padding:10px 16px; border-radius:10px;
  font-weight:500; transition:top .2s var(--ease);
}
.skip-link:focus{ top:12px; }

:where(a,button):focus-visible{ outline:3px solid var(--brand); outline-offset:2px; border-radius:6px; }

/* =========================== BUTTONS =========================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--font); font-weight:500; font-size:15.5px; line-height:1;
  padding:14px 22px; border-radius:var(--r-sm); border:1.5px solid transparent;
  cursor:pointer; white-space:nowrap; transition:transform .18s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.btn .ic{ width:19px; height:19px; }
.btn--sm{ padding:10px 16px; font-size:14px; }
.btn--sm .ic{ width:17px; height:17px; }
.btn--lg{ padding:16px 26px; font-size:16.5px; }
.btn:active{ transform:translateY(1px); }

.btn--primary{ background:var(--brand); color:#fff; box-shadow:0 10px 24px -12px rgba(0,80,189,.7); }
.btn--primary:hover{ background:var(--brand-700); box-shadow:0 14px 30px -12px rgba(0,80,189,.75); }

.btn--ghost{ background:#fff; color:var(--ink); border-color:var(--line-2); }
.btn--ghost:hover{ border-color:var(--brand); color:var(--brand); }

.btn--white{ background:#fff; color:var(--ink); }
.btn--white:hover{ background:#f0f5fc; }
.btn--ghost-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.32); }
.btn--ghost-light:hover{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.6); }

/* =========================== TOPBAR =========================== */
.topbar{ background:var(--ink); color:#cdd8e6; font-size:13.5px; }
.topbar__inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:40px; }
.topbar__text{ font-weight:300; color:#aebed1; }
.topbar__phone{ display:inline-flex; flex-direction:row-reverse; align-items:center; gap:7px; font-weight:500; color:#fff; } /* row-reverse: icon sits left of the number in RTL */
.topbar__phone .ic{ width:15px; height:15px; color:#7fb0f0; position:relative; top:-3px; } /* optical alignment with the Fabs baseline */
.topbar__phone:hover{ color:#7fb0f0; }
@media (max-width:560px){ .topbar__text{ display:none; } .topbar__inner{ justify-content:center; } }

/* =========================== NAV =========================== */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.86); backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s var(--ease), background .25s var(--ease);
}
.nav.is-scrolled{ box-shadow:0 8px 30px -18px rgba(12,26,46,.4); background:rgba(255,255,255,.94); }
.nav__inner{ display:flex; align-items:center; gap:20px; min-height:var(--nav-h); }
.nav__brand img{ height:48px; width:auto; }
.nav__menu{ display:flex; align-items:center; gap:30px; margin-inline-start:auto; }
.nav__link{ font-weight:500; font-size:15.5px; color:var(--ink-2); position:relative; padding:6px 0; }
.nav__link::after{ content:""; position:absolute; bottom:0; inset-inline-end:0; width:0; height:2px; background:var(--brand); transition:width .25s var(--ease); }
.nav__link:hover{ color:var(--brand); }
.nav__link:hover::after{ width:100%; }
.nav__link--mob{ display:none; }
.nav__actions{ display:flex; align-items:center; gap:12px; margin-inline-start:auto; }
.nav__menu + .nav__actions{ margin-inline-start:0; }

.nav__toggle{ display:none; flex-direction:column; gap:5px; width:44px; height:44px; align-items:center; justify-content:center; background:none; border:1px solid var(--line-2); border-radius:11px; cursor:pointer; }
.nav__toggle span{ width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s var(--ease), opacity .2s var(--ease); }
.nav__toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:880px){
  .nav__menu{
    position:absolute; inset:100% 0 auto 0; flex-direction:column; align-items:stretch; /* anchored to the sticky nav — no gap at any scroll position */
    gap:0; background:#fff; border-bottom:1px solid var(--line); padding:8px 24px 20px;
    margin:0; transform:translateY(-12px); opacity:0; pointer-events:none; transition:transform .25s var(--ease), opacity .25s var(--ease); box-shadow:var(--shadow);
  }
  .nav__menu.is-open{ transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav__link{ padding:15px 0; border-bottom:1px solid var(--line); font-size:17px; }
  .nav__link::after{ display:none; }
  .nav__link--mob{ display:block; }
  .nav__menu + .nav__actions{ margin-inline-start:auto; } /* push hamburger to the far left (RTL) */
  .nav__toggle{ display:flex; }
  .nav__actions .btn--sm{ display:none; }
}

/* =========================== HERO =========================== */
.hero{ position:relative; background:
    radial-gradient(120% 120% at 88% -10%, var(--brand-50) 0%, rgba(234,241,251,0) 46%),
    linear-gradient(180deg,#fff 0%, var(--bg-soft) 100%);
  overflow:hidden; }
.hero__inner{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:56px; align-items:center; padding:clamp(48px,7vw,96px) 24px clamp(56px,7vw,104px); }
.hero__content{ min-width:0; }

.hero__title{ font-size:clamp(32px,8.5vw,72px); line-height:1.04; letter-spacing:-.03em; margin:0; overflow-wrap:break-word; }
.u-accent{ color:var(--brand); }
.hero__lede{ margin-top:22px; max-width:38ch; font-size:clamp(16.5px,1.7vw,19.5px); color:var(--fog); line-height:1.62; }
.hero__lede strong{ color:var(--ink); font-weight:800; }

.hero__actions{ display:flex; flex-wrap:wrap; gap:13px; margin-top:30px; }

.hero__proof{ display:flex; align-items:center; gap:11px; margin-top:24px; color:var(--fog); font-size:14.5px; font-weight:500; }
.hero__proof strong{ color:var(--ink); }
.stars{ color:var(--gold); letter-spacing:2px; font-size:16px; }

.hero__media{ position:relative; min-width:0; }
.hero__frame{ border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-2); box-shadow:var(--shadow-lg); background:var(--brand); }
.hero__frame img{ width:100%; aspect-ratio:5/4; object-fit:cover; object-position:18% center; }
.hero__cred{
  position:absolute; inset-inline-start:-14px; bottom:-18px;
  display:flex; align-items:center; gap:11px;
  background:#fff; border:1px solid var(--line-2); border-radius:var(--r); padding:13px 16px; box-shadow:var(--shadow);
}
.hero__cred .ic{ width:26px; height:26px; color:var(--brand); }
.hero__cred strong{ display:block; font-weight:800; font-size:14.5px; color:var(--ink); }
.hero__cred span{ display:block; font-size:12.5px; color:var(--fog); }

@media (max-width:980px){
  .hero__inner{ grid-template-columns:minmax(0,1fr); gap:44px; }
  .hero__media{ order:-1; max-width:520px; margin-inline:auto; width:100%; }
  .hero__frame img{ aspect-ratio:16/11; }
  .hero__cred{ inset-inline-start:auto; inset-inline-end:14px; }
}

/* Mobile: immersive full-screen hero — the photo fills the first screen,
   content sits over a dark gradient at the bottom */
@media (max-width:880px){
  .hero{
    display:flex;
    min-height:calc(100vh - 40px - var(--nav-h));   /* topbar + sticky nav */
    min-height:calc(100svh - 40px - var(--nav-h));
  }
  .hero__inner{
    display:flex; flex-direction:column; justify-content:flex-end; flex:1;
    position:relative; z-index:2; gap:0;
    padding:28px 22px calc(30px + env(safe-area-inset-bottom)); /* bar is hidden over the hero, so content can sit lower */
  }
  .hero__media{ position:absolute; inset:0; z-index:0; order:0; max-width:none; margin:0; }
  .hero__media.reveal{ transform:none; }
  .hero__frame{ position:absolute; inset:0; border:0; border-radius:0; box-shadow:none; background:var(--ink); }
  .hero__frame img{
    width:100%; height:calc(100% + 60px); aspect-ratio:auto; object-fit:cover;
    object-position:calc(16% - 15px) center;
    position:relative; top:-60px; /* lift the photo so the face sits above the headline on shorter screens */
  }
  .hero__media::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg,
      rgba(8,17,31,.44) 0%, rgba(8,17,31,.16) 22%, rgba(8,17,31,.30) 40%,
      rgba(8,17,31,.62) 56%, rgba(8,17,31,.88) 74%, rgba(8,17,31,.97) 100%);
  }

  .hero__cred{
    top:16px; bottom:auto; inset-inline-start:22px; inset-inline-end:auto; z-index:2; /* align with the hero content's right edge */
    background:rgba(10,20,36,.55); border-color:rgba(255,255,255,.18);
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    padding:10px 14px; box-shadow:none;
  }
  .hero__cred .ic{ width:22px; height:22px; color:#8db8f2; }
  .hero__cred strong{ color:#fff; font-size:13px; }
  .hero__cred span{ color:#b9c7d8; font-size:11.5px; }

  .hero__content{ position:relative; z-index:2; color:#fff; }
  .hero__title{
    font-size:clamp(31px,9.6vw,46px);
    text-shadow:0 2px 22px rgba(8,17,31,.85), 0 1px 4px rgba(8,17,31,.55);
  }
  .hero__title .u-accent{ color:#7fb0f0; } /* light brand blue — readable over the blue shirt */
  .hero__lede{ margin-top:12px; font-size:16px; line-height:1.55; color:#dbe6f3; }
  .hero__lede strong{ color:#fff; }
  .hero__actions{ margin-top:20px; }
  .hero__actions .btn{ flex:1 1 auto; }
  .hero .btn--ghost{
    background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.35);
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  }
  .hero__proof{ margin-top:16px; color:#c6d4e4; }
  .hero__proof strong{ color:#fff; }
}
@media (max-width:390px){
  .hero__proof{ font-size:13px; gap:8px; }
  .hero__proof .stars{ font-size:14px; letter-spacing:1px; }
}

/* =========================== TRUST STRIP =========================== */
.trust{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }
.trust__inner{ display:grid; grid-template-columns:repeat(4,1fr); }
.trust__item{ display:flex; align-items:center; gap:11px; padding:22px 18px; font-weight:500; font-size:15px; color:var(--ink-2); }
.trust__item:not(:last-child){ border-inline-end:1px solid var(--line); }
.trust__item .ic{ width:24px; height:24px; color:var(--brand); flex:none; }
@media (max-width:780px){
  .trust__inner{ grid-template-columns:1fr 1fr; }
  .trust__item{
    flex-direction:column; justify-content:center; text-align:center;
    gap:10px; padding:22px 14px; font-size:14px;
  }
  .trust__item .ic{ width:30px; height:30px; }
  .trust__item:not(:last-child){ border-inline-end:0; }
  .trust__item:nth-child(odd){ border-inline-end:1px solid var(--line); }
  .trust__item:nth-child(-n+2){ border-bottom:1px solid var(--line); }
}
@media (max-width:420px){ .trust__item{ font-size:13px; } }

/* =========================== SECTIONS =========================== */
.section{ padding:clamp(64px,8vw,116px) 0; }
.section__head{ max-width:680px; margin-bottom:clamp(36px,5vw,60px); }
.eyebrow{
  display:inline-block; font-weight:500; font-size:12px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brand); margin-bottom:14px;
}
.eyebrow--light{ color:#8fb8f0; }
.section__title{ font-size:clamp(28px,4vw,48px); line-height:1.06; }
.section__lede{ margin-top:16px; font-size:clamp(16px,1.6vw,18.5px); color:var(--fog); max-width:54ch; }

/* =========================== SERVICES =========================== */
.services{ background:var(--bg-soft); }
.services__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.svc{
  position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:28px 26px; transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.svc:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--brand-100); }
.svc__icon{
  display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px;
  border-radius:14px; background:var(--brand-50); color:var(--brand); margin-bottom:18px;
}
.svc__icon .ic{ width:27px; height:27px; }
.svc__name{ font-size:20px; font-weight:800; margin-bottom:9px; letter-spacing:-.01em; }
.svc__desc{ color:var(--fog); font-size:15px; line-height:1.6; }
.svc__desc strong{ color:var(--ink); }

.svc--featured{
  grid-column:span 1; background:linear-gradient(165deg,#073a8c 0%, var(--brand) 70%); color:#fff; border-color:transparent;
  box-shadow:0 26px 60px -28px rgba(0,80,189,.7);
}
.svc--featured:hover{ border-color:transparent; box-shadow:0 30px 66px -26px rgba(0,80,189,.78); }
.svc--featured .svc__icon{ background:rgba(255,255,255,.14); color:#fff; }
.svc--featured .svc__name{ color:#fff; }
.svc--featured .svc__desc{ color:#d6e4fb; }
.svc--featured .svc__desc strong{ color:#fff; }

@media (max-width:900px){ .services__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .services__grid{ grid-template-columns:minmax(0,1fr); } }

/* =========================== ABOUT =========================== */
.about__inner{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(36px,5vw,64px); align-items:center; }
.about__media,.about__content{ min-width:0; }
.about__frame{ border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-2); box-shadow:var(--shadow-lg); }
.about__frame img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 18%; }
.about__lede{ margin-top:16px; font-size:clamp(17px,1.8vw,20px); color:var(--ink-2); font-weight:500; line-height:1.5; }
.about__content > p{ margin-top:16px; color:var(--fog); font-size:16px; line-height:1.7; }
.chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.chip{ display:inline-flex; align-items:center; gap:8px; background:var(--brand-50); color:var(--brand-700); border:1px solid var(--brand-100); border-radius:var(--pill); padding:8px 14px; font-size:13.5px; font-weight:500; }
.chip .ic{ width:16px; height:16px; }
.chip .ic[viewBox]{ stroke-width:1.6; }
.certs{ display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; max-width:380px; }
.cert{ flex:1 1 0; aspect-ratio:1; height:auto; border-radius:12px; overflow:hidden; border:1px solid var(--line-2); background:#fff; transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
.cert img{ width:100%; height:100%; object-fit:cover; }
.cert:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
.cert--featured{
  flex:0 0 100%; width:100%; height:auto; aspect-ratio:auto;
  border:0; background:none; border-radius:0; overflow:visible;
}
.cert--featured:hover{ transform:none; box-shadow:none; }
.cert--featured img{
  width:100%; height:auto; object-fit:unset; display:block;
  border:1px solid var(--line-2); border-radius:14px; box-shadow:var(--shadow-sm);
}
@media (max-width:900px){ .certs{ max-width:none; } }
@media (max-width:900px){ .about__inner{ grid-template-columns:minmax(0,1fr); } .about__media{ max-width:360px; width:100%; margin-inline:auto; } }

/* =========================== STATS BAND =========================== */
.stats{ background:var(--ink); color:#fff; }
.stats__inner{ display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; padding:clamp(40px,5vw,66px) 24px; gap:8px; }
.stat{ text-align:center; }
.stat__num{ display:block; font-weight:800; font-size:clamp(40px,6vw,68px); line-height:1; letter-spacing:-.03em; color:#fff; font-variant-numeric:tabular-nums; }
.stat__star{ color:var(--gold); }
.stat__label{ display:block; margin-top:12px; font-size:14.5px; font-weight:500; color:#9fb1c6; letter-spacing:.02em; }
.stats__inner::before, .stats__inner::after{ content:""; }
.stats .stat + .stat{ position:relative; }
@media (max-width:640px){
  .stats__inner{ grid-template-columns:1fr; gap:0; }
  .stats__inner > .stat + .stat{ border-top:1px solid rgba(255,255,255,.12); padding-top:28px; margin-top:28px; }
}
/* dividers (desktop) */
.stats__inner{ position:relative; }

/* =========================== REVIEWS =========================== */
.rating{ display:flex; align-items:center; gap:11px; margin-top:18px; }
.rating .stars{ font-size:19px; }
.rating__text{ color:var(--fog); font-size:15px; font-weight:500; }
.rating__text strong{ color:var(--ink); }

.slider{ position:relative; }
.slider__track{
  display:flex; align-items:stretch; gap:18px;
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding-bottom:6px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.slider__track::-webkit-scrollbar{ display:none; }
.rev{
  flex:0 0 calc((100% - 36px)/3); min-width:0; scroll-snap-align:start;
  background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:26px 24px; display:flex; flex-direction:column;
}
.rev__stars{ color:var(--gold); letter-spacing:2px; font-size:16px; margin-bottom:14px; }
.rev__text{ color:var(--ink-2); font-size:15px; line-height:1.66; flex:1; }
.rev__author{ display:flex; align-items:center; gap:12px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.rev__avatar{ width:40px; height:40px; border-radius:50%; background:var(--brand-50); color:var(--brand-700); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:16px; flex:none; }
.rev__meta{ display:flex; flex-direction:column; }
.rev__name{ font-weight:800; font-size:14.5px; }
.rev__src{ font-size:12.5px; color:var(--fog-2); }

.slider__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:46px; height:46px; border-radius:50%; background:#fff; border:1px solid var(--line-2);
  color:var(--ink); display:flex; align-items:center; justify-content:center; cursor:pointer;
  box-shadow:var(--shadow); transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.slider__nav:hover{ background:var(--brand); color:#fff; border-color:var(--brand); }
.slider__nav--prev{ inset-inline-start:-12px; } /* prev sits at the start side (right in RTL) */
.slider__nav--next{ inset-inline-end:-12px; }   /* next sits at the end side (left in RTL) */
@media (max-width:1180px){ .slider__nav--prev{ inset-inline-start:4px; } .slider__nav--next{ inset-inline-end:4px; } }

.reviews__dots{ display:flex; justify-content:center; gap:8px; margin-top:24px; }
.reviews__dots button{ width:8px; height:8px; border-radius:50%; border:none; background:var(--line-2); cursor:pointer; padding:0; transition:background .2s var(--ease), width .2s var(--ease); }
.reviews__dots button.is-active{ background:var(--brand); width:22px; border-radius:5px; }

.reviews__cta{ display:flex; justify-content:center; margin-top:30px; }
.link-arrow{ display:inline-flex; align-items:center; gap:7px; font-weight:500; color:var(--brand); font-size:16px; }
.link-arrow .ic{ width:18px; height:18px; transition:transform .2s var(--ease); }
.link-arrow:hover .ic{ transform:translateX(-4px); }

@media (max-width:900px){ .rev{ flex-basis:calc((100% - 18px)/2); } }
@media (max-width:600px){ .rev{ flex-basis:86%; } .slider__nav{ display:none; } }

/* =========================== CTA BAND =========================== */
.cta{ background:
    radial-gradient(90% 120% at 12% 0%, rgba(0,80,189,.5) 0%, rgba(0,80,189,0) 55%),
    var(--ink); color:#fff; }
.cta__inner{ display:flex; align-items:center; justify-content:space-between; gap:36px; padding:clamp(48px,6vw,80px) 24px; flex-wrap:wrap; }
.cta__text h2{ font-size:clamp(26px,3.4vw,42px); margin-top:6px; }
.cta__text p{ margin-top:14px; color:#aebfd2; font-size:17px; max-width:46ch; }
.cta__actions{ display:flex; gap:13px; flex-wrap:wrap; }
@media (max-width:560px){
  .cta__actions{ width:100%; }
  .cta__actions .btn{ flex:1 1 auto; }
}

/* =========================== FOOTER =========================== */
.footer{ background:#08111f; color:#aebfd2; }
.footer__inner{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; padding:clamp(48px,6vw,72px) 24px; }
.footer__logo{ height:52px; width:auto; } /* full-color 3D logo — no invert filter */
.footer__tag{ margin-top:18px; max-width:42ch; font-size:14.5px; line-height:1.7; color:#8595a8; }
.footer__social{ display:flex; gap:10px; margin-top:22px; }
.footer__social a{ width:42px; height:42px; border-radius:11px; border:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; color:#cdd8e6; transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease); }
.footer__social a:hover{ background:var(--brand); color:#fff; border-color:var(--brand); }
.footer__social .ic{ width:20px; height:20px; }
.footer__col h3{ font-size:13px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:#fff; margin-bottom:16px; }
.footer__col a, .footer__col span{ display:block; font-size:15px; color:#9fb1c6; margin-bottom:11px; transition:color .2s var(--ease); }
.footer__col a:hover{ color:#fff; }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.08); }
.footer__bottom-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 24px; font-size:13px; color:#6f7f93; flex-wrap:wrap; }
@media (max-width:780px){
  .footer__inner{ grid-template-columns:1fr 1fr; gap:32px; }
  .footer__brand{ grid-column:1 / -1; }
}
@media (max-width:480px){ .footer__inner{ grid-template-columns:1fr; } }

/* =========================== MOBILE ACTION BAR =========================== */
.mobilebar{ display:none; }
@media (max-width:880px){
  .mobilebar{
    display:grid; grid-template-columns:repeat(3,1fr); position:fixed; inset-inline:0; bottom:0; z-index:90;
    background:#fff; border-top:1px solid var(--line); box-shadow:0 -10px 30px -16px rgba(12,26,46,.35);
    padding-bottom:env(safe-area-inset-bottom);
    transform:translateY(102%); transition:transform .3s var(--ease); /* hidden over the hero, slides in after it */
  }
  .mobilebar.is-visible{ transform:none; }
  .mobilebar__item{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px 6px 11px; font-size:12px; font-weight:500; color:var(--ink-2); }
  .mobilebar__item .ic{ width:22px; height:22px; }
  .mobilebar__item:not(:last-child){ border-inline-end:1px solid var(--line); }
  .mobilebar__item--wa{ color:#128c3e; }
  .mobilebar__item--call{ color:var(--brand); }
  body{ padding-bottom:64px; }
}

/* =========================== LIGHTBOX =========================== */
.lightbox{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
  background:rgba(5,11,21,.92);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  opacity:0; pointer-events:none; transition:opacity .28s var(--ease);
}
.lightbox.is-open{ opacity:1; pointer-events:auto; }
.lightbox__stage{ margin:0; max-width:min(1100px,90vw); max-height:82vh; display:flex; align-items:center; justify-content:center; }
.lightbox__img{
  max-width:100%; max-height:82vh; object-fit:contain; border-radius:14px;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.75); background:#fff;
  opacity:0; transform:scale(.97);
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.lightbox__img.is-loaded{ opacity:1; transform:none; }
.lightbox__close{
  position:absolute; top:max(14px, env(safe-area-inset-top)); inset-inline-end:14px;
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.22); color:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .2s var(--ease), border-color .2s var(--ease);
}
.lightbox__close:hover{ background:rgba(255,255,255,.18); }
.lightbox__counter{
  position:absolute; top:26px; right:20px; /* close btn sits at the physical left in RTL */
  color:#c9d6e6; font-weight:500; font-size:14px; letter-spacing:.08em;
  font-variant-numeric:tabular-nums; direction:ltr;
}
.lightbox__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.22); color:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .2s var(--ease), border-color .2s var(--ease);
}
.lightbox__nav:hover{ background:var(--brand); border-color:var(--brand); }
.lightbox__nav--left{ left:14px; }
.lightbox__nav--right{ right:14px; }
html.lb-lock, html.lb-lock body{ overflow:hidden; }
@media (max-width:600px){
  .lightbox__stage{ max-width:calc(100vw - 24px); }
  .lightbox__img{ max-height:76vh; border-radius:12px; }
  .lightbox__nav{ width:42px; height:42px; top:auto; bottom:calc(22px + env(safe-area-inset-bottom)); transform:none; }
  .lightbox__nav--left{ left:calc(50% - 56px); }
  .lightbox__nav--right{ right:calc(50% - 56px); }
}
@media (prefers-reduced-motion:reduce){ .lightbox, .lightbox__img{ transition:none; } }

/* =========================== ACCESSIBILITY STATEMENT PAGE =========================== */
.statement{ padding:clamp(44px,6vw,80px) 0 clamp(64px,8vw,110px); }
.statement .wrap{ max-width:820px; }
.statement__updated{ margin-top:10px; color:var(--fog-2); font-size:14px; }
.statement section{ margin-top:36px; }
.statement h2{ font-size:22px; margin-bottom:12px; }
.statement p{ color:var(--ink-2); line-height:1.75; margin-bottom:10px; }
.statement ul{ margin:8px 0 0; padding-inline-start:22px; color:var(--ink-2); line-height:1.9; }
.statement a{ color:var(--brand); font-weight:500; }
.statement a:hover{ text-decoration:underline; }
.footer__bottom-inner a{ color:#8ea6c4; }
.footer__bottom-inner a:hover{ color:#fff; }

/* =========================== ACCESSIBILITY WIDGET =========================== */
.a11y-btn{
  position:fixed; left:14px; bottom:24px; z-index:160;
  width:52px; height:52px; border-radius:50%; border:2px solid #fff;
  background:var(--brand); color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px -10px rgba(0,80,189,.75);
  transition:transform .18s var(--ease), background .2s var(--ease);
}
.a11y-btn:hover{ background:var(--brand-700); transform:scale(1.06); }
.a11y-btn svg{ width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:880px){ .a11y-btn{ bottom:calc(76px + env(safe-area-inset-bottom)); width:46px; height:46px; } .a11y-btn svg{ width:26px; height:26px; } }

.a11y-panel{
  position:fixed; left:14px; bottom:86px; z-index:161;
  width:min(300px, calc(100vw - 28px));
  background:#fff; border:1px solid var(--line-2); border-radius:var(--r);
  box-shadow:var(--shadow-lg); overflow:hidden;
  opacity:0; transform:translateY(10px); pointer-events:none;
  transition:opacity .2s var(--ease), transform .2s var(--ease);
  max-height:min(72vh, 560px); display:flex; flex-direction:column;
}
.a11y-panel.is-open{ opacity:1; transform:none; pointer-events:auto; }
@media (max-width:880px){ .a11y-panel{ bottom:calc(132px + env(safe-area-inset-bottom)); } }
.a11y-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; background:var(--ink); color:#fff; font-size:15px;
}
.a11y-close{
  background:none; border:0; color:#fff; font-size:16px; cursor:pointer;
  width:32px; height:32px; border-radius:8px;
}
.a11y-close:hover{ background:rgba(255,255,255,.14); }
.a11y-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:12px; overflow-y:auto;
}
.a11y-grid button{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  padding:10px 6px; border:1.5px solid var(--line-2); border-radius:10px;
  background:#fff; font-family:var(--font); font-size:12.5px; font-weight:500;
  color:var(--ink-2); cursor:pointer; text-align:center;
  transition:border-color .15s var(--ease), background .15s var(--ease);
}
.a11y-grid button:hover{ border-color:var(--brand); }
.a11y-grid button.is-on{ background:var(--brand-50); border-color:var(--brand); color:var(--brand-700); }
.a11y-ic{ display:flex; align-items:center; justify-content:center; height:22px; font-size:16px; line-height:1; font-weight:800; color:var(--brand); }
.a11y-ic svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.a11y-grid button.is-on .a11y-ic{ color:var(--brand-700); }
.a11y-sub{ font-size:10.5px; color:var(--fog-2); min-height:1em; }
.a11y-foot{ padding:10px 16px 14px; font-size:12px; color:var(--fog); border-top:1px solid var(--line); }
.a11y-foot a{ color:var(--brand); font-weight:500; }

/* --- effect classes (filters on the ROOT element don't break fixed positioning) --- */
html.a11y-grayscale{ filter:grayscale(1); }
html.a11y-contrast{ filter:contrast(1.3); }
html.a11y-invert{ filter:invert(1) hue-rotate(180deg); }
html.a11y-invert img, html.a11y-invert video, html.a11y-invert .hero__frame, html.a11y-invert .about__frame, html.a11y-invert .cert{ filter:invert(1) hue-rotate(180deg); }
html.a11y-grayscale.a11y-invert{ filter:grayscale(1) invert(1); }
html.a11y-links a{ text-decoration:underline !important; }
html.a11y-links main a, html.a11y-links footer a{ outline:2px solid rgba(0,80,189,.35); outline-offset:2px; }
html.a11y-font *{ font-family:Arial, "Segoe UI", Tahoma, sans-serif !important; }
html.a11y-cursor, html.a11y-cursor *{
  cursor:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 24 24"><path d="M5 2l14 12h-8l-3 8z" fill="black" stroke="white" stroke-width="1.6"/></svg>') 4 2, auto !important;
}
html.a11y-nomotion *, html.a11y-nomotion *::before, html.a11y-nomotion *::after{
  transition:none !important; animation:none !important; scroll-behavior:auto !important;
}
html.a11y-nomotion .reveal{ opacity:1 !important; transform:none !important; }

/* =========================== REVEAL =========================== */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }
