/* ============================================================
   GarantiaBR v2 — Professional Design System
   Full rewrite: glassmorphism, marquee, scroll animations,
   editorial typography, enterprise spacing
   ============================================================ */

/* ====== ACCESSIBILITY ====== */
.skip-link{
  position:absolute;top:-100%;left:16px;
  z-index:9999;
  padding:12px 24px;
  background:var(--accent);color:#fff;
  font-size:14px;font-weight:600;
  border-radius:0 0 8px 8px;
  text-decoration:none;
  transition:top .2s;
}
.skip-link:focus{top:0}

.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;
}

.scroll-progress{
  position:fixed;top:0;left:0;
  height:3px;width:0%;
  background:linear-gradient(90deg,var(--accent),var(--accent-b));
  z-index:101;
  transition:none;
  pointer-events:none;
}

/* Focus indicators */
:focus-visible{
  outline:2px solid var(--accent-b);
  outline-offset:2px;
}

/* ====== RESET & CUSTOM PROPERTIES ====== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  /* Brand colors — Manual da Marca 2026 */
  --bg:#001B18;              /* Azul Petróleo Escuro */
  --bg2:#00231F;             /* Petróleo slightly lighter */
  --bg3:#002E28;             /* Petróleo card bg */
  --t1:#FFFFFF;              /* Branco Puro */
  --t2:#D9D9D9;              /* Cinza Claro institucional */
  --t3:#9aada8;              /* Cinza muted */
  --accent:#017D7B;          /* Verde Água / Turquesa institucional */
  --accent-l:#1a9e9c;        /* Turquesa lighter */
  --accent-b:#4dd0c1;        /* Turquesa bright for emphasis */
  --accent-dark:#013D3C;     /* Turquesa dark */
  --glow:rgba(1,125,123,.14);
  --glow-lg:rgba(1,125,123,.22);
  --border:rgba(255,255,255,.08);
  --border-h:rgba(255,255,255,.15);
  --border-accent:rgba(1,125,123,.35);
  --card:rgba(255,255,255,.04);
  --glass:rgba(0,30,26,.88);
  --glass-border:rgba(255,255,255,.10);
  --r:12px;
  --r-lg:16px;
  --pill:100px;
  /* Typography — Manual da Marca: Roboto (títulos) + Open Sans (corpo) */
  --heading:'Roboto',system-ui,sans-serif;
  --sans:'Open Sans',system-ui,sans-serif;
  --mono:'JetBrains Mono','Fira Code',monospace;
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --shadow-card:0 8px 32px rgba(0,0,0,.25);
  --shadow-hover:0 24px 64px rgba(0,0,0,.4);
  --shadow-glow:0 0 40px rgba(0,137,123,.12);
}

html{
  /* scroll-behavior removed — causes slow scrolling. Smooth scroll handled by JS for anchor links only */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4,h5,h6{font-family:var(--heading)}

body{
  font-family:var(--sans);
  background-color:var(--bg);
  color:var(--t1);
  line-height:1.65;
  overflow-x:hidden;
  font-size:16px;
  /* Subtle noise/grain texture via SVG data URI */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:200px 200px;
}

a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer;border:none;background:none}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 32px;
}

/* ====== SCROLL ANIMATIONS ====== */
/* Scroll reveal — DISABLED to prevent invisible content bugs.
   All content is always visible. Subtle hover/interaction animations remain. */

/* ====== BACKGROUND SYMBOL (scroll-driven rotation) ====== */
.bg-symbol{
  position:fixed;
  top:50%;left:50%;
  width:clamp(500px,60vw,900px);
  height:clamp(500px,60vw,900px);
  transform:translate(-50%,-50%);
  pointer-events:none;
  z-index:0;
  opacity:.03;
  will-change:transform;
}
.bg-symbol-outer,.bg-symbol-check{
  position:absolute;inset:0;
  width:100%;height:100%;
  color:var(--accent);
  will-change:transform;
  transition:transform .15s linear;
}
/* Outer frame gets a glow */
.bg-symbol-outer{
  filter:drop-shadow(0 0 80px rgba(1,125,123,.08));
}

/* Legacy fade-up alias for JS compatibility */
.fade-up{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .55s var(--ease),transform .55s var(--ease);
  transition-delay:calc(var(--i,0) * .07s);
}
.fade-up.visible{opacity:1;transform:translateY(0)}

/* Text reveal — animated via GSAP in JS. CSS only sets initial hidden state. */
.text-reveal{
  clip-path:inset(0 100% 0 0);
}

/* ====== NAV ====== */
.nav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  padding:18px 0;
  transition:all .35s var(--ease);
}

.nav.scrolled{
  background:rgba(0,27,24,.85);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid rgba(255,255,255,.07);
  padding:11px 0;
  box-shadow:0 4px 32px rgba(0,0,0,.22);
}

.nav-inner{
  max-width:1200px;
  margin:0 auto;
  padding:0 32px;
  display:flex;
  align-items:center;
  gap:40px;
}

.logo-img{height:28px}

.nav-links{
  display:flex;
  gap:32px;
  flex:1;
}

.nav-links a{
  font-size:14px;font-weight:500;
  color:var(--t2);
  transition:color .15s;
  position:relative;
}
.nav-links a::after{
  content:'';
  position:absolute;
  bottom:-3px;left:0;right:0;
  height:1px;
  background:var(--accent-b);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s var(--ease);
}
.nav-links a:hover{color:var(--t1)}
.nav-links a:hover::after{transform:scaleX(1)}

.nav-right{
  display:flex;align-items:center;gap:16px;
}

.nav-text-link{
  font-size:14px;font-weight:500;
  color:var(--t2);
  transition:color .15s;
}
.nav-text-link:hover{color:var(--t1)}

.nav-cta{
  font-size:14px;font-weight:600;
  color:var(--t1);
  background:linear-gradient(135deg,var(--accent),var(--accent-l));
  padding:10px 24px;
  border-radius:var(--pill);
  transition:all .2s var(--ease);
  white-space:nowrap;
}
.nav-cta:hover{
  background:var(--accent-l);
  transform:translateY(-1px);
  box-shadow:0 4px 20px rgba(1,125,123,.35);
}

