
:root{--brand:#6d28d9;--brand2:#5b21b6;--ink:#0b1220;--muted:rgba(11,18,32,.68);--lav:#f5f1ff;--line:rgba(11,92,255,.10);}
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;color:var(--ink);}
body{overflow-x:hidden;background-color:#FDFBF7 !important;background-image:radial-gradient(circle at 10% 20%, rgba(230, 220, 250, 0.8), transparent 40%),radial-gradient(circle at 90% 80%, rgba(250, 235, 215, 0.8), transparent 40%) !important;}
.container{max-width:1200px;margin:0 auto;padding:0 16px}
header{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);border-bottom:1px solid rgba(109,40,217,.10)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:64px;width:auto;border-radius:12px}
.brand .bTxt{display:flex;flex-direction:column;line-height:1.05}
.brand .bTxt b{font-weight:950}
.brand .bTxt span{font-size:12px;color:var(--muted);font-weight:800;margin-top:2px}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:14px;align-items:center}
nav a{text-decoration:none;font-weight:900;color:rgba(11,18,32,.78);padding:10px 10px;border-radius:12px}
nav a:hover{background:rgba(109,40,217,.08)}
.btnTop{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:14px;background:var(--brand);color:#fff;text-decoration:none;font-weight:950;box-shadow:0 18px 55px rgba(109,40,217,.18);border:1px solid rgba(255,255,255,.14)}
.btnTop:hover{background:var(--brand2);transform:translateY(-1px)}
section{padding:42px 0}
.band{background:radial-gradient(520px 240px at 18% 40%, rgba(109,40,217,.12), rgba(255,255,255,0) 62%),radial-gradient(520px 240px at 82% 30%, rgba(11,92,255,.08), rgba(255,255,255,0) 62%),linear-gradient(180deg, rgba(239,232,255,.92), rgba(245,241,255,.45));border-top:1px solid rgba(109,40,217,.10);border-bottom:1px solid rgba(109,40,217,.10)}
.kicker{font-weight:950;color:rgba(11,18,32,.82)}h1{font-size:56px;margin:0;letter-spacing:-.5px}h2{font-size:34px;margin:0 0 10px;letter-spacing:-.5px}
.lead{margin:10px 0 0;font-weight:750;color:rgba(11,18,32,.76);max-width:70ch}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:14px;border:1px solid rgba(11,92,255,.10);background:rgba(255,255,255,.86);font-weight:950;text-decoration:none;box-shadow:0 12px 35px rgba(11,18,32,.06)}
.btn.primary{background:var(--brand);color:#fff;border-color:rgba(255,255,255,.14)}
.btn:hover{transform:translateY(-1px)}
.hero{padding:18px 0 10px}
.heroMain{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;background:linear-gradient(135deg,#6d28d9 0%,#6f2ee6 50%,#6d28d9 100%);border-radius:22px;padding:26px;overflow:hidden;position:relative;box-shadow:0 26px 80px rgba(109,40,217,.24)}
.heroMain::after{content:"";position:absolute;left:18px;bottom:18px;width:220px;height:220px;background:url('./logo.png') center/contain no-repeat;opacity:.13;pointer-events:none;transform:rotate(-8deg)}
.heroLeft{color:#fff}.heroKicker{font-weight:900;font-size:18px;opacity:.92;margin-bottom:14px}
.heroLeft p{margin:12px 0 0;font-weight:750;opacity:.92;max-width:56ch;font-size:16px;line-height:1.5}
.heroBtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.btnHero{display:inline-flex;align-items:center;justify-content:center;border-radius:0;padding:14px 18px;font-weight:950;border:1px solid rgba(255,255,255,.22);background:transparent;color:#fff;text-decoration:none}
.btnHero.primary{background:#fff;color:#6d28d9;border-color:#fff;min-width:220px;box-shadow:0 18px 45px rgba(255,255,255,.18)}
.regionBar{margin-top:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.regionTitle b{display:block;font-weight:950}.regionTitle span{display:block;opacity:.88;font-weight:750;font-size:12px;margin-top:2px}
.regionPills{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pill{appearance:none;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.14);color:#fff;padding:10px 12px;border-radius:999px;font-weight:950;cursor:pointer}
.pill.ghost{background:transparent}.pill.is-active{background:rgba(255,255,255,.24)}
.heroCarousel{width:min(520px,100%);aspect-ratio:16/10;border-radius:18px;background:rgba(255,255,255,.92);overflow:hidden;position:relative;border:4px solid rgba(255,255,255,.28);box-shadow:0 22px 65px rgba(0,0,0,.22)}
.hcTrack{height:100%;position:relative}.hcSlide{position:absolute;inset:0;opacity:0}.hcSlide img{width:100%;height:100%;object-fit:cover;display:block;border-radius:14px}
.heroBottom{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;margin-top:14px;position:relative}
.heroBottom::before{content:"";position:absolute;right:18px;top:14px;width:140px;height:140px;background:url('./logo.png') center/contain no-repeat;opacity:.10;pointer-events:none;transform:rotate(10deg)}
.heroBottom>*{position:relative;z-index:1}
.hbBox{border-radius:18px;overflow:hidden;border:1px solid rgba(11,92,255,.10);background:rgba(255,255,255,.92);box-shadow:0 14px 40px rgba(11,18,32,.06)}
.hbTop{padding:10px 12px;display:flex;justify-content:space-between;gap:10px;align-items:baseline;background:rgba(245,241,255,.72);border-bottom:1px solid rgba(11,92,255,.08)}
.hbTop span{color:var(--muted);font-weight:780;font-size:12px}
.hbFrame{width:100%;height:250px;border:0;display:block;filter:saturate(1.05)}
.revCarousel{position:relative;height:250px}.revTrack{height:100%;position:relative}.revSlide{position:absolute;inset:0;opacity:0}.revSlide img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes fadeCycle{0%{opacity:0}6%{opacity:1}33%{opacity:1}39%{opacity:0}100%{opacity:0}}
.hcSlide,.revSlide{opacity:0;animation:fadeCycle 9s infinite;will-change:opacity}
.hcSlide:nth-child(1),.revSlide:nth-child(1){animation-delay:0s}
.hcSlide:nth-child(2),.revSlide:nth-child(2){animation-delay:3s}
.hcSlide:nth-child(3),.revSlide:nth-child(3){animation-delay:6s}
#heroCarousel:hover .hcSlide,#revCarousel:hover .revSlide{animation-play-state:paused}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:center}
.artPanel{border-radius:22px;border:1px solid rgba(109,40,217,.14);background:linear-gradient(135deg, rgba(255,255,255,.92), rgba(245,241,255,.72));box-shadow:0 28px 80px rgba(109,40,217,.14);overflow:hidden;min-height:320px;position:relative}
.artPanel img{width:100%;height:100%;object-fit:cover;display:block;opacity:.96}
.artInset{position:absolute;left:16px;bottom:16px;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.86);border:1px solid rgba(11,92,255,.10);box-shadow:0 14px 40px rgba(11,18,32,.06);font-weight:950}
.list{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.list li{padding:14px;border-radius:18px;background:rgba(255,255,255,.86);border:1px solid rgba(11,92,255,.10);box-shadow:0 14px 40px rgba(11,18,32,.06);font-weight:900}
.list li span{display:block;margin-top:4px;color:var(--muted);font-weight:780}
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.step{padding:16px;border-radius:22px;background:rgba(255,255,255,.88);border:1px solid rgba(11,92,255,.10);box-shadow:0 16px 45px rgba(11,18,32,.06)}
.step b{font-weight:950}.step p{margin:8px 0 0;color:var(--muted);font-weight:780}
.proofRow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.proof{border-radius:18px;padding:14px;background:rgba(255,255,255,.86);border:1px solid rgba(11,92,255,.10);box-shadow:0 14px 40px rgba(11,18,32,.06)}
.proof span{display:block;margin-top:4px;color:var(--muted);font-weight:780}
.faq{border-radius:22px;background:rgba(255,255,255,.86);border:1px solid rgba(11,92,255,.10);box-shadow:0 16px 45px rgba(11,18,32,.06);padding:6px 14px}
details{padding:10px 0;border-bottom:1px solid rgba(11,92,255,.08)}details:last-child{border-bottom:0}
summary{cursor:pointer;font-weight:950}details p{margin:10px 0 0;color:var(--muted);font-weight:780}
footer{padding:26px 0;border-top:1px solid rgba(109,40,217,.10);background:rgba(255,255,255,.86)}
.waFloater{position:fixed;right:18px;bottom:18px;z-index:999;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:999px;background:rgba(109,40,217,.92);color:#fff;text-decoration:none;font-weight:950;box-shadow:0 22px 70px rgba(109,40,217,.22);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(8px);transition:opacity .2s ease,transform .2s ease}
.waFloater:hover{transform:translateY(-1px);background:rgba(91,33,182,.95)}
.waDot{width:38px;height:38px;border-radius:999px;background:#25D366;display:grid;place-items:center;box-shadow:0 18px 55px rgba(37,211,102,.24);border:1px solid rgba(255,255,255,.18);flex:0 0 auto}
.waFloater small{display:block;font-size:12px;font-weight:800;opacity:.92}
.waFloater b{display:block;line-height:1.05}
.waFloater.is-hidden{opacity:0;transform:translateY(10px);pointer-events:none}
@media (max-width:720px){
  h1{font-size:44px}
  .heroMain{grid-template-columns:1fr;padding:18px}
  .split{grid-template-columns:1fr}
  .timeline{grid-template-columns:1fr}
  .proofRow{grid-template-columns:1fr}
  nav ul{display:none}
  .waFloater{left:12px;right:12px;bottom:12px;border-radius:18px;justify-content:center}
}


/* ===== V16: polish (designer sênior + UX) ===== */
a, button{ transition: transform .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease; }
:focus-visible{ outline: 3px solid rgba(109,40,217,.35); outline-offset: 3px; border-radius: 12px; }
header .btnTop{ padding: 12px 18px; }
nav a{ font-size: 14px; }
nav a.active{ background: rgba(109,40,217,.10); color: var(--ink); }

/* Tipografia mais "premium" */
h1{ line-height: .96; }
h2{ line-height: 1.08; }
.lead{ line-height: 1.55; }

/* Hierarquia de seção: menos “papel”, mais calor */
section{ scroll-margin-top: 90px; }
.sectionTitleRow{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.sectionDivider{
  height: 1px;
  background: linear-gradient(90deg, rgba(109,40,217,.0), rgba(109,40,217,.18), rgba(11,92,255,.10), rgba(109,40,217,.0));
  margin: 18px 0 0;
}

/* Botões mais consistentes */
.btn, .btnHero{
  letter-spacing: .1px;
}
.btn{ padding: 12px 18px; }
.btn.primary{ box-shadow: 0 18px 55px rgba(109,40,217,.18); }
.btn.primary:hover{ box-shadow: 0 22px 70px rgba(109,40,217,.22); }
.btn:hover{ box-shadow: 0 16px 45px rgba(11,18,32,.08); }

/* Cards/listas menos "card overload": mais densidade, menos borda */
.list li{ border-color: rgba(109,40,217,.10); }
.step, .proof, .faq, .hbBox{ border-color: rgba(109,40,217,.10); }

/* Hero: deixa mais vivo, sem over */
.heroMain{ background: radial-gradient(1200px 520px at 15% 30%, rgba(255,255,255,.14), rgba(255,255,255,0) 55%), linear-gradient(135deg,#6d28d9 0%,#6f2ee6 50%,#6d28d9 100%); }
.heroCarousel{ border-color: rgba(255,255,255,.24); }
.heroCarousel::after{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(420px 220px at 35% 25%, rgba(255,255,255,.16), rgba(255,255,255,0) 60%);
  pointer-events:none;
}
.regionBar{ box-shadow: 0 18px 55px rgba(0,0,0,.12); }

/* Animação leve de entrada (apenas desktop e sem reduzir motion) */
@media (prefers-reduced-motion: no-preference){
  .reveal{ opacity:0; transform: translateY(10px); transition: opacity .45s ease, transform .45s ease; }
  .reveal.is-in{ opacity:1; transform: translateY(0); }
}

/* ===== V18: acessibilidade + menu mobile ===== */
.skipLink{
  position:absolute; left: 12px; top: 8px; z-index: 9999;
  background: #fff; color: var(--ink);
  padding: 10px 12px; border-radius: 12px;
  border: 1px solid rgba(109,40,217,.18);
  transform: translateY(-120%);
}
.skipLink:focus{ transform: translateY(0); }

.menuBtn{
  display:none;
  border: 1px solid rgba(109,40,217,.18);
  background: rgba(255,255,255,.86);
  border-radius: 14px;
  padding: 10px 12px;
  font-weight: 950;
  box-shadow: 0 12px 35px rgba(11,18,32,.06);
}
@media (max-width: 720px){
  .menuBtn{ display:inline-flex; align-items:center; justify-content:center; }
  nav ul.navList{ 
    display:none; 
    position:absolute;
    top: 66px; right: 16px; left: 16px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(109,40,217,.16);
    border-radius: 18px;
    padding: 10px;
    box-shadow: 0 26px 80px rgba(11,18,32,.10);
    flex-direction: column;
    gap: 6px;
  }
  nav ul.navList.is-open{ display:flex; }
  nav a{ width:100%; }
}


/* ===== V19: mobile-first polish (sem mexer no desktop) ===== */
.hbMobileCarousel{ width:100%; }
.hbMCTrack{ width:100%; }
.hbMCSlide{ width:100%; }

/* Desktop: mantém lado a lado (não muda o que já estava bom) */
@media (min-width: 721px){
  .hbMobileCarousel .hbMCTrack{
    display:grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 18px;
    transform: none !important;
  }
  .hbMobileCarousel .hbMCSlide{ width:auto; }
  .hbMCDots{ display:none; }
}

/* Mobile: vira carrossel (mapa <-> avaliações) */
@media (max-width: 720px){
  .hero{ padding-bottom: 18px; }
  .heroMain{ padding: 16px; border-radius: 26px; }
  .heroLeft{ gap: 10px; }
  .heroKicker{ font-size: 13px; padding: 8px 10px; border-radius: 999px; display:inline-flex; }
  h1{ font-size: 40px; }
  .heroBtns{ display:grid; grid-template-columns: 1fr; gap: 10px; }
  .btnHero{ width: 100%; justify-content:center; }
  .regionBar{ padding: 12px; }
  .regionPills{ overflow:auto; -webkit-overflow-scrolling: touch; gap: 8px; }
  .regionPills::-webkit-scrollbar{ display:none; }
  .heroCarousel{ border-radius: 22px; }
  .heroCarousel img{ border-radius: 18px; }

  .hbMobileCarousel{ overflow:hidden; position:relative; }
  .hbMobileCarousel .hbMCTrack{
    display:flex;
    gap: 0;
    transition: transform .42s ease;
    will-change: transform;
  }
  .hbMobileCarousel .hbMCSlide{
    min-width: 100%;
    padding: 0;
  }
  .hbMobileCarousel .hbBox{ margin:0; }
  .hbFrame{ height: 280px; }
  .revSlide img{ height: 280px; object-fit: cover; }

  .hbMCDots{
    display:flex;
    justify-content:center;
    gap: 10px;
    padding: 12px 0 2px;
  }
  .hbMCDots .dot{
    width: 10px; height: 10px;
    border-radius: 999px;
    border: 1px solid rgba(109,40,217,.22);
    background: rgba(255,255,255,.7);
  }
  .hbMCDots .dot.is-on{
    background: rgba(109,40,217,.95);
    border-color: rgba(109,40,217,.95);
    width: 26px;
  }

  /* Seções: mais compactas e com sensação de movimento (sem "monte de cards") */
  section{ padding: 26px 0; }
  .container{ padding-left: 14px; padding-right: 14px; }
  .band{ padding: 26px 0; }
  .sectionDivider{ margin-top: 12px; }
}


/* ===== V20: Mobile Hero compacto (sem mexer no desktop) ===== */
@media (max-width: 720px){
  /* Header mais eficiente */
  header{ position: sticky; top:0; z-index: 60; }
  header .brand img{ width: 44px; height: 44px; }
  header .brand .name{ font-size: 15px; line-height: 1.05; }
  header .brand .sub{ font-size: 11px; opacity: .85; }

  /* HERO: transforma em 1 bloco “high performance” */
  .heroWrap{ padding: 10px 12px 0; }
  .heroMain{
    border-radius: 22px;
    padding: 14px;
    box-shadow: 0 26px 85px rgba(11,18,32,.14);
  }
  .heroGrid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: start;
  }

  /* imagem primeiro, texto sobreposto (igual best practices) */
  .heroCarousel{
    order: 0;
    height: 250px !important;
    border-radius: 18px !important;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.22) !important;
    position: relative;
  }
  .heroCarousel img, .heroCarousel video{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.02);
    filter: saturate(1.05);
  }
  .heroCarousel::before{
    content:"";
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.48) 62%, rgba(0,0,0,.62) 100%);
    pointer-events:none;
    z-index: 1;
  }

  .heroCopy{
    order: 1;
    margin-top: -132px; /* sobrepõe no final do banner */
    position: relative;
    z-index: 3;
    padding: 14px 14px 12px;
    border-radius: 18px;
    background: rgba(109,40,217,.72);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.18);
  }

  .heroCopy .kicker{
    display:inline-flex;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 12px;
    margin-bottom: 10px;
  }

  .heroCopy h1{
    font-size: 34px !important;
    letter-spacing: -0.6px;
    margin-bottom: 8px !important;
  }
  .heroCopy .lead{
    font-size: 13.8px;
    line-height: 1.45;
    opacity: .98;
    margin-bottom: 12px !important;
  }

  /* CTAs: 1 primário + 1 secundário discreto */
  .heroActions{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin-top: 10px;
  }
  .heroActions .btnHero, .heroActions .btn{
    width: 100%;
    padding: 14px 14px;
    border-radius: 16px;
    font-weight: 850;
  }
  .heroActions .btnHero.primary{
    box-shadow: 0 18px 60px rgba(0,0,0,.18);
  }
  .heroActions .btnHero.ghost{
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    color: #fff !important;
  }

  /* “Regiões” vira chips horizontais compactos */
  .regionBar{
    margin-top: 10px !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }
  .regionBar .regionPills{
    display:flex !important;
    gap: 8px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .regionBar .regionPills::-webkit-scrollbar{ display:none; }
  .regionBar .pill{
    white-space: nowrap;
    padding: 9px 12px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    border-color: rgba(255,255,255,.18) !important;
    background: rgba(255,255,255,.10) !important;
    color:#fff !important;
  }

  /* Prova/benefícios abaixo do hero: mais densidade */
  .heroBadges{
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }
  .heroBadges .badge{
    white-space: nowrap;
    font-size: 12px !important;
    padding: 9px 12px !important;
    border-radius: 999px !important;
  }

  /* Espaço para o CTA fixo não cobrir conteúdo */
  body{ padding-bottom: 92px; }

  /* WhatsApp floater: vira barra “Home Angels style” no mobile */
  .whatsFloater{
    left: 12px !important;
    right: 12px !important;
    bottom: calc(12px + env(safe-area-inset-bottom));
    width: auto !important;
    border-radius: 18px !important;
    padding: 12px 14px !important;
    display:flex !important;
    gap: 12px !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 22px 75px rgba(0,0,0,.20) !important;
  }
  .whatsFloater .label{ font-size: 14px !important; }
  .whatsFloater .sub{ font-size: 12px !important; opacity: .92; }
}


/* ===== V21: Mobile “ultra pro” abaixo do hero (sem mexer no desktop) ===== */
@media (max-width: 720px){
  /* ritmo: menos “quebra” entre blocos */
  section{ padding: 18px 0 !important; }
  .container{ padding-left: 14px !important; padding-right: 14px !important; }
  .reveal{ transform:none !important; opacity:1 !important; } /* evita “pulos” perceptíveis no mobile */

  /* esconde rótulos “Scroll X” pra ganhar densidade */
  section .container > .kicker{ display:none; }
  section .container.split > div > .kicker{ display:none; } /* quando o kicker está dentro do 2º bloco */

  /* seção split vira “story card” */
  .split{
    gap: 10px !important;
  }
  .split > div{
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(109,40,217,.14);
    border-radius: 22px;
    padding: 14px;
    box-shadow: 0 24px 70px rgba(11,18,32,.08);
  }
  .split > div:first-child{ 
    background: transparent; 
    border: 0; 
    padding: 0; 
    box-shadow:none;
  }

  /* imagens integradas: altura consistente, sem “corte estranho” e sem sobrar branco */
  .artPanel{
    height: 210px !important;
    border-radius: 22px !important;
    overflow:hidden;
    box-shadow: 0 26px 85px rgba(11,18,32,.12);
  }
  .artPanel img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center;
    transform: none !important;
  }
  .artInset{
    bottom: 12px !important;
    left: 12px !important;
    right: auto !important;
    font-size: 12px !important;
    padding: 8px 10px !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.40) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
  }

  /* tipografia mais “mobile-first” */
  h2{ font-size: 24px !important; letter-spacing: -0.3px; }
  .lead{ font-size: 14px !important; line-height: 1.5 !important; }

  /* listas e checklists: mais compactos, mais “tocáveis” */
  .list li{
    padding: 12px 12px !important;
    border-radius: 16px !important;
  }
  .checkList label{
    padding: 12px 12px !important;
    border-radius: 16px !important;
    gap: 10px !important;
  }
  .checkList input{ transform: scale(1.05); }

  /* serviços/etapas: reduz aparência “monte de cards” */
  .tiles{ display:flex !important; flex-direction:column !important; gap: 10px !important; }
  .tile{
    border-radius: 20px !important;
    padding: 14px !important;
    box-shadow: 0 18px 55px rgba(11,18,32,.06) !important;
  }
  .tile .btn{ margin-top: 10px !important; }

  /* separadores: menos “oceano” */
  .divider{ margin: 16px 0 !important; opacity:.35; }

  /* CTA fixo já existe: adiciona respiro nas seções perto do rodapé */
  .whatsFloater{ z-index: 80; }
}

/* ===== V23: vídeo apenas no mobile (vertical) ===== */
.mobileOnly{ display:none; }
.desktopOnly{ display:block; }
@media (max-width: 720px){
  .mobileOnly{ display:block; }
  .desktopOnly{ display:none; }
  .videoPanel{ margin-top: 14px; display:grid; justify-items:center; }
  .videoFrame.portrait{
    width: min(360px, 100%);
    aspect-ratio: 9 / 16;
    border-radius: 22px;
    overflow:hidden;
    position: relative;
    border: 1px solid rgba(255,255,255,.18);
    box-shadow: 0 22px 70px rgba(11,18,32,.16);
    background: rgba(0,0,0,.12);
  }
  .videoFrame.portrait .povVideo{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display:block;
    transform: scale(1.02);
  }
  .videoFrame.portrait::after{
    content:"";
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.40) 68%, rgba(0,0,0,.58) 100%);
    pointer-events:none;
  }
  .videoMute{
    position:absolute; top: 12px; right: 12px;
    z-index: 3;
    width: 44px; height: 44px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 18px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
  .videoCaption{
    position:absolute; left: 12px; right: 12px; bottom: 12px;
    z-index: 3;
    padding: 12px 12px 10px;
    border-radius: 18px;
    background: rgba(109,40,217,.62);
    border: 1px solid rgba(255,255,255,.16);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color:#fff;
  }
  .videoCaption .tag{
    display:inline-flex;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 12px;
    margin-bottom: 8px;
  }
  .videoCaption strong{ display:block; font-size: 16px; line-height: 1.15; margin-bottom: 2px; }
  .videoCaption .captionSub{ display:block; font-size: 12.5px; opacity: .95; }
}


/* ===== V24: Mobile hero mais compacto + vídeo "peek" ===== */
@media (max-width: 720px){
  /* compacta o hero sem mexer no desktop */
  .hero{
    padding-top: 14px !important;
    padding-bottom: 18px !important;
  }
  .hero h1{ font-size: 34px !important; line-height: 1.02 !important; }
  .hero .lead{ font-size: 14px !important; }
  .hero .ctaRow .btn{ padding: 12px 14px !important; border-radius: 14px !important; }
  .hero .ctaRow{ gap: 10px !important; }
  .hero .servicePills{ margin-top: 10px !important; }
  /* vídeo começa a aparecer ainda no 1º scroll */
  .mobilePeekWrap{
    margin-top: -86px; /* deixa ~20% do vídeo "subindo" no final do 1º scroll */
    padding: 0 16px 10px;
  }
  .mobilePeekWrap .videoPanel{ margin-top: 0 !important; }
}

/* ===== Mobile hero video (V25) ===== */
@media (max-width: 860px){
  .hero{padding-top: 10px;}
  .heroMobile{margin: 0 auto 10px; max-width: 520px;}
  .heroMobileVideo{
    position: relative;
    border-radius: 26px;
    overflow: hidden;
    background: radial-gradient(1200px 600px at 20% 0%, rgba(255,255,255,.18), rgba(255,255,255,0) 60%),
                linear-gradient(180deg, rgba(20,10,40,.30), rgba(20,10,40,.50));
    box-shadow: 0 22px 60px rgba(20,10,40,.22);
  }
  .heroMobileVideo video.povVideo{
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    filter: saturate(1.05) contrast(1.02);
  }
  .heroMobileOverlay{
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 14px;
    padding: 14px 14px 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(70,30,150,.10), rgba(70,30,150,.28));
    border: 1px solid rgba(255,255,255,.22);
    backdrop-filter: blur(8px);
  }
  .heroMobileEyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight: 700;
    font-size: 12px;
    opacity: .92;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(0,0,0,.18);
    border: 1px solid rgba(255,255,255,.18);
    margin-bottom: 8px;
  }
  .heroMobileTitle{
    font-size: 22px;
    line-height: 1.12;
    margin: 0 0 10px;
    letter-spacing: -0.4px;
  }
  .heroMobileCta{
    width: 100%;
    display: inline-flex;
    justify-content: center;
    padding: 14px 14px;
    border-radius: 14px;
  }
  .heroMobileTrust{
    margin-top: 10px;
    font-size: 12px;
    opacity: .92;
  }
  /* mute button top-right, subtle */
  .heroMobileVideo .videoMute{
    position: absolute;
    right: 10px;
    top: 10px;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(0,0,0,.22);
    backdrop-filter: blur(6px);
  }
  /* remove desktop hero video card on mobile (avoid duplication) */
  .heroMedia{display:none !important;}

}

/* =====================
   v36.1 Ajustes finais (desktop mockup + mobile header + autoplay)
   ===================== */

.heroInner{padding-top:22px}
.heroGrid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;align-items:start}
.heroCopy .kicker{margin-top:0}
.heroCtas{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 10px}

.heroImageCard{margin-top:14px;border-radius:18px;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.22);box-shadow:0 18px 50px rgba(75,29,118,.22)}
.heroImageCard img{display:block;width:100%;height:auto}
.heroImageCard .badge{position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.92);color:#1c1c1c;border-radius:999px;padding:8px 12px;font-weight:700;font-size:12px}

.heroMedia .videoCard{border-radius:22px;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.22);box-shadow:0 18px 50px rgba(75,29,118,.22);background:#111;display:block;}
.heroMedia .videoCard video{width:100%;height:100%;display:block;object-fit:cover;aspect-ratio:9/16}

.videoCaption{position:absolute;left:14px;right:14px;bottom:14px;background:rgba(88,32,164,.88);color:#fff;border-radius:18px;padding:14px}
.videoCaption .capKicker{opacity:.9;font-size:12px;margin-bottom:4px}
.videoCaption .capTitle{font-weight:900;font-size:18px;line-height:1.1;margin-bottom:4px}
.videoCaption .capSub{opacity:.95;font-size:13px;line-height:1.2}

.videoMute{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:12px;padding:8px 10px;font-size:16px;line-height:1}
.srOnly{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Desktop: o som fica sempre mutado e o botão some */
@media (min-width: 721px){
  .videoMute{display:none}
}

/* Mobile: vídeo vem primeiro; remove CTA do topo (fica só o floater) e melhora header */
@media (max-width: 720px){
  .heroGrid{grid-template-columns:1fr;gap:14px}
  .heroMedia{order:1}
  .heroCopy{order:2}
  .heroCtas{display:none}
  .btnTop{display:none !important}
  .brand img{height:58px !important;width:auto}
  .navLinks{display:none}
  .hamburger{display:inline-flex}
  .videoMute{display:inline-flex}
}

/* =========================
   Desktop-only refinements (mockup) + purple bands
   ========================= */

.desktopOnly{display:block}
@media (max-width: 860px){
  .desktopOnly{display:none}
}

/* Hero compaction + alignment on desktop */
@media (min-width: 861px){
  .hero{padding:26px 0 18px}
  .heroCopy{display:flex;flex-direction:column}
  /* order per mockup: CTA -> image -> region */
  .heroCtas{order:4}
  .heroImageCard{order:5}
  .regionBar{order:6}
  .heroCopy h1{font-size:46px;letter-spacing:-.02em}
  .heroCopy .sub{font-size:15px;max-width:62ch}
  .heroCtas{margin:14px 0 10px}
  .regionBar{margin:8px 0 0}
  .heroImageCard{margin-top:14px}
  .heroImageCard img{height:320px;object-fit:cover}
  /* evita duplicar imagem no lado direito (já existe a imagem no lado esquerdo) */
  .heroMedia .imageCard{display:none}
  .videoCard{height:320px;max-height:none}
  .videoWrap{height:100%}
  .videoWrap video{height:100%;object-fit:cover}
}

/* Bands layout */
.band{padding:34px 0}
.band--purple{background:linear-gradient(180deg,#6d2be3 0%, #4a17c9 100%)}
.bandGrid{display:grid;grid-template-columns:1.05fr 1.35fr;gap:28px;align-items:center}
.bandCopy{color:#fff}
.bandCopy h2{font-size:34px;line-height:1.1;margin:6px 0 10px}
.bandCopy p{opacity:.9;max-width:55ch}
.kicker{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.bandCtaRow{margin-top:14px}
.bandCtaRow .btn{background:#fff;color:#4a17c9;border:1px solid rgba(255,255,255,.4)}
.bandCtaRow .btn:hover{filter:brightness(.98)}

.bandCard{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:22px;padding:14px;box-shadow:0 14px 34px rgba(0,0,0,.18)}
.bandCardInner{background:#fff;border-radius:18px;overflow:hidden}
.bandMapFrame iframe{width:100%;height:320px;border:0;display:block}

/* Reviews carousel */
.reviewsCarousel{position:relative}
.reviewsViewport{overflow:hidden;border-radius:18px}
.reviewsTrack{display:flex;transition:transform .5s ease;will-change:transform}
.reviewSlide{min-width:100%;padding:10px;background:#fff}
.reviewSlide img{width:100%;height:auto;display:block;border-radius:12px}
.reviewsNav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid rgba(0,0,0,.08);background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 20px rgba(0,0,0,.12)}
.reviewsNav:hover{filter:brightness(.98)}
.reviewsNav.prev{left:10px}
.reviewsNav.next{right:10px}
.reviewsDots{display:flex;justify-content:center;gap:8px;margin-top:10px}
.reviewsDot{width:10px;height:10px;border-radius:999px;background:rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.45)}
.reviewsDot.active{background:#fff}

@media (max-width: 1100px){
  .bandGrid{grid-template-columns:1fr;}
  .bandMapFrame iframe{height:280px}
}

/* ensure map iframe fills */
.bandMapFrame{display:block;}
.bandMapFrame{max-width:100%;}

/* hero video portrait desktop */
@media (min-width: 901px){
  .heroMedia{align-self:start;}
  .videoCard{max-height:none;}
}



/* === FIXES (desktop) === */
@media (min-width: 901px){
  /* Hero video: force portrait 9:16 (not square) */
  .heroMedia .videoCard{
    aspect-ratio: 9 / 16;
    width: 100%;
    max-width: 360px;
    height: auto !important;
    justify-self: end;
  }
  .heroMedia .videoCard video{
    width: 100%;
    height: 100%;
  }

  /* Maps band: make map area bigger/thicker */
  .bandMaps .bandMedia{
    align-self: stretch;
  }
  .bandMaps .mediaCard{
    height: 320px;
    border-radius: 18px;
    overflow: hidden;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.18);
  }
  .bandMaps .mapFrame{
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
  }

  /* Reviews band: ensure images fill properly */
  .bandReviews .carViewport{overflow:hidden;border-radius:18px}
  .bandReviews .carTrack{display:flex;gap:12px}
  .bandReviews .carTrack img{max-width: 320px; width: 100%; height: auto; display:block; border-radius:12px}
}


/* === Mobile header + hero tweaks (mobile only) === */
.heroMobile{display:none}
.mobileOnly{display:none}
.desktopOnly{display:block}

@media (max-width: 860px){
  /* Header: purple bar + bigger logo/menu */
  header{background:var(--brand2);border-bottom:1px solid rgba(255,255,255,.14)}
  .brand img{height:52px}
  .brand .bTxt b,.brand .bTxt span{color:#fff}
  .brand .bTxt span{opacity:.92}
  .menuBtn{color:#fff;font-size:30px;line-height:1;width:46px;height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.10)}
  .btnTop{display:none}

  /* Desktop hero hidden; use dedicated mobile hero */
  .heroGrid{display:none}
  .heroMobile{display:block;margin:0 auto 14px;max-width:520px}
  .heroMobileTitle{font-size:22px;font-weight:900;line-height:1.12;margin-top:6px}
  .heroMobileOverlay{color:#fff}

  /* Generic carousel (mobile only) */
  .carViewport{overflow:hidden;border-radius:18px}
  .carTrack{display:flex;transition:transform .45s ease;will-change:transform}
  .carSlide{min-width:100%;width:100%;height:auto;display:block;border-radius:18px}
  .carBtn{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:12px;border:1px solid rgba(0,0,0,.08);background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 20px rgba(0,0,0,.12)}
  .carBtnPrev{left:8px}
  .carBtnNext{right:8px}

  .heroPhotoCarousel{position:relative;margin-top:10px}

  /* Swap review images for mobile screenshots */
  .desktopOnly{display:none}
  .mobileOnly{display:block}
}


/* --- Mobile surgical cut: keep only mobile title + photo carousel in hero; hide desktop hero stack --- */
@media (max-width: 860px){
  .heroGrid{ display:none !important; }
  .heroMobile{ display:block !important; }
}



/* Mobile-only: remove checklist image panel and pull content up */
@media (max-width: 720px){
  #CH-01 .artPanel{display:none !important;}
  #CH-01 .container.split{grid-template-columns:1fr !important;}
}


/* --- v43: price + rating + lead gate --- */

.ratingRow{margin-top:12px}
.ratingBadge{display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border-radius:14px; border:1px solid rgba(11,18,32,.12); background:#fff; box-shadow:0 10px 28px rgba(11,18,32,.06); text-decoration:none}
.ratingBadge .star{font-size:18px}
.ratingBadge b{font-weight:950}
.ratingBadge .muted{color:rgba(11,18,32,.65); font-weight:850}
.ratingBadge .muted2{color:rgba(11,18,32,.55); font-weight:800; margin-left:4px}

.bandPrice{padding:44px 0}
.priceGrid{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; margin-top:14px}
.priceCard{background:#fff; border:1px solid rgba(11,18,32,.10); border-radius:18px; padding:14px; box-shadow:0 10px 28px rgba(11,18,32,.06); display:flex; flex-direction:column; gap:6px}
.priceCard .sub{color:rgba(11,18,32,.65); font-weight:850}
.priceCard .range{margin-top:6px; color:rgba(11,18,32,.75); font-weight:900}
.priceCta{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}

.diffBlock{margin-top:18px; background:rgba(11,18,32,.03); border:1px solid rgba(11,18,32,.08); border-radius:18px; padding:14px}
.diffGrid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px}
.miniList{margin:10px 0 0 18px; padding:0}
.miniList li{margin:6px 0; color:rgba(11,18,32,.78); font-weight:850}
.miniList.ok li{list-style: "✓  "}
.diffCta{margin-top:12px}

@media (max-width: 900px){
  .priceGrid{grid-template-columns:1fr}
  .diffGrid{grid-template-columns:1fr}
}

/* lead gate modal */
.leadGateBackdrop{position:fixed; inset:0; background:rgba(11,18,32,.60); display:none; align-items:center; justify-content:center; padding:18px; z-index:9999}
.leadGate{width:min(520px, 100%); background:#fff; border-radius:22px; padding:16px; box-shadow:0 18px 60px rgba(0,0,0,.35)}
.leadGateTop{display:flex; align-items:flex-start; justify-content:space-between; gap:12px}
.leadGate h3{margin:0; font-size:18px}
.leadGate p{margin:6px 0 0; color:rgba(11,18,32,.68); font-weight:800}
.leadGateClose{border:0; background:rgba(11,18,32,.06); border-radius:12px; padding:8px 10px; cursor:pointer; font-weight:950}
.leadGateForm{margin-top:12px; display:grid; gap:10px}
.leadGateForm input{width:100%; padding:12px 12px; border-radius:14px; border:1px solid rgba(11,18,32,.14); font-weight:850}
.leadGateActions{display:flex; gap:10px; align-items:center; justify-content:flex-end; flex-wrap:wrap; margin-top:8px}


/* --- v44 compact FOFO (mobile-first) --- */
.kicker.noisy{display:none}
@media (min-width: 880px){
  .kicker.noisy{display:block; opacity:.55}
}

/* Price block: compact list (details) */
.bandPrice{padding:40px 0}
.lead.compact{max-width:52ch}
.priceList{display:flex; flex-direction:column; gap:10px; margin-top:14px}
.priceItem{background:#fff; border:1px solid rgba(11,18,32,.10); border-radius:18px; box-shadow:0 10px 28px rgba(11,18,32,.06); overflow:hidden}
.priceItem>summary{list-style:none; cursor:pointer; padding:14px 14px; display:flex; gap:10px; align-items:flex-start; justify-content:space-between}
.priceItem>summary::-webkit-details-marker{display:none}
.priceTitle{font-weight:950}
.priceFrom{color:rgba(11,18,32,.72); font-weight:850; text-align:right}
.priceFrom b{color:var(--ink)}
.priceBody{padding:0 14px 14px; display:flex; flex-wrap:wrap; gap:8px}
.pill{display:inline-flex; padding:6px 10px; border-radius:999px; background:rgba(109,40,217,.08); border:1px solid rgba(109,40,217,.18); font-weight:850; color:rgba(11,18,32,.72); font-size:13px}

/* Desktop: keep it visual and compact */
@media (min-width: 980px){
  .priceList{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
  .priceItem>summary{flex-direction:column; align-items:flex-start}
  .priceFrom{text-align:left}
  .priceBody{padding-top:6px}
}

/* Diff block as details */
.diffBlock{margin-top:16px; background:#fff; border:1px solid rgba(11,18,32,.10); border-radius:18px; box-shadow:0 10px 28px rgba(11,18,32,.06)}
.diffBlock>summary{cursor:pointer; padding:14px 14px; display:flex; justify-content:space-between; align-items:center; gap:10px}
.diffBlock>summary::-webkit-details-marker{display:none}
.diffBlock .muted{color:rgba(11,18,32,.55); font-weight:850}
.diffBlock .diffGrid{padding:0 14px 14px}

/* WhatsApp floater: smaller on mobile + avoid covering content */
@media (max-width: 720px){
  body{padding-bottom:88px}
  .waFloater{left:12px; right:12px; bottom:12px; padding:10px 12px; border-radius:18px}
  .waFloater small{display:none}
}

/* Compact adjustments */
body{ padding-bottom:90px }
.heroCopy p{max-width:48ch}
.sectionCompact{padding:28px 0}
.compactBox{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px}
.compactBox h3{margin:0 0 6px;font-size:18px}
.compactBox p{margin:0 0 8px;font-size:14px;opacity:.85}
.compactCTA{display:inline-flex;padding:12px 14px;border-radius:14px;background:#6d28d9;color:#fff;font-weight:900;text-decoration:none}

/* ===== Compact B: Densa/Performance (ritmo rápido, mais CTA) ===== */
body.compactB main.container{padding-top:8px}
body.compactB .hero{padding:18px 0 10px}
body.compactB .heroInner{padding-top:6px}
body.compactB .heroGrid{gap:14px}
body.compactB .heroCopy h1{margin:6px 0 8px; line-height:1.04; letter-spacing:-.02em}
body.compactB .heroCopy p{margin:0 0 10px; max-width:50ch}
body.compactB .heroCtas{gap:8px; margin-top:8px}
body.compactB .btn{padding:12px 14px}
body.compactB .regionBar{margin-top:10px; padding:10px}
body.compactB section{padding:18px 0}
body.compactB section.band{padding:18px 0}
body.compactB .split{gap:14px}
body.compactB .timeline{gap:10px}
body.compactB .step{padding:12px}
body.compactB .proofRow{gap:8px}
body.compactB .proof{padding:10px}
body.compactB .faq details{padding:10px}
body.compactB .bandGrid{gap:14px}
body.compactB .bandCopy p{margin:6px 0 10px}
body.compactB h2{margin:4px 0 8px}
body.compactB .lead{margin:0 0 8px}
/* Sticky action bar (mobile) */
.stickyAction{display:none}
@media (max-width: 860px){
  body.compactB{padding-bottom:110px}
  .stickyAction{
    display:flex; gap:10px; align-items:center; justify-content:space-between;
    position:sticky; top:64px; z-index:9;
    margin:0 12px 10px; padding:10px 12px;
    border-radius:16px; background:rgba(255,255,255,.92);
    border:1px solid rgba(0,0,0,.06); backdrop-filter:blur(10px);
  }
  .stickyAction .saBtn{
    flex:1; text-align:center; padding:12px 12px;
    border-radius:14px; background:#6d28d9; color:#fff; font-weight:950; text-decoration:none;
  }
  .stickyAction .saLink{white-space:nowrap; font-weight:950; text-decoration:none}
  body.compactB .heroMobileVideo{max-height:62vh}
  body.compactB .waFloater{left:12px; right:12px; bottom:12px}
}


/* ===== Desktop compact hero (search first-impression) ===== */
@media (min-width: 861px){
  .hero{padding:14px 0 8px !important;}
  .heroInner{padding-top:6px !important;}
  .heroGrid{gap:14px !important;}
  .heroCopy .kicker{margin-bottom:6px; opacity:.75}
  .heroCopy h1{font-size:44px; line-height:1.02; margin:6px 0 10px !important; letter-spacing:-.03em}
  .heroCopy p{font-size:16px; line-height:1.35; margin:0 0 10px !important; max-width:52ch}
  .heroCtas{margin-top:8px !important; gap:10px}
  .regionBar{margin-top:10px !important; padding:10px !important;}
  .heroImageCard{display:none !important;} /* remove redundant image on desktop to reduce vertical height */
}



@media (min-width: 861px){
  .miniMapCard{margin-top:10px; border:1px solid rgba(0,0,0,.06); border-radius:16px; overflow:hidden; background:#fff}
  .miniMapCard .mmHead{display:flex; justify-content:space-between; align-items:center; padding:10px 12px; font-weight:950}
  .miniMapCard .mmLink{text-decoration:none; font-weight:950}
  .miniMapCard .mmFrame{width:100%; height:120px; border:0; display:block}
}
@media (max-width: 860px){
  .miniMapCard{display:none}
}



/* ===== Desktop Search Card (desktop-only) ===== */
@media (min-width: 861px){
  .desktopSearchCard{margin-top:12px}
  .desktopSearchCard .dscFrame{
    position:relative; border-radius:18px; overflow:hidden;
    border:1px solid rgba(0,0,0,.06); background:#fff;
    height:400px;
  }
  .desktopSearchCard .dscTrack{
    display:flex; height:100%; width:200%;
    transform:translateX(0%);
    transition:transform .45s ease;
  }
  .desktopSearchCard .dscSlide{
    width:50%; height:100%; object-fit:cover; display:block;
  }
  .desktopSearchCard .dscBanner{
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    pointer-events:none;
  }
  .desktopSearchCard .dscBannerTxt{
    background:rgba(255,255,255,.92);
    border:1px solid rgba(0,0,0,.08);
    border-radius:12px;
    padding:14px 16px;
    font-weight:950;
    text-align:center;
    max-width:80%;
    line-height:1.2;
  }
  .desktopSearchCard .dscNext{
    position:absolute; right:12px; top:50%;
    transform:translateY(-50%);
    width:44px; height:44px; border-radius:12px;
    border:1px solid rgba(0,0,0,.12);
    background:#fff;
    font-size:28px; line-height:1;
    cursor:pointer;
  }
}
@media (max-width: 860px){
  .desktopSearchCard{display:none}
}



/* ================================
   CCA PLANTA BAIXA — SECTION CSS
   Regra: evite estilos globais fora do escopo do bloco.
================================ */

/* ===== H-01 (Header) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== T-01 (Hero) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== S-01 (Orçamento) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== R-01 (Reviews) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== M-01 (Map) ===== */
/* (Sem novos estilos específicos nesta fase) */


/* ===== IG-01 (Instagram Feed) ===== */
#IG-01{padding:26px 0}
#IG-01 .igTitle{font-size:1.35rem;margin:0 0 14px;font-weight:950;letter-spacing:-.02em}
#IG-01 .igGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
#IG-01 .igGrid img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;display:block}
#IG-01 .igCtaLink{display:block;text-decoration:none;margin-top:14px}
#IG-01 .igCtaBtn{
  display:flex;align-items:center;justify-content:center;
  width:100%;min-height:48px;
  border-radius:14px;
  font-weight:950;
  border:1px solid rgba(109,40,217,.22);
  background:linear-gradient(180deg, rgba(109,40,217,.10), rgba(255,255,255,.9));
  color:var(--ink);
  box-shadow:0 16px 40px rgba(11,18,32,.08);
}
#IG-01 .igCtaBtn:active{transform:translateY(1px)}
@media (max-width: 768px){
  #IG-01{padding:18px 0}
  #IG-01 .igGrid{grid-template-columns:repeat(2,1fr);gap:10px}
}


/* ===== CH-01 (Checklist / Quiz) ===== */
#CH-01 .ccaLeadForm{display:grid;gap:10px;margin:14px 0 16px}
#CH-01 .ccaField{display:grid;gap:8px;font-weight:600}
#CH-01 .ccaField > span{font-size:.95rem;color:var(--ink)}
#CH-01 .ccaField input[type="text"]{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(11,18,32,.18);font-size:1rem}
#CH-01 .ccaRadioGroup{display:flex;flex-wrap:wrap;gap:10px}
#CH-01 .ccaRadio{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid rgba(11,18,32,.14);border-radius:999px;cursor:pointer;user-select:none}
#CH-01 .ccaRadio input{transform:scale(1.1)}
#CH-01 .ccaCheck{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid rgba(11,18,32,.10);border-radius:14px;cursor:pointer}
#CH-01 .ccaCheck input{margin-top:3px;transform:scale(1.1)}
#CH-01 .ccaCheck span{font-weight:600}

/* Erros de validação (aplicados somente em CTAs do WhatsApp) */
[data-cca="wa-cta"].shake-error{animation:cca-shake .35s linear 1}
.field-error{border-color:#dc2626 !important; box-shadow:0 0 0 3px rgba(220,38,38,.15)}
@keyframes cca-shake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-6px)}
  40%{transform:translateX(6px)}
  60%{transform:translateX(-4px)}
  80%{transform:translateX(4px)}
}

/* ===== P-01 (Processo) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== S-02 (Shifts) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== F-01 (FAQ) ===== */
/* (Sem novos estilos específicos nesta fase) */

/* ===== B-03 (Floater) ===== */
/* (Sem novos estilos específicos nesta fase) */


/* ============================================
   MOBILE ONLY (<= 768px) — Iteração CRO
   Regra: NÃO alterar desktop (>768px)
============================================ */
@media (max-width: 768px){
  /* ===== H-01 (Header) ===== */
  #H-01{position:sticky;top:0;z-index:50}
  #H-01 .navbar{padding:10px 12px !important;min-height:44px}
  #H-01{background:rgba(255,255,255,.65);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(15,23,42,.08)}
  #H-01 .bTxt{display:none !important}
  #H-01 .btnTop{display:none !important}
  #H-01 .brand img{height:28px;width:auto}
  #H-01 .menuBtn{font-size:22px;line-height:1}

  /* Mobile header fix: alignment + remove logo background/border */
  #H-01 .navbar{
    width:100% !important;
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
  }
  #H-01 .brand{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
  }
  #H-01 .brand img{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    border-radius:0 !important;
  }
  #H-01 .menuBtn{
    margin-left:auto !important;
    padding:10px 12px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  /* Isca acima do T-01 */
  .stickyAction{display:none !important}
  .ccaMobileAvail{
    display:block;
    text-align:center;
    font-size:13px;
    font-weight:700;
    padding:10px 12px;
    margin:0;
    background:rgba(255,255,255,.65);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    border-bottom:1px solid rgba(15,23,42,.08);
  }

  /* Fim da trava anti-curioso (mobile): desabilita efeitos visuais */
  [data-cca="wa-cta"].shake-error{animation:none !important}
  .field-error{box-shadow:none !important}

  /* ===== MO-01 (Modal Quick Lead) ===== */
  .ccaModal[aria-hidden="true"]{display:none}
  .ccaModal[aria-hidden="false"]{
    display:block;
    position:fixed;inset:0;z-index:9999;
  }
  .ccaModalOverlay{
    position:absolute;inset:0;
    background:rgba(0,0,0,.55);
  }
  .ccaModalCard{
    position:relative;
    width:min(92vw,420px);
    margin:10vh auto 0;
    background:#fff;
    border-radius:18px;
    padding:16px 14px 14px;
    box-shadow:0 20px 60px rgba(0,0,0,.35);
  }
  .ccaModalClose{
    position:absolute;top:10px;right:10px;
    width:36px;height:36px;border-radius:10px;
    border:1px solid rgba(15,23,42,.12);
    background:rgba(255,255,255,.9);
    font-size:22px;line-height:1;cursor:pointer;
  }
  .ccaModalCard h3{
    margin:6px 0 12px;
    font-size:18px;
    letter-spacing:-.01em;
  }
  .ccaModalForm{display:grid;gap:10px}
  .ccaModalField{display:grid;gap:6px;font-weight:700}
  .ccaModalField span{font-size:13px;color:rgba(2,6,23,.85)}
  .ccaModalField input{
    width:100%;
    padding:12px 12px;
    border-radius:12px;
    border:1px solid rgba(11,18,32,.18);
    font-size:16px; /* evita zoom iOS */
  }
  .ccaModalMini{
    margin:2px 0 0;
    font-size:12px;
    color:rgba(2,6,23,.65);
    text-align:center;
  }
}

/* Mantém o elemento da isca invisível no desktop */
@media (min-width: 769px){
  .ccaMobileAvail{display:none !important}
}


@media (max-width: 768px){
  body.mo01-open{overflow:hidden}
}

/* MO-01: escondido por padrão (ativado só no mobile via JS) */
.ccaModal{display:none}


/* ===== Polimento Final (Desktop-only + Arquitetura) ===== */
/* Base (não altera Mobile): por padrão, mantém mensagem do banner e esconde botão "Ver serviços" */
#T-01 .dscBannerBtn{display:none;text-decoration:none}
#T-01 .dscBannerMsg{display:block}

/* IG-01: header estilo Instagram só aparece no Desktop */
#IG-01 .igProfileBar{display:none;text-decoration:none;color:inherit}
#IG-01 .igTile{display:block}
#IG-01 .igStats{display:none}

/* Desktop-only: mudanças solicitadas sem tocar no layout mobile aprovado */
@media (min-width: 769px){
  /* FASE 3 — Faxina visual (Hero) */
  #T-01 .dscBannerMsg{display:none !important}
  #T-01 .dscBannerBtn{display:none !important}
/* Oculta o bloco inferior do carrossel (rating + mini mapa + links) somente no Desktop */
  .ratingRow,.regionBar,.miniMapCard{display:none !important}

  /* FASE 4 — Balanceamento CH-01 (Desktop) */
  #CH-01 .ccaLeadForm{gap:8px;margin:12px 0 14px}
  #CH-01 .ccaField{gap:6px}
  #CH-01 .ccaRadioGroup{gap:8px}
  #CH-01 .ccaRadio{padding:8px 10px}
  #CH-01 .ccaCheck{padding:8px 10px}

  /* FASE 5 — Instagram UI fiel (Desktop) */
  #IG-01{padding:28px 0}
  #IG-01 .igTitle, #IG-01 .igCtaLink{display:none !important}
  #IG-01 .igProfileBar{
    display:flex !important;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border:1px solid rgba(11,18,32,.10);
    border-radius:14px;
    background:#fff;
    margin:0 0 14px;
  }
  #IG-01 .igAvatar{
    width:38px;height:38px;border-radius:999px;
    background:#fff;
    border:1px solid rgba(11,18,32,.12);
    flex:0 0 auto;
    display:flex;align-items:center;justify-content:center;
  }
  #IG-01 .igAvatar .igLogo{width:20px;height:20px;fill:currentColor;opacity:.9}
  #IG-01 .igHandle{font-weight:800}
  #IG-01 .igStats{display:flex;gap:10px;font-size:.85rem;opacity:.8;margin-left:0}
  #IG-01 .igStats span{white-space:nowrap}

  #IG-01 .igFollowBtn{
    margin-left:auto;
    padding:8px 12px;
    border-radius:10px;
    background:#0095f6;
    color:#fff;
    font-weight:800;
  }
  #IG-01 .igGrid{grid-template-columns:repeat(4,1fr) !important;gap:2px !important}
  #IG-01 .igGrid img{
    width:100%;
    height:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    border-radius:0 !important;
    transition:filter .15s ease;
    display:block;
  }
  #IG-01 .igTile:hover img{filter:brightness(.7)}
}


/* ===== vFinal: Desktop-only compression & IG tweaks (min-width: 769px) ===== */
@media (min-width: 769px){
  /* T-01: remove desktop carousel nav buttons (autoplay already active). Fixes the 'white square' ghost */
  #T-01 .heroPhotoCarousel .carBtn{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  /* CH-01: compress vertical rhythm to align button baseline with left photo */
  #CH-01 .container.split{align-items:stretch;}
  #CH-01 .artPanel{height:520px !important; min-height:520px !important;}
  #CH-01 h2{margin:0 0 8px !important;}
  #CH-01 .ccaLeadForm{gap:6px !important; margin:10px 0 12px !important;}
  #CH-01 .ccaField{gap:4px !important;}
  #CH-01 .ccaField > span{margin:0 !important; font-size:.92rem !important;}
  #CH-01 .ccaRadioGroup{gap:6px !important;}
  #CH-01 .ccaRadio{padding:6px 10px !important; gap:8px !important;}
  #CH-01 .ccaCheck{padding:6px 10px !important; gap:8px !important; border-radius:12px !important;}
  #CH-01 .ccaChecks{gap:6px !important;}
  #CH-01 .btn.primary{padding:12px 14px !important;}

  /* IG-01: stats line like native app */
  #IG-01 .igStatsText{
    font-size:.86rem;
    color: rgba(11,18,32,.72);
    margin-left:10px;
    white-space:nowrap;
  }
  #IG-01 .igProfileBar{gap:10px;}
}




/* ===== Internal Pages (SEO content) ===== */
.pageHero{padding:26px 0 10px}
.pageHero h1{font-size:clamp(1.6rem,2.2vw,2.2rem);line-height:1.12;margin:8px 0 8px}
.pageSection{padding:14px 0}
.pageGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:12px}
.pageGrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.pageCard{background:rgba(255,255,255,.82);border:1px solid rgba(11,18,32,.10);border-radius:18px;padding:14px 14px;box-shadow:0 18px 50px rgba(11,18,32,.08)}
.pageCard h2,.pageCard h3{margin:0 0 8px}
.list.mini li{padding:10px 12px}
.articles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:12px}
.articleCard{background:rgba(255,255,255,.82);border:1px solid rgba(11,18,32,.10);border-radius:18px;padding:14px;box-shadow:0 18px 50px rgba(11,18,32,.08)}
.articleCard h3{margin:0 0 6px}
.articleCard .muted{margin:0 0 8px;color:rgba(11,18,32,.72);font-size:.95rem}

@media (max-width: 900px){
  .pageGrid,.articles{grid-template-columns:1fr}
}

/* ===== Mobile-only CRO refinements (isolated) ===== */
@media (max-width: 768px){
  /* Move availability pill into header: keep single line */
  #H-01 .navbar{gap:10px}
  #H-01 .ccaMobileAvail{
    display:block !important;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap;
    text-align:center;
    flex:1 1 auto;
    margin:0 !important;
    padding:0 !important;
  }
  #H-01 .brand{flex:0 0 auto}
  #H-01 .menuBtn{flex:0 0 auto;margin-left:auto}

  /* Hero video glued to header */
  .hero{padding-top:0 !important}
  .heroMobile{margin-top:0 !important}
  .heroMobileVideo{margin-top:0 !important}

  /* Price sandwich carousel placement */
  #S-01 .heroPhotoCarousel.priceSandwichCarousel{
    margin:12px 0 14px !important;
    max-width:520px;
  }

  /* IG-01 as true 1-up carousel (one photo per view) */
#IG-01 .igGrid{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  gap:0 !important;
  padding:0 0 6px 0 !important;
}
#IG-01 .igGrid::-webkit-scrollbar{height:0}
#IG-01 .igTile{
  flex:0 0 100% !important;
  scroll-snap-align:start;
  padding:0 14px;
  box-sizing:border-box;
}
#IG-01 .igGrid img{
  width:100% !important;
  height:40vh !important;
  max-height:40vh !important;
  object-fit:cover !important;
  border-radius:12px !important;
  display:block;
}

/* Reviews / cases images fully visible */
  .reviewsCarousel .carSlide{
    object-fit:contain !important;
    background:rgba(255,255,255,.88);
  }
}

