:root {
  --g: #1c6936; --gd: #155228; --gl: #e8f3ec; --gm: rgba(28,105,54,.12);
  --cream: rgb(240,239,228); --cd: rgb(228,227,214); --white: #ffffff;
  --ink: #1a1a1a; --soft: #3d3d3d; --muted: #6b7280;
  --bdr: rgba(28,105,54,.18); --bdrh: rgba(28,105,54,.28);
  --gold: #c8a84b; --wa: #25d366; --r: 8px;
  --sh: 0 4px 24px rgba(28,105,54,.10); --shh: 0 8px 36px rgba(28,105,54,.16);
  --font-body:  'Inter', sans-serif;
  --font-serif: 'Playfair Display', serif;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body {
  font-family: var(--font-body);
  background:var(--cream); color:var(--ink);
  overflow-x:hidden; font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* ✅ HEADINGS — Playfair Display */
h1, h2, h3, h4 { font-family: var(--font-serif); }

/* ✅ .g class — Playfair Display */
.g { font-family: var(--font-serif); }

.faq-a strong { color: var(--ink) }

@media (max-width: 768px) {
  .faq-a { padding-left:20px; padding-right:20px }
  .faq-a.open { padding-left:20px; padding-right:20px }
}

/* ── Layout ── */
.container { max-width:1180px; margin:0 auto; padding:0 5% }
section { padding:80px 0 }
.bg-w { background:var(--white) }
.bg-c { background:var(--cream) }
.bg-g { background:var(--g) }

/* ── Typography ── */
.sec-label {
  font-weight:700; font-size:.7rem; letter-spacing:.13em;
  text-transform:uppercase; color:var(--g); margin-bottom:10px;
}
.sec-title {
  font-family: var(--font-serif);
  font-size:clamp(1.8rem,3.5vw,2.6rem);
  color:var(--ink); line-height:1.15; letter-spacing:-.02em; margin-bottom:14px;
}
.sec-sub {
  color:var(--muted); font-size:1rem; max-width:560px;
  line-height:1.7; margin-bottom:44px;
}
.text-center { text-align:center }
.text-center .sec-sub { margin-left:auto; margin-right:auto }
.divider { height:1px; background:var(--bdrh); margin:0 5% }

/* ── Animate on scroll ── */
.fu { opacity:0; transform:translateY(22px); transition:opacity .6s ease,transform .6s ease }
.fu.vis { opacity:1; transform:none }
.fu-d1 { transition-delay:.1s }
.fu-d2 { transition-delay:.2s }
.fu-d3 { transition-delay:.3s }

/* ── Topbar ── */
.topbar {
  background:var(--g); color:#fff; font-size:.75rem; font-weight:600;
  text-align:center; padding:7px 5%; letter-spacing:.04em;
}

/* ── Header ── */
header {
  position:sticky; top:0; z-index:900;
  background:rgba(240,239,228,.96); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--bdrh); padding:0 5%;
  height:64px; display:flex; align-items:center; justify-content:space-between;
}
.logo {
  font-family: var(--font-serif);
  font-size:1.7rem; font-weight:bold;
  color:var(--g); text-decoration:none; letter-spacing:-.01em;
}
.hbtns { display:flex; align-items:center; gap:10px }
.btn-wa {
  background:var(--wa); color:#fff; font-weight:600; font-size:.85rem;
  padding:9px 16px; border-radius:var(--r); text-decoration:none;
  display:flex; align-items:center; gap:6px; transition:opacity .2s;
}
.btn-wa:hover { opacity:.88 }
.btn-call {
  background:var(--g); color:#fff; font-weight:700; font-size:.85rem;
  padding:9px 20px; border-radius:var(--r); text-decoration:none;
  white-space:nowrap; transition:background .2s;
}
.btn-call:hover { background:var(--gd) }

/* ── Hero ── */
.hero { background:var(--cream); padding:72px 0 80px; position:relative; overflow:hidden }
.hero::after {
  content:''; position:absolute; bottom:-180px; right:-180px;
  width:560px; height:560px;
  background:radial-gradient(circle,var(--gl) 0%,transparent 68%);
  pointer-events:none;
}
.hero-inner {
  max-width:1180px; margin:0 auto; padding:0 5%;
  display:grid; grid-template-columns:1fr 400px; gap:60px; align-items:center;
}
.hero-badge {
  display:inline-block; background:var(--gl); border:1px solid var(--bdrh);
  color:var(--gd); font-weight:700; font-size:.68rem; letter-spacing:.1em;
  text-transform:uppercase; padding:5px 14px; border-radius:100px; margin-bottom:20px;
}
.hero h1 {
  font-family: var(--font-serif);
  font-size:clamp(2.4rem,4.8vw,3.8rem);
  line-height:1.08; letter-spacing:-.025em; color:var(--ink); margin-bottom:12px;
}
.hero h1 em { font-style:italic; color:var(--g) }
.hero-tagline {
  font-family: var(--font-serif);
  font-style:italic; font-size:1.15rem;
  color:var(--g); margin-bottom:18px; font-weight:normal;
}
.hero-body { font-size:.97rem; color:var(--soft); line-height:1.72; max-width:520px; margin-bottom:28px }

/* ── Pills ── */
.trust-pills { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px }
.pill {
  background:var(--white); border:1px solid var(--bdrh); color:var(--soft);
  font-size:.8rem; font-weight:500; padding:6px 14px; border-radius:100px;
  display:flex; align-items:center; gap:6px;
}
.pill-dot {
  width:7px; height:7px; background:var(--g); border-radius:50%;
  flex-shrink:0; animation:pdot 2s infinite;
}
@keyframes pdot {
  0%,100% { box-shadow:0 0 0 0 rgba(28,105,54,.45) }
  50%      { box-shadow:0 0 0 4px rgba(28,105,54,0) }
}

/* ── Social Proof ── */
.soc-proof { display:flex; align-items:center; gap:12px }
.avatars { display:flex }
.avatars span {
  width:34px; height:34px; border-radius:50%; border:2px solid var(--white);
  background:var(--gl); color:var(--g); font-family: var(--font-serif);
  font-weight:bold; font-size:.8rem; display:flex; align-items:center;
  justify-content:center; margin-left:-8px;
}
.avatars span:first-child { margin-left:0 }
.soc-text { font-size:.83rem; color:var(--muted) }
.soc-text strong { color:var(--ink) }
.stars-sm { color:var(--gold); font-size:.85rem; letter-spacing:2px }

/* ── Form Card ── */
.form-card {
  background:var(--white); border:1px solid var(--bdrh); border-radius:16px;
  padding:30px 26px; box-shadow:var(--sh); position:relative; z-index:1;
}
.form-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:var(--g); border-radius:16px 16px 0 0;
}
.form-live {
  background:#f0faf4; border:1px solid rgba(28,105,54,.2);
  border-radius:var(--r); padding:9px 13px; margin-bottom:16px;
  font-size:.82rem; color:var(--gd); font-weight:500;
}
.form-title {
  font-family: var(--font-serif);
  font-size:1.3rem; font-weight:bold; color:var(--ink); margin-bottom:4px
}
.form-sub { font-size:.8rem; color:var(--muted); margin-bottom:18px }
.fg { margin-bottom:13px }
.fg label {
  display:block; font-size:.72rem; font-weight:700; color:var(--muted);
  margin-bottom:5px; letter-spacing:.06em; text-transform:uppercase;
}
.fg input, .fg select {
  width:100%; background:var(--cream); border:1px solid var(--bdrh);
  color:var(--ink); padding:11px 13px; border-radius:var(--r);
  font-size:.92rem; font-family: var(--font-body); outline:none;
  transition:border-color .2s,box-shadow .2s,background .2s; -webkit-appearance:none;
}
.fg input:focus, .fg select:focus {
  border-color:var(--g); box-shadow:0 0 0 3px rgba(28,105,54,.11); background:var(--white);
}
.fg select option { background:#fff }
.btn-submit {
  width:100%; background:var(--g); color:#fff; font-family: var(--font-body);
  font-weight:700; font-size:.97rem; padding:14px; border:none;
  border-radius:var(--r); cursor:pointer; letter-spacing:.02em;
  margin-top:4px; transition:background .2s,transform .15s;
}
.btn-submit:hover { background:var(--gd); transform:translateY(-1px) }
.btn-submit:active { transform:none }
.form-secure { text-align:center; font-size:.73rem; color:var(--muted); margin-top:10px }

/* ── Urgency Banner ── */
.urgency { background:var(--g); padding:56px 0; text-align:center }
.urgency h2 {
  font-family: var(--font-serif);
  font-size:clamp(1.6rem,3.2vw,2.3rem);
  color:#fff; line-height:1.2; letter-spacing:-.02em;
  max-width:780px; margin:0 auto 14px;
}
.urgency p { color:rgba(255,255,255,.75); font-size:.97rem; max-width:620px; margin:0 auto 28px; line-height:1.7 }
.btn-white {
  background:#fff; color:var(--g); font-weight:700; font-size:1rem;
  padding:13px 32px; border-radius:var(--r); text-decoration:none;
  transition:background .2s,transform .15s; display:inline-block;
}
.btn-white:hover { background:var(--cream); transform:translateY(-2px) }

/* ── Why Cards ── */
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px }
.why-card {
  background:var(--white); border:1px solid var(--bdrh); border-radius:14px;
  padding:32px 26px; transition:box-shadow .25s,transform .25s;
  position:relative; overflow:hidden;
}
.why-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
  background:var(--g); transform:scaleX(0); transform-origin:left; transition:transform .3s;
}
.why-card:hover { box-shadow:var(--shh); transform:translateY(-4px) }
.why-card:hover::after { transform:scaleX(1) }
.why-num {
  font-family: var(--font-serif);
  font-size:3rem; font-weight:bold; color:var(--gl);
  line-height:1; margin-bottom:14px; -webkit-text-stroke:1.5px var(--g)
}
.why-icon { font-size:1.6rem; margin-bottom:12px }
.why-card h3 { font-family: var(--font-serif); font-size:1.12rem; color:var(--ink); margin-bottom:8px }
.why-card p { font-size:.87rem; color:var(--muted); line-height:1.65 }

