/* Estilos de amato.cl */
/* =========================================================
   COLORES — cámbialos aquí si quieres otro estilo
   ========================================================= */
:root{
  --noche:#0f2a26;       /* fondo oscuro principal */
  --noche-2:#163a34;
  --jade:#2f7a68;
  --menta:#9fe0cc;       /* brillo */
  --oro:#e3a857;         /* acento cálido */
  --coral:#e07a55;
  --crema:#fbf6ee;
  --texto:#1d2b28;
  --suave:#5f6e6a;
  --wa:#22c55e;
  --radio:24px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--texto);background:var(--crema);line-height:1.65;font-size:17px;overflow-x:hidden}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;line-height:1.1;font-weight:500}
em{font-style:italic;color:var(--oro)}
.contenedor{max-width:1160px;margin:0 auto;padding:0 24px}
section{padding:110px 0;position:relative}
.etiqueta{display:inline-flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--jade);margin-bottom:18px}
.etiqueta::before{content:"";width:28px;height:2px;background:currentColor}
h2{font-size:clamp(32px,4.6vw,54px);margin-bottom:20px;color:var(--noche)}
.intro{color:var(--suave);max-width:620px;font-size:19px}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:10px;padding:17px 32px;border-radius:999px;font-weight:700;text-decoration:none;font-size:16px;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn svg{width:22px;height:22px;fill:currentColor}
.btn-wa{background:var(--wa);color:#05230f;box-shadow:0 10px 30px rgba(34,197,94,.35)}
.btn-wa:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(34,197,94,.5)}
.btn-oro{background:var(--oro);color:var(--noche)}
.btn-oro:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(227,168,87,.45)}
.btn-vidrio{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.25)}
.btn-vidrio:hover{background:rgba(255,255,255,.16)}
.pulso{animation:pulso 2.4s infinite}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}70%{box-shadow:0 0 0 18px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}

