/* ================================================================
   +ON Technologies — Design System v9.2
   Blue: #2563EB | Fonts: Plus Jakarta Sans + Inter
   ================================================================ */

:root {
  --blue:      #2563EB;
  --blue-d:    #1D4ED8;
  --blue-dd:   #1E3A8A;
  --blue-l:    #EFF6FF;
  --blue-m:    #BFDBFE;
  --teal:      #0D9488;  --teal-l:   #CCFBF1;
  --amber:     #D97706;  --amber-l:  #FEF3C7;
  --green:     #16A34A;  --green-l:  #F0FDF4;
  --rose:      #E11D48;
  --bg:        #FFFFFF;
  --surface:   #F8FAFC;
  --surface-2: #F1F5F9;
  --border:    #E2E8F0;
  --border-2:  #CBD5E1;
  --text:      #0F172A;
  --text-2:    #334155;
  --text-muted:#64748B;
  --text-light:#94A3B8;
  --font-head: 'Plus Jakarta Sans', sans-serif;
  --font-body: 'Inter', sans-serif;
  --header-h:  68px;
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-xl: 20px; --r-2xl: 28px;
  --sh-sm: 0 1px 3px rgba(0,0,0,.07);
  --sh-md: 0 4px 8px rgba(0,0,0,.07);
  --sh-lg: 0 10px 20px rgba(0,0,0,.09);
  --sh-xl: 0 20px 40px rgba(0,0,0,.10);
  --sh-blue: 0 4px 16px rgba(37,99,235,.3);
}

/* ── RESET ──────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  font-size: 1rem; line-height: 1.65;
  color: var(--text); background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a   { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
input, textarea, select { font-family: inherit; font-size: inherit; }

.container { width: 100%; max-width: 1168px; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; }

section { padding: 5rem 0; }
section.tight { padding: 3rem 0; }
.bg-white     { background: var(--bg); }
.bg-surface   { background: var(--surface); }
.bg-surface-2 { background: var(--surface-2); }

h1, h2, h3, h4, h5 { font-family: var(--font-head); font-weight: 700; line-height: 1.2; letter-spacing: -.020em; color: var(--text); }
h1 { font-size: clamp(1.875rem, 4.5vw, 3rem); font-weight: 800; }
h2 { font-size: clamp(1.5rem, 3vw, 2.125rem); }
h3 { font-size: 1.125rem; }
p  { color: var(--text-2); }
.accent { color: var(--blue); }

.eyebrow {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .75rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .12em; color: var(--blue); margin-bottom: .875rem;
}
.section-head { max-width: 620px; margin: 0 auto 3rem; text-align: center; }
.section-head h2 { margin-bottom: .75rem; }
.section-head p  { font-size: 1.0625rem; color: var(--text-muted); }

/* ── HEADER ─────────────────────────────────────────────────────── */
.header {
  position: sticky; top: 0; z-index: 500;
  height: var(--header-h);
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color .25s, box-shadow .25s;
}
.header.scrolled { border-bottom-color: var(--border); box-shadow: 0 1px 16px rgba(0,0,0,.07); }
.header-inner { display: flex; align-items: center; height: 100%; gap: 1.25rem; }

/* ── LOGO ───────────────────────────────────────────────────────── */
.logo { display: inline-flex; align-items: center; flex-shrink: 0; gap: .5rem; }
.logo-img {
  height: 42px;
  width: auto;
  object-fit: contain;
  display: block;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), filter .3s;
  filter: drop-shadow(0 1px 6px rgba(37,99,235,.20));
  image-rendering: -webkit-optimize-contrast;
}
.logo:hover .logo-img {
  transform: scale(1.06) rotate(-1deg);
  filter: drop-shadow(0 2px 12px rgba(37,99,235,.4));
}
/* Logo entrance animation */
@keyframes logoIn {
  from { opacity:0; transform: translateX(-12px) scale(.92); }
  to   { opacity:1; transform: none; }
}
.logo-img { animation: logoIn .55s cubic-bezier(.16,1,.3,1) both; }

