/* ===== Grupo AMA — Home (hi-fi, dirección "Método") ===== */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&display=swap');

:root{
  --cyan:#18D8F0; --blue:#3D7BEF; --violet:#6048F0; --indigo:#2E2E78;
  --grad:linear-gradient(115deg,#18D8F0 0%,#3D7BEF 46%,#6048F0 100%);
  --grad-soft:linear-gradient(120deg,rgba(24,216,240,.12),rgba(96,72,240,.12));
  --ink:#16172a; --ink2:#1d1f38;
  --text:#23243a; --sub:#6b7191; --faint:#9aa0bd;
  --line:#e6e9f4; --line2:#d9dcec; --soft:#f5f7fc; --paper:#fff;
  --maxw:1180px; --pad:40px; --radius:16px;
  --shadow-sm:0 2px 10px rgba(30,40,90,.05);
  --shadow:0 18px 50px -16px rgba(40,46,110,.22);
  --shadow-lg:0 40px 90px -30px rgba(48,46,120,.4);
  font-synthesis:none;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; font-family:'DM Sans',system-ui,sans-serif; color:var(--text);
  background:var(--paper); -webkit-font-smoothing:antialiased; line-height:1.5;
  font-size:17px;
}
h1,h2,h3,h4,h5{margin:0; letter-spacing:-.02em; line-height:1.08; color:var(--ink); font-weight:600;}
p{margin:0;}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--pad);}
.grad-text{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.eyebrow{display:inline-flex; align-items:center; gap:9px; font-size:13px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--violet);}
.eyebrow::before{content:""; width:22px; height:2px; border-radius:2px; background:var(--violet); opacity:.8;}
.eyebrow.on-dark{color:var(--cyan);} .eyebrow.on-dark::before{background:var(--cyan);}
.eyebrow.eyebrow-white{color:#fff;} .eyebrow.eyebrow-white::before{background:#fff;}
.eyebrow.center{justify-content:center;}

/* ---- buttons ---- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; cursor:pointer;
  font:inherit; font-weight:600; font-size:15.5px; line-height:1; letter-spacing:.005em;
  padding:15px 26px; border-radius:999px; border:1.6px solid transparent; white-space:nowrap;
  transition:transform .18s ease, box-shadow .25s ease, background .2s ease, color .2s ease, border-color .2s ease;}
.btn .ico{font-size:19px; line-height:0;}
.btn-solid{background:var(--grad); color:#fff; box-shadow:0 10px 26px -10px rgba(96,72,240,.6);}
.btn-solid:hover{transform:translateY(-2px); box-shadow:0 18px 40px -12px rgba(96,72,240,.7);}
.btn-outline{background:transparent; color:var(--ink); border-color:var(--line2);}
.btn-outline:hover{border-color:var(--violet); color:var(--violet); transform:translateY(-2px);}
.btn-ghost{background:transparent; color:var(--violet); padding-left:6px; padding-right:6px;}
.btn-ghost:hover{gap:13px;}
.btn-white{background:#fff; color:var(--violet);}
.btn-white:hover{transform:translateY(-2px); box-shadow:0 16px 36px -14px rgba(0,0,0,.4);}
.btn-sm{padding:11px 18px; font-size:14px;}
.btn-lg{padding:17px 32px; font-size:16.5px;}

/* ---- nav ---- */
.nav{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(16px); border-bottom:1px solid var(--line);}
.nav-inner{display:flex; align-items:center; justify-content:space-between; height:76px;}
.brand{display:flex; align-items:center; gap:11px;}
.brand img{height:40px; width:auto;}
.brand .wm{font-weight:700; font-size:19px; letter-spacing:.04em; color:var(--ink);}
.nav-links{display:flex; gap:30px; align-items:center;}
.nav-links a{font-size:15px; color:var(--sub); font-weight:500; position:relative; padding:6px 0; white-space:nowrap;}
.nav-links a:hover{color:var(--ink);}
.nav-links a.active{color:var(--ink);}
.nav-links a.active::after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  border-radius:2px; background:var(--grad);}
.nav-cta{display:flex; align-items:center; gap:14px;}
.burger{display:none;}

