@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700&family=IBM+Plex+Mono:wght@400;500&display=swap");

/* ============ TOKENS (NV6 DATA design system) ============ */
:root{
  --nvc-red:#FF2710; --nvc-navy:#112D45; --nvc-off-white:#FDFEFB;
  --red-50:#FFF3F1; --red-100:#FFE0DB; --red-200:#FFB9AF; --red-400:#FF5340;
  --red-500:#FF2710; --red-600:#DE1C08; --red-700:#AF1606;
  --navy-900:#0A1B29; --navy-800:#112D45; --navy-700:#1B4164; --navy-600:#2A5C84;
  --navy-500:#4C7CA0; --navy-300:#91A9BC; --navy-200:#BECCD8; --navy-100:#DCE4EB; --navy-50:#EFF3F7;
  --white:#FFFFFF; --gray-600:#5F686C;
  --green-500:#1E8A5F;

  --text-strong:var(--navy-800); --text-body:#334A5E; --text-muted:var(--navy-500);
  --text-inverse:var(--nvc-off-white); --text-accent:var(--nvc-red);
  --text-link:var(--nvc-red); --text-link-hover:var(--red-700);
  --surface-page:var(--nvc-off-white); --surface-card:var(--white);
  --surface-sunken:var(--navy-50); --surface-inverse:var(--navy-800);
  --surface-inverse-deep:var(--navy-900); --surface-accent:var(--nvc-red);
  --surface-accent-soft:var(--red-50);
  --border-subtle:var(--navy-100); --border-default:var(--navy-200);
  --accent:var(--nvc-red); --accent-hover:var(--red-600); --accent-press:var(--red-700);
  --focus-ring:rgba(255,39,16,0.35);
  --gradient-navy-veil:linear-gradient(90deg,var(--nvc-navy) 0%,rgba(17,45,69,0) 100%);
  --gradient-navy-scrim:linear-gradient(180deg,rgba(10,27,41,0) 0%,rgba(10,27,41,0.85) 100%);

  --font-display:"Barlow","Helvetica Neue",Arial,sans-serif;
  --font-body:"DM Sans","Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700; --weight-extrabold:800;
  --text-2xs:.6875rem; --text-xs:.75rem; --text-sm:.875rem; --text-md:1rem; --text-lg:1.125rem;
  --text-xl:1.375rem; --text-2xl:1.75rem; --text-3xl:2.25rem; --text-4xl:3rem; --text-5xl:4rem;
  --leading-tight:1.02; --leading-snug:1.15; --leading-normal:1.35; --leading-relaxed:1.6;
  --tracking-display:-.02em; --tracking-label:.08em; --tracking-eyebrow:.16em;
  --type-h1:var(--weight-bold) var(--text-4xl)/var(--leading-snug) var(--font-display);
  --type-h2:var(--weight-bold) var(--text-3xl)/var(--leading-snug) var(--font-display);
  --type-h3:var(--weight-semibold) var(--text-2xl)/var(--leading-snug) var(--font-display);
  --type-h4:var(--weight-semibold) var(--text-xl)/var(--leading-normal) var(--font-display);
  --type-body-lg:var(--weight-regular) var(--text-lg)/var(--leading-relaxed) var(--font-body);
  --type-body:var(--weight-regular) var(--text-md)/var(--leading-relaxed) var(--font-body);
  --type-body-sm:var(--weight-regular) var(--text-sm)/var(--leading-relaxed) var(--font-body);

  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:2.5rem; --space-8:3rem; --space-9:4rem; --space-10:5rem;
  --space-11:7rem; --space-12:9rem;
  --container-max:1200px; --gutter:var(--space-5);
  --radius-xs:4px; --radius-sm:8px; --radius-md:14px; --radius-lg:22px; --radius-xl:32px; --radius-pill:999px;
  --sweep-radius:50% 0 0 50%/50% 0 0 50%;

  --shadow-xs:0 1px 2px rgba(17,45,69,.06);
  --shadow-sm:0 2px 6px rgba(17,45,69,.08);
  --shadow-md:0 8px 20px -6px rgba(17,45,69,.14);
  --shadow-lg:0 20px 44px -12px rgba(17,45,69,.2);
  --shadow-accent:0 10px 24px -8px rgba(255,39,16,.4);
  --blur-veil:saturate(140%) blur(14px);

  --duration-fast:120ms; --duration-base:200ms; --duration-slow:380ms; --duration-reveal:640ms;
  --ease-standard:cubic-bezier(.2,0,.2,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --icon-main:var(--navy-800);
}
.nvc-inverse{--icon-main:var(--nvc-off-white)}
.nvc-inverse{
  --text-strong:var(--nvc-off-white);
  --text-body:rgba(253,254,251,.82);
  --text-muted:rgba(253,254,251,.6);
  --text-link:var(--nvc-off-white); --text-link-hover:var(--red-200);
  --surface-card:rgba(253,254,251,.07);
  --border-subtle:rgba(253,254,251,.16);
  --border-default:rgba(253,254,251,.28);
}

/* ============ BASE ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--surface-page);color:var(--text-strong);font:var(--type-body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);border-color:var(--accent)}
.wrap{max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--space-10)}
.sec-lg{padding-block:var(--space-11)}
.sunken{background:var(--surface-sunken)}
.eyebrow{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-xs);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--accent);margin:0}
.nvc-inverse .eyebrow{color:var(--red-200)}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);letter-spacing:var(--tracking-display);text-wrap:balance;color:var(--text-strong)}
h2{font:var(--type-h2);letter-spacing:var(--tracking-display)}
h3{font:var(--type-h4);letter-spacing:0}
p{margin:0;color:var(--text-body);text-wrap:pretty;max-width:68ch}
.lead{font:var(--type-body-lg)}
.head{display:grid;gap:var(--space-3);margin-bottom:var(--space-8);max-width:60ch}

/* ============ BUTTON ============ */
.btn{display:inline-flex;align-items:center;gap:var(--space-2);border-radius:var(--radius-pill);
  font-family:var(--font-display);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);
  text-transform:uppercase;font-size:var(--text-xs);padding:.9rem 1.5rem;border:1px solid transparent;
  cursor:pointer;position:relative;overflow:hidden;isolation:isolate;
  transition:background-color var(--duration-fast) var(--ease-standard),
  color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),
  box-shadow var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