.nav-links { display: flex; align-items: center; gap: .25rem; }
.nav-link {
  display: flex; align-items: center; padding: .4rem .75rem;
  border-radius: var(--r-md); font-size: .9375rem; font-weight: 500;
  color: var(--text-2); transition: background .18s, color .18s;
}
.nav-link:hover, .nav-link.active { background: var(--blue-l); color: var(--blue); }
.header-right { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; margin-left: auto; }

.btn-cta { flex-shrink: 0; white-space: nowrap;
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .475rem 1.125rem; background: var(--blue); color: #fff;
  border-radius: var(--r-md); font-size: .875rem; font-weight: 600;
  border: 2px solid var(--blue); transition: all .2s;
}
.btn-cta:hover { background: var(--blue-d); border-color: var(--blue-d); transform: translateY(-1px); }

/* Country selector */
.country-selector { position: relative; }
.country-btn {
  display: flex; align-items: center; gap: .4rem; padding: .4rem .7rem;
  border-radius: var(--r-md); font-size: .8125rem; font-weight: 600;
  color: var(--text-2); background: var(--surface); border: 1px solid var(--border);
  cursor: pointer; transition: all .18s;
}
.country-btn:hover { border-color: var(--blue); color: var(--blue); }
.country-caret { transition: transform .2s; }
.country-selector.open .country-caret { transform: rotate(180deg); }
.country-dropdown {
  position: absolute; top: calc(100% + .5rem); right: 0;
  background: var(--bg); border: 1.5px solid var(--border);
  border-radius: var(--r-lg); box-shadow: var(--sh-xl);
  min-width: 220px; z-index: 300; overflow: hidden;
}
.country-dd-hdr {
  padding: .5rem 1rem; border-bottom: 1px solid var(--border);
  font-size: .65rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--text-muted);
}
.c-item {
  display: flex; align-items: center; gap: .75rem; padding: .65rem 1rem;
  font-size: .9rem; font-weight: 500; color: var(--text);
  border-left: 3px solid transparent; transition: background .15s;
}
.c-item:hover    { background: var(--surface); color: var(--blue); border-left-color: var(--blue); }
.c-item.is-active{ background: var(--blue-l);  color: var(--blue); border-left-color: var(--blue); font-weight: 700; }
.c-flag { font-size: 1.25rem; line-height: 1; }
.c-name { flex: 1; }
.c-sub  { font-size: .7rem; color: var(--text-muted); background: var(--surface); border: 1px solid var(--border); border-radius: 4px; padding: .1rem .35rem; }

/* ── MOBILE MENU BUTTON — LEFT side ──────────────────────────────── */
.mobile-menu-btn {
  display: none; flex-direction: column; gap: 5px;
  padding: .45rem; background: none; border: none; cursor: pointer;
  order: -1;  /* força para a esquerda */
}
.mobile-menu-btn span {
  display: block; width: 22px; height: 2.5px;
  background: var(--text); border-radius: 3px; transition: all .28s;
}
@media (max-width: 1000px) {
  .nav-links                          { display: none !important; }
  .header-right .country-selector     { display: none !important; }
  .mobile-menu-btn                    { display: flex !important; }
  .logo-img                           { height: 34px; }
  .header-right                       { margin-left: auto; }
}

