/* =====================================================================
   Sevem Climatização — LP de Conversão — main.css
   ===================================================================== */

/* ---------- Fontes self-hosted (variable, latin) ---------- */
@font-face{
  font-family:'Oswald';
  font-style:normal;
  font-weight:500 700;
  font-display:swap;
  src:url('../fonts/oswald-latin-500-700.woff2') format('woff2');
}
@font-face{
  font-family:'Sora';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('../fonts/sora-latin-400-700.woff2') format('woff2');
}
/* Fallbacks com métricas ajustadas — reduz CLS no font-swap */
@font-face{
  font-family:'Oswald Fallback';
  src:local("Arial Narrow"),local("Arial");
  size-adjust:94%;
  ascent-override:120%;
  descent-override:29%;
  line-gap-override:0%;
}
@font-face{
  font-family:'Sora Fallback';
  src:local("Arial");
  size-adjust:105%;
  ascent-override:94%;
  descent-override:24%;
  line-gap-override:0%;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body,h1,h2,h3,h4,p,ul,ol,li,figure{margin:0;padding:0}
ul,ol{list-style:none}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:none;color:inherit}
svg{display:block}

/* ---------- Tokens ---------- */
:root{
  --navy:#1E3040;
  --navy-soft:#2A4156;
  --turq:#1AD9D9;
  --teal:#17BFBF;
  --teal-ink:#0E8A8A;
  --aqua:#ACF2F2;
  --bone:#F2F2F2;
  --paper:#FEFEFE;
  --wa:#25D366;
  --wa-press:#1DA851;
  --ink:#1E3040;
  --ink-2:#46586B;
  --on-dark:#F4F8F9;
  --on-dark-2:#B9C6D2;

  --wrap:1180px;
  --radius:14px;
  --radius-sm:10px;

  --ff-head:"Oswald","Oswald Fallback","Arial Narrow",sans-serif;
  --ff-body:"Sora","Sora Fallback",Arial,sans-serif;

  --header-h:160px;
}
@media (max-width:720px){
  :root{ --header-h:128px; }
}

html{scroll-behavior:smooth;overflow-x:hidden}
body{
  font-family:var(--ff-body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3{
  font-family:var(--ff-head);
  text-transform:uppercase;
  line-height:1.15;
  letter-spacing:.01em;
  font-weight:700;
  color:var(--ink);
}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);text-wrap:balance}
h3{font-size:clamp(1.15rem,2vw,1.4rem)}
p{max-width:70ch}
.nb{white-space:nowrap}
.on-dark, .on-dark h2, .on-dark h3{color:var(--on-dark)}

.wrap{max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-left:clamp(20px,4vw,48px);padding-right:clamp(20px,4vw,48px)}

/* ---------- Ícones ---------- */
.ic{width:1em;height:1em;color:currentColor;flex:none}

/* ---------- Botões ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  font-family:var(--ff-body);font-weight:600;line-height:1.2;
  font-size:1rem;padding:.82em 1.4em;
  border-radius:999px;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  white-space:nowrap;
  max-width:100%;
}
.btn .ic{width:20px;height:20px}
@media (max-width:480px){
  .btn{
    font-size:.88rem;padding:.6em 1.05em;gap:.45em;
    white-space:normal;text-align:left;
    max-width:78%;margin-inline:0;
  }
  .btn .ic{width:16px;height:16px}
}
.btn-wa{background:var(--wa);color:#fff;box-shadow:0 6px 18px -6px rgba(37,211,102,.55)}
.btn-wa:hover{background:var(--wa-press);transform:translateY(-2px);box-shadow:0 10px 22px -6px rgba(37,211,102,.65)}
.btn-wa:active{transform:translateY(0)}
.btn-outline-dark{background:var(--navy);color:#fff}
.btn-outline-dark:hover{background:var(--navy-soft);transform:translateY(-2px)}

/* ---------- Reveal on scroll ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.js .reveal.in{opacity:1;transform:translateY(0)}
.js .reveal-stagger > *{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}
.js .reveal-stagger.in > *{opacity:1;transform:translateY(0)}
.js .reveal-stagger.in > *:nth-child(1){transition-delay:.03s}
.js .reveal-stagger.in > *:nth-child(2){transition-delay:.09s}
.js .reveal-stagger.in > *:nth-child(3){transition-delay:.15s}
.js .reveal-stagger.in > *:nth-child(4){transition-delay:.21s}
.js .reveal-stagger.in > *:nth-child(5){transition-delay:.27s}
.js .reveal-stagger.in > *:nth-child(6){transition-delay:.33s}
.js .reveal-stagger.in > *:nth-child(7){transition-delay:.39s}
/* zera o delay de entrada depois que o stagger termina, para não vazar pro hover (ex.: .solution-grid .panel) */
.js .reveal-stagger.in.settled > *{transition-delay:0s}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:var(--paper);
  height:var(--header-h);
  display:flex;align-items:center;
  transition:transform .35s ease,box-shadow .35s ease;
}
.site-header.is-hidden{transform:translateY(-100%)}
.site-header.is-scrolled{box-shadow:0 6px 20px -12px rgba(30,48,64,.28)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;width:100%}
.brand-logo{height:144px;width:auto}
@media (max-width:720px){ .brand-logo{height:112px} }
.header-cta{display:inline-flex}
@media (max-width:860px){ .header-cta{display:none} }

