/* IVAÍ RESIDENCE — stylesheet baseado no Guia da Marca (paleta terrosa, Josefin Sans + Source Sans Pro) */

:root{
  --marrom-noturno:#2E211B;
  --marrom-escuro:#3D2A22;
  --marrom-medio:#5A4438;
  --marrom:#714B41;
  --terracota:#8A6656;
  --bege:#EAE4E3;
  --verde-escuro:#102820;
  --verde-cacador:#4C6444;
  --cafe-noir:#4D2D18;
  --terra-crua:#8A6240;
  --caqui:#CABA9C;

  --font-title:'Josefin Sans', sans-serif;
  --font-body:'Source Sans Pro', sans-serif;

  --max: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bege);
  color:var(--marrom-noturno);
  font-family:var(--font-body);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{
  font-family:var(--font-title);
  text-transform:uppercase;
  letter-spacing:.01em;
  margin:0 0 .4em;
  font-weight:600;
  line-height:1.15;
}
p{margin:0 0 1em;}

.eyebrow{
  display:inline-block;
  font-family:var(--font-body);
  font-style:italic;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--terracota);
  margin-bottom:.9em;
}
.eyebrow.light{color:var(--caqui);}
.section-label{
  font-family:var(--font-body);
  font-style:italic;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--terracota);
  margin-bottom:1.4em;
}