/* ── Estimator ── */
.estimator-wrap {
  max-width:700px; margin:0 auto; background:var(--white);
  border:1px solid var(--bdrh); border-radius:16px; padding:40px 36px; box-shadow:var(--sh);
}
.est-selects { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:20px }
.est-selects select {
  width:100%; background:var(--cream); border:1px solid var(--bdrh); color:var(--ink);
  padding:12px 13px; border-radius:var(--r); font-size:.92rem;
  font-family: var(--font-body); outline:none; transition:border-color .2s;
  -webkit-appearance:none; cursor:pointer;
}
.est-selects select:focus { border-color:var(--g) }
.btn-est {
  width:100%; background:var(--g); color:#fff; font-family: var(--font-body);
  font-weight:700; font-size:1rem; padding:14px; border:none;
  border-radius:var(--r); cursor:pointer; transition:background .2s; margin-bottom:18px;
}
.btn-est:hover { background:var(--gd) }
.est-result {
  display:none; background:#f0faf4; border:1.5px solid var(--g);
  border-radius:12px; padding:22px 24px; text-align:center;
}
.est-result.show { display:block }
.est-range {
  font-family: var(--font-serif);
  font-size:2rem; font-weight:bold; color:var(--g); margin-bottom:6px
}
.est-note { font-size:.82rem; color:var(--muted); line-height:1.6 }
.est-cta {
  display:block; background:var(--g); color:#fff; font-weight:700;
  font-size:.95rem; padding:12px; border-radius:var(--r);
  text-decoration:none; margin-top:16px; transition:background .2s;
}
.est-cta:hover { background:var(--gd) }

