:root{
  --ink:#0F2A24;
  --paper:#F1F7F4;
  --white:#FFFFFF;
  --primary:#00A676;
  --primary-dark:#00815B;
  --accent:#FF6B35;
  --accent-dark:#E5502A;
  --line:#BFE0D2;
  --muted:#4C6259;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Fraunces', serif;
  font-weight:600;
  line-height:1.12;
  margin:0;
  letter-spacing:-0.01em;
}
p{margin:0;}
a{color:inherit;}
.wrap{max-width:880px; margin:0 auto; padding:0 24px;}

/* NAV */
nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 24px;
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:2;
  background:var(--paper);
}
.brand{display:flex; align-items:center; gap:10px; font-family:'Fraunces', serif; font-weight:700; font-size:1.4rem; color:var(--ink);}
.brand svg{width:34px; height:34px; flex-shrink:0;}
footer .brand svg{width:26px; height:26px;}
.nav-cta{
  font-size:0.92rem; font-weight:600;
  text-decoration:none;
  padding:9px 16px;
  border:1.5px solid var(--ink);
  border-radius:3px;
}

/* HERO */
.hero{
  position:relative;
  padding:64px 0 48px;
  overflow:hidden;
}
.hero-media{position:absolute; inset:0; z-index:0; overflow:hidden;}
.hero-bg{
  position:absolute;
  top:-12%; left:-12%;
  width:124%; height:134%;
  object-fit:cover;
  will-change:transform;
  filter:brightness(0.9);
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(15,42,36,0) 0%, rgba(15,42,36,0.1) 55%, var(--paper) 100%);
}
.hero-figura-outer{
  position:absolute;
  right:-30px; bottom:-24px;
  width:170px;
  will-change:transform;
}
.figura-wrap{animation:float 4.5s ease-in-out infinite;}
.parallax-figura{display:block; width:100%; filter:drop-shadow(0 12px 18px rgba(15,42,36,0.16));}
@keyframes float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-12px);}
}
.hero-grid{position:relative; z-index:1; display:flex; flex-direction:column; gap:36px; perspective:900px;}
.hero-content{
  background:rgba(15,42,36,0.6);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-radius:12px;
  padding:26px 24px;
}
.hero h1{font-size:2.5rem; max-width:11ch; color:#FFFFFF;}
.hero-sub{margin-top:18px; font-size:1.08rem; color:#D7E4DE; max-width:46ch;}
.hero-cta-row{margin-top:28px; display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.btn-primary{
  background:var(--primary);
  color:var(--white);
  text-decoration:none;
  padding:14px 26px;
  border-radius:3px;
  font-weight:600;
  font-size:1rem;
  display:inline-block;
  transition:background 0.15s ease;
}
.btn-primary:hover{background:var(--primary-dark);}
.hero-note{font-size:0.9rem; color:#BFD3CA;}

/* PRICE TAG */
.tag{
  position:relative;
  background:var(--white);
  border:1.5px dashed var(--ink);
  border-radius:4px;
  padding:26px 28px;
  max-width:300px;
  transform:rotate(-2deg);
  transform-style:preserve-3d;
  transition:transform 0.15s ease;
}
.tag::before{
  content:"";
  position:absolute;
  top:-9px; left:26px;
  width:16px; height:16px;
  background:var(--paper);
  border:1.5px dashed var(--ink);
  border-radius:50%;
}
.tag-label{font-size:0.82rem; color:var(--muted); font-weight:500;}
.tag-price{font-family:'Fraunces', serif; font-size:2.4rem; font-weight:700; margin-top:2px;}
.tag-price sup{font-size:1rem; font-weight:600; top:-1em;}
.tag-includes{font-size:0.85rem; color:var(--muted); margin-top:6px;}

/* SECTION HEADINGS */
section{padding:52px 0;}
section + section{border-top:1px solid var(--line);}
.section-head{font-size:1.7rem; max-width:20ch; margin-bottom:28px;}

/* INCLUDES LIST (receipt style) */
.receipt{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:4px;
  padding:8px 0;
}
.receipt-row{
  display:flex; justify-content:space-between; gap:16px;
  padding:14px 22px;
  border-bottom:1px dotted var(--line);
  font-size:0.98rem;
}
.receipt-row:last-child{border-bottom:none;}
.receipt-row .item{font-weight:500;}
.receipt-row .status{color:var(--primary); font-weight:600; font-size:0.88rem; white-space:nowrap;}

/* STEPS */
.steps{position:relative; padding-left:8px;}
.step{
  display:flex; gap:20px;
  padding:0 0 30px 0;
  position:relative;
}
.step:last-child{padding-bottom:0;}
.step-num{
  font-family:'Fraunces', serif;
  font-weight:600;
  font-size:1.1rem;
  color:var(--primary);
  width:32px; flex-shrink:0;
  position:relative;
}
.step:not(:last-child) .step-num::after{
  content:"";
  position:absolute;
  top:32px; left:15px;
  width:1.5px; height:calc(100% + 4px);
  background:var(--line);
}
.step h3{font-size:1.08rem; margin-bottom:4px;}
.step p{color:var(--muted); font-size:0.95rem; max-width:52ch;}

/* PRICE MATCH BANNER */
.banner{
  background:var(--ink);
  color:var(--paper);
  border-radius:6px;
  padding:28px 30px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.banner h3{color:var(--white); font-size:1.2rem;}
.banner p{color:#C8D0C6; font-size:0.95rem; max-width:54ch;}

/* PRICE / CTA SECTION */
.price-flex{display:flex; flex-direction:column; gap:18px;}
.price-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  padding:36px 30px;
  text-align:left;
}
.price-card .big{font-size:3rem; font-weight:700;}
.price-card .per{color:var(--muted); font-size:0.95rem;}
.price-fine{margin-top:18px; font-size:0.88rem; color:var(--muted); max-width:56ch;}
.cta-final{margin-top:22px;}

/* FAQ */
.faq-item{padding:18px 0; border-bottom:1px solid var(--line);}
.faq-item:first-child{border-top:1px solid var(--line);}
.faq-question{
  all:unset;
  cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  width:100%;
  font-size:1.02rem; font-weight:600;
  font-family:'IBM Plex Sans', sans-serif;
}
.faq-icon{position:relative; width:16px; height:16px; flex-shrink:0;}
.faq-icon::before, .faq-icon::after{
  content:""; position:absolute; background:var(--ink);
  transition:transform 0.2s ease, opacity 0.2s ease;
}
.faq-icon::before{width:100%; height:2px; top:50%; left:0; transform:translateY(-50%);}
.faq-icon::after{width:2px; height:100%; left:50%; top:0; transform:translateX(-50%);}
.faq-item.active .faq-icon::after{opacity:0; transform:translateX(-50%) rotate(90deg);}
.faq-answer{
  max-height:0; overflow:hidden;
  color:var(--muted); font-size:0.95rem;
  transition:max-height 0.25s ease, margin-top 0.25s ease;
}
.faq-item.active .faq-answer{max-height:240px; margin-top:10px;}

footer{padding:40px 0 56px; color:var(--muted); font-size:0.88rem; position:relative; z-index:1;}
footer .brand{margin-bottom:6px; display:block; color:var(--ink);}

/* SCROLL REVEAL */
.reveal{opacity:0; transform:translateY(22px); transition:opacity 0.6s ease, transform 0.6s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* NAV con sombra al scrollear */
nav{transition:box-shadow 0.2s ease;}
nav.scrolled{box-shadow:0 2px 12px rgba(15,42,36,0.1);}

@media (min-width:760px){
  .hero-grid{flex-direction:row; align-items:flex-start; justify-content:space-between;}
  .hero h1{font-size:3.1rem;}
  .hero-content{max-width:520px;}
  .hero-figura-outer{width:230px; right:20px; bottom:-30px;}
  .price-flex{flex-direction:row; gap:24px; align-items:stretch;}
  .price-card{flex:1;}
}

/* BOTONES FLOTANTES */
.social-float{
  position:fixed;
  right:20px; bottom:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  z-index:100;
}
.social-float a{
  width:58px; height:58px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  text-decoration:none;
  box-shadow:0 8px 20px rgba(15,42,36,0.28);
  position:relative;
}
.social-float svg{width:32px; height:32px; position:relative; z-index:1;}

.whatsapp-btn{background:#25D366; animation:latido 1.8s ease-in-out infinite;}
.whatsapp-btn:hover{background:#1EBE59;}
.whatsapp-btn::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:#25D366;
  z-index:0;
  animation:onda 1.8s ease-out infinite;
}

.instagram-btn{background:radial-gradient(circle at 30% 110%, #FDF497 0%, #FD5949 45%, #D6249F 60%, #285AEB 90%);}
.instagram-btn:hover{filter:brightness(1.08);}

@keyframes latido{
  0%,45%,100%{transform:scale(1);}
  22%{transform:scale(1.1);}
}
@keyframes onda{
  0%{transform:scale(1); opacity:0.55;}
  100%{transform:scale(1.9); opacity:0;}
}

/* MAPA DE COBERTURA */
.map-wrap{
  border-radius:6px;
  overflow:hidden;
  border:1px solid var(--line);
  aspect-ratio:16/9;
}
.map-wrap iframe{width:100%; height:100%; border:0; display:block;}

@media (prefers-reduced-motion: reduce){
  .figura-wrap{animation:none;}
  .tag{transition:none;}
  .hero-bg, .hero-figura-outer{transform:none !important;}
  .whatsapp-btn, .whatsapp-btn::before{animation:none;}
}