/* Botões ------------------------------------------------------------------ */
.button{
  display:inline-flex;align-items:center;gap:.55em;
  padding:.95em 2.1em;
  border-radius:32px;
  font-family:var(--font-title);
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.85rem;
  font-weight:600;
  border:1px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
  box-shadow:0 6px 18px rgba(46,33,27,.14);
}
.button:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(46,33,27,.2);}
.button-primary{background:var(--terracota);color:var(--bege);}
.button-primary:hover{background:#976f5f;}
.button-whatsapp{background:#25D366;color:#fff;}
.button-whatsapp:hover{background:#1EBE5A;}
.button-outline{
  background:transparent;color:var(--marrom-noturno);
  border-color:var(--terracota);box-shadow:none;padding:.75em 1.5em;font-size:.78rem;
}
.button-outline:hover{background:rgba(138,102,86,.08);transform:none;}
.button-lg{padding:1.15em 2.8em;font-size:.92rem;}
.btn-icon{width:18px;height:18px;flex:none;}

.text-cta{
  display:inline-block;margin-top:2.2rem;
  font-family:var(--font-title);text-transform:uppercase;letter-spacing:.05em;
  font-size:.82rem;color:var(--marrom-noturno);
  border-bottom:1px solid var(--terracota);padding-bottom:3px;
}
.text-cta.light{color:var(--bege);border-color:var(--terra-crua);}

/* Header / nav ------------------------------------------------------------ */
.topbar{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:.85rem clamp(1.2rem,4vw,3rem);
  background:rgba(234,228,227,.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(46,33,27,.08);
}
.brand{display:flex;align-items:center;gap:.6rem;}
.brand-logo{height:38px;width:auto;}
.brand-word{
  font-family:var(--font-title);font-weight:600;letter-spacing:.06em;
  font-size:1rem;text-transform:uppercase;color:var(--marrom-noturno);
}
.topbar nav{display:flex;align-items:center;gap:1.6rem;}
.topbar nav a{font-size:.85rem;letter-spacing:.02em;color:var(--marrom-medio);}
.topbar nav a:hover{color:var(--marrom-noturno);}
.nav-cta{
  background:var(--marrom-noturno);color:var(--bege) !important;
  padding:.6em 1.3em;border-radius:24px;
  font-family:var(--font-title);text-transform:uppercase;
  font-size:.78rem;letter-spacing:.06em;
}
.nav-toggle{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:34px;height:34px;background:none;border:none;cursor:pointer;padding:0;
}
.nav-toggle span{display:block;height:2px;width:100%;background:var(--marrom-noturno);border-radius:2px;transition:transform .2s ease, opacity .2s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Hero ---------------------------------------------------------------------- */
.hero{
  position:relative;
  min-height:94vh;
  display:flex;align-items:center;justify-content:center;text-align:center;
  padding:6rem clamp(1.2rem,4vw,3rem) 3rem;
  background-size:cover;background-position:center;
  color:var(--bege);
}
.hero-content{position:relative;display:flex;flex-direction:column;align-items:center;max-width:640px;}
.hero-badge{
  display:inline-block;border:1px solid rgba(234,228,227,.45);
  color:var(--bege);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.4em 1.1em;border-radius:20px;margin-bottom:1.4rem;
}
.hero-content .eyebrow.light{letter-spacing:.28em;}
.hero-content h1{font-size:clamp(2.8rem,7vw,5.2rem);color:var(--bege);margin-bottom:1em;}
.hero-stats{
  margin-top:1.8rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;
  font-size:.84rem;color:var(--caqui);letter-spacing:.02em;
}
.hero-stats .dot{opacity:.5;}
.hero-stats em{font-style:normal;color:var(--terra-crua);}

/* Movimento sutil ao rolar a página ------------------------------------------
   Tudo aqui dentro é ignorado quando o usuário pede menos movimento
   (prefers-reduced-motion), e o conteúdo já nasce visível nesse caso. */
@media (prefers-reduced-motion: no-preference){
  .hero-content-in{animation:heroIn 1s ease both;}
  @keyframes heroIn{
    from{opacity:0;transform:translateY(18px);}
    to{opacity:1;transform:translateY(0);}
  }

  .reveal{
    opacity:0;
    transform:translateY(26px);
    transition:opacity .7s ease, transform .7s ease;
  }
  .reveal.is-visible{opacity:1;transform:translateY(0);}

  .reveal-scale{
    opacity:0;
    transform:scale(.96);
    transition:opacity .7s ease, transform .7s ease;
  }
  .reveal-scale.is-visible{opacity:1;transform:scale(1);}

  [data-parallax]{will-change:transform;}
}

@media (min-width:901px) and (prefers-reduced-motion: no-preference){
  .hero{background-attachment:fixed;}
}

/* Generic section spacing -------------------------------------------------- */
.section{padding:4.4rem clamp(1.2rem,4vw,3rem);max-width:var(--max);margin:0 auto;}

.loc-intro{max-width:640px;margin-bottom:2.6rem;}
.loc-intro p{color:var(--marrom-medio);font-size:1.05rem;}
.loc-media-row{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem;align-items:start;}
.media-frame{border-radius:4px;overflow:hidden;aspect-ratio:4/3;}
.media-frame img{width:100%;height:100%;object-fit:cover;}
.big-stat{
  display:block;font-family:var(--font-title);font-size:1.5rem;
  color:var(--marrom-noturno);margin-bottom:.6rem;letter-spacing:.02em;
}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem;margin-bottom:1.8rem;}
.chips span{
  border:1px solid var(--terracota);color:var(--marrom);
  padding:.35em .9em;border-radius:30px;font-size:.8rem;
}

/* Mapa ----------------------------------------------------------------------- */
.map-card{
  border:1px solid rgba(46,33,27,.14);border-radius:8px;
  padding:1.3rem;display:flex;flex-direction:column;gap:1rem;
  background:rgba(255,255,255,.4);
}
.map-illustration{width:100%;height:auto;border-radius:4px;aspect-ratio:220/130;border:0;display:block;}
.map-card-text span{display:block;font-family:var(--font-title);font-size:1rem;letter-spacing:.03em;}
.map-card-text small{color:var(--marrom-medio);font-size:.82rem;}
.map-card .button-outline{align-self:flex-start;}

/* Pra quem é — tipografia + ícone fino, sem cards, sem foto --------------- */
.audience-v2{text-align:center;}
.audience-v2-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2.6rem;text-align:center;}
.audience-v2-grid article{padding:0 .4rem;border-left:1px solid rgba(46,33,27,.12);}
.audience-v2-grid article:first-child{border-left:none;}
.a-icon{width:30px;height:30px;color:var(--terracota);margin:0 auto 1.1rem;}
.audience-v2-grid h3{font-size:1rem;text-transform:none;letter-spacing:0;margin-bottom:.5em;}
.audience-v2-grid p{color:var(--marrom-medio);font-size:.88rem;margin:0;}
.audience-v2 > .text-cta{margin-top:2.6rem;}

/* Produto — sem cards, layout tipográfico integrado ------------------------ */
.product-v3{background:var(--marrom-noturno);color:var(--bege);}
.product-v3 .section-label{color:var(--terra-crua);}
.product-v3 h2{font-size:clamp(1.9rem,3.4vw,2.7rem);color:var(--bege);max-width:32ch;margin-bottom:2.2rem;}
.product-v3-row{display:grid;grid-template-columns:repeat(4,1fr);}
.p3-item{padding:1.6rem 1.6rem 1.6rem 0;border-left:1px solid rgba(234,228,227,.16);padding-left:1.6rem;}
.p3-item:first-child{border-left:none;padding-left:0;}
.p3-item strong{display:block;font-family:var(--font-title);font-weight:600;font-size:1.7rem;margin-bottom:.4em;color:var(--bege);}
.p3-item span{color:var(--caqui);font-size:.86rem;}

/* Compra com segurança — discreta, sem tom defensivo ------------------------ */
.security-v2{background:var(--bege);}
.security-inner{max-width:820px;margin:0 auto;text-align:center;}
.security-lead{color:var(--marrom-medio);font-size:.98rem;max-width:520px;margin:0 auto 2.2rem;}
.security-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;
}
.sec-card{
  display:flex;flex-direction:column;align-items:center;gap:.9rem;
  padding:1.8rem 1.2rem;border:1px solid rgba(46,33,27,.14);border-radius:10px;
  background:rgba(255,255,255,.45);
}
.sec-icon{width:26px;height:26px;color:var(--verde-cacador);flex:none;}
.sec-card span{font-size:.86rem;color:var(--marrom-noturno);line-height:1.4;}

/* No desktop essa lâmina fica desproporcional se mantiver o mesmo tamanho do mobile */
@media (min-width:901px){
  .security-v2{padding-top:3.2rem;padding-bottom:3.2rem;}
  .security-lead{margin-bottom:1.6rem;}
  .security-grid{gap:.9rem;}
  .sec-card{flex-direction:row;padding:.9rem 1.1rem;gap:.7rem;border-radius:8px;}
  .sec-icon{width:18px;height:18px;}
  .sec-card span{font-size:.78rem;text-align:left;line-height:1.3;}
}

/* Condições — dois modelos lado a lado --------------------------------------- */
.conditions{background:var(--verde-escuro);color:var(--bege);padding:4.4rem clamp(1.2rem,4vw,3rem);text-align:center;}
.conditions-inner{max-width:680px;margin:0 auto;}
.conditions-inner h2{font-size:clamp(1.8rem,3.4vw,2.6rem);color:var(--bege);margin-bottom:.6rem;}
.sold-note{font-size:.86rem;margin-bottom:.5rem;}
.sold-updated{font-size:.74rem;color:var(--caqui);opacity:.8;margin-bottom:2.2rem;}
.sold-badge{
  display:inline-block;background:var(--terracota);color:var(--bege);
  font-family:var(--font-title);font-size:.82rem;letter-spacing:.03em;
  padding:.5em 1.2em;border-radius:30px;margin-bottom:.6em;
}
.pricing-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem;margin-bottom:2.4rem;text-align:left;}
.pricing-card{border:1px solid rgba(234,228,227,.2);border-radius:6px;padding:2rem 1.7rem;}
.pricing-card small{display:block;color:var(--terra-crua);text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;margin-bottom:.9em;}
.pricing-card strong{display:block;font-family:var(--font-title);font-size:1.9rem;font-weight:600;}
.pricing-card p{color:var(--caqui);font-size:.86rem;margin:.5em 0 0;}
.pricing-card .price-updated{font-size:.72rem;opacity:.65;margin-top:.9em;}

/* FAQ ------------------------------------------------------------------------- */
.faq{max-width:760px;text-align:center;}
.faq-title{font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:2.4rem;}
.faq-list{text-align:left;display:flex;flex-direction:column;}
.faq-item{border-bottom:1px solid rgba(46,33,27,.14);}
.faq-item:first-child{border-top:1px solid rgba(46,33,27,.14);}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  background:none;border:none;text-align:left;cursor:pointer;
  padding:1.3rem 0;font-family:var(--font-body);font-size:1rem;color:var(--marrom-noturno);
}
.faq-q span{font-family:var(--font-title);font-size:1.2rem;color:var(--terracota);transition:transform .2s ease;flex:none;}
.faq-item.open .faq-q span{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.faq-item.open .faq-a{max-height:220px;}
.faq-a p{color:var(--marrom-medio);font-size:.92rem;padding-bottom:1.3rem;margin:0;}
.faq > .text-cta{display:block;text-align:center;margin-top:2.4rem;}

/* CTA WhatsApp — só o botão, faixa simples entre o FAQ e o rodapé ------------ */
.visit-cta-simple{text-align:center;padding:1.6rem clamp(1.2rem,4vw,3rem);background:var(--bege);}

/* Fechamento — uma marca só, sem repetição, logo consertada ------------------- */
.closing{
  background:linear-gradient(160deg,var(--marrom-noturno),var(--verde-escuro));
  color:var(--bege);text-align:center;
  padding:1.8rem clamp(1.2rem,4vw,3rem) 1.1rem;
  display:flex;flex-direction:column;align-items:center;gap:.4rem;
}
.closing .logo-pill{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--bege);padding:.4rem;border-radius:50%;margin-bottom:.5rem;
  width:34px;height:34px;
}
.closing .logo-pill img{height:20px;width:20px;object-fit:contain;}
.closing h2{font-size:.95rem;color:var(--bege);margin:0;}
.closing strong{
  font-family:var(--font-title);font-style:italic;font-size:.8rem;
  color:var(--terra-crua);text-transform:none;font-weight:500;margin-bottom:.6rem;
}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:1.6rem;margin-bottom:.5rem;}
.footer-links a{
  display:flex;align-items:center;gap:.4em;
  font-size:.82rem;color:var(--caqui);letter-spacing:.02em;
}
.footer-links a:hover{color:var(--bege);}
.footer-links svg{width:16px;height:16px;}
.closing-meta{font-size:.76rem;color:var(--caqui);opacity:.6;margin:0;letter-spacing:.03em;}