/* ── MOBILE PANEL — transparent, no icons ────────────────────────── */
.mobile-panel {
  position: fixed; top: 0; left: 0; bottom: 0;  /* LEFT side */
  width: min(300px, 85vw);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(28px) saturate(1.8);
  -webkit-backdrop-filter: blur(28px) saturate(1.8);
  border-right: 1px solid rgba(255,255,255,.5);
  box-shadow: 8px 0 40px rgba(0,0,0,.12);
  z-index: 1000; padding: 1.5rem;
  overflow-y: auto; display: flex; flex-direction: column; gap: .25rem;
}
.mob-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.mob-logo { height: 36px; width: auto; }
.mob-close {
  width: 36px; height: 36px; border-radius: var(--r-md);
  background: rgba(0,0,0,.06); border: none;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.375rem; line-height: 1; cursor: pointer; color: var(--text);
}
.mobile-panel a {
  display: flex; align-items: center; padding: .75rem .875rem;
  border-radius: var(--r-md); font-size: 1rem; font-weight: 500;
  color: var(--text); transition: background .15s;
}
.mobile-panel a:hover, .mobile-panel a.active { background: rgba(37,99,235,.08); color: var(--blue); }
.mob-hr { height: 1px; background: rgba(0,0,0,.07); margin: .5rem 0; flex-shrink: 0; }
.mob-cta {
  background: var(--blue) !important; color: #fff !important;
  border-radius: var(--r-md) !important; justify-content: center;
  margin-top: .5rem; font-weight: 600;
}
.mob-cta:hover { background: var(--blue-d) !important; }
.mobile-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.35);
  z-index: 999; backdrop-filter: blur(2px);
}

/* ═══════════════════════════════════════════════════════════════
   HERO / BANNER SLIDER
   ═══════════════════════════════════════════════════════════════ */
.hero-section { position: relative; overflow: hidden; }

.banner-slide {
  display: none; position: relative;
  min-height: clamp(460px, 68vh, 720px);
  background-color: #030A1A;
  background-image: linear-gradient(135deg,#030A1A 0%,#071535 30%,#0B2560 60%,#143794 85%,#2563EB 100%);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  flex-direction: column; justify-content: center;
}
.banner-slide.active {
  display: flex;
  animation: heroIn .6s cubic-bezier(.16,1,.3,1) both;
}
@keyframes heroIn { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }

.banner-slide::before {
  content:''; position:absolute; inset:0; z-index:1;
  background: linear-gradient(to bottom, rgba(3,10,26,.55) 0%, rgba(7,21,53,.42) 60%, rgba(3,10,26,.65) 100%);
  pointer-events:none;
}
.banner-slide::after {
  content:''; position:absolute; inset:0; z-index:1;
  background-image: linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
  background-size: 52px 52px; pointer-events:none;
}

.banner-slide > .container {
  position:relative; z-index:2;
  display:flex; flex-direction:column; justify-content:center;
  padding-top:3.5rem; padding-bottom:0;
}

.slide-inner { display:grid; grid-template-columns:1fr auto; align-items:center; gap:3rem; }
@media(max-width:900px){ .slide-inner{grid-template-columns:1fr} .slide-visual{display:none} }

.hero-pill {
  display:inline-flex; align-items:center; gap:.5rem;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22);
  border-radius:999px; padding:.3rem 1rem;
  font-size:.8125rem; font-weight:600; color:rgba(255,255,255,.92); margin-bottom:1.25rem;
}
.hero-pill span { width:8px;height:8px;border-radius:50%;background:#60A5FA; animation:blink 2s ease-in-out infinite; }
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}