/* ===== Desktop-only corrections (isolated) ===== */
@media (min-width: 769px){
  /* 1) Hero carousel: kill floating white box/banner/pseudo */
  .desktopSearchCard .dscBanner,
  .desktopSearchCard .dscBannerTxt,
  .desktopSearchCard .dscBannerMsg,
  .desktopSearchCard .dscBanner::before,
  .desktopSearchCard .dscBanner::after{
    display:none !important;
    opacity:0 !important;
  }

  /* 2) CH-01: undo stretched image + compress form aggressively */
  #CH-01 .container.split{align-items:center !important}
  #CH-01 .artPanel{height:auto !important; min-height:320px !important}
  #CH-01 h2{margin:0 0 6px !important}
  #CH-01 .ccaLeadForm{gap:4px !important; margin:8px 0 10px !important}
  #CH-01 .ccaField{gap:4px !important}
  #CH-01 .ccaField > span{margin:0 !important;font-size:.92rem}
  #CH-01 .ccaRadioGroup{gap:6px !important}
  #CH-01 .ccaRadio{padding:6px 8px !important}
  #CH-01 .ccaCheckGroup{gap:6px !important}
  #CH-01 .ccaCheck{padding:6px 8px !important}
  #CH-01 .btn.primary, #CH-01 .ccaSubmit{margin-top:6px !important}

  /* 3) IG header stats (ensure app-like) */
  #IG-01 .igStatsText{display:inline-block !important; font-size:.88rem; color:rgba(11,18,32,.72)}
}


