/* =====================================================================
   DELTANEX — Engenharia & Soluções Energéticas
   Folha de estilo principal  ·  v1.0.0
   Paleta da marca: Ouro #FFC400 · Grafite #0E0E10 · Branco
   Tipografia: Montserrat (display) · Montserrat (corpo) · IBM Plex Mono (técnico)
   ===================================================================== */

/* ── Tokens ──────────────────────────────────────────────────────────── */
:root{
  /* Marca */
  --gold:        #f5bc16;
  --gold-bright: #ffd24a;
  --gold-deep:   #d49a00;
  --gold-soft:   rgba(245,188,22,.14);
  --gold-ink:    #f5bc16;   /* ouro p/ TEXTO (escurecido só no tema claro) */

  /* Tinta / superfícies (dark) — grafite oficial #242425 */
  --ink:        #161618;
  --ink-2:      #1c1c1f;
  --panel:      #242425;
  --panel-2:    #2c2c30;
  --line:       #38383e;
  --line-soft:  #2a2a2f;

  /* Texto (contraste reforçado) */
  --white:      #FAFAFB;
  --text:       #EDEDF0;
  --muted:      #BCBCC6;
  --muted-2:    #9A9AA6;

  /* "Páginas claras" → tokens TEMÁVEIS (dark por padrão; sobrescritos no tema claro) */
  --light-bg:   var(--ink);
  --light-surf: var(--panel);
  --light-line: var(--line);
  --light-text: var(--white);
  --light-muted:var(--muted);
  --field-bg:   var(--ink-2);

  /* Superfícies translúcidas / grade (temáveis) */
  --glass:      rgba(20,20,22,.82);
  --glass-solid:rgba(20,20,22,.97);
  --grid-line:  rgba(255,255,255,.05);

  /* Sistema */
  --radius:     14px;
  --radius-sm:  10px;
  --radius-lg:  22px;
  --shadow:     0 18px 50px rgba(0,0,0,.45);
  --shadow-gold:0 16px 44px rgba(245,188,22,.18);
  --maxw:       1200px;
  --gut:        clamp(20px, 5vw, 64px);

  --grad-gold:  linear-gradient(135deg, var(--gold-bright), var(--gold) 45%, var(--gold-deep));
  --grad-ink:   linear-gradient(180deg, #101014, #161618);

  --ease:       cubic-bezier(.22,.61,.36,1);
}

/* ── Tema claro ──────────────────────────────────────────────────────── */
:root[data-theme="light"]{
  --ink:#FFFFFF; --ink-2:#F6F6F3; --panel:#FFFFFF; --panel-2:#F1F1EB;
  --line:#E4E4DC; --line-soft:#EEEEE8;
  --white:#14141A; --text:#2C2C34; --muted:#4C4C56; --muted-2:#6A6A74;
  --field-bg:#FFFFFF;
  /* Ouro permanece o oficial da marca (#f5bc16) também no tema claro */
  --glass:rgba(255,255,255,.86); --glass-solid:rgba(255,255,255,.98);
  --grid-line:rgba(0,0,0,.05);
  --grad-ink:linear-gradient(180deg,#FFFFFF,#F1F1EB);
  --shadow:0 18px 50px rgba(20,20,20,.10);
}

/* ── Reset / base ────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation:none!important; transition:none!important; } }
body{
  margin:0; background:var(--ink); color:var(--text);
  font:400 16px/1.7 "Montserrat", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:"Montserrat", system-ui, sans-serif; font-weight:800; line-height:1.05; letter-spacing:-.01em; margin:0; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }
::selection{ background:var(--gold); color:#000; }

/* ── Utilidades de layout ────────────────────────────────────────────── */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
.section{ padding:clamp(64px,9vw,128px) 0; position:relative; }
.eyebrow{
  font-family:"IBM Plex Mono", monospace; font-size:.74rem; font-weight:500;
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  display:inline-flex; align-items:center; gap:.6rem; margin:0 0 1rem;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--gold); display:inline-block; }
.section-title{ font-size:clamp(1.9rem,4.4vw,3.1rem); color:var(--white); max-width:18ch; }
.section-lead{ color:var(--muted); font-size:clamp(1rem,1.7vw,1.15rem); max-width:62ch; margin-top:1.1rem; }
.center{ text-align:center; }
.center .section-title,.center .section-lead{ margin-inline:auto; }
.center .eyebrow{ justify-content:center; }

/* blueprint grid backdrop */
.grid-bg{ position:relative; }
.grid-bg::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, #000 40%, transparent 100%);
          mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, #000 40%, transparent 100%);
}
.grid-bg > *{ position:relative; z-index:1; }