.btn .icon-svg{width:16px;height:16px}
.btn-label{position:relative;z-index:2}
.btn-primary{background:var(--accent);color:var(--nvc-off-white)}
.btn-primary:hover{background:var(--accent-hover);box-shadow:var(--shadow-accent);color:var(--nvc-off-white)}
.btn-primary:active{transform:translateY(1px)}
.btn-outline{background:transparent;color:var(--text-strong);border-color:var(--border-default)}
.btn-outline:hover{background:var(--navy-50);border-color:var(--navy-800);color:var(--text-strong)}
.nvc-inverse .btn-outline{color:var(--nvc-off-white);border-color:rgba(253,254,251,.4)}
.nvc-inverse .btn-outline:hover{background:rgba(253,254,251,.1);border-color:var(--nvc-off-white);color:var(--nvc-off-white)}
.btn-lg{padding:1.05rem 1.9rem;font-size:var(--text-sm)}
.btn-sm{padding:.65rem 1.15rem}
.btn-ghost{background:transparent;color:var(--text-body)}
.btn-ghost:hover{color:var(--accent)}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* expanding icon chip on hover (Framer-style fill), only for buttons carrying an icon.
   The chip's box is defined purely with top/right/bottom/left (never `width`), so every
   value the transition tweens is a plain length and the fill grows smoothly frame by
   frame instead of snapping (CSS can't interpolate a `width` that ends on `auto`). */
.btn:has(.icon-svg){padding-right:2.75rem;
  transition:background-color var(--duration-fast) var(--ease-standard),
  color var(--duration-slow) var(--ease-out),border-color var(--duration-slow) var(--ease-out),
  box-shadow var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
.btn-lg:has(.icon-svg){padding-right:3.35rem}
.btn-sm:has(.icon-svg){padding-right:2.35rem}
.btn:has(.icon-svg) .icon-svg{position:absolute;top:50%;right:.95rem;transform:translateY(-50%);z-index:2;
  transition:right var(--duration-slow) var(--ease-out)}
.btn:has(.icon-svg):hover .icon-svg{right:1.15rem}
.btn-lg:has(.icon-svg) .icon-svg{right:1.15rem}
.btn-lg:has(.icon-svg):hover .icon-svg{right:1.4rem}
.btn-sm:has(.icon-svg) .icon-svg{right:.8rem}
.btn-sm:has(.icon-svg):hover .icon-svg{right:1rem}
.btn:has(.icon-svg)::before{content:"";position:absolute;top:.35rem;bottom:.35rem;
  right:.35rem;left:calc(100% - 2.55rem);
  border-radius:var(--radius-pill);z-index:1;pointer-events:none;
  transition:left var(--duration-slow) var(--ease-out),top var(--duration-slow) var(--ease-out),
  right var(--duration-slow) var(--ease-out),bottom var(--duration-slow) var(--ease-out),
  background-color var(--duration-slow) var(--ease-out)}
.btn-lg:has(.icon-svg)::before{left:calc(100% - 2.95rem)}
.btn-sm:has(.icon-svg)::before{left:calc(100% - 2.25rem)}
.btn:has(.icon-svg):hover::before{top:0;right:0;bottom:0;left:0}
.btn-primary:has(.icon-svg)::before{background:rgba(253,254,251,.22)}
.btn-primary:has(.icon-svg):hover::before{background:var(--nvc-off-white)}
.btn-primary:has(.icon-svg):hover{color:var(--accent)}
.btn-outline:has(.icon-svg)::before{background:transparent}
.btn-outline:has(.icon-svg):hover::before{background:var(--accent)}
.btn-outline:has(.icon-svg):hover{color:var(--nvc-off-white);border-color:var(--accent)}
.nvc-inverse .btn-outline:has(.icon-svg):hover{color:var(--nvc-off-white);border-color:var(--accent)}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:30;background:var(--nvc-off-white);
  border-bottom:1px solid var(--navy-100);box-shadow:var(--shadow-xs)}
.nav-in{display:flex;align-items:center;gap:var(--space-7);padding-block:var(--space-2);
  max-width:var(--container-max);margin:0 auto;padding-inline:var(--gutter)}
.nav-in>a:first-child{flex:none}
.nav-logo{height:48px;width:auto;max-width:none;flex:none}
.nav-links{display:flex;gap:var(--space-6);margin-left:var(--space-5)}
.nav-links a{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-body)}
.nav-links a:hover{color:var(--accent)}
.nav-links a[aria-current="page"]{color:var(--accent)}
.nav-cta{margin-left:auto;display:flex;gap:var(--space-3);align-items:center}
.nav-burger{display:none;margin-left:auto;background:none;border:1px solid var(--border-default);
  border-radius:var(--radius-pill);color:var(--text-strong);padding:.5rem .7rem;cursor:pointer}

/* ============ NAV DROPDOWN (submenus com âncoras) ============ */
.nav-drop{position:relative;display:flex;align-items:center}
.nav-drop>a{display:flex;align-items:center;gap:.3rem}
.nav-drop .caret{width:11px;height:11px;opacity:.55;transition:transform var(--duration-base) var(--ease-standard)}
.nav-drop:hover .caret,.nav-drop:focus-within .caret{transform:rotate(180deg)}
.nav-drop-panel{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px);
  min-width:246px;background:var(--surface-page);border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-2);margin-top:0;
  display:grid;gap:1px;opacity:0;pointer-events:none;
  transition:opacity var(--duration-base) var(--ease-standard) 100ms,
  transform var(--duration-base) var(--ease-standard) 100ms;
  z-index:40}
.nav-drop-panel::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--space-3)}
.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{
  opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);transition-delay:0s}
.nav-drop-panel a{display:flex;align-items:center;gap:var(--space-3);padding:.65rem .75rem;
  border-radius:var(--radius-sm);font-family:var(--font-display);font-weight:var(--weight-medium);
  font-size:var(--text-sm);text-transform:none;letter-spacing:0;color:var(--text-body)}
.nav-drop-panel a:hover{background:var(--navy-50);color:var(--text-strong)}
.nav-drop-panel .icon-svg{width:19px;height:19px;color:var(--accent);flex:none}

/* ============ HERO ============ */
.hero{position:relative;background:var(--surface-inverse);overflow:hidden;margin-top:-1px}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.95;transform:scaleX(-1)}
.hero-veil{position:absolute;inset:0;background:var(--gradient-navy-veil)}
.hero{min-height:80vh;display:flex;align-items:center}
.hero-in{position:relative;display:grid;gap:var(--space-6);width:100%;
  padding-block:clamp(1.75rem,6vh,var(--space-10)) clamp(1.75rem,5vh,var(--space-9))}
.hero-copy{display:grid;gap:clamp(.9rem,2.4vh,var(--space-5));max-width:60ch}
.hero h1,.hero .hero-title{margin:0;font-family:var(--font-display);letter-spacing:var(--tracking-display);text-wrap:balance;font-weight:var(--weight-extrabold);font-size:clamp(2rem,min(4.6vw,7.4vh),3.5rem);line-height:var(--leading-tight);
  color:var(--nvc-off-white)}
.hero .lead{font-size:clamp(1rem,min(1.7vw,2.9vh),1.25rem);max-width:52ch}
.badge{display:inline-flex;align-items:center;gap:var(--space-2);justify-self:start;
  border-radius:var(--radius-pill);padding:.4rem .85rem;font-family:var(--font-display);
  font-weight:var(--weight-semibold);font-size:var(--text-2xs);letter-spacing:var(--tracking-label);
  text-transform:uppercase;border:1px solid var(--border-default);color:var(--text-strong)}
