:root{
  --bg:#F8F6F2;           /* beige suave */
  --text:#4A4A4A;         /* texto */
  --muted:#6b6b6b;        /* texto secundario */  
  --menutexto:#7A5DB0;    /* texto menu */
  --primary:#B9A5E0;      /* botones */
  --primary-700:#7A5DB0;  /* hover */
  --lilac:#B9A5E0;        /* citas */
  --card:#ffffff;         /* tarjetas */
  --shadow:0 10px 30px transparent ;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:'Lora', serif; color:var(--text); background:var(--bg);
}
img{max-width:100%; height:auto; display:block}
.container{width:min(1100px, 92%); margin:0 auto}
.narrow{width:min(820px, 92%)}
.section{padding:10px 0 60px 0}
.section.alt{background:#fff}

/* Header */
.site-header{position:sticky; top:0; background:#fff; box-shadow:var(--shadow); z-index:20}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0; position:relative}
.brand{display:flex; flex-direction:column}
.logo-mark{width:65px; height:65px; display:inline-block; padding-right: 5PX;}
.brand-text{font-family:'Montserrat', sans-serif; font-weight:700; letter-spacing:.3px}
.brand-sub{font-size:.9rem; color:var(--muted)}

/* Desktop nav */
.nav-list{display:flex; gap:18px; align-items:center; list-style:none; margin:0; padding:0}
.nav a{color:var(--menutexto); text-decoration:none; font-family:'Montserrat', sans-serif; font-weight:600}

/* HAMBURGER (botón móvil con animación a X) */
.hamburger{display:none; position:relative; width:40px; height:40px; background:transparent; border:0; cursor:pointer}
.hamburger span{position:absolute; left:8px; width:24px; height:2px; background:var(--text); transition:transform .3s ease, opacity .2s ease, top .3s ease}
.hamburger span:nth-child(1){top:12px}
.hamburger span:nth-child(2){top:19px}
.hamburger span:nth-child(3){top:26px}
.hamburger.active span:nth-child(1){transform:rotate(45deg); top:19px}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg); top:19px}

/* Overlay + panel de menú móvil */
.overlay{position:fixed; inset:0; background:rgba(0,0,0,.4); opacity:0; pointer-events:none; transition:opacity .3s ease; z-index:18}
.overlay.active{opacity:1; pointer-events:auto}
.overlay-menu{position:fixed; top:0; right:-300px; width:300px; height:100vh; background:#fff; box-shadow:-2px 0 16px rgba(0,0,0,.18); display:flex; flex-direction:column; gap:12px; padding:24px; transition:right .3s ease; z-index:19}
.overlay-menu.active{right:0}
.overlay-menu a{font-family:'Montserrat', sans-serif; font-size:18px; text-decoration:none; color:var(--text); padding:10px 0}

/* Hero */
.hero{padding:90px 0}
.grid-2{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center}
.hero-title{font-family:'Playfair Display', serif; font-size:48px; line-height:1.15; margin:0 0 16px}
.hero-title .accent{color:var(--lilac); font-style:italic}
.lead{font-size:1.05rem}
.hero-img{border-radius:12px; box-shadow:var(--shadow)}

/* Tipografías y citas */
h1,h2,h3,h4{font-family:'Montserrat', sans-serif}
h2{font-size:32px; margin:0 0 18px}
h3{font-size:22px; margin:26px 0 10px}
.quote,.card-quote{font-family:'Playfair Display', serif; font-style:italic; color:var(--lilac); font-size:20px; margin-top:14px}

/* Botones */
.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:8px; text-decoration:none; font-family:'Montserrat', sans-serif; font-weight:600}
.btn-primary{background:var(--primary); color:#fff}
.btn-primary:hover{background:var(--primary-700)}
.i{width:18px; height:18px}

/* Listas y tarjetas */
.check-list{padding-left:1rem}
.check-list li{margin:8px 0}
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.card{background:var(--card); border-radius:12px; box-shadow:var(--shadow); padding:0}
.card-head{display:flex; align-items:center; gap:10px; padding:14px 16px; font-weight:700; font-family:'Montserrat', sans-serif; border-bottom:1px solid #eee}
.card-body{list-style:disc; padding:14px 32px}
.card-quote{padding:0 16px 16px}

/* Steps */
.steps{counter-reset:step; list-style:none; padding-left:0}
.steps li{position:relative; margin:12px 0 12px 38px}
.steps li::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:-38px; top:0; width:28px; height:28px; border-radius:50%; background:var(--primary); color:#fff; display:grid; place-items:center; font-weight:700; font-family:'Montserrat', sans-serif
}

/* Varias */
.rounded{border-radius:12px}
.shadow{box-shadow:var(--shadow)}
.mt-20{margin-top:20px}
.cta-group{margin-top:14px; display:flex; gap:12px; flex-wrap:wrap}
.cta-center{display:flex; justify-content:center; margin-top:16px}

/* Pricing */
.pricing{display:flex; justify-content:center; margin-top:20px}
.price-card{background:#fff; border-radius:12px; box-shadow:var(--shadow); padding:20px 22px; display:grid; gap:8px; text-align:center}
.price-line{font-size:1.05rem}

/* Mapa */
.map{width:100%; min-height:280px; border:0; border-radius:12px; box-shadow:var(--shadow)}

/* Formulario */
.contact-form{display:grid; gap:14px; margin:16px 0 22px}
.contact-form label{font-family:'Montserrat', sans-serif; font-weight:600; display:flex; flex-direction:column; gap:6px}
.contact-form input, .contact-form textarea{padding:12px 14px; border-radius:8px; border:1px solid #ccc; font-family:'Lora', serif; font-size:1rem; outline:none}
.contact-form input:focus, .contact-form textarea:focus{border-color:var(--primary)}
.contact-form .consent{font-weight:500; font-size:.95rem; display:flex; flex-direction:row; align-items:center; gap:10px}
.form-status{margin-top:6px; font-family:'Montserrat', sans-serif; font-size:.95rem; color:var(--primary)}
.small{color:var(--muted)}

/* Footer */
.site-footer{background:#fff; padding:28px 0; margin-top:40px}
.footer-inner{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap}
.footer-nav a{color:var(--muted); text-decoration:none; margin:0 6px}

/* Responsive */
@media (max-width: 980px){
  .grid-2{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
.nav-list{display:none}
  .hamburger{display:inline-block}
}
@media (max-width: 680px){
  .nav-list{display:none}
  .hamburger{display:inline-block}
  .hero-title{font-size:36px}
  .cards{grid-template-columns:1fr}
  body.no-scroll{overflow:hidden}
}