/* ── Botões ──────────────────────────────────────────────────────────── */
.btn{
  --bg:var(--gold); --fg:#161618;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:"Montserrat",sans-serif; font-weight:700; font-size:.98rem; letter-spacing:.02em;
  padding:.92rem 1.5rem; border-radius:999px; border:1px solid transparent;
  background:var(--bg); color:var(--fg); cursor:pointer;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .2s, color .2s;
  position:relative; white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow-gold); }
.btn:active{ transform:translateY(0); }
.btn .arw{ transition:transform .25s var(--ease); }
.btn:hover .arw{ transform:translateX(4px); }
.btn--ghost{ --bg:transparent; --fg:var(--white); border-color:var(--line); }
.btn--ghost:hover{ --bg:rgba(255,255,255,.04); box-shadow:none; border-color:var(--gold); }
.btn--wa{ --bg:#1FAE54; --fg:#fff; }
.btn--lg{ padding:1.05rem 1.9rem; font-size:1.05rem; }
.btn--block{ width:100%; }
.btn--dark{ --bg:var(--ink-2); --fg:var(--gold); border-color:var(--line); }

/* ── Header ──────────────────────────────────────────────────────────── */
.header{
  position:fixed; inset:0 0 auto 0; z-index:60;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
.header.scrolled{
  background:var(--glass); backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:var(--line-soft);
}
.nav{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; height:74px; }
.brand{ display:inline-flex; align-items:center; gap:.7rem; flex-shrink:0; }
.brand svg{ width:38px; height:38px; }
.brand .wm{ font-family:"Montserrat",sans-serif; font-weight:800; font-size:1.32rem; letter-spacing:.02em; color:var(--white); line-height:1; }
.brand .wm b{ color:var(--gold); font-weight:800; }
.brand .tag{ display:block; font:500 .56rem/1 "IBM Plex Mono",monospace; letter-spacing:.22em; color:var(--muted-2); text-transform:uppercase; margin-top:4px; }
.nav-links{ display:flex; align-items:center; gap:.3rem; }
.nav-links a{ font-size:.93rem; color:var(--muted); padding:.5rem .8rem; border-radius:8px; transition:color .2s, background .2s; }
.nav-links a:hover,.nav-links a.active{ color:var(--white); background:rgba(255,255,255,.05); }
.nav-links a.btn{ display:none; }   /* CTA do menu — só no mobile */
.nav-cta{ display:flex; align-items:center; gap:.6rem; }
.nav-toggle{ display:none; background:none; border:1px solid var(--line); border-radius:10px; width:46px; height:42px; cursor:pointer; padding:0; }
.nav-toggle span{ display:block; width:20px; height:2px; background:var(--white); margin:4px auto; transition:.3s var(--ease); }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* ── Hero ────────────────────────────────────────────────────────────── */
.hero{ position:relative; padding:clamp(120px,16vh,200px) 0 clamp(70px,9vw,110px); overflow:hidden; }
.hero::after{ /* energy glow */
  content:""; position:absolute; top:-10%; right:-10%; width:60vw; height:60vw; max-width:760px; max-height:760px;
  background:radial-gradient(circle, rgba(245,188,22,.16), transparent 62%); pointer-events:none; z-index:0;
}
.hero-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.hero-tagpill{
  display:inline-flex; align-items:center; gap:.6rem; font:500 .76rem/1 "IBM Plex Mono",monospace;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold);
  background:var(--gold-soft); border:1px solid rgba(245,188,22,.3); padding:.5rem .9rem; border-radius:999px;
}
.hero-tagpill .dot{ width:7px; height:7px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 0 rgba(245,188,22,.6); animation:pulse 2.4s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(245,188,22,.55);} 70%{box-shadow:0 0 0 9px rgba(245,188,22,0);} 100%{box-shadow:0 0 0 0 rgba(245,188,22,0);} }
.hero h1{ font-size:clamp(2.5rem,6.6vw,4.7rem); color:var(--white); margin:1.4rem 0 0; letter-spacing:-.02em; }
.hero h1 em{ font-style:normal; color:var(--gold); position:relative; }
.hero h1 .bolt{ display:inline-block; transform:translateY(.06em); }
.hero-lead{ color:var(--muted); font-size:clamp(1.02rem,1.7vw,1.2rem); max-width:54ch; margin:1.5rem 0 0; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2.1rem; }
.hero-strip{ display:flex; flex-wrap:wrap; gap:.55rem; margin-top:2.4rem; }
.hero-strip span{
  font:500 .76rem/1 "IBM Plex Mono",monospace; letter-spacing:.08em; color:var(--muted);
  border:1px solid var(--line); border-radius:999px; padding:.5rem .85rem;
}
.hero-strip span b{ color:var(--gold); font-weight:600; }

