/* ===========================================================
   MEG360 — Home. Se carga SOLO en template-home.php.
   Todas las clases van prefijadas con .meg- para no chocar
   con el tema padre ni con Elementor.
   =========================================================== */

:root{
  --meg-bg:#08090C;
  --meg-black:#000;
  --meg-blue:#0057e5;
  --meg-blue-glow:#3D82FF;
  --meg-white:#F4F5F7;
  --meg-gray:#8A8F98;
  --meg-line:rgba(255,255,255,.08);
  --meg-display:'Clash Display',system-ui,sans-serif;
  --meg-body:'Satoshi',system-ui,sans-serif;
}

body.page-template-template-home{
  background:var(--meg-bg);
  color:var(--meg-white);
  font-family:var(--meg-body);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
/* Grano global sutil */
body.page-template-template-home::after{
  content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.meg-wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,6vw,80px)}
.meg-eyebrow{font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--meg-blue-glow);font-weight:500}

/* ---------- NAV ---------- */
.meg-nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;
  justify-content:space-between;padding:22px clamp(20px,6vw,80px);mix-blend-mode:difference}
.meg-logo{font-family:var(--meg-display);font-weight:700;letter-spacing:.04em;font-size:1.35rem;color:#fff}
.meg-logo span{color:var(--meg-blue-glow)}
.meg-nav__links{display:flex;gap:34px;font-size:.9rem;list-style:none;margin:0;padding:0}
.meg-nav__links a{color:#fff;opacity:.8;transition:opacity .25s;text-decoration:none}
.meg-nav__links a:hover{opacity:1}
@media(max-width:820px){.meg-nav__links{display:none}}

/* ---------- HERO ---------- */
.meg-hero{position:relative;height:100vh;width:100%;overflow:hidden;background:var(--meg-black)}
.meg-hero__media{position:absolute;inset:0;transform-origin:50% 60%}
.meg-hero__video{width:100%;height:100%;object-fit:cover;display:block}
.meg-hero__fade{position:absolute;inset:0;background:#000;opacity:0;z-index:3}

.meg-hero__content{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-start;max-width:1280px;margin:0 auto;left:0;right:0;
  padding:0 clamp(20px,6vw,80px);opacity:0}
.meg-hero__title{font-family:var(--meg-display);font-weight:600;line-height:.96;
  font-size:clamp(2.6rem,8vw,6.8rem);letter-spacing:-.01em;text-transform:uppercase;max-width:14ch}
.meg-hero__title em{font-style:normal;display:block;color:var(--meg-gray);font-weight:500;
  text-transform:none;font-size:clamp(1.1rem,2.6vw,2rem);margin-top:.4em;letter-spacing:0;
  line-height:1.15;max-width:24ch}
.meg-hero__sub{color:var(--meg-gray);max-width:46ch;margin-top:26px;font-size:1.02rem}

.meg-cta{display:flex;gap:18px;margin-top:38px;flex-wrap:wrap;align-items:center}
.meg-btn{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:2px;
  font-weight:500;font-size:.95rem;letter-spacing:.01em;text-decoration:none;
  transition:transform .3s,box-shadow .3s,border-color .3s,color .3s}
.meg-btn--primary{background:var(--meg-blue);color:#fff}
.meg-btn--primary:hover{box-shadow:0 0 40px rgba(0,87,229,.6);transform:translateY(-2px)}
.meg-btn--ghost{border:1px solid var(--meg-line);color:var(--meg-white)}
.meg-btn--ghost:hover{border-color:var(--meg-blue-glow);color:var(--meg-blue-glow)}

.meg-scrollhint{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:4;
  font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:var(--meg-gray);
  animation:meg-bob 2.2s ease-in-out infinite}
@keyframes meg-bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}

/* ---------- ESCENA PLACEHOLDER (si no usas vídeo) ---------- */
.meg-scene{position:absolute;inset:0}
.meg-scene__floor{position:absolute;inset:0;background:
  radial-gradient(120% 80% at 50% 120%,rgba(0,87,229,.18),transparent 60%),
  radial-gradient(80% 60% at 50% 18%,rgba(61,130,255,.30),transparent 55%),
  linear-gradient(180deg,#02040b 0%,#04060f 45%,#000 100%)}
.meg-beam{position:absolute;top:-10%;left:50%;width:9px;height:130%;
  background:linear-gradient(180deg,rgba(61,130,255,.9),rgba(0,87,229,.05) 70%,transparent);
  filter:blur(7px);transform-origin:top center;opacity:.55;mix-blend-mode:screen;
  animation:meg-sweep 7s ease-in-out infinite alternate}
.meg-beam.b2{animation-delay:-2.2s;animation-duration:8.5s;filter:blur(11px)}
.meg-beam.b3{animation-delay:-4.5s;animation-duration:6s;width:5px}
.meg-beam.b4{animation-delay:-1s;animation-duration:9s;filter:blur(14px);opacity:.35}
@keyframes meg-sweep{0%{transform:translateX(-180px) rotate(-22deg)}100%{transform:translateX(180px) rotate(22deg)}}
.meg-stage{position:absolute;left:50%;top:30%;transform:translateX(-50%);
  width:min(60vw,640px);height:min(34vh,260px);border-radius:6px;
  background:linear-gradient(160deg,rgba(0,87,229,.55),rgba(2,6,20,.2));
  box-shadow:0 0 120px 30px rgba(0,87,229,.45);filter:blur(2px);opacity:.85}
.meg-smoke{position:absolute;inset:0;mix-blend-mode:screen;opacity:.5}
.meg-smoke::before,.meg-smoke::after{content:"";position:absolute;width:80vw;height:60vh;
  border-radius:50%;background:radial-gradient(circle,rgba(120,150,210,.18),transparent 65%);
  filter:blur(40px);animation:meg-drift 16s ease-in-out infinite alternate}
.meg-smoke::before{left:5%;bottom:10%}
.meg-smoke::after{right:0;top:20%;animation-delay:-7s}
@keyframes meg-drift{0%{transform:translate(0,0) scale(1)}100%{transform:translate(60px,-40px) scale(1.2)}}
.meg-crowd{position:absolute;left:0;right:0;bottom:0;height:26vh;
  background:linear-gradient(180deg,transparent,#000 78%)}

/* ---------- LOGOS ---------- */
.meg-logos{padding:70px 0;border-bottom:1px solid var(--meg-line);overflow:hidden}
.meg-logos__label{text-align:center;color:var(--meg-gray);font-size:.78rem;letter-spacing:.22em;
  text-transform:uppercase;margin-bottom:34px}
.meg-marquee{display:flex;gap:80px;white-space:nowrap;width:max-content;animation:meg-scrollx 28s linear infinite}
.meg-marquee span{font-family:var(--meg-display);font-weight:500;font-size:1.45rem;color:#fff;opacity:.45;transition:opacity .3s}
.meg-marquee span:hover{opacity:1}
@keyframes meg-scrollx{to{transform:translateX(-50%)}}

/* ---------- SECCIÓN ---------- */
.meg-section{padding:clamp(90px,12vw,160px) 0}
.meg-section__head{max-width:50ch;margin-bottom:64px}
.meg-section__title{font-family:var(--meg-display);font-weight:600;font-size:clamp(2rem,5vw,3.6rem);
  line-height:1.04;letter-spacing:-.01em;margin-top:14px}

.meg-grid6{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--meg-line);border:1px solid var(--meg-line)}
.meg-cell{background:var(--meg-bg);padding:38px 32px;display:flex;flex-direction:column;gap:16px;transition:background .35s}
.meg-cell:hover{background:#0c0e15}
.meg-cell svg{width:30px;height:30px;stroke:var(--meg-blue-glow);stroke-width:1.4;fill:none}
.meg-cell h3{font-family:var(--meg-display);font-weight:500;font-size:1.25rem}
@media(max-width:820px){.meg-grid6{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.meg-grid6{grid-template-columns:1fr}}

.meg-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.meg-card{position:relative;border:1px solid var(--meg-line);border-radius:4px;padding:40px 34px 90px;
  min-height:340px;overflow:hidden;background:linear-gradient(180deg,#0a0c13,#070810);
  transition:transform .4s,border-color .4s}
.meg-card:hover{transform:translateY(-6px);border-color:rgba(0,87,229,.5)}
.meg-card::before{content:"";position:absolute;left:-40%;bottom:-60%;width:120%;height:120%;
  background:radial-gradient(circle,rgba(0,87,229,.35),transparent 60%);opacity:0;transition:opacity .45s}
.meg-card:hover::before{opacity:1}
.meg-card__num{font-family:var(--meg-display);color:var(--meg-gray);font-size:.85rem;opacity:.5}
.meg-card h3{font-family:var(--meg-display);font-weight:600;font-size:1.6rem;margin:18px 0 14px}
.meg-card p{color:var(--meg-gray);font-size:.97rem;position:relative;z-index:2}
.meg-card__arrow{position:absolute;bottom:32px;left:34px;color:var(--meg-blue-glow);font-size:1.4rem;
  opacity:0;transform:translateX(-8px);transition:.4s}
.meg-card:hover .meg-card__arrow{opacity:1;transform:translateX(0)}
@media(max-width:820px){.meg-cards3{grid-template-columns:1fr}}

.meg-stats{background:#04050a;border-top:1px solid var(--meg-line);border-bottom:1px solid var(--meg-line)}
.meg-stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--meg-line)}
.meg-stat{background:#04050a;padding:60px 30px;text-align:center}
.meg-stat__big{font-family:var(--meg-display);font-weight:600;font-size:clamp(2.6rem,6vw,4.4rem);color:#fff;line-height:1}
.meg-stat__big b{color:var(--meg-blue-glow);font-weight:600}
.meg-stat__lab{color:var(--meg-gray);font-size:.85rem;letter-spacing:.05em;margin-top:12px;text-transform:uppercase}
@media(max-width:820px){.meg-stats__grid{grid-template-columns:repeat(2,1fr)}}

.meg-cta-final{text-align:center;padding:clamp(100px,14vw,180px) 0}
.meg-cta-final h2{font-family:var(--meg-display);font-weight:600;font-size:clamp(2.4rem,6vw,4.5rem);line-height:1.02}
.meg-cta-final p{color:var(--meg-gray);margin:22px auto 40px;max-width:42ch;font-size:1.1rem}
.meg-cta-final .meg-cta{justify-content:center}

.meg-footer{padding:50px 0;border-top:1px solid var(--meg-line);color:var(--meg-gray);font-size:.85rem;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px}

.meg-wa{position:fixed;right:22px;bottom:22px;z-index:200;width:58px;height:58px;border-radius:50%;
  background:#1faf54;display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.5);transition:transform .3s}
.meg-wa:hover{transform:scale(1.08)}
.meg-wa svg{width:30px;height:30px;fill:#fff}

.meg-reveal{opacity:0;transform:translateY(34px)}

@media(prefers-reduced-motion:reduce){
  body.page-template-template-home *{animation:none!important;transition:none!important}
  .meg-reveal{opacity:1;transform:none}
  .meg-hero__content{opacity:1}
}