.nav-burger{
  display:none;
  flex-direction:column;
  gap:5px;
  padding:4px;
}
.nav-burger span{
  width:22px;height:2px;
  background:var(--t1);
  border-radius:2px;
  transition:.25s;
}
.nav-burger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

.mobile-menu{
  position:fixed;inset:0;
  z-index:99;
  background:rgba(0,27,24,.97);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:28px;
  opacity:0;pointer-events:none;
  transition:opacity .3s;
}
.mobile-menu.open{opacity:1;pointer-events:auto}
.mobile-menu a{
  font-size:24px;font-weight:600;
  color:var(--t2);
  transition:color .15s;
}
.mobile-menu a:hover{color:var(--t1)}

/* ====== HERO ====== */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;align-items:center;
  padding:140px 0 100px;
  overflow:hidden;
}

.hero-bg{position:absolute;inset:0;z-index:0}

.hero-gradient{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 60% 50% at 50% 15%,rgba(1,125,123,.14),transparent 65%),
    radial-gradient(ellipse 45% 45% at 10% 75%,rgba(1,125,123,.10),transparent 55%),
    radial-gradient(ellipse 40% 40% at 90% 65%,rgba(1,125,123,.07),transparent 55%),
    radial-gradient(circle 300px at 25% 30%,rgba(1,125,123,.06),transparent),
    radial-gradient(circle 250px at 75% 50%,rgba(0,60,55,.08),transparent);
}
/* Floating gradient orbs (Liquid Brokers pattern) */
.hero-bg::before,.hero-bg::after{
  content:'';position:absolute;border-radius:50%;filter:blur(100px);
  pointer-events:none;animation:orbFloat 12s ease-in-out infinite alternate;
}
.hero-bg::before{
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(1,125,123,.12),transparent 70%);
  top:-100px;left:-100px;
}
.hero-bg::after{
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(1,125,123,.08),transparent 70%);
  bottom:-50px;right:-50px;
  animation-delay:-6s;
}
@keyframes orbFloat{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(30px,20px) scale(1.1)}
}

.hero-mesh{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 75% 55% at 50% 35%,black,transparent);
  -webkit-mask-image:radial-gradient(ellipse 75% 55% at 50% 35%,black,transparent);
}

.hero-bg,.hero-gradient,.hero-mesh{
  will-change:transform;
  transition:transform .15s ease-out;
}

.hero-container{
  position:relative;z-index:1;
  text-align:center;
  max-width:860px;
  margin:0 auto;
  animation:heroEntrance .8s cubic-bezier(.4,0,.2,1) both;
}
@keyframes heroEntrance{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}

.hero-tag{
  display:inline-block;
  font-size:12px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent-b);
  margin-bottom:28px;
  padding:6px 16px;
  border:1px solid rgba(77,208,193,.22);
  border-radius:var(--pill);
  background:rgba(0,137,123,.06);
}

.hero h1{
  font-family:var(--heading);
  font-size:clamp(38px,5.5vw,64px);
  font-weight:900;
  line-height:1.18;
  letter-spacing:-.035em;
  margin-bottom:28px;
}
.hero h1 strong{color:var(--t1);font-weight:800}
.hero h1 em{font-style:normal;color:var(--accent-b)}

.hero-sub{
  font-size:18px;
  color:var(--t2);
  line-height:1.75;
  max-width:620px;
  margin:0 auto 48px;
}

.hero-actions{
  display:flex;gap:16px;
  justify-content:center;
  flex-wrap:wrap;
  margin-bottom:32px;
}
.btn-hero-primary{
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:700;
  color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-l));
  padding:16px 32px;
  border-radius:var(--pill);
  transition:all .3s var(--ease);
  box-shadow:0 4px 20px rgba(1,125,123,.25);
  letter-spacing:-.01em;
}
.btn-hero-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 40px rgba(1,125,123,.4);
}
.btn-hero-secondary{
  display:inline-flex;align-items:center;
  font-size:15px;font-weight:600;
  color:var(--t2);
  padding:16px 32px;
  border:1px solid var(--border-h);
  border-radius:var(--pill);
  transition:all .3s var(--ease);
}
.btn-hero-secondary:hover{
  color:var(--t1);
  border-color:var(--accent);
  background:rgba(1,125,123,.06);
  transform:translateY(-2px);
}

.hero-chips{
  display:flex;gap:10px;
  justify-content:center;
  flex-wrap:wrap;
}

.hero-chip{
  font-size:13px;font-weight:500;
  color:var(--t2);
  padding:9px 18px;
  border:1px solid var(--border);
  border-radius:var(--pill);
  display:inline-flex;align-items:center;gap:6px;
  transition:all .25s var(--ease);
}
.hero-chip:hover{
  color:var(--t1);
  border-color:var(--border-h);
  background:rgba(255,255,255,.05);
  transform:translateY(-2px);
}

/* ====== SECTIONS ====== */
.section{
  padding:96px 0;
  position:relative;
}
.section-alt{
  background:var(--bg2);
  position:relative;
}
/* Subtle gradient overlay on alt sections (Liquid Brokers pattern) */
.section-alt::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(1,125,123,.02) 0%,transparent 40%,transparent 60%,rgba(1,125,123,.03) 100%);
}

.section-wave{
  position:relative;
  margin-top:-1px;
  line-height:0;
  z-index:2;
}
.section-wave svg{
  display:block;
  width:100%;
  height:clamp(20px,3vw,40px);
}

.section-title{
  font-family:var(--heading);
  font-size:clamp(30px,4vw,48px);
  font-weight:800;
  line-height:1.13;
  letter-spacing:-.03em;
  text-align:center;
  margin-bottom:40px;
}
.section-title em{font-style:normal;color:var(--accent-b)}