/* ===== QA PATCH (ISOLAMENTO DE TELAS) ===== */

/* --- DESKTOP ONLY PATCHES --- */
@media (min-width: 769px){
  /* T-01: garantir carrossel totalmente limpo (remove qualquer caixa/overlay de navegação) */
  #T-01 .heroPhotoCarousel .carBtn,
  #T-01 .heroPhotoCarousel .carBtnPrev,
  #T-01 .heroPhotoCarousel .carBtnNext,
  #T-01 .heroPhotoCarousel::before,
  #T-01 .heroPhotoCarousel::after,
  #T-01 .heroPhotoCarousel .carViewport::before,
  #T-01 .heroPhotoCarousel .carViewport::after{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  /* CH-01: compressão vertical obrigatória (sem esticar a foto) */
  #CH-01 .artPanel{height:auto !important; min-height:unset !important;}
  #CH-01 .container.split{align-items:flex-start !important;}

  #CH-01 .ccaLeadForm{gap:8px !important;}
  #CH-01 .ccaField{gap:6px !important;}
  #CH-01 .ccaField > span{margin:0 !important;}
  #CH-01 .ccaRadioGroup{gap:8px !important;}
  #CH-01 .ccaRadio{padding:4px 10px !important;}
  #CH-01 .ccaCheck{padding:4px 10px !important;}
  #CH-01 h2, #CH-01 h3{margin-bottom:6px !important;}
  #CH-01 p{margin-bottom:8px !important;}

  /* IG-01: métricas menores ao lado do handle */
  #IG-01 .igStatsText{
    font-size: .86rem !important;
    color: rgba(11,18,32,.72) !important;
    margin-left: 10px !important;
  }
}