.badge .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
.nvc-inverse .badge .dot{background:var(--nvc-off-white)}

/* ============ PAGE HERO (subpáginas) ============ */
.page-hero{position:relative;background:var(--surface-inverse);overflow:hidden;margin-top:-1px}
.page-hero-veil{position:absolute;inset:0;background:var(--gradient-navy-veil)}
.page-hero .sweep{position:absolute;right:-14%;top:-45%;width:36%;height:190%;
  background:var(--nvc-red);border-radius:var(--sweep-radius);opacity:.92}
.page-hero .iso{position:absolute;right:2%;top:-22%;height:150%;opacity:.14}
.page-hero-in{position:relative;display:grid;gap:var(--space-5);padding-block:var(--space-9) var(--space-9)}
.page-hero h1{font-weight:var(--weight-extrabold);font-size:2.75rem;line-height:var(--leading-tight);
  color:var(--nvc-off-white);max-width:20ch}
.page-hero .lead{font-size:var(--text-lg);max-width:56ch}

/* ============ BREADCRUMB ============ */
.crumb{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);
  font-weight:var(--weight-medium);font-size:var(--text-xs);letter-spacing:var(--tracking-label);
  text-transform:uppercase;color:var(--text-muted);margin:0 0 var(--space-2)}
.crumb a{color:var(--text-muted)}
.crumb a:hover{color:var(--text-strong)}
.crumb span[aria-current]{color:var(--text-strong)}

/* ============ SEGMENTOS ============ */
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);
  border-top:1px solid var(--border-subtle);padding-top:var(--space-7)}
.seg-item{display:grid;gap:var(--space-2);align-content:start}
.seg-item .ic{width:46px;height:46px;border-radius:var(--radius-pill);display:grid;place-items:center;
  background:var(--surface-accent-soft);color:var(--accent)}
.seg-item h3{font:var(--type-body);font-family:var(--font-display);font-weight:var(--weight-semibold);
  font-size:var(--text-md);color:var(--text-strong)}
.seg-item p{font:var(--type-body-sm);color:var(--text-muted)}

/* ============ PROBLEMA ============ */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--space-9);align-items:start}
.sym{display:grid;gap:var(--space-3);list-style:none;padding:0;margin:0}
.sym li{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);align-items:start;
  background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);
  padding:var(--space-4);font:var(--type-body-sm);color:var(--text-body);box-shadow:var(--shadow-xs)}
.sym li .icon-svg{width:21px;height:21px;margin-top:2px}
.sym-dots{display:none}
.diff-dots{display:none}

/* ============ DUAS FRENTES ============ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);
  padding:var(--space-7);box-shadow:var(--shadow-sm);display:grid;gap:var(--space-4);align-content:start;
  transition:box-shadow var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
.card-inverse{background:var(--surface-inverse);border-color:transparent;position:relative;overflow:hidden}
.card-inverse .iso{position:absolute;right:-6%;top:-30%;height:170%;opacity:.1}
.card .ic{width:52px;height:52px;border-radius:var(--radius-pill);display:grid;place-items:center;
  background:var(--surface-accent-soft);color:var(--accent)}
.nvc-inverse.card .ic{background:rgba(255,39,16,.18);color:var(--red-200)}
.card h3{font:var(--type-h3);letter-spacing:var(--tracking-display)}
.card.outline{background:transparent;border-color:var(--border-default);box-shadow:none}
.mini{display:grid;gap:var(--space-2);list-style:none;padding:0;margin:0;position:relative}
.mini li{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);font:var(--type-body-sm);color:var(--text-body)}
.mini li .icon-svg{width:19px;height:19px;margin-top:4px}

/* ============ MÓDULOS ============ */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.mod{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);
  padding:var(--space-5);display:grid;gap:var(--space-3);align-content:start;box-shadow:var(--shadow-sm);
  transition:box-shadow var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
.mod:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.mod .ic{width:50px;height:50px;border-radius:var(--radius-pill);display:grid;place-items:center;
  background:var(--surface-accent-soft);color:var(--accent)}
.mod p{font:var(--type-body-sm)}
.note{margin-top:var(--space-6);display:flex;gap:var(--space-3);align-items:flex-start;
  border-left:3px solid var(--accent);background:var(--surface-card);border-radius:var(--radius-md);
  padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-xs)}
.note .icon-svg{width:21px;height:21px;margin-top:3px}
.note p{font:var(--type-body-sm)}

/* ============ DIFERENCIAIS ============ */
.diff-sec{position:relative;background:var(--surface-inverse-deep);overflow:hidden}
.diff-sec .photo{position:absolute;right:0;top:0;width:38%;height:100%;object-fit:cover;
  border-radius:var(--sweep-radius)}
.diff-sec .photo-veil{position:absolute;right:0;top:0;width:38%;height:100%;
  background:linear-gradient(90deg,var(--navy-900) 0%,rgba(10,27,41,.15) 60%);border-radius:var(--sweep-radius)}
.diff-in{position:relative;max-width:64%}
.diff{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5) var(--space-6);list-style:none;padding:0;margin:0}
.diff li{display:grid;gap:var(--space-2);padding-top:var(--space-4);border-top:1px solid var(--border-subtle)}
.diff li .ic{width:46px;height:46px;border-radius:var(--radius-pill);display:grid;place-items:center;
  background:rgba(255,39,16,.14);margin-bottom:var(--space-1)}
.diff li .ic .icon-svg{width:22px;height:22px}
.diff b{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-md);color:var(--text-strong)}
.diff span{font:var(--type-body-sm);color:var(--text-body)}

/* ============ CAPACITAÇÃO ============ */
.cap{display:grid;grid-template-columns:.95fr 1.05fr;gap:var(--space-8);align-items:center}
.cap img{border-radius:var(--radius-lg);height:380px;width:100%;object-fit:cover;box-shadow:var(--shadow-lg)}
.tags{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.tag{border:1px solid var(--border-default);border-radius:var(--radius-pill);padding:.45rem .9rem;
  font-family:var(--font-display);font-weight:var(--weight-medium);font-size:var(--text-sm);color:var(--text-body)}

/* ============ RESULTADO ============ */
.res{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.res li{list-style:none;display:grid;gap:var(--space-2);border-top:2px solid var(--accent);padding-top:var(--space-4)}
.res b{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-lg);color:var(--text-strong)}
.res span{font:var(--type-body-sm);color:var(--text-body)}

/* ============ FAQ ============ */
.faq{max-width:860px;margin:0 auto}
details{border-bottom:1px solid var(--border-subtle)}
summary{cursor:pointer;list-style:none;padding:var(--space-5) 0;display:flex;justify-content:space-between;
  gap:var(--space-5);align-items:center;font-family:var(--font-display);font-weight:var(--weight-semibold);
  font-size:var(--text-lg);color:var(--text-strong)}
summary::-webkit-details-marker{display:none}
summary .icon-svg{width:22px;height:22px;flex:none;color:var(--accent);
  transition:transform var(--duration-base) var(--ease-standard)}
details[open] summary .icon-svg{transform:rotate(45deg)}
details p{padding-bottom:var(--space-5);font:var(--type-body-sm)}

/* ============ TABS (Soluções) ============ */
.tabs{display:flex;gap:var(--space-2);flex-wrap:wrap;border-bottom:1px solid var(--border-subtle)}
.tab-btn{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);
  background:none;border:none;border-bottom:2px solid transparent;padding:var(--space-3) var(--space-4);
  cursor:pointer;margin-bottom:-1px;transition:color var(--duration-fast) var(--ease-standard)}
