/* datlast.com: hoja única. Estructura de placas redondeadas sobre un lienzo
   claro, tipografía Geist alojada en el propio dominio (sin terceros).
   Unidades en px dentro de un contenedor fluido; los títulos escalan con clamp(). */

@font-face { font-family: "Geist"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url("../fonts/geist-latin-ext.woff2?v=999bb767bb") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url("../fonts/geist-latin.woff2?v=f49f83effe") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("../fonts/geist-mono-latin-ext.woff2?v=055f596ea5") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("../fonts/geist-mono-latin.woff2?v=8c3cbed783") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --ink:#0a0a0a; --ink-2:#232323; --ink-3:#2e2e2e;
  --page:#f1f2f1; --white:#ffffff; --light:#f3f3f3;
  --border:#e6e6e6; --border-dark:#2a2a2a;
  --text:#0a0a0a; --text-2:#5d5d5d; --mute:#9d9d9d;
  --brand:#2563c9; --brand-soft:#5790e6; --brand-deep:#0f2f63;
  --orange:#eb6834;
  --r-plate:24px; --r-card:16px; --r-img:32px; --r-pill:44px;
  --font:"Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:"Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-io:cubic-bezier(.65,0,.35,1); --ease-soft:cubic-bezier(.25,1,.5,1);
  --gutter:clamp(16px, 1.8vw, 28px);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
img, svg, canvas { display: block; max-width: 100%; }
button { cursor: pointer; font: inherit; color: inherit; background: none; border: 0; padding: 0; }
input, textarea, select { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--brand-soft); outline-offset: 3px; border-radius: 4px; }

html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }
html.bloqueado { overflow: hidden; }