.hero-h1 {
  font-family:var(--font-head);
  font-size:clamp(2rem,5.5vw,3.75rem);
  font-weight:800; line-height:1.06; letter-spacing:-.028em;
  color:#fff; margin-bottom:1.125rem; max-width:720px;
}
.hero-h1 .accent { color:#93C5FD; }
.hero-sub { font-size:clamp(.9375rem,2vw,1.125rem); color:rgba(255,255,255,.72); line-height:1.75; max-width:520px; margin-bottom:2rem; }
.hero-btns { display:flex; gap:.875rem; flex-wrap:wrap; }

.slide-visual { flex-shrink:0; }
.slide-card {
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15);
  border-radius:var(--r-xl); padding:1.75rem; backdrop-filter:blur(12px); min-width:230px;
}
.slide-card-title { font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.5);margin-bottom:1.25rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:.75rem; }
.slide-stat { display:flex;align-items:center;gap:.875rem;margin-bottom:1rem; }
.slide-stat:last-child { margin-bottom:0; }
.slide-stat-val { font-family:var(--font-head);font-size:1.875rem;font-weight:800;color:#fff;line-height:1; }
.slide-stat-lbl { font-size:.8125rem;color:rgba(255,255,255,.6); }

/* ── TICKER — inside hero section, flush below slides ─────────────── */
.ticker-wrap {
  background:rgba(3,10,26,.72); backdrop-filter:blur(8px);
  padding:.75rem 0; overflow:hidden;
  border-top:1px solid rgba(255,255,255,.06);
  /* part of hero-section visually */
}
.ticker-track { display:flex; animation:ticker 32s linear infinite; width:max-content; }
.ticker-track:hover { animation-play-state:paused; }
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.ticker-item { display:inline-flex;align-items:center;gap:.45rem;padding:0 1.75rem;font-size:.69rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);white-space:nowrap; }
.ticker-dot { width:4px;height:4px;border-radius:50%;background:#60A5FA;opacity:.6; }

/* Slider controls */
.slider-nav { position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);z-index:10;display:flex;align-items:center;gap:.45rem; }
.slider-dot { width:7px;height:7px;border-radius:999px;background:rgba(255,255,255,.3);border:none;cursor:pointer;transition:all .3s;padding:0; }
.slider-dot.active { width:24px;background:#fff; }
.slider-arrow { position:absolute;top:50%;transform:translateY(-50%);z-index:10;width:40px;height:40px;border-radius:var(--r-md);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.25rem;transition:background .2s;line-height:1; }
.slider-arrow:hover { background:rgba(255,255,255,.22); }
.slider-arrow.prev { left:1rem; }
.slider-arrow.next { right:1rem; }
.slider-progress { position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,.07);z-index:10; }
.slider-progress-fill { height:100%;background:rgba(255,255,255,.45);border-radius:0 2px 2px 0;transition:width .1s linear; }

/* ── BUTTONS ────────────────────────────────────────────────────── */
.button, button.button, a.button {
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  font-family:var(--font-body);font-size:.9375rem;font-weight:600;
  padding:.7rem 1.5rem;border-radius:var(--r-md);
  border:2px solid var(--blue);background:var(--blue);color:#fff;
  cursor:pointer;transition:all .2s;white-space:nowrap;line-height:1.4;
}
.button:hover { background:var(--blue-d);border-color:var(--blue-d);transform:translateY(-1px);box-shadow:var(--sh-blue);color:#fff; }
.button-outline, a.button-outline {
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  font-family:var(--font-body);font-size:.9375rem;font-weight:600;
  padding:.7rem 1.5rem;border-radius:var(--r-md);
  border:2px solid var(--blue);background:transparent;color:var(--blue);
  cursor:pointer;transition:all .2s;white-space:nowrap;line-height:1.4;
}
.button-outline:hover { background:var(--blue-l);transform:translateY(-1px); }
.btn { display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-body);font-size:.9375rem;font-weight:600;padding:.7rem 1.5rem;border-radius:var(--r-md);cursor:pointer;transition:all .2s;white-space:nowrap;line-height:1.4;border:2px solid transparent; }
.btn-white { background:#fff;color:var(--blue);border-color:#fff; }
.btn-white:hover { background:#EFF6FF;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15); }
.btn-ghost { background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.25); }
.btn-ghost:hover { background:rgba(255,255,255,.2);transform:translateY(-1px); }
.btn-sm { padding:.45rem 1rem;font-size:.875rem; }

/* ── CARDS ──────────────────────────────────────────────────────── */
.card { background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:1.5rem;box-shadow:var(--sh-sm);transition:border-color .25s,box-shadow .25s,transform .25s; }
.card:hover { border-color:rgba(37,99,235,.3);box-shadow:var(--sh-lg);transform:translateY(-3px); }

/* ── ICON CHIP ──────────────────────────────────────────────────── */
.icon-chip { width:52px;height:52px;border-radius:var(--r-lg);background:var(--blue-l);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem; }
.icon-chip.teal, .icon-chip.amber, .icon-chip.green { background:var(--blue-l);color:var(--blue); }

/* ── GRID ───────────────────────────────────────────────────────── */
.grid-3 { display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem; }
.grid-2 { display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem; }
.split  { display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center; }
.split-btns-mb { margin-bottom:0; }
@media(max-width:960px){ .split-btns-mb { margin-bottom:2rem; } }
@media(max-width:960px){ .grid-3{grid-template-columns:repeat(2,1fr)} .split{grid-template-columns:1fr;gap:2.5rem} }
@media(max-width:640px){ .grid-3,.grid-2{grid-template-columns:1fr} }

/* ── STATS BAR ──────────────────────────────────────────────────── */
.stats-bar { display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-md);border:1.5px solid var(--border);background:var(--border);gap:1px; }
.stat-cell { background:var(--bg);padding:1.75rem 1.25rem;text-align:center; }
.stat-num  { font-family:var(--font-head);font-size:clamp(1.875rem,3vw,2.375rem);font-weight:800;color:var(--blue);line-height:1;display:block; }
.stat-lbl  { font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-top:.35rem;display:block; }