.tab-btn:hover{color:var(--text-strong)}
.tab-btn[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.tab-panel{display:none;animation:fadeUp var(--duration-reveal) var(--ease-out)}
.tab-panel[data-active]{display:grid}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.sol-grid{grid-template-columns:1.1fr .9fr;gap:var(--space-8);align-items:start;padding-top:var(--space-7)}
.wrap.sol-grid{display:grid}
.sol-copy{display:grid;gap:var(--space-5);align-content:start}
/* Reforço: quando o sol-grid empilha em 1 coluna, o gap do grid pai nem sempre é suficiente,
   então garantimos o respiro direto nos itens (não depende só do gap do container). */
.sol-grid>.sol-copy,.sol-grid>.screen-mock,.sol-grid>.feat-stage{margin-block:var(--space-4)}
.sol-bullets{display:grid;gap:var(--space-3);list-style:none;margin:0;padding:0}
.sol-bullets li{display:flex;gap:var(--space-3);align-items:flex-start;font:var(--type-body);color:var(--text-body)}
.sol-bullets .icon-svg{width:22px;height:22px;color:var(--accent);margin-top:2px;flex:none}
.sol-photo{border-radius:var(--radius-lg);width:100%;height:200px;object-fit:cover;box-shadow:var(--shadow-md)}
.sol-aside{display:grid;gap:var(--space-4)}
.sol-bullets.blocks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-3)}
.sol-bullets.blocks li{display:grid;gap:var(--space-2);align-content:start;padding:var(--space-4);
  border-radius:var(--radius-md);background:var(--surface-card);border:1px solid var(--border-subtle);
  box-shadow:var(--shadow-xs)}
.sol-bullets.blocks .icon-svg{margin-top:0;width:24px;height:24px}
.sol-bullets.blocks b{display:block;font-size:var(--text-md);margin-bottom:2px}

/* ============ CALLOUT ============ */
.callout{display:flex;gap:var(--space-3);align-items:flex-start;border-radius:var(--radius-md);
  padding:var(--space-4) var(--space-5);border:1px solid var(--border-default)}
.callout.info{background:var(--surface-accent-soft);border-color:var(--red-100)}
.callout .icon-svg{width:20px;height:20px;color:var(--accent);margin-top:2px;flex:none}
.callout b{display:block;font-family:var(--font-display);font-weight:var(--weight-semibold);
  font-size:var(--text-sm);color:var(--text-strong);margin-bottom:2px}
.callout p{font:var(--type-body-sm)}

/* ============ FORM (Contato) ============ */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.field{display:grid;gap:var(--space-2)}
.field.full{grid-column:1 / -1}
.field label{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-xs);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-strong)}
.field .hint{font:var(--type-body-sm);color:var(--text-muted)}
.field input,.field select,.field textarea{font:var(--type-body);font-family:var(--font-body);
  color:var(--text-strong);background:var(--surface-card);border:1px solid var(--border-default);
  border-radius:var(--radius-sm);padding:.8rem 1rem;width:100%;
  transition:border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--focus-ring)}
.field textarea{resize:vertical;min-height:110px}
.check{display:flex;align-items:center;gap:var(--space-2);font:var(--type-body-sm);color:var(--text-body)}
.check input{width:18px;height:18px;accent-color:var(--accent)}
.form-actions{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;
  gap:var(--space-5);flex-wrap:wrap;margin-top:var(--space-2)}
.contact-layout{display:grid;grid-template-columns:1fr .82fr;gap:var(--space-9);align-items:start}
.contact-card{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.contact-card img{width:100%;height:190px;object-fit:cover}
.contact-card .body{padding:var(--space-5);display:grid;gap:var(--space-3)}
.contact-card .body img.logo{height:40px;width:auto}
.contact-info{display:grid;gap:var(--space-2);font:var(--type-body-sm)}

/* ============ STEPS (formulário em etapas) ============ */
.steps{display:flex;align-items:flex-start;margin-bottom:var(--space-7)}
.step{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);flex:none;width:104px}
.step-dot{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:none;
  border:2px solid var(--border-default);color:var(--text-muted);background:var(--surface-card);
  transition:border-color var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard),
  color var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard)}
.step-dot .icon-svg{width:21px;height:21px}
.step-num{display:none}
.step-text{display:grid;gap:1px;text-align:center}
.step-text .eyebrow{color:var(--text-muted)}
.step-name{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--text-muted)}
.step.active .step-dot{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 4px var(--focus-ring)}
.step.active .step-text .eyebrow{color:var(--accent)}
.step.active .step-name{color:var(--text-strong)}
.step.done .step-dot{background:var(--accent);border-color:var(--accent);color:var(--nvc-off-white)}
.step.done .step-name{color:var(--text-strong)}
.step-line{flex:1 1 auto;height:2px;background:var(--border-default);margin-top:20px;
  transition:background-color var(--duration-base) var(--ease-standard)}
.step-line.done{background:var(--accent)}
.step-panel{display:grid}
.step-panel[hidden]{display:none}
.step-nav{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;
  gap:var(--space-5);flex-wrap:wrap;margin-top:var(--space-2)}
.step-nav .spacer{flex:1}

/* ============ CTA ============ */
.cta{position:relative;background:var(--nvc-red);overflow:hidden}
.cta .iso{position:absolute;right:4%;top:-30%;height:180%;opacity:.12}
.cta-in{position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:var(--space-7);flex-wrap:wrap;padding-block:var(--space-9)}
.cta h2{color:var(--nvc-off-white);max-width:22ch}
.cta p{color:rgba(253,254,251,.86);max-width:44ch;margin-top:var(--space-3)}
.cta .btn-primary{background:var(--nvc-off-white);color:var(--navy-900)}
.cta .btn-primary:hover{background:var(--white);color:var(--navy-900);box-shadow:0 10px 24px -8px rgba(10,27,41,.45)}
.cta .btn-primary:has(.icon-svg)::before{background:rgba(10,27,41,.12)}
.cta .btn-primary:has(.icon-svg):hover::before{background:var(--accent)}
.cta .btn-primary:has(.icon-svg):hover{color:var(--nvc-off-white)}