/* Encabezado */
header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s}
header.solido{background:rgba(15,42,38,.92);backdrop-filter:blur(12px);box-shadow:0 6px 24px rgba(0,0,0,.18)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.logo{font-family:'Fraunces',serif;font-size:26px;font-weight:700;color:#fff;text-decoration:none;display:flex;align-items:center;gap:10px}
.logo i{width:30px;height:30px;border-radius:50%;background:conic-gradient(var(--menta) 0 50%,var(--oro) 50% 100%);display:inline-block}
.menu{display:flex;gap:30px;list-style:none;font-size:15px}
.menu a{text-decoration:none;color:rgba(255,255,255,.8);transition:color .2s}
.menu a:hover{color:var(--menta)}
.nav .btn{padding:11px 22px;font-size:15px}
@media(max-width:900px){.menu{display:none}}

/* Portada */
.hero{background:radial-gradient(ellipse at 75% 40%,#1f5a4d 0%,var(--noche) 55%,#0a1f1c 100%);color:#fff;min-height:100vh;display:flex;align-items:center;padding:130px 0 90px;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:120px;background:linear-gradient(transparent,rgba(10,31,28,.6))}
.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;position:relative;z-index:2}
.hero .etiqueta{color:var(--menta)}
.hero h1{font-size:clamp(44px,6.8vw,84px);font-weight:300;margin-bottom:26px;letter-spacing:-.01em}
.hero h1 strong{font-weight:700;background:linear-gradient(90deg,var(--menta),var(--oro));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:20px;color:rgba(255,255,255,.78);margin-bottom:38px;max-width:540px}
.hero-botones{display:flex;flex-wrap:wrap;gap:14px}
.sello{margin-top:44px;display:inline-flex;align-items:center;gap:14px;padding:12px 20px 12px 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);font-size:15px;color:rgba(255,255,255,.85)}
.sello b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--oro);color:var(--noche);font-family:'Fraunces',serif;font-size:14px}
.campo{width:100%;max-width:560px;margin:0 auto;filter:drop-shadow(0 0 40px rgba(159,224,204,.25))}
.campo .linea{fill:none;stroke:url(#grad);stroke-width:1.6;stroke-dasharray:6 10;animation:fluir 3s linear infinite;opacity:.8}
.campo .linea:nth-child(even){animation-duration:4.2s;opacity:.5}
@keyframes fluir{to{stroke-dashoffset:-64}}
.campo .halo{animation:latido 4s ease-in-out infinite;transform-origin:center}
@keyframes latido{50%{opacity:.35;transform:scale(1.08)}}
.flotar{animation:flotar 6s ease-in-out infinite}
@keyframes flotar{50%{transform:translateY(-12px)}}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.campo{max-width:380px}.hero{text-align:left}}

/* Franja de beneficios */
.franja{background:var(--oro);color:var(--noche);padding:20px 0;overflow:hidden;white-space:nowrap}
.franja-pista{display:inline-flex;gap:50px;animation:desliza 28s linear infinite;font-family:'Fraunces',serif;font-size:22px}
.franja-pista span::before{content:"✦";margin-right:50px;color:var(--noche);opacity:.5}
@keyframes desliza{to{transform:translateX(-50%)}}

/* Qué es */
.que-es-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.que-es-grid p+p{margin-top:18px}
.que-es-grid p{font-size:18px;color:#3a4845}
.transparencia{background:var(--noche);color:#fff;border-radius:var(--radio);padding:40px;position:relative;overflow:hidden}
.transparencia::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:radial-gradient(var(--jade),transparent 70%);top:-90px;right:-90px;opacity:.6}
.transparencia h3{font-size:26px;margin-bottom:14px;color:var(--menta);position:relative}
.transparencia p{color:rgba(255,255,255,.82);font-size:16.5px;position:relative}
@media(max-width:900px){.que-es-grid{grid-template-columns:1fr;gap:40px}}

/* Cifras */
.cifras{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:70px}
.cifra{background:#fff;border-radius:var(--radio);padding:34px 28px;box-shadow:0 10px 40px rgba(15,42,38,.06)}
.cifra .n{font-family:'Fraunces',serif;font-size:56px;font-weight:700;line-height:1;background:linear-gradient(135deg,var(--jade),var(--oro));-webkit-background-clip:text;background-clip:text;color:transparent}
.cifra p{color:var(--suave);margin-top:10px}
@media(max-width:760px){.cifras{grid-template-columns:1fr}}

/* Sesión */
.sesion{background:linear-gradient(180deg,#eef5f1,var(--crema))}
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:56px;counter-reset:p}
.paso{background:#fff;border-radius:var(--radio);padding:34px 28px;position:relative;transition:transform .3s,box-shadow .3s;border:1px solid rgba(47,122,104,.1)}
.paso:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(15,42,38,.12)}
.paso .ico{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:26px;margin-bottom:20px;background:linear-gradient(135deg,var(--menta),#d8f3ea)}
.paso:nth-child(2) .ico{background:linear-gradient(135deg,#f6d9a8,#fbeedb)}
.paso:nth-child(3) .ico{background:linear-gradient(135deg,#f3b9a2,#fbe3d9)}
.paso:nth-child(4) .ico{background:linear-gradient(135deg,#bfe0d6,#e6f3ef)}
.paso .num{position:absolute;top:24px;right:26px;font-family:'Fraunces',serif;font-size:44px;color:rgba(47,122,104,.12);font-weight:700}
.paso h3{font-size:22px;margin-bottom:8px;color:var(--noche)}
.paso p{font-size:15.5px;color:var(--suave)}
@media(max-width:960px){.pasos{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.pasos{grid-template-columns:1fr}}

/* Sobre mí */
.sobre-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.marco{position:relative}
.marco::before{content:"";position:absolute;inset:24px -24px -24px 24px;border-radius:var(--radio);background:linear-gradient(135deg,var(--oro),var(--coral));z-index:0}
.foto{position:relative;z-index:1;aspect-ratio:4/5;border-radius:var(--radio);background:linear-gradient(160deg,var(--noche-2),var(--noche));display:grid;place-items:center;color:rgba(255,255,255,.6);font-size:15px;text-align:center;padding:20px;overflow:hidden}
.foto img{width:100%;height:100%;object-fit:cover}
.cita{font-family:'Fraunces',serif;font-style:italic;font-size:24px;color:var(--jade);border-left:3px solid var(--oro);padding-left:22px;margin:26px 0}
.sobre-grid p{font-size:18px;color:#3a4845}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.chip{padding:10px 18px;border-radius:999px;background:#fff;border:1px solid rgba(47,122,104,.2);font-size:15px;font-weight:600;color:var(--noche)}
@media(max-width:900px){.sobre-grid{grid-template-columns:1fr;gap:56px}.marco{max-width:420px}}

/* Servicios */
.servicios{background:var(--noche);color:#fff;overflow:hidden}
.servicios h2{color:#fff}
.servicios .etiqueta{color:var(--menta)}
.servicios .intro{color:rgba(255,255,255,.7)}
.servicios::before{content:"";position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(rgba(47,122,104,.55),transparent 70%);left:-200px;bottom:-250px}
.tarjetas{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:56px;position:relative}
.tarjeta{border-radius:var(--radio);padding:42px;display:flex;flex-direction:column;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);transition:transform .3s}
.tarjeta:hover{transform:translateY(-6px)}
.tarjeta.destacada{background:linear-gradient(160deg,#fff,#f4efe5);color:var(--texto);border:none;box-shadow:0 30px 60px rgba(0,0,0,.3)}
.badge{align-self:flex-start;background:var(--oro);color:var(--noche);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:7px 14px;border-radius:999px;margin-bottom:18px}
.tarjeta h3{font-size:30px;margin-bottom:6px}
.tarjeta.destacada h3{color:var(--noche)}
.tarjeta .meta{opacity:.7;font-size:15px;margin-bottom:20px}
.tarjeta .precio{font-family:'Fraunces',serif;font-size:46px;font-weight:700;margin-bottom:22px}
.tarjeta.destacada .precio{color:var(--jade)}
.tarjeta ul{list-style:none;margin-bottom:32px;flex:1}
.tarjeta li{padding:10px 0 10px 30px;position:relative;font-size:16px;border-bottom:1px solid rgba(127,127,127,.18)}
.tarjeta li::before{content:"✓";position:absolute;left:0;color:var(--menta);font-weight:700}
.tarjeta.destacada li::before{color:var(--jade)}
.tarjeta .btn{align-self:flex-start}
@media(max-width:800px){.tarjetas{grid-template-columns:1fr}}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:start}
details{background:#fff;border-radius:18px;margin-bottom:14px;padding:0 28px;border:1px solid rgba(47,122,104,.1);transition:box-shadow .2s}
details[open]{box-shadow:0 14px 40px rgba(15,42,38,.08)}
summary{cursor:pointer;padding:24px 0;font-weight:600;font-size:17.5px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eef5f1;color:var(--jade);font-size:22px;transition:transform .3s}
details[open] summary::after{transform:rotate(45deg);background:var(--oro);color:var(--noche)}
details p{padding-bottom:24px;color:var(--suave)}
@media(max-width:900px){.faq-grid{grid-template-columns:1fr;gap:20px}}

/* CTA final */
.cta{background:radial-gradient(ellipse at 20% 0%,#2f7a68,var(--noche) 60%);color:#fff;text-align:center;border-radius:36px;padding:90px 28px;position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;border:1px solid rgba(159,224,204,.2);right:-120px;bottom:-160px;box-shadow:0 0 0 60px rgba(159,224,204,.04),0 0 0 120px rgba(159,224,204,.03)}
.cta h2{color:#fff;font-size:clamp(36px,5.5vw,64px)}
.cta p{color:rgba(255,255,255,.78);max-width:560px;margin:0 auto 36px;font-size:19px}
.cta .datos{margin-top:40px;font-size:15px;color:rgba(255,255,255,.75);display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px;position:relative;z-index:1}
.cta .datos a{color:var(--menta)}
.cta .btn{position:relative;z-index:1}

.aviso{font-size:14px;color:var(--suave);border:1px dashed rgba(47,122,104,.35);border-radius:18px;padding:24px 28px;margin-top:44px}
footer{padding:36px 0 120px;font-size:14px;color:var(--suave);text-align:center}

/* Botón flotante */
.flotante{position:fixed;right:22px;bottom:22px;z-index:60;background:var(--wa);color:#05230f;border-radius:999px;padding:15px 22px;display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.flotante svg{width:26px;height:26px;fill:currentColor}
@media(max-width:560px){.flotante span{display:none}.flotante{padding:17px}}

/* Aparición al hacer scroll */
.revelar{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s ease}
.revelar.visible{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.revelar{opacity:1;transform:none}}