.section-sub{
  text-align:center;
  font-size:18px;
  color:var(--t2);
  max-width:640px;
  margin:12px auto 40px;
  line-height:1.75;
}

/* ====== PRODUCT CARDS ====== */
.products{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}

.product-card{
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border);
  border-radius:var(--r-lg);
  padding:44px 40px;
  display:flex;flex-direction:column;
  transition:all .4s var(--ease);
  position:relative;
  overflow:hidden;
}

/* Gradient border highlight via pseudo-element */
.product-card::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(0,137,123,.22),transparent 55%,rgba(0,137,123,.07));
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}

.product-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 64px rgba(0,0,0,.4),0 0 40px rgba(1,125,123,.06);
  border-color:var(--border-accent);
}
.product-card:hover::before{opacity:1}

.product-card::after{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:radial-gradient(500px circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(1,125,123,.1),transparent 50%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
  z-index:1;
}
.product-card:hover::after{opacity:1}

.product-card h3{
  font-family:var(--heading);font-size:24px;font-weight:800;
  margin-bottom:14px;
  letter-spacing:-.02em;
}
.product-card>p{
  font-size:15px;color:var(--t2);
  line-height:1.75;
  margin-bottom:22px;
}

.product-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:600;
  color:var(--accent-b);
  margin-bottom:32px;
  transition:gap .2s,opacity .2s;
}
.product-link:hover{gap:10px;opacity:.8}

.product-mock{
  border-radius:var(--r);
  overflow:hidden;
  border:1px solid var(--border);
  background:var(--bg);
  margin-top:auto;
}