/* ============ FOOTER ============ */
.foot{background:var(--surface-inverse-deep)}
.foot-in{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:var(--space-7);padding-block:var(--space-9) var(--space-6)}
.foot-col{display:grid;gap:var(--space-3);align-content:start}
.foot-col span.t{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-xs);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--nvc-off-white)}
.foot-col a{font:var(--type-body-sm);color:var(--text-muted)}
.foot-col a:hover{color:var(--nvc-off-white)}
.foot img{height:46px;width:auto}
.foot p{font:var(--type-body-sm);color:var(--text-muted);max-width:34ch}
.foot-base{border-top:1px solid var(--border-subtle);display:flex;justify-content:space-between;
  gap:var(--space-4);padding-block:var(--space-4);font:var(--type-body-sm);color:var(--text-muted)}
.sig{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-2xs);
  letter-spacing:var(--tracking-eyebrow);text-transform:uppercase}

/* ============ REVEAL ============ */
.rv{opacity:0;transform:translateY(14px);
  transition:opacity var(--duration-reveal) var(--ease-out),transform var(--duration-reveal) var(--ease-out)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* ============ ÍCONES (linha fina, navy + detalhe vermelho, animados) ============ */
.icon-svg{display:inline-flex;width:22px;height:22px;flex:none}
.icon-svg svg{width:100%;height:100%;display:block;overflow:visible}
.icon-svg .draw{stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.1s var(--ease-out)}
.rv.in .icon-svg .draw,.revealed .icon-svg .draw{stroke-dashoffset:0}
.rv.in .seg-item:nth-child(2) .icon-svg .draw,.rv.in .mod:nth-child(2) .icon-svg .draw{transition-delay:.08s}
.rv.in .seg-item:nth-child(3) .icon-svg .draw,.rv.in .mod:nth-child(3) .icon-svg .draw{transition-delay:.16s}
.rv.in .seg-item:nth-child(4) .icon-svg .draw,.rv.in .mod:nth-child(4) .icon-svg .draw{transition-delay:.24s}
.rv.in .mod:nth-child(5) .icon-svg .draw{transition-delay:.32s}
.rv.in .mod:nth-child(6) .icon-svg .draw{transition-delay:.4s}
.rv.in .mod:nth-child(7) .icon-svg .draw{transition-delay:.48s}
.rv.in .mod:nth-child(8) .icon-svg .draw{transition-delay:.56s}
.rv.in .mod:nth-child(9) .icon-svg .draw{transition-delay:.64s}
.rv.in .sym li:nth-child(2) .icon-svg .draw{transition-delay:.06s}
.rv.in .sym li:nth-child(3) .icon-svg .draw{transition-delay:.12s}
.rv.in .sym li:nth-child(4) .icon-svg .draw{transition-delay:.18s}
.rv.in .sym li:nth-child(5) .icon-svg .draw{transition-delay:.24s}
.rv.in .diff li:nth-child(2) .icon-svg .draw{transition-delay:.06s}
.rv.in .diff li:nth-child(3) .icon-svg .draw{transition-delay:.12s}
.rv.in .diff li:nth-child(4) .icon-svg .draw{transition-delay:.18s}
.rv.in .diff li:nth-child(5) .icon-svg .draw{transition-delay:.24s}
.rv.in .diff li:nth-child(6) .icon-svg .draw{transition-delay:.3s}
.rv.in .diff li:nth-child(7) .icon-svg .draw{transition-delay:.36s}
.rv.in .diff li:nth-child(8) .icon-svg .draw{transition-delay:.42s}
@keyframes iconPop{0%{transform:scale(1) rotate(0)}45%{transform:scale(1.16) rotate(-7deg)}100%{transform:scale(1) rotate(0)}}
.ic,.mini li .icon-svg{transition:transform var(--duration-base) var(--ease-standard)}
.seg-item:hover .ic,.mod:hover .ic,.card:hover .ic,.note:hover .ic,.diff li:hover .ic{animation:iconPop .55s var(--ease-out)}
.mini li:hover .icon-svg{animation:iconPop .5s var(--ease-out)}
@media (prefers-reduced-motion:reduce){
  .icon-svg .draw{stroke-dashoffset:0;transition:none}
  .seg-item:hover .ic,.mod:hover .ic,.card:hover .ic,.note:hover .ic,.mini li:hover .icon-svg{animation:none}
}

/* ============ HERO NEXUS (produto, sem foto: mockup + captura de lead) ============ */
.hero-nexus{background:var(--surface-inverse);position:relative;overflow:hidden;margin-top:-1px}
.hero-nexus .iso{position:absolute;left:-8%;bottom:-25%;height:150%;opacity:.08}
.hero-nexus-in{position:relative;display:grid;grid-template-columns:1.15fr .95fr;gap:var(--space-8);
  align-items:center;padding-block:var(--space-11) var(--space-10)}
.hero-nexus h1{font-weight:var(--weight-extrabold);font-size:3.2rem;line-height:var(--leading-tight);
  color:var(--nvc-off-white)}
.hero-nexus .lead{font-size:var(--text-lg);max-width:50ch}
.hero-nexus-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);
  list-style:none;margin:0;padding:0}
.hero-nexus-mini li{display:grid;gap:var(--space-2);align-content:start;padding:var(--space-4);
  border-radius:var(--radius-md);background:rgba(253,254,251,.06);border:1px solid rgba(253,254,251,.12);
  font:var(--type-body-sm);color:rgba(253,254,251,.8)}
.hero-nexus-mini li b{display:block;font-family:var(--font-display);font-weight:var(--weight-semibold);
  font-size:var(--text-sm);letter-spacing:0;text-transform:none;margin-bottom:2px}
.hero-nexus-mini .icon-svg{width:20px;height:20px;color:var(--red-200);flex:none}

/* ============ LEAD CARD (formulário compacto embutido) ============ */
/* Sempre um cartão claro, mesmo dentro de uma seção .nvc-inverse: os tokens de texto e
   superfície são redeclarados aqui para não herdar as versões escuras do contexto ao redor. */