/* Hero visual (delta) */
.hero-art{ position:relative; aspect-ratio:1; display:grid; place-items:center; }
.hero-art .ring{ position:absolute; inset:0; border:1px solid var(--line); border-radius:50%; }
.hero-art .ring.r2{ inset:11%; border-style:dashed; border-color:var(--line-soft); animation:spin 60s linear infinite; }
.hero-art .ring.r3{ inset:23%; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.hero-art svg{ width:62%; filter:drop-shadow(0 18px 40px rgba(245,188,22,.28)); animation:float 6s ease-in-out infinite; }
@keyframes float{ 0%,100%{ transform:translateY(-6px); } 50%{ transform:translateY(6px); } }
.hero-art .scan{ position:absolute; left:8%; right:8%; height:2px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.6; animation:scan 4.5s ease-in-out infinite; }
@keyframes scan{ 0%,100%{ top:14%; opacity:0; } 50%{ top:84%; opacity:.7; } }

/* ── Faixa de logos / segmentos (marquee) ───────────────────────────── */
.segments{ border-block:1px solid var(--line-soft); background:var(--ink-2); padding:1.6rem 0; }
.seg-head{ font:500 .72rem/1 "IBM Plex Mono",monospace; letter-spacing:.22em; text-transform:uppercase; color:var(--muted-2); text-align:center; margin-bottom:1.1rem; }
.marquee{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.marquee-track{ display:flex; gap:2.6rem; width:max-content; animation:marq 32s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
@keyframes marq{ to{ transform:translateX(-50%); } }
.marquee-track span{ display:inline-flex; align-items:center; gap:.6rem; color:var(--muted); font-family:"Montserrat",sans-serif; font-weight:600; font-size:1.05rem; white-space:nowrap; }
.marquee-track span::before{ content:"▲"; color:var(--gold); font-size:.7rem; }

/* ── Cards genéricos ─────────────────────────────────────────────────── */
.card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.7rem; position:relative; transition:transform .3s var(--ease), border-color .3s, background .3s;
}
.card:hover{ transform:translateY(-4px); border-color:rgba(245,188,22,.45); background:var(--panel-2); }

/* Pilares */
.pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:3rem; }
.pillar{ padding:2rem 1.8rem; }
.pillar .num{ font:700 .8rem/1 "IBM Plex Mono",monospace; color:var(--gold); letter-spacing:.1em; }
.pillar .ic{ width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:var(--gold-soft); color:var(--gold); margin:1rem 0 1.1rem; }
.pillar h3{ font-size:1.3rem; color:var(--white); }
.pillar p{ color:var(--muted); margin:.7rem 0 0; font-size:.97rem; }

/* Split (sobre / história) */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.split .body p{ color:var(--muted); }
.split .body p + p{ margin-top:1.1rem; }
/* Card "Crescimento Sustentável" — acompanha o tema (branco no claro / escuro no escuro) */
.split-figure{
  position:relative; border-radius:var(--radius-lg); border:1px solid var(--line);
  background:var(--grad-ink); padding:2.8rem 2.4rem 2.4rem; box-shadow:var(--shadow);
  overflow:hidden; display:flex; flex-direction:column; justify-content:center;
}
.split-figure::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(245,188,22,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(245,188,22,.07) 1px,transparent 1px); background-size:30px 30px; -webkit-mask-image:radial-gradient(ellipse 75% 75% at 70% 20%,#000,transparent); mask-image:radial-gradient(ellipse 75% 75% at 70% 20%,#000,transparent); }
.split-figure .sustain-ic{ position:relative; width:64px; height:64px; display:grid; place-items:center; border-radius:16px; background:rgba(245,188,22,.12); border:1px solid rgba(245,188,22,.4); box-shadow:0 8px 22px rgba(245,188,22,.18); margin-bottom:1.3rem; }
.split-figure .sustain-ic svg{ width:38px; height:38px; }
.split-figure .s-eyebrow{ position:relative; font:600 .72rem/1 "IBM Plex Mono",monospace; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.split-figure .s-title{ position:relative; font-family:"Montserrat",sans-serif; font-weight:800; font-size:clamp(1.5rem,3vw,2.1rem); color:var(--white); margin:.45rem 0 .6rem; line-height:1.1; }
.split-figure .s-lead{ position:relative; color:var(--muted); margin:0 0 1.4rem; font-size:.97rem; }
.split-figure .s-list{ position:relative; list-style:none; margin:0; padding:0; display:grid; gap:.75rem; }
.split-figure .s-list li{ display:flex; align-items:center; gap:.75rem; color:var(--text); font-weight:500; font-size:.97rem; }
.split-figure .s-list li::before{ content:""; flex-shrink:0; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:11px solid var(--gold); filter:drop-shadow(0 2px 3px rgba(245,188,22,.45)); }

/* Stats */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-top:2.6rem; }
.stat{ background:var(--panel); padding:1.7rem 1.4rem; text-align:center; }
.stat .v{ font-family:"Montserrat",sans-serif; font-weight:800; font-size:clamp(1.8rem,4vw,2.7rem); color:var(--gold); line-height:1; }
.stat .l{ display:block; margin-top:.5rem; font:500 .76rem/1.3 "IBM Plex Mono",monospace; letter-spacing:.08em; color:var(--muted); text-transform:uppercase; }

/* Timeline (história) */
.timeline{ display:grid; gap:1.1rem; margin-top:1.6rem; }
.tl-item{ display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:start; }
.tl-item .mk{ width:14px; height:14px; border-radius:50%; background:var(--gold); margin-top:.45rem; box-shadow:0 0 0 5px var(--gold-soft); position:relative; }
.tl-item:not(:last-child) .mk::after{ content:""; position:absolute; top:18px; left:50%; transform:translateX(-50%); width:2px; height:calc(100% + 1.1rem); background:var(--line); }
.tl-item h4{ font-family:"Montserrat",sans-serif; color:var(--white); font-size:1.05rem; }
.tl-item p{ color:var(--muted); margin:.25rem 0 0; font-size:.94rem; }

/* ── Áreas de atuação (grid de serviços) ─────────────────────────────── */
.areas{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:3rem; }
.area{ padding:1.4rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.7rem; }
.area .ic{ width:42px; height:42px; display:grid; place-items:center; border-radius:10px; background:var(--gold-soft); color:var(--gold); flex-shrink:0; }
.area .ic svg{ width:22px; height:22px; }
.area h3{ font-size:1.02rem; color:var(--white); font-family:"Montserrat",sans-serif; font-weight:600; line-height:1.25; }
.area p{ color:var(--muted); font-size:.88rem; margin:0; }
.area .idx{ position:absolute; top:1rem; right:1.1rem; font:600 .72rem/1 "IBM Plex Mono",monospace; color:var(--muted-2); }

/* ── Diferenciais ────────────────────────────────────────────────────── */
.diff{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.diff-list{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem 1.6rem; margin-top:1.8rem; }
.diff-list li{ display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:start; color:var(--text); font-size:.96rem; }
.diff-list .ck{ width:22px; height:22px; flex-shrink:0; border-radius:6px; background:var(--gold-soft); color:var(--gold); display:grid; place-items:center; margin-top:.15rem; }
.diff-list .ck svg{ width:13px; height:13px; }
.compliance{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:1.8rem; }
.compliance h3{ font-size:1.05rem; color:var(--white); display:flex; align-items:center; gap:.6rem; }
.compliance h3 .ic{ color:var(--gold); }
.badges{ display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1.2rem; }
.badge{ font:600 .8rem/1 "IBM Plex Mono",monospace; letter-spacing:.04em; color:var(--gold); background:var(--gold-soft); border:1px solid rgba(245,188,22,.3); padding:.55rem .8rem; border-radius:8px; }
.compliance .crea{ margin-top:1.3rem; padding-top:1.2rem; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
.compliance .crea b{ color:var(--white); }

/* ── MVV (Missão/Visão/Valores) ─────────────────────────────────────── */
.mvv{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-top:3rem; }
.mvv .mv{ padding:2rem; }
.mvv .mv .tag{ font:600 .74rem/1 "IBM Plex Mono",monospace; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.mvv .mv h3{ font-size:1.5rem; color:var(--white); margin:.7rem 0 .8rem; }
.mvv .mv p{ color:var(--muted); margin:0; }
.values{ grid-column:1/-1; padding:2rem; }
.values .tag{ font:600 .74rem/1 "IBM Plex Mono",monospace; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.values ul{ display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem 1.4rem; margin-top:1.3rem; }
.values li{ display:flex; align-items:center; gap:.6rem; color:var(--text); font-size:.95rem; }
.values li::before{ content:"▲"; color:var(--gold); font-size:.6rem; }

/* ── Identidade da marca ─────────────────────────────────────────────── */
.brand-id{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.brand-id .badge-art{ position:relative; aspect-ratio:1; border-radius:var(--radius-lg); border:1px solid var(--line); background:var(--grad-ink); display:grid; place-items:center; overflow:hidden; }
.brand-id .badge-art::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 40%, rgba(245,188,22,.14), transparent 60%); }
.brand-id .badge-art svg{ width:55%; position:relative; }
.split-word{ display:flex; gap:1rem; margin-top:1.6rem; }
.split-word .seg-card{ flex:1; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:1.4rem; }
.split-word .seg-card .k{ font-family:"Montserrat",sans-serif; font-weight:800; font-size:1.6rem; color:var(--gold); }
.split-word .seg-card p{ color:var(--muted); font-size:.9rem; margin:.5rem 0 0; }

/* ── CTA faixa ───────────────────────────────────────────────────────── */
.cta-band{ position:relative; border-radius:var(--radius-lg); overflow:hidden; background:var(--grad-gold); color:#161618; padding:clamp(2.4rem,5vw,3.6rem); text-align:center; }
.cta-band::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px); background-size:34px 34px; opacity:.5; }
.cta-band h2{ position:relative; font-size:clamp(1.7rem,4vw,2.7rem); color:#161618; max-width:20ch; margin-inline:auto; }
.cta-band p{ position:relative; color:#3a2f00; margin:.9rem auto 0; max-width:52ch; font-weight:500; }
.cta-band .hero-actions{ position:relative; justify-content:center; }
.cta-band .btn{ --bg:#161618; --fg:var(--gold); }
.cta-band .btn:hover{ box-shadow:0 16px 40px rgba(0,0,0,.3); }
.cta-band .btn--wa{ --bg:#161618; --fg:#fff; }

/* ── Footer ──────────────────────────────────────────────────────────── */
.footer{ background:var(--ink-2); border-top:1px solid var(--line); padding:clamp(3rem,6vw,4.5rem) 0 2rem; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.1fr; gap:2.2rem; }
.foot-brand .brand{ margin-bottom:1.1rem; }
.foot-brand p{ color:var(--muted); font-size:.92rem; max-width:34ch; }
.foot-services{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1.2rem; }
.foot-services span{ font:500 .72rem/1 "IBM Plex Mono",monospace; color:var(--muted); border:1px solid var(--line); border-radius:6px; padding:.35rem .55rem; }
.foot-col h4{ font:600 .78rem/1 "IBM Plex Mono",monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:1.1rem; }
.foot-col ul{ display:grid; gap:.6rem; }
.foot-col a,.foot-col li{ color:var(--muted); font-size:.92rem; transition:color .2s; }
.foot-col a:hover{ color:var(--gold); }
.foot-col .ct{ display:flex; gap:.6rem; align-items:flex-start; }
.foot-col .ct svg{ width:16px; height:16px; color:var(--gold); margin-top:.2rem; flex-shrink:0; }
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:2.6rem; padding-top:1.6rem; border-top:1px solid var(--line); color:var(--muted-2); font-size:.82rem; }
.foot-bottom .slogan{ font-family:"Montserrat",sans-serif; font-weight:600; color:var(--muted); }
.foot-bottom .slogan b{ color:var(--gold); }
.foot-bottom .credit{ font-size:.95rem; color:var(--muted); display:inline-flex; align-items:center; gap:.55rem; }
.foot-bottom .credit .prisma{ display:inline-flex; align-items:center; gap:.55rem; transition:color .2s; }
.foot-bottom .credit .prisma img{ height:36px; width:auto; background:#fff; border-radius:9px; padding:4px; box-shadow:0 2px 10px rgba(0,0,0,.28); }
.foot-bottom .credit .prisma b{ color:var(--white); font-weight:700; font-size:1.02rem; transition:color .2s; }
.foot-bottom .credit .prisma:hover b{ color:var(--gold); }

/* WhatsApp float */
.wa-float{ position:fixed; right:20px; bottom:20px; z-index:70; width:58px; height:58px; border-radius:50%; background:#1FAE54; color:#fff; display:grid; place-items:center; box-shadow:0 10px 30px rgba(31,174,84,.45); transition:transform .25s var(--ease); }
.wa-float:hover{ transform:scale(1.08); }
.wa-float svg{ width:30px; height:30px; }

/* ── Reveal on scroll ────────────────────────────────────────────────── */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }

/* hero entrance */
.hero .anim{ opacity:0; transform:translateY(20px); animation:rise .9s var(--ease) forwards; }
.hero .anim.a1{ animation-delay:.05s; } .hero .anim.a2{ animation-delay:.18s; }
.hero .anim.a3{ animation-delay:.31s; } .hero .anim.a4{ animation-delay:.44s; } .hero .anim.a5{ animation-delay:.57s; }
@keyframes rise{ to{ opacity:1; transform:none; } }

/* ════════ PÁGINAS CLARAS (orçamento / obrigado) ════════ */
body.light{ background:var(--light-bg); color:var(--light-text); }
.page-hero{ background:var(--grad-ink); color:var(--white); padding:clamp(120px,16vh,170px) 0 clamp(3rem,6vw,5rem); position:relative; overflow:hidden; }
.page-hero::after{ content:""; position:absolute; top:-20%; right:-5%; width:50vw; max-width:560px; aspect-ratio:1; background:radial-gradient(circle, rgba(245,188,22,.14), transparent 62%); }
.page-hero .crumb{ font:500 .78rem/1 "IBM Plex Mono",monospace; letter-spacing:.1em; color:var(--muted); }
.page-hero .crumb a{ color:var(--gold); }
.page-hero h1{ font-size:clamp(2.1rem,5vw,3.4rem); color:var(--white); margin:1rem 0 0; }
.page-hero p{ color:var(--muted); max-width:56ch; margin:1rem 0 0; }

/* Orçamento layout */
.quote{ background:var(--light-bg); }
.quote-grid{ display:grid; grid-template-columns:1.4fr .9fr; gap:clamp(2rem,5vw,3.4rem); align-items:start; }
.form-card{ background:var(--light-surf); border:1px solid var(--light-line); border-radius:var(--radius-lg); padding:clamp(1.6rem,3vw,2.6rem); box-shadow:0 18px 50px rgba(20,20,20,.06); }
.form-card h2{ color:var(--light-text); font-size:1.5rem; }
.form-card .sub{ color:var(--light-muted); margin:.5rem 0 1.8rem; font-size:.95rem; }
.fieldset{ border:0; padding:0; margin:0 0 1.6rem; }
.fieldset legend{ font:600 .76rem/1 "IBM Plex Mono",monospace; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; }
.fieldset legend::before{ content:""; width:18px; height:2px; background:var(--gold); }
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1rem; }
.field label{ font-size:.86rem; font-weight:600; color:var(--light-text); }
.field label .req{ color:#D64545; }
.field input,.field select,.field textarea{
  font:inherit; font-size:.95rem; padding:.8rem .9rem; border:1px solid var(--light-line); border-radius:10px;
  background:var(--field-bg); color:var(--light-text); transition:border-color .2s, box-shadow .2s; width:100%;
}
.field textarea{ resize:vertical; min-height:120px; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-soft); }
.field .hint{ font-size:.78rem; color:var(--light-muted); }
.checks{ display:grid; grid-template-columns:1fr 1fr; gap:.55rem .9rem; }
.check{ display:flex; align-items:flex-start; gap:.55rem; font-size:.88rem; color:var(--light-text); cursor:pointer; padding:.5rem .65rem; border:1px solid var(--light-line); border-radius:9px; transition:border-color .2s, background .2s; }
.check:hover{ border-color:var(--gold); background:var(--gold-soft); }
.check input{ accent-color:var(--gold-deep); margin-top:.15rem; width:16px; height:16px; flex-shrink:0; }
.check input:checked + span{ font-weight:600; }
.form-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:.5rem; }
.form-note{ font-size:.82rem; color:var(--light-muted); margin-top:1rem; }
.form-msg{ margin-top:1rem; padding:.9rem 1.1rem; border-radius:10px; font-size:.9rem; display:none; }
.form-msg.ok{ display:block; background:#eafaf0; border:1px solid #b9e6c9; color:#1c6b3e; }
.form-msg.err{ display:block; background:#fdeaea; border:1px solid #f3c2c2; color:#a32424; }

/* Aside contato (light) */
.contact-aside{ display:grid; gap:1rem; }
.contact-card{ background:var(--light-surf); border:1px solid var(--light-line); border-radius:var(--radius); padding:1.6rem; }
.contact-card.dark{ background:var(--ink-2); border-color:var(--line); color:var(--text); }
.contact-card h3{ font-size:1.05rem; color:inherit; margin:0 0 1.1rem; }
.contact-card.dark h3{ color:var(--white); }
.contact-row{ display:flex; gap:.85rem; align-items:flex-start; padding:.7rem 0; }
.contact-row + .contact-row{ border-top:1px solid var(--light-line); }
.contact-card.dark .contact-row + .contact-row{ border-top-color:var(--line); }
.contact-row .ic{ width:38px; height:38px; flex-shrink:0; border-radius:10px; background:var(--gold-soft); color:var(--gold-deep); display:grid; place-items:center; }
.contact-card.dark .contact-row .ic{ color:var(--gold); }
.contact-row .ic svg{ width:18px; height:18px; }
.contact-row .k{ font:600 .72rem/1 "IBM Plex Mono",monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--light-muted); }
.contact-card.dark .contact-row .k{ color:var(--muted); }
.contact-row .vv{ font-weight:600; color:inherit; margin-top:.2rem; }
.contact-row a.vv:hover{ color:var(--gold-deep); }

/* Obrigado */
.thanks{ min-height:70vh; display:grid; place-items:center; text-align:center; padding:6rem 0; }
.thanks .ic-big{ width:88px; height:88px; border-radius:50%; background:var(--gold-soft); color:var(--gold); display:grid; place-items:center; margin:0 auto 1.6rem; }
.thanks .ic-big svg{ width:42px; height:42px; }
.thanks h1{ color:var(--white); font-size:clamp(2rem,5vw,3rem); }
.thanks p{ color:var(--muted); max-width:48ch; margin:1rem auto 2rem; }

/* 404 */
.nf{ min-height:80vh; display:grid; place-items:center; text-align:center; }
.nf .code{ font-family:"Montserrat",sans-serif; font-weight:800; font-size:clamp(5rem,18vw,11rem); color:var(--gold); line-height:.9; letter-spacing:-.03em; }
.nf p{ color:var(--muted); margin:1rem auto 2rem; max-width:40ch; }

/* ── Responsivo ──────────────────────────────────────────────────────── */
@media (max-width:1024px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-art{ max-width:420px; margin-inline:auto; order:-1; }
  .areas{ grid-template-columns:repeat(2,1fr); }
  .diff,.brand-id,.quote-grid{ grid-template-columns:1fr; }
  .values ul{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px){
  .nav-links,.nav-cta .btn{ display:none; }
  .nav-toggle{ display:block; }
  .header.menu-open{ background:var(--glass-solid); backdrop-filter:blur(14px); border-bottom-color:var(--line); }
  .nav-links{
    position:fixed; inset:74px 0 auto 0; flex-direction:column; align-items:stretch; gap:.2rem;
    background:var(--glass-solid); padding:1rem var(--gut) 1.6rem; border-bottom:1px solid var(--line);
    transform:translateY(-12px); opacity:0; pointer-events:none; transition:.3s var(--ease);
  }
  .nav-links.open{ display:flex; transform:none; opacity:1; pointer-events:auto; }
  .nav-links a{ padding:.85rem .6rem; font-size:1rem; border-bottom:1px solid var(--line-soft); }
  .nav-links a.btn{ display:flex; justify-content:center; margin-top:.9rem; padding:.95rem 1rem;
                    color:#161618; background:var(--gold); border-bottom:0; }
  .nav-links a.btn:hover{ background:var(--gold-bright); color:#161618; }
}
@media (max-width:720px){
  .pillars,.split,.diff{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
  .mvv{ grid-template-columns:1fr; }
  .values ul{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
  .grid-2,.checks{ grid-template-columns:1fr; }
  .diff-list{ grid-template-columns:1fr; }
  .split-word{ flex-direction:column; }
}
@media (max-width:480px){
  .areas{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr; }
  .foot-bottom{ flex-direction:column; align-items:flex-start; }
}

/* ── Logo em imagem (marca oficial) ─────────────────────────────────── */
.brand img.wordmark{ height:23px; width:auto; display:block; }
.brand .tagline{ display:block; font:500 .56rem/1 "IBM Plex Mono",monospace; letter-spacing:.2em; color:var(--muted-2); text-transform:uppercase; margin-top:5px; }
@media (max-width:480px){ .brand img.wordmark{ height:20px; } .brand .tagline{ display:none; } }

.hero-art .hero-logo{
  width:min(460px,86%); height:auto; position:relative; z-index:2;
  filter:drop-shadow(0 22px 55px rgba(245,188,22,.30));
  animation:float 6s ease-in-out infinite;
}
.brand-id .badge-art img.brand-logo{ width:74%; height:auto; position:relative; }
.foot-brand .brand img.wordmark{ height:30px; }
.nf-logo{ width:128px; height:auto; margin:0 auto 1.5rem; display:block; }

/* ── Troca de logo por tema (claro/escuro) ──────────────────────────── */
.on-light{ display:none !important; }
:root[data-theme="light"] .on-dark{ display:none !important; }
:root[data-theme="light"] .on-light{ display:block !important; }

/* ── Botão de alternância de tema ───────────────────────────────────── */
.theme-toggle{
  display:inline-grid; place-items:center; width:42px; height:42px; flex-shrink:0;
  background:none; border:1px solid var(--line); border-radius:10px; color:var(--white);
  cursor:pointer; transition:border-color .2s, color .2s, background .2s;
}
.theme-toggle:hover{ border-color:var(--gold); color:var(--gold); }
.theme-toggle svg{ width:20px; height:20px; }
.theme-toggle .i-moon{ display:none; }                              /* tema escuro → mostra o sol */
:root[data-theme="light"] .theme-toggle .i-sun{ display:none; }
:root[data-theme="light"] .theme-toggle .i-moon{ display:block; }