@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Montserrat:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,300;1,400&display=swap');
/* BLOCK HORIZONTAL SCROLL */
html{overflow-x:hidden!important;-webkit-overflow-scrolling:touch}
body{overflow-x:hidden!important;max-width:100vw!important;width:100%!important;position:relative}
*,*::before,*::after{box-sizing:border-box}

/* Responsive images: HTML width/height são apenas hints de aspect-ratio, não dimensões literais */
img{max-width:100%;height:auto;width:auto}

/* Frases que nunca devem quebrar entre linhas */
.nowrap{white-space:nowrap}

:root {
  /* PALETA KA 2026 */
  --bg-0: #F7F3EA;
  --bg-1: #f8f7f2;
  --bg-2: #f8f7f2;
  --bg-3: #E8E4DB;
  --bg-4: #E0DCD3;
  --bg-5: #D8D4CB;
  /* CORES PRINCIPAIS */
  --blue: #B8CDD8;
  --blue-deep: #3D6B7E;
  --blue-dark: #3D6B7E;
  --blue-darker: #3D6B7E;
  --blue-soft: rgba(61,107,126,.12);
  --blue-pale: #D4E1E8;
  --sage: #D8D3C8;
  --sage-soft: rgba(216,211,200,.2);
  --sage-deep: #C5C0B5;
  --green: #D8D3C8;
  --green-soft: rgba(216,211,200,.2);
  /* CTA — AZUL ESSÊNCIA */
  --cta: #3D6B7E;
  --cta-hover: #2E5566;
  --cta-light: #B8CDD8;
  --cta-soft: rgba(61,107,126,.08);
  --dourado: #B89B6A;
  --dourado-c: #D4C49E;
  --cinza: #8C8A82;
  --preto: #0F1923;
  --orange: #B89B6A;
  --orange-soft: rgba(184,155,106,.2);
  /* TEXT */
  --t-black: #000000;
  --t-900: #0F1923;
  --t-800: #1a1a1a;
  --t-700: #2d2d2d;
  --t-600: #444555;
  --t-500: #6a6a6a;
  --t-400: #8C8A82;
  --t-300: #999999;
  --t-200: #bbbbbb;
  --t-inv: #F4F1EB;
  /* MISC */
  --border: rgba(15,25,35,.06);
  --border-light: rgba(15,25,35,.03);
  --heading: 'Playfair Display', Georgia, serif;
  --body: 'Montserrat', system-ui, sans-serif;
  --max-w: 1200px;
  --ease: .4s cubic-bezier(.16,1,.3,1);
  --ease-slow: .7s cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--body);color:var(--t-700);background:var(--bg-1);background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);background-size:32px 32px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--t-900);text-decoration:none;transition:var(--ease);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
a,a:hover,a:visited,a:focus,a:active,u,ins{text-decoration:none!important}
a:hover{color:var(--cta)}
::selection{background:var(--blue-soft);color:var(--t-900)}

/* TIPOGRAFIA (h1–h4) — bloco canônico mais abaixo na seção "BASE TYPOGRAPHY".
   Aqui ficam labels, parágrafos e utilitários de texto. */

/* CORPO DE TEXTO — baseline padrão (baseado no padrão /sobre)
   5 níveis: .t-hero (1.15) · .t-lead (1.05) · p default (1rem) · .t-sm (.88) · .t-xs (.78)
   Responsivo mobile: cada nível encolhe um toque, ver @media max-width:640px abaixo. */
p {
  font-family: var(--body);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.75;
  color: var(--t-600);
  margin-bottom: 1rem;
}

.t-hero { font-size: 1.15rem; line-height: 1.75; }
.t-lead { font-size: 1.05rem; line-height: 1.75; }
.t-sm   { font-size: .92rem;  line-height: 1.7;  }
.t-xs   { font-size: .85rem;  line-height: 1.65; }

/* LABELS — pílula oval em todo o site (referência: design da Mentoria "A JORNADA")
   Fundo em relevo escuro semitransparente, texto na cor de destaque do ambiente.
   .label     → padrão · .label--sm → variante menor pra etapas micro */
.label {
  display: inline-block;
  padding: .6rem 1.6rem;
  font-family: var(--body);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--cta);
  background-color: rgba(15, 25, 35, .06);
  border-radius: 100px;
  margin-bottom: 1rem;
}
.label--sm {
  font-size: .55rem;
  font-weight: 700;
  letter-spacing: .25em;
  padding: .45rem 1.1rem;
}

/* Em ambientes escuros: pill com fundo branco semitransparente + texto dourado */
.amb-marinho .label,
.amb-preto .label,
.amb-essencia .label,
.section--dark .label {
  color: #D4C49E;
  background-color: rgba(255, 255, 255, .06);
}

/* Cobre: pill com creme semitransparente */
.amb-cobre .label {
  color: #EDE8DD;
  background-color: rgba(255, 255, 255, .1);
}

/* QUOTES — citações em Playfair italic
   .quote          → citação padrão (1.1rem, aspas em bloco)
   .highlight-text → frase de destaque maior (1.3rem italic) */
.quote {
  font-family: var(--heading);
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--t-900);
}
.highlight-text {
  font-family: var(--heading);
  font-size: 1.3rem;
  font-weight: 500;
  color: var(--t-900);
  line-height: 1.5;
  }

/* Espaçamento entre elementos (label→título→linha→parágrafo) — bloco canônico mais abaixo na seção SPACING */
.container{max-width:var(--max-w);margin:0 auto;padding:0 2.5rem}

/* SEÇÕES — padding vertical padronizado (padrão /sobre)
   .section     → 7rem    (seção padrão)
   .section--sm → 3.5rem  (seção compacta · "Empresas que passaram", etc.)
   .section--lg → 9rem    (seção ampla · CTA final, hero interno)
   Responsivo mobile: encolhe pra 4.5rem / 2.5rem / 5.5rem em ≤968px */
.section{padding:7rem 0;position:relative}
.section--sm{padding:3.5rem 0}
.section--lg{padding:9rem 0}
.line{width:48px;height:2px;background:var(--blue-dark);margin:1.5rem 0}
.line--center{margin-left:auto;margin-right:auto}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.text-center{text-align:center}

/* ═══ NAV ═══ */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:#f8f7f2;border-bottom:1px solid var(--border-light);transition:var(--ease)}
.nav.scrolled{box-shadow:0 4px 30px rgba(0,0,0,.03);background:rgba(248,247,242,.97);backdrop-filter:blur(16px)}
.nav__inner{max-width:var(--max-w);margin:0 auto;padding:0 2.5rem;display:flex;justify-content:space-between;align-items:center;height:76px}
.nav__brand{display:flex;align-items:center}
.nav__logo{height:48px;width:auto;object-fit:contain}
.nav__links{display:flex;align-items:center;gap:2rem;list-style:none}
.nav__links a{font-size:.72rem;font-weight:500;color:var(--t-400);letter-spacing:.08em;text-transform:uppercase;position:relative;padding:.25rem 0}
.nav__links a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:1.5px;background:var(--blue-dark);transition:var(--ease)}
.nav__links a:hover,.nav__links a.active{color:var(--t-900)}
.nav__links a:hover::after,.nav__links a.active::after{width:100%}
.nav__cta{background:var(--cta)!important;color:#fff!important;padding:.65rem 2.5rem;border-radius:100px;font-size:.62rem!important;font-weight:600!important;white-space:nowrap;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 4px 15px rgba(61,107,126,.25);display:inline-flex;align-items:center;justify-content:center;gap:.4rem;transition:all .3s ease}
.nav__cta:hover{background:var(--cta-hover)!important;transform:translateY(-2px);box-shadow:0 6px 20px rgba(61,107,126,.4)}
.nav__cta::after{display:none!important}
.nav__toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:0;border:0;padding:6px}
.nav__toggle span{width:22px;height:1.5px;background:var(--t-900);display:block;transition:var(--ease)}

