:root{
  --cream:#F7F1E4;
  --cream-2:#EFE6D2;
  --ink:#2B2A25;
  --ink-soft:#5C5A50;
  --teal:#234C58;
  --teal-deep:#173A44;
  --aqua:#7FB8C4;
  --olive:#5F7A3D;
  --olive-deep:#4A6130;
  --terracotta:#B07D63;
  --terracotta-deep:#8F6350;
  --sand:#E4D3B8;
  --white:#FBF8F1;
  --radius:22px;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Quicksand',sans-serif;
  line-height:1.5;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1080px; margin:0 auto; padding:0 28px;}
button, input{font-family:inherit;}

/* NAV */
nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 28px; max-width:1080px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand-mark{width:40px; height:40px;}
.brand-name{font-family:'Caveat',cursive; font-size:2rem; font-weight:700; color:var(--teal-deep);}
.nav-links{display:flex; gap:26px; font-weight:600; font-size:0.95rem; color:var(--teal-deep);}
.nav-cta{
  background:var(--olive); color:var(--white); padding:10px 20px; border-radius:100px;
  font-weight:700; font-size:0.9rem;
}
@media(max-width:720px){ .nav-links{display:none;} }

/* HERO */
.hero{
  position:relative;
  background:linear-gradient(180deg, var(--teal) 0%, var(--teal-deep) 100%);
  color:var(--white);
  border-radius:0 0 60px 60px;
  padding:70px 28px 130px;
  overflow:hidden;
}
.hero .wrap{position:relative; z-index:2; text-align:center;}
.eyebrow{
  font-weight:700; letter-spacing:2px; text-transform:uppercase; font-size:.72rem;
  color:var(--sand); margin-bottom:14px;
}
.hero h1{
  font-family:'Caveat',cursive; font-weight:700; font-size:clamp(3rem,9vw,5.4rem);
  line-height:0.95; color:var(--white); text-shadow:0 4px 18px rgba(0,0,0,.15);
}
.hero p.tagline{max-width:520px; margin:18px auto 0; font-size:1.05rem; color:#EAF2F0; font-weight:500;}
.hero-ctas{display:flex; gap:14px; justify-content:center; margin-top:30px; flex-wrap:wrap;}
.btn-primary{
  background:var(--terracotta); color:var(--white); padding:14px 26px; border-radius:100px;
  font-weight:700; box-shadow:0 8px 20px rgba(176,125,99,.35); border:none; cursor:pointer; font-size:1rem;
}
.btn-secondary{
  background:transparent; color:var(--white); padding:14px 26px; border-radius:100px;
  font-weight:700; border:2px solid rgba(255,255,255,.55);
}
.waves{position:absolute; left:0; right:0; bottom:-2px; z-index:1;}

/* ALOK SAYS */
.alok-says{
  max-width:760px; margin:-70px auto 70px; position:relative; z-index:3;
  background:var(--white); border-radius:var(--radius); padding:36px 40px;
  box-shadow:0 20px 40px rgba(23,58,68,.14);
  display:flex; gap:22px; align-items:flex-start;
}
.paw{width:46px; flex:none; margin-top:4px;}
.alok-says p{font-size:1.08rem; color:var(--ink-soft);}
.alok-says .signed{display:block; margin-top:10px; font-family:'Caveat',cursive; font-size:1.4rem; color:var(--terracotta-deep); font-weight:700;}
@media(max-width:600px){ .alok-says{flex-direction:column; padding:28px 24px;} }

/* SECTIONS */
.section{padding:60px 0;}
.section-head{text-align:center; max-width:600px; margin:0 auto 40px;}
.section-head .eyebrow{color:var(--terracotta-deep);}
.section-head h2{font-family:'Caveat',cursive; font-size:2.6rem; color:var(--teal-deep); font-weight:700;}
.section-head p{color:var(--ink-soft); margin-top:6px;}

/* WHY CARDS */
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
@media(max-width:800px){ .why-grid{grid-template-columns:1fr;} }
.why-card{background:var(--white); border-radius:var(--radius); padding:30px 26px; border-top:5px solid var(--aqua);}
.why-card:nth-child(2){border-top-color:var(--olive);}
.why-card:nth-child(3){border-top-color:var(--terracotta);}
.why-card h3{font-size:1.1rem; color:var(--teal-deep); margin-bottom:8px; font-weight:700;}
.why-card p{font-size:.94rem; color:var(--ink-soft);}

/* CALCULATOR */
.calc-band{background:var(--teal-deep); border-radius:60px; color:var(--white);}
.calc-box{
  background:var(--white); border-radius:var(--radius); padding:34px; max-width:820px; margin:0 auto;
  box-shadow:0 20px 40px rgba(0,0,0,.18);
}
.calc-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:14px; align-items:end;}
@media(max-width:720px){ .calc-grid{grid-template-columns:1fr 1fr;} .calc-grid button{grid-column:1/-1 !important;} }
.field label{display:block; font-size:.82rem; font-weight:700; color:var(--teal-deep); margin-bottom:6px;}
.field input{
  width:100%; padding:12px 14px; border-radius:12px; border:2px solid var(--cream-2);
  font-size:.95rem; color:var(--ink); background:var(--cream);
}
.field input:focus{outline:none; border-color:var(--aqua);}
.calc-submit{
  background:var(--olive); color:var(--white); border:none; padding:13px 22px; border-radius:12px;
  font-weight:700; cursor:pointer; font-size:.95rem; white-space:nowrap;
}
.calc-submit:hover{background:var(--olive-deep);}
.calc-error{color:#C0503E; font-size:.85rem; margin-top:12px; font-weight:600;}

.results{margin-top:30px; display:flex; flex-direction:column; gap:16px;}
.result-card{
  background:var(--cream); border-radius:16px; padding:20px 22px; display:flex; justify-content:space-between;
  align-items:center; gap:16px; flex-wrap:wrap; border-left:6px solid var(--aqua);
}
.result-card.sand{border-left-color:var(--sand);}
.result-card.olive{border-left-color:var(--olive);}
.result-card.terracotta{border-left-color:var(--terracotta);}
.result-card.teal{border-left-color:var(--teal);}
.result-info h4{color:var(--teal-deep); font-size:1.05rem; margin-bottom:4px;}
.result-info p{color:var(--ink-soft); font-size:.85rem;}
.result-price{text-align:right;}
.result-price .total{font-family:'Caveat',cursive; font-size:1.9rem; color:var(--terracotta-deep); font-weight:700; line-height:1;}
.result-price .breakdown{font-size:.78rem; color:var(--ink-soft);}
.result-wa{
  background:#25D366; color:#fff; padding:10px 18px; border-radius:100px; font-weight:700; font-size:.88rem;
  display:inline-flex; align-items:center; gap:6px;
}
.no-results{
  background:var(--cream); border-radius:16px; padding:24px; text-align:center; color:var(--ink-soft);
}
.no-results a{color:var(--terracotta-deep); font-weight:700; text-decoration:underline;}

/* DEPARTAMENTOS */
.dept-band{background:var(--cream-2);}
.dept-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
@media(max-width:900px){ .dept-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:520px){ .dept-grid{grid-template-columns:1fr;} }
.dept-card{background:var(--white); border-radius:16px; overflow:hidden; box-shadow:0 8px 18px rgba(43,42,37,.06);}
.dept-photo{height:110px;}
.dept-photo.aqua{background:linear-gradient(135deg,var(--aqua),var(--teal));}
.dept-photo.sand{background:linear-gradient(135deg,var(--sand),var(--terracotta));}
.dept-photo.olive{background:linear-gradient(135deg,var(--olive),var(--teal-deep));}
.dept-photo.terracotta{background:linear-gradient(135deg,var(--terracotta),var(--olive-deep));}
.dept-photo.teal{background:linear-gradient(135deg,var(--teal),var(--sand));}
.dept-info{padding:16px 16px 20px;}
.dept-info h4{font-size:.98rem; color:var(--teal-deep); font-weight:700;}
.dept-info span{font-size:.82rem; color:var(--ink-soft);}

/* LOCATION */
.loc{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;}
@media(max-width:800px){ .loc{grid-template-columns:1fr;} }
.loc-map{
  height:260px; border-radius:var(--radius);
  background:
    radial-gradient(circle at 30% 40%, rgba(127,184,196,.55), transparent 55%),
    radial-gradient(circle at 70% 65%, rgba(95,122,61,.4), transparent 50%),
    var(--teal-deep);
  position:relative;
}
.loc-map::after{content:"📍"; position:absolute; left:50%; top:50%; transform:translate(-50%,-60%); font-size:2rem;}
.loc-list li{margin-bottom:10px; font-size:.96rem; color:var(--ink-soft); list-style:none; padding-left:24px; position:relative;}
.loc-list li::before{content:"🐾"; position:absolute; left:0; font-size:.85rem;}
.loc h2{font-family:'Caveat',cursive; font-size:2.2rem; color:var(--teal-deep);}

/* FOOTER */
footer{
  background:var(--teal-deep); color:var(--white);
  border-radius:60px 60px 0 0; padding:50px 28px 30px; margin-top:40px; text-align:center;
}
footer .brand-name{color:var(--sand);}
footer p{color:#C9DAD7; font-size:.9rem; margin-top:8px;}
.foot-links{display:flex; gap:20px; justify-content:center; margin-top:20px; font-weight:700;}
.foot-fine{margin-top:30px; font-size:.78rem; color:#8CA9A4;}

/* FLOATING WHATSAPP */
.wa-float{
  position:fixed; right:20px; bottom:20px; background:#25D366; color:#fff; width:56px; height:56px;
  border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  box-shadow:0 8px 20px rgba(0,0,0,.25); z-index:50;
}