/* ---------- HERO (sem animação) ---------- */
.hero{
  background:var(--paper);
  padding-top:clamp(20px,3vw,40px);
  padding-bottom:clamp(36px,5vw,64px);
  overflow:hidden;
  position:relative;
}
.hero .wrap{
  display:grid;
  grid-template-columns:3fr 4fr;
  gap:clamp(28px,5vw,56px);
  align-items:center;
}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:var(--ff-body);font-weight:700;font-size:.85rem;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--navy);
  margin-bottom:14px;
}
.hero-eyebrow .ic{width:16px;height:16px;color:var(--teal-ink)}
.hero h1{font-size:clamp(1.72rem,3.4vw + .6rem,2.05rem);margin-bottom:16px;text-wrap:balance}
.hero .subhead{font-size:1.1rem;color:var(--ink-2);margin-bottom:14px;max-width:52ch}
.hero .support-text{font-size:1rem;color:var(--ink-2);margin-bottom:26px;max-width:54ch}
.hero .btn-wa{margin-bottom:30px}
.hero-btn-top{display:none}
.hero-highlights{
  display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;
}
.hero-highlights li{
  display:flex;align-items:flex-start;gap:.6em;
  font-size:.9rem;color:var(--navy);font-weight:600;
}
.hero-highlights .ic{width:18px;height:18px;color:var(--teal-ink);margin-top:.15em}

.hero-visual{position:relative;isolation:isolate}
.hero-visual .deco{
  position:absolute;border-radius:32px;z-index:-1;
}
.hero-visual .deco-1{width:78%;height:70%;background:var(--aqua);top:-8%;right:-8%}
.hero-visual .deco-2{width:55%;height:45%;background:var(--turq);opacity:.35;bottom:-6%;left:-6%}
.hero-frame{
  position:relative;border-radius:var(--radius);overflow:hidden;
  aspect-ratio:1300/978;
  box-shadow:0 26px 50px -22px rgba(30,48,64,.35);
}
.hero-frame img{width:100%;height:100%;object-fit:cover}

@media (max-width:900px){
  .hero .wrap{grid-template-columns:minmax(0,1fr)}
  /* Ordem mobile: eyebrow > h1 > subhead > CTA(1) > highlights > foto > texto de apoio > CTA(2) */
  .hero-copy{display:contents}
  .hero-btn-top{display:inline-flex;order:4;margin-bottom:22px}
  .hero-highlights{order:5;margin-bottom:26px}
  .hero-visual{order:6;margin-top:0;margin-bottom:26px}
  .hero .support-text{order:7}
  .hero-btn-bottom{order:8}
}
@media (max-width:480px){
  .hero-highlights{grid-template-columns:1fr}
}

