/* O Desimposto · webfonts
   SUBSTITUIÇÃO SINALIZADA: não foram fornecidos ficheiros de fonte.
   As três famílias abaixo são a proposta mais próxima do estilo aprovado
   (ref. assets/reference/direcao-aprovada-dark-mode.webp) e vêm do Google Fonts.
   Se a marca tiver ficheiros próprios, trocar este @import por @font-face locais. */

@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 300 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 300 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 300 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 300 900;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}




@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/assets/fonts/manrope-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/assets/fonts/manrope-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/space-grotesk-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/fonts/space-grotesk-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root{
/* ===== Azul Desimposto · a única cor confirmada pelo cliente ===== */
--azul-desimposto:#3D5AFE;   /* rgb(61,90,254) · amostra em assets/reference/cor-desimposto.png */
--azul-hover:#5A73FF;
--azul-press:#2439C7;
--azul-fundo:#101A4D;        /* azul muito escuro, para blocos e gradientes */
--azul-suave:#93A3FF;        /* azul legível sobre fundo escuro (texto de acento) */
--azul-veu:rgba(61,90,254,.14); /* @kind color */
--azul-veu-forte:rgba(61,90,254,.28); /* @kind color */
--azul-linha:rgba(61,90,254,.45); /* @kind color */

/* ===== Tinta · neutros frios quase-neutros (0 = mais escuro) =====
   Deliberadamente NÃO azul-marinho: o navy da campanha antiga sai do sistema. */
--tinta-000:#08080A;
--tinta-100:#101116;
--tinta-200:#171921;
--tinta-300:#21242E;
--tinta-400:#2E323E;
--tinta-500:#464B5A;
--tinta-600:#6E7484;
--tinta-700:#9AA0AE;
--tinta-800:#C7CBD4;
--tinta-900:#E9EBEF;
--papel:#F6F7F9;
--branco:#FFFFFF;

/* ===== Semânticas · uso pontual, nunca decorativo ===== */
--ambar:#FFB224;             /* aviso / alerta / prazo */
--ambar-veu:rgba(255,178,36,.14); /* @kind color */
--verde-poupanca:#19C37D;    /* poupança, ganho, "via holding" */
--verde-veu:rgba(25,195,125,.14); /* @kind color */
--vermelho-imposto:#F0453F;  /* custo, imposto pago a mais */
--vermelho-veu:rgba(240,69,63,.14); /* @kind color */

/* ===== Marca externa · só para botões de WhatsApp ===== */
--whatsapp:#25D366;
--whatsapp-hover:#3BE07A;
--whatsapp-press:#1AA851;
--whatsapp-veu:rgba(37,211,102,.14); /* @kind color */
}

:root{
/* famílias · máximo 3 (regra Conet A2) */
--font-display:"Archivo","Archivo Expanded",system-ui,sans-serif;
--font-sans:"Manrope",system-ui,-apple-system,sans-serif;
--font-label:"Space Grotesk",system-ui,sans-serif;

/* pesos */
--w-regular:400; /* @kind other */
--w-medium:500; /* @kind other */
--w-semibold:600; /* @kind other */
--w-bold:700; /* @kind other */
--w-extrabold:800; /* @kind other */
--w-black:900; /* @kind other */

/* ===== Escala de ecrã (LPs) · fluida, mobile-first ===== */
--fs-display:clamp(40px,7.2vw,86px); /* @kind font */
--fs-h1:clamp(34px,5.4vw,64px); /* @kind font */
--fs-h2:clamp(27px,3.4vw,42px); /* @kind font */
--fs-h3:clamp(21px,2.1vw,27px); /* @kind font */
--fs-lead:clamp(17px,1.5vw,21px); /* @kind font */
--fs-body:17px; /* @kind font */
--fs-small:15px; /* @kind font */
--fs-micro:13px; /* @kind font */
--fs-eyebrow:13px; /* @kind font */

/* ===== Escala de estático · tela nativa de 1080px (regra Conet A3/A5) ===== */
--fs-static-hero:112px;      /* palavra-herói da headline */
--fs-static-h1:78px; /* @kind font */
--fs-static-h2:58px; /* @kind font */
--fs-static-lead:40px; /* @kind font */
--fs-static-body:34px; /* @kind font */
--fs-static-cta:36px; /* @kind font */
--fs-static-eyebrow:28px; /* @kind font */
--fs-static-micro:26px; /* @kind font */

/* entrelinhas · headline apertada, corpo respirado */
--lh-hero:1.02; /* @kind other */
--lh-headline:1.06; /* @kind other */
--lh-title:1.14; /* @kind other */
--lh-body:1.55; /* @kind other */
--lh-lead:1.42; /* @kind other */

/* tracking */
--ls-hero:-.035em; /* @kind other */
--ls-headline:-.025em; /* @kind other */
--ls-title:-.015em; /* @kind other */
--ls-body:0; /* @kind other */
--ls-eyebrow:.22em;          /* eyebrow em mono, maiúsculas, tracking largo */
--ls-label:.06em; /* @kind other */
}