/* ═══ BUTTONS ═══ */
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.2rem;border-radius:100px;font-family:var(--body);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:0;transition:var(--ease);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.btn--cta{background:var(--cta);color:#fff}
.btn--cta:hover{background:var(--cta-hover);color:#fff;transform:translateY(-2px);box-shadow:0 12px 40px rgba(61,107,126,.25)}
.btn--dark{background:var(--t-900);color:var(--t-inv)}
.btn--dark:hover{background:var(--t-800);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.12)}
.btn--outline{background:0;color:var(--t-900);border:1.5px solid rgba(0,0,0,.15)}
.btn--outline:hover{border-color:var(--cta);color:var(--cta);transform:translateY(-2px)}
.btn--whatsapp{background:#25D366;color:#fff}
.btn--whatsapp:hover{background:#1fbc5a;color:#fff;transform:translateY(-2px);box-shadow:0 12px 40px rgba(37,211,102,.2)}
.btn--ghost{background:0;color:var(--cta);border:0;padding:.5rem 0;text-transform:none;letter-spacing:0;font-weight:500}
.btn--ghost:hover{color:var(--cta-hover)}
.btn--ghost::after{content:'→';margin-left:.3rem;transition:var(--ease)}
.btn--ghost:hover::after{margin-left:.6rem}
.btn--lg{padding:1.05rem 2.8rem;font-size:.82rem}
.btn-group{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}

/* ═══ HERO ═══ */
.hero{min-height:100vh;display:flex;align-items:center;padding-top:76px;position:relative;overflow:hidden;background:var(--bg-1)}
.hero__bg{position:absolute;top:0;right:0;width:55%;height:100%;background:linear-gradient(135deg,var(--blue-pale),var(--sage-soft),var(--bg-2));clip-path:polygon(15% 0,100% 0,100% 100%,0 100%);z-index:0}
.hero__content{max-width:560px;position:relative;z-index:2}
.hero__tagline{font-size:.68rem;font-weight:600;letter-spacing:.35em;text-transform:uppercase;color:var(--t-400);margin-bottom:2.5rem;display:flex;align-items:center;gap:1.2rem}
.hero__tagline::before{content:'';width:32px;height:1.5px;background:var(--blue-dark)}
.hero h1{margin-bottom:1.5rem}
.hero h1 em{font-weight:400}
.hero__subtitle{font-size:1.05rem;color:var(--t-500);line-height:1.85;margin-bottom:3rem;max-width:480px;font-weight:300}
.hero__image{position:absolute;right:4%;top:50%;transform:translateY(-50%);width:38%;z-index:1}
.hero__image-placeholder{width:100%;aspect-ratio:3/4;background:linear-gradient(135deg,var(--blue-pale),var(--bg-2));border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--t-300);font-size:.82rem;text-align:center;padding:2rem;box-shadow:0 40px 80px rgba(0,0,0,.06)}

/* ═══ CLIENT LOGOS ═══ */
.logo-bar{display:flex;gap:3rem;justify-content:center;align-items:center;flex-wrap:wrap;padding:1.5rem 0}
.logo-bar__item{height:28px;opacity:.35;filter:grayscale(100%);transition:var(--ease);cursor:default}
.logo-bar__item:hover{opacity:.9;filter:grayscale(0%)}
/* Text fallback for logos */
.logo-bar__text{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t-300);transition:var(--ease);cursor:default;padding:.4rem .8rem;border:1px solid var(--border);border-radius:4px;background:var(--bg-0)}
.logo-bar__text:hover{color:var(--t-black);border-color:var(--t-300);background:var(--bg-1)}

/* ═══ FEATURE STRIP ═══ */
.feature-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;border:0;border-radius:0;overflow:visible;background:transparent}
.feature-strip__item{padding:2rem 1.5rem;text-align:center;border-right:0;transition:var(--ease)}
.feature-strip__item:last-child{border-right:0}
.feature-strip__item:hover{background:var(--blue-soft)}
.feature-strip__number{font-family:var(--heading);font-size:2rem;font-weight:600;color:var(--blue-dark);margin-bottom:.3rem}
.feature-strip__label{font-size:.75rem;color:var(--t-400);font-weight:400}

/* ═══ CARDS ═══ */
.card{background:var(--bg-0);border-radius:12px;padding:2.5rem;border:1px solid var(--border-light);transition:var(--ease);position:relative;overflow:hidden}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(0,0,0,.04)}
.card__accent{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--sage));opacity:0;transition:var(--ease)}
.card:hover .card__accent{opacity:1}
.card__icon{width:52px;height:52px;background:var(--blue-soft);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;font-size:1.3rem;transition:var(--ease)}
.card:hover .card__icon{background:var(--blue)}
.card__title{font-family:var(--heading);font-size:1.2rem;font-weight:600;margin-bottom:.6rem;color:var(--t-900)}
.card__text{font-size:.88rem;color:var(--t-600);line-height:1.7;font-weight:400}

/* ═══ METHOD ═══ */
.method-step{display:flex;gap:2.5rem;align-items:flex-start;padding:2.5rem 0}
.method-step__number{font-family:var(--heading);font-size:3.5rem;font-weight:300;color:var(--blue-deep);line-height:1;min-width:60px}
.method-step__content h3{margin-bottom:.5rem}

/* ═══ PRICING ═══ */
.pricing-card{background:var(--bg-0);border-radius:12px;padding:2.5rem;border:1px solid var(--border-light);transition:var(--ease);position:relative;overflow:hidden}
.pricing-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--sage);transition:var(--ease)}
.pricing-card--featured{border-color:var(--blue-dark);border-width:1.5px}
.pricing-card--featured::before{background:linear-gradient(90deg,var(--blue),var(--blue-dark))}
.pricing-tag{position:absolute;top:16px;right:16px;background:var(--cta);color:#fff;padding:.3rem .8rem;border-radius:100px;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.pricing-card__name{font-size:.66rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--t-400);margin-bottom:.6rem}
.pricing-card__title{font-family:var(--heading);font-size:1.4rem;font-weight:600;color:var(--t-900);margin-bottom:1.2rem}
.pricing-card__price{font-family:var(--heading);font-size:2.2rem;font-weight:600;color:var(--t-black);margin-bottom:1.5rem}
.pricing-card__price small{font-family:var(--body);font-size:.78rem;font-weight:300;color:var(--t-400)}
.pricing-card__features{list-style:none;margin:0 0 2rem}
.pricing-card__features li{padding:.5rem 0;font-size:.8rem;color:var(--t-600);font-weight:400;line-height:1.5;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid var(--border-light)}
.pricing-card__features li:last-child{border-bottom:0}
.pricing-card__features .check{color:var(--blue-dark);font-weight:700}
.pricing-card__features .cross{color:var(--t-200);opacity:.4}

/* ═══ TESTIMONIAL CAROUSEL ═══ */

/* ═══ STATS ═══ */
.stats{display:flex;gap:4rem;flex-wrap:wrap}
.stat__number{font-family:var(--heading);font-size:3rem;font-weight:600;color:var(--blue-dark);line-height:1;margin-bottom:.3rem}
.stat__label{font-size:.78rem;color:var(--t-400);font-weight:400}

/* ═══ BLOG ═══ */
.blog-card{border-radius:12px;overflow:hidden;background:var(--bg-0);border:1px solid var(--border-light);transition:var(--ease)}
.blog-card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(0,0,0,.04)}
.blog-card__image{height:180px;background:linear-gradient(135deg,var(--blue-pale),var(--sage-soft));display:flex;align-items:center;justify-content:center;font-size:2rem}
.blog-card__body{padding:1.5rem 1.8rem}
.blog-card__tag{font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--blue-dark);margin-bottom:.6rem;display:inline-block}
.blog-card__title{font-family:var(--heading);font-size:1.08rem;font-weight:600;margin-bottom:.5rem;color:var(--t-900);line-height:1.4}
.blog-card__excerpt{font-size:.88rem;color:var(--t-600);line-height:1.7;font-weight:400}