.mock-chrome{
  display:flex;gap:6px;
  padding:11px 14px;
  background:rgba(255,255,255,.03);
  border-bottom:1px solid var(--border);
}
.mock-chrome span{width:9px;height:9px;border-radius:50%}
.mock-chrome span:nth-child(1){background:#ff5f57}
.mock-chrome span:nth-child(2){background:#febc2e}
.mock-chrome span:nth-child(3){background:#28c840}

/* API code block — syntax highlight colors */
.mock-api pre{
  padding:22px 20px;
  font-size:12px;
  line-height:1.75;
  font-family:var(--mono);
  overflow-x:auto;
  color:#5c5c72;  /* brackets / punctuation */
}

/* Token color classes (applied by script.js tokenizer) */
.tok-key  {color:var(--accent-b)}     /* JSON keys */
.tok-str  {color:#fbbf24}             /* string values */
.tok-num  {color:#60a5fa}             /* numeric values */
.tok-bool {color:#a78bfa}             /* true / false */
.tok-null {color:#f87171}             /* null */
.tok-brk  {color:#4a4a60}             /* brackets & colons */

.mock-dash-inner{padding:18px}

.mock-kpi{
  display:inline-block;
  text-align:center;
  padding:8px 16px;margin:4px;
}
.mock-kpi strong{
  display:block;
  font-size:20px;font-weight:800;
  color:var(--t1);
  font-family:var(--mono);
}
.mock-kpi small{
  font-size:10px;color:var(--t3);
  text-transform:uppercase;letter-spacing:.04em;
}

.mock-bars{
  display:flex;align-items:flex-end;gap:6px;
  height:52px;margin-top:14px;padding:0 8px;
}
.mock-bars div{
  flex:1;
  background:linear-gradient(180deg,var(--accent-l),var(--accent));
  border-radius:3px 3px 0 0;
  min-height:4px;
}

/* ====== LOGOS MARQUEE ====== */
.logos{
  padding:56px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
}

.logos-title{
  text-align:center;
  font-size:22px;font-weight:700;
  color:var(--t1);
  margin-bottom:32px;
  letter-spacing:.01em;
}

/* Marquee outer — clip overflow */
.logos-row{
  overflow:hidden;
  margin-bottom:16px;
  position:relative;
}
.logos-row:last-child{margin-bottom:0}

/* Fade edges */
.logos-row::before,
.logos-row::after{
  content:'';
  position:absolute;top:0;bottom:0;
  width:80px;z-index:1;
  pointer-events:none;
}
.logos-row::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.logos-row::after{right:0;background:linear-gradient(-90deg,var(--bg),transparent)}
.section-alt .logos-row::before{background:linear-gradient(90deg,var(--bg2),transparent)}
.section-alt .logos-row::after{background:linear-gradient(-90deg,var(--bg2),transparent)}

/* Inner scrolling track — duplicated items for seamless loop */
.logos-row-inner{
  display:flex;
  width:max-content;
  animation:marquee 30s linear infinite;
}

/* Second row runs in opposite direction */
.logos-row:nth-child(3) .logos-row-inner{
  animation-direction:reverse;
  animation-duration:36s;
}

.logos-row-inner span{
  font-size:18px;font-weight:700;
  color:var(--t3);
  opacity:.65;
  transition:opacity .25s;
  letter-spacing:-.01em;
  padding:0 40px;
  white-space:nowrap;
}
.logos-row-inner span:hover{opacity:.85}

@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ====== JOURNEY TABS ====== */
.j-tabs{
  display:flex;justify-content:center;
  gap:10px;margin-bottom:28px;
  flex-wrap:wrap;
}

.j-tab{
  font-size:14px;font-weight:600;
  color:var(--t3);
  padding:13px 28px;
  border:1px solid var(--border);
  border-radius:var(--pill);
  transition:all .25s var(--ease);
  cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
}
.j-tab:hover{color:var(--t1);border-color:var(--border-h)}
.j-tab.active{
  color:var(--t1);
  border-color:var(--accent);
  background:transparent;
  box-shadow:0 0 20px rgba(1,125,123,.15),inset 0 0 0 1px var(--accent);
}
.j-tab svg{opacity:.5;transition:opacity .2s}
.j-tab.active svg,.j-tab:hover svg{opacity:1}

.j-desc{text-align:center;min-height:44px;margin-bottom:36px}
.j-desc p{
  display:none;
  font-size:16px;color:var(--t2);
  animation:fadeIn .35s ease;
  line-height:1.7;
}
.j-desc p.active{display:block}

@keyframes fadeIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* ====== MOTOR BLOCK ====== */
.motor-block{
  position:relative;
  background:rgba(0,137,123,.04);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1.5px solid rgba(0,137,123,.22);
  border-radius:var(--r-lg);
  padding:40px 44px;
  margin-bottom:40px;
  overflow:hidden;
  transition:border-color .4s;
}

/* Gradient overlay */
.motor-block::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(0,137,123,.16),transparent 50%,rgba(0,137,123,.05));
  opacity:.7;
  pointer-events:none;
}

/* Breathing animation */
.motor-pulse{
  position:absolute;inset:0;
  border-radius:var(--r-lg);
  pointer-events:none;
  animation:motorPulse 3.5s ease-in-out infinite;
}

@keyframes motorPulse{
  0%,100%{box-shadow:inset 0 0 0 1px rgba(0,137,123,.1),0 0 0 0 transparent}
  50%{box-shadow:inset 0 0 0 2px rgba(0,137,123,.28),0 0 52px rgba(0,137,123,.07)}
}

.motor-header{
  display:flex;align-items:center;gap:12px;
  margin-bottom:28px;position:relative;flex-wrap:wrap;
}
.motor-header svg{color:var(--accent-b)}
.motor-header strong{font-family:var(--heading);font-size:22px;font-weight:800;color:var(--t1);letter-spacing:-.02em}


.motor-caps{
  display:flex;gap:12px;
  flex-wrap:wrap;
  margin-bottom:20px;
  position:relative;
}

/* Horizontal flow line */
.motor-caps::before{
  content:'';
  position:absolute;
  top:50%;left:24px;right:24px;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(0,137,123,.12),rgba(0,137,123,.22),rgba(0,137,123,.12),transparent);
  z-index:0;
}

/* Animated dot flow across caps */
.motor-caps::after{
  content:'';
  position:absolute;
  top:50%;left:0;
  width:9px;height:9px;border-radius:50%;
  background:var(--accent-b);
  box-shadow:0 0 14px var(--accent-b),0 0 28px rgba(77,208,193,.3);
  z-index:1;
  transform:translateY(-50%);
  animation:capFlow 3.2s ease-in-out infinite;
}

@keyframes capFlow{
  0%{left:5%;opacity:0}
  10%{opacity:1}
  90%{opacity:1}
  100%{left:95%;opacity:0}
}

.motor-cap{
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius:11px;
  padding:14px 18px;
  flex:1;min-width:120px;
  text-align:center;
  transition:all .35s var(--ease);
  position:relative;z-index:2;
}
.motor-cap:hover{
  border-color:rgba(0,137,123,.35);
  background:rgba(0,137,123,.07);
  transform:translateY(-3px);
  box-shadow:0 6px 20px rgba(0,137,123,.1);
}
/* Motor cap icon */
.mc-icon{
  display:block;
  margin:0 auto 10px;
  color:var(--accent-b);
  opacity:.8;
  transition:opacity .3s,transform .3s var(--ease);
}
.motor-cap:hover .mc-icon{opacity:1;transform:scale(1.1)}

/* Arrow connectors between caps */
.mc-arrow{
  display:flex;align-items:center;justify-content:center;
  color:var(--accent-b);opacity:.3;
  flex-shrink:0;
  width:20px;
}

.motor-cap span{display:block;font-size:14px;font-weight:700;color:var(--t1);margin-bottom:3px}
.motor-cap small{font-size:12px;color:var(--t3);font-weight:500}

.motor-note{
  font-size:14px;color:var(--t3);
  text-align:center;position:relative;font-style:italic;
  padding-top:4px;
}

/* ====== FLOW PARTICLES ====== */
.j-flow{display:flex;justify-content:center;padding:24px 0}
.j-flow-line{
  width:2px;height:48px;
  background:linear-gradient(180deg,rgba(0,137,123,.35),rgba(0,137,123,.06));
  position:relative;border-radius:2px;
}
.j-particle{
  position:absolute;
  width:7px;height:7px;border-radius:50%;
  background:var(--accent-b);
  left:50%;transform:translateX(-50%);
  opacity:0;
  animation:particleDrop 2.4s ease-in-out infinite;
}
.p1{animation-delay:0s}
.p2{animation-delay:.8s}
.p3{animation-delay:1.6s}

@keyframes particleDrop{
  0%{top:-4px;opacity:0}
  20%{opacity:1}
  80%{opacity:1}
  100%{top:calc(100% + 4px);opacity:0}
}

/* ====== VERTICAL SERVICES ====== */
.vs-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.vs-card{
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:28px 24px;
  transition:all .4s var(--ease);
  position:relative;overflow:hidden;
}

.vs-card::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(0,137,123,.14),transparent 50%);
  opacity:0;transition:opacity .4s;
  pointer-events:none;
}

.vs-card:hover{
  border-color:var(--border-h);
  background:rgba(255,255,255,.05);
  transform:translateY(-4px);
  box-shadow:0 12px 36px rgba(0,0,0,.25);
}
.vs-card:hover::before{opacity:1}

.vs-card::after,.ind-card::after{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:radial-gradient(400px circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(1,125,123,.08),transparent 50%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}
.vs-card:hover::after,.ind-card:hover::after{opacity:1}

.vs-card.active{
  border-color:rgba(0,137,123,.35);
  background:rgba(0,137,123,.04);
  animation:cardBreathe 3s ease-in-out infinite;
}
.vs-card.active::after{
  content:'';
  position:absolute;
  top:-1px;left:15%;right:15%;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--accent-b),transparent);
  border-radius:2px;
}
.vs-card.active .vs-icon{
  color:var(--accent-b);
  background:rgba(0,137,123,.12);
  border-color:rgba(0,137,123,.3);
}

.vs-card.inactive{
  opacity:.12;
  transform:scale(.94);
  pointer-events:none;
  filter:grayscale(.5);
}

.vs-card:nth-child(1){transition-delay:.00s}
.vs-card:nth-child(2){transition-delay:.06s}
.vs-card:nth-child(3){transition-delay:.12s}
.vs-card:nth-child(4){transition-delay:.18s}
.vs-card:nth-child(5){transition-delay:.24s}
.vs-card:nth-child(6){transition-delay:.30s}

@keyframes cardBreathe{
  0%,100%{box-shadow:0 0 0 0 transparent}
  50%{box-shadow:0 0 24px rgba(0,137,123,.09)}
}

.vs-icon{
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius:10px;
  color:var(--t3);
  margin-bottom:16px;
  transition:all .4s var(--ease);
}

.vs-card h4{font-size:15px;font-weight:700;margin-bottom:8px}
.vs-card p{font-size:15px;color:var(--t2);line-height:1.65}

.vs-badge{
  position:absolute;top:12px;right:12px;
  font-size:10px;font-weight:700;
  color:var(--accent-b);
  background:rgba(0,137,123,.1);
  padding:3px 10px;border-radius:var(--pill);
  text-transform:uppercase;letter-spacing:.06em;
}
.vs-card-core{border-color:rgba(0,137,123,.15)}


/* ====== USE CASE SHOWCASE ====== */
.uc-showcase{display:none;animation:fadeIn .4s ease}
.uc-showcase.active{display:block}

.uc-label{
  font-size:13px;font-weight:600;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--t3);
  text-align:center;margin-bottom:22px;
}

.uc-pills{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}

.uc-pill{
  display:flex;align-items:flex-start;gap:14px;
  padding:22px 24px;
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border);
  border-radius:var(--r);
  transition:all .35s var(--ease);
}
.uc-pill:hover{
  border-color:rgba(0,137,123,.25);
  background:rgba(0,137,123,.04);
  transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}