/* ── Coverage Chips ── */
.zone-block { margin-bottom:30px }
.zone-label {
  font-weight:700; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--g); margin-bottom:12px; display:flex; align-items:center; gap:8px;
}
.zone-label::after { content:''; flex:1; height:1px; background:var(--bdrh) }
.chips { display:flex; flex-wrap:wrap; gap:8px }
.chip {
  background:var(--white); border:1px solid var(--bdrh); color:var(--soft);
  font-size:.8rem; font-weight:500; padding:6px 14px; border-radius:100px;
  transition:background .2s,color .2s,border-color .2s; cursor:default;
}
.chip:hover { background:var(--gl); color:var(--gd); border-color:var(--g) }
.sector-note {
  margin-top:24px; background:var(--gl); border:1px solid var(--bdrh);
  border-radius:var(--r); padding:14px 18px; font-size:.85rem; color:var(--gd); font-weight:500;
}

/* ── Stats Row ── */
.stats-row { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-bottom:50px }
.stat-box { background:var(--gl); padding:30px 24px; text-align:center; border:1px solid var(--bdrh) }
.stat-box:first-child { border-radius:12px 0 0 12px }
.stat-box:last-child  { border-radius:0 12px 12px 0 }
.stat-n {
  font-family: var(--font-serif);
  font-size:2.4rem; font-weight:bold; color:var(--g); line-height:1; margin-bottom:6px
}
.stat-l { font-size:.85rem; color:var(--muted); font-weight:500 }