/* ---- hero (full-bleed photo + overlay copy) ---- */
.hero{position:relative; overflow:hidden; min-height:max(640px, calc(100svh - 76px));
  display:flex; background:#0e0f1d;}
.hero-bg{position:absolute !important; inset:0; width:100% !important; height:100% !important;
  z-index:0; display:block;}
/* scrim: dark on the left (under the copy) fading right, plus a base bottom darkening */
.hero-scrim{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(10,11,26,.82) 0%, rgba(10,11,26,.6) 34%, rgba(10,11,26,.12) 64%, rgba(10,11,26,0) 88%),
    linear-gradient(0deg, rgba(10,11,26,.55) 0%, rgba(10,11,26,0) 38%);}
/* when a photo is present, deepen the scrim a touch for contrast */
.hero:has(.hero-bg[data-filled]) .hero-scrim{background:
    linear-gradient(90deg, rgba(10,11,26,.86) 0%, rgba(10,11,26,.66) 36%, rgba(10,11,26,.2) 66%, rgba(10,11,26,0) 92%),
    linear-gradient(0deg, rgba(10,11,26,.6) 0%, rgba(10,11,26,0) 40%);}
.hero-inner{position:relative; z-index:2; width:100%; align-self:stretch;
  display:flex; flex-direction:column; justify-content:center; gap:44px; padding:72px 0 0;
  pointer-events:none;} /* let drag/drop & clicks fall through to the photo slot beneath */
.hero-inner a, .hero-inner button{pointer-events:auto;} /* keep CTAs clickable */
.chip{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600;
  letter-spacing:.04em; padding:7px 14px; border-radius:999px;}
.chip .dot{width:7px; height:7px; border-radius:999px; background:var(--grad);}
.hero .chip{background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28); color:#fff;
  backdrop-filter:blur(6px);}
.hero h1{font-size:clamp(54px,6.4vw,92px); font-weight:700; line-height:.98; margin:24px 0 22px;
  color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.35);}