/* ---------- D2 · Identificação (navy) ---------- */
.band-navy{background:var(--navy);color:var(--on-dark)}
.band-navy h2{color:var(--on-dark)}
.id-list{
  display:grid;grid-template-columns:1fr 1fr;gap:18px 40px;
  margin:34px 0 30px;
}
.id-list li{display:flex;align-items:baseline;gap:16px;padding-bottom:14px;border-bottom:1px solid rgba(244,248,249,.14)}
.id-list .num{font-family:var(--ff-head);font-weight:700;font-size:1.5rem;color:var(--turq);flex:none;width:2.2ch}
.id-list .label{font-size:1rem;color:var(--on-dark);font-weight:600}
.id-message{font-size:1.1rem;color:var(--on-dark-2);max-width:64ch;margin-bottom:28px}
@media (max-width:600px){
  .id-list{grid-template-columns:1fr}
}

/* ---------- D3 · Problema ---------- */
.problem{background:var(--bone)}
.problem .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,5vw,56px);align-items:center}
.problem-photos{display:grid;grid-template-columns:1.4fr 1fr;gap:14px;align-items:end}
.problem-photos .frame-main{aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;box-shadow:0 20px 40px -18px rgba(30,48,64,.3)}
.problem-photos .frame-detail{aspect-ratio:3/4;border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 14px 30px -16px rgba(30,48,64,.28)}
.problem-photos img{width:100%;height:100%;object-fit:cover}
.problem h2{margin-bottom:14px}
.problem-text{color:var(--ink-2);margin-bottom:22px}
.problem-list{display:flex;flex-direction:column;gap:10px;margin-bottom:26px}
.problem-list li{
  display:flex;align-items:center;gap:12px;
  background:var(--paper);border-radius:var(--radius-sm);
  padding:.7em 1em;
  font-weight:600;color:var(--navy);font-size:.95rem;
  box-shadow:0 2px 10px -6px rgba(30,48,64,.18);
}
.problem-list .ic{width:20px;height:20px;color:var(--teal-ink)}

@media (max-width:900px){
  .problem .wrap{grid-template-columns:1fr}
  .problem-photos{order:2;margin-top:22px}
}

/* ---------- D4 · Solução (color-blocked) ---------- */
.solution{background:var(--paper)}
.solution-lead{color:var(--ink-2);margin:14px 0 8px;max-width:62ch}
.solution-tag{font-weight:700;color:var(--navy);margin-bottom:22px;display:block}
.solution-grid{
  display:flex;flex-wrap:wrap;justify-content:center;gap:16px;
  margin-bottom:36px;
}
.solution-grid .panel{
  flex:0 0 calc(25% - 12px);
  min-width:220px;
  border-radius:var(--radius);
  padding:26px 22px;
  display:flex;flex-direction:column;gap:14px;
  background:var(--teal);color:var(--ink);
  text-decoration:none;cursor:pointer;
  transition:background-color .22s ease,transform .18s ease,box-shadow .18s ease;
}
.solution-grid .panel .ic-wrap{
  width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:rgba(30,48,64,.14);transition:background-color .22s ease;
}
.solution-grid .panel .ic{width:24px;height:24px}
.solution-grid .panel h3{font-size:1.02rem;text-transform:none;letter-spacing:0;transition:color .22s ease}
.solution-grid .panel:hover,
.solution-grid .panel:focus-visible{
  background:var(--navy);color:var(--on-dark);
  transform:translateY(-3px);
  box-shadow:0 16px 30px -18px rgba(30,48,64,.45);
}
.solution-grid .panel:hover h3,
.solution-grid .panel:focus-visible h3{color:var(--on-dark)}
.solution-grid .panel:hover .ic-wrap,
.solution-grid .panel:focus-visible .ic-wrap{background:rgba(255,255,255,.16)}

@media (max-width:920px){
  .solution-grid .panel{flex:0 0 calc(50% - 8px)}
}
@media (max-width:560px){
  .solution-grid .panel{flex:0 0 100%}
}

.solution-support{
  border-radius:var(--radius);overflow:hidden;
  aspect-ratio:21/8;
  margin-bottom:8px;
  box-shadow:0 16px 32px -18px rgba(30,48,64,.3);
}
.solution-support img{width:100%;height:100%;object-fit:cover}
@media (max-width:720px){
  .solution-support{aspect-ratio:4/3}
}