.uc-pill svg{color:var(--accent-b);margin-top:2px;flex-shrink:0}
.uc-pill strong{display:block;font-size:14px;font-weight:700;margin-bottom:5px}
.uc-pill span{font-size:13px;color:var(--t2);line-height:1.55}

.vs-grid.hidden{display:none}

/* ====== INDUSTRIES ====== */
.ind-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}

.ind-card{
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border);
  border-radius:var(--r);
  padding:36px 28px;
  transition:all .4s var(--ease);
  position:relative;overflow:hidden;
}

.ind-card::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(0,137,123,.18),transparent 55%,rgba(0,137,123,.06));
  opacity:0;transition:opacity .4s;
  pointer-events:none;
}

.ind-card:hover{
  border-color:var(--border-accent);
  transform:translateY(-6px);
  box-shadow:var(--shadow-hover);
}
.ind-card:hover::before{opacity:1}

.ind-icon{
  width:52px;height:52px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,137,123,.08);
  border:1px solid rgba(0,137,123,.15);
  border-radius:11px;
  margin-bottom:22px;
  color:var(--accent-b);
  transition:all .35s var(--ease);
}
.ind-card:hover .ind-icon{
  background:rgba(0,137,123,.14);
  border-color:rgba(0,137,123,.3);
  box-shadow:0 0 18px rgba(0,137,123,.12);
}

.ind-card h4{font-size:17px;font-weight:700;margin-bottom:11px;letter-spacing:-.01em}
.ind-card p{font-size:15px;color:var(--t2);line-height:1.75}

/* ====== JOURNEY CARDS ====== */
.journeys-label{
  font-family:var(--heading);
  font-size:14px;font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--accent-b);
  text-align:center;
  margin-bottom:32px;
}

.journeys-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-bottom:32px;
}

.journey-card{
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:32px 28px;
  transition:all .4s var(--ease);
  position:relative;overflow:hidden;
}
.journey-card::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(1,125,123,.14),transparent 50%);
  opacity:0;transition:opacity .4s;
  pointer-events:none;
}
.journey-card::after{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:radial-gradient(400px circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(1,125,123,.08),transparent 50%);
  opacity:0;transition:opacity .4s var(--ease);
  pointer-events:none;
}
.journey-card:hover{
  border-color:var(--border-h);
  background:rgba(255,255,255,.05);
  transform:translateY(-4px);
  box-shadow:0 12px 36px rgba(0,0,0,.25);
}
.journey-card:hover::before{opacity:1}
.journey-card:hover::after{opacity:1}

.journey-icon{
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(1,125,123,.08);
  border:1px solid rgba(1,125,123,.2);
  border-radius:12px;
  color:var(--accent-b);
  margin-bottom:18px;
  transition:all .4s var(--ease);
}
.journey-card:hover .journey-icon{
  background:rgba(1,125,123,.15);
  border-color:rgba(1,125,123,.35);
  transform:scale(1.05);
}

.journey-card h4{
  font-family:var(--heading);
  font-size:17px;
  font-weight:700;
  margin-bottom:10px;
  letter-spacing:-.01em;
}
.journey-card p{
  font-size:15px;
  color:var(--t2);
  line-height:1.7;
}

.journeys-more{
  text-align:center;
  font-size:15px;
  color:var(--t3);
  line-height:1.7;
}
.journeys-more a{
  color:var(--accent-b);
  text-decoration:underline;
  text-underline-offset:3px;
  transition:color .2s;
}
.journeys-more a:hover{color:var(--t1)}

/* ====== ROADMAP ====== */
.roadmap{
  max-width:680px;
  margin:0 auto;
  display:flex;flex-direction:column;
  gap:0;
  position:relative;
}

/* Vertical connecting line */
.roadmap::before{
  content:'';
  position:absolute;
  left:35px;top:0;bottom:0;
  width:2px;
  background:linear-gradient(180deg,
    transparent,
    rgba(0,137,123,.18) 8%,
    rgba(0,137,123,.18) 92%,
    transparent
  );
  z-index:0;
}

.roadmap-step{
  display:flex;gap:28px;
  align-items:flex-start;
  padding:36px 0;
  border-bottom:1px solid var(--border);
  transition:all .3s var(--ease);
  position:relative;z-index:1;
}
.roadmap-step:last-child{border-bottom:none}
.roadmap-step:hover{padding-left:10px}