/* ═══ QUIZ ═══ */
.quiz-container{max-width:640px;margin:0 auto}
.quiz-progress{height:3px;background:var(--bg-4);border-radius:2px;margin-bottom:3rem;overflow:hidden}
.quiz-progress__bar{height:100%;background:linear-gradient(90deg,var(--blue),var(--blue-dark));border-radius:2px;transition:width .6s var(--ease)}
.quiz-option{display:block;width:100%;text-align:left;padding:1.1rem 1.5rem;margin-bottom:.6rem;border:1px solid var(--border);border-radius:10px;background:var(--bg-0);font-family:var(--body);font-size:.88rem;font-weight:300;color:var(--t-700);cursor:pointer;transition:var(--ease)}
.quiz-option:hover{border-color:var(--blue-deep);background:var(--blue-soft);transform:translateX(4px)}
.quiz-option.selected{border-color:var(--blue-dark);background:var(--cta-soft);font-weight:500;padding-left:1.8rem}

/* ═══ PAGE HEADER ═══ */
.page-header{padding:12rem 0 4.5rem;text-align:center;background:linear-gradient(180deg,var(--bg-1),var(--bg-3))}
.page-header h1{margin-bottom:1rem;text-align:center;width:100%}
.page-header p{font-size:1.05rem;max-width:500px;margin:0 auto;font-weight:300}

/* ═══ IMG PLACEHOLDER ═══ */
.img-placeholder{background:linear-gradient(135deg,var(--blue-pale),var(--bg-2));border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--t-300);font-size:.82rem;text-align:center;padding:2rem}

/* ═══ CTA BANNERS ═══ */
.cta-banner{padding:5rem 0;text-align:center;position:relative;overflow:hidden}
.cta-banner::before{content:'';position:absolute;top:-50%;right:0;width:50%;height:200%;background:radial-gradient(ellipse,rgba(255,255,255,.06) 0%,transparent 60%);pointer-events:none}
.cta-banner--beige{background:var(--bg-3)}
.cta-banner--blue{background:var(--blue)}
.cta-banner--blue h2,.cta-banner--blue p{color:var(--t-900)}
.cta-banner--sage{background:var(--sage)}
.cta-banner--sage h2,.cta-banner--sage p{color:var(--t-900)}
.cta-banner--dark{background:var(--bg-3);color:var(--text)}
.cta-banner--dark h2{color:var(--text)}
.cta-banner--dark p{color:var(--t-600)}

/* ═══ FORM ═══ */
.form-input{width:100%;padding:.9rem 1.3rem;border:1px solid var(--border);border-radius:100px;font-family:var(--body);font-size:.85rem;font-weight:300;background:var(--bg-0);color:var(--t-900);outline:0;transition:var(--ease)}
.form-input:focus{border-color:var(--blue-dark);box-shadow:0 0 0 3px var(--blue-soft)}
.form-input::placeholder{color:var(--t-300)}

/* ═══ FOOTER COMPACTO ═══ */
.footer{background:#1A2733;color:var(--t-inv);padding:2.5rem 0 1.2rem}
.footer__logo{height:48px;width:auto;object-fit:contain;filter:invert(1) brightness(2);margin-bottom:.6rem}
.footer__desc{font-size:.75rem;line-height:1.6;color:rgba(237,232,221,.3);font-weight:300;max-width:250px;margin-top:.2rem}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:1.5rem}
.footer h4{color:rgba(237,232,221,.45);font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.5rem}
.footer__links{list-style:none}
.footer__links li{margin-bottom:.2rem}
.footer__links a{font-size:.75rem;color:rgba(237,232,221,.3);font-weight:300}
.footer__links a:hover{color:var(--blue)}
.footer__bottom{border-top:1px solid rgba(237,232,221,.05);padding-top:1rem;text-align:center;font-size:.65rem;color:rgba(237,232,221,.18);font-weight:300}
.footer__social{display:flex;gap:1.5rem;justify-content:center;margin-top:.5rem}
.footer__social a{color:rgba(237,232,221,.25);font-size:.7rem;text-decoration:none}
.footer__social a:hover{color:var(--blue)}