/* ---------- D5–D8 · Serviços zig-zag ---------- */
.service-band{overflow:hidden;position:relative}
.service-band .wrap{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);align-items:center;
}
.service-visual{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;align-items:end}
.service-visual.single{display:block}
.service-band .service-frame{aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;box-shadow:0 22px 44px -20px rgba(30,48,64,.32)}
.service-band .service-frame img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.service-band .service-frame:hover img{transform:scale(1.03)}
.service-band .service-detail{
  aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;
  box-shadow:0 14px 26px -12px rgba(30,48,64,.32);
}
.service-band .service-detail img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.service-band .service-detail:hover img{transform:scale(1.03)}
@media (max-width:520px){
  .service-visual{grid-template-columns:1fr 1fr}
}

.service-band.flip .service-visual{order:2}
.service-band.flip .service-content{order:1}

.service-icon-big{width:46px;height:46px;color:var(--teal-ink);margin-bottom:12px}
.on-dark .service-icon-big{color:var(--turq)}
.service-content h2{margin-bottom:14px}
.service-content p{color:var(--ink-2);margin-bottom:10px}
.on-dark .service-content p{color:var(--on-dark-2)}

.chip-list{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 26px}
.chip{
  display:inline-flex;align-items:center;gap:.5em;
  padding:.55em 1em;border-radius:999px;
  font-size:.85rem;font-weight:600;
}
.chip-aqua{background:var(--aqua);color:var(--ink)}
.chip-outline{background:transparent;color:var(--turq);border:1.5px solid var(--turq)}

.service-band.bg-bone{background:var(--bone)}
.service-band.bg-paper{background:var(--paper)}
.service-band.bg-aquatint{background:var(--aqua)}
.service-band.bg-aquatint .chip-aqua{background:var(--paper);color:var(--ink)}
.service-band.bg-navy{background:var(--navy);color:var(--on-dark)}
.service-band.bg-navy h2,.service-band.bg-navy .chip-aqua{color:var(--on-dark)}
.service-band.bg-navy .chip-aqua{background:rgba(244,248,249,.12)}

@media (max-width:900px){
  .service-band .wrap{grid-template-columns:minmax(0,1fr)}
  .service-band.flip .service-visual{order:1}
  .service-band.flip .service-content{order:2}
  .service-band .service-visual{order:1;margin-bottom:8px}
  .service-band .service-content{order:2}
}

/* ---------- D9 · Provas / Galeria ---------- */
.proof{background:var(--paper)}
.proof-text{color:var(--ink-2);max-width:64ch;margin:14px 0 30px}
.gallery{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:30px;
}
.gallery figure{border-radius:var(--radius);overflow:hidden;position:relative}
.gallery .tile{aspect-ratio:4/3;overflow:hidden}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.gallery figure:hover img{transform:scale(1.03)}
.gallery figcaption{
  padding:.7em 0 0;font-size:.85rem;color:var(--ink-2);font-weight:600;
}
@media (max-width:720px){
  .gallery{grid-template-columns:1fr}
}

/* ---------- D10 · CTA Final ---------- */
.cta-final{
  background:linear-gradient(135deg,var(--teal),var(--turq));
  position:relative;overflow:hidden;
  text-align:center;
  padding-block:clamp(56px,8vw,96px);
}
.cta-final h2{color:var(--navy);margin-bottom:14px}
.cta-final .subhead{color:var(--navy);opacity:.85;font-weight:600;font-size:1.1rem;max-width:56ch;margin:0 auto 30px}
.cta-final .btn-wa{margin-bottom:26px}
.cta-final .contact-line{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 26px;
  color:var(--navy);font-weight:700;font-size:.95rem;
  width:fit-content;max-width:100%;margin-inline:auto;
}
.cta-final .contact-line a{display:inline-flex;align-items:center;gap:.5em;color:var(--navy);text-decoration:none}
.cta-final .contact-line a:hover{text-decoration:underline}
.cta-final .contact-line .divider{width:1px;height:20px;background:rgba(30,48,64,.3);flex:none}
.cta-final .contact-line .ic{width:18px;height:18px}
.cta-map{
  position:relative;max-width:620px;margin:32px auto 0;
  aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;
  box-shadow:0 22px 44px -22px rgba(30,48,64,.4);
  background:var(--paper);
}
.cta-map iframe{width:100%;height:100%;border:0;display:block;pointer-events:none}
.cta-map-overlay{position:absolute;inset:0}
.cta-final .deco-snow{
  position:absolute;width:280px;height:280px;color:var(--navy);opacity:.1;
  bottom:-60px;left:-40px;pointer-events:none;
}