/* Numbered circle */
.roadmap-num{
  display:flex;align-items:center;justify-content:center;
  width:72px;height:72px;
  border:2px solid rgba(0,137,123,.18);
  border-radius:50%;
  flex-shrink:0;
  font-size:24px;
  font-weight:900;
  color:var(--accent);
  opacity:.6;
  line-height:1;
  font-family:var(--mono);
  transition:all .3s var(--ease);
  background:rgba(0,137,123,.03);
}
.roadmap-step:hover .roadmap-num{
  border-color:rgba(0,137,123,.4);
  opacity:.75;
  box-shadow:0 0 22px rgba(0,137,123,.1);
}

.roadmap-step h4{font-family:var(--heading);font-size:22px;font-weight:800;margin-bottom:10px;letter-spacing:-.02em}
.roadmap-step p{font-size:15px;color:var(--t2);line-height:1.75}

/* ====== IMPACT ====== */
.impact{
  display:flex;
  align-items:center;justify-content:center;
  gap:40px;margin-bottom:36px;flex-wrap:wrap;
}

.impact-label{
  display:block;font-size:12px;
  text-transform:uppercase;letter-spacing:.09em;
  color:var(--t3);margin-bottom:10px;font-weight:600;
}

.impact-big{
  font-size:clamp(48px,7vw,80px);
  font-weight:900;
  letter-spacing:-.045em;
  line-height:1;
  font-family:var(--mono);
}

.strike{
  color:rgba(239,68,68,.55);
  text-decoration:line-through;
  text-decoration-thickness:4px;
}

.accent{color:var(--accent-b)}
.impact-arrow{color:var(--t3)}

/* Animated reduction bar */
.impact-bar-wrap{
  max-width:500px;
  margin:0 auto 28px;
}
.impact-bar-label{
  display:flex;justify-content:space-between;
  font-size:12px;color:var(--t3);
  margin-bottom:9px;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;
}
/* .impact-bar-track is injected by JS; .impact-bar-bg is the CSS-only alias */
.impact-bar-bg,
.impact-bar-track{
  height:8px;
  background:rgba(255,255,255,.06);
  border-radius:var(--pill);
  overflow:hidden;
}
.impact-bar-fill{
  height:100%;
  background:linear-gradient(90deg,var(--accent),var(--accent-b));
  border-radius:var(--pill);
  width:100%;
  transition:width 1.8s cubic-bezier(.4,0,.2,1);
}
.impact-bar-fill.visible{width:13%}

.impact-sub{
  text-align:center;
  font-size:16px;color:var(--t2);
  max-width:580px;
  margin:0 auto 52px;
  line-height:1.75;
}

.stats{
  display:flex;justify-content:center;gap:56px;flex-wrap:wrap;
}

.stat{text-align:center}
.stat strong{
  display:block;
  font-size:34px;font-weight:800;
  color:var(--t1);
  letter-spacing:-.03em;line-height:1;
  font-family:var(--mono);
}
.stat span{
  font-size:12px;color:var(--t3);
  text-transform:uppercase;letter-spacing:.05em;
  margin-top:7px;display:block;font-weight:500;
}

/* ====== TESTIMONIAL (editorial/asymmetric) ====== */
.section-eyebrow{
  font-family:var(--heading);
  font-size:13px;font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--accent-b);
  text-align:center;
  margin-bottom:28px;
}

.testimonial{
  max-width:760px;
  margin:0 auto;
  padding-left:48px;
  position:relative;
}

/* Large decorative opening quote */
.testimonial::before{
  content:'\201C';
  position:absolute;
  left:-8px;top:-44px;
  font-size:120px;
  line-height:1;
  color:var(--accent);
  opacity:.15;
  font-family:Georgia,'Times New Roman',serif;
  pointer-events:none;
  font-style:normal;
}

.testimonial blockquote{
  font-size:20px;font-weight:400;
  line-height:1.8;color:var(--t1);
  font-style:italic;margin-bottom:36px;
  position:relative;
}

.testimonial-author{
  display:flex;align-items:center;gap:16px;
}

.testimonial-avatar{
  width:52px;height:52px;border-radius:50%;
  background:rgba(0,137,123,.12);
  border:2px solid rgba(0,137,123,.22);
  color:var(--accent-b);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:16px;
  flex-shrink:0;
}

.testimonial-author strong{
  display:block;font-size:15px;font-weight:600;text-align:left;
}
.testimonial-author span{
  font-size:13px;color:var(--t3);
  display:block;text-align:left;margin-top:2px;
}

/* ====== TRUST GRID ====== */
.trust-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  max-width:960px;
  margin:0 auto;
}

.trust-item{
  display:flex;flex-direction:column;
  align-items:flex-start;
  padding:24px 22px;
  background:var(--glass);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border);
  border-radius:var(--r);
  transition:all .3s var(--ease);
}

.trust-item:hover{
  border-color:var(--border-accent);
  background:rgba(255,255,255,.05);
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(0,0,0,.2);
}

.trust-icon{
  width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,137,123,.08);
  border:1px solid rgba(0,137,123,.12);
  border-radius:9px;
  color:var(--accent-b);
  flex-shrink:0;
  margin-bottom:14px;
  transition:all .3s;
}
.trust-item:hover .trust-icon{
  background:rgba(0,137,123,.14);
  border-color:rgba(0,137,123,.25);
}

.trust-item span{
  font-size:14px;font-weight:700;
  line-height:1.3;color:var(--t1);
}
.trust-item small{
  display:block;font-size:12px;
  color:var(--t3);margin-top:5px;
  line-height:1.5;font-weight:400;
}

/* ====== CTA SECTION ====== */
.cta{
  position:relative;
  padding:96px 0;
  overflow:hidden;
}