/* --- MOBILE ONLY PATCHES --- */
@media (max-width: 768px){
  /* Espaço zero: fluxo contínuo com margens mínimas entre seções */
  [data-cca-section]:not(#H-01):not(#B-03){
    margin-top:20px !important;
    margin-bottom:20px !important;
  }
  /* Hero colado no header */
  #T-01{margin-top:0 !important; padding-top:0 !important;}
  #T-01 .heroInner{padding-top:0 !important; margin-top:0 !important;}
  #T-01 .heroMobileVideo{margin-top:0 !important;}

  /* Header glassmorphism + selo sem fundo branco */
  #H-01 .navbar{
    background: rgba(253, 251, 247, .55) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
  }
  .ccaMobileAvail{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* IG-01: carrossel real (1 foto por vez, 40vh, scroll-snap + autoplay via app.js) */
  #IG-01 .igGrid{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling: touch;
    gap:0 !important;
  }
  #IG-01 .igTile{
    flex:0 0 100% !important;
    scroll-snap-align:start !important;
  }
  #IG-01 .igTile img{
    width:100% !important;
    height:40vh !important;
    max-height:40vh !important;
    object-fit:cover !important;
    border-radius: 10px !important;
  }

  /* Cases/Reviews: prints 100% inteiros */
  .reviewsCarousel .carSlide{
    object-fit: contain !important;
  }
}