/* ---------- Política de Privacidade ---------- */
.privacy-band{background:var(--bone)}
.privacy-band .wrap{padding-block:34px}
.privacy-band details{
  background:var(--paper);border-radius:var(--radius);padding:20px 24px;
  box-shadow:0 4px 18px -12px rgba(30,48,64,.25);
}
.privacy-band summary{
  cursor:pointer;font-family:var(--ff-head);font-weight:600;text-transform:uppercase;
  font-size:1rem;color:var(--navy);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  list-style:none;
}
.privacy-band summary::-webkit-details-marker{display:none}
.privacy-band summary .ic{width:20px;height:20px;transition:transform .25s ease;color:var(--teal-ink)}
.privacy-band details[open] summary .ic{transform:rotate(180deg)}
.privacy-band .privacy-content{margin-top:16px;color:var(--ink-2);font-size:.92rem}
.privacy-band .privacy-content p{margin-bottom:10px;max-width:none}
.privacy-band .privacy-content strong{color:var(--navy)}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy);color:var(--on-dark-2)}
.site-footer .wrap{padding-block:30px;text-align:center;display:flex;flex-direction:column;gap:8px}
@media (max-width:600px){
  .site-footer .wrap{padding-bottom:96px}
}
.site-footer .line1{color:var(--on-dark);font-weight:600}
.site-footer .credit a{color:var(--on-dark);text-decoration:underline;text-underline-offset:3px}
.site-footer .credit a:hover{color:var(--turq)}

/* ---------- Floating WhatsApp ---------- */
.fab-wa{
  position:fixed;right:18px;bottom:18px;z-index:80;
  width:56px;height:56px;border-radius:50%;
  background:var(--wa);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 24px -8px rgba(37,211,102,.6);
  animation:wa-pulse 2.6s ease-in-out infinite;
  transition:right .3s ease,bottom .3s ease;
}
.fab-wa .ic{width:26px;height:26px}
.fab-wa:hover{filter:brightness(1.05)}
@keyframes wa-pulse{
  0%,100%{box-shadow:0 10px 24px -8px rgba(37,211,102,.6),0 0 0 0 rgba(37,211,102,.5)}
  50%{box-shadow:0 10px 24px -8px rgba(37,211,102,.6),0 0 0 12px rgba(37,211,102,0)}
}
body.cookie-visible .fab-wa{bottom:92px}
@media (max-width:600px){
  body.cookie-visible .fab-wa{bottom:126px}
}

/* ---------- Cookie banner ---------- */
.cookie-banner{
  position:fixed;left:50%;bottom:16px;transform:translateX(-50%);
  width:calc(100% - 24px);max-width:560px;z-index:90;
  background:var(--navy);color:var(--on-dark);
  border-radius:var(--radius);
  padding:16px 18px;
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:space-between;
  box-shadow:0 16px 40px -14px rgba(0,0,0,.4);
  transition:opacity .3s ease,transform .3s ease;
}
.cookie-banner[hidden]{display:none}
.cookie-banner p{font-size:.85rem;color:var(--on-dark-2);flex:1 1 220px;max-width:none}
.cookie-banner .btn{flex:none;background:var(--navy-soft);color:#fff}
.cookie-banner .btn:hover{background:#375270}

/* ---------- Parallax decorativos ---------- */
.parallax-el{will-change:transform}

/* ---------- Utilities ---------- */
.section{padding-block:clamp(48px,7vw,86px)}
.section-head{max-width:760px}
.center{text-align:center;margin-inline:auto}