/* Pop-up de saída -------------------------------------------------------------- */
.exit-overlay{
  position:fixed;inset:0;background:rgba(46,33,27,.6);
  display:flex;align-items:center;justify-content:center;padding:1.2rem;z-index:100;
}
.exit-overlay[hidden]{display:none;}
.exit-card{
  position:relative;background:var(--bege);border-radius:10px;
  max-width:420px;width:100%;padding:2.6rem 2rem 2.2rem;text-align:center;
  box-shadow:0 20px 50px rgba(0,0,0,.3);
}
.exit-logo{height:34px;width:auto;margin:0 auto 1.2rem;}
.exit-card h3{font-family:var(--font-title);text-transform:none;font-size:1.25rem;letter-spacing:0;margin-bottom:1.6rem;color:var(--marrom-noturno);}
.exit-close{
  position:absolute;top:.6rem;right:.8rem;background:none;border:none;
  font-size:1.6rem;line-height:1;color:var(--marrom-medio);cursor:pointer;
}

/* Desktop — aperta os respiros entre seções e dá mais presença ao selo de vendas,
   mantendo o mobile intocado (ele já está aprovado) --------------------------- */
@media (min-width:901px){
  .section{padding:3.2rem clamp(1.2rem,4vw,3rem);}
  .conditions{padding:3.4rem clamp(1.2rem,4vw,3rem);}

  .audience-v2-grid{gap:2rem;}
  .loc-media-row{gap:2.6rem;}

  .security-inner{max-width:var(--max);}
  .security-lead{font-size:1.05rem;max-width:620px;}
  .security-grid{gap:1.3rem;}
  .sec-card{padding:1.7em 1.8em;gap:1.1em;border-radius:10px;box-shadow:0 4px 14px rgba(46,33,27,.06);}
  .sec-icon{width:32px;height:32px;}
  .sec-card span{font-size:1.05rem;line-height:1.35;}

  .product-v3 h2{margin-bottom:1.8rem;}
  .p3-item{padding-top:1.1rem;padding-bottom:1.1rem;}

  .conditions-inner h2{margin-bottom:1.1rem;}
  .sold-badge{
    font-size:.94rem;padding:.62em 1.5em;letter-spacing:.04em;
    box-shadow:0 6px 18px rgba(0,0,0,.18);
  }
  .sold-updated{margin-bottom:1.8rem;}
  .pricing-grid{margin-bottom:1.8rem;}

  .faq{max-width:var(--max);text-align:left;}
  .faq .section-label,
  .faq-title,
  .faq-list,
  .faq > .text-cta{max-width:900px;margin-left:0;margin-right:auto;}
  .faq-title{margin-bottom:1.8rem;}
  .faq > .text-cta{text-align:left;}

  .visit-cta-simple{padding:1.2rem clamp(1.2rem,4vw,3rem);}

  .closing{padding:1.2rem clamp(1.2rem,4vw,3rem) .8rem;gap:.3rem;}
  .closing .logo-pill{width:26px;height:26px;padding:.3rem;margin-bottom:.3rem;}
  .closing .logo-pill img{height:15px;width:15px;}
  .closing h2{font-size:.82rem;}
  .closing strong{font-size:.7rem;margin-bottom:.4rem;}
  .footer-links{gap:1.3rem;margin-bottom:.35rem;}
  .closing-meta{font-size:.7rem;}
}