/* ═══ CTA FINAL — Potência ═══ */
.cta-final{background:var(--preto);padding:6rem 0;position:relative;overflow:hidden}
.cta-final h2{color:var(--bg-1);font-size:2.2rem}
.cta-final p{color:rgba(237,232,221,.6)}
.cta-final .btn--diag{animation:btnPulse 2s ease-in-out infinite}
.hl-gold{color:var(--dourado-c);font-weight:700;font-style:normal}
.hl-light{color:var(--blue,#B8CDD8);font-weight:700;font-style:normal}
.section--dark{background:var(--preto);color:var(--bg-1)}
.section--dark h2{color:var(--bg-1)}
.section--dark p{color:rgba(237,232,221,.7)}
.section--dark .label{color:var(--blue,#B8CDD8)}
.section--dark .line{background:var(--blue,#B8CDD8)}

/* ═══ PROTEÇÃO DE CONTRASTE EM AMBIENTES ESCUROS ═══
   Regra inegociável do SISTEMA-VISUAL-SITE-KA: texto preto sobre fundo
   azul/cobre/preto/marinho é PROIBIDO. Usamos !important de propósito:
   esta é a última linha de defesa contra regressões acidentais.
   Documentado em REGRAS-PROJETO.md na raiz do site. */
.amb-marinho, .amb-preto, .amb-escuro,
.amb-cobre, .amb-essencia, .amb-azul{color:var(--bg-1) !important}
.amb-marinho{background:#152535 !important}
.amb-preto{background:#0F1923 !important}
.amb-escuro{background:#1A2E3D !important}
.amb-cobre{background:#8B5A2B !important}
.amb-essencia{background:#3D6B7E !important}
.amb-marinho h1, .amb-marinho h2, .amb-marinho h3, .amb-marinho h4, .amb-marinho h5, .amb-marinho h6,
.amb-preto h1, .amb-preto h2, .amb-preto h3, .amb-preto h4, .amb-preto h5, .amb-preto h6,
.amb-escuro h1, .amb-escuro h2, .amb-escuro h3, .amb-escuro h4, .amb-escuro h5, .amb-escuro h6,
.amb-cobre h1, .amb-cobre h2, .amb-cobre h3, .amb-cobre h4, .amb-cobre h5, .amb-cobre h6,
.amb-essencia h1, .amb-essencia h2, .amb-essencia h3, .amb-essencia h4, .amb-essencia h5, .amb-essencia h6,
.amb-azul h1, .amb-azul h2, .amb-azul h3, .amb-azul h4, .amb-azul h5, .amb-azul h6{color:var(--bg-1) !important}
.amb-marinho p, .amb-preto p, .amb-escuro p,
.amb-cobre p, .amb-essencia p, .amb-azul p{color:rgba(237,232,221,.78) !important}
.amb-marinho .label, .amb-preto .label, .amb-escuro .label,
.amb-cobre .label, .amb-essencia .label, .amb-azul .label{color:var(--dourado-c,#D4C49E) !important}
.amb-marinho .line, .amb-preto .line, .amb-escuro .line,
.amb-cobre .line, .amb-essencia .line, .amb-azul .line{background:var(--dourado-c,#D4C49E) !important}
.amb-marinho strong, .amb-preto strong, .amb-escuro strong,
.amb-cobre strong, .amb-essencia strong, .amb-azul strong{color:var(--bg-1) !important}
/* Exceções necessárias dentro de ambientes escuros (cards, quote blocks, pills)
   devem usar a própria classe interna para sobrescrever, nunca remover a regra acima. */
.amb-marinho .hl-gold, .amb-preto .hl-gold, .amb-escuro .hl-gold,
.amb-cobre .hl-gold, .amb-essencia .hl-gold, .amb-azul .hl-gold{color:var(--dourado-c,#D4C49E) !important}
.amb-marinho em, .amb-preto em, .amb-escuro em,
.amb-cobre em, .amb-essencia em, .amb-azul em{color:var(--dourado-c,#D4C49E) !important}

.bg-grid-dark{background-image:linear-gradient(rgba(237,232,221,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(237,232,221,.05) 1px,transparent 1px);background-size:32px 32px}
.bg-grid-light{background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);background-size:32px 32px}
@keyframes btnPulse{0%,100%{box-shadow:0 0 0 0 rgba(184,155,106,.5)}50%{box-shadow:0 0 0 14px rgba(184,155,106,0)}}
.btn--pulse{animation:btnPulse 2s ease-in-out infinite}
.btn--diag{background:var(--dourado,#B89B6A);color:#fff;font-weight:700;letter-spacing:.08em;box-shadow:0 8px 30px rgba(184,155,106,.4)}
.btn--diag:hover{background:#a68a5a;transform:translateY(-3px);box-shadow:0 14px 40px rgba(184,155,106,.45);color:#fff}

/* ═══ BOTÕES SOBRE CARDS COLORIDOS (variantes de contexto) ═══ */
/* Uso: card com fundo caramelo/cobre/azul-essência/marinho · botão interno */
.btn--on-caramelo{background:#fff;color:#C47830;font-weight:700}
.btn--on-caramelo:hover{background:#FAF8F4;color:#A55F20;transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,255,255,.2)}

.btn--on-cobre{background:#E0B880;color:#152535;font-weight:700}
.btn--on-cobre:hover{background:#F0CA95;color:#0F1923;transform:translateY(-2px)}

.btn--on-essencia{background:#fff;color:#3D6B7E;font-weight:700}
.btn--on-essencia:hover{background:#FAF8F4;color:#2D5567;transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,255,255,.2)}

.btn--on-marinho{background:#E0B880;color:#152535;font-weight:700}
.btn--on-marinho:hover{background:#F0CA95;color:#0F1923;transform:translateY(-2px)}


/* ═══ ANIMATIONS ═══
   pointer-events:none enquanto invisible evita que elementos com opacity:0
   interceptem cliques de elementos visíveis sobrepostos. */
.animate-on-scroll{opacity:0;transform:translateY(40px);pointer-events:none;transition:opacity var(--ease-slow),transform var(--ease-slow)}
.animate-on-scroll.visible{opacity:1;transform:translateY(0);pointer-events:auto}

/* TOUCH DEVICES: neutraliza :hover pra evitar "primeiro tap ativa hover,
   segundo tap clica" em iOS/Android. Resolve cliques que precisam de 2x. */
@media (hover: none) {
  .btn:hover, .btn--cta:hover, .btn--dark:hover, .btn--outline:hover,
  .btn--whatsapp:hover, .btn--ghost:hover, .nav__links a:hover,
  .nav__cta:hover, .footer__links a:hover, .footer__social a:hover {
    transform: none;
    box-shadow: none;
  }
}
.stagger-1{transition-delay:.1s}.stagger-2{transition-delay:.2s}.stagger-3{transition-delay:.3s}

/* ═══ RESPONSIVE ═══ */
@media(max-width:968px){
  .grid-2{grid-template-columns:1fr;gap:3rem}
  .grid-3{grid-template-columns:1fr;gap:1.5rem}
  .feature-strip{grid-template-columns:1fr 1fr;gap:1rem}
  .feature-strip__item:nth-child(2){border-right:0}
  .feature-strip__item:nth-child(-n+2){border-bottom:0}
  .footer__grid{grid-template-columns:1fr 1fr;gap:1.2rem}
  .section{padding:4.5rem 0}
  .section--sm{padding:2.5rem 0}
  .section--lg{padding:5.5rem 0}
  .nav__inner{height:68px}
  .nav__logo{height:40px}
  .nav__links{display:none}
  .nav__toggle{display:flex}
  .nav__links.open{display:flex;flex-direction:column;position:absolute;top:80px;left:0;right:0;background:var(--bg-1);padding:2rem 2.5rem;gap:1.2rem;border-bottom:1px solid var(--border-light)}
  .hero__bg{display:none}
  .hero__image{display:none}
  .hero__content{max-width:100%}
  .hero{padding-top:80px;background:linear-gradient(180deg,var(--bg-1),var(--bg-3))}
  
  .logo-bar{gap:1.5rem}
  .logo-bar__text{font-size:.6rem;padding:.3rem .5rem}
}
@media(max-width:640px){
  .container{padding:0 1.5rem}
  .nav__inner{height:70px;padding:0 1.5rem}
  .nav__logo{height:36px}
  .footer__grid{grid-template-columns:1fr;gap:1rem;text-align:left}
  .footer__bottom{text-align:center}
  .hero{min-height:auto;padding-top:76px;padding-bottom:4rem}
  .btn-group{flex-direction:column}
  .btn-group .btn{width:100%;justify-content:center}
  .page-header{padding:9rem 0 3rem}
  .feature-strip{grid-template-columns:1fr;gap:.8rem}
  .feature-strip__item{border-right:0;border-bottom:0}
  
  .method-step{flex-direction:column;gap:1rem}
}

/* CLIENT LOGOS GRID — 3 per row, last row 2 */
.logo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;justify-items:center;align-items:center;padding:1rem 0;max-width:700px;margin-left:auto;margin-right:auto}
.logo-grid__item{height:110px;width:auto;max-width:200px;object-fit:contain;opacity:1;border-radius:10px;transition:var(--ease);cursor:default;background:#f1ece6;padding:.6rem}
.logo-grid__item:hover{opacity:1;transform:scale(1.03)}

/* RESPONSIVE: Logo grid */
@media(max-width:968px){
  .logo-grid__item{height:95px;max-width:180px}
  .logo-grid{gap:1rem}
}
@media(max-width:640px){
  .logo-grid__item{height:80px;max-width:160px}
  .logo-grid{gap:.8rem;padding:.5rem 0}
}

/* RESPONSIVE: Carousel arrows always visible */
@media(max-width:968px){
}
@media(max-width:640px){
}

/* RESPONSIVE: Produtos comparison grid */
@media(max-width:968px){
  .produtos-grid{grid-template-columns:1fr !important}
}

/* RESPONSIVE: Case cards */
@media(max-width:968px){
  .case-card,.case-card--reverse{grid-template-columns:1fr !important;direction:ltr !important;gap:2rem !important}
  .case-card--reverse > *{direction:ltr !important}
}

/* RESPONSIVE: Feature strip with blue bg */
@media(max-width:968px){
  .feature-strip{gap:.8rem !important}
}
@media(max-width:640px){
  .feature-strip{gap:.6rem !important}
}

/* RESPONSIVE: Method diagram */
@media(max-width:640px){
  .grid-2 > div[style*="flex-direction:column"]{padding:1rem !important}
}

/* NAV DROPDOWN */
/* Desktop: hover */
.nav__dropdown{position:relative}
.nav__dropdown>a{display:flex;align-items:center;gap:.3rem;cursor:pointer}
.nav__dropdown>a::after{content:'▾';font-size:.55rem;transition:transform .25s ease}
.nav__dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);background:#f8f7f2;border:1px solid rgba(0,0,0,.06);border-radius:10px;padding:.4rem 0;min-width:200px;opacity:0;visibility:hidden;pointer-events:none;transition:all .25s ease;box-shadow:0 12px 40px rgba(0,0,0,.08);z-index:100;margin-top:0}
.nav__dropdown::before{content:'';position:absolute;top:100%;left:0;right:0;height:20px;z-index:99}
.nav__dropdown:hover .nav__dropdown-menu,.nav__dropdown.open .nav__dropdown-menu{opacity:1;visibility:visible;pointer-events:auto}
.nav__dropdown:hover>a::after,.nav__dropdown.open>a::after{transform:rotate(180deg)}
.nav__dropdown-menu a{display:block;padding:.85rem 1.5rem;font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--t-800);white-space:nowrap;border-top:1px solid transparent;border-bottom:1px solid transparent;transition:all .2s ease}
.nav__dropdown-menu a:hover{color:var(--t-900);background:rgba(61,107,126,.05);border-top-color:var(--blue-deep);border-bottom-color:var(--blue-deep)}
/* Mobile/Tablet: always visible */
@media(max-width:968px){
  .nav__dropdown-menu{position:static;transform:none;box-shadow:none;border:0;margin:0;background:transparent;opacity:1;visibility:visible;pointer-events:auto;max-height:none;overflow:visible;padding:.3rem 0 .3rem 1rem}
  .nav__dropdown>a::after{display:none}
}

/* INLINE LOGOS IN TITLES */
.inline-logo{height:1.8em;width:auto;vertical-align:middle;display:inline;margin:0 .1em}
.inline-logo--sm{height:1.4em}
.inline-logo--xs{height:1em}
h1 .inline-logo{height:1.6em}
h2 .inline-logo{height:1.5em}
h3 .inline-logo{height:1.2em}
.label .inline-logo{height:1.2em}

/* COPYRIGHT SYMBOL smaller */

/* ============================
   MOBILE FIXES
   ============================ */

/* Products grid: 1 column on mobile */
@media(max-width:640px){
  /* removed: was breaking quiz/home product grids */
    gap:1.2rem !important;
  }
}
@media(max-width:968px){
  /* removed: was breaking quiz/home product grids */
    gap:1.2rem !important;
  }
}

/* Carousel: full width on mobile, text wraps properly */
@media(max-width:968px){
}

/* Carousel arrows: visible and working on mobile */
@media(max-width:968px){
    width:40px !important;
    height:40px !important;
    font-size:1.2rem !important;
    position:absolute !important;
    display:flex !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:10 !important;
    background:var(--blue) !important;
    border:2px solid var(--blue-dark) !important;
    border-radius:50% !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer !important;
    box-shadow:0 4px 12px rgba(0,0,0,.1) !important;
  }
}

/* Buttons: text centered */
.btn{text-align:center;display:inline-flex;align-items:center;justify-content:center}

/* Plan cards: 1 column mobile */
@media(max-width:968px){
  .plan-card--featured{transform:none !important}
  .plan-card--featured:hover{transform:translateY(-4px) !important}
  
}

/* ============================
   CAROUSEL ARROWS (all sizes)
   ============================ */
  position:absolute;top:50%;transform:translateY(-50%);
  background:var(--blue);border:2px solid var(--blue-dark);
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:1.3rem;color:var(--t-900);
  z-index:10;font-weight:700;
  box-shadow:0 4px 16px rgba(0,0,0,.08);
  transition:all .2s ease;
}
  background:#fff;color:var(--t-900);border-color:var(--t-900);
}

/* ============================
   MOBILE/TABLET FIXES
   ============================ */
@media(max-width:968px){
  /* Products & plans: 1 column */
  
  
  /* Carousel */
  
  /* Testimonials text */
  
  /* Plan card featured: no scale on mobile */
  .plan-card--featured{transform:none !important}
}

@media(max-width:640px){
}

/* Buttons: always centered text */
.btn{text-align:center}

/* Carousel wrapper */
@media(max-width:640px){
}

/* ============================
   MOBILE GRID OVERRIDE (CRITICAL)
   ============================ */
@media(max-width:968px){
  .eco-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:1.2rem !important;
  }
  .eco-grid > div{
    transform:none !important;
  }
  .grid-2{grid-template-columns:1fr !important}
}

/* ============================
   CAROUSEL MOBILE FIX (CRITICAL)
   ============================ */

  text-align:center;
  padding:2rem 1rem;
}
  font-family:var(--heading);
  font-size:1rem;
  line-height:1.7;
  color:var(--t-600);
  margin-bottom:1.5rem;
}
  font-weight:700;
  font-size:.9rem;
}
  font-size:.75rem;
  color:var(--t-400);
}

@media(max-width:640px){
}

/* MOBILE/TABLET COMPREHENSIVE FIXES */
@media(max-width:968px){
  /* Force all inline 3-col grids to 1 column */
  /* Plan cards: remove scale */
  .plan-card--featured{transform:none!important}
  .plan-card--featured:hover{transform:none!important}
  /* Hero grid */
  .hero .grid-2{gap:2rem!important}
  /* Carousel arrows inside container */
  /* Testimonial text */
  /* Method steps */
  .method-step{flex-direction:column;gap:.5rem}
  .method-step__number{font-size:1.5rem}
  /* Feature strip */
  .feature-strip{gap:.8rem!important}
  .feature-strip__item{padding:1rem!important}
  .feature-strip__number{font-size:1.2rem!important}
  .feature-strip__label{font-size:.65rem!important}
  /* Container padding */
  .container{padding:0 1.2rem!important}
  /* Section padding */
  .section{padding:3rem 0!important}
  /* Hero padding */
  .hero{padding:7rem 0 3rem!important}
  /* CTA banner */
  .cta-banner{padding:3rem 0!important}
  /* Button group wrap */
  .btn-group{flex-wrap:wrap;gap:.8rem!important}
  /* Entrega grid already handled */
}

@media(max-width:640px){
  /* Smaller mobile */
  .hero{padding:6rem 0 2.5rem!important}
  .hero .grid-2{gap:1.5rem!important}
  /* Feature strip single column */
  .feature-strip{grid-template-columns:1fr 1fr!important;gap:.6rem!important}
  .feature-strip__item{padding:.8rem!important}
  /* Product cards full width */
  /* Buttons full width */
  .btn--lg{padding:.7rem 2rem!important;font-size:.78rem!important}
  /* Footer grid */
  .footer__grid{grid-template-columns:1fr!important;gap:1.5rem!important}
  /* Page header */
  .page-header{padding:6rem 0 2rem!important}
}

/* CAROUSEL — COMPLETE */

/* TESTIMONIAL CARD */

@media(max-width:968px){
  
  
  
  
  
}
@media(max-width:640px){
  
  
  
  
  
  
}

@media(max-width:640px){
  
}

/* ===================== */
/* CAROUSEL + TESTIMONIALS */
/* ===================== */
.carousel-wrap{position:relative;max-width:750px;margin:0 auto;padding:0 60px}
.carousel-track-container{overflow:hidden;border-radius:12px}
.carousel-track{display:flex;transition:transform .5s ease}
.carousel-slide{width:100%;min-width:100%;flex-shrink:0;box-sizing:border-box;padding:0 4px}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:var(--blue);border:2px solid var(--blue-dark);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;color:var(--t-900);z-index:5;font-weight:700;box-shadow:0 4px 16px rgba(0,0,0,.08);transition:all .2s ease}
.carousel-arrow:hover{background:var(--blue-dark);color:#fff}
.carousel-arrow--left{left:0}
.carousel-arrow--right{right:0}
.carousel-dots{display:flex;gap:.5rem;justify-content:center;margin-top:1.8rem}
.carousel-dot{width:8px;height:8px;border-radius:50%;background:var(--bg-5);border:0;cursor:pointer;transition:all .3s;padding:0}
.carousel-dot.active{background:var(--cta);width:22px;border-radius:4px}
.testimonial-card{background:var(--bg-0);border-radius:12px;border:1px solid var(--border-light);padding:2.2rem 2rem;position:relative}
.testimonial-card::before{content:'"';font-family:var(--heading);font-size:4rem;color:var(--blue);opacity:.15;position:absolute;top:.3rem;left:1.2rem;line-height:1}
.testimonial-card__text{font-family:var(--heading);font-size:.95rem;line-height:1.8;color:var(--t-600);margin-bottom:1.2rem;position:relative;z-index:1}
.testimonial-card__meta{text-align:center;margin-top:.5rem}
.testimonial-card__meta div p{margin:0;padding:0;line-height:1.3}
.testimonial-card__meta div{display:flex;flex-direction:column;align-items:center}
.testimonial-card__avatar{display:none}
.testimonial-card__name{font-weight:600;font-size:.82rem;color:var(--t-900);margin:0;line-height:1.4}
.testimonial-card__role{font-size:.7rem;color:var(--t-400);font-weight:300;margin:0;line-height:1.3}
@media(max-width:968px){
  .carousel-wrap{padding:0 45px}
  .carousel-arrow{width:36px;height:36px;font-size:1rem}
  .testimonial-card{padding:1.8rem 1.5rem;text-align:center}
  .testimonial-card__text{font-size:.88rem;line-height:1.7;text-align:center}
}
@media(max-width:640px){
  .carousel-wrap{padding:0 35px}
  .carousel-arrow{width:30px;height:30px;font-size:.85rem}
  .testimonial-card{padding:1.5rem 1.2rem;text-align:center}
  .testimonial-card__text{font-size:.82rem;line-height:1.6;text-align:center}
}

.testimonial-card__ig{font-size:.65rem;color:var(--cta);font-weight:400;text-decoration:none;display:inline-block;line-height:1.3}
.testimonial-card__ig:hover{color:var(--blue-deep);opacity:.8}

/* MOBILE/TABLET: titles wrap naturally into multiple lines */
@media(max-width:968px){

}
@media(max-width:640px){
}

/* FOOTER LOGO: smaller on mobile/tablet */
@media(max-width:968px){
  .footer__logo{height:32px}
}
@media(max-width:640px){
  .footer__logo{height:26px}
}

.section,.container{overflow:visible;max-width:100vw}

/* MOBILE ONLY: stack product grids (≤640px only, NOT tablet) */
@media(max-width:640px){
  .eco-grid{grid-template-columns:1fr!important;gap:1.2rem!important}
}

/* NAV CTA BUTTON responsive */
@media(max-width:968px){
  .nav__cta{padding:.6rem 2rem!important;font-size:.58rem!important;letter-spacing:.1em!important}
}
@media(max-width:640px){
  .nav__cta{padding:.55rem 1.8rem!important;font-size:.55rem!important}
}

@media(min-width:969px){
  .nav__cta{padding:.7rem 2.8rem!important;font-size:.68rem!important;letter-spacing:.12em!important;box-shadow:0 4px 18px rgba(61,107,126,.3)!important}
}

/* Typography responsive consolidado abaixo em linhas ~860-900 */

/* ========================================
   TYPOGRAPHY SYSTEM — KA | Inteligência para Marcas
   ========================================
   
   HIERARCHY:
   - H1: Título principal de seção (hero, page headers)
   - H2: Título de bloco (seções dentro da página)
   - H3: Subtítulo de componente (cards, steps, features)
   - .label: Categoria/etiqueta acima do título
   - p: Texto de apoio / parágrafo
   - .highlight-text: Frases de destaque
   
   RULES:
   - All titles use text-wrap:balance for equal line distribution
   - Titles should break into 2-3 lines, never 1 word alone
   - Consistent spacing between title → subtitle → text
   ======================================== */

/* BASE TYPOGRAPHY — Hierarquia canônica dos títulos (padrão /sobre)
   Quatro degraus: h1 grande · h2 de seção · h3 de card · h4 de sub-item.
   Responsivo logo abaixo (tablet ≤968px, mobile ≤640px, mobile-xs ≤480px). */
h1, h2, h3, h4 {
  font-family: var(--heading);
  font-weight: 600;
  color: var(--t-900);
  text-wrap: balance;
  word-break: normal;
  overflow-wrap: normal;
}

/* H1 e H2 — Títulos de seção (padrão unificado: 2.2rem como na /sobre) */
h1, .hero h1, .page-header h1 {
  font-size: 2.2rem;
  letter-spacing: -.03em;
  line-height: 1.15;
  margin-bottom: 1rem;
  max-width: 700px;
}

h2 {
  font-size: 2.2rem;
  letter-spacing: -.02em;
  line-height: 1.2;
  margin-bottom: .8rem;
}

/* H3 — Título de card/componente */
h3 {
  font-size: 1.8rem;
  line-height: 1.3;
  margin-bottom: .5rem;
}

/* H4 — Título de sub-item */
h4 {
  font-size: 1.1rem;
  line-height: 1.3;
}

/* SPACING — distância vertical entre elementos consecutivos
   Ordem típica: label → título → linha decorativa → parágrafo → CTA */
.label + h1, .label + h2, .label + h3 { margin-top: .3rem; }
h1 + .line, h2 + .line, h3 + .line { margin-top: .8rem; }
.line + p { margin-top: 1.2rem; }
h1 + p { margin-top: 1rem; }
h2 + p { margin-top: .8rem; }
h3 + p { margin-top: .5rem; }
h4 + p { margin-top: .4rem; }

/* Hero specific */
.hero h1 { margin-bottom: 1.5rem; }
.hero h1 em { font-weight: 400; }

/* CTA banner */
.cta-banner--dark h2 { color: var(--text); }

/* Page header */
.page-header h1 { margin-bottom: 1rem; margin-left: auto; margin-right: auto; text-align: center; }

/* Centered titles have auto margins */
.text-center h1, .text-center h2 { margin-left: auto; margin-right: auto; }

/* ========================================
   EMPHASIS SYSTEM — Global Rule
   
   MODERATE = italic only (.em-important)
   STRONG = bold + blue color (.em-key)
   NEVER combine both on the same term
   ======================================== */

.em-important {
  font-weight: inherit;
  color: inherit;
}

.em-key {
  font-weight: 600;
  color: var(--cta);
  font-style: normal;
}

/* ========================================
   MOBILE TYPOGRAPHY — Bigger titles, balanced breaks
   ======================================== */

/* TABLET (≤968px) — h1/h2 mantêm 2.2rem, h3/h4 encolhem */
@media(max-width:968px) {
  h1, .hero h1, .page-header h1 {
    font-size: 2.2rem !important;
    max-width: 90vw;
    text-wrap: balance;
  }
  h2 { font-size: 2.2rem !important; text-wrap: balance; }
  h3 { font-size: 1.5rem !important; text-wrap: balance; }
  h4 { font-size: 1.05rem !important; }
  .eco-card__name { font-size: 1.85rem !important; }
  p { text-wrap: pretty; }
  /* Perguntas do quiz: proporção controlada com subtexto */
  #question-container h2,
  #context-container h2 { font-size: 1.7rem !important; line-height: 1.3 !important; }
}

/* MOBILE (≤640px) — regra de títulos:
   - Primeira dobra (hero, page-header, quiz) = 2.5rem (destaque)
   - Todos os outros h1/h2 = 1.85rem (padrão de seção) */
@media(max-width:640px) {
  h1, h2 { font-size: 1.85rem !important; max-width: 95vw; }
  h3 { font-size: 1.35rem !important; }
  h4 { font-size: 1rem !important; }
  .eco-card__name { font-size: 1.7rem !important; }
  /* Corpo de texto encolhe um toque no mobile */
  p       { font-size: .95rem; }
  .t-hero { font-size: 1.05rem; }
  .t-lead { font-size: 1rem; }
  .t-sm   { font-size: .88rem; }
  .t-xs   { font-size: .82rem; }
  /* Primeira dobra — hero + page-header */
  .hero h1, .hero h2, .page-header h1 {
    font-size: 2.5rem !important;
    line-height: 1.15 !important;
  }
  /* Perguntas do quiz: compacto e proporcional ao subtexto */
  #question-container h2,
  #context-container h2 {
    font-size: 1.55rem !important;
    line-height: 1.3 !important;
  }
}

/* SMALL MOBILE (≤480px) — h1/h2 mantêm 1.85rem (sem quebrar) */
@media(max-width:480px) {
  h3 { font-size: 1.25rem !important; }
  .eco-card__name { font-size: 1.55rem !important; }
}



/* MOBILE: KA image bigger */
@media(max-width:968px){
  img[alt="Escritório KA"]{min-height:280px!important;width:100%!important;max-height:350px!important;object-fit:cover!important}
}

/* MOBILE: method flow 2x2 */
@media(max-width:640px){
  
  
  
}

/* MOBILE: product name line-height ajustado no ecossistema */
@media(max-width:968px){
  .eco-card__name{line-height:1.2!important}
}

@media(max-width:640px){
  .tech-card__logo{height:55px!important}
  .diag-closing{padding:2.5rem 1.5rem!important}
  .diag-closing h3{font-size:1.3rem!important}
}

/* LOGOS: all versions 3 per row */
.logo-grid--all{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;justify-items:center;align-items:center;max-width:700px;margin-left:auto;margin-right:auto}

/* LOGOS: tablet */
@media(max-width:968px){
  .logo-grid--all{gap:1rem}
  .logo-grid--all .logo-grid__item{height:95px!important;max-width:180px!important}
}

/* LOGOS: mobile */
@media(max-width:640px){
  .logo-grid--all{gap:.8rem}
  .logo-grid--all .logo-grid__item{height:80px!important;max-width:160px!important}
}

/* METHOD FLOW: desktop horizontal */
.method-flow__arrow--v{display:none}

/* METHOD FLOW: mobile 2x2 with arrows */
@media(max-width:640px){
  
  .method-flow__arrow--h{display:block!important;color:var(--t-300);font-size:1rem}
  .method-flow__arrow--v{display:block!important;grid-column:1 / -1;text-align:center;color:var(--t-300);font-size:1rem;padding:.2rem 0}
  
}

/* Diag closing box — h2 segue padrão global (1.85rem no mobile) */
@media(max-width:640px){
  .diag-closing h2{font-size:1.85rem!important}
  .diag-closing p{font-size:1rem!important}
  .tech-card__logo{height:100px!important}
  .tech-card{padding:2rem 1.5rem!important}
}

/* Use green in method section border */



/* Light variant pill */
.eco-card--light .eco-card__tag{background:rgba(61,107,126,.12)!important;color:var(--blue-dark)!important;font-weight:700}

/* Green subtle separator between sections */
.section + .section{border-top:2px solid var(--green-soft)}

@media(max-width:968px){
  .tech-card__logo{height:120px!important}
}

/* Diag closing box: orange bg with dark text */
.diag-closing h2{color:var(--t-900)!important;font-size:2.2rem!important;line-height:1.15!important}
.diag-closing p{color:var(--t-800)!important}

/* FOOTER: two column layout */
@media(min-width:641px){
  .footer__grid{grid-template-columns:1fr 1fr!important;gap:2rem!important}
}
@media(max-width:640px){
  .footer__grid{grid-template-columns:1fr!important;gap:1.5rem!important}
}

/* HIGHLIGHT: light blue background for key phrases */
.hl{color:var(--blue-deep);font-weight:700;font-style:normal;padding:0}

/* METHOD FLOW: always 2x2 grid */
.method-flow{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:2.5rem;max-width:500px;margin-left:auto;margin-right:auto}
.method-flow__step{background:var(--green-soft);border:1px solid rgba(221,221,182,.5);border-radius:100px;padding:.7rem 1.5rem;font-family:var(--heading);font-size:.9rem;font-weight:500;color:var(--t-800);text-align:center;transition:all .3s ease}
.method-flow__step:hover{background:rgba(221,221,182,.5);transform:translateY(-2px)}
.method-flow__step:last-child{background:var(--cta);color:#fff;border-color:var(--cta)}

/* ========================================
   SHARED VISUAL COMPONENTS (from Sobre pattern)
   ======================================== */

/* Step cards with colored left border */
.step-card{border-radius:12px;padding:2rem;border-left:4px solid;display:flex;gap:1.2rem;align-items:flex-start;margin-bottom:1.2rem}
.step-card--blue{background:rgba(61,107,126,.06);border-color:var(--cta)}
.step-card--green{background:rgba(221,221,182,.1);border-color:#ddddb6}
.step-card--orange{background:rgba(230,200,163,.08);border-color:#e6c8a3}
.step-num{font-family:var(--heading);font-size:1.8rem;font-weight:700;line-height:1;flex-shrink:0;color:var(--cta)}
.step-card h4{font-size:1.1rem;font-weight:600;margin-bottom:.5rem}
.step-card p{font-size:.88rem;color:var(--t-600);line-height:1.7}

/* Layer items with colored numbers */
.layers-flow{display:flex;flex-direction:column;gap:0;max-width:420px;margin:2.5rem auto 0}
.layer-item{display:flex;align-items:center;gap:1rem;padding:1.2rem 1.5rem;border-radius:10px;position:relative}
.layer-item:not(:last-child)::after{content:'';position:absolute;left:2.2rem;bottom:-.6rem;width:2px;height:.6rem;background:var(--border-light)}
.layer-num{font-family:var(--heading);font-size:1.1rem;font-weight:700;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}
.layer-text{font-family:var(--heading);font-size:1rem;font-weight:500}

/* Quote/insight box */
.quote-box{border-radius:10px;padding:1.5rem 2rem;font-family:var(--heading);font-size:1rem;line-height:1.5;text-align:center}
.quote-box--green{background:rgba(221,221,182,.2);color:var(--t-800);border:1px solid rgba(221,221,182,.4)}
.quote-box--blue{background:rgba(61,107,126,.1);color:var(--t-800);border:1px solid rgba(61,107,126,.2)}
.quote-box--orange{background:rgba(230,200,163,.12);color:var(--t-800);border:1px solid rgba(230,200,163,.3)}

/* Info cards with colored top border */
.info-card{border-radius:14px;padding:2.2rem 1.8rem;text-align:center;display:flex;flex-direction:column}
.info-card--green{background:rgba(221,221,182,.12);border-top:4px solid #ddddb6}
.info-card--orange{background:rgba(230,200,163,.12);border-top:4px solid #e6c8a3}
.info-card--blue{background:rgba(61,107,126,.08);border-top:4px solid var(--cta)}

/* Section backgrounds with accent colors */
.section--blue-light{background:rgba(61,107,126,.08)}
.section--green-light{background:rgba(221,221,182,.08)}
.section--orange-light{background:rgba(230,200,163,.06)}

/* Colored decorative line */
.line--orange{background:var(--orange)!important}
.line--green{background:#ddddb6!important}

/* MOBILE: all 3-col grids stack vertically */
@media(max-width:768px){
  .eco-products,
  .sobre-eco-grid,
  .tech-grid,
  .pain-grid{
    grid-template-columns:1fr!important;
    gap:1.2rem!important;
    max-width:500px!important;
    margin-left:auto!important;
    margin-right:auto!important
  }
  .info-card,
  .eco-card,
  .sobre-eco-card,
  .tech-card,
  .pain-card{
    width:100%!important
  }
}

/* FOOTER: 3 blocks on desktop, compact on mobile */
.footer__grid-3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2.5rem;margin-bottom:1.5rem}
.footer__contact{color:rgba(237,232,221,.3);font-size:.75rem;font-weight:300}
.footer__contact:hover{color:var(--blue)}

@media(max-width:968px){
  .footer__grid-3{grid-template-columns:1fr 1fr;gap:1.2rem}
  .footer{padding:1.8rem 0 1rem}
}
@media(max-width:640px){
  .footer__grid-3{grid-template-columns:1fr;gap:1rem;text-align:left}
  .footer{padding:1.5rem 0 .8rem}
  .footer__desc{margin:0 0 .5rem;max-width:220px}
  .footer__links{display:flex;flex-direction:column;gap:.3rem}
  .footer__links li{margin:0}
  .footer h4{margin-bottom:.4rem}
}

/* Labels closer to titles */
.label{margin-bottom:.3rem!important}
.label + h1, .label + h2{margin-top:.2rem!important}

/* Tech card logos responsive */
@media(max-width:640px){
  .card img[alt="ChatGPT"],
  .card img[alt="Spotify"],
  .card img[alt="Google Docs"]{height:60px!important}
}

/* Livro tech logos responsive (5x size) */
@media(max-width:640px){
  img[alt="ChatGPT"][style*="400px"],
  img[alt="Spotify"][style*="400px"],
  img[alt="Google Docs"][style*="400px"]{
    height:200px!important
  }
}

/* MOBILE: step-cards no overflow */
@media(max-width:768px){
  .step-card{flex-direction:column!important;gap:.8rem!important;padding:1.5rem!important}
  .step-num{font-size:1.4rem!important}
  .step-card h4{font-size:1.5rem!important}
  .step-card p{font-size:.85rem!important;line-height:1.7}
}

/* Info cards: centered content, bigger titles */
.info-card h3{font-size:1.1rem;text-align:center!important;margin-bottom:1rem!important}
.info-card p{text-align:center!important}

/* Outfit Bold for prices */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@700&display=swap');
.price-outfit{font-family:'Outfit',sans-serif!important;font-weight:700!important}

/* ═══ ECOSSISTEMA — Cards do ecossistema Marca com Essência© ═══
   Usado na home e na página de resultado do diagnóstico.
   Mobile: 1 coluna via regra .eco-products em @media(max-width:768px) acima */
.eco-products{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;max-width:1100px;margin:0 auto}
.eco-card{border-radius:16px;padding:2.5rem 1.8rem;display:flex;flex-direction:column;text-align:center;transition:all .4s ease;position:relative;overflow:hidden}
.eco-card--light{background:rgba(61,107,126,.07);border:1px solid rgba(61,107,126,.15)}
.eco-card--light:hover{border-color:rgba(61,107,126,.4);box-shadow:0 16px 50px rgba(0,0,0,.05);transform:translateY(-4px)}
.eco-card--featured{background:#3D6B7E;border:2px solid #3D6B7E;color:#fff}
.eco-card--featured:hover{box-shadow:0 20px 60px rgba(61,107,126,.2);transform:translateY(-4px)}
/* Livro = Caramelo */
.eco-card--livro .em-key,.eco-card--livro .eco-card__name .hl{color:#fff !important}
.eco-card--livro{background:#C47830;border:2px solid #C47830;color:#fff}
.eco-card--livro:hover{box-shadow:0 20px 60px rgba(196,120,48,.25);transform:translateY(-4px)}
.eco-card--livro .eco-card__tag{background:rgba(255,255,255,.18);color:#fff}
.eco-card--livro .eco-card__name{color:#fff}
.eco-card--livro .eco-card__desc{color:rgba(255,255,255,.88)}
.eco-card--livro .eco-card__feature{color:rgba(255,255,255,.7)}
.eco-card--livro .eco-card__feature::before{background:rgba(255,255,255,.5)}
.eco-card--livro .eco-card__features{border-top-color:rgba(255,255,255,.2)}
.eco-card--livro .btn{background:#fff;color:#C47830;font-weight:700}
/* Programa = Cobre */
.eco-card--programa .eco-card__name,.eco-card--programa .eco-card__name .hl{color:#EDE8DD !important}
.eco-card--direcao .eco-card__name,.eco-card--direcao .eco-card__name .hl{color:#EDE8DD !important}
.eco-card--programa .eco-card__name .hl,.eco-card--direcao .eco-card__name .hl{color:#D4C49E !important}
.eco-card--programa{background:#8B5A2B;border:2px solid #8B5A2B;color:#EDE8DD}
.eco-card--programa:hover{box-shadow:0 20px 60px rgba(139,90,43,.35);transform:translateY(-4px)}
.eco-card--programa .eco-card__tag{background:rgba(237,232,221,.18);color:#EDE8DD}
.eco-card--programa .eco-card__name{color:#EDE8DD}
.eco-card--programa .eco-card__desc{color:rgba(237,232,221,.85)}
.eco-card--programa .eco-card__feature{color:rgba(237,232,221,.65)}
.eco-card--programa .eco-card__feature::before{background:rgba(224,184,128,.6)}
.eco-card--programa .eco-card__features{border-top-color:rgba(237,232,221,.12)}
.eco-card--programa .btn{background:#E0B880;color:#8B5A2B;font-weight:700;border:none}
/* Direção = Azul Marinho + accent dourado */
.eco-card--direcao{background:#1A2E3D;border:2px solid rgba(224,184,128,.25);color:#EDE8DD}
.eco-card--direcao:hover{border-color:rgba(224,184,128,.5);box-shadow:0 20px 60px rgba(21,37,53,.3);transform:translateY(-4px)}
.eco-card--direcao .eco-card__tag{background:rgba(224,184,128,.2);color:#E0B880}
.eco-card--direcao .eco-card__name{color:#EDE8DD}
.eco-card--direcao .eco-card__desc{color:rgba(237,232,221,.85)}
.eco-card--direcao .eco-card__feature{color:rgba(237,232,221,.65)}
.eco-card--direcao .eco-card__feature::before{background:rgba(224,184,128,.6)}
.eco-card--direcao .eco-card__features{border-top-color:rgba(237,232,221,.12)}
.eco-card--direcao .btn{background:#E0B880;color:#152535;font-weight:700;border:none}
.eco-card--featured .btn{background:#fff;color:#3D6B7E;font-weight:700;border:none}
.eco-card--featured .btn:hover{background:#FAF8F4;color:#2D5567;transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,255,255,.2)}
.eco-card__icon{margin:0 auto 1.5rem;width:80px;height:80px}
.eco-card__tag{display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;padding:.4rem 1.1rem;border-radius:100px;margin-bottom:1.1rem;background:rgba(0,0,0,.05);color:var(--t-700)}
.eco-card--light .eco-card__tag{background:rgba(61,107,126,.12);color:#3D6B7E}
.eco-card--featured .eco-card__tag{background:rgba(255,255,255,.18);color:#fff}
.eco-card__name{font-family:var(--heading);font-size:2rem;font-weight:600;line-height:1.2;margin-bottom:.8rem}
.eco-card--featured .eco-card__name{color:#fff}
.eco-card__desc{font-size:.88rem;line-height:1.7;font-weight:400;flex:1}
.eco-card--light .eco-card__desc{color:var(--t-600)}
.eco-card--featured .eco-card__desc{color:rgba(255,255,255,.8)}
.eco-card .btn{margin-top:1.5rem;width:100%;justify-content:center;white-space:nowrap}
.eco-card__features{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(61,107,126,.12)}
.eco-card--featured .eco-card__features{border-top-color:rgba(255,255,255,.15)}
.eco-card__feature{font-size:.8rem;line-height:1.5;font-weight:400;color:var(--t-500);display:flex;align-items:center;gap:.4rem;text-align:left}
.eco-card--featured .eco-card__feature{color:rgba(255,255,255,.6)}
.eco-card__feature::before{content:'';width:4px;height:4px;border-radius:50%;background:#3D6B7E;flex-shrink:0}
.eco-card--featured .eco-card__feature::before{background:rgba(255,255,255,.4)}