body { min-height: 100vh; background: var(--page); color: var(--text); font-family: var(--font); font-size: 16px; line-height: 1.5;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: "ss01", "cv11"; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.salto { position: absolute; left: 16px; top: -64px; z-index: 300; background: var(--ink); color: #fff; padding: 12px 20px; border-radius: var(--r-pill); font-size: 14px; }
.salto:focus { top: 16px; }
[hidden] { display: none !important; }

main.pagina { width: 100%; overflow-x: clip; padding: 16px; }
.wrap { width: 100%; margin: 0 auto; padding: 0 var(--gutter); }
.plate { border-radius: var(--r-plate); }
.plate.dark { background: var(--ink); color: #fff; }

/* ---------- Tipografía ---------- */
.h1 { font-size: clamp(44px, 7.2vw, 104px); font-weight: 500; line-height: .98; letter-spacing: -.035em; text-wrap: balance; }
.h2 { font-size: clamp(34px, 4.6vw, 64px); font-weight: 500; line-height: 1.02; letter-spacing: -.03em; text-wrap: balance; }
.h3 { font-size: clamp(24px, 2.6vw, 36px); font-weight: 500; line-height: 1.1; letter-spacing: -.02em; }
.h4 { font-size: clamp(20px, 2vw, 26px); font-weight: 500; line-height: 1.2; letter-spacing: -.015em; }
.lead { font-size: clamp(16px, 1.3vw, 19px); line-height: 1.55; color: var(--text-2); text-wrap: pretty; }
.dark .lead { color: rgba(255,255,255,.68); }
.small { font-size: 14px; line-height: 1.5; }
.mono { font-family: var(--mono); }
.tag { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 13px; line-height: 1; font-weight: 500; text-transform: uppercase; letter-spacing: .02em;
  padding: 10px 14px 9px; border-radius: var(--r-pill); background: var(--light); color: var(--ink); white-space: nowrap; }
.tag::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--brand);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Crect width='10' height='10' rx='2' fill='%23000'/%3E%3Cpath d='M5 2.5v5M2.5 5h5' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Crect width='10' height='10' rx='2' fill='%23000'/%3E%3Cpath d='M5 2.5v5M2.5 5h5' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.dark .tag { background: rgba(255,255,255,.08); color: #fff; }
.dark .tag::before { background: var(--brand-soft); }
.tag.on::before { background: #1f9d55; }
.tag.beta::before { background: var(--brand); }
.tag.pronto::before { background: #d08700; }

/* ---------- Botones ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border-radius: var(--r-pill);
  background: #fff; color: var(--ink); font-size: 15px; font-weight: 500; line-height: 1.2; letter-spacing: -.005em; white-space: nowrap; overflow: hidden;
  transition: border-radius .35s var(--ease-soft), background-color .3s, color .3s; }
.btn:hover { border-radius: 14px; }
.btn.brand { background: var(--brand); color: #fff; }
.btn.brand:hover { background: #1f56b3; }
.btn.ink { background: var(--ink); color: #fff; }
.btn.ink:hover { background: var(--ink-3); }
.btn.ghost { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }
.btn.ghost:hover { background: rgba(255,255,255,.1); }
.btn.outline { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--border); }
.btn.outline:hover { background: var(--light); }
.btn .inner { position: relative; display: block; overflow: hidden; height: 1.2em; }
.btn .inner span { display: block; transition: transform .45s var(--ease-out); }
.btn .inner span + span { position: absolute; left: 0; top: 100%; }
.btn:hover .inner span { transform: translateY(-100%); }
.btn .ar { width: 14px; height: 14px; flex: none; transition: transform .45s var(--ease-out); }
.btn:hover .ar { transform: translate(2px, -2px); }
.btn.big { padding: 17px 28px; font-size: 17px; }
.btn.sm { padding: 10px 16px; font-size: 14px; }
.btn.with-av { padding-left: 6px; }
.btn .av { width: 32px; height: 32px; border-radius: 50%; background: var(--brand) url("../img/icono.svg?v=62b9376d80") center/60% no-repeat; flex: none; }
.pill, .submit { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border-radius: var(--r-pill); font-size: 15px; font-weight: 500; line-height: 1.2; white-space: nowrap;
  transition: border-radius .35s var(--ease-soft), background-color .3s, color .3s; }
.pill:hover, .submit:hover { border-radius: 14px; }
.pill svg { width: 14px; height: 14px; }
.pill.light { background: #fff; color: var(--ink); }
.pill.solid, .submit { background: var(--brand); color: #fff; }
.pill.solid:hover, .submit:hover { background: #1f56b3; }
.pill.outline { box-shadow: inset 0 0 0 1px var(--border); color: var(--ink); }
.pill.ghost-light { box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); color: #fff; }
.pill.ghost-light:hover { background: rgba(255,255,255,.1); }
.link-ul { display: inline-flex; align-items: center; gap: 12px; font-weight: 500; font-size: clamp(18px, 1.6vw, 24px); letter-spacing: -.01em; }
.link-ul .t { text-decoration: underline; text-decoration-style: dashed; text-decoration-thickness: 1px; text-decoration-color: var(--brand); text-underline-offset: .32em; }
.link-ul .ic { width: 32px; height: 32px; color: var(--brand); transition: transform .45s var(--ease-out); }
.link-ul:hover .ic { transform: rotate(45deg); }

.acts { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.cta .acts { justify-content: center; }
.okacts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; }
.offer .check { color: rgba(255,255,255,.7); } .offer .check a { color: #fff; }
.offer .check input { accent-color: var(--brand-soft); }

/* ---------- Primitivas de movimiento ---------- */
.js [data-reveal] { opacity: 0; filter: blur(6px); transform: translate3d(0, 44px, 0); will-change: transform, filter, opacity; }
.js [data-reveal].in { opacity: 1; filter: blur(0); transform: none; transition: opacity 1s var(--ease-out), filter 1s var(--ease-out), transform 1.1s var(--ease-out); }
.js [data-reveal="fade"] { transform: none; filter: none; }
.js [data-inview] { opacity: 0; }
/* Red de seguridad: si site.js no llega a ejecutarse (red, CSP, error), nunca marca <html class="listo">
   y a los 3,5 s todo lo que esperaba su animación se muestra y el cargador se retira solo. */
@keyframes mostrar-seguro { to { opacity: 1; filter: none; transform: none; } }
@keyframes cargador-fuera { to { opacity: 0; visibility: hidden; } }
.js:not(.listo) [data-reveal], .js:not(.listo) [data-inview], .js:not(.listo) .clip > span, .js:not(.listo) .fw { animation: mostrar-seguro .6s ease 3.5s forwards; }
.clip { display: inline-block; overflow: hidden; vertical-align: top; padding: .16em 0 .14em; margin: -.16em 0 -.14em; }
.clip > span { display: inline-block; }
.js .clip > span { transform: translateY(115%); opacity: 0; }
.js .clip.in > span { transform: none; opacity: 1; }
[data-lines] .line { display: block; }
.fw { display: inline-block; }
.js .fw { transform: translateY(18px); opacity: 0; }
.js .fw.in { transform: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal], .js [data-inview], .clip > span, .fw { opacity: 1 !important; filter: none !important; transform: none !important; transition: none !important; }
  .marquee .track, .strip .track { animation: none !important; }
}

/* ---------- Cabecera ---------- */
.site-header { position: absolute; left: 0; right: 0; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 28px var(--gutter) 0; color: #fff; }
.site-header .brand { display: inline-flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 600; letter-spacing: -.03em; }
.site-header .brand svg { width: 30px; height: 30px; color: var(--brand-soft); }
.site-header .nav-c { display: none; position: absolute; left: 50%; top: 28px; transform: translateX(-50%); gap: 28px; align-items: center; font-size: 16px; }
.site-header .nav-c a { position: relative; display: inline-flex; align-items: flex-start; gap: 4px; transition: color .25s, transform .3s var(--ease-out); }
.site-header .nav-c a:hover { color: var(--brand-soft); transform: translateY(-1px); }
.site-header .nav-c .n { font-family: var(--mono); font-size: 10px; font-weight: 500; background: var(--brand); color: #fff; border-radius: 20px; padding: 3px 6px 2px; margin-top: -8px; }
@media (min-width: 1024px) { .site-header .nav-c { display: flex; } }
.site-header .right { display: flex; align-items: center; gap: 10px; }
.site-header .cta-btn { display: none; }
@media (min-width: 640px) { .site-header .cta-btn { display: inline-flex; } }
.burger { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.12); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: background-color .25s; }
.burger:hover { background: rgba(255,255,255,.2); }
.burger span { display: grid; gap: 5px; }
.burger i { display: block; width: 18px; height: 1.5px; background: #fff; border-radius: 2px; }
@media (min-width: 1024px) { .burger { display: none; } }

/* ---------- Portada ---------- */
.hero { position: relative; isolation: isolate; overflow: hidden; background: var(--ink); color: #fff; border-radius: var(--r-plate);
  min-height: calc(100svh - 32px); display: flex; flex-direction: column; padding: 150px var(--gutter) 40px; }
.hero .bgc { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; }
.hero .veil { position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 90% at 70% 30%, rgba(10,10,10,0) 0%, rgba(10,10,10,.55) 60%, rgba(10,10,10,.9) 100%); pointer-events: none; }
.hero .top { max-width: 920px; }
.hero .h1 { margin-top: 28px; }
.hero .sub { margin-top: 24px; max-width: 520px; font-size: clamp(15px, 1.2vw, 18px); color: rgba(255,255,255,.72); }
.hero .bottom { margin-top: auto; padding-top: 64px; display: flex; flex-direction: column; gap: 24px; }
.hero .bottom .h3 { max-width: 520px; color: #fff; }
.hero .acts { display: flex; flex-wrap: wrap; gap: 12px; }
@media (min-width: 900px) { .hero { padding-top: 190px; } .hero .bottom { flex-direction: row; justify-content: flex-end; align-items: flex-end; } .hero .bottom > div { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; } }

/* ---------- Marquesina ---------- */
.marquee { margin-top: 20px; padding: 0 var(--gutter); }
.marquee .inner { display: flex; align-items: center; gap: 48px; border-top: 1px dashed var(--border); border-bottom: 1px dashed var(--border); padding: 28px 0 28px 16px; overflow: hidden; }
.marquee .intro { display: flex; align-items: center; gap: 16px; flex: none; min-width: 320px; max-width: 380px; font-family: var(--mono); font-size: 13px; font-weight: 500; text-transform: uppercase; color: var(--text-2); line-height: 1.45; }
.marquee .intro svg { width: 44px; height: 44px; flex: none; color: var(--brand); animation: spin 14s linear infinite; }
.marquee .lane { position: relative; flex: 1; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.marquee .track { display: flex; width: max-content; gap: 56px; padding-right: 56px; animation: mq 28s linear infinite; }
.marquee .lane:hover .track { animation-play-state: paused; }
.marquee .track span { display: inline-flex; align-items: center; gap: 56px; font-size: clamp(22px, 2.4vw, 34px); font-weight: 500; letter-spacing: -.02em; white-space: nowrap; color: var(--ink); }
.marquee .track span::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--brand); }
@keyframes mq { to { transform: translate3d(-50%, 0, 0); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 760px) { .marquee .inner { flex-direction: column; align-items: flex-start; gap: 20px; padding-left: 0; } .marquee .intro { min-width: 0; } .marquee .lane { width: 100%; } }

/* ---------- Encabezado de sección ---------- */
.sec-head { display: flex; flex-direction: column; gap: 24px; }
.sec-head .h2 { margin-top: 24px; max-width: 760px; }
@media (min-width: 900px) { .sec-head { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 48px; } .sec-head > .r { flex: none; max-width: 400px; padding-bottom: 6px; } }
.sec-head.center { text-align: center; align-items: center; justify-content: center; }
.sec-head.center .h2 { margin-left: auto; margin-right: auto; }
.sec-head.center .lead { max-width: 560px; margin: 16px auto 0; }

/* ---------- Quiénes somos + tira ---------- */
.who { padding: clamp(80px, 9vw, 150px) 0 0; }
.strip { margin-top: 56px; overflow: hidden; }
.strip .track { display: flex; width: max-content; gap: 12px; padding-right: 12px; animation: mq 60s linear infinite; }
.strip:hover .track { animation-play-state: paused; }
.strip .it { position: relative; width: clamp(240px, 28vw, 420px); aspect-ratio: 4/3; border-radius: var(--r-plate); overflow: hidden; background: #f5f5f7; flex: none; border: 1px solid rgba(10,10,10,.09); box-shadow: 0 12px 32px rgba(10,10,10,.06); }
.strip .it img { width: 100%; height: 100%; object-fit: cover; }
.strip .it span { position: absolute; left: 14px; bottom: 14px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: #fff; background: rgba(10,10,10,.45); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 8px 10px 7px; border-radius: 20px; }

/* ---------- Números ---------- */
.nums { padding: clamp(80px, 9vw, 150px) 0 0; }
.nums .grid { margin-top: 48px; display: grid; gap: 40px 32px; }
@media (min-width: 640px) { .nums .grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .nums .grid { grid-template-columns: repeat(4, 1fr); } }
.counter { display: flex; flex-direction: column; gap: 20px; }
.counter .digits { display: flex; align-items: flex-start; height: 72px; overflow: clip; font-size: 72px; font-weight: 500; letter-spacing: -.04em; line-height: 1; }
.counter .col { display: flex; flex-direction: column; transition: transform 1.6s var(--ease-out); }
.counter .col b { display: block; height: 72px; line-height: 72px; font-weight: 500; }
.counter .sym { align-self: flex-start; font-size: 28px; color: var(--brand); margin-left: 4px; line-height: 72px; }
.counter .sym.txt { font-size: 40px; color: var(--ink); letter-spacing: -.04em; }
.counter .div { border-top: 1px dashed var(--border); }
.counter .nm { font-size: 20px; font-weight: 500; letter-spacing: -.015em; }
.counter .ds { color: var(--text-2); font-size: 15px; margin-top: 6px; line-height: 1.5; }

/* ---------- Servicios (placa oscura) ---------- */
.services { margin-top: clamp(80px, 9vw, 150px); padding: clamp(64px, 7vw, 120px) 0 clamp(64px, 6vw, 100px); }
.services .ttl { display: flex; flex-direction: column; gap: 24px; }
@media (min-width: 900px) { .services .ttl { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 48px; } .services .ttl .r { max-width: 380px; } }
.services .ttl .h2 { margin-top: 24px; }
.services .ttl .h2 .up { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; width: 1.15em; height: .95em; margin: -.12em .08em 0; border-radius: .26em; background: var(--brand); color: #fff; overflow: hidden; }
.services .ttl .h2 .up svg { width: .56em; height: .56em; animation: subir 2.6s var(--ease-out) infinite; }
@keyframes subir { 0%, 40% { transform: none; opacity: 1; } 55% { transform: translate(120%, -120%); opacity: 0; } 56% { transform: translate(-120%, 120%); opacity: 0; } 75%, 100% { transform: none; opacity: 1; } }
.svc-list { margin-top: clamp(48px, 6vw, 96px); position: relative; }
.svc-item { position: relative; display: grid; grid-template-columns: 1fr; }

.svc-item .row { display: flex; align-items: center; gap: 24px; padding: 30px 0; border-top: 1px dashed var(--border-dark); cursor: pointer; }
.svc-item:last-child .row { border-bottom: 1px dashed var(--border-dark); }
.svc-item .row .ar { width: 56px; height: 40px; flex: none; color: var(--brand-soft); transition: transform .5s var(--ease-out); }
.svc-item:hover .row .ar, .svc-item.active .row .ar { transform: translateX(10px); }
.svc-item .row .nm { flex: 1; min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; font-size: clamp(30px, 5vw, 76px); font-weight: 500; line-height: 1; letter-spacing: -.04em; color: #fff; transition: color .3s; }
.svc-item .row .nm .idx { font-family: var(--mono); font-size: clamp(13px, 1.1vw, 16px); color: var(--mute); letter-spacing: 0; padding-top: .3em; }
.svc-item:hover .row .nm, .svc-item.active .row .nm { color: #fff; }
.svc-list:hover .svc-item:not(:hover) .row .nm { color: rgba(255,255,255,.35); }
.svc-item .info { padding: 0 0 36px; max-width: 420px; }
@media (min-width: 900px) { .svc-item .info { display: none; } .svc-item .row { padding: 26px 0; } .svc-item .row .nm { padding-right: 36%; } }
.svc-item .info .cat { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 13px; text-transform: uppercase; color: var(--mute); }
.svc-item .info .cat::before { content: "+"; color: var(--brand-soft); font-weight: 600; }
.svc-item .info p { margin-top: 14px; font-size: 17px; line-height: 1.5; color: rgba(255,255,255,.78); }
.svc-item .info .st { display: inline-block; margin-top: 14px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: #fff; background: rgba(255,255,255,.08); padding: 7px 10px 6px; border-radius: 20px; }
.svc-item .info .sc { display: block; width: 100%; max-width: 300px; height: auto; aspect-ratio: 3/2; margin-bottom: 20px; }
/* Escenas de servicios: ilustraciones animadas (no capturas) */
.sc { display: block; width: 100%; height: 100%; border-radius: var(--r-plate); background: radial-gradient(120% 90% at 85% 10%, rgba(87,144,230,.32), transparent 60%), linear-gradient(160deg, #13203b, #0b1222 70%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.sc text { font-family: var(--mono); font-size: 10px; fill: rgba(255,255,255,.85); text-anchor: middle; text-transform: uppercase; }
.svc-float .sc:not(.on), .svc-float .sc:not(.on) * { animation-play-state: paused !important; }
.sc-perf .x-grid path { stroke: rgba(255,255,255,.07); stroke-width: 1; }
.sc-perf .x-bars rect { fill: rgba(87,144,230,.75); transform-box: fill-box; transform-origin: bottom; animation: barra 3.2s var(--ease-out) var(--d) infinite; }
@keyframes barra { 0% { transform: scaleY(.08); } 35%, 85% { transform: scaleY(var(--h)); } 100% { transform: scaleY(.08); } }
.sc-perf .x-trend { fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 1; animation: trazo 3.2s var(--ease-out) infinite; }
.sc-perf .x-tip { fill: #3fd17a; animation: punto 3.2s ease infinite; }
.sc-perf .x-chips rect { fill: rgba(255,255,255,.1); }
@keyframes trazo { 0% { stroke-dashoffset: 1; } 45%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 1; opacity: 0; } }
@keyframes punto { 0%, 40% { opacity: 0; r: 2; } 50%, 85% { opacity: 1; r: 6; } 100% { opacity: 0; } }
.sc-axiom .x-win rect { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.14); }
.sc-axiom .x-win circle { fill: rgba(255,255,255,.22); }
.sc-axiom .x-tiles rect { fill: rgba(87,144,230,.28); stroke: rgba(87,144,230,.6); animation: baldosa 3s ease var(--d) infinite; }
@keyframes baldosa { 0%, 100% { fill: rgba(87,144,230,.18); } 40% { fill: rgba(87,144,230,.55); } }
.sc-axiom .x-spark { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; animation: trazo 3s var(--ease-out) infinite; }
.sc-axiom .x-live circle { fill: #3fd17a; } .sc-axiom .x-live .x-ring, .sc-ana .x-hub .x-ring { fill: none; stroke: #3fd17a; transform-box: fill-box; transform-origin: center; animation: onda 1.8s ease-out infinite; }
.sc-ana .x-hub .x-ring { stroke: var(--brand-soft); }
@keyframes onda { from { transform: scale(1); opacity: .9; } to { transform: scale(3); opacity: 0; } }
.sc-crm .x-funnel path { fill: rgba(87,144,230,.18); stroke: rgba(87,144,230,.55); }
.sc-crm .x-funnel path:nth-child(2) { fill: rgba(87,144,230,.28); } .sc-crm .x-funnel path:nth-child(3) { fill: rgba(87,144,230,.4); } .sc-crm .x-funnel path:nth-child(4) { fill: rgba(87,144,230,.55); }
.sc-crm .x-drops circle { fill: #fff; animation: caer 2.5s cubic-bezier(.5,0,.75,0) var(--d) infinite; opacity: 0; }
@keyframes caer { 0% { transform: translateY(0); opacity: 0; } 10% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(166px) scale(.6); opacity: 0; } }
.sc-crm .x-win { fill: #3fd17a; animation: punto 2.5s ease infinite; }
.sc-ana .x-links path { fill: none; stroke: rgba(255,255,255,.18); stroke-width: 1.5; }
.sc-ana .x-flow path { fill: none; stroke: var(--brand-soft); stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 3 14; animation: fluir 1.2s linear infinite; }
@keyframes fluir { to { stroke-dashoffset: -17; } }
.sc-ana .x-src rect { fill: rgba(255,255,255,.08); stroke: rgba(255,255,255,.2); }
.sc-ana .x-src text { font-size: 9px; }
.sc-ana .x-hub circle:last-child { fill: var(--brand-soft); }
.sc-ana .x-kpi rect:first-child { fill: rgba(255,255,255,.06); stroke: rgba(255,255,255,.18); }
.sc-ana .x-kpi .x-b { fill: #fff; transform-box: fill-box; transform-origin: bottom; animation: barra 2.4s var(--ease-out) var(--d) infinite; --h: 1; }
.sc-mer .x-rings circle, .sc-mer .x-rings path { fill: none; stroke: rgba(255,255,255,.14); }
.sc-mer .x-sweep { transform-origin: 150px 100px; animation: barrer 3s linear infinite; }
.sc-mer .x-sweep path { fill: rgba(87,144,230,.35); }
@keyframes barrer { to { transform: rotate(360deg); } }
.sc-mer .x-blips circle { fill: #fff; opacity: 0; animation: blip 3s ease var(--d) infinite; transform-box: fill-box; transform-origin: center; }
@keyframes blip { 0% { opacity: 0; transform: scale(.4); } 10% { opacity: 1; transform: scale(1.3); } 25% { transform: none; } 70% { opacity: .9; } 100% { opacity: 0; } }
.sc-cal .x-arc { fill: none; stroke: rgba(255,255,255,.12); stroke-width: 14; stroke-linecap: round; }
.sc-cal .x-arc.x-on { stroke: var(--brand-soft); stroke-dasharray: 1; animation: medidor 3.4s var(--ease-out) infinite; }
@keyframes medidor { 0% { stroke-dashoffset: 1; } 45%, 85% { stroke-dashoffset: .22; } 100% { stroke-dashoffset: 1; } }
.sc-cal .x-needle { transform-origin: 150px 150px; animation: aguja 3.4s var(--ease-out) infinite; }
.sc-cal .x-needle path { stroke: #fff; stroke-width: 3; stroke-linecap: round; } .sc-cal .x-needle circle { fill: #fff; }
@keyframes aguja { 0% { transform: rotate(-88deg); } 45%, 85% { transform: rotate(48deg); } 100% { transform: rotate(-88deg); } }
.sc-cal .x-bubble rect { fill: rgba(255,255,255,.12); }
.sc-cal .x-bubble circle { fill: #fff; animation: dots 1.1s ease var(--d) infinite; }
@media (prefers-reduced-motion: reduce) { .sc *, .services .ttl .h2 .up svg { animation: none !important; } .sc-perf .x-bars rect { transform: scaleY(var(--h)); } .sc-perf .x-trend, .sc-axiom .x-spark { stroke-dashoffset: 0; } .sc-cal .x-needle { transform: rotate(48deg); } .sc-cal .x-arc.x-on { stroke-dashoffset: .22; } }
@keyframes dots { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-4px); opacity: 1; } }
.svc-float { display: none; list-style: none; }
@media (min-width: 900px) {
  .svc-float { display: block; position: absolute; right: 4%; top: 0; width: 320px; pointer-events: none; z-index: 2;
    opacity: 0; transform: translate3d(0, 20px, 0) scale(.96); transition: opacity .4s var(--ease-soft), transform .6s var(--ease-out); }
  .svc-list.hovering .svc-float { opacity: 1; transform: none; }
  .svc-float .pic { position: relative; aspect-ratio: 3/2; border-radius: var(--r-plate); overflow: hidden; }
  .svc-float .sc { position: absolute; inset: 0; opacity: 0; transform: scale(.96); transition: opacity .45s, transform .6s var(--ease-out); }
  .svc-float .sc.on { opacity: 1; transform: none; }
  .svc-float .txt { margin-top: 24px; }
  .svc-float .cat { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 13px; text-transform: uppercase; color: var(--mute); }
  .svc-float .cat::before { content: "+"; color: var(--brand-soft); font-weight: 600; }
  .svc-float .ds { margin-top: 12px; font-size: 17px; line-height: 1.5; color: rgba(255,255,255,.8); }
  .svc-float .st { display: inline-block; margin-top: 14px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: #fff; background: rgba(255,255,255,.08); padding: 7px 10px 6px; border-radius: 20px; }
}

/* ---------- Bayes ---------- */
.bayes { padding: clamp(96px, 10vw, 170px) 0 0; }
.bayes .sec-head .h2 { max-width: 820px; }
.bayes-lab { margin-top: clamp(40px, 5vw, 72px); display: grid; gap: 16px; }
@media (min-width: 1100px) { .bayes-lab { grid-template-columns: 1.3fr 1fr; align-items: stretch; } }
.bayes-lab .box { background: var(--light); border-radius: var(--r-plate); padding: clamp(20px, 2.6vw, 32px); display: flex; flex-direction: column; }
.bayes-lab .box.dark { background: var(--ink); color: #fff; display: flex; flex-direction: column; }
.bayes-lab .box.dark .two { margin-top: 18px; flex: 1; display: grid; gap: 24px; }
@media (min-width: 760px) { .bayes-lab .box.dark .two { grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; align-content: center; } }
.bayes-lab .box.dark .how { margin-top: 14px; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.62); max-width: 420px; }
.bayes-lab .box .cap { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-family: var(--mono); font-size: 13px; text-transform: uppercase; color: var(--text-2); }
.dark .cap { color: var(--mute); }
.bayes-lab .box .cap .day { color: var(--ink); background: #fff; border-radius: 20px; padding: 7px 10px 6px; white-space: nowrap; flex: none; }
.lab-row { margin-top: 20px; flex: 1; display: grid; gap: 22px; align-content: center; }
.bayes-svg { width: 100%; height: auto; display: block; }
.bayes-svg rect, .bayes-svg line { transition: x .7s var(--ease-out), y .7s var(--ease-out), width .7s var(--ease-out), height .7s var(--ease-out); }
.bayes-svg text { font-family: var(--mono); font-size: 12px; fill: var(--text-2); }
.bayes-svg .big { font-family: var(--font); font-size: 15px; font-weight: 500; fill: var(--ink); transition: opacity .3s; }
.bayes-svg .big.inv { fill: #fff; }
.bayes-svg .big.off { opacity: 0; }
.bayes-svg.narrow text { font-size: 22px; }
.bayes-svg.narrow .big { font-size: 26px; }
.legend { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--text-2); }
.legend i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 8px; vertical-align: -1px; }
.ctrls { display: grid; gap: 14px; }
@media (min-width: 760px) { .ctrls { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
.ctrls label { display: grid; gap: 2px; font-size: 13px; color: var(--text); }
.ctrls label .lb { display: flex; justify-content: space-between; gap: 12px; }
.ctrls label .lb b { font-family: var(--mono); font-weight: 500; color: var(--ink); white-space: nowrap; }
.ctrls input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 28px; background: transparent; }
.ctrls input[type=range]::-webkit-slider-runnable-track { height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--brand) var(--p, 50%), #d9d9d9 var(--p, 50%)); }
.ctrls input[type=range]::-moz-range-track { height: 3px; border-radius: 3px; background: #d9d9d9; }
.ctrls input[type=range]::-moz-range-progress { height: 3px; border-radius: 3px; background: var(--brand); }
.ctrls input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 2px solid var(--ink); margin-top: -9.5px; box-shadow: 0 2px 8px rgba(0,0,0,.15); cursor: grab; }
.ctrls input[type=range]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 2px solid var(--ink); box-shadow: 0 2px 8px rgba(0,0,0,.15); cursor: grab; }
.ctrls input[type=range]:focus-visible { outline: none; }
.ctrls input[type=range]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--brand-soft); outline-offset: 2px; }
.formula { font-family: var(--mono); font-size: clamp(17px, 1.4vw, 20px); line-height: 1.35; letter-spacing: -.01em; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.formula .frac { display: inline-grid; text-align: center; }
.formula .frac .up { border-bottom: 1.5px solid currentColor; padding: 0 6px 3px; }
.formula .frac .dn { padding-top: 3px; }
.formula .c1 { color: var(--brand-soft); } .formula .c2 { color: #ffb48f; }
.post { display: grid; gap: 6px; align-self: end; }
.post .v { font-size: clamp(52px, 5vw, 76px); font-weight: 500; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.post .v small { font-size: .4em; color: var(--mute); letter-spacing: 0; margin-left: 4px; }
.post .bar { height: 8px; border-radius: 8px; background: rgba(255,255,255,.12); overflow: hidden; margin-top: 6px; }
.post .bar i { display: block; height: 100%; width: 50%; background: var(--brand-soft); border-radius: 8px; transition: width .7s var(--ease-out); }
.post .read { font-size: 14px; color: rgba(255,255,255,.7); line-height: 1.5; margin-top: 6px; }
.post .acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.post .ml { font-family: var(--mono); font-size: 12px; color: var(--mute); text-transform: uppercase; margin-top: 12px; display: flex; gap: 10px; flex-wrap: wrap; min-height: 1.4em; }
.post .ml [data-hist] { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.post .ml b { font-weight: 500; color: #fff; }
.bayes-steps { list-style: none; margin-top: 16px; display: grid; gap: 16px; }
@media (min-width: 768px) { .bayes-steps { grid-template-columns: repeat(3, 1fr); } }
.bstep { background: var(--light); border-radius: var(--r-plate); padding: 22px 26px 24px; display: flex; flex-direction: column; gap: 8px; }
.bstep .k { font-family: var(--mono); font-size: 13px; text-transform: uppercase; color: var(--text-2); display: flex; justify-content: space-between; margin-bottom: 10px; }
.bstep .k b { color: var(--brand); font-weight: 500; }
.bstep p { color: var(--text-2); font-size: 15px; line-height: 1.5; }

/* ---------- El mapa: todo el crecimiento en vivo ---------- */
.growth { margin-top: clamp(96px, 10vw, 170px); padding: clamp(64px, 7vw, 110px) 0 clamp(48px, 5vw, 72px); }
.growth .sec-head .h2 { max-width: 760px; }
.live { margin-top: clamp(32px, 4vw, 56px); border: 1px solid var(--ink-2); border-radius: var(--r-plate); overflow: hidden; }
.topbar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; padding: 16px 22px; border-bottom: 1px solid var(--ink-2); }
.topbar .clock { display: inline-flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 13px; text-transform: uppercase; white-space: nowrap; }
.topbar .clock i { width: 8px; height: 8px; border-radius: 50%; background: #3fd17a; box-shadow: 0 0 0 0 rgba(63,209,122,.5); animation: beat 2s infinite; }
.live.paused .topbar .clock i { background: var(--mute); animation: none; box-shadow: none; }
@keyframes beat { 0% { box-shadow: 0 0 0 0 rgba(63,209,122,.5); } 70% { box-shadow: 0 0 0 8px rgba(63,209,122,0); } 100% { box-shadow: 0 0 0 0 rgba(63,209,122,0); } }
.topbar .tot { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 24px; flex: 1; }
.topbar .tot li { display: flex; flex-direction: column; gap: 1px; }
.topbar .tot span { font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); }
.topbar .tot b { font-size: 17px; font-weight: 500; letter-spacing: -.01em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.topbar .ctl { display: flex; gap: 8px; margin-left: auto; }
.replay { white-space: nowrap; font: inherit; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: #fff; background: transparent; border: 1px solid var(--ink-2); border-radius: 20px; padding: 7px 12px 6px; cursor: pointer; transition: border-color .3s, background .3s; }
.replay:hover { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.06); }
.live .scroller { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--ink-3) transparent; }
.live .board { position: relative; min-width: 1800px; padding: 18px 24px 22px; }
.live .gc { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; pointer-events: none; }
.live .cols { display: grid; grid-template-columns: repeat(8, minmax(168px, 1fr)); column-gap: clamp(56px, 4vw, 88px); position: relative; z-index: 1; min-height: 430px; }
.col { display: flex; flex-direction: column; padding: 0; }
.col > header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 2px 2px 12px; margin-bottom: 6px; border-bottom: 1px dashed rgba(255,255,255,.14); }
.col > header .ttl { display: block; font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: rgba(255,255,255,.85); }
.col > header .met { display: block; font-size: 11px; color: #8a8a8a; margin-top: 3px; }
.col > header .tot { font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,.75); background: rgba(255,255,255,.08); border-radius: 10px; padding: 4px 7px 3px; white-space: nowrap; }
.col .stack { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.gcard { position: relative; overflow: hidden; background: #161616; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 10px 10px 8px; display: flex; flex-direction: column; gap: 8px; transition: border-color .35s, box-shadow .35s, opacity .4s; pointer-events: none; }
.gcard.hit { border-color: rgba(87,144,230,.9); box-shadow: 0 0 0 1px rgba(87,144,230,.35), 0 0 18px rgba(87,144,230,.25); }
.gcard.paused { opacity: .5; border-style: dashed; }
.gcard > header { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.gcard > header .nm { font-size: 12.5px; font-weight: 500; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gcard > header .rate { font-size: 11px; font-weight: 500; color: #9dbdf2; background: rgba(87,144,230,.18); border-radius: 9px; padding: 3px 7px 2px; white-space: nowrap; flex: none; }
.gcard.worst > header .rate { color: #ffb48f; background: rgba(235,104,52,.2); }
.gcard.paused > header .rate { color: #8a8a8a; background: rgba(255,255,255,.06); }
.gcard .meta { display: flex; justify-content: space-between; gap: 6px; font-family: var(--mono); font-size: 10.5px; color: #8a8a8a; white-space: nowrap; }
.gcard .meta .sub, .gcard .meta .cnt { overflow: hidden; text-overflow: ellipsis; }
.gcard .meta .sub { color: #6f6f6f; }
.gcard .bell { width: 100%; height: auto; display: block; }
.gcard .bell .grid { stroke: rgba(255,255,255,.07); stroke-width: 1; fill: none; }
.gcard .bell .fill { fill: url(#bellg); fill: rgba(87,144,230,.28); stroke: none; }
.gcard .bell .line { fill: none; stroke: var(--brand-soft); stroke-width: 1.4; stroke-linejoin: round; }
.gcard .bell .mean { stroke: rgba(255,255,255,.7); stroke-width: 1; }
.gcard .bell .base { stroke: rgba(255,255,255,.16); stroke-width: 1; }
.gcard.worst .bell .fill { fill: rgba(235,104,52,.28); } .gcard.worst .bell .line { stroke: var(--orange); }
.gcard.paused .bell .fill { fill: rgba(140,140,140,.2); } .gcard.paused .bell .line { stroke: #8a8a8a; }
.gcard .bell path, .gcard .bell line { transition: d .35s linear, x1 .35s linear, x2 .35s linear; }
/* maquetas por etapa */
.mock { border-radius: 8px; overflow: hidden; font-size: 11px; line-height: 1.3; }
.mock.k-camp { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 4px 8px; align-items: center; }
.mock.k-camp .plat { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; font-weight: 600; font-size: 11px; color: #fff; grid-row: 1; }
.mock.k-camp .plat.g { background: #2d6cdf; } .mock.k-camp .plat.m { background: #1f4fa3; }
.mock.k-camp .st { font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: #3fd17a; }
.gcard.paused .mock.k-camp .st { color: #8a8a8a; }
.mock.k-camp .bars { grid-column: 1 / -1; display: flex; align-items: flex-end; gap: 3px; height: 22px; }
.mock.k-camp .bars i { flex: 1; background: rgba(87,144,230,.55); border-radius: 2px 2px 0 0; height: 8%; transition: height .5s; }
.mock.k-camp .bars i:last-child { background: var(--brand-soft); }
.mock.k-vid { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #1f3f7a, #0f2f63 55%, #2563c9); }
.mock.k-vid .scene { position: absolute; inset: 0; background: radial-gradient(circle at 70% 35%, rgba(255,255,255,.28), transparent 32%), radial-gradient(circle at 30% 70%, rgba(87,144,230,.5), transparent 40%); }
.mock.k-vid .play { position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: rgba(255,255,255,.92); }
.mock.k-vid .play::after { content: ""; position: absolute; left: 9px; top: 6px; border-left: 7px solid #0a0a0a; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
.mock.k-vid .dur { position: absolute; right: 5px; bottom: 5px; font-family: var(--mono); font-size: 9px; background: rgba(0,0,0,.55); color: #fff; padding: 2px 4px; border-radius: 4px; }
.mock.k-vid .cap { position: absolute; left: 6px; bottom: 5px; font-size: 9px; color: rgba(255,255,255,.85); }
.mock.k-car { position: relative; height: 62px; }
.mock.k-car .c { position: absolute; top: 4px; width: 46%; height: 46px; border-radius: 6px; background: linear-gradient(160deg, #2a2a2a, #1a1a1a); border: 1px solid rgba(255,255,255,.12); }
.mock.k-car .c::after { content: ""; position: absolute; left: 6px; right: 6px; bottom: 6px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.25); }
.mock.k-car .c1 { left: 0; } .mock.k-car .c2 { left: 27%; top: 0; height: 50px; background: linear-gradient(160deg, #2b4f8f, #1b3366); z-index: 1; } .mock.k-car .c3 { left: 54%; }
.mock.k-car .dots { position: absolute; left: 50%; bottom: 2px; transform: translateX(-50%); display: flex; gap: 3px; }
.mock.k-car .dots i { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.3); } .mock.k-car .dots i:nth-child(2) { background: #fff; }
.mock.k-tad { background: #fff; color: #1f1f1f; padding: 7px 8px; display: grid; gap: 1px; }
.mock.k-tad .lbl { font-size: 9px; font-weight: 600; color: #1f1f1f; display: inline; } .mock.k-tad .url { font-size: 9px; color: #4a4a4a; display: inline; margin-left: 4px; }
.mock.k-tad b { font-size: 11px; color: #1a0dab; font-weight: 500; line-height: 1.25; margin-top: 2px; } .mock.k-tad small { font-size: 9.5px; color: #4a4a4a; }
.mock.k-cta { display: grid; place-items: center; padding: 10px 0; }
.mock.k-cta .bt { display: inline-block; padding: 8px 14px; border-radius: 20px; font-size: 11.5px; font-weight: 500; }
.mock.k-cta .bt.brand { background: var(--brand); color: #fff; } .mock.k-cta .bt.wa { background: #1f8a4c; color: #fff; }
.mock.k-msg.k-wa { padding: 4px 0 2px; }
.mock.k-msg.k-wa .bub { background: #1f6b3a; color: #fff; border-radius: 10px 10px 10px 2px; padding: 6px 8px 14px; position: relative; font-size: 10.5px; line-height: 1.3; }
.mock.k-msg.k-wa .bub time { position: absolute; right: 7px; bottom: 3px; font-size: 8.5px; color: rgba(255,255,255,.7); }
.mock.k-msg.k-call, .mock.k-seg, .mock.k-lead, .mock.k-venta { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.mock b { display: block; font-size: 11.5px; font-weight: 500; line-height: 1.25; } .mock small { display: block; font-size: 10px; color: #9d9d9d; line-height: 1.3; margin-top: 1px; }
.mock .ph, .mock .ic, .mock .chk { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; }
.mock .ph, .mock .ic.call { background: rgba(87,144,230,.2); } .mock .ic.wa { background: rgba(31,138,76,.3); } .mock .chk { background: rgba(63,209,122,.2); }
.mock .ph::after, .mock .ic.call::after { content: ""; width: 10px; height: 10px; border: 2px solid #9dbdf2; border-radius: 3px 3px 3px 0; transform: rotate(-45deg); border-right-color: transparent; border-bottom-color: transparent; }
.mock .ic.wa::after { content: ""; width: 10px; height: 10px; border-radius: 50%; border: 2px solid #5ad58a; }
.mock .chk::after { content: ""; width: 5px; height: 9px; border-right: 2px solid #3fd17a; border-bottom: 2px solid #3fd17a; transform: rotate(45deg) translate(-1px, -1px); }
.mock.k-seg small.good { color: #5ad58a; }
.mock.k-lead .av { flex: none; width: 26px; height: 26px; border-radius: 50%; background: #2563c9; color: #fff; display: grid; place-items: center; font-size: 10px; font-weight: 600; }
.mock.k-lead > div { flex: 1; min-width: 0; } .mock.k-lead b, .mock.k-lead small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mock.k-lead .q { flex: none; font-family: var(--mono); font-size: 9px; text-transform: uppercase; color: #5ad58a; background: rgba(63,209,122,.15); padding: 3px 5px 2px; border-radius: 8px; }
.mock.k-lead .q.no { color: #ffb48f; background: rgba(235,104,52,.15); }
.mock.k-orden { background: #fff; color: #1f1f1f; padding: 7px 8px 6px; font-size: 10px; }
.mock.k-orden .hd { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 9.5px; color: #4a4a4a; padding-bottom: 4px; border-bottom: 1px dashed #d0d0d0; }
.mock.k-orden ul { list-style: none; display: grid; gap: 2px; padding: 4px 0; }
.mock.k-orden li { display: flex; justify-content: space-between; gap: 6px; font-size: 10px; } .mock.k-orden li span:last-child { font-family: var(--mono); color: #4a4a4a; }
.mock.k-orden .tt { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid #1f1f1f; padding-top: 4px; font-size: 10px; }
.mock.k-orden .tt b { font-family: var(--mono); font-size: 12px; font-weight: 600; color: #1f1f1f; display: inline; }
.live .feed { width: 100%; font-size: 13px; color: rgba(255,255,255,.72); border-top: 1px solid var(--ink-2); padding-top: 12px; margin-top: 2px; min-height: 1.4em; transition: opacity .16s; display: flex; gap: 10px; align-items: baseline; }
.live .feed::before { content: "En vivo"; font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: #3fd17a; flex: none; }
.live .feed.sw { opacity: 0; }
.live .hint { display: none; font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); padding: 8px 22px 0; }
.live.scrolls .hint { display: block; }
.gpanel { display: grid; gap: 24px; border-top: 1px solid var(--ink-2); padding: 20px 22px 24px; }
@media (min-width: 900px) { .gpanel { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (min-width: 1180px) { .gpanel { grid-template-columns: 300px 1fr 1.25fr; gap: 36px; } }
.gpanel .cap { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: var(--mute); }
.gpanel .state { font-family: var(--mono); font-size: 11px; padding: 5px 9px 4px; border-radius: 12px; background: rgba(255,255,255,.1); color: #fff; white-space: nowrap; transition: background .4s; }
.gpanel .state.neg { background: var(--orange); }
.gpanel .state.pos { background: var(--brand); }
.roas .v { margin-top: 8px; display: flex; align-items: baseline; gap: 4px; font-size: clamp(48px, 4.6vw, 68px); font-weight: 500; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; transition: color .5s; }
.roas .v small { font-size: .4em; color: var(--mute); letter-spacing: 0; }
.roas .v .x { margin-left: 14px; font-family: var(--mono); font-size: 14px; color: var(--mute); letter-spacing: 0; }
.roas.neg .v { color: #ffb48f; }
.roas.pos .v { color: var(--brand-soft); }
.roas .curve { width: 100%; height: auto; display: block; margin-top: 8px; }
.roas svg .zero { stroke: rgba(255,255,255,.25); stroke-width: 1; stroke-dasharray: 3 3; }
.roas .curve path { fill: rgba(87,144,230,.35); stroke: var(--brand-soft); stroke-width: 1.5; transition: d .5s; }
.roas.neg .curve path { fill: rgba(235,104,52,.35); stroke: #ffb48f; }
.roas svg text { font-family: var(--mono); font-size: 10px; fill: var(--mute); }
.trend { display: flex; flex-direction: column; }
.trend svg { width: 100%; height: auto; display: block; margin-top: 10px; }
.trend svg .zero { stroke: rgba(255,255,255,.25); stroke-width: 1; stroke-dasharray: 3 3; }
.trend rect { transition: height .4s, y .4s; }
.trend .read { margin-top: 14px; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.72); max-width: 360px; }
.trend .leg { margin-top: auto; padding-top: 14px; display: flex; gap: 16px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); }
.trend .leg i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.gdec { display: flex; flex-direction: column; }
@media (min-width: 1180px) { .gdec { border-left: 1px solid var(--ink-2); padding-left: 36px; } }
.laws { list-style: none; margin-top: 12px; display: grid; gap: 8px; }
.laws li { display: grid; grid-template-columns: 128px 1fr; gap: 12px; align-items: start; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.72); }
.laws .k { font-family: var(--mono); font-size: 11px; text-transform: uppercase; padding: 5px 9px 4px; border-radius: 12px; text-align: center; color: #fff; margin-top: 1px; }
.laws .k.neg { background: rgba(235,104,52,.25); color: #ffb48f; }
.laws .k.pos { background: rgba(37,99,201,.35); color: var(--brand-soft); }
.log { list-style: none; margin-top: 18px; display: grid; gap: 6px; }
.log li { display: grid; grid-template-columns: 52px 1fr; gap: 12px; font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.82); padding: 8px 0; border-top: 1px solid var(--ink-2); animation: login .5s var(--ease-out); }
.log li .d { font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); padding-top: 3px; white-space: nowrap; }
.log li.neg .d { color: #ffb48f; } .log li.pos .d { color: var(--brand-soft); }
@keyframes login { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.growth .note { margin-top: 18px; font-size: 13px; line-height: 1.5; color: var(--mute); max-width: 820px; }
@media (max-width: 1280px) { .live .hint { display: block; } }
@media (max-width: 640px) {
  .topbar { padding: 14px 16px; gap: 10px 18px; }
  .topbar .tot b { font-size: 15px; }
  .topbar .clock { width: 100%; }
  .topbar .tot { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; gap: 8px 12px; }
  .topbar .ctl { margin-left: 0; }
  .gpanel { padding: 18px 16px 22px; }
  .laws li { grid-template-columns: 1fr; gap: 6px; }
  .laws .k { justify-self: start; }
}

/* ---------- Estudio comercial y noticias ---------- */
.signals { padding: clamp(96px, 10vw, 170px) 0 0; }
.flow { margin-top: clamp(40px, 5vw, 72px); background: var(--light); border-radius: var(--r-plate); padding: clamp(14px, 1.6vw, 20px); display: grid; gap: 14px; }
@media (min-width: 1024px) { .flow { grid-template-columns: minmax(230px, 280px) minmax(140px, 1fr) minmax(220px, 260px) minmax(280px, 340px); gap: 0 14px; align-items: stretch; } }
.flow .src, .flow .dst { list-style: none; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }
.flow .src button { width: 100%; text-align: left; font: inherit; background: #fff; border: 0; border-radius: 14px; padding: 13px 16px 13px 18px; cursor: pointer; display: grid; gap: 2px; color: var(--ink); position: relative; overflow: hidden; transition: background .35s, color .35s; }
.flow .src button::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--brand); opacity: 0; transition: opacity .35s; }
.flow .src button .nm { font-size: 15px; font-weight: 500; line-height: 1.2; }
.flow .src button .ds { font-size: 12.5px; line-height: 1.4; color: var(--text-2); transition: color .35s; }
.flow .src button:hover { background: #e9e9e9; }
.flow .src button[aria-selected=true] { background: var(--ink); color: #fff; }
.flow .src button[aria-selected=true]::before { opacity: 1; background: var(--brand-soft); }
.flow .src button[aria-selected=true] .ds { color: rgba(255,255,255,.62); }
.flow .wires-wrap { position: relative; min-height: 120px; }
.flow .wires { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; }
.flow .wires path { fill: none; stroke: #d7d7d7; stroke-width: 1.25; opacity: .9; transition: stroke .4s, stroke-width .4s, opacity .4s; }
.flow .wires path.on { stroke: var(--brand); stroke-width: 2; opacity: 1; }
.flow .wires path.dash { stroke: #fff; stroke-width: 2; stroke-dasharray: 4 10; stroke-linecap: round; opacity: 0; }
.flow .wires path.dash.on { opacity: .9; animation: wire 1.1s linear infinite; }
@keyframes wire { to { stroke-dashoffset: -14; } }
.flow .mid { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--ink); background: var(--light); border: 1px solid var(--border); border-radius: 20px; padding: 7px 11px 6px; white-space: nowrap; }
.flow .dst li { background: #fff; border-radius: 12px; padding: 10px 14px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 10px; color: var(--text-2); transition: background .4s, color .4s; }
.flow .dst li b { font-size: 14.5px; font-weight: 500; }
.flow .dst li::after { content: ""; grid-row: 1; grid-column: 2; width: 8px; height: 8px; border-radius: 50%; background: var(--border); transition: background .4s; }
.flow .dst li small { grid-column: 1 / -1; font-size: 12px; line-height: 1.35; color: var(--text-2); display: none; }
.flow .dst li.on { background: var(--ink); color: #fff; }
.flow .dst li.on::after { background: var(--brand-soft); }
.flow .dst li.on small { display: block; color: rgba(255,255,255,.62); }
.flow .ex { background: var(--ink); color: #fff; border-radius: 16px; padding: 22px 24px; display: flex; flex-direction: column; }
.flow .ex .cap { font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); display: flex; justify-content: space-between; gap: 10px; }
.flow .ex .cap b { color: var(--brand-soft); font-weight: 500; }
.flow .ex .sig { margin-top: 12px; font-size: clamp(19px, 1.5vw, 23px); line-height: 1.25; letter-spacing: -.015em; text-wrap: pretty; }
.flow .ex .so { margin-top: auto; padding-top: 18px; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.66); }
.flow .ex .sig, .flow .ex .so, .flow .ex .cap b { transition: opacity .3s; }
.flow .ex.sw .sig, .flow .ex.sw .so, .flow .ex.sw .cap b { opacity: 0; }
.fuentes-svc .fuentes { margin-top: 0; }
.svc.fuentes-svc .fuentes .txt .h3 { font-family: var(--font); font-size: clamp(24px, 2.6vw, 36px); font-weight: 500; text-transform: none; letter-spacing: -.02em; line-height: 1.1; color: var(--ink); margin: 18px 0; }
.mas-fuentes { margin-top: 28px; display: flex; justify-content: flex-end; }
.fuentes { margin-top: clamp(48px, 6vw, 88px); display: grid; gap: 28px; }
@media (min-width: 1000px) { .fuentes { grid-template-columns: minmax(320px, 1fr) minmax(0, 1.2fr); gap: clamp(32px, 4vw, 64px); align-items: start; } }
.fuentes .txt .h3 { margin: 18px 0 18px; max-width: 520px; }
.fuentes .txt > p { font-size: 16px; line-height: 1.6; color: var(--text-2); max-width: 560px; }
.src-groups { list-style: none; margin: 26px 0 0; padding: 0; border-top: 1px dashed var(--border); }
.src-groups li { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 13px 0; border-bottom: 1px dashed var(--border); font-size: 15px; line-height: 1.45; }
.src-groups b { font-weight: 500; } .src-groups span { color: var(--text-2); }
.fuentes .fine { margin-top: 22px; font-size: 14.5px; }
.radar { padding: 26px 28px 22px; }
.radar .rcap { display: flex; justify-content: space-between; gap: 12px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: rgba(255,255,255,.75); }
.radar .rcap .ex { color: var(--brand-soft); }
.news { list-style: none; margin: 14px 0 0; padding: 0; }
.news li { display: grid; gap: 7px; padding: 16px 0; border-top: 1px dashed rgba(255,255,255,.14); }
.news .meta { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; }
.news .src { background: rgba(255,255,255,.1); padding: 4px 8px 3px; border-radius: 10px; color: #fff; }
.news .kind { color: var(--brand-soft); }
.news .h { font-size: 18px; font-weight: 500; letter-spacing: -.01em; line-height: 1.25; }
.news .eff, .news .act { display: grid; grid-template-columns: 80px 1fr; gap: 10px; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.72); }
.news .eff span, .news .act span { font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; color: var(--mute); padding-top: 3px; }
.news .act { color: #fff; } .news .act span { color: #6fe09c; }
.radar .rnote { margin-top: 14px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--mute); }
@media (max-width: 560px) { .src-groups li { grid-template-columns: 1fr; gap: 4px; } .news .eff, .news .act { grid-template-columns: 1fr; gap: 2px; } .radar { padding: 20px 18px; } }
@media (max-width: 1023px) {
  .flow .wires-wrap { display: none; }
  .flow .src { display: grid; grid-template-columns: 1fr 1fr; }
  .flow .dst li small { display: block; color: var(--mute); }
}
@media (max-width: 560px) { .flow .src { grid-template-columns: 1fr; } }
/* ---------- Pregúntale al senior: ciudad de noche + consola de vidrio ---------- */
.senior.plate.dark { position: relative; overflow: hidden; margin-top: clamp(96px, 10vw, 170px); padding: clamp(32px, 4vw, 48px) 0;
  min-height: min(calc(100svh - 32px), 940px); display: flex; align-items: center;
  background: #070a14 url("../img/ciudad-noche.webp?v=9e25d2cc13") center / cover no-repeat; }
.senior::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(5,7,14,.78) 0%, rgba(5,7,14,.45) 48%, rgba(5,7,14,.18) 100%); pointer-events: none; }
.senior .wrap { position: relative; width: 100%; }
.sgrid { display: grid; gap: 28px; } .sgrid > * { min-width: 0; }
@media (min-width: 1000px) { .sgrid { grid-template-columns: minmax(300px, .85fr) minmax(0, 1.15fr); gap: clamp(32px, 4vw, 72px); align-items: center; } }
.senior .intro .h2 { margin-top: 18px; max-width: 520px; font-size: clamp(30px, 3.6vw, 50px); text-shadow: 0 2px 24px rgba(0,0,0,.45); }
.senior .intro .lead { margin-top: 16px; max-width: 500px; font-size: clamp(15px, 1.15vw, 17px); color: rgba(255,255,255,.8); }
.temas { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 7px; }
.temas li { font-family: var(--mono); font-size: 11px; line-height: 1; text-transform: uppercase; letter-spacing: .02em; padding: 8px 11px 7px; border-radius: 20px; border: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.82); background: rgba(10,12,20,.35); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.temas li:last-child { border-color: var(--brand-soft); color: #fff; }
.alcance { margin-top: 22px; display: grid; gap: 10px; max-width: 500px; }
.alcance div { display: grid; grid-template-columns: 104px 1fr; gap: 12px; padding-top: 10px; border-top: 1px dashed rgba(255,255,255,.2); }
.alcance dt { font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .02em; color: var(--brand-soft); padding-top: 2px; }
.alcance dd { font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.78); }

/* la consola: vidrio esmerilado sobre la ciudad; el hilo se desplaza por dentro para que la sección quepa en pantalla */
.console { height: min(calc(100svh - 112px), 780px); min-height: 520px; display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 14px;
  border-radius: 28px; background: rgba(16,18,26,.58); border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%);
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.12); }
.console .av { width: 34px; height: 34px; border-radius: 50%; flex: none; background: var(--brand) url("../img/icono.svg?v=62b9376d80") center/60% no-repeat; box-shadow: 0 0 0 2px rgba(255,255,255,.12); }
.chead { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 2px 2px 0; }
.chead .cwho { display: flex; align-items: center; gap: 12px; min-width: 0; }
.chead .cwho b { display: block; font-size: 15px; font-weight: 500; letter-spacing: -.01em; }
.chead .st { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .02em; color: rgba(255,255,255,.62); margin-top: 3px; }
.chead .st i { width: 7px; height: 7px; border-radius: 50%; background: #3fd17a; animation: beat 2s infinite; }
.chead .quota { flex: none; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .02em; padding: 7px 11px 6px; border-radius: 20px; background: rgba(255,255,255,.12); color: #fff; transition: background .3s, color .3s; }
.chead .quota.off { background: transparent; box-shadow: inset 0 0 0 1px rgba(255,255,255,.22); color: rgba(255,255,255,.6); }
.seg { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 22px; background: rgba(255,255,255,.08); font-size: 13.5px; font-weight: 500; text-align: center; }
.seg span { padding: 8px 10px; border-radius: 20px; color: rgba(255,255,255,.62); transition: background .4s var(--ease-out), color .3s; }
.seg span.on { background: var(--brand); color: #fff; }

.thread { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 10px; padding: 2px 2px 6px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
.thread::-webkit-scrollbar { width: 6px; } .thread::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 6px; }
.msg { display: flex; gap: 10px; align-items: flex-start; }
.msg .bd { min-width: 0; flex: 1; display: grid; gap: 10px; }
.msg.bot .bd { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.08); border-radius: 18px; padding: 12px 14px 13px; }
.msg .txt { font-size: 15.5px; line-height: 1.5; letter-spacing: -.005em; text-wrap: pretty; }
.msg.user { justify-content: flex-end; }
.msg.user .txt { background: var(--brand); color: #fff; border-radius: 18px 18px 4px 18px; padding: 11px 15px; max-width: 80%; font-size: 15px; box-shadow: 0 10px 30px -10px rgba(37,99,201,.7); }
.msg .mh { display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .02em; color: rgba(255,255,255,.62); }
.msg .mh > span:first-child { color: #fff; font-family: var(--font); font-size: 14px; font-weight: 500; text-transform: none; letter-spacing: -.01em; }
.msg .mh time { margin-left: auto; color: rgba(255,255,255,.5); }
.msg .mh .ex { color: var(--brand-soft); }
.msg .mh .rd { color: rgba(255,255,255,.62); }
.msg .mh .rd::before { content: ""; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: currentColor; margin: 0 8px 0 0; vertical-align: 2px; }
.msg .txt .w { display: inline-block; animation: wordin .42s var(--ease-out) both; }
@keyframes wordin { from { opacity: 0; transform: translateY(5px); filter: blur(3px); } to { opacity: 1; transform: none; filter: blur(0); } }
.msg .cur::after { content: ""; display: inline-block; width: 8px; height: 1em; margin-left: 2px; vertical-align: -0.15em; background: var(--brand-soft); animation: cursor .9s steps(2) infinite; }
@keyframes cursor { 50% { opacity: 0; } }
.scan { overflow: hidden; display: grid; gap: 6px; }
.scan .sh { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .02em; color: rgba(255,255,255,.62); }
.scan .sh i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand-soft); animation: beat 1.2s infinite; }
.scan ul { display: grid; gap: 3px; }
.scan li { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 10px; border-radius: 10px; font-size: 13px; color: rgba(255,255,255,.42); transition: color .3s, background .3s; }
.scan li .r { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .02em; color: var(--mute); flex: none; }
.scan li::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 0%, rgba(87,144,230,.25) 50%, transparent 100%); transform: translateX(-100%); opacity: 0; }
.scan li::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 1px; background: var(--brand-soft); transform: scaleX(0); transform-origin: left; opacity: 0; }
.scan li.on { color: #fff; background: rgba(255,255,255,.07); }
.scan li.on::before { opacity: 1; animation: sweep .5s linear infinite; }
.scan li.on::after { opacity: 1; animation: scanbar .45s var(--ease-out) forwards; }
.scan li.miss { color: rgba(255,255,255,.55); }
.scan li.hit { color: #fff; animation: flash .9s ease-out; } .scan li.hit .r { color: #6fe09c; }
@keyframes flash { from { background: rgba(111,224,156,.16); } to { background: transparent; } }
.scan li.hit .r::before, .scan li.miss .r::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; background: currentColor; }
@keyframes checkpop { 0% { transform: scale(.4); } 60% { transform: scale(1.25); } 100% { transform: none; } }
@keyframes sweep { to { transform: translateX(100%); } }
@keyframes scanbar { to { transform: scaleX(1); } }
.datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 6px; }
.datos div { background: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.06); border-radius: 12px; padding: 10px 12px 9px; display: grid; gap: 3px; }
.datos dt { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .02em; color: var(--mute); line-height: 1.3; }
.datos dd { font-size: 17px; font-weight: 500; letter-spacing: -.015em; line-height: 1.2; }
.datos dd small { display: block; font-size: 11.5px; font-weight: 400; color: rgba(255,255,255,.6); margin-top: 2px; letter-spacing: 0; }
.msg .ln { display: grid; grid-template-columns: 88px 1fr; gap: 8px; font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.75); }
.msg .ln > span:first-child { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .02em; color: var(--mute); padding-top: 3px; }
.msg .ln.lect { color: #fff; } .msg .ln.lect > span:first-child { color: #6fe09c; }
.msg .ln.src b { display: inline-block; font-weight: 400; font-family: var(--mono); font-size: 10.5px; background: rgba(255,255,255,.12); padding: 4px 8px 3px; border-radius: 10px; margin: 0 5px 5px 0; }
.msg .ln.src time { font-family: var(--mono); font-size: 10.5px; color: var(--mute); }
.msg .ln.falta { color: rgba(255,255,255,.6); }

.offer { background: rgba(37,99,201,.18); border: 1px solid rgba(87,144,230,.35); border-radius: 18px; padding: 16px 16px 14px; display: grid; gap: 10px; color: #fff; }
.offer .oh { font-size: clamp(18px, 1.5vw, 21px); font-weight: 500; letter-spacing: -.02em; line-height: 1.15; text-wrap: balance; }
.offer p { font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.75); }
.offer form { display: grid; gap: 10px; margin-top: 2px; }
.offer .row2 { display: grid; gap: 10px; } @media (min-width: 640px) { .offer .row2 { grid-template-columns: 1fr 1fr; } }
.offer .field label { color: rgba(255,255,255,.6); font-size: 10.5px; margin-bottom: 6px; }
.offer .field input { background: rgba(0,0,0,.3); border-color: rgba(255,255,255,.18); color: #fff; padding: 10px 12px; font-size: 14px; }
.offer .field input::placeholder { color: rgba(255,255,255,.35); }
.offer .field input:focus { border-color: var(--brand-soft); box-shadow: 0 0 0 3px rgba(87,144,230,.25); }
.offer .field .err { color: #ffb4b4; }
.offer .ofoot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.offer .ofoot small { font-size: 12px; line-height: 1.4; color: rgba(255,255,255,.55); max-width: 320px; }
.offer .btn.ink { background: #fff; color: var(--ink); } .offer .btn.ink:hover { background: #e9eefc; }
.plan { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 18px; padding: 16px 16px 14px; display: grid; gap: 12px; }
.plan .steps { display: grid; gap: 7px; }
.plan .steps li { display: flex; gap: 10px; align-items: center; font-size: 14px; color: rgba(255,255,255,.55); transition: color .3s, transform .4s var(--ease-out); }
.plan .steps li.on { transform: translateX(4px); }
.plan .steps li::before { content: ""; width: 16px; height: 16px; border-radius: 50%; flex: none; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.3); transition: background .3s, box-shadow .3s; }
.plan .steps li.on { color: #fff; } .plan .steps li.on::before { box-shadow: inset 0 0 0 1.5px var(--brand-soft); animation: beat 1.4s infinite; }
.plan .steps li.done { color: #fff; } .plan .steps li.done::before { background: #3fd17a; box-shadow: none; animation: checkpop .5s var(--ease-out);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23000'/%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9' stroke='%23fff' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23000'/%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-4.9' stroke='%23fff' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.plan .ph { font-size: 17px; font-weight: 500; letter-spacing: -.015em; line-height: 1.2; }
.plan .ph small { display: block; font-family: var(--mono); font-size: 10.5px; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; color: var(--brand-soft); margin-bottom: 6px; }
.plan .blocks { display: grid; gap: 8px; } @media (min-width: 700px) { .plan .blocks { grid-template-columns: 1fr 1fr; } }
.plan .blocks div { background: rgba(0,0,0,.26); border-radius: 12px; padding: 11px 12px; display: grid; gap: 4px; }
.plan .blocks b { font-family: var(--mono); font-size: 10px; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; color: var(--mute); }
.plan .blocks p, .plan .blocks li { font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.82); }
.plan .blocks ul { display: grid; gap: 3px; } .plan .blocks li { padding-left: 13px; position: relative; } .plan .blocks li::before { content: ""; position: absolute; left: 0; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: var(--brand-soft); }
.plan .pf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.plan .pf small { font-size: 12px; color: rgba(255,255,255,.55); max-width: 340px; line-height: 1.4; }

.examples { display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; padding: 2px 24px 2px 2px; margin: 0 -2px; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.examples::-webkit-scrollbar { display: none; }
.examples li { flex: none; }
.examples button { font-size: 13px; line-height: 1.2; white-space: nowrap; padding: 9px 13px; border-radius: 20px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.88); border: 1px solid rgba(255,255,255,.08); transition: background .3s, border-color .3s, color .3s; }
.examples button:hover { background: rgba(255,255,255,.18); color: #fff; }
.ask { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 16px; border-radius: 30px; background: rgba(0,0,0,.42); border: 1px solid rgba(255,255,255,.16); color: #fff; transition: box-shadow .25s, border-color .25s; }
.ask:focus-within { border-color: rgba(87,144,230,.7); box-shadow: 0 0 0 4px rgba(87,144,230,.22); }
.ask .ic { width: 20px; height: 20px; flex: none; color: rgba(255,255,255,.7); }
.ask textarea { flex: 1; min-width: 0; border: 0; outline: none; resize: none; background: transparent; font-size: 15.5px; line-height: 1.4; color: #fff; padding: 9px 0; max-height: 96px; field-sizing: content; }
.ask textarea::placeholder { color: rgba(255,255,255,.5); }
.ask .send { flex: none; width: 42px; height: 42px; border-radius: 50%; background: var(--brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; transition: background .3s, transform .3s var(--ease-out); }
.ask .send:hover { background: #1f56b3; transform: translateY(-1px); } .ask .send:disabled { opacity: .5; }
.ask .send .ar { width: 16px; height: 16px; }
.console .hint { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 14px; font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .02em; color: rgba(255,255,255,.5); padding: 0 6px; }
.console .hint .demo { color: var(--brand-soft); }
.console .used { font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.75); padding: 0 6px; }
.console .lnk { text-decoration: underline; text-underline-offset: .18em; color: #fff; }
@media (max-width: 999px) { .senior.plate.dark { min-height: 0; display: block; } .console { height: min(78svh, 680px); } }
/* Vidrio estilo visionOS sobre la foto de la sala (referencias del operador, 12/10) */
.senior.plate.dark { background: #3a342d url("../img/sala-1920.webp?v=07741021d9") center 60% / cover no-repeat; }
@media (max-width: 999px) { .senior.plate.dark { background-image: url("../img/sala-960.webp?v=1ae60b1f7e"); } }
.senior::before { background: linear-gradient(95deg, rgba(14,12,10,.86) 0%, rgba(14,12,10,.66) 38%, rgba(14,12,10,.18) 70%, rgba(14,12,10,.1) 100%), linear-gradient(0deg, rgba(14,12,10,.35), transparent 40%); }
.console { border-radius: 40px; padding: 20px 22px 16px; gap: 14px;
  background: linear-gradient(180deg, rgba(150,150,155,.34), rgba(110,110,116,.30));
  border: 1px solid rgba(255,255,255,.26);
  backdrop-filter: blur(36px) saturate(170%) brightness(.82); -webkit-backdrop-filter: blur(36px) saturate(170%) brightness(.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), inset 0 -1px 0 rgba(255,255,255,.08), 0 40px 90px -24px rgba(0,0,0,.6); }
.chead { padding: 2px 4px 0; }
.chead .cwho b { font-size: 17px; font-weight: 600; letter-spacing: -.015em; }
.chead .quota { background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.22); }
.seg { background: rgba(0,0,0,.18); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.seg span { color: rgba(255,255,255,.75); }
.seg span.on { background: #1d7cf2; box-shadow: 0 4px 14px -4px rgba(29,124,242,.7); }
.thread { background: rgba(0,0,0,.24); border-radius: 28px; padding: 14px 14px 10px; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.msg.bot .bd { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.12); }
.msg.user .txt { background: #1d7cf2; }
.datos div { background: rgba(0,0,0,.22); border-color: rgba(255,255,255,.1); }
.examples button { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.18); }
.examples button:hover { background: rgba(255,255,255,.26); }
.ask { background: rgba(0,0,0,.26); border-color: rgba(255,255,255,.22); }
.ask .send { background: #1d7cf2; } .ask .send:hover { background: #1669d6; }
.offer { background: rgba(29,124,242,.22); border-color: rgba(120,170,255,.4); }
.plan { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.16); }
.console .hint { color: rgba(255,255,255,.7); } .console .hint .demo { color: #cfe0ff; }
.alcance dt { color: #9cc0ff; } .alcance dd { color: rgba(255,255,255,.86); }
.temas li { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.22); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.senior .tag { background: rgba(255,255,255,.14); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
@media (max-width: 560px) {
  .console { padding: 12px 12px 10px; min-height: 460px; border-radius: 22px; }
  .chead { flex-wrap: wrap; }
  .msg .ln, .alcance div { grid-template-columns: 1fr; gap: 3px; }
  .msg.user .txt { max-width: 92%; }
  .msg .mh { flex-wrap: wrap; row-gap: 3px; } .msg .mh .rd { flex-basis: 100%; } .msg .mh .rd::before { display: none; }
  .offer, .plan { padding: 14px; }
  .console .hint .demo { flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) { .msg .txt .w, .scan li.hit, .plan .steps li.done::before, .chead .st i, .scan .sh i, .scan li::before, .scan li::after, .plan .steps li.on::before { animation: none; } }

/* ---------- Plataforma (tarjetas escalonadas) ---------- */
.platform { padding: clamp(96px, 10vw, 170px) 0 0; }
.cards { margin-top: clamp(40px, 5vw, 72px); display: grid; gap: 24px; }
@media (min-width: 768px) { .cards { grid-template-columns: 1fr 1fr; gap: 28px; } .cards .c:nth-child(2) { margin-top: 120px; } .cards .c:nth-child(3) { margin-top: -120px; } .cards .c:nth-child(4) { margin-top: 0; } }
.card { display: block; }
.card .img { border-radius: var(--r-img); overflow: hidden; background: #f5f5f7; aspect-ratio: 4/3; border: 1px solid rgba(10,10,10,.09); box-shadow: 0 12px 32px rgba(10,10,10,.06); }
.card .img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }
.card:hover .img img { transform: scale(1.04); }
.card .meta { margin-top: 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.card .meta b { font-size: clamp(20px, 2vw, 26px); font-weight: 500; letter-spacing: -.02em; }
.card .meta span { font-family: var(--mono); font-size: 13px; text-transform: uppercase; color: var(--text-2); }
.platform .all { margin-top: clamp(40px, 5vw, 64px); display: flex; justify-content: center; }
.platform .all .cnt { font-family: var(--mono); font-size: 14px; color: var(--brand); }

/* ---------- Compromisos (placa oscura) ---------- */
.rules { margin-top: clamp(96px, 10vw, 170px); padding: clamp(64px, 7vw, 110px) 0; }
.rules .grid { margin-top: clamp(40px, 5vw, 64px); display: grid; gap: 16px; }
@media (min-width: 900px) { .rules .grid { grid-template-columns: repeat(3, 1fr); } }
.rule { background: var(--ink-2); border-radius: var(--r-card); padding: clamp(24px, 2.6vw, 40px); display: flex; flex-direction: column; gap: 20px; min-height: 420px; }
.rule .top { display: flex; justify-content: space-between; align-items: center; }
.rule .top .n { font-family: var(--mono); font-size: 13px; color: var(--mute); text-transform: uppercase; }
.rule .top svg { width: 40px; height: 40px; color: var(--brand-soft); }
.rule blockquote { font-size: clamp(20px, 1.9vw, 26px); font-weight: 500; line-height: 1.3; letter-spacing: -.02em; margin-top: 24px; }
.rule ul { margin-top: auto; display: grid; gap: 10px; padding-top: 20px; border-top: 1px dashed var(--border-dark); font-size: 15px; color: rgba(255,255,255,.75); }
.rule li { display: flex; gap: 10px; }
.rule li::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 2px; border-radius: 50%; background: rgba(255,255,255,.1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235790e6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/60% no-repeat; }

/* ---------- Preguntas ---------- */
.faq { padding: clamp(96px, 10vw, 170px) 0 0; }
.faq .grid { display: grid; gap: 40px; }
@media (min-width: 1024px) { .faq .grid { grid-template-columns: 1fr 1.25fr; gap: 48px; } }
.faq .l { max-width: 540px; }
.faq .l .h2 { margin-top: 24px; }
.faq .l .lead { margin-top: 20px; }
.faq .items { display: grid; gap: 12px; max-width: 690px; }
.faq details { background: var(--light); border-radius: var(--r-pill); padding: 20px 28px; transition: border-radius .35s var(--ease-soft), background-color .3s; }
.faq details:hover, .faq details[open] { border-radius: var(--r-card); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: clamp(17px, 1.5vw, 22px); font-weight: 500; letter-spacing: -.01em; line-height: 1.3; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary .pm { position: relative; width: 36px; height: 36px; flex: none; }
.faq summary .pm::before, .faq summary .pm::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 2px; border-radius: 2px; background: var(--ink); translate: -50% -50%; transition: rotate .45s var(--ease-out); }
.faq summary .pm::after { rotate: 90deg; }
.faq details[open] .pm::after { rotate: 0deg; }
.faq .ans { overflow: hidden; }
.faq .ans p { padding: 12px 40px 6px 0; color: var(--text-2); font-size: 16px; line-height: 1.6; }
.faq .ans a { text-decoration: underline; text-underline-offset: .15em; }

/* ---------- Llamado final ---------- */
.cta { padding: clamp(96px, 10vw, 170px) 0 clamp(64px, 7vw, 110px); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 28px; }
.cta .h1 { max-width: 820px; }

/* ---------- Pie ---------- */
.foot { background: var(--ink); color: #fff; border-radius: var(--r-plate); padding: clamp(48px, 5vw, 64px) var(--gutter) 28px; overflow: hidden; }
.foot .top { display: grid; gap: 48px; }
@media (min-width: 900px) { .foot .top { grid-template-columns: 1fr 1fr; gap: 80px; } }
.foot .brand { display: inline-flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 600; letter-spacing: -.03em; }
.foot .brand svg { width: 30px; height: 30px; color: var(--brand-soft); }
.foot .about p { margin-top: 20px; max-width: 420px; font-size: clamp(22px, 2.4vw, 32px); font-weight: 500; line-height: 1.2; letter-spacing: -.025em; }
.foot .mailrow { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.foot .chip { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding: 6px 10px; border-radius: 20px; background: var(--ink-2); transition: border-radius .3s, background-color .3s; }
.foot .chip:hover { border-radius: 6px; background: var(--brand); }
.foot .chip svg { width: 12px; height: 12px; }
.foot .cols { display: grid; gap: 28px; }
@media (min-width: 640px) { .foot .cols { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } }
.foot .cols nav { border-left: 1px solid var(--ink-2); padding-left: 24px; display: grid; gap: 12px; align-content: start; }
.foot .cols h4 { font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; color: var(--mute); margin-bottom: 6px; }
.foot .cols a { font-size: 18px; transition: color .25s; }
.foot .cols a:hover { color: var(--brand-soft); }
.foot .wordmark { margin-top: clamp(56px, 7vw, 110px); font-size: clamp(64px, 17.4vw, 250px); font-weight: 600; letter-spacing: -.06em; line-height: .82; text-transform: uppercase; text-align: center; white-space: nowrap; color: #fff; user-select: none; }
.foot .wordmark span { display: inline-block; }
.foot .bar { margin-top: 28px; border-top: 1px solid var(--ink-2); padding-top: 20px; display: flex; flex-direction: column; gap: 12px; font-size: 14px; color: var(--mute); }
@media (min-width: 640px) { .foot .bar { flex-direction: row; justify-content: space-between; align-items: center; } }
.foot .bar nav { display: flex; gap: 0; }
.foot .bar nav a { padding: 0 12px; border-left: 1px solid var(--ink-2); color: #fff; }
.foot .bar nav a:first-child { padding-left: 0; border: 0; }
.foot .bar nav a:hover { color: var(--brand-soft); }

/* ---------- Capas: menú y contacto ---------- */
.overlay { position: fixed; inset: 0; pointer-events: none; visibility: hidden; }
.overlay.open { pointer-events: auto; visibility: visible; }
.overlay.closing { visibility: visible; }
.menu { z-index: 70; display: flex; flex-direction: column; color: #fff; }
.menu .bd { position: absolute; inset: 0; background: rgba(10,10,10,.6); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); opacity: 0; }
.menu .panel { position: relative; height: 100%; padding: 16px; opacity: 0; }
.menu .panel > .inner { height: 100%; display: flex; flex-direction: column; padding: 24px; background: var(--ink); border-radius: var(--r-plate); }
@media (min-width: 640px) { .menu .panel > .inner { padding: 28px 40px 40px; } }
.menu .top { display: flex; justify-content: space-between; align-items: center; }
.menu .brand { display: inline-flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 600; letter-spacing: -.03em; }
.menu .brand svg { width: 30px; height: 30px; color: var(--brand-soft); }
.close-btn { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; transition: background-color .25s; flex: none; }
.icon-x { width: 18px; height: 18px; }
.menu .close-btn { background: rgba(255,255,255,.1); }
.menu .close-btn:hover { background: rgba(255,255,255,.2); }
.menu .links { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.menu .links a { display: block; font-size: clamp(40px, 9vw, 80px); font-weight: 500; letter-spacing: -.04em; line-height: 1.05; transition: color .2s; }
.menu .links a:hover { color: var(--brand-soft); }
.menu .bottom { border-top: 1px solid var(--ink-2); padding-top: 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
@media (min-width: 640px) { .menu .bottom { flex-direction: row; justify-content: space-between; align-items: center; } }
.menu .bottom nav { display: flex; flex-wrap: wrap; gap: 18px; font-size: 14px; color: var(--mute); }
.menu .bottom nav a:hover { color: #fff; }

.form { margin-top: 28px; display: flex; flex-direction: column; gap: 16px; }
.field label, .field .lab { display: block; font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; color: var(--text-2); margin-bottom: 8px; }
.field input, .field textarea, .field select { width: 100%; border-radius: 12px; border: 1px solid var(--border); background: #fff; padding: 12px 14px; font-size: 15px; outline: none; transition: border-color .2s, box-shadow .2s; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(37,99,201,.15); }
.field textarea { resize: vertical; }
.field .err { display: none; font-size: 13px; color: #b42318; margin-top: 6px; }
.field.bad input, .field.bad textarea, .field.bad select { border-color: #e5484d; }
.field.bad .err { display: block; }
.field select { appearance: none; -webkit-appearance: none; padding-right: 40px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d5d5d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 14px center/16px no-repeat; }
.row2 { display: grid; gap: 16px; }
@media (min-width: 640px) { .row2 { grid-template-columns: 1fr 1fr; } }
.submit[disabled] { opacity: .5; cursor: default; }
.fine { font-size: 12px; color: var(--text-2); line-height: 1.5; }
.fine a { text-decoration: underline; text-underline-offset: .15em; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--text-2); }
.check input { margin-top: 3px; accent-color: var(--brand); flex: none; }
.check a { color: var(--ink); text-decoration: underline; text-underline-offset: .15em; }
.ok { margin-top: 32px; border-radius: var(--r-card); background: var(--light); padding: 24px; text-align: center; }
.ok .ic { width: 48px; height: 48px; border-radius: 50%; background: var(--brand); display: grid; place-items: center; margin: 0 auto; }
.ok .ic svg { width: 24px; height: 24px; }
.ok h3 { font-size: 20px; font-weight: 500; margin-top: 16px; letter-spacing: -.02em; }
.ok p { font-size: 15px; color: var(--text-2); margin-top: 8px; }
.ok .submit { margin-top: 20px; }

/* ---------- Cargador ---------- */
.loader { display: none !important; }
.js .loader { display: flex !important; }
.js:not(.listo) .loader { animation: cargador-fuera .5s ease 3.5s forwards; }
.loader { position: fixed; inset: 0; z-index: 200; background: var(--ink); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; }
.loader .brand { display: inline-flex; align-items: center; gap: 10px; font-size: 26px; font-weight: 600; letter-spacing: -.03em; opacity: 0; transform: translateY(16px); }
.loader .brand svg { width: 32px; height: 32px; color: var(--brand-soft); }
.loader .track { width: 160px; height: 2px; border-radius: 2px; background: rgba(255,255,255,.15); overflow: hidden; }
.loader .fill { height: 100%; background: #fff; transform: scaleX(0); transform-origin: left; }

/* ---------- Páginas interiores ---------- */
.page-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--ink); color: #fff; border-radius: var(--r-plate); min-height: 560px; display: flex; flex-direction: column; padding: 160px var(--gutter) 48px; }
.page-hero.short { min-height: 440px; }
.page-hero .bgc { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; }
.page-hero .veil { position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 90% at 70% 30%, rgba(10,10,10,0) 0%, rgba(10,10,10,.55) 60%, rgba(10,10,10,.9) 100%); }
.page-hero .ph { margin-top: auto; display: flex; flex-direction: column; gap: 24px; }
@media (min-width: 900px) { .page-hero .ph { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 48px; } }
.page-hero h1 { font-size: clamp(44px, 7vw, 96px); font-weight: 500; line-height: .98; letter-spacing: -.035em; margin-top: 24px; }
.page-hero .ph p { max-width: 440px; font-size: 17px; color: rgba(255,255,255,.72); line-height: 1.5; }
.nf { min-height: calc(100svh - 32px); }
.nf .ph { margin: auto 0; }

.svc { padding: clamp(64px, 7vw, 110px) var(--gutter); scroll-margin-top: 16px; }
.svc + .svc { border-top: 1px dashed var(--border); }
.svc .g { display: grid; gap: 40px; }
@media (min-width: 1024px) { .svc .g { grid-template-columns: 1.1fr 1fr 260px; gap: 56px; } }
.svc .n { font-family: var(--mono); font-size: 14px; color: var(--brand); }
.svc h2 { font-size: clamp(36px, 4.4vw, 60px); font-weight: 500; line-height: 1; letter-spacing: -.035em; margin-top: 16px; }
.svc .tagrow { margin-top: 20px; display: flex; gap: 8px; flex-wrap: wrap; }
.svc .desc { font-size: 18px; line-height: 1.55; color: var(--ink); }
.svc .for { margin-top: 20px; font-size: 15px; color: var(--text-2); }
.svc h3 { font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; color: var(--text-2); margin-top: 32px; }
.svc ul.chk { margin-top: 14px; display: grid; gap: 10px; font-size: 16px; }
.svc ul.chk li { display: flex; gap: 10px; }
.svc ul.chk li::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 3px; border-radius: 50%; background: var(--light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563c9' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/62% no-repeat; }
.svc .art { aspect-ratio: 4/3; border-radius: var(--r-plate); overflow: hidden; align-self: start; border: 1px solid rgba(10,10,10,.09); box-shadow: 0 12px 32px rgba(10,10,10,.06); background: #f5f5f7; }
.svc .art img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 1023px) { .svc .art { max-width: 240px; } }

.legal { padding: clamp(56px, 6vw, 96px) var(--gutter); max-width: 1360px; margin: 0 auto; }
.legal .g { display: grid; gap: 48px; }
@media (min-width: 1024px) { .legal .g { grid-template-columns: 260px minmax(0, 760px); gap: 96px; } }
.toc { align-self: start; position: sticky; top: 32px; font-size: 14px; }
.toc h2 { font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; color: var(--text-2); }
.toc ol { margin-top: 16px; display: grid; gap: 8px; counter-reset: t; }
.toc li { counter-increment: t; display: flex; gap: 10px; }
.toc li::before { content: counter(t, decimal-leading-zero); font-family: var(--mono); color: var(--mute); }
.toc a { color: var(--ink); }
.toc a:hover { color: var(--brand); }
@media (max-width: 1023px) { .toc { position: static; background: var(--light); border-radius: var(--r-card); padding: 20px 24px; } }
.prose { font-size: 17px; line-height: 1.7; color: #2b2b2b; }
.prose .meta { font-size: 14px; color: var(--text-2); padding-bottom: 24px; border-bottom: 1px dashed var(--border); margin-bottom: 16px; }
.prose h2 { font-size: clamp(26px, 2.6vw, 34px); font-weight: 500; letter-spacing: -.025em; line-height: 1.15; color: var(--ink); margin-top: 48px; scroll-margin-top: 32px; }
.prose h3 { font-size: 20px; font-weight: 500; color: var(--ink); margin-top: 28px; letter-spacing: -.01em; }
.prose p, .prose ul, .prose ol, .prose table { margin-top: 16px; }
.prose ul { list-style: disc; padding-left: 20px; }
.prose ol { list-style: decimal; padding-left: 20px; }
.prose li + li { margin-top: 6px; }
.prose a { color: var(--brand); text-decoration: underline; text-underline-offset: .15em; }
.prose strong { font-weight: 500; color: var(--ink); }
.prose table { width: 100%; border-collapse: collapse; font-size: 14px; }
.prose th, .prose td { text-align: left; padding: 12px; border-bottom: 1px solid var(--border); vertical-align: top; }
.prose th { font-weight: 500; color: var(--ink); background: var(--light); }
.table-wrap { overflow-x: auto; }
.callout { margin-top: 24px; border-radius: var(--r-card); background: var(--light); padding: 20px 24px; font-size: 15px; }
.pend { background: #fff4d6; color: #7a5200; border-radius: 4px; padding: 0 4px; font-weight: 500; }

.libro-form { margin-top: 32px; display: grid; gap: 24px; }
.libro-form fieldset { border: 1px solid var(--border); border-radius: var(--r-card); padding: 24px; display: grid; gap: 16px; }
.libro-form legend { padding: 0 8px; font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: var(--ink); }

/* ---------- Móvil ---------- */
@media (max-width: 640px) {
  main.pagina { padding: 8px; }
  .hero { min-height: calc(100svh - 16px); padding-top: 120px; }
  .site-header { padding-top: 18px; }
  .counter .digits { height: 56px; font-size: 56px; }
  .counter .col b { height: 56px; line-height: 56px; }
  .counter .sym { line-height: 56px; }
  .foot .wordmark { letter-spacing: -.05em; }
  .faq details { padding: 16px 20px; }
  .rule { min-height: 0; }
}

/* Portada más corta en celular (2026-10-12): números en 2×2 y escenas de servicios al costado del texto */
@media (max-width: 639px) {
  .nums { padding-top: 64px; }
  .nums .grid { grid-template-columns: 1fr 1fr; gap: 28px 18px; margin-top: 32px; }
  .nums .counter { gap: 12px; }
  .nums .counter .ds { display: none; }
  .svc-item .row { padding: 22px 0; }
  .svc-item .info { display: grid; grid-template-columns: 112px 1fr; gap: 4px 16px; align-items: start; padding-bottom: 26px; }
  .svc-item .info .sc { grid-row: 1 / span 3; max-width: none; margin: 4px 0 0; border-radius: 14px; }
  .svc-item .info p { margin-top: 6px; font-size: 15px; }
  .svc-item .info .st { margin-top: 8px; justify-self: start; }
}

/* ---------- Contenido: blog, casos, hallazgos y noticias (contenido.py + src/plantillas) ---------- */
.contenido-lista { padding: clamp(48px, 6vw, 88px) var(--gutter) clamp(64px, 7vw, 110px); }
.contenido-lista.mas { padding-top: 0; }
.contenido-lista.mas .h3 { margin-bottom: 28px; }
.tarjetas { display: grid; gap: 16px; }
@media (min-width: 700px) { .tarjetas { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .tarjetas { grid-template-columns: repeat(3, 1fr); } }
.tarjeta a { display: flex; flex-direction: column; gap: 12px; height: 100%; background: #fff; border-radius: var(--r-plate); padding: 24px; border: 1px solid rgba(10,10,10,.06); transition: border-radius .35s var(--ease-soft), box-shadow .35s, transform .35s var(--ease-out); }
.tarjeta a:hover { border-radius: var(--r-card); box-shadow: 0 18px 40px -18px rgba(10,10,10,.18); transform: translateY(-3px); }
.tarjeta .img { margin: -12px -12px 4px; aspect-ratio: 4/3; border-radius: 14px; overflow: hidden; background: var(--light); }
.tarjeta .img img { width: 100%; height: 100%; object-fit: cover; }
.tarjeta .meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .02em; color: var(--text-2); }
.tarjeta h2 { font-size: clamp(20px, 1.7vw, 24px); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; text-wrap: balance; }
.tarjeta .res { font-size: 15px; line-height: 1.55; color: var(--text-2); }
.tarjeta .dato { margin-top: auto; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 14px; border-top: 1px dashed var(--border); font-size: 13px; color: var(--text-2); }
.tarjeta .dato b { font-size: 24px; font-weight: 500; letter-spacing: -.02em; color: var(--ink); }
.etq { display: flex; flex-wrap: wrap; gap: 6px; }
.etq li { font-family: var(--mono); font-size: 11px; text-transform: uppercase; padding: 5px 9px 4px; border-radius: 20px; background: var(--light); color: var(--ink); }
.tarjeta .etq { margin-top: auto; padding-top: 6px; }
.borr { background: #fff3cd; color: #7a5300; padding: 2px 7px 1px; border-radius: 10px; }
.paginas { margin-top: 36px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.paginas > :last-child { justify-self: end; }
.paginas .n { font-family: var(--mono); font-size: 12px; text-transform: uppercase; color: var(--text-2); }
.contenido-lista .rss { margin-top: 28px; font-size: 14px; } .contenido-lista .rss a { color: var(--brand); text-decoration: underline; text-underline-offset: .15em; }
.art-hero h1 { font-size: clamp(36px, 5.2vw, 72px); max-width: 980px; text-wrap: balance; }
.art-hero .volver { color: var(--ink); }
.articulo { padding: clamp(48px, 6vw, 88px) var(--gutter); max-width: 1240px; margin: 0 auto; }
.articulo .g { display: grid; gap: 40px; }
@media (min-width: 1000px) { .articulo .g { grid-template-columns: 240px minmax(0, 720px); gap: 72px; justify-content: center; } .articulo .ficha { position: sticky; top: 32px; align-self: start; } }
.ficha dl { display: grid; gap: 14px; }
.ficha dt { font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--text-2); }
.ficha dd { font-size: 15px; margin-top: 3px; } .ficha dd ul { display: grid; gap: 4px; } .ficha dd a { color: var(--brand); text-decoration: underline; text-underline-offset: .15em; }
.ficha .etq { margin-top: 18px; }
.ficha .toc { position: static; margin-top: 28px; padding-top: 22px; border-top: 1px dashed var(--border); }
@media (max-width: 999px) { .ficha dl { grid-template-columns: repeat(2, 1fr); } .ficha .toc { display: none; } }
.prose .aviso-borrador { background: #fff3cd; color: #7a5300; border-radius: 12px; padding: 12px 16px; font-size: 14px; margin: 0 0 24px; }
.prose .portada { margin: 0 0 28px; border-radius: var(--r-plate); overflow: hidden; background: var(--light); }
.prose h2:first-child, .prose .portada + h2, .prose .resultados + h2 { margin-top: 8px; }
.prose h4 { font-size: 17px; font-weight: 500; color: var(--ink); margin-top: 24px; }
.prose blockquote { margin-top: 20px; padding: 4px 0 4px 20px; border-left: 3px solid var(--brand); color: var(--ink); font-size: 19px; line-height: 1.5; }
.prose code { font-family: var(--mono); font-size: .88em; background: var(--light); padding: 2px 6px; border-radius: 6px; }
.prose pre { margin-top: 18px; background: var(--ink); color: #fff; border-radius: 14px; padding: 16px 18px; overflow-x: auto; font-size: 14px; line-height: 1.55; }
.prose pre code { background: none; padding: 0; color: inherit; }
.prose img { border-radius: 14px; margin-top: 18px; width: 100%; height: auto; }
.prose figure { margin-top: 20px; } .prose figcaption { font-size: 13px; color: var(--text-2); margin-top: 8px; }
.prose hr { border: 0; border-top: 1px dashed var(--border); margin: 36px 0; }
.prose .tabla { margin-top: 18px; overflow-x: auto; } .prose .tabla table { margin-top: 0; min-width: 480px; }
.prose .resultados { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin: 0 0 32px; }
.prose .resultados div { background: #fff; border: 1px solid rgba(10,10,10,.06); border-radius: 16px; padding: 16px 18px; display: grid; gap: 6px; }
.prose .resultados dt { font-family: var(--mono); font-size: 11px; text-transform: uppercase; color: var(--text-2); }
.prose .resultados dd { display: flex; align-items: baseline; gap: 10px; }
.prose .resultados .antes { color: var(--mute); text-decoration: line-through; font-size: 15px; }
.prose .resultados b { font-size: 28px; font-weight: 500; letter-spacing: -.02em; color: var(--ink); }
.prose .cierre { margin-top: 48px; padding: 24px; border-radius: var(--r-plate); background: var(--ink); color: #fff; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.prose .cierre p { margin: 0; font-size: 20px; letter-spacing: -.015em; color: #fff; }

/* ---------- Agenda: formulario + calendario en la ventana de contacto (2026-10-12) ---------- */
.agenda-g { display: grid; gap: 22px; }
@media (min-width: 900px) { .agenda-g { grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; } }
.agenda .ag-datos { display: flex; flex-direction: column; gap: 16px; }
.lab { display: block; font-family: var(--mono); font-size: 12px; font-weight: 500; text-transform: uppercase; color: var(--text-2); margin-bottom: 8px; }
.modos { border: 0; padding: 0; margin: 0; min-width: 0; }
.seg-opc { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
@media (min-width: 560px) { .seg-opc { grid-template-columns: repeat(4, auto); } }
.seg-opc label { position: relative; cursor: pointer; display: block; margin: 0; font-family: var(--font); font-size: 14px; font-weight: 400; text-transform: none; color: var(--ink); }
.seg-opc input { position: absolute; opacity: 0; pointer-events: none; }
.seg-opc span { display: block; text-align: center; font-size: 14px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); background: #fff; transition: background .25s, color .25s, border-color .25s; white-space: nowrap; }
.seg-opc label:hover span { border-color: #cfcfcf; }
.seg-opc input:checked + span { background: var(--ink); color: #fff; border-color: var(--ink); }
.seg-opc input:focus-visible + span { outline: 2px solid var(--brand-soft); outline-offset: 2px; }
.cal { background: var(--light); border-radius: 20px; padding: 18px 16px 16px; }
.cal .lab { display: flex; justify-content: space-between; gap: 8px; }
.cal .lab span { color: var(--mute); }
.cal-h { display: flex; align-items: center; justify-content: space-between; margin: 4px 0 10px; }
.cal-h b { font-size: 17px; font-weight: 500; letter-spacing: -.01em; }
.cal-h b::first-letter { text-transform: uppercase; }
.cal-h .nav { display: flex; gap: 6px; }
.cal-h .nav button { width: 34px; height: 34px; border-radius: 50%; background: #fff; display: inline-flex; align-items: center; justify-content: center; transition: background .2s; }
.cal-h .nav button:hover:not(:disabled) { background: var(--border); }
.cal-h .nav button:disabled { opacity: .35; cursor: default; }
.cal-h .nav svg { width: 16px; height: 16px; }
.sem, .dias { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.sem span { text-align: center; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; color: var(--mute); padding: 4px 0; }
.dias button, .dias .vacio { aspect-ratio: 1; border-radius: 10px; font-size: 14px; display: flex; align-items: center; justify-content: center; position: relative; }
.dias button { background: #fff; color: var(--ink); font-variant-numeric: tabular-nums; transition: background .2s, color .2s, transform .2s; }
.dias button:hover:not(:disabled) { background: #e6eefb; }
.dias button.hoy::after { content: ""; position: absolute; bottom: 5px; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.dias button.sel { background: var(--brand); color: #fff; }
.dias button:disabled { background: transparent; color: #bdbdbd; cursor: default; }
.dias button.ocupado { color: #b8443a; background: repeating-linear-gradient(135deg, rgba(235,104,52,.10) 0 4px, transparent 4px 8px); text-decoration: line-through; }
.ley { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--text-2); }
.ley span { display: inline-flex; align-items: center; gap: 6px; }
.ley i { width: 12px; height: 12px; border-radius: 4px; background: #fff; box-shadow: inset 0 0 0 1px var(--border); }
.ley i.o { background: repeating-linear-gradient(135deg, rgba(235,104,52,.35) 0 3px, transparent 3px 6px); box-shadow: none; }
.horas { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--border); }
.horas .lab { text-transform: none; font-family: var(--font); font-size: 14px; color: var(--ink); letter-spacing: 0; }
.slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; max-height: 172px; overflow-y: auto; overscroll-behavior: contain; padding-right: 2px; }
.slots button { padding: 9px 0; border-radius: 10px; background: #fff; font-size: 14px; font-variant-numeric: tabular-nums; border: 1px solid transparent; transition: background .2s, color .2s, border-color .2s; }
.slots button:hover { border-color: var(--brand); }
.slots button.sel { background: var(--brand); color: #fff; }
.cal .err { display: none; font-size: 13px; color: #b42318; margin-top: 10px; }
.cal.bad .err { display: block; } .cal.bad { box-shadow: inset 0 0 0 1px #e5484d; }
.cal .sin-fecha { font-size: 14px; color: var(--text-2); margin-top: 12px; }
.cal.apagado .cal-h, .cal.apagado .sem, .cal.apagado .dias, .cal.apagado .ley, .cal.apagado .horas { opacity: .35; pointer-events: none; }
.resumen-cita { font-size: 14px; background: #e6eefb; color: var(--brand-deep); border-radius: 12px; padding: 10px 14px; }
@media (prefers-reduced-motion: reduce) { .dias button, .slots button { transition: none; } }

/* Agenda dentro de la portada (#contacto), ya no en ventana emergente */
.agenda-sec { display: block; text-align: left; }
.agenda-sec .cta-head { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.agenda-sec .cta-head .lead { max-width: 520px; }
.agenda-card { max-width: 1120px; margin: clamp(36px, 4vw, 56px) auto 0; background: #fff; border-radius: var(--r-plate); padding: clamp(20px, 3vw, 40px); box-shadow: 0 30px 70px -40px rgba(10,10,10,.25); border: 1px solid rgba(10,10,10,.05); scroll-margin-top: 24px; }
.agenda-card .form { margin-top: 0; }
@media (min-width: 900px) { .agenda-card .agenda-g { grid-template-columns: minmax(0, 1fr) 360px; gap: 40px; } .agenda-card .submit { align-self: flex-start; padding-left: 40px; padding-right: 40px; } }
.agenda-card .ok { margin-top: 0; }

/* Agenda más ancha (12/10): la tarjeta usa todo el ancho y el calendario casi la mitad */
.agenda-card { max-width: none; padding: clamp(20px, 3.2vw, 56px); }
@media (min-width: 900px) {
  .agenda-card .agenda-g { grid-template-columns: minmax(0, 1.15fr) minmax(380px, 1fr); gap: clamp(32px, 4vw, 64px); }
  .agenda-card .ag-datos { gap: 20px; }
  .agenda-card .field input, .agenda-card .field select { padding: 15px 16px; font-size: 16px; }
  .agenda-card .field textarea { padding: 15px 16px; font-size: 16px; min-height: 120px; }
  .agenda-card .seg-opc span { padding: 13px 12px; font-size: 15px; }
  .agenda-card .cal { padding: 24px 24px 22px; border-radius: 24px; }
  .agenda-card .cal-h b { font-size: 20px; }
  .agenda-card .sem, .agenda-card .dias { gap: 6px; }
  .agenda-card .dias button, .agenda-card .dias .vacio { aspect-ratio: auto; height: clamp(46px, 3.6vw, 60px); font-size: 16px; border-radius: 12px; }
  .agenda-card .slots { grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); max-height: 236px; gap: 8px; }
  .agenda-card .slots button { padding: 12px 0; font-size: 15px; }
}

/* Logo oficial (12/10): la palabra DATLAST del pie, en Geist semibold, mayúsculas y letras juntas */
.logo { display: inline-block; font-weight: 600; text-transform: uppercase; letter-spacing: -.06em; line-height: .82; font-size: 28px; padding-top: .08em; }
.site-header .brand .logo, .menu .brand .logo, .foot .brand .logo { font-size: 28px; }
.loader .brand .logo { font-size: clamp(44px, 6vw, 72px); }
@media (max-width: 560px) { .site-header .brand .logo, .menu .brand .logo { font-size: 24px; } }