/* ============================================================
   Crisla Souza | Corretora de Imóveis RJ — Design System
   Mobile-first, leve, rápido para Google Ads e Core Web Vitals
   ============================================================ */

:root{
  --navy: #0f2942;
  --navy-dark: #081a2b;
  --navy-soft: #16324f;
  --gold: #c9a227;
  --gold-light: #e8cd7a;
  --bg: #f7f5f0;
  --white: #ffffff;
  --text: #1c2b3a;
  --text-light: #5b6b7a;
  --border: #e5e0d5;
  --green-wa: #22c35e;
  --green-wa-dark: #1aa34d;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow: 0 12px 32px rgba(15,41,66,.12);
  --shadow-sm: 0 4px 14px rgba(15,41,66,.08);
  --maxw: 1180px;
  --font: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0 0 .5em; font-weight:600; line-height:1.2; }
p{ margin:0 0 1em; color:var(--text-light); }
.container{ max-width:var(--maxw); margin:0 auto; padding:0 20px; }
.section{ padding:56px 0; }
.section-tight{ padding:32px 0; }
.eyebrow{
  display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--gold); margin-bottom:10px;
}
.center{ text-align:center; }
.muted{ color:var(--text-light); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 24px; border-radius:999px; font-weight:600; font-size:.98rem;
  border:none; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
.btn:active{ transform:scale(.97); }
.btn-wa{
  background:var(--green-wa); color:#fff; box-shadow:0 8px 20px rgba(34,195,94,.35);
}
.btn-wa:hover{ background:var(--green-wa-dark); }
.btn-gold{
  background:var(--gold); color:var(--navy-dark); box-shadow:0 8px 20px rgba(201,162,39,.3);
}
.btn-gold:hover{ background:var(--gold-light); }
.btn-outline{
  background:transparent; color:var(--white); border:1.5px solid rgba(255,255,255,.55);
}
.btn-outline:hover{ background:rgba(255,255,255,.12); }
.btn-outline-dark{
  background:transparent; color:var(--navy); border:1.5px solid var(--navy);
}
.btn-block{ width:100%; }
.btn svg{ width:20px; height:20px; flex:none; }

/* ---------- Header ---------- */
.site-header{
  background:var(--navy-dark); color:#fff; padding:14px 0;
  position:sticky; top:0; z-index:50; box-shadow:0 2px 12px rgba(0,0,0,.15);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:600; font-size:1.02rem; }
.brand-badge{
  width:38px; height:38px; border-radius:10px; background:linear-gradient(145deg,var(--gold),var(--gold-light));
  display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--navy-dark); flex:none;
}
.brand small{ display:block; font-weight:400; font-size:.7rem; color:#b9c3cd; }
.header-cta{ display:flex; align-items:center; gap:10px; }
.header-cta .btn{ padding:11px 16px; font-size:.85rem; }
.creci-tag{
  display:none; font-size:.72rem; color:#9db0c0; border:1px solid #26415a; padding:4px 9px; border-radius:999px;
}
@media(min-width:640px){ .creci-tag{ display:inline-block; } }

/* ---------- Hero ---------- */
.hero{
  background:radial-gradient(circle at 15% 0%, var(--navy-soft), var(--navy-dark) 60%);
  color:#fff; padding:44px 0 40px; position:relative; overflow:hidden;
}
.hero::after{
  content:""; position:absolute; inset:auto -20% -60% auto; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(201,162,39,.18), transparent 70%);
}
.hero .container{ position:relative; z-index:1; }
.hero.has-photo{ background:var(--navy-dark); }
.hero-photo{
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center;
}
.hero-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,26,43,.55) 0%, rgba(8,26,43,.88) 78%, var(--navy-dark) 100%);
}
@media(min-width:820px){
  .hero-photo::after{ background:linear-gradient(100deg, rgba(8,26,43,.94) 38%, rgba(8,26,43,.55) 68%, rgba(8,26,43,.3) 100%); }
}