:root{
/* base 8, com saltos intencionais (Conet A2: 40 -> 80, nunca valores a meio) */
--space-0:0;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:40px;    /* respiro padrão */
--space-8:56px;
--space-9:80px;    /* respiro grande · o dobro do padrão */
--space-10:120px;
--space-11:160px;

/* LP · margens de página simétricas + container centrado */
--page-gutter:clamp(20px,5vw,72px); /* @kind spacing */
--page-max:1240px; /* @kind spacing */
--hero-gap:clamp(32px,4vw,72px);
--section-y:clamp(64px,7vw,120px); /* @kind spacing */

/* Estático · tela 1080 (Conet A3) */
--static-w:1080px; /* @kind spacing */
--static-h-1x1:1080px; /* @kind spacing */
--static-h-4x5:1350px; /* @kind spacing */
--static-h-story:1920px; /* @kind spacing */
--static-pad-x:96px;
--static-pad-y:96px;
--story-safe-top:200px;      /* UI do Instagram entra por cima */
--story-safe-bottom:350px;
}

:root{
/* raios · cantos generosos mas não pílula, exceto CTA */
--radius-xs:6px;
--radius-sm:10px;
--radius-md:14px;
--radius-card:18px;
--radius-lg:26px;
--radius-pill:999px;

/* bordas */
--border-hair:1px; /* @kind spacing */
--border-solid:2px; /* @kind spacing */
--border-accent:3px; /* @kind spacing */

/* sombras · profundidade por escuro, nunca glow colorido exagerado */
--shadow-soft:0 10px 28px rgba(0,0,0,.34);
--shadow-card:0 1px 2px rgba(0,0,0,.30),0 18px 44px rgba(0,0,0,.44);
--shadow-lift:0 24px 64px rgba(0,0,0,.52);
--shadow-cta:0 10px 26px rgba(61,90,254,.34);
--shadow-cta-press:0 4px 12px rgba(61,90,254,.30);
--hair-top:inset 0 1px 0 rgba(255,255,255,.07); /* @kind shadow */
--hair-accent:inset 0 0 0 1px rgba(61,90,254,.32); /* @kind shadow */

/* scrims e fades · calibrados à imagem, neutros (não tingem a foto) */
--scrim-bottom:linear-gradient(to bottom,transparent 0%,rgba(8,8,10,.72) 58%,var(--tinta-000) 100%); /* @kind other */
--scrim-top:linear-gradient(to bottom,rgba(8,8,10,.86) 0%,rgba(8,8,10,.45) 46%,transparent 100%); /* @kind other */
--scrim-left:linear-gradient(to right,rgba(8,8,10,.90) 0%,rgba(8,8,10,.55) 44%,transparent 100%); /* @kind other */
--fade-foto:linear-gradient(180deg,#000 62%,transparent 100%); /* @kind other */
--grad-azul:linear-gradient(135deg,var(--azul-desimposto) 0%,var(--azul-press) 100%); /* @kind other */
--grad-palco:radial-gradient(120% 90% at 50% 0%,#1B2140 0%,var(--tinta-000) 62%); /* @kind other */

/* movimento · discreto, sem bounce */
--ease-out:cubic-bezier(.22,.61,.36,1); /* @kind other */
--ease-in-out:cubic-bezier(.45,.05,.55,.95); /* @kind other */
--dur-fast:140ms; /* @kind other */
--dur-base:220ms; /* @kind other */
--dur-slow:420ms; /* @kind other */

/* vidro · só em barras fixas sobre conteúdo */
--blur-bar:saturate(140%) blur(14px); /* @kind other */
}

/* Aliases semânticos. É por aqui que se desenha, não pelos valores crus.
   O sistema é dark-first (o tema aprovado). .tema-claro inverte as superfícies. */
:root{
--bg-page:var(--tinta-000);
--bg-page-alt:var(--tinta-100);
--bg-surface:var(--tinta-200);
--bg-surface-raised:var(--tinta-300);
--bg-field:var(--tinta-300);
--bg-field-focus:var(--tinta-400);
--bg-accent:var(--azul-desimposto);
--bg-accent-veu:var(--azul-veu);
--bg-inverse:var(--papel);
--bg-palco:var(--grad-palco);

--text-primary:var(--branco);
--text-secondary:var(--tinta-800);
--text-muted:var(--tinta-600);
--text-accent:var(--azul-suave);
--text-on-accent:var(--branco);
--text-inverse:var(--tinta-100);
--text-link:var(--azul-suave);
--text-link-hover:var(--branco);

--border-subtle:rgba(255,255,255,.09);
--border-medium:rgba(255,255,255,.16);
--border-strong:rgba(255,255,255,.28);
--border-accent-c:var(--azul-linha);

--cta-bg:var(--azul-desimposto);
--cta-bg-hover:var(--azul-hover);
--cta-bg-press:var(--azul-press);
--cta-text:var(--branco);
--cta-shadow:var(--shadow-cta);

--surface-card:var(--bg-surface);
--surface-card-border:var(--border-subtle);
--surface-card-shadow:var(--shadow-card);

--state-warn:var(--ambar);
--state-warn-veu:var(--ambar-veu);
--state-good:var(--verde-poupanca);
--state-good-veu:var(--verde-veu);
--state-bad:var(--vermelho-imposto);
--state-bad-veu:var(--vermelho-veu);
}
.tema-claro{
--bg-page:var(--papel);
--bg-page-alt:var(--branco);
--bg-surface:var(--branco);
--bg-surface-raised:var(--branco);
--bg-field:var(--branco);
--bg-field-focus:var(--branco);
--bg-inverse:var(--tinta-000);
--text-primary:var(--tinta-100);
--text-secondary:var(--tinta-500);
--text-muted:var(--tinta-600);
--text-accent:var(--azul-press);
--text-inverse:var(--branco);
--text-link:var(--azul-press);
--text-link-hover:var(--tinta-100);
--border-subtle:rgba(16,17,22,.10);
--border-medium:rgba(16,17,22,.18);
--border-strong:rgba(16,17,22,.32);
--surface-card:var(--branco);
--surface-card-shadow:0 1px 2px rgba(16,17,22,.06),0 14px 34px rgba(16,17,22,.10);
}

/* Reset mínimo e defaults tipográficos. Nada de componentes aqui. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-page);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--w-medium);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--w-extrabold);letter-spacing:var(--ls-headline);line-height:var(--lh-headline);margin:0;text-wrap:balance}
h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3);letter-spacing:var(--ls-title);line-height:var(--lh-title)}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration-color:var(--azul-linha);text-underline-offset:3px;transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-link-hover);text-decoration-color:currentColor}
strong,b{font-weight:var(--w-extrabold);color:var(--text-primary)}
em{font-style:italic}
img,svg,video{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--azul-desimposto);outline-offset:2px}
::selection{background:var(--azul-desimposto);color:var(--branco)}
.label{font-family:var(--font-label);letter-spacing:var(--ls-label)}
.eyebrow{font-family:var(--font-label);font-size:var(--fs-eyebrow);font-weight:var(--w-semibold);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-accent)}