.lead-card{background:var(--nvc-off-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
  padding:var(--space-6);display:grid;gap:var(--space-4);
  --text-strong:var(--navy-800);--text-body:#334A5E;--text-muted:var(--navy-500);
  --border-default:var(--navy-200);--surface-card:var(--white)}
.lead-card h3{font:var(--type-h4);color:var(--text-strong)}
.lead-card .field{gap:.4rem}
.lead-card .field label{font-size:var(--text-2xs)}

/* ============ SCREEN MOCK (visual genérico do sistema, sem prints reais) ============ */
.screen-mock{background:var(--navy-900);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
  overflow:hidden;border:1px solid rgba(253,254,251,.08)}
.screen-mock .bar{display:flex;gap:6px;align-items:center;padding:var(--space-3) var(--space-4);background:var(--navy-800)}
.screen-mock .bar span{width:9px;height:9px;border-radius:50%;background:rgba(253,254,251,.22)}
.screen-mock .body{padding:var(--space-5);display:grid;gap:var(--space-3)}
.screen-mock .row{display:flex;gap:var(--space-3)}
.screen-mock .block{background:rgba(253,254,251,.07);border-radius:var(--radius-sm);flex:1}
.screen-mock .block.accent{background:rgba(255,39,16,.32)}
.screen-mock .line{height:8px;border-radius:4px;background:rgba(253,254,251,.1)}
.screen-mock .line.w60{width:60%}
.screen-mock .line.w40{width:40%}
.screen-mock .chart{display:flex;align-items:flex-end;gap:5px;height:64px}
.screen-mock .chart i{flex:1;background:linear-gradient(180deg,var(--red-400),var(--nvc-red));
  border-radius:3px 3px 0 0;font-style:normal}
.screen-mock .cap{padding:var(--space-3) var(--space-5);border-top:1px solid rgba(253,254,251,.08);
  font:var(--type-body-sm);color:rgba(253,254,251,.55)}
.screen-mock.sm .body{padding:var(--space-4);gap:var(--space-2)}

/* ============ MOCK SLIDER (carrossel de telas do sistema) ============ */
.mock-slider-track{display:flex;gap:var(--space-5);overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding-bottom:var(--space-2)}
.mock-slider-track::-webkit-scrollbar{display:none}
.mock-slide{flex:0 0 min(560px,88%);scroll-snap-align:start}
.mock-slider-dots{display:flex;justify-content:center;gap:.4rem;margin-top:var(--space-4)}
.mock-slider-dots button{width:8px;height:8px;padding:0;border:none;border-radius:var(--radius-pill);
  background:var(--border-default);cursor:pointer;transition:width var(--duration-base) var(--ease-standard),
  background-color var(--duration-base) var(--ease-standard)}
.mock-slider-dots button.active{width:22px;background:var(--accent)}
.security-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4) var(--space-6)}

/* ============ RESPONSIVO ============ */
@media (max-width:1000px){
  .hero{min-height:0}
  .hero-in{padding-block:var(--space-10) var(--space-9)}
  .hero h1,.hero .hero-title{font-size:clamp(1.9rem,min(6.4vw,6.8vh),2.9rem)}
  .hero .lead{font-size:clamp(.95rem,min(2.6vw,2.7vh),1.1rem)}
  .seg{grid-template-columns:repeat(2,1fr)}
  .split,.duo,.cap{grid-template-columns:1fr;gap:var(--space-7)}
  .grid3{grid-template-columns:repeat(2,1fr)}
  .diff-sec .photo,.diff-sec .photo-veil{display:none}
  .diff-in{max-width:100%}
  .res{grid-template-columns:1fr 1fr}
  .foot-in{grid-template-columns:1fr 1fr}
  .sol-grid,.contact-layout,.form-grid{grid-template-columns:1fr}
  .page-hero h1{font-size:2.35rem}
  .hero-nexus-in{grid-template-columns:1fr;padding-block:var(--space-10) var(--space-9)}
  .hero-nexus h1{font-size:2.6rem}
  .sol-grid{row-gap:var(--space-9)}
  .sol-grid>.sol-copy,.sol-grid>.screen-mock,.sol-grid>.feat-stage{margin-block:var(--space-8)}
  .sol-grid>.sol-copy{order:1 !important}
  .sol-grid>.screen-mock,.sol-grid>.feat-stage{order:2 !important}
  .sol-bullets.blocks{grid-template-columns:1fr}
  .security-grid{grid-template-columns:1fr}
}
@media (max-width:1100px){
  .nav-links,.nav-cta{display:none}
  .nav-burger{display:block}
  .nav.open .nav-links{display:grid;position:absolute;left:0;right:0;top:100%;background:var(--surface-page);
    padding:var(--space-5);gap:var(--space-4);border-bottom:1px solid var(--border-subtle);margin:0;
    max-height:calc(100vh - var(--header-h, 64px));overflow-y:auto}
  .nav.open .nav-links a{color:var(--text-strong)}
  .nav-drop{flex-direction:column;align-items:flex-start;gap:var(--space-3);width:100%}
  .nav-drop-panel{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;
    box-shadow:none;border:none;background:transparent;padding:0 0 0 var(--space-4);margin:0;min-width:0;width:100%}
  .nav-drop-panel,.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{transform:none;opacity:1;transition:none}
  .nav-drop-panel::before{display:none}
  .nav-drop-panel a{padding:.45rem 0;color:var(--text-muted)}
  .nav-drop-panel a:hover{background:transparent;color:var(--accent)}
  .nav-drop .caret{display:none}
}
@media (max-width:680px){
  :root{--text-5xl:2.65rem;--text-4xl:2.15rem;--text-3xl:1.8rem;--space-10:3.5rem;--space-11:4.5rem}
  .hero h1,.hero .hero-title{font-size:clamp(1.7rem,min(8.6vw,6.2vh),2.3rem)}
  .nav-logo{height:38px}
  .grid3,.res,.foot-in,.hero-nexus-mini{grid-template-columns:1fr}
  .seg{grid-template-columns:repeat(2,1fr);row-gap:var(--space-6);column-gap:var(--space-4)}
  .seg-item .ic{width:34px;height:34px}
  .seg-item .icon-svg{width:18px;height:18px}
  .seg-item p{font-size:var(--text-2xs)}
  .sym{display:flex;gap:var(--space-3);overflow-x:auto;scroll-snap-type:x mandatory;
    scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding:.25rem var(--gutter) var(--space-2)}
  .sym::-webkit-scrollbar{display:none}
  .sym li{flex:0 0 80%;scroll-snap-align:start;grid-template-columns:1fr;gap:var(--space-3)}
  .sym li .icon-svg{width:30px;height:30px;margin-top:0}
  .sym-dots{display:flex;justify-content:center;gap:.4rem;margin-top:calc(var(--space-7) * -1 + .5rem)}
  .sym-dots button{width:8px;height:8px;padding:0;border:none;border-radius:var(--radius-pill);
    background:var(--border-default);cursor:pointer;transition:width var(--duration-base) var(--ease-standard),
    background-color var(--duration-base) var(--ease-standard)}
  .sym-dots button.active{width:22px;background:var(--accent)}
  .diff{display:flex;gap:var(--space-4);overflow-x:auto;scroll-snap-type:x mandatory;
    scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding:.25rem var(--gutter) var(--space-2)}
  .diff::-webkit-scrollbar{display:none}
  .diff li{flex:0 0 78%;scroll-snap-align:start;border-top:none;border:1px solid var(--border-subtle);
    border-radius:var(--radius-md);padding:var(--space-4);background:var(--surface-card)}
  .diff-dots{display:flex;justify-content:center;gap:.4rem;margin-top:var(--space-4)}
  .diff-dots button{width:8px;height:8px;padding:0;border:none;border-radius:var(--radius-pill);
    background:rgba(253,254,251,.28);cursor:pointer;transition:width var(--duration-base) var(--ease-standard),
    background-color var(--duration-base) var(--ease-standard)}
  .diff-dots button.active{width:22px;background:var(--nvc-red)}
  .cap img{height:260px}
  .cta-in{padding-block:var(--space-8)}
  .page-hero .sweep,.page-hero .iso{display:none}
  .form-actions{flex-direction:column;align-items:stretch}
}