/* ── Reviews ── */
.reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px }
.rev-card {
  background:var(--cream); border:1px solid var(--bdrh);
  border-radius:12px; padding:24px 20px; transition:box-shadow .25s;
}
.rev-card:hover { box-shadow:var(--sh) }
.rev-stars { color:var(--gold); font-size:.9rem; letter-spacing:2px; margin-bottom:12px }
.rev-quote {
  font-family: var(--font-serif);
  font-style:italic; font-size:.92rem; color:var(--soft); line-height:1.7; margin-bottom:18px
}
.rev-author { display:flex; align-items:center; gap:10px }
.rev-av {
  width:38px; height:38px; background:var(--gl); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-serif); font-weight:bold; font-size:.88rem; color:var(--g); flex-shrink:0;
}
.rev-name { font-weight:600; font-size:.87rem; color:var(--ink) }
.rev-loc  { font-size:.74rem; color:var(--muted) }

/* ── Timeline ── */
.timeline {
  position:relative; display:grid; grid-template-columns:repeat(4,1fr);
  gap:0; margin-bottom:50px;
}
.timeline::before {
  content:''; position:absolute; top:28px; left:12.5%; right:12.5%; height:2px;
  background:linear-gradient(90deg,var(--g),rgba(28,105,54,.2)); z-index:0;
}
.t-step {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:0 16px; position:relative; z-index:1
}
.t-num {
  width:56px; height:56px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-family: var(--font-serif); font-weight:bold;
  font-size:1.3rem; margin-bottom:18px; transition:transform .2s;
}
.t-step:first-child .t-num { background:var(--g); color:#fff; box-shadow:0 4px 16px rgba(28,105,54,.3) }
.t-step:not(:first-child) .t-num { background:var(--white); border:2px solid var(--bdrh); color:var(--g) }
.t-step:hover .t-num { transform:scale(1.08) }
.t-step h4 { font-family: var(--font-serif); font-size:1rem; color:var(--ink); margin-bottom:6px }
.t-step p  { font-size:.83rem; color:var(--muted); line-height:1.55 }
.timeline-btns { display:flex; justify-content:center; gap:14px; flex-wrap:wrap }
.btn-green {
  background:var(--g); color:#fff; font-weight:700; font-size:.97rem;
  padding:14px 30px; border-radius:var(--r); text-decoration:none;
  transition:background .2s,transform .15s;
}
.btn-green:hover { background:var(--gd); transform:translateY(-2px) }
.btn-outline-g {
  background:transparent; border:2px solid var(--bdrh); color:var(--ink);
  font-weight:700; font-size:.97rem; padding:12px 30px; border-radius:var(--r);
  text-decoration:none; transition:border-color .2s,color .2s;
}
.btn-outline-g:hover { border-color:var(--g); color:var(--g) }

/* ── FAQ ── */
.faq-list  { max-width:780px; margin:0 auto }
.faq-item  { border-bottom:1px solid var(--bdrh) }
.faq-q {
  width:100%; background:none; border:none; padding:20px 0;
  display:flex; justify-content:space-between; align-items:center;
  cursor:pointer; text-align:left; font-family: var(--font-body);
  font-weight:600; font-size:.96rem; color:var(--ink); gap:16px; transition:color .2s;
}
.faq-q:hover { color:var(--g) }
.faq-ico {
  width:24px; height:24px; border:1.5px solid var(--bdrh); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1rem;
  flex-shrink:0; color:var(--g); transition:transform .3s,background .2s;
}
.faq-item.open .faq-ico { transform:rotate(45deg); background:var(--gl) }
.faq-a {
  max-height:0; overflow:hidden; transition:max-height .35s ease;
  font-size:.9rem; color:var(--muted); line-height:1.75;
}
.faq-a.open { max-height:240px; padding-bottom:18px }
.faq-a strong { color:var(--ink) }

/* ── Final CTA ── */
.final-cta { background:var(--g); padding:80px 0; text-align:center }
.final-cta h2 {
  font-family: var(--font-serif);
  color:#fff; font-size:clamp(1.8rem,3.5vw,2.7rem);
  letter-spacing:-.02em; line-height:1.15; margin-bottom:12px
}
.final-cta p  { color:rgba(255,255,255,.72); font-size:1rem; margin-bottom:36px }
.final-btns { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:24px }
.btn-g-white {
  background:#fff; color:var(--g); font-weight:700; font-size:.97rem;
  padding:14px 28px; border-radius:var(--r); text-decoration:none;
  transition:background .2s,transform .15s;
}
.btn-g-white:hover { background:var(--cream); transform:translateY(-2px) }
.btn-ghost-w {
  background:transparent; border:2px solid rgba(255,255,255,.4); color:#fff;
  font-weight:700; font-size:.97rem; padding:12px 28px; border-radius:var(--r);
  text-decoration:none; transition:border-color .2s,background .2s;
}
.btn-ghost-w:hover { border-color:#fff; background:rgba(255,255,255,.1) }
.final-address { color:rgba(255,255,255,.5); font-size:.8rem }
.final-address a { color:rgba(255,255,255,.65); text-decoration:none }
.final-address a:hover { color:#fff }

/* ── Floating WhatsApp ── */
.wa-float {
  position:fixed; bottom:14px; left:20px; z-index:999;
  background:var(--wa); width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,.38); text-decoration:none;
  font-size:1.45rem; animation:wabounce 3s ease-in-out infinite;
}
@keyframes wabounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }
.fab.fa-whatsapp { color:white }

/* ── Mobile Bar ── */
.mob-bar {
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:999;
  background:var(--white); border-top:1px solid var(--bdrh);
  padding:10px 14px; gap:8px;
}
.mob-bar a {
  flex:1; display:flex; align-items:center; justify-content:center;
  gap:5px; padding:10px; border-radius:var(--r);
  text-decoration:none; font-weight:700; font-size:.82rem;
}
.mb-call { background:var(--g); color:#fff }
.mb-wa   { background:var(--wa); color:#fff }
.mb-q    { background:var(--gl); color:var(--gd) }

/* ── Responsive ── */
@media(max-width:960px) {
  .hero-inner { grid-template-columns:1fr; gap:40px; text-align:center }
  .hero::after { display:none }
  .trust-pills, .soc-proof { justify-content:center }
  .hero-body { max-width:100% }
  .why-grid { grid-template-columns:1fr }
  .est-selects { grid-template-columns:1fr }
  .stats-row { grid-template-columns:1fr }
  .stat-box:first-child { border-radius:12px 12px 0 0 }
  .stat-box:last-child  { border-radius:0 0 12px 12px }
  .reviews-grid { grid-template-columns:1fr }
  .timeline { grid-template-columns:1fr 1fr; gap:30px }
  .timeline::before { display:none }
  .mob-bar { display:flex }
  body { padding-bottom:68px }
  header .btn-wa { display:none }
  .wa-float { display:none }
  .faq-q { padding-left:20px; padding-right:20px }
}
@media(max-width:540px) {
  .timeline { grid-template-columns:1fr }
  .estimator-wrap { padding:28px 20px }
  .final-btns { flex-direction:column; align-items:stretch }
  .btn-g-white, .btn-ghost-w { text-align:center }
  .timeline-btns { flex-direction:column }
  .btn-green, .btn-outline-g { text-align:center }
}

/* ── Back to Top (Left) ── */
    .back-to-top {
      position: fixed;
      bottom: 90px;
      right: 32px;
      z-index: 999;
      width: 44px;
      height: 44px;
      background: var(--g);
      color: #fff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      box-shadow: 0 4px 16px rgba(28,105,54,.30);
      opacity: 0;
      pointer-events: none;
      transition: opacity .3s ease, transform .3s ease;
    }
    .back-to-top.show {
      opacity: 1;
      pointer-events: auto;
    }
    .back-to-top:hover {
      background: var(--gd);
      transform: translateY(-3px);
    }
    .back-to-top i {
      font-size: 1rem;
      color: #fff;
    }