/* ---- Galeria ---- */
.grid-galeria{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media(min-width:700px){ .grid-galeria{ grid-template-columns:repeat(4,1fr); } }
.galeria-item{ border-radius:14px; overflow:hidden; box-shadow:var(--shadow-sm); aspect-ratio:4/3; }
.galeria-item img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---- Emp card photo top ---- */
.emp-card-top.has-photo{ position:relative; background:none; }
.emp-card-top.has-photo img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.emp-card-top.has-photo::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(15,41,66,.35) 0%, rgba(8,26,43,.92) 92%);
}
.emp-card-top.has-photo > *{ position:relative; z-index:2; }
.badges{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.badge{
  font-size:.74rem; font-weight:600; padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); color:#e9edf1;
}
.badge-gold{ background:rgba(201,162,39,.18); border-color:rgba(201,162,39,.4); color:var(--gold-light); }
.hero h1{ font-size:1.9rem; max-width:16ch; margin-bottom:12px; }
.hero .lead{ color:#c6d0d9; max-width:52ch; font-size:1.02rem; }
.hero-stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:22px 0 26px;
}
.hero-stat{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-sm);
  padding:12px 14px;
}
.hero-stat strong{ display:block; font-size:1.15rem; color:var(--gold-light); }
.hero-stat span{ font-size:.74rem; color:#aebccb; }
.hero-ctas{ display:flex; flex-direction:column; gap:10px; }
@media(min-width:520px){ .hero-ctas{ flex-direction:row; } }

/* ---------- Diferenciais ---------- */
.grid-diff{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(min-width:700px){ .grid-diff{ grid-template-columns:repeat(3,1fr); } }
@media(min-width:980px){ .grid-diff{ grid-template-columns:repeat(4,1fr); } }
.diff-card{
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius);
  padding:16px 14px; box-shadow:var(--shadow-sm);
}
.diff-card .ic{
  width:38px; height:38px; border-radius:10px; background:#f1ecdd; color:var(--gold);
  display:flex; align-items:center; justify-content:center; margin-bottom:10px;
}
.diff-card .ic svg{ width:20px; height:20px; }
.diff-card h4{ font-size:.92rem; margin-bottom:4px; }
.diff-card p{ font-size:.82rem; margin:0; }

/* ---------- Plantas ---------- */
.grid-plantas{ display:grid; grid-template-columns:1fr; gap:14px; }
@media(min-width:700px){ .grid-plantas{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:980px){ .grid-plantas{ grid-template-columns:repeat(3,1fr); } }
.planta-card{
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius);
  padding:20px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:10px;
}
.planta-card .tipo{ font-weight:600; font-size:1.02rem; }
.planta-card .m2{ font-size:1.7rem; font-weight:700; color:var(--navy); }
.planta-card .m2 span{ font-size:.9rem; font-weight:500; color:var(--text-light); }
.planta-card .preco{ font-size:.85rem; color:var(--text-light); }
.planta-card .preco b{ color:var(--gold); font-size:1.02rem; }

/* ---------- Região ---------- */
.regiao-grid{ display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:700px){ .regiao-grid{ grid-template-columns:repeat(2,1fr); } }
.regiao-item{
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:14px 16px;
}
.regiao-item h4{ font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; color:var(--gold); margin-bottom:6px; }
.regiao-item p{ margin:0; font-size:.92rem; color:var(--text); }

/* ---------- Corretora ---------- */
.corretora-box{
  background:var(--navy-dark); color:#fff; border-radius:20px; padding:28px 22px;
  display:flex; flex-direction:column; gap:16px;
}
@media(min-width:700px){ .corretora-box{ flex-direction:row; align-items:center; padding:34px; } }
.corretora-avatar{
  width:74px; height:74px; border-radius:50%; background:linear-gradient(145deg,var(--gold),var(--gold-light));
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.4rem; color:var(--navy-dark);
  flex:none;
}
.corretora-box h3{ margin-bottom:4px; }
.corretora-box p{ color:#c6d0d9; margin-bottom:14px; }
.corretora-meta{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }

/* ---------- FAQ ---------- */
.faq details{
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:14px 16px; margin-bottom:10px;
}
.faq summary{ font-weight:600; cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:10px; align-items:center; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-size:1.3rem; color:var(--gold); flex:none; }
.faq details[open] summary::after{ content:"–"; }
.faq p{ margin-top:10px; margin-bottom:0; font-size:.92rem; }

/* ---------- Empreendimento cards (home) ---------- */
.grid-emp{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:700px){ .grid-emp{ grid-template-columns:repeat(2,1fr); } }
.emp-card{
  background:var(--white); border:1px solid var(--border); border-radius:20px; overflow:hidden;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease;
}
.emp-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
.emp-card-top{
  background:linear-gradient(135deg,var(--navy),var(--navy-soft)); color:#fff; padding:22px 20px 46px; position:relative;
}
.emp-card-top .status{
  font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  background:rgba(201,162,39,.22); color:var(--gold-light); padding:4px 10px; border-radius:999px; display:inline-block; margin-bottom:10px;
}
.emp-card-top h3{ margin-bottom:4px; font-size:1.2rem; }
.emp-card-top span{ font-size:.82rem; color:#b9c3cd; }
.emp-card-body{ padding:18px 20px 20px; display:flex; flex-direction:column; gap:12px; flex:1; }
.emp-card-body ul{ display:flex; flex-wrap:wrap; gap:6px; }
.emp-card-body li{
  font-size:.72rem; background:#f1ecdd; color:#8a6d13; padding:4px 9px; border-radius:999px; font-weight:600;
}
.emp-card-body .row{ display:flex; justify-content:space-between; align-items:center; margin-top:auto; gap:10px; }
.emp-card-body .from{ font-size:.78rem; color:var(--text-light); }
.emp-card-body .from b{ color:var(--navy); font-size:1rem; }

/* ---------- Bloco Já Lançados vs Pré-Lançamento (home) ---------- */
.block-heading{ display:flex; align-items:center; gap:12px; margin-bottom:22px; }
.block-heading .dot{ width:10px; height:10px; border-radius:50%; background:var(--gold); flex:none; }
.block-heading.is-pre .dot{ background:var(--text-light); }
.section-pre{
  background:#eef1ea; border-top:3px dashed #c9c3ac; margin-top:8px;
}
.pre-intro{ max-width:62ch; margin-bottom:22px; }
.emp-card.is-pre{
  border:1.5px dashed #b9b19a; box-shadow:none; background:#fbfaf6;
}
.emp-card.is-pre:hover{ transform:none; box-shadow:var(--shadow-sm); }
.emp-card.is-pre .emp-card-top{
  background:transparent; color:var(--navy); padding:22px 20px 20px;
}
.emp-card.is-pre .emp-card-top .status{
  background:rgba(15,41,66,.08); color:var(--navy); border:1px solid rgba(15,41,66,.15);
}
.emp-card.is-pre .emp-card-top span{ color:var(--text-light); }
.emp-card.is-pre .emp-card-body li{ background:#efece2; color:var(--text); }

/* entrega row nos cards da home */
.emp-card-body .entrega-row{
  display:flex; align-items:center; gap:6px; font-size:.78rem; color:var(--text-light);
}
.emp-card-body .entrega-row svg{ width:15px; height:15px; color:var(--gold); flex:none; }
.emp-card.is-pre .emp-card-body .entrega-row svg{ color:var(--text-light); }

/* ---------- Sticky WhatsApp bar (mobile) ---------- */
.sticky-wa{
  position:fixed; left:0; right:0; bottom:0; z-index:60; padding:10px 14px;
  background:rgba(8,26,43,.92); backdrop-filter:blur(6px); display:flex; gap:10px; align-items:center;
  box-shadow:0 -6px 20px rgba(0,0,0,.25);
}
.sticky-wa span{ color:#fff; font-size:.8rem; flex:1; }
.sticky-wa .btn{ padding:12px 18px; font-size:.86rem; }
@media(min-width:980px){ .sticky-wa{ display:none; } }
body{ padding-bottom:68px; }
@media(min-width:980px){ body{ padding-bottom:0; } }

/* ---------- Footer ---------- */
footer{ background:var(--navy-dark); color:#9db0c0; padding:34px 0 90px; font-size:.82rem; }
@media(min-width:980px){ footer{ padding-bottom:34px; } }
footer .container{ display:flex; flex-direction:column; gap:14px; }
footer .flegal{ font-size:.72rem; color:#728496; line-height:1.6; }
footer a.flink{ color:var(--gold-light); }

/* ---------- Breadcrumb / back ---------- */
.back-link{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; color:var(--gold-light); font-weight:600; }

/* ---------- Utilities ---------- */
.mt-0{ margin-top:0; }
.gap-sm{ gap:8px; }
.text-white{ color:#fff; }
.tag-row{ display:flex; flex-wrap:wrap; gap:10px; }