/* ── BADGES ─────────────────────────────────────────────────────── */
.badge { display:inline-flex;align-items:center;border-radius:999px;padding:.28rem .75rem;font-size:.8125rem;font-weight:600; }
.badge-blue  { background:var(--blue-l); color:var(--blue); border:1.5px solid var(--blue-m); }
.badge-green { background:var(--green-l);color:var(--green);border:1.5px solid #BBF7D0; }
.badge-amber { background:var(--amber-l);color:var(--amber);border:1.5px solid #FDBA74; }
.badge-gray  { background:var(--surface);color:var(--text-muted);border:1.5px solid var(--border); }

/* ── FORMS ──────────────────────────────────────────────────────── */
.f-group { margin-bottom:1.125rem; }
.f-row   { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.125rem; }
@media(max-width:560px){ .f-row{grid-template-columns:1fr} }
label { display:block;font-size:.875rem;font-weight:600;color:var(--text);margin-bottom:.4rem; }
input[type="text"],input[type="email"],input[type="url"],input[type="tel"],
input[type="password"],select,textarea {
  display:block;width:100%;padding:.8rem 1rem;
  border:2px solid var(--border-2);border-radius:var(--r-md);
  background:var(--bg);color:var(--text);
  font-family:var(--font-body);font-size:.9375rem;line-height:1.5;
  outline:none;transition:border-color .2s,box-shadow .2s;
}
input:focus,select:focus,textarea:focus { border-color:var(--blue);box-shadow:0 0 0 4px rgba(37,99,235,.12); }
input::placeholder,textarea::placeholder { color:var(--text-light); }
textarea { resize:vertical;min-height:120px; }
input[type="file"] { padding:.625rem .875rem;border:2px dashed var(--border-2);cursor:pointer; }
input[type="file"]:hover { border-color:var(--blue); }
input[type="file"]::file-selector-button { background:var(--blue-l);color:var(--blue);border:1.5px solid var(--blue-m);border-radius:var(--r-sm);padding:.3rem .7rem;font-weight:600;font-size:.8125rem;cursor:pointer;margin-right:.75rem; }
input[type="file"]::file-selector-button:hover { background:var(--blue);color:#fff; }

/* ── CONTACT / APPLY GRID ─────────────────────────────────────────── */
.contact-grid { display:grid;grid-template-columns:1.5fr 1fr;gap:3rem;align-items:start; }
.apply-grid   { display:grid;grid-template-columns:1.5fr 1fr;gap:3rem;align-items:start; }
@media(max-width:860px){ .contact-grid,.apply-grid{grid-template-columns:1fr} }

/* ── ALERTS ─────────────────────────────────────────────────────── */
.alert { padding:.875rem 1.125rem;border-radius:var(--r-md);font-size:.9375rem;font-weight:500;margin-bottom:1.125rem;display:flex;align-items:flex-start;gap:.5rem; }
.alert-success { background:var(--green-l);color:#15803D;border:1.5px solid #BBF7D0; }
.alert-error   { background:#FEF2F2;color:#DC2626;border:1.5px solid #FECACA; }
.alert-info    { background:var(--blue-l);color:var(--blue-d);border:1.5px solid var(--blue-m); }

/* ── FILTER BUTTONS ─────────────────────────────────────────────── */
.filter-btn { display:inline-flex;align-items:center;gap:.35rem;padding:.375rem .875rem;border-radius:999px;font-size:.875rem;font-weight:600;background:var(--surface);border:1.5px solid var(--border);color:var(--text-muted);cursor:pointer;transition:all .2s;white-space:nowrap; }
.filter-btn:hover,.filter-btn.active { background:var(--blue);border-color:var(--blue);color:#fff; }

/* ── CTA BLOCK ──────────────────────────────────────────────────── */
.cta-block { background:linear-gradient(135deg,var(--blue) 0%,#1D4ED8 50%,#1E3A8A 100%);border-radius:var(--r-2xl);padding:3.5rem 3rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap; }
.cta-block h2 { color:#fff;margin-bottom:.625rem; }
.cta-block p  { color:rgba(255,255,255,.75);font-size:1.0625rem; }
.cta-block-btns { display:flex;gap:.875rem;flex-wrap:wrap;flex-shrink:0; }

/* ── "PORQUÊ A +ON" GALLERY SLIDESHOW ─────────────────────────────── */
/* Container */
.why-gallery {
  position: relative;
  border-radius: var(--r-2xl);
  overflow: hidden;
  background: linear-gradient(135deg, #030A1A, #0B2560, #2563EB);
  box-shadow: var(--sh-xl);
  height: auto;
  min-height: unset;
}

.why-gallery-slide {
  display: none;
  width: 100%;
}

.why-gallery-slide.active {
  display: block;
}

.why-gallery-slide img {
  width: 100%;
  height: auto;
  max-height: 320px;
  object-fit: cover;
  display: block;
}

@media (min-width: 769px) {
  .why-gallery {
    height: auto;
    min-height: unset;
    max-height: 320px;
  }

  .why-gallery-slide img {
    width: 100%;
    height: 320px;
    object-fit: cover;
  }
}
/* Mobile: use aspect-ratio for natural proportions */

/* ── TESTIMONIALS — light blue background ─────────────────────────── */
.testi-section { background:linear-gradient(180deg,#EFF6FF 0%,#F8FAFC 100%); }
.testi-card { background:rgba(255,255,255,.85);border:1.5px solid #BFDBFE;border-radius:var(--r-xl);padding:1.75rem;box-shadow:0 2px 12px rgba(37,99,235,.06); }
.testi-stars { display:flex;gap:.25rem;margin-bottom:1rem; }
.testi-star  { color:#F59E0B;font-size:1.125rem; }
.testi-content { font-size:.9375rem;color:var(--text-2);line-height:1.7;margin-bottom:1.25rem;font-style:italic; }
.testi-author { display:flex;align-items:center;gap:.875rem; }
.testi-avatar { width:44px;height:44px;border-radius:50%;background:var(--blue-l);color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.125rem;flex-shrink:0; }
.testi-name   { font-weight:600;font-size:.9375rem; }
.testi-role   { font-size:.8125rem;color:var(--text-muted); }

/* ── FOOTER ─────────────────────────────────────────────────────── */
.footer { background:#020C1B;color:#fff; }
.footer-accent { height:3px;background:linear-gradient(90deg,var(--blue),#60A5FA,#93C5FD); }
.footer-grid { display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:2.5rem;padding:3.5rem 0 2.5rem; }
@media(max-width:900px){ .footer-grid{grid-template-columns:1fr 1fr;gap:2rem} }
@media(max-width:520px){ .footer-grid{grid-template-columns:1fr;gap:1.5rem} }
.f-logo { display:block; }
.f-logo img { height:40px;width:auto;filter:drop-shadow(0 1px 4px rgba(255,255,255,.1)); }
.f-tagline { font-size:.9375rem;color:#475569;line-height:1.7;margin-top:.625rem; }
.f-contact { display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:#475569;margin-top:.5rem;transition:color .2s; }
.f-contact:hover { color:#93C5FD; }
.footer-divider { border:none;border-top:1px solid rgba(255,255,255,.06);margin:0; }
.footer-col h5 { font-family:var(--font-body);font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#94A3B8;margin-bottom:1rem; }
.footer-col a  { display:block;margin-bottom:.5rem;font-size:.9375rem;color:#475569;transition:color .2s; }
.footer-col a:hover { color:#93C5FD; }
.footer-bottom { display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:1.25rem 0; }
.footer-copy   { font-size:.875rem;color:#334155; }
.social-links  { display:flex;align-items:center;gap:.5rem; }
.social-btn { width:36px;height:36px;border-radius:var(--r-sm);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#64748B;display:flex;align-items:center;justify-content:center;transition:all .2s; }
.social-btn:hover { color:#fff;transform:translateY(-2px); }
.social-btn.fb:hover { background:#1877F2;border-color:#1877F2; }
.social-btn.wa:hover { background:#25D366;border-color:#25D366; }
.social-btn.li:hover { background:#0A66C2;border-color:#0A66C2; }
.social-btn.ig:hover { background:linear-gradient(45deg,#f09433,#dc2743);border-color:#e6683c; }

/* WhatsApp FAB */
.wa-fab { position:fixed;bottom:1.5rem;right:1.5rem;z-index:800;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#25D366,#1DAB54);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.4);transition:transform .25s,box-shadow .25s; }
.wa-fab:hover { transform:scale(1.1);box-shadow:0 6px 28px rgba(37,211,102,.55); }
.wa-fab::before { content:'';position:absolute;width:100%;height:100%;border-radius:50%;background:rgba(37,211,102,.35);animation:wapulse 2.5s ease-out infinite; }
@keyframes wapulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.85);opacity:0}}

/* ── REVEAL ─────────────────────────────────────────────────────── */
.reveal { opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease; }
.reveal.in { opacity:1;transform:none; }

/* ── READING PROGRESS ─────────────────────────────────────────────── */
#reading-progress { position:fixed;top:0;left:0;z-index:999;height:3px;background:var(--blue);width:0;transition:width .1s;pointer-events:none; }

/* ── PAGE HERO (internal pages) ──────────────────────────────────── */
.page-hero {
  background:linear-gradient(135deg,#030A1A 0%,#071535 30%,#0B2560 60%,#143794 85%,#2563EB 100%);
  padding:4.5rem 0 3.5rem; position:relative; overflow:hidden;
  background-size:cover; background-position:center;
}
.page-hero::before { content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(3,10,26,.7) 0%,rgba(7,21,53,.55) 100%);z-index:1;pointer-events:none; }
.page-hero::after  { content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.02)1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02)1px,transparent 1px);background-size:52px 52px;z-index:1;pointer-events:none; }
.page-hero .container  { position:relative;z-index:2; }
.page-hero-eyebrow { color:rgba(147,197,253,.9);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;margin-bottom:.875rem;display:block; }
.page-hero h1 { color:#fff;margin-bottom:1rem; }
.page-hero p  { color:rgba(255,255,255,.7);font-size:1.0625rem;max-width:600px; }
.page-hero-btns { display:flex;gap:.875rem;flex-wrap:wrap;margin-top:2rem; }

/* ── MISC ────────────────────────────────────────────────────────── */
.process-steps { display:flex;flex-direction:column;gap:1.5rem; }
.process-step  { display:flex;gap:1.25rem;align-items:flex-start; }
.step-num { width:36px;height:36px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.875rem;flex-shrink:0; }

.feature-row { display:flex;align-items:flex-start;gap:1rem;padding:1.125rem 0;border-bottom:1px solid var(--border); }
.feature-row:last-child { border-bottom:none; }
.feature-check { width:28px;height:28px;border-radius:var(--r-sm);background:var(--blue-l);color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.1rem; }

.contact-info-item { display:flex;align-items:flex-start;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border); }
.contact-info-item:last-child { border-bottom:none; }
.ci-icon { width:44px;height:44px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0; }

.vacancy-card { background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:1.75rem;transition:all .25s; }
.vacancy-card:hover { border-color:var(--blue-m);box-shadow:var(--sh-lg);transform:translateY(-2px); }