.hero .grad-text{background:linear-gradient(100deg,#5fe6f7,#7e9bff 55%,#9d8cff);
  -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p.lead{font-size:19px; color:rgba(255,255,255,.86); max-width:480px; line-height:1.55;
  margin-bottom:32px; text-shadow:0 1px 16px rgba(0,0,0,.3);}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.btn-glass{background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.42);
  backdrop-filter:blur(6px);}
.btn-glass:hover{background:rgba(255,255,255,.24); border-color:#fff; transform:translateY(-2px);}

/* stat strip — glass card anchored at the bottom of the hero, over the photo */
.stats{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius); overflow:hidden; margin-top:auto; margin-bottom:36px;
  background:rgba(255,255,255,.08); backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 24px 60px -28px rgba(0,0,0,.6);}
.stat{padding:24px 30px;}
.stat + .stat{border-left:1px solid rgba(255,255,255,.16);}
.stat .n{font-size:40px; font-weight:700; line-height:1; letter-spacing:-.03em;
  background:linear-gradient(100deg,#5fe6f7,#9d8cff); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat .l{font-size:14.5px; color:rgba(255,255,255,.78); margin-top:9px;}

/* ---- section scaffolding ---- */
section{position:relative;}
.sec{padding:104px 0;}
.sec-head{max-width:680px;}
.sec h2{font-size:clamp(32px,3.6vw,46px); margin:18px 0 0; text-wrap:balance;}
.sec h2.center{margin-left:auto; margin-right:auto; text-align:center;}
.sec p.intro{font-size:18px; color:var(--sub); margin-top:18px; line-height:1.6;}

/* quiénes somos */
.about{display:grid; grid-template-columns:.95fr 1.05fr; gap:60px; align-items:center;}
.about image-slot{width:100%; height:440px; box-shadow:var(--shadow);}
.about .lead2{font-size:26px; line-height:1.4; color:var(--ink); font-weight:500; letter-spacing:-.01em; margin-bottom:26px; text-wrap:pretty;}
.about ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:16px;}
.about li{display:flex; gap:14px; align-items:flex-start; font-size:16.5px; color:var(--sub); line-height:1.5;}
.about li b{color:var(--ink); font-weight:600;}
.about li .mk{flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:var(--grad-soft);
  display:grid; place-items:center; color:var(--violet); font-weight:700; font-size:13px; margin-top:1px;}

/* círculo ama band */
.circulo{background:var(--grad); color:#fff;}
.circulo .wrap{padding:78px var(--pad);}
.circ-grid{display:grid; grid-template-columns:1.25fr .9fr; gap:52px; align-items:center;}
.circ-kick{font-size:13px; letter-spacing:.2em; text-transform:uppercase; font-weight:600; opacity:.9;}
.circ-grid h2{color:#fff; font-size:clamp(28px,3vw,38px); margin:16px 0 28px; text-wrap:balance;}
.circ-img{display:block; width:300px; max-width:100%; height:380px; margin:0 0 30px;
  background:rgba(0,0,0,.18); box-shadow:0 24px 60px -28px rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.22);}
.count{display:flex; gap:14px;}
.count .box{background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.22);
  border-radius:14px; padding:16px 22px; text-align:center; min-width:96px; backdrop-filter:blur(4px);}
.count .box .n{font-size:42px; font-weight:700; line-height:1; font-variant-numeric:tabular-nums;}
.count .box .l{font-size:12.5px; opacity:.9; margin-top:6px; letter-spacing:.08em; text-transform:uppercase;}
.count .sep{align-self:center; font-size:34px; font-weight:700; opacity:.7;}
.card-form{background:#fff; border-radius:18px; padding:30px; box-shadow:var(--shadow-lg); color:var(--text);}
.card-form h3{font-size:21px; margin-bottom:8px;}
.card-form p{font-size:14.5px; color:var(--sub); margin-bottom:20px; line-height:1.5;}

/* form fields */
.field{width:100%; height:50px; border:1px solid var(--line2); border-radius:11px; padding:0 16px;
  font:inherit; font-size:15px; color:var(--text); background:#fff; outline:none;
  transition:border-color .2s, box-shadow .2s;}
.field::placeholder{color:var(--faint);}
.field:focus{border-color:var(--violet); box-shadow:0 0 0 4px rgba(96,72,240,.12);}
.form-col{display:flex; flex-direction:column; gap:12px;}
.form-row{display:flex; gap:12px;}
.form-row .field{flex:1;}
.btn-block{width:100%;}
.form-note{font-size:13px; color:var(--faint); margin-top:6px;}
.thanks{display:none; align-items:center; gap:9px; font-size:15px; font-weight:600; color:var(--violet);}
.thanks .ico{color:#1F9D6B;}
form.sent .form-col, form.sent .form-row, form.sent .btn-block{display:none;}
form.sent .thanks{display:flex;}

/* impacto (dark) */
.impacto{background:var(--ink); color:#fff;}
.impacto .wrap{padding:96px var(--pad);}
.imp-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.impacto h2{color:#fff; font-size:clamp(30px,3.2vw,44px); margin:20px 0 20px; text-wrap:balance;}
.impacto p.intro{color:rgba(255,255,255,.62); font-size:16.5px; max-width:420px; margin-bottom:26px;}
.impacto .field{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.18); color:#fff;}
.impacto .field::placeholder{color:rgba(255,255,255,.5);}
.impacto .field:focus{border-color:var(--cyan); box-shadow:0 0 0 4px rgba(24,216,240,.18);}
.impacto image-slot{width:100%; height:380px;}

/* video upload slot (block 4) — vertical / portrait */
.video-slot{position:relative; width:360px; max-width:100%; height:560px; margin-left:auto;
  border-radius:18px; overflow:hidden;
  background:rgba(255,255,255,.06); border:1.5px dashed rgba(255,255,255,.32);
  box-shadow:0 24px 60px -30px rgba(0,0,0,.6); transition:border-color .2s, background .2s;}
.video-slot.has-video{border-style:solid; border-color:rgba(255,255,255,.2); background:#000;}
.video-slot.drag{border-color:var(--cyan); background:rgba(24,216,240,.1);}
.vs-player{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; display:none; background:#000;}
.video-slot.has-video .vs-player{display:block;}
.vs-empty{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:8px; cursor:pointer; border:0; background:transparent;
  color:rgba(255,255,255,.85); font:inherit; text-align:center; padding:18px;}
.video-slot.has-video .vs-empty{display:none;}
.vs-empty svg{opacity:.9;}
.vs-cap{font-size:15.5px; font-weight:600;}
.vs-sub{font-size:13px; color:rgba(255,255,255,.55);}
.vs-tools{position:absolute; top:12px; right:12px; display:none; gap:8px; z-index:2;}
.video-slot.has-video:hover .vs-tools{display:flex;}
.vs-btn{appearance:none; border:1px solid rgba(255,255,255,.3); border-radius:8px; cursor:pointer;
  background:rgba(0,0,0,.55); color:#fff; font:inherit; font-size:12.5px; font-weight:600;
  padding:6px 11px; backdrop-filter:blur(6px); transition:background .15s;}
.vs-btn:hover{background:rgba(0,0,0,.8);}
.imp-tags{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:26px;}
.imp-tags span{font-size:13px; font-weight:500; color:rgba(255,255,255,.85);
  padding:7px 13px; border:1px solid rgba(255,255,255,.18); border-radius:999px;}

/* testimonios */
.quotes{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:46px;}
.quote{background:#fff; border:1px solid var(--line); border-radius:18px; padding:32px 32px 28px;
  box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .25s;}
.quote:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.quote .qm{font-size:30px; line-height:0; height:22px; color:var(--blue); font-weight:700;}
.quote blockquote{margin:0 0 22px; font-size:18px; line-height:1.55; color:var(--text); font-weight:500;}
.quote .who{display:flex; align-items:center; gap:13px;}
.quote .who image-slot{width:46px; height:46px;}
.quote .who .nm{font-weight:600; font-size:15px; color:var(--ink);}
.quote .who .co{font-size:13.5px; color:var(--sub);}

/* presentación / video */
.video-head{text-align:center; max-width:600px; margin:0 auto 44px;}
.video-wrap{position:relative; border-radius:22px; overflow:hidden; box-shadow:var(--shadow-lg); background:#000;
  max-width:400px; margin:0 auto; aspect-ratio:9/16;}
.video-wrap video-slot, .video-wrap iframe{width:100%; height:100%; display:block;}

/* servicios */
.serv-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:46px;}
.serv-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.serv-card{background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden;
  display:flex; flex-direction:column; transition:transform .22s, box-shadow .28s, border-color .2s;}
.serv-card:hover{transform:translateY(-6px); box-shadow:var(--shadow); border-color:transparent;}
.serv-card image-slot{width:100%; height:184px;}
.serv-body{padding:24px 24px 26px; display:flex; flex-direction:column; gap:18px; flex:1;}
.serv-top{display:flex; justify-content:space-between; align-items:center;}
.serv-num{font-size:14px; font-weight:700; color:var(--violet); font-variant-numeric:tabular-nums;}
.serv-card h4{font-size:20px; line-height:1.18; min-height:46px;}
.serv-card .div{height:1px; background:var(--line); margin-top:auto;}
.serv-more{display:inline-flex; align-items:center; gap:7px; font-weight:600; font-size:14.5px; color:var(--violet);}
.serv-card:hover .serv-more{gap:11px;}

/* podcast */
.podcast{background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.pod-head{text-align:center; max-width:620px; margin:0 auto 44px;}
.pod-card{display:grid; grid-template-columns:auto 1fr auto; gap:30px; align-items:center;
  background:#fff; border:1px solid var(--line); border-radius:22px; padding:30px; box-shadow:var(--shadow-sm);}
.pod-card image-slot{width:128px; height:128px;}
.pod-tag{display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--cyan); margin-bottom:10px;}
.pod-tag .new{background:var(--grad); color:#fff; padding:3px 9px; border-radius:999px; letter-spacing:.04em;}
.pod-card h4{font-size:21px; margin-bottom:9px;}
.pod-card .pd{font-size:15px; color:var(--sub); line-height:1.5; max-width:440px;}
.pod-actions{display:flex; flex-direction:column; gap:10px; align-items:stretch;}

/* regalo */
.regalo{background:var(--grad-soft);}
.reg-card{display:flex; align-items:center; justify-content:space-between; gap:48px;
  background:#fff; border:1px solid var(--line); border-radius:22px; padding:44px 48px; box-shadow:var(--shadow);}
.reg-card .rl{max-width:520px;}
.reg-card h2{font-size:clamp(26px,2.6vw,34px); margin:14px 0 12px; text-wrap:balance;}
.reg-card p{font-size:16px; color:var(--sub); line-height:1.55;}
.reg-form{flex:0 0 auto; width:340px;}

/* footer */
.foot{background:var(--ink); color:rgba(255,255,255,.66);}
.foot .wrap{padding:68px var(--pad) 36px;}
.foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:44px;}
.foot .brand img{height:46px;}
.foot .brand .wm{color:#fff;}
.foot-about{font-size:14.5px; line-height:1.65; max-width:300px; margin-top:18px;}
.foot h5{color:#fff; font-size:13px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; font-weight:600;}
.foot .col{display:flex; flex-direction:column; gap:11px;}
.foot .col a{font-size:14.5px; color:rgba(255,255,255,.66); transition:color .2s;}
.foot .col a:hover{color:#fff;}
.foot .col a.ic{display:inline-flex; align-items:center; gap:9px;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12); margin-top:46px; padding-top:24px;
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  font-size:13px; color:rgba(255,255,255,.45);}
.foot-bottom .legal{display:flex; gap:22px;}
.foot-bottom .legal a:hover{color:#fff;}

/* ---- cierre / manifiesto ---- */
.cierre{background:var(--ink); overflow:hidden; position:relative;}
.cierre-inner{position:relative; z-index:1; padding:120px var(--pad); text-align:center; display:flex; flex-direction:column; align-items:center; gap:0;}
.cierre-deco{position:absolute; width:520px; height:420px; left:50%; top:50%; transform:translate(-50%,-50%); opacity:.35; pointer-events:none;}
.cierre-deco svg{width:100%; height:100%;}
.cierre-copy{display:flex; flex-direction:column; align-items:center; gap:28px; position:relative;}
.cierre-h{font-size:clamp(42px,6vw,86px); font-weight:700; letter-spacing:-.03em; line-height:1;
  color:#fff; background:linear-gradient(110deg,#fff 30%,rgba(255,255,255,.65));
  -webkit-background-clip:text; background-clip:text; color:transparent;}
.cierre-p{font-size:clamp(20px,2.4vw,28px); color:rgba(255,255,255,.72); line-height:1.5;
  max-width:680px; font-weight:400; letter-spacing:-.01em; text-wrap:pretty;}
.cierre-p em{font-style:italic;
  background:linear-gradient(100deg,#5fe6f7,#9d8cff);
  -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:500;}
.cierre .eyebrow{color:var(--cyan);}
.cierre .eyebrow::before{background:var(--cyan);}
@media (max-width:600px){.br-md{display:none;} .cierre-inner{padding:88px var(--pad);}}
.wa{position:fixed; right:26px; bottom:26px; z-index:60; display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#fff; font-weight:600; font-size:15px; padding:14px 20px; border-radius:999px;
  box-shadow:0 14px 36px -10px rgba(37,211,102,.6); transition:transform .2s, box-shadow .25s;}
.wa:hover{transform:translateY(-3px); box-shadow:0 20px 44px -12px rgba(37,211,102,.7);}
.wa svg{width:21px; height:21px;}

/* scroll cue */
.scroll-cue{display:inline-flex; flex-direction:column; align-items:center; gap:6px; color:var(--faint);
  font-size:12px; letter-spacing:.18em; text-transform:uppercase; margin-top:6px;}
.scroll-cue .ar{width:1px; height:30px; background:linear-gradient(var(--faint),transparent); position:relative;}

/* reveal on scroll — base state is VISIBLE (robust if transitions are paused);
   entrance fade-up is layered on only when JS confirms a live, painting environment */
.reveal{opacity:1; transform:none;}
html.anim-ok .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);}
html.anim-ok .reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){html.anim-ok .reveal{opacity:1; transform:none; transition:none;}}

/* ---- responsive ---- */
@media (max-width:980px){
  :root{--pad:24px;}
  .nav-links{display:none;}
  .burger{display:inline-flex;}
  .about,.circ-grid,.imp-grid,.quotes,.serv-grid{grid-template-columns:1fr;}
  .video-slot{margin:0 auto;}
  .hero{min-height:auto;}
  .hero-inner{padding:48px 0 0; gap:36px;}
  .stats{grid-template-columns:1fr; margin-bottom:32px;}
  .stat + .stat{border-left:none; border-top:1px solid rgba(255,255,255,.16);}
  .serv-grid{grid-template-columns:1fr 1fr;}
  .reg-card{flex-direction:column; align-items:stretch; gap:28px; padding:32px;}
  .reg-form{width:100%;}
  .pod-card{grid-template-columns:1fr; text-align:left;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .foot-bottom{flex-direction:column; align-items:flex-start;}
}
@media (max-width:560px){
  .serv-grid{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr;}
  .video-wrap video-slot{height:clamp(360px,55vw,600px);}
  .count .box{min-width:78px; padding:14px 16px;}
}