/* ============ CASCATA (grade de cartões com empilhamento no mobile) ============ */
.casc-grid{display:flex;flex-wrap:wrap;gap:var(--space-5)}
.casc-card{width:calc(33.333% - var(--space-5)*2/3);background:var(--surface-card);
  border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);
  display:flex;flex-direction:column;overflow:hidden;scroll-margin-top:calc(var(--header-h, 64px) + 16px)}
.casc-head{background:var(--nvc-navy);border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  padding:var(--space-5);display:flex;gap:var(--space-3);align-items:center}
.casc-head .ic{width:50px;height:50px;flex:none;border-radius:var(--radius-pill);
  display:grid;place-items:center;background:rgba(255,39,16,.18)}
.casc-head .ic .icon-svg{width:24px;height:24px;color:var(--red-200)}
.casc-head h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);line-height:var(--leading-snug);
  color:var(--nvc-off-white);letter-spacing:0}
.casc-list{list-style:none;margin:0;padding:var(--space-5) var(--space-5) var(--space-2);
  display:grid;gap:var(--space-3)}
.casc-list li{display:flex;gap:var(--space-2);align-items:flex-start;font:var(--type-body-sm);color:var(--text-body)}
.casc-list li .icon-svg{width:19px;height:19px;margin-top:3px;color:var(--accent);flex:none}
.casc-card .btn{margin:var(--space-2) var(--space-5) var(--space-5);align-self:stretch;justify-content:center}

@media (max-width:1024px){
  .casc-grid{justify-content:center}
  .casc-card{width:calc(50% - var(--space-5)/2)}
}
@media (max-width:767px){
  .casc-grid{padding-bottom:var(--space-7)}
  .casc-card,.duo .card,.grid3 .mod{width:100%;
    position:sticky;top:calc(var(--header-h,64px) + 16px + var(--i,0) * 14px);
    transform-origin:50% 0%;
    opacity:0;translate:0 38px;scale:.96;
    transition:opacity .5s cubic-bezier(.22,.61,.36,1),translate .5s cubic-bezier(.22,.61,.36,1),
    scale .1s linear}
  .casc-card{background:var(--surface-card)}
  .casc-card.revealed,.duo .card.revealed,.grid3 .mod.revealed{
    opacity:1;translate:0 0;scale:calc(1 - var(--stack,0) * .24)}
  .casc-card .casc-head{background:color-mix(in srgb,var(--navy-900) calc(var(--stack,0) * 100%),var(--nvc-navy))}
  .casc-card .casc-head .ic{transition:opacity .3s linear;opacity:calc(1 - var(--stack,0) * .3)}
  .duo{row-gap:var(--space-6)}
  .grid3{row-gap:var(--space-6)}
}
@media (prefers-reduced-motion:reduce){
  .casc-card,.duo .card,.grid3 .mod{position:static !important;opacity:1 !important;
    translate:none !important;scale:1 !important;transition:none !important}
}