/* === GLOBAL: Warm Minimalism (forced) === */
body{
  background-color:#FDFBF7 !important;
  background-image:
    radial-gradient(circle at 10% 20%, rgba(230, 220, 250, 0.8), transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(250, 235, 215, 0.8), transparent 40%) !important;
}



/* === DESKTOP-ONLY OVERRIDES (min-width: 769px) === */
@media (min-width: 769px){
  /* T-01: kill any carousel overlay/white ghost */
  #T-01 .heroPhotoCarousel .carBtn,
  #T-01 .heroPhotoCarousel .carBtnPrev,
  #T-01 .heroPhotoCarousel .carBtnNext,
  #T-01 .heroPhotoCarousel::before,
  #T-01 .heroPhotoCarousel::after,
  #T-01 .heroPhotoCarousel .carViewport::before,
  #T-01 .heroPhotoCarousel .carViewport::after{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
    content:none !important;
  }

  /* CH-01: do NOT stretch the image panel; compress the right column */
  #CH-01 .artPanel{
    height:auto !important;
    min-height:unset !important;
    align-self:flex-start !important;
  }
  #CH-01 .container.split{
    align-items:flex-start;
  }
  #CH-01 .ccaLeadForm{
    gap:8px !important;
  }
  #CH-01 .ccaField{ margin-bottom:6px !important; }
  #CH-01 .ccaField > span{ margin-bottom:2px !important; }
  #CH-01 .ccaRadioGroup{ gap:6px !important; }
  #CH-01 .ccaRadio{ padding:4px 10px !important; }

  /* Needs list -> horizontal "chips" */
  #CH-01 ul.list{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    padding:0 !important;
    margin:8px 0 0 0 !important;
    list-style:none !important;
  }
  #CH-01 ul.list > li{ margin:0 !important; }
  #CH-01 ul.list > li > label{
    display:flex;
    align-items:center;
    gap:8px;
    padding:4px 10px;
    border:1px solid rgba(60, 44, 90, .25);
    border-radius:999px;
    background:rgba(255,255,255,.7);
    cursor:pointer;
    user-select:none;
    font-size:13px;
    line-height:1.1;
  }
  #CH-01 ul.list > li > label input{ margin:0; }

  /* Remove specific texts/buttons from Desktop interface (keep in HTML for mobile) */
  #S-01 .kicker.keep,
  #S-01 h2,
  #S-01 p.lead.compact,
  #T-01 #ctaHero{
    display:none !important;
  }

  /* IG-01: contain images + limit section height */
  #IG-01{ max-height:60vh; overflow:hidden; }
  #IG-01 .igGrid img{ object-fit:contain !important; background:rgba(255,255,255,.6); }

  /* Regional Atendimento: compact */
  #M-01 .bandMaps{
    max-height:50vh;
    overflow:hidden;
  }
  #M-01 .bandCopy h2{ font-size:20px; }
  #M-01 .bandCopy p{ font-size:14px; }
  #M-01 .band.band--purple{ padding:16px 0; }
}