@media (max-width:900px){
  .topbar nav{
    position:fixed;top:64px;left:0;right:0;
    background:var(--bege);flex-direction:column;align-items:stretch;
    gap:0;padding:.5rem clamp(1.2rem,4vw,3rem) 1.2rem;
    border-bottom:1px solid rgba(46,33,27,.1);
    transform:translateY(-8px);opacity:0;pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
  }
  .topbar nav.open{transform:translateY(0);opacity:1;pointer-events:auto;}
  .topbar nav a{padding:.85rem 0;border-bottom:1px solid rgba(46,33,27,.08);}
  .topbar nav a:last-child{border-bottom:none;}
  .nav-cta{text-align:center;margin-top:.6rem;}
  .nav-toggle{display:flex;}

  .hero{min-height:88vh;}
  .loc-media-row,.pricing-grid{grid-template-columns:1fr;}
  .audience-v2-grid,.product-v3-row{grid-template-columns:repeat(2,1fr);row-gap:2.2rem;}
  .audience-v2-grid article:nth-child(3),.p3-item:nth-child(3){border-left:none;}
  .security-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:560px){
  .section{padding:3.6rem 1.2rem;}
  .hero-content h1{font-size:2.6rem;}
  .audience-v2-grid,.product-v3-row{grid-template-columns:1fr;}
  .audience-v2-grid article,.p3-item{border-left:none !important;padding-left:0 !important;}
  .security-grid{grid-template-columns:1fr;}
  .button-lg{padding:1em 2rem;font-size:.85rem;}
}