/* ============ UTILITY (sempre por último: vence empates de especificidade) ============ */
/* ============ LINKS DE SOLUÇÃO (Nexus) ============ */
.sol-links{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.sol-link{--tone-bg:var(--surface-card);--tone-line:var(--border-subtle);--tone-ic:var(--surface-accent-soft);--tone-ink:var(--accent);display:grid;gap:var(--space-3);align-content:start;text-decoration:none;background:var(--tone-bg);border:1px solid var(--tone-line);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.sol-link:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--tone-ink)}
.sol-link.tone-amber{--tone-bg:#FFF6E8;--tone-line:#F1DDB8;--tone-ic:#FBE1B0;--tone-ink:#A85A05}
.sol-link.tone-teal{--tone-bg:#EBF6F3;--tone-line:#C3E2D9;--tone-ic:#C9E9DF;--tone-ink:#0F6F66}
.sol-link.tone-blue{--tone-bg:#EEF1FB;--tone-line:#CAD2F0;--tone-ic:#D5DBF5;--tone-ink:#3A4CA0}
.sol-link .ic{width:50px;height:50px;border-radius:var(--radius-pill);display:grid;place-items:center;background:var(--tone-ic);color:var(--tone-ink)}
.sol-link p{font:var(--type-body-sm);color:var(--text-muted)}
.sol-link .go{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2);font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--tone-ink)}
.sol-link .go .icon-svg{width:18px;height:18px;transition:transform var(--duration-fast) var(--ease-standard)}
.sol-link:hover .go .icon-svg{transform:translateX(4px)}
@media (max-width:1000px){.sol-links{grid-template-columns:1fr}}
.hero-sol-label{margin-bottom:calc(var(--space-2) * -1)}
.hero-sol{gap:var(--space-3)}
.hero-sol .sol-link{--icon-main:var(--navy-800);padding:var(--space-4);gap:var(--space-2);box-shadow:none}
.hero-sol .sol-link .ic{width:38px;height:38px}
.hero-sol .sol-link .ic .icon-svg{width:20px;height:20px}
.hero-sol .sol-link h3{font-size:var(--text-base);line-height:1.2;color:var(--navy-800)}
.hero-sol .sol-link p{display:none}
.hero-sol .sol-link .go{margin-top:0;font-size:var(--text-xs)}
@media (max-width:1000px){.hero-sol{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.hero-sol{grid-template-columns:1fr}.hero-sol .sol-link{grid-template-columns:auto 1fr;align-items:center;column-gap:var(--space-3)}.hero-sol .sol-link .ic{grid-row:span 2}}
/* ============ SLIDER DE DIFERENCIAIS ============ */
.diff-dots{display:flex;justify-content:center;gap:.4rem;margin-top:var(--space-5)}
.diff-dots button{width:8px;height:8px;padding:0;border:none;border-radius:var(--radius-pill);background:rgba(253,254,251,.28);cursor:pointer;transition:width var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard)}
.diff-dots button.active{width:22px;background:var(--nvc-red)}
.diff-arrow{display:none}
@media (min-width:681px){
  .diff-slider{position:relative;padding-inline:60px}
  .diff{display:flex;gap:var(--space-6);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;position:relative}
  .diff::-webkit-scrollbar{display:none}
  .diff li{flex:0 0 calc((100% - var(--space-6)) / 2);scroll-snap-align:start}
  .diff-arrow{display:grid;place-items:center;position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;padding:0;border-radius:var(--radius-pill);border:1px solid rgba(253,254,251,.3);background:rgba(17,45,69,.72);color:var(--nvc-off-white);cursor:pointer;backdrop-filter:blur(4px);transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
  .diff-arrow svg{width:20px;height:20px}
  .diff-arrow:hover{background:var(--nvc-red);border-color:var(--nvc-red)}
  .diff-arrow:focus-visible{outline:2px solid var(--red-200);outline-offset:2px}
  .diff-arrow.prev{left:0}
  .diff-arrow.next{right:0}
}
/* ============ NEXUS: SEÇÃO EM DUAS COLUNAS COM LOGO ============ */
.nx-split{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--space-8);align-items:center}
.nx-text .head{margin-bottom:0}
.nx-brand{position:relative;overflow:hidden;display:grid;gap:var(--space-5);justify-items:start;padding:var(--space-8) var(--space-7);background:var(--surface-card);border:1px solid var(--border-subtle);border-top:4px solid var(--nvc-red);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.nx-brand .nx-iso{position:absolute;right:-12%;bottom:-38%;height:120%;width:auto;opacity:.06;pointer-events:none}
.nx-brand .nx-logo{position:relative;width:min(100%,400px);height:auto}
.nx-brand .nx-cap{position:relative;max-width:34ch;padding-top:var(--space-4);border-top:1px solid var(--border-subtle);font:var(--type-body)}
.nx-brand .nx-cap b{color:var(--text-strong)}
@media (max-width:1000px){.nx-split{grid-template-columns:1fr;gap:var(--space-6)}.nx-brand{padding:var(--space-6) var(--space-5)}}
/* ============ MÓDULOS: LISTA EMPILHADA + IMAGEM POR ITEM ============ */
.feat-list{display:grid;gap:var(--space-3)}
.feat-item{display:grid;grid-template-columns:auto 1fr;gap:var(--space-4);align-items:start;width:100%;margin:0;padding:var(--space-4) var(--space-5);text-align:left;font:inherit;color:inherit;background:transparent;border:1px solid var(--border-subtle);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-base) var(--ease-standard),border-color var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard)}
.feat-item:hover{border-color:var(--accent)}
.feat-item:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.feat-item .ic{width:42px;height:42px;border-radius:var(--radius-pill);display:grid;place-items:center;background:var(--surface-accent-soft);color:var(--accent);flex:none}
.feat-item .ic .icon-svg{width:22px;height:22px}
.feat-item .t{display:grid;gap:var(--space-1);align-content:center;min-height:42px}
.feat-item b{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-md);color:var(--text-strong)}
.feat-item .d{display:none;font:var(--type-body-sm);color:var(--text-body)}
.feat-item[aria-selected="true"],.feat-item[aria-expanded="true"]{background:var(--surface-card);border-color:var(--accent);box-shadow:var(--shadow-md)}
.feat-item[aria-selected="true"] .d,.feat-item[aria-expanded="true"] .d{display:block}
.feat-stage{position:relative;align-self:center}
.feat-stage .screen-mock{animation:fadeUp var(--duration-reveal) var(--ease-out)}
/* Linha única: título em cima, lista e imagem lado a lado */
.feat-row{display:grid;grid-template-columns:1.1fr .9fr;grid-template-areas:"head ." "list stage";gap:var(--space-6) var(--space-8);align-items:start}
.feat-row.rev{grid-template-columns:.9fr 1.1fr;grid-template-areas:". head" "stage list"}
.feat-head{grid-area:head;display:grid;gap:var(--space-4);align-content:start}
.feat-row .feat-list{grid-area:list}
.sol-grid.feat-row>.feat-stage{grid-area:stage;align-self:start;margin-block:0}
@media (max-width:1000px){
  .feat-row,.feat-row.rev{grid-template-columns:1fr;grid-template-areas:"head" "list" "stage";row-gap:var(--space-6)}
}
@media (max-width:1000px){
  .feat-stage{display:none}
  .feat-list>.screen-mock{margin:calc(var(--space-1) * -1) 0 var(--space-2)}
  .feat-item{scroll-margin-top:84px}
}
a.seg-item{text-decoration:none;color:inherit;border-radius:var(--radius-md);transition:transform var(--duration-fast) var(--ease-standard)}
a.seg-item:hover{transform:translateY(-2px)}
a.seg-item:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.seg-item .go{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:var(--space-1);font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--accent)}
.seg-item .go .icon-svg{width:18px;height:18px;transition:transform var(--duration-fast) var(--ease-standard)}
a.seg-item:hover .go .icon-svg{transform:translateX(4px)}
/* Capacitação: hero mais escuro para dar contraste ao texto sobre a foto */
.page-hero.dark .page-hero-veil{background:linear-gradient(90deg,rgba(9,26,41,.95) 0%,rgba(9,26,41,.88) 55%,rgba(9,26,41,.66) 100%)}
.page-hero.dark .iso{opacity:.05}
.page-hero.dark .sweep{opacity:.35}
.page-hero .lead{text-wrap:balance}
@media (min-width:1001px){.page-hero.dark .lead{max-width:48ch}}
/* Rótulo de seção em destaque */
.eyebrow-lg{font-size:var(--text-md);letter-spacing:.14em}
@media (min-width:1001px){.eyebrow-lg{font-size:var(--text-lg)}}
/* Hero da home: mensagens rotativas */
.hero-rot{display:grid;gap:var(--space-5)}
.hero-slide{grid-area:1/1;display:grid;gap:var(--space-6);align-content:start;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity var(--duration-reveal) var(--ease-out),transform var(--duration-reveal) var(--ease-out),visibility 0s linear var(--duration-reveal)}
.hero-slide.is-active{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.hero-dots{grid-area:2/1;display:flex;gap:.5rem}
.hero-dots button{position:relative;overflow:hidden;width:44px;height:4px;padding:0;border:none;border-radius:var(--radius-pill);background:rgba(253,254,251,.3);cursor:pointer;transition:background-color var(--duration-base) var(--ease-standard)}
.hero-dots button:hover{background:rgba(253,254,251,.5)}
.hero-dots button::after{content:"";position:absolute;inset:0;background:var(--nvc-red);transform:scaleX(0);transform-origin:left}
.hero-dots button.active::after{animation:heroFill 7s linear forwards}
.hero-rot.paused .hero-dots button.active::after{animation-play-state:paused}
.hero-dots button:focus-visible{outline:2px solid var(--red-200);outline-offset:3px}
@keyframes heroFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.hero-slide{transition:none;transform:none}.hero-dots button.active::after{animation:none;transform:scaleX(1)}}
/* Hero da home: o texto fica na metade esquerda, sem invadir a foto */
@media (min-width:1001px){.hero-copy{max-width:min(36rem,50vw)}.hero-copy .lead{max-width:none}}
/* Hero da home no tablet/celular: texto ocupa a largura toda, então a foto ganha mais escurecimento e desloca para a esquerda */
@media (max-width:1000px){
  .hero-bg{object-position:0% 50%}
  .hero-veil{background:linear-gradient(180deg,rgba(9,26,41,.82) 0%,rgba(9,26,41,.7) 50%,rgba(9,26,41,.84) 100%)}
  .hero .lead,.hero h1,.hero .hero-title{text-shadow:0 1px 14px rgba(9,26,41,.55)}
  .hero .lead{color:rgba(253,254,251,.94)}
}
[hidden]{display:none}