.cta::before{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(135deg,var(--accent) 0%,#00695c 40%,var(--accent-dark) 100%);
  z-index:0;
}

.cta::after{
  content:'';
  position:absolute;
  width:700px;height:700px;border-radius:50%;
  background:rgba(77,208,193,.09);
  filter:blur(140px);
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  z-index:0;
}

.cta-inner{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;
  gap:72px;align-items:start;
}

.cta-text h2{
  font-size:clamp(28px,3.2vw,42px);
  font-weight:800;color:#fff;
  line-height:1.18;margin-bottom:18px;
  letter-spacing:-.025em;
}
.cta-text p{
  font-size:17px;color:rgba(255,255,255,.78);
  line-height:1.75;margin-bottom:28px;
}

.cta-checks{
  list-style:none;
  display:flex;flex-direction:column;gap:13px;
}
.cta-checks li{
  display:flex;align-items:center;gap:11px;
  font-size:15px;color:rgba(255,255,255,.82);
}
.cta-checks svg{color:rgba(255,255,255,.65);flex-shrink:0}

/* Form card */
.cta-form{
  background:#ffffff;
  border-radius:var(--r-lg);
  padding:40px 36px;
  display:flex;flex-direction:column;gap:14px;
  box-shadow:0 32px 80px rgba(0,0,0,.36);
}

.cta-form input{
  padding:14px 17px;
  border:1.5px solid #e5e5e5;
  border-radius:9px;
  font-size:14px;
  font-family:var(--sans);
  color:#111;
  background:#fafafa;
  transition:border-color .15s,box-shadow .15s,background .15s;
  width:100%;
}
.cta-form input::placeholder{color:#aaa}
.cta-form input:focus{
  outline:none;
  border-color:var(--accent);
  background:#fff;
  box-shadow:0 0 0 3px rgba(0,137,123,.1);
}

.cta-row{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;
}

.btn-submit{
  padding:15px 28px;
  font-size:15px;font-weight:700;
  color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-l));
  border:none;border-radius:var(--pill);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all .3s var(--ease);
  letter-spacing:-.01em;
  box-shadow:0 4px 20px rgba(1,125,123,.2);
}
.btn-submit:hover{
  background:linear-gradient(135deg,var(--accent-l),var(--accent));
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(1,125,123,.35);
}
.btn-submit:disabled{
  opacity:.6;cursor:not-allowed;transform:none;
  box-shadow:none;
}

.form-field{display:flex;flex-direction:column;gap:4px}
.form-fine{font-size:11px;color:#aaa;text-align:center}
.form-fine a:hover{color:var(--accent)}

/* ====== FOOTER ====== */
.footer{
  background:linear-gradient(180deg,var(--bg),rgba(1,125,123,.04));
  border-top:1px solid var(--border);
  padding:72px 0 36px;
  position:relative;
}

.footer-top{
  display:grid;grid-template-columns:1.2fr 3fr;
  gap:72px;margin-bottom:56px;
}

.footer-logo{height:24px;margin-bottom:16px}
.footer-brand p{font-size:14px;color:var(--t3);line-height:1.65}

.footer-cols{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
}
.footer-cols h5{
  font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;
  color:var(--t2);margin-bottom:18px;
}
.footer-cols a{
  display:block;font-size:13px;color:var(--t3);
  padding:4px 0;transition:color .15s;
}
.footer-cols a:hover{color:var(--t1)}

.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:24px;border-top:1px solid var(--border);
  font-size:12px;color:var(--t3);
}
.footer-social{display:flex;gap:12px}
.footer-social a{color:var(--t3);transition:color .15s}
.footer-social a:hover{color:var(--t1)}

/* ====== FLOATING CTA ====== */
.floating-cta{
  position:fixed;
  right:0;top:50%;
  transform:translateY(-50%);
  z-index:98;
  display:flex;flex-direction:column;gap:1px;
}

.floating-cta a{
  display:flex;flex-direction:column;
  align-items:center;gap:5px;
  padding:15px 13px;
  background:rgba(0,27,24,.9);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid var(--border);
  font-size:10px;font-weight:600;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--t3);
  transition:all .25s;
  min-width:74px;text-align:center;
}
.floating-cta a:first-child{border-radius:var(--r) 0 0 0;border-bottom:none}
.floating-cta a:last-child{border-radius:0 0 0 var(--r)}
.floating-cta a:hover{
  background:rgba(0,137,123,.1);
  color:var(--accent-b);
  border-color:rgba(0,137,123,.3);
}