/* === MOBILE-ONLY OVERRIDES (max-width: 768px) === */
@media (max-width: 768px){
  /* Header: ~30% smaller + stronger glass */
  #H-01{
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
  #H-01 .navbar{
    padding:6px 10px !important;
    min-height:44px;
  }
  #H-01 .brand img{ height:26px; width:auto; }
  #H-01 .ccaMobileAvail{
    font-size:12px !important;
    font-weight:700;
    background:transparent !important;
    padding:0 !important;
    border:0 !important;
    box-shadow:none !important;
    margin:0 !important;
    white-space:nowrap;
  }

  /* Hero video: glue to header */
  #T-01 .heroMobile{ margin-top:0 !important; padding-top:0 !important; }
  #T-01 .heroMobileVideo{ margin-top:0 !important; padding-top:0 !important; }
  #T-01{ padding-top:0 !important; }

  /* Section vertical rhythm: reduce gaps */
  [data-cca-section]:not(#H-01):not(#B-03){
    margin-top:14px !important;
    margin-bottom:14px !important;
  }

  /* Sandwich: carousel injected between title and card (JS). Overlap card */
  #S-01 .heroPhotoCarousel{
    width:100%;
    border-radius:16px;
    overflow:hidden;
    margin:10px 0 0 0 !important;
  }
  #S-01 .heroPhotoCarousel .carViewport{ border-radius:16px; }
  #S-01 .heroPhotoCarousel img{
    width:100%;
    height:40vh;
    max-height:40vh;
    object-fit:cover;
    display:block;
  }
  #S-01 .sectionCompact{
    margin-top:-40px !important;
    position:relative;
    z-index:3;
  }

  /* IG-01: 1 photo per view carousel */
  #IG-01 .igGrid{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch;
    gap:12px !important;
    padding-bottom:8px;
  }
  #IG-01 .igTile{
    flex:0 0 100% !important;
    scroll-snap-align:start !important;
  }
  #IG-01 .igTile img{
    height:40vh !important;
    max-height:40vh !important;
    width:100% !important;
    object-fit:cover !important;
    border-radius:12px;
  }

  /* Cases: ensure full print visibility */
  #R-01 .carSlide,
  .reviewsCarousel .carSlide,
  .casesCarousel .carSlide{
    object-fit:contain !important;
    background:rgba(255,255,255,.8);
  }
}

