/* Reputación y liderazgo digital · Verne (marca-directiva.html)
   Identidad del Home: solo Poppins, paleta Verne, botones en píldora.
   Paleta: #25283D tinta · #6D4ABE morado · #5b3aa0 hover · #C0B0F4 lavanda · hsl(232 24% 10–14%) fondos oscuros */

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:'Poppins',sans-serif; background:#fff; color:#25283D; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img { display:block; max-width:100%; }
a { color:#6D4ABE; text-decoration:none; }
a:hover { color:#5b3aa0; }
input, textarea, select, button { font-family:inherit; }

.wrap { max-width:1200px; margin:0 auto; padding:0 clamp(22px,4vw,48px); }
.eb { display:block; font-size:11.5px; font-weight:600; letter-spacing:0; text-transform:uppercase; color:#6D4ABE; margin:0 0 20px; }
.eb-light { color:#C0B0F4; }
.h2 { font-size:clamp(32px,4vw,50px); font-weight:700; line-height:1.08; letter-spacing:0; color:#25283D; margin:0; text-wrap:balance; }
.h2-light { color:#fff; }
.lead { font-size:17px; line-height:1.78; font-weight:300; color:hsl(232 24% 19% / .74); margin:0; max-width:52ch; }
.lead-light { color:hsl(0 0% 100% / .76); }
.sec { padding:clamp(88px,12vh,136px) 0; }
.sec-dark { background:hsl(232 24% 12%); color:#fff; }
.sec-tint { background:hsl(252 74% 98%); }
.sec-head { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(28px,5vw,80px); align-items:end; margin-bottom:clamp(48px,7vh,80px); }
.sec-head .h2 { margin-top:0; }
.sec-head-tight { grid-template-columns:1fr; margin-bottom:clamp(36px,5vh,56px); }

/* reveal discreto (igual que antes) */
.rv { opacity:1; }
.js-rv .rv { opacity:0; transform:translateY(18px); transition:opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1); }
.js-rv .rv.in { opacity:1; transform:none; }
.js-rv .rv-2 { transition-delay:.1s; } .js-rv .rv-3 { transition-delay:.2s; }
@media (prefers-reduced-motion: reduce){ .js-rv .rv { opacity:1 !important; transform:none !important; } html { scroll-behavior:auto; } }

/* botón: mismo lenguaje que el Home (píldora morada, sube 2px y se ilumina al pasar el cursor) */
.btn { display:inline-flex; align-items:center; gap:9px; font-size:14.5px; font-weight:500; color:#fff; padding:16px 32px; border:none; border-radius:999px; background:#6D4ABE; cursor:pointer; text-decoration:none; box-shadow:0 12px 32px -12px hsl(263 45% 52% / .6); transition:transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease, filter .35s ease, background .35s ease; }
.btn:hover { color:#fff; transform:translateY(-2px); box-shadow:0 18px 42px -14px hsl(263 45% 52% / .7); filter:brightness(1.06); }
.btn:focus-visible, .cf-submit:focus-visible, .btn-ghost:focus-visible { outline:2px solid #C0B0F4; outline-offset:3px; }

/* ── hero ── */
.hero { position:relative; background:hsl(232 24% 10%); color:#fff; overflow:hidden; }
.hero::before { content:""; position:absolute; right:-10%; top:-30%; width:70%; height:140%; background:radial-gradient(closest-side, hsl(263 45% 52% / .32), hsl(263 45% 52% / 0)); pointer-events:none; }
.hero-grid { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.02fr); gap:clamp(36px,5vw,80px); align-items:center; padding-top:calc(70px + clamp(72px,11vh,128px)); /* 70 px: encabezado común fijo encima del hero */ padding-bottom:clamp(72px,11vh,120px); }
.hero-h1 { font-size:clamp(40px,5.2vw,68px); font-weight:700; line-height:1.04; letter-spacing:0; margin:0 0 22px; text-wrap:balance; }
.hero-lead { font-size:clamp(17px,1.6vw,20px); line-height:1.6; font-weight:300; color:hsl(0 0% 100% / .8); margin:0 0 38px; max-width:34ch; }
.hero-index { list-style:none; margin:0 0 40px; padding:0; border-top:1px solid hsl(0 0% 100% / .12); max-width:440px; }
.hero-index li { border-bottom:1px solid hsl(0 0% 100% / .12); }
.hero-index a { display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:8px; padding:16px 0; color:#fff; font-size:16px; font-weight:500; transition:color .3s ease, padding .3s ease; }
.hero-index a:hover { color:#C0B0F4; padding-left:6px; }
.hi-n { font-size:13px; font-weight:600; color:#C0B0F4; }
.hero-img { margin:0; position:relative; aspect-ratio:4/3; border-radius:22px; overflow:hidden; box-shadow:0 40px 90px -40px hsl(263 45% 30% / .8); }
.hero-img img { width:100%; height:100%; object-fit:cover; }

/* ── 01 · Marca Directiva y Corporativa ── */
.md-grid { display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(32px,5vw,80px); align-items:center; }
.md-photo { margin:0; position:relative; border-radius:22px; overflow:hidden; aspect-ratio:4/5; background:hsl(232 24% 14%); }
.md-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.md-quote { position:absolute; left:0; right:0; bottom:0; padding:80px 28px 28px; font-size:clamp(22px,2.2vw,30px); font-weight:600; line-height:1.25; letter-spacing:0; color:#fff; background:linear-gradient(180deg, hsl(232 24% 10% / 0), hsl(232 24% 10% / .88)); }
.md-quote em { font-style:normal; color:#C0B0F4; }

.orbit { display:block; width:100%; max-width:520px; height:auto; margin:0 auto 28px; font-family:'Poppins',sans-serif; overflow:visible; }
.o-ring { fill:none; stroke:#C0B0F4; stroke-width:1.5; stroke-dasharray:3 7; }
.o-rays path { stroke:#C0B0F4; stroke-width:1.5; stroke-linecap:round; opacity:.7; }
.o-links path { stroke:#6D4ABE; stroke-width:1.5; }
.o-core { fill:#25283D; }
.o-core-t { fill:#fff; font-size:19px; font-weight:600; }
.o-node circle { fill:#6D4ABE; }
.o-node text { fill:#fff; font-size:13.5px; font-weight:500; }

.legend { margin:0; display:flex; flex-direction:column; }
.lg-row { padding:20px 0; border-top:1px solid hsl(232 24% 19% / .1); }
.lg-row:last-child { border-bottom:1px solid hsl(232 24% 19% / .1); }
.legend dt { display:flex; align-items:center; gap:12px; font-size:19px; font-weight:600; letter-spacing:0; color:#25283D; margin:0 0 8px; }
.legend dd { margin:0 0 0 26px; font-size:15.5px; line-height:1.72; font-weight:300; color:hsl(232 24% 19% / .76); }
.legend dd b { font-weight:600; color:#6D4ABE; }
.sw { width:14px; height:14px; border-radius:999px; flex:0 0 auto; }
.sw-core { background:#25283D; }
.sw-node { background:#6D4ABE; }

.flow { margin-top:clamp(72px,10vh,112px); }
.flow-steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:clamp(24px,3.4vw,52px); position:relative; }
.flow-steps::before { content:""; position:absolute; left:0; right:0; top:34px; height:1px; background:linear-gradient(90deg, #6D4ABE, #C0B0F4 60%, hsl(252 74% 86% / .3)); }
.flow-steps li { position:relative; padding-top:0; }
.fs-n { position:relative; display:inline-flex; align-items:center; justify-content:center; width:68px; height:68px; border-radius:999px; background:#fff; border:1.5px solid #6D4ABE; font-size:20px; font-weight:700; color:#6D4ABE; margin-bottom:26px; }
.flow-steps li:first-child .fs-n { background:#6D4ABE; color:#fff; }
.flow-steps h3 { font-size:22px; font-weight:600; letter-spacing:0; color:#25283D; margin:0 0 10px; }
.flow-steps p { font-size:15px; line-height:1.72; font-weight:300; color:hsl(232 24% 19% / .74); margin:0; }

/* ── 02 · Embajadores digitales ── */
.emb-top { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(32px,5vw,80px); align-items:center; }
.emb-top .h2 { margin-bottom:22px; }
.emb-photo { margin:0; border-radius:22px; overflow:hidden; aspect-ratio:4/3; }
.emb-photo img { width:100%; height:100%; object-fit:cover; }
.emb-bottom { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(32px,5vw,80px); align-items:start; margin-top:clamp(64px,9vh,104px); padding-top:clamp(48px,7vh,72px); border-top:1px solid hsl(0 0% 100% / .1); }
.stat { margin:0; }
.stat-n { font-size:clamp(88px,11vw,148px); font-weight:700; line-height:.86; letter-spacing:0; color:#C0B0F4; margin:0 0 26px; }
.stat-bar { height:8px; border-radius:999px; background:hsl(0 0% 100% / .1); overflow:hidden; margin-bottom:22px; max-width:420px; }
.stat-bar span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, #6D4ABE, #C0B0F4); }
.stat-t { font-size:20px; font-weight:500; line-height:1.4; color:#fff; margin:0 0 6px; max-width:24ch; }
.stat-s { font-size:15.5px; line-height:1.6; font-weight:300; color:hsl(0 0% 100% / .72); margin:0 0 16px; }
.stat-src { font-size:12.5px; color:hsl(0 0% 100% / .5); margin:0; }
.vflow { list-style:none; margin:0; padding:0; position:relative; }
.vflow::before { content:""; position:absolute; left:21px; top:22px; bottom:22px; width:1px; background:linear-gradient(180deg, #C0B0F4, hsl(252 74% 86% / .25)); }
.vflow li { position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:20px; padding:0 0 30px; }
.vflow li:last-child { padding-bottom:0; }
.vf-n { position:relative; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:999px; background:hsl(232 24% 12%); border:1.5px solid #C0B0F4; font-size:13px; font-weight:600; color:#C0B0F4; }
.vflow h3 { font-size:19px; font-weight:600; letter-spacing:0; color:#fff; margin:9px 0 6px; }
.vflow p { font-size:15px; line-height:1.72; font-weight:300; color:hsl(0 0% 100% / .74); margin:0; }

/* ── casos reales ── */
.cases { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); border-top:1px solid hsl(232 24% 19% / .12); }
.case { margin:0; padding:clamp(32px,5vh,48px) clamp(0px,3vw,48px) 0 0; }
.case + .case { padding-left:clamp(24px,4vw,64px); border-left:1px solid hsl(232 24% 19% / .12); }
.case-n { font-size:clamp(72px,9vw,128px); font-weight:700; line-height:.9; letter-spacing:0; color:#6D4ABE; margin:0 0 16px; }
.case-t { font-size:20px; font-weight:500; color:#25283D; margin:0 0 4px; }
.case-s { font-size:14px; font-weight:400; color:hsl(232 24% 19% / .6); margin:0; }

/* ── dos formas de trabajar ── */
.ways { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0; }
.way { padding:8px clamp(0px,3vw,48px) 8px 0; }
.way + .way { padding-left:clamp(24px,4vw,64px); border-left:1px solid hsl(232 24% 19% / .12); }
.way-k { font-size:clamp(28px,3vw,40px); font-weight:700; letter-spacing:0; color:#25283D; margin:0 0 4px; }
.way-s { font-size:15px; font-weight:400; color:#6D4ABE; margin:0 0 24px; }
.way ul { list-style:none; margin:0; padding:0; }
.way li { font-size:17px; font-weight:500; color:#25283D; padding:14px 0; border-top:1px solid hsl(232 24% 19% / .1); }
.way li a { color:#25283D; }
.way li a:hover { color:#6D4ABE; }
.way-link { display:inline-flex; align-items:center; gap:9px; margin-top:22px; font-size:14.5px; font-weight:500; color:#6D4ABE; transition:gap .3s ease; }
.way-link:hover { gap:13px; }

/* ── otros servicios ── */
.sec-other { padding-top:0; }
.other { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:clamp(20px,3vw,40px); }
.other a { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:26px 0; border-top:1px solid hsl(232 24% 19% / .12); font-size:20px; font-weight:600; letter-spacing:0; color:#25283D; transition:color .3s ease; }
.other a:hover { color:#6D4ABE; }

/* ── contacto: mismo bloque que el Home (.cp-*) ── */
.contact { position:relative; padding:0 0 104px; overflow:hidden; background:hsl(232 24% 10%); }
.contact-in { position:relative; max-width:1180px; margin:0 auto; padding:0 24px; }
.cp-scene { position:relative; min-height:min(900px,104vh); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,520px); gap:56px; align-items:center; }
.cp-bg { position:absolute; left:50%; right:50%; top:0; bottom:0; width:100vw; margin-left:-50vw; background-image:url("../assets/home/fondo-contacto.png"); background-size:cover; background-position:center center; transform:scaleX(-1); }
.cp-grade { position:absolute; left:50%; right:50%; top:0; bottom:0; width:100vw; margin-left:-50vw; pointer-events:none; background:linear-gradient(94deg, rgba(37,40,61,.97) 0%, rgba(37,40,61,.95) 30%, rgba(37,40,61,.86) 52%, rgba(37,40,61,.72) 72%, rgba(37,40,61,.58) 88%, rgba(37,40,61,.5) 100%), linear-gradient(180deg, rgba(37,40,61,.82) 0%, rgba(37,40,61,.3) 26%, rgba(37,40,61,.3) 74%, rgba(37,40,61,.72) 100%); }
.cp-copy { position:relative; z-index:2; align-self:center; }
.cp-copy h2 { font-size:clamp(38px,4.6vw,58px); font-weight:700; line-height:1.06; letter-spacing:0; color:#fff; margin:0 0 24px; max-width:18ch; }
.cp-copy h2 span { color:hsl(252 74% 82%); }
.cp-copy p { font-size:17px; line-height:1.75; font-weight:300; color:hsl(0 0% 100% / .76); margin:0; max-width:38ch; }
.cp-float { position:relative; z-index:2; background:hsl(232 24% 12% / .72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid hsl(0 0% 100% / .09); border-radius:28px; box-shadow:0 26px 70px -34px hsl(232 24% 3% / .6); }
@media (max-width:960px){
  .cp-scene { grid-template-columns:1fr; gap:40px; min-height:0; padding-top:72px; }
}
.cf { padding:40px 36px; display:flex; flex-direction:column; gap:16px; }
.cf-row { display:grid; grid-template-columns:repeat(auto-fit, minmax(130px,1fr)); gap:16px; }
.cf input:not([type="checkbox"]), .cf select, .cf textarea { width:100%; background:hsl(232 24% 13% / .6); border:1px solid hsl(0 0% 100% / .1); border-radius:12px; padding:16px 18px; font-size:14px; font-family:inherit; color:hsl(0 0% 100% / .92); outline:none; transition:border-color .35s ease, background .35s ease; }
.cf select { cursor:pointer; }
.cf textarea { resize:none; }
.cf input:not([type="checkbox"]):focus, .cf select:focus, .cf textarea:focus { border-color:hsl(263 45% 52%); background:hsl(232 24% 15% / .8); }
.cf select option { background:hsl(232 24% 14%); color:hsl(0 0% 100% / .92); }
.cf input::placeholder, .cf textarea::placeholder { color:hsl(0 0% 100% / .68); opacity:1; }
.cf-check { display:flex; align-items:flex-start; gap:11px; font-size:12.5px; color:hsl(0 0% 100% / .66); cursor:pointer; line-height:1.55; margin-top:4px; }
.cf-check input { margin-top:2px; width:16px; height:16px; accent-color:hsl(263 45% 52%); flex-shrink:0; cursor:pointer; }
.cf-check a { color:hsl(252 74% 82%); font-weight:500; text-decoration:underline; text-underline-offset:2px; }
.cf-submit { width:100%; display:inline-flex; align-items:center; justify-content:center; gap:9px; font-size:14.5px; font-weight:500; color:#fff; padding:17px; margin-top:8px; border:none; cursor:pointer; border-radius:999px; background:linear-gradient(90deg, #6D4ABE, #6D4ABE); box-shadow:0 12px 32px -12px hsl(263 45% 52% / .6); transition:transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease, filter .35s ease; }
.cf-submit:hover { transform:translateY(-2px); box-shadow:0 18px 42px -14px hsl(263 45% 52% / .7); filter:brightness(1.06); }

/* ── vista de agradecimiento y aviso (idénticos al Home) ── */
.thanks { position:fixed; inset:0; z-index:1200; background:hsl(232 24% 8%); display:flex; align-items:center; justify-content:center; padding:32px; overflow-y:auto; }
.thanks[hidden] { display:none; }
.thanks-bg { position:absolute; inset:0; pointer-events:none; background-image:url("../assets/home/fondo-contacto.png"); background-size:cover; background-position:center center; opacity:.5; }
.thanks-grade { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg, hsl(232 24% 8% / .82) 0%, hsl(232 24% 8% / .6) 46%, hsl(232 24% 8% / .88) 100%); }
.thanks-in { position:relative; z-index:2; max-width:600px; text-align:center; color:#fff; }
.thanks-ic { display:inline-flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:999px; background:hsl(263 45% 52% / .18); border:1px solid hsl(263 55% 62% / .4); margin-bottom:30px; }
.thanks-eb { font-size:11.5px; font-weight:600; letter-spacing:0; text-transform:uppercase; color:hsl(252 74% 82%); margin:0 0 18px; }
.thanks h2 { font-size:clamp(34px,4.4vw,52px); font-weight:700; line-height:1.08; letter-spacing:0; color:#fff; margin:0 0 22px; }
.thanks-p { font-size:17px; line-height:1.78; font-weight:300; color:hsl(0 0% 100% / .8); margin:0 0 8px; }
.thanks-q { font-size:17px; line-height:1.78; font-weight:500; color:#fff; margin:0 0 26px; }
.thanks-opts { display:flex; flex-direction:column; gap:16px; text-align:left; max-width:460px; margin:0 auto 38px; }
.thanks-opts p { font-size:15px; line-height:1.72; font-weight:300; color:hsl(0 0% 100% / .72); margin:0; }
.thanks-opts span { display:block; font-weight:500; color:#fff; margin-bottom:3px; }
.thanks-actions { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.btn-ghost { display:inline-flex; align-items:center; gap:9px; font-size:14.5px; font-weight:500; color:#fff; padding:16px 32px; border:1px solid hsl(0 0% 100% / .24); cursor:pointer; border-radius:999px; background:none; transition:border-color .35s ease; }
.btn-ghost:hover { border-color:hsl(0 0% 100% / .5); }
.toast-wrap { position:fixed; bottom:24px; right:24px; left:24px; z-index:90; display:flex; justify-content:center; pointer-events:none; }
.toast { pointer-events:auto; max-width:400px; width:100%; background:hsl(232 24% 13%); border:1px solid hsl(0 0% 100% / .1); border-left:3px solid hsl(263 45% 52%); border-radius:12px; padding:16px 18px; box-shadow:0 18px 46px hsl(232 24% 3% / .5); animation:vToastIn .35s cubic-bezier(.25,.46,.45,.94); }
.toast.is-error { border-left-color:hsl(0 72% 60%); }
.toast[hidden] { display:none; }
.toast-t { font-size:14px; font-weight:600; color:#fff; margin:0 0 3px; }
.toast-d { font-size:12.5px; color:hsl(0 0% 100% / .68); margin:0; line-height:1.5; }
@keyframes vToastIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }

/* ── pie ── */
.foot { background:hsl(232 24% 10%); padding:56px 0 36px; }
.foot-top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:22px; }
.foot-top img { width:53.9px; height:26px; padding:0 4.6px; box-sizing:content-box; object-fit:contain; }   /* logotipo refinado oficial (blanco): misma caja y tamaño óptico que el anterior */
.foot-links { display:flex; flex-wrap:wrap; gap:22px; font-size:13px; }
.foot-links a { color:hsl(0 0% 100% / .62); }
.foot-links a:hover { color:hsl(0 0% 100% / .9); }
.foot-legal { font-size:12px; color:hsl(0 0% 100% / .4); margin:30px 0 0; padding-top:22px; border-top:1px solid hsl(0 0% 100% / .07); }
.foot-legal a { color:hsl(0 0% 100% / .55); }

/* ── responsive ── */
@media (max-width:960px){
  .hero-grid, .sec-head, .md-grid, .emb-top, .emb-bottom { grid-template-columns:1fr; }
  .hero-grid { padding-top:calc(70px + 56px); }
  .md-photo { aspect-ratio:4/3.4; max-width:560px; }
  .flow-steps { grid-template-columns:1fr; gap:34px; padding-left:0; }
  .flow-steps::before { left:34px; right:auto; top:0; bottom:0; width:1px; height:auto; background:linear-gradient(180deg, #6D4ABE, #C0B0F4 60%, hsl(252 74% 86% / .3)); }
  .flow-steps li { display:grid; grid-template-columns:68px minmax(0,1fr); column-gap:22px; }
  .flow-steps li .fs-n { grid-row:1 / span 2; margin-bottom:0; }
  .flow-steps h3 { margin-top:8px; }
}
@media (max-width:720px){
  /* el diagrama se reduce: textos más grandes para que sigan siendo legibles */
  .o-node circle { r:50px; }
  .o-node text { font-size:16px; }
  .o-core-t { font-size:23px; }
  .cases, .ways, .other { grid-template-columns:1fr; }
  .case + .case, .way + .way { padding-left:0; border-left:0; border-top:1px solid hsl(232 24% 19% / .12); margin-top:clamp(28px,4vh,40px); }
  .way + .way { padding-top:32px; }
  .case { padding-right:0; }
  .cf { padding:30px 22px; }
}