/* ====== LEGAL PAGES ====== */
.legal-page{padding:160px 0 100px;min-height:80vh}
.legal-page h1{font-family:var(--heading);font-size:clamp(30px,4vw,44px);font-weight:800;letter-spacing:-.03em;margin-bottom:12px}
.legal-meta{font-size:14px;color:var(--t3);margin-bottom:48px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.legal-page h2{font-family:var(--heading);font-size:22px;font-weight:700;margin:48px 0 16px;color:var(--t1);letter-spacing:-.02em}
.legal-page p{font-size:16px;color:var(--t2);line-height:1.8;margin-bottom:16px}
.legal-page ul,.legal-page ol{padding-left:24px;margin-bottom:16px}
.legal-page li{font-size:15px;color:var(--t2);line-height:1.7;margin-bottom:8px}
.legal-page dl{margin-bottom:24px}
.legal-page dt{font-weight:700;color:var(--t1);font-size:15px;margin-top:16px}
.legal-page dd{font-size:15px;color:var(--t2);line-height:1.7;margin-left:0;padding-left:16px;border-left:2px solid var(--border);margin-top:4px}
.legal-page a{color:var(--accent-b);text-decoration:underline}
.legal-contact{margin-top:48px;padding-top:24px;border-top:1px solid var(--border);font-size:14px;color:var(--t3)}

/* ====== LANGUAGE TOGGLE ====== */
.lang-toggle{
  display:flex;
  align-items:center;
  gap:4px;
  margin-right:8px;
}
.lang-btn{
  font-size:12px;
  font-weight:600;
  color:var(--t3);
  background:none;
  border:none;
  cursor:pointer;
  padding:4px 8px;
  border-radius:4px;
  transition:all .2s var(--ease);
  letter-spacing:.02em;
}
.lang-btn:hover{
  color:var(--t1);
}
.lang-btn.active{
  color:var(--accent-b);
  font-weight:700;
}
.lang-sep{
  color:var(--t3);
  font-size:12px;
  opacity:.4;
  user-select:none;
}
.mobile-lang{
  margin-bottom:24px;
  justify-content:center;
}
.mobile-lang .lang-btn{
  font-size:16px;
  padding:8px 16px;
}
.mobile-lang .lang-sep{
  font-size:16px;
}

/* ====== RESPONSIVE ====== */
@media(max-width:1200px){
  .ind-grid{grid-template-columns:repeat(2,1fr)}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:1024px){
  .products{grid-template-columns:1fr}
  .cta-inner{grid-template-columns:1fr;gap:48px}
  .footer-top{grid-template-columns:1fr;gap:48px}
  .footer-cols{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:768px){
  .nav-links,.nav-right{display:none}
  .nav-burger{display:flex}

  .container{padding:0 20px}
  .section{padding:88px 0}

  .hero{min-height:auto;padding:140px 0 72px}
  .hero h1{font-size:clamp(32px,8vw,48px)}
  .hero-sub{font-size:16px}
  .hero-prompt{max-width:100%}
  .hero-chips{flex-direction:column;align-items:center}

  .products{gap:18px}
  .product-card{padding:32px 28px}

  .vs-grid{grid-template-columns:1fr}
  .ind-grid{grid-template-columns:1fr}
  .journeys-grid{grid-template-columns:1fr 1fr}
  .uc-pills{grid-template-columns:1fr}
  .trust-grid{grid-template-columns:1fr}

  .motor-block{padding:28px 24px}
  .motor-caps{gap:8px}
  .motor-cap{min-width:0}

  .j-tabs{flex-direction:column;align-items:center;gap:8px}

  .stats{gap:28px}
  .impact{flex-direction:column;gap:20px}

  .cta-row{grid-template-columns:1fr}
  .cta-form{padding:32px 24px}

  .footer-cols{grid-template-columns:repeat(2,1fr)}

  .testimonial{padding-left:0}
  .testimonial::before{font-size:80px;left:-2px;top:-22px}

  .roadmap::before{left:29px}
  .roadmap-num{width:60px;height:60px;font-size:20px}

  .floating-cta{display:none}

  .logos-row-inner span{padding:0 28px}

  .section-title{margin-bottom:36px}
  .section-sub{margin-bottom:36px;margin-top:-16px}
}

@media(max-width:640px){
  .hero h1{font-size:32px}
  .impact-big{font-size:52px}
  .section-title{font-size:28px}
  .trust-grid{grid-template-columns:1fr}
  .impact-arrow svg{transform:rotate(90deg)}
}

@media(max-width:480px){
  .footer-cols{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:12px;text-align:center}
  .motor-caps{flex-direction:column}
  .motor-cap{min-width:100%}
  .mc-arrow{transform:rotate(90deg);width:100%;height:20px}
  .cta-text h2{font-size:26px}
  .hero-tag{font-size:11px}
  .hero-actions{flex-direction:column;align-items:center}
  .btn-hero-primary,.btn-hero-secondary{width:100%;justify-content:center}
  .journeys-grid{grid-template-columns:1fr}
}

/* ====== JS-INJECTED ELEMENT STYLES ====== */

/* Typing cursor (code block) */
.typing-cursor{
  display:inline-block;
  width:2px;margin-left:1px;
  color:var(--accent-b);
  animation:blink .75s step-end infinite;
}
@keyframes blink{
  0%,100%{opacity:1}
  50%{opacity:0}
}

/* Form validation states */
.input-error{
  border-color:#ef4444 !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.12) !important;
}
.field-error{
  display:block;
  font-size:12px;color:#ef4444;
  margin-top:4px;margin-bottom:2px;
  padding-left:2px;
}

/* Form success state */
.form-success{
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  padding:48px 32px;
  gap:16px;
  background:#fff;
  border-radius:var(--r-lg);
  box-shadow:0 32px 80px rgba(0,0,0,.36);
}
.form-success svg{color:var(--accent);stroke-width:2}
.form-success h3{font-size:20px;font-weight:700;color:#111}
.form-success p{font-size:14px;color:#666;line-height:1.6}

/* Cookie banner */
#cookie-banner{
  position:fixed;
  bottom:24px;left:24px;right:24px;
  max-width:520px;
  background:var(--bg3);
  border:1px solid var(--border-h);
  border-radius:var(--r-lg);
  padding:20px 24px;
  z-index:200;
  display:flex;align-items:center;
  gap:20px;flex-wrap:wrap;
  box-shadow:0 16px 48px rgba(0,0,0,.4);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  opacity:0;
  transform:translateY(16px);
  transition:opacity .4s var(--ease),transform .4s var(--ease);
  pointer-events:none;
}
#cookie-banner.cookie-visible{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
#cookie-banner.cookie-hidden{
  opacity:0;
  transform:translateY(16px);
  pointer-events:none;
}
#cookie-banner p{
  font-size:13px;color:var(--t2);
  line-height:1.55;flex:1;min-width:200px;
}
#cookie-banner .cookie-policy-link{
  color:var(--accent-b);text-decoration:underline;
}
.cookie-actions{display:flex;gap:10px;flex-shrink:0}
.cookie-btn{
  font-size:13px;font-weight:600;
  padding:8px 18px;border-radius:8px;
  cursor:pointer;font-family:var(--sans);
  transition:all .2s;
}
.cookie-btn-primary{
  background:var(--accent);color:#fff;border:1px solid var(--accent);
}
.cookie-btn-primary:hover{background:var(--accent-l)}
.cookie-btn-secondary{
  background:transparent;color:var(--t2);
  border:1px solid var(--border-h);
}
.cookie-btn-secondary:hover{color:var(--t1);border-color:var(--border-h)}