/* ===== FINAL OVERRIDES (Isolamento de Telas) ===== */
@media (min-width: 769px){
  /* S-01: remover gordura visual no Desktop */
  #S-01 .kicker.keep,
  #S-01 > h2,
  #S-01 > p.lead.compact{display:none !important;}
  #ctaHero{display:none !important;}

  /* S-01: overlap elegante do card "Orçamento rápido" (Desktop) */
  #precos{margin-top:-28px !important;}
  #precos .sectionCompact{margin-top:-56px !important; position:relative; z-index:5;}
  #precos .compactBox{backdrop-filter:saturate(140%) blur(8px);}

  /* CH-01: comprimir formulário (sem esticar a imagem) */
  #CH-01 .artPanel{height:auto !important; min-height:320px !important;}
  #CH-01 .ccaLeadForm{gap:8px !important; margin:10px 0 12px !important;}
  #CH-01 .ccaRadio{padding:4px 10px !important;}
  #CH-01 .ccaRadioGroup{gap:8px !important;}
  #CH-01 .lead{margin:6px 0 8px !important;}

  /* CH-01: transformar checklist (necessidades) em chips horizontais */
  #CH-01 ul.list{display:flex !important; flex-wrap:wrap !important; gap:8px !important; list-style:none !important; padding:0 !important; margin:0 !important;}
  #CH-01 ul.list li{margin:0 !important; padding:0 !important;}
  #CH-01 ul.list label{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    padding:6px 10px !important;
    border:1px solid rgba(11,18,32,.14) !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.66) !important;
    cursor:pointer !important;
    user-select:none !important;
    white-space:nowrap;
  }
  #CH-01 ul.list input{margin:0 !important; transform:scale(1.05) !important;}
}

