/* base.css · Do Zero aos 100 Mil (Miguel Duarte) · GERADO por scripts/build-from-export.mjs — não editar à mão.
   Tokens do design system + camada Miguel (export da Sara) + scripts/partials/ui.css. */
/* Miguel Duarte · Do 0 aos 100K — global stylesheet (imports only) */
/* Webfonts self-hosted · Archivo (display) · Instrument Sans (body + UI). Só latin + latin-ext. */

/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  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;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  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;
}

/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("/assets/fonts/archivo-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;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("/assets/fonts/archivo-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;
}

/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: italic;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("/assets/fonts/instrument-sans-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;
}
/* latin */
@font-face {
  font-family: 'Instrument Sans';
  font-style: italic;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("/assets/fonts/instrument-sans-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;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("/assets/fonts/instrument-sans-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;
}
/* latin */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url("/assets/fonts/instrument-sans-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;
}

/* ============================================================
   COLORS · Miguel Duarte / Do 0 aos 100K · v2 "verde tonal"
   Monochrome green system (UI reference): deep green-black base,
   sage CTAs, mint highlights, soft glows and surface gradients.
   Backup of v1 (anthracite + vivid green) in _backup-v1/.
   ============================================================ */
:root {
  /* --- Deep green-black (base) --- */
  --ink-950: #06100C;
  --ink-900: #0A1712;   /* primary background */
  --ink-850: #0D1C16;
  --ink-800: #11241C;   /* raised surfaces */
  --ink-700: #163024;
  --ink-600: #22402F;
  --ink-500: #34523F;

  /* --- Forest (brand blocks) --- */
  --forest-950: #07170F;
  --forest-900: #0D2519;
  --forest-800: #133526;   /* principal */
  --forest-700: #1B4633;
  --forest-600: #245A41;
  --forest-500: #2F6F51;

  /* --- Sage (CTA · buttons) --- */
  --sage-300: #7DB897;
  --sage-400: #5FA37F;
  --sage-500: #4E9471;
  --sage-600: #3F7D5C;
  --sage-700: #2F6649;

  /* --- Mint (highlights: numbers, placa, prices) --- */
  --green-200: #CFEEDB;
  --green-300: #B4E4C6;
  --green-400: #9ED9B3;   /* mint · accent */
  --green-500: #86CB9E;
  --green-600: #6BB585;
  --green-700: #2E7A50;   /* green text on off-white */

  /* --- Off-white (contrast) --- */
  --paper-50:  #FAFAF7;
  --paper-100: #F1F4EF;
  --paper-200: #E0E6DF;
  --paper-300: #BCC8BF;   /* body text on dark */

  /* --- Neutral grey-green (support) --- */
  --gray-400: #8A9A90;
  --gray-500: #6A7A70;
  --gray-600: #4B5A51;

  --amber-400: #F0BC5E;
  --amber-500: #E2A33C;

  --whatsapp: #25D366;
  --whatsapp-dark: #128C7E;

  --black: #000000;
  --white: #FFFFFF;

  /* ====== SEMANTIC ALIASES ====== */
  --surface-base:   var(--ink-900);
  --surface-raised: var(--ink-800);
  --surface-sunken: var(--ink-950);
  --surface-forest: var(--forest-800);
  --surface-forest-deep: var(--forest-900);
  --surface-paper:  var(--paper-100);
  /* Card surfaces: vertical gradient + inset top highlight (see --shadow-card) */
  --surface-card:    linear-gradient(180deg, #16301F 0%, #10241A 100%); /* @kind color */
  --surface-card-forest: linear-gradient(165deg, #21513A 0%, #163B2A 48%, #0F2A1D 100%); /* @kind color */
  /* Page background: soft green glow from the top */
  --bg-glow: radial-gradient(90% 55% at 50% -8%, rgba(47,111,81,0.45) 0%, rgba(47,111,81,0) 70%); /* @kind color */

  --text-strong: var(--paper-100);
  --text-body:   var(--paper-300);
  --text-muted:  var(--gray-400);
  --text-on-light:       var(--ink-900);
  --text-on-light-muted: var(--gray-600);

  --brand:        var(--forest-800);
  --accent:       var(--green-400);   /* mint highlight */
  --accent-hover: var(--green-300);
  --accent-press: var(--green-500);
  --accent-soft:  rgba(158, 217, 179, 0.12);
  --accent-on-light: var(--green-700);
  --on-accent:    var(--ink-900);

  /* Placa (main headline highlight): deep sage block, white text (5.8:1) */
  --placa-bg: #2F7352;
  --on-placa: var(--white);

  /* CTA (mint gradient, dark text) */
  --cta-grad:       linear-gradient(180deg, #CFEEDB 0%, #86CB9E 100%); /* @kind color */
  --cta-grad-hover: linear-gradient(180deg, #B4E4C6 0%, #6BB585 100%); /* @kind color */
  --on-cta: var(--ink-900);

  /* VIP / valores grandes (segundo acento, dourado mate). Só em elementos VIP e no "100 mil". */
  --vip-300: #EBD9A6;
  --vip-400: #D8BC72;
  --vip-500: #C4A052;
  --vip-600: #A68338;
  --vip-grad: linear-gradient(180deg, #EBD9A6 0%, #C4A052 100%); /* @kind color */
  --on-vip: #3B2808;
  --vip-line: rgba(216, 188, 114, 0.45);
  --vip-soft: rgba(216, 188, 114, 0.12);

  --warn:      var(--amber-500);
  --warn-soft: rgba(226, 163, 60, 0.12);

  --line:        rgba(200, 240, 215, 0.07);
  --line-strong: rgba(200, 240, 215, 0.12);
  --line-accent: rgba(158, 217, 179, 0.35);
  --line-on-light: rgba(10, 23, 18, 0.12);

  --focus-ring: rgba(158, 217, 179, 0.45);
}

/* ============================================================
   TYPOGRAPHY · Miguel Duarte / Do 0 aos 100K
   Archivo: headlines (800–900, tight) and big numbers (expanded width).
   Instrument Sans: body + UI. Two families (Conet max is 3).
   ============================================================ */
:root {
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-sans:    'Instrument Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-heavy:    800;
  --weight-black:    900;

  /* Width axis (Archivo wdth) */
  --stretch-display: 100%;   /* @kind other */
  --stretch-numeral: 118%;   /* @kind other */
  --stretch-label:   112%;   /* @kind other */

  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.875rem;  /* 14 */
  --text-base: 1rem;      /* 16 · body min on mobile */
  --text-md:   1.125rem;  /* 18 */
  --text-lg:   1.375rem;  /* 22 */
  --text-xl:   1.75rem;   /* 28 */
  --text-2xl:  2.25rem;   /* 36 */
  --text-3xl:  3rem;      /* 48 */
  --text-4xl:  4rem;      /* 64 */
  --text-5xl:  5.5rem;    /* 88 */
  --text-display: clamp(2.5rem, 5.6vw + 1rem, 5.75rem); /* @kind other */
  --text-hero-sub: clamp(1.0625rem, 1vw + 0.7rem, 1.375rem); /* @kind other */
  --text-numeral: clamp(4rem, 12vw, 10rem); /* @kind other */

  --leading-display: 0.98;
  --leading-tight:   1.08;
  --leading-snug:    1.3;
  --leading-body:    1.55;

  --tracking-display: -0.035em;
  --tracking-tight:   -0.02em;
  --tracking-normal:   0em;
  --tracking-wide:     0.04em;
  --tracking-eyebrow:  0.16em;

  --font-headline: var(--font-display);
  --font-body:     var(--font-sans);
}

/* ============================================================
   SPACING · RADII · SHADOWS · MOTION · Miguel Duarte
   8px base with intentional jumps (Conet A2): respiro 40px, large 80px.
   Radii are tight and modern: confident, not bubbly.
   ============================================================ */
:root {
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  40px;   /* standard respiro */
  --space-8:  56px;
  --space-9:  80px;   /* large respiro */
  --space-10: 112px;
  --space-11: 160px;

  --maxw-prose:   62ch;
  --maxw-content: 1240px;
  --maxw-narrow:  640px;
  --gutter:    clamp(20px, 6vw, 104px); /* @kind spacing */
  --section-y: clamp(64px, 9vw, 160px); /* @kind spacing */

  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;   /* inputs, buttons */
  --radius-lg:   20px;   /* cards, form block */
  --radius-xl:   28px;
  --radius-pill: 999px;  /* keyword pills only */

  --border-hair:   1px solid var(--line);
  --border-soft:   1px solid var(--line-strong);
  --border-accent: 1px solid var(--line-accent);

  --shadow-sm:   0 1px 2px rgba(0,0,0,0.45);
  --shadow-md:   0 10px 30px -10px rgba(0,0,0,0.6);
  --shadow-card: inset 0 1px 0 rgba(200,240,215,0.09), 0 30px 70px -28px rgba(0,0,0,0.75);
  --shadow-card-strong: inset 0 1px 0 rgba(200,240,215,0.16), 0 30px 70px -26px rgba(0,0,0,0.8), 0 0 60px -20px rgba(95,163,127,0.35);
  --shadow-accent: inset 0 0 0 1px rgba(207,238,219,0.5), 0 10px 34px rgba(134,203,158,0.45);
  --shadow-light:  0 18px 50px -22px rgba(10,23,18,0.25);

  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur-base: 240ms; /* @kind other */
  --dur-slow: 600ms; /* @kind other */
}

/* BASE · element defaults on the tokens */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg-glow) no-repeat, var(--surface-base); background-attachment: fixed; color: var(--text-body); font-family: var(--font-body); font-size: var(--text-base); line-height: var(--leading-body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, h4 { font-family: var(--font-headline); color: var(--text-strong); font-weight: var(--weight-heavy); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); text-wrap: balance; margin: 0; }
h1 { font-size: var(--text-4xl); font-weight: var(--weight-black); line-height: var(--leading-display); letter-spacing: var(--tracking-display); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); }
p { margin: 0; text-wrap: pretty; }
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }
img { max-width: 100%; display: block; }
::selection { background: var(--accent); color: var(--on-accent); }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* Eyebrow: uppercase, tracked, no leading dash (Conet A2) */
.eyebrow { font-family: var(--font-display); font-stretch: var(--stretch-label); font-size: var(--text-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--accent); }

/* Primary highlight: the "placa" (deep sage block, white text, behind the key phrase) */
.placa { background: var(--placa-bg); color: var(--on-placa); padding: 0 0.14em; border-radius: var(--radius-xs); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
/* Secondary highlight: green text */
.hl { color: var(--accent); }

/* Big numbers: expanded Archivo, tabular */
.numeral { font-family: var(--font-display); font-stretch: var(--stretch-numeral); font-weight: var(--weight-black); letter-spacing: -0.04em; line-height: 0.9; font-variant-numeric: tabular-nums lining-nums; color: var(--text-strong); }

/* Camada Miguel Duarte sobre o Template 2 Conet: mapeia os tokens do template para a identidade do Miguel. */
:root{--line-gold:var(--line-accent);--gold-700:var(--green-700);--gold-400:var(--sage-400);--gold-300:var(--green-300);--taupe-700:var(--gray-600);--taupe-600:var(--gray-500);--font-accent:var(--font-display)}
.accent-serif{font-family:inherit;font-style:normal;font-weight:inherit}
a{color:var(--accent)}a:hover{color:var(--accent-hover)}
/* Funnel layout (template) */
html,body{margin:0;background:var(--surface-base)}
.m10-center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-9) var(--gutter)}
.m10-cal-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7);align-items:start}
.m10-cal-tips-m{display:none}
.m10-cal-tips-m{display:none}
.m10-frow{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}
.m10-frow>*{min-width:0}
@media (max-width:880px){.m10-cal-grid{grid-template-columns:1fr}.m10-calcard{display:none}.m10-cal-tips-m{display:flex!important}}
@media (max-width:480px){.m10-frow{grid-template-columns:1fr}}
@media (max-width:700px){#root a,#root button{white-space:normal!important;max-width:100%}}
@media (min-width:701px){#root [data-onlight],#root [data-wa]{white-space:nowrap!important;flex:none}}
#root [data-onlight],#root [data-wa]{height:auto!important;min-height:0}
/* Cenário claro das páginas do fluxo (template: cenário branco) · Miguel: off-white com brilho verde */
.cenab{position:fixed;inset:0;z-index:0;background:var(--paper-100)}
.cenab__img{position:absolute;inset:0;background:radial-gradient(80% 55% at 50% -10%,rgba(47,111,81,.20),rgba(47,111,81,0) 70%)}
.cenab__img--blur{display:none}
.cenab__veil{position:absolute;inset:0;background:radial-gradient(ellipse 72% 66% at 50% 46%,rgba(241,244,239,0) 42%,rgba(224,230,223,.6) 100%)}
#root{position:relative;z-index:1}
[data-onlight]{color:var(--ink-900)!important;border-color:rgba(10,23,18,.28)!important}
[data-wa]{background:#25D366!important;color:#fff!important;border:1px solid transparent!important;box-shadow:0 12px 30px rgba(37,211,102,.42)!important}
[data-wa]:hover{background:#1FB457!important}
/* Superfícies claras (cartões do fluxo) */
.md-light{--surface-raised:#EEF2EC;--surface-sunken:#E6ECE5;--text-strong:var(--ink-900);--text-body:var(--gray-600);--text-muted:var(--gray-500);--line:rgba(10,23,18,.12);--line-strong:rgba(10,23,18,.22);--line-accent:rgba(46,122,80,.4);--gold-300:var(--gold-700);--accent:var(--green-700);--accent-soft:rgba(46,122,80,.12);--on-accent:#fff}
.md-card{background:#FAFAF7;border:1px solid rgba(10,23,18,.10);border-radius:var(--radius-lg);box-shadow:0 18px 50px -20px rgba(10,23,18,.22)}
.md-accentbar{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green-700),var(--sage-400) 50%,var(--green-700))}
/* Stepper (copy do Notion, página Obrigado) */
.md-stepper{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 var(--space-6);list-style:none;padding:0}
.md-stepper li{flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--gray-600);background:#FAFAF7;border:1px solid rgba(10,23,18,.12)}
.md-stepper .md-step-n{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--radius-xs);font-size:11px;background:var(--paper-200);color:var(--ink-900)}
.md-stepper li.done{color:var(--green-700);border-color:rgba(46,122,80,.4)}
.md-stepper li.done .md-step-n{background:var(--green-700);color:#fff}
/* Botões pequenos de calendário dentro dos passos */
.md-calbtns{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.md-calbtns a{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:var(--radius-sm);border:1px solid rgba(46,122,80,.45);color:var(--ink-900);font-family:var(--font-sans);font-size:13px;font-weight:600;text-decoration:none;background:#fff}
.md-calbtns a:hover{border-color:var(--green-700);color:var(--green-700)}
.md-dates{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:var(--text-sm);color:var(--gray-600)}
.vip-seal{background:var(--vip-grad)!important;color:var(--on-vip)!important}
.vip-grad{background:linear-gradient(120deg,#A68338 0%,#D8BC72 42%,#EBD9A6 55%,#C4A052 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent}
.vip-card .md-accentbar,.vip-survey .md-accentbar{background:linear-gradient(90deg,var(--vip-600),var(--vip-300) 50%,var(--vip-600))}
.vip-card,.vip-survey{border-color:rgba(166,131,56,.35)!important}
.md-note{max-width:560px;margin:var(--space-6) auto 0;font-size:var(--text-sm);color:var(--gray-600);text-align:center;line-height:var(--leading-snug)}
.md-vip-btn{background:var(--vip-grad)!important;color:var(--on-vip)!important;box-shadow:inset 0 0 0 1px rgba(235,217,166,.5),0 10px 34px rgba(196,160,82,.4)!important}
@media (max-width:700px){.conf-sched{display:none!important}}

/* ============================================================
   ui.css · estados interativos que no export eram estado React
   (hover dos botões, foco dos campos, seleção da pesquisa, modal).
   Concatenado no fim de assets/css/base.css pelo build.
   ============================================================ */

/* Botões do design system. As cores da variante saem do inline style para
   classes (especificidade 0,2,0) para que as regras !important das páginas
   (CTA dourado, botão WhatsApp) continuem a ganhar, tal como no original. */
.ds-btn { border-width: 1px; border-style: solid; }
.ds-btn.ds-btn--primary { background: var(--cta-grad); color: var(--on-cta); border-color: transparent; box-shadow: var(--shadow-accent); }
.ds-btn.ds-btn--light   { background: var(--paper-100); color: var(--ink-900); border-color: transparent; box-shadow: var(--shadow-md); }
.ds-btn.ds-btn--outline { background: rgba(200,240,215,0.04); color: var(--text-strong); border-color: var(--line-strong); box-shadow: none; }
.ds-btn.ds-btn--ghost   { background: transparent; color: var(--accent); border-color: transparent; box-shadow: none; }
.ds-btn:hover { transform: translateY(-1px); }
.ds-btn:active { transform: translateY(1px); }
.ds-btn.ds-btn--primary:hover { background: var(--cta-grad-hover); color: var(--on-cta); }
.ds-btn.ds-btn--light:hover   { background: var(--white); }
.ds-btn.ds-btn--outline:hover { background: rgba(200,240,215,0.08); border-color: var(--line-accent); }
.ds-btn.ds-btn--ghost:hover   { color: var(--accent-hover); }
.ds-btn[aria-busy="true"] { opacity: .7; pointer-events: none; }

/* Barra do topo em mobile: a regra .lp-hero__brand{order:1} do hero também
   apanhava a marca da barra e punha-a à direita do botão. */
.lp-topbar-x .lp-hero__brand { order: 0; text-align: left; }

/* Hero em mobile: versões recortadas (geradas pelo build em deriveMobileHero) com a mesma área visível que
   o design mostra a partir das imagens de 2560px — ~36 KB em vez de ~109 KB antes do LCP. */
@media (max-width: 700px) {
  .lp-hero .lp-hero__img-m {
    background: url("/assets/img/hero-miguel-m.webp") 0 0 / auto 100% no-repeat, url("/assets/img/hero-bg-m.webp") 0 0 / auto 100% no-repeat;
  }
}

/* Modal da inscrição */
.lp-modal[hidden] { display: none; }
html.lp-modal-open { overflow: hidden; }

/* ---------- Campos (fieldStyle do design system) ---------- */
.field { min-width: 0; }
.f-input {
  width: 100%; padding: 15px 16px; font-family: var(--font-sans); font-size: var(--text-base);
  color: var(--text-strong); background: var(--field-bg, var(--ink-950));
  border: 1px solid var(--field-border, var(--line-strong)); border-radius: var(--radius-md);
  outline: none; box-shadow: none;
  transition: border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.f-input::placeholder { color: var(--text-muted); opacity: 1; }
.f-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.field.invalid .f-input, .field.invalid .f-phone { border-color: var(--warn); }
.f-err { display: block; margin-top: 6px; font-family: var(--font-sans); font-size: var(--text-xs); color: var(--warn); }
.f-err[hidden], .f-warn[hidden] { display: none; }
.f-warn { display: block; margin-top: 6px; font-family: var(--font-sans); font-size: var(--text-xs); color: var(--text-muted); }

/* Pergunta de qualificação (SituacaoSelect) */
.f-select { position: relative; }
.f-select select.f-input {
  appearance: none; -webkit-appearance: none; padding: 14px 40px 14px 16px; cursor: pointer;
  background: var(--surface-raised); box-shadow: 0 1px 2px rgba(0,0,0,0.4); color: var(--text-strong);
  color-scheme: dark;
}
.f-select select.f-input:invalid { color: var(--text-muted); }
.f-select select.f-input:focus { box-shadow: 0 0 0 3px var(--accent-soft); }
.f-select option { background: #0A1712; color: #F1F4EF; }
.f-select__caret { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--accent); font-size: 12px; }

/* Telemóvel: indicativo (select transparente por cima da bandeira) + número */
.f-phone {
  display: flex; min-width: 0; overflow: hidden;
  background: var(--field-bg, var(--ink-950)); border: 1px solid var(--field-border, var(--line-strong));
  border-radius: var(--radius-md);
  transition: border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.f-phone:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.f-phone__cc { position: relative; flex: none; border-right: 1px solid var(--line-strong); }
.f-phone__label {
  display: flex; align-items: center; gap: 6px; height: 100%; padding: 0 28px 0 14px;
  font-family: var(--font-sans); font-size: var(--text-base); color: var(--text-strong); pointer-events: none; white-space: nowrap;
}
.f-phone__caret { position: absolute; right: 11px; color: var(--accent); font-size: 10px; }
.f-phone__cc select {
  position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; font-size: 16px;
  color-scheme: dark;
}
.f-phone__cc select option { background: #0A1712; color: #F1F4EF; }
.f-phone input {
  flex: 1; min-width: 0; border: none; background: transparent; color: var(--text-strong);
  font-family: var(--font-sans); font-size: var(--text-base); padding: 15px 16px; outline: none;
}
.f-phone input::placeholder { color: var(--text-muted); opacity: 1; }

/* Consentimento (Checkbox do design system) */
.f-check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font-family: var(--font-sans); position: relative; }
.f-check input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.f-check__box {
  flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: var(--radius-xs);
  border: 1px solid var(--gray-500); background: transparent;
  display: inline-flex; align-items: center; justify-content: center; transition: all var(--dur-fast) var(--ease-out);
}
.f-check__box svg { display: none; }
.f-check input:checked + .f-check__box { background: var(--accent); border-color: var(--accent); }
.f-check input:checked + .f-check__box svg { display: block; }
.f-check input:focus-visible + .f-check__box { box-shadow: 0 0 0 3px var(--accent-soft); }
.field.invalid .f-check__box { border-color: var(--warn); }
.f-check__text { font-size: var(--text-sm); color: var(--text-body); line-height: var(--leading-snug); }
.f-check__text a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.f-check + .f-err { margin-left: 32px; }

/* Formulário de inscrição (modal) */
.lf { display: flex; flex-direction: column; gap: var(--space-3); }
.lf-submit { width: 100%; }
.lf-note { font-size: var(--text-xs); color: var(--text-muted); text-align: center; margin: 0; }
.lf-status { font-size: var(--text-sm); color: var(--warn); text-align: center; margin: 0; }
.lf-status[hidden] { display: none; }

/* ---------- Pesquisa pós-inscrição (OptionRow + escala) ---------- */
.sv-opt { background: var(--surface-raised); border: 1px solid var(--line-strong); color: var(--text-body); }
.sv-opt.is-on { background: var(--accent-soft); border-color: var(--line-gold); color: var(--text-strong); }
.sv-ind { border: 1px solid var(--line-strong); background: transparent; }
.sv-opt.is-on .sv-ind { border-color: var(--accent); background: var(--accent); }
.sv-mark { display: none; }
.sv-opt.is-on .sv-mark { display: block; }
.sv-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--on-accent); }
.sv-opt:focus-visible, .sv-scale:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.sv-scale { color: var(--text-body); background: var(--surface-raised); border: 1px solid var(--line-strong); }
.sv-scale.is-on { color: var(--on-accent); background: var(--accent); border-color: transparent; }
.sv-q.invalid .sv-opt, .sv-q.invalid .sv-scale { border-color: var(--warn); }
.sv-q .f-err { margin-top: 8px; }
.sv-email.invalid input { border-color: var(--warn) !important; }
[data-done][hidden] { display: none; }

/* Pergunta VIP */
.pv-field.invalid input, .pv-field.invalid textarea { border-color: var(--warn) !important; }

/* Páginas legais em mobile: "Política de privacidade" a 64px não cabia em 343px (scroll horizontal no original). */
@media (max-width: 480px) { .legal h1 { font-size: var(--text-2xl); overflow-wrap: break-word; } }