@media (max-width: 768px){
  /* IG-01: garantir 1 foto por vez (tile 100%) */
  #IG-01 .igTile{flex-basis:100% !important;}
}

/* ================================
   FINAL PATCHES (QA) — ISOLAMENTO DE TELAS
   (mantém tracking: não altera data-cca, ids de campos, .js-check)
================================ */

/* A) Chips Horizontais (Checklist) */
#CH-01 ul.list { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; list-style: none !important; }
#CH-01 ul.list > li { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
#CH-01 ul.list > li > label {
  display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 12px !important;
  border: 1px solid rgba(11,18,32,.14) !important; border-radius: 999px !important; cursor: pointer !important;
  background: rgba(255,255,255,.85) !important; font-weight: 600 !important;
}

/* B) Overlap Elegante (O 'Mordida') */
.sectionCompact { position: relative !important; z-index: 50 !important; }
/* Overlap forte no Desktop para o card "morder" a base do carrossel */
@media (min-width: 769px) {
  .sectionCompact {
    margin-top: clamp(-140px, -10vh, -90px) !important;
  }
}
/* Mobile mantém mordida leve já aprovada */
@media (max-width: 768px) { .sectionCompact { margin-top: -14px !important; } }

/* C) Instagram Mobile (Anti-Grid: 1 por vez via scroll-snap) */
@media (max-width: 768px) {
  #IG-01 .igGrid { display: flex !important; grid-template-columns: unset !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; }
  #IG-01 .igTile { flex: 0 0 100% !important; scroll-snap-align: start !important; }
  #IG-01 .igTile img { height: 40vh !important; width: 100% !important; object-fit: cover !important; }
}

/* MISSÃO 3 — Mobile: header menor + vídeo colado */
@media (max-width: 768px) {
  #H-01 { backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; }
  #H-01 .navbar { padding-top: 6px !important; padding-bottom: 6px !important; min-height: 44px !important; }
  #H-01 .availabilityPill { background: transparent !important; box-shadow: none !important; }
  #T-01 { margin-top: 0 !important; padding-top: 0 !important; }
  #T-01 .heroMedia, #T-01 video, #T-01 .heroVideo { margin-top: 0 !important; }
}

/* Desktop: compactar 'Atendemos na região' e IG-01 */
@media (min-width: 769px) {
  #M-01 { max-height: 50vh !important; overflow: hidden !important; }
  #M-01 .container { padding-top: 18px !important; padding-bottom: 18px !important; }
  #M-01 h2, #M-01 h3 { font-size: 22px !important; }
  #IG-01 { max-height: 60vh !important; overflow: hidden !important; }
  #IG-01 img { object-fit: contain !important; }
}

/* === PATCH: OVERLAP ORÇAMENTO SOBRE O CARROSSEL (FINAL - SUAVE) === */
/* Card branco deve ficar POR CIMA do carrossel (desktop e mobile) com transparência elegante */
.sectionCompact{
  position: relative !important;
  z-index: 99 !important;
  background: transparent !important;
  /* “mordida” forte e responsiva (desktop) */
  margin-top: calc(-1 * clamp(180px, 22vh, 240px)) !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
@media (max-width: 768px){
  .sectionCompact{
    /* “mordida” no mobile conforme mockup */
    margin-top: calc(-1 * clamp(140px, 18vh, 200px)) !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* Caixa interna flutuante (soft glass) */
.sectionCompact .compactBox{
  position: relative !important;
  width: min(760px, 100%) !important;
  margin: 0 auto !important;
  background: rgba(255,255,255,.86) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.65) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.12) !important;
  overflow: hidden !important;
}

/* Gradiente sutil para evitar “transição dura” */
.sectionCompact .compactBox::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.92)) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
.sectionCompact .compactBox > *{
  position: relative !important;
  z-index: 1 !important;
}


/* === PATCH: Overlap ONLY over carousel column (Desktop) === */
@media (min-width: 769px){
  /* Constrain the floating budget card to the left hero column so it never covers the video on the right */
  .sectionCompact .compactBox{
    width: min(680px, calc((100% - 22px) * 0.625)) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}



/* ===== FINAL PATCH: Mobile remove ONLY the requested routine/IG block (per request) ===== */
@media (max-width: 768px) {
  /* Keep S-01 (orçamento/estimativa) intact; remove only the intro line text */
  #S-01 > p.lead.compact { display: none !important; }

  /* Remove the 'Acompanhe a nossa rotina' Instagram routine section on mobile */
  #IG-01 { display: none !important; }
}



/* ===== FIXES (Feb/2026) — densidade, respiros e cortes ===== */

/* 1) Mobile: remover “buraco” após o CTA do 1º scroll (trazer o próximo bloco pra cima) */
@media (max-width: 720px){
  .sectionCompact{padding-bottom:10px !important; margin-bottom:0 !important;}
  /* aproxima o próximo bloco (Checklist) */
  #CH-01{padding-top:6px !important; margin-top:0 !important;}
  #CH-01 .container.split{margin-top:0 !important; padding-top:0 !important;}
  /* reduz respiros gerais do mobile sem esmagar */
  section{padding:12px 0 !important;}
}

/* 2) Desktop: reduzir espaço branco entre fim do 1º scroll e a faixa roxa do mapa */
@media (min-width: 721px){
  #precos{padding-bottom:12px !important; margin-bottom:0 !important;}
  #M-01{padding-top:8px !important; margin-top:0 !important;}
  #M-01 .band{margin-top:0 !important;}
}

/* 3) Desktop: IG-01 — 8 imagens INTEIRAS (sem corte) cabendo em 2 linhas, sem aumentar a área */
@media (min-width: 721px){
  #IG-01 .igGrid{
    grid-template-columns:repeat(4,1fr) !important;
    /* 2 linhas (8 imagens) visíveis, maior, sem estourar a dobra */
    grid-auto-rows: clamp(120px, 14vh, 190px) !important;
    gap:10px !important;
  }
  #IG-01 .igTile{
    display:block;
    overflow:hidden;
    border-radius:12px;
    background: transparent;
  }
  #IG-01 .igTile img{
    width:100% !important;
    height:100% !important;
    max-height:none !important;
    object-fit:contain !important; /* não corta texto */
    display:block;
    background: transparent !important; /* remove “fundo branco” */
  }
}

/* 4) Desktop: Checklist (CH-01) — caixa da direita não pode ficar “tijolo” (alinha na altura da foto) */
@media (min-width: 721px){
  /* mantém bairro + turno (essencial) e remove o bloco de checkboxes no desktop */
  #CH-01 .ccaNeeds{display:none !important;}
  #CH-01 .ccaLeadForm{margin:12px 0 10px !important;}
}
