/* Agencia Común — estilos (2026-10-27) */
:root{
  --bg:#FAFAF7; --surface:#FFFFFF; --ink:#111216; --ink-soft:rgba(17,18,22,.66); --line:rgba(17,18,22,.10);
  --acc:#FF4D2E; --lima:#D7FF3A; --azul:#2F5BFF; --oscuro:#111216; --crema:#F1F0EA;
  --sombra:0 1px 2px rgba(17,18,22,.05), 0 10px 30px -14px rgba(17,18,22,.22);
  --sombra-alta:0 2px 4px rgba(17,18,22,.06), 0 30px 70px -24px rgba(17,18,22,.40);
  --dfont:"Bricolage Grotesque", Inter, system-ui, sans-serif;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --bg:#0E0F12; --surface:#17191E; --ink:#F3F3F0; --ink-soft:rgba(243,243,240,.66); --line:rgba(243,243,240,.12); --crema:#1C1E24; } }
:root[data-theme="dark"]{ --bg:#0E0F12; --surface:#17191E; --ink:#F3F3F0; --ink-soft:rgba(243,243,240,.66); --line:rgba(243,243,240,.12); --crema:#1C1E24; }
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 Inter, system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:1200px; margin:0 auto; padding:0 clamp(16px, 4vw, 40px); }
h1, h2, h3{ font-family:var(--dfont); font-weight:800; letter-spacing:-.03em; margin:0; line-height:1.02; }
h2{ font-size:clamp(32px, 4.6vw, 58px); }
.k{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--acc); }
.lead{ font-size:clamp(17px, 1.8vw, 20px); color:var(--ink-soft); max-width:60ch; margin:16px 0 0; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:52px; padding:0 26px; border-radius:999px; font-weight:700; font-size:16px; border:1.5px solid var(--ink); background:transparent; color:inherit; transition:transform .2s cubic-bezier(.22,1,.36,1); white-space:nowrap; cursor:pointer; font-family:inherit; }
.btn:hover{ transform:translateY(-2px); }
.btn-acc{ background:var(--acc); border-color:var(--acc); color:#fff; box-shadow:0 10px 24px -10px var(--acc); }
.btn-osc{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
a:focus-visible, button:focus-visible, input:focus-visible{ outline:3px solid var(--azul); outline-offset:3px; }
section{ padding:clamp(64px, 9vw, 120px) 0; }
.saltar{ position:absolute; left:-9999px; top:8px; background:var(--ink); color:var(--bg); padding:10px 14px; border-radius:8px; z-index:100; }
.saltar:focus{ left:8px; }

/* barra */
.top{ position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--bg) 86%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.top .wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; height:68px; }
.logo{ display:inline-flex; align-items:center; gap:10px; font-family:var(--dfont); font-weight:800; font-size:21px; letter-spacing:-.02em; }
.logo i{ width:32px; height:32px; border-radius:10px; background:var(--ink); color:var(--bg); display:grid; place-items:center; font-style:normal; font:800 16px/1 var(--dfont); position:relative; }
.logo i::after{ content:""; position:absolute; right:-3px; bottom:-3px; width:11px; height:11px; border-radius:50%; background:var(--acc); border:2px solid var(--bg); }
.top nav{ display:flex; align-items:center; gap:22px; font-weight:600; font-size:15px; }
.top nav a:not(.btn){ color:var(--ink-soft); display:inline-flex; align-items:center; gap:7px; }
.top nav a:not(.btn) u{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.top nav a:not(.btn):hover, .top nav a[aria-current="page"]{ color:var(--ink); }
.top .btn{ min-height:42px; padding:0 18px; font-size:14.5px; }
@media (max-width:1000px){ .top nav a.nav-l{ display:none; } }

/* portada */
.hero{ padding:clamp(48px, 7vw, 100px) 0 clamp(48px, 6vw, 80px); overflow:hidden; }
.hero .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px, 5vw, 72px); align-items:center; }
.hero h1{ font-size:clamp(46px, 7.4vw, 104px); }
.hero h1 .c1{ color:var(--acc); }
.hero h1 .c2{ background:var(--lima); color:#111; padding:0 .12em; border-radius:.12em; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.hero h1 .c3{ color:var(--azul); }
.hero .btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.hero .micro{ display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:20px; font-size:14px; color:var(--ink-soft); }
.hero .micro span::before{ content:"✓"; color:var(--acc); font-weight:800; margin-right:7px; }
.escalera{ position:relative; display:grid; gap:14px; }
.escalon{ position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:20px; align-items:center; padding:30px 28px; border-radius:22px; background:var(--pc); color:var(--po); box-shadow:var(--sombra-alta); transition:transform .3s cubic-bezier(.22,1,.36,1); }
.escalon:nth-child(1){ margin-right:18%; }
.escalon:nth-child(2){ margin-left:9%; margin-right:9%; }
.escalon:nth-child(3){ margin-left:18%; }
.escalon:hover{ transform:translateY(-4px) rotate(-.5deg); }
.escalon .n{ font:800 56px/1 var(--dfont); letter-spacing:-.04em; opacity:.9; }
.escalon b{ display:block; font:800 36px/1 var(--dfont); letter-spacing:-.03em; }
.escalon span{ display:block; font-size:15.5px; opacity:.85; margin-top:4px; }
.escalon svg{ width:34px; height:34px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:900px){ .hero .wrap{ grid-template-columns:1fr; } .escalon:nth-child(n){ margin:0; } }

/* cinta de rubros */
.cinta{ background:var(--oscuro); color:#F3F3F0; overflow:hidden; padding:18px 0; }
.cinta div{ display:flex; gap:40px; width:max-content; animation:corre 40s linear infinite; font:700 clamp(18px, 2.2vw, 26px)/1 var(--dfont); letter-spacing:-.01em; }
.cinta span::after{ content:"✦"; color:var(--lima); margin-left:40px; }
@keyframes corre{ to{ transform:translateX(-50%); } }

/* pilares */
.pilares .cab{ max-width:760px; }
.p3{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:44px; }
.pil{ display:flex; flex-direction:column; gap:14px; padding:30px 28px; border-radius:24px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sombra); position:relative; overflow:hidden; transition:transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s; }
.pil:hover{ transform:translateY(-4px); box-shadow:var(--sombra-alta); }
.pil::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; background:var(--pc); }
.pil .ico{ width:56px; height:56px; border-radius:16px; background:var(--pc); color:var(--po); display:grid; place-items:center; }
.pil .ico svg{ width:28px; height:28px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.pil h3{ font-size:34px; }
.pil h3 small{ display:block; font:600 13px/1.2 Inter, sans-serif; color:var(--ink-soft); letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px; }
.pil .lem{ font:700 19px/1.25 var(--dfont); letter-spacing:-.01em; }
.pil ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:15px; color:var(--ink-soft); }
.pil li{ display:flex; justify-content:space-between; gap:10px; border-top:1px solid var(--line); padding-top:8px; }
.pil li b{ color:var(--ink); white-space:nowrap; font-weight:700; }
.pil .ver{ margin-top:auto; padding-top:10px; font-weight:800; display:flex; justify-content:space-between; }
@media (max-width:980px){ .p3{ grid-template-columns:1fr; } }

/* casos */
.casos{ background:var(--crema); }
.casos .cab{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:20px; }
.c4{ display:grid; grid-template-columns:repeat(2, 1fr); gap:20px; margin-top:40px; }
.caso{ display:flex; flex-direction:column; border-radius:22px; overflow:hidden; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sombra); transition:transform .25s, box-shadow .25s; }
.caso:hover{ transform:translateY(-4px); box-shadow:var(--sombra-alta); }
.caso .nav{ height:34px; display:flex; align-items:center; gap:7px; padding:0 14px; background:color-mix(in srgb, var(--ink) 6%, var(--surface)); border-bottom:1px solid var(--line); font-size:12px; color:var(--ink-soft); }
.caso .nav i{ width:10px; height:10px; border-radius:50%; background:color-mix(in srgb, var(--ink) 18%, transparent); }
.caso .nav span{ margin-left:10px; }
.caso .img{ aspect-ratio:16/9; background:#222 center/cover; position:relative; }
.caso .img::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 50%, rgba(0,0,0,.55)); }
.caso .img strong{ position:absolute; z-index:1; left:20px; bottom:16px; right:20px; color:#fff; font:800 clamp(24px, 3vw, 34px)/1 var(--dfont); letter-spacing:-.02em; }
.caso .txt{ padding:20px 22px 22px; display:flex; flex-direction:column; gap:10px; flex:1; }
.caso .txt small{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); }
.caso .txt p{ margin:0; color:var(--ink-soft); }
.caso .tags{ display:flex; gap:6px; flex-wrap:wrap; margin-top:auto; padding-top:6px; }
.caso .tags span{ font-size:12px; font-weight:700; padding:5px 10px; border-radius:999px; background:var(--pc); color:var(--po); }
.caso .ir{ font-weight:800; }
@media (max-width:800px){ .c4{ grid-template-columns:1fr; } }

/* método */
.metodo{ background:var(--oscuro); color:#F3F3F0; }
.metodo .k{ color:var(--lima); }
.metodo .lead{ color:rgba(243,243,240,.7); }
.metodo ol{ list-style:none; margin:48px 0 0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; counter-reset:p; }
.metodo li{ counter-increment:p; border-top:2px solid rgba(243,243,240,.2); padding-top:24px; }
.metodo li::before{ content:counter(p, decimal-leading-zero); display:block; font:800 56px/1 var(--dfont); color:var(--lima); letter-spacing:-.04em; margin-bottom:14px; }
.metodo li b{ display:block; font:800 22px/1.15 var(--dfont); margin-bottom:8px; }
.metodo li span{ color:rgba(243,243,240,.72); font-size:15px; }
@media (max-width:900px){ .metodo ol{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .metodo ol{ grid-template-columns:1fr; } }

/* test */
.test .caja{ display:grid; grid-template-columns:1fr 1.25fr; gap:clamp(28px, 5vw, 64px); align-items:start; }
.quiz{ background:var(--surface); border:1px solid var(--line); border-radius:24px; padding:clamp(22px, 3vw, 36px); box-shadow:var(--sombra-alta); }
.quiz .prog{ height:6px; border-radius:3px; background:color-mix(in srgb, var(--ink) 8%, transparent); overflow:hidden; margin-bottom:22px; }
.quiz .prog u{ display:block; height:100%; width:0; background:var(--acc); transition:width .4s; }
.quiz .q{ display:none; }
.quiz .q.on{ display:block; animation:entra .35s ease; }
@keyframes entra{ from{ opacity:0; transform:translateX(16px); } }
.quiz .q small{ color:var(--ink-soft); font-weight:600; font-size:13px; }
.quiz .q h3{ font-size:clamp(22px, 2.6vw, 30px); margin:8px 0 18px; letter-spacing:-.02em; }
.quiz .q button{ display:block; width:100%; text-align:left; font:600 16px/1.35 Inter, sans-serif; padding:16px 18px; margin-top:10px; border-radius:14px; border:1.5px solid var(--line); background:var(--bg); color:var(--ink); cursor:pointer; transition:border-color .15s, transform .15s; }
.quiz .q button:hover{ border-color:var(--ink); transform:translateX(4px); }
.quiz .res{ display:none; }
.quiz .res.on{ display:block; animation:entra .35s ease; }
.quiz .res .badge{ display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; font:800 14px/1 Inter, sans-serif; background:var(--pc); color:var(--po); }
.quiz .res h3{ font-size:clamp(28px, 3.4vw, 42px); margin:16px 0 10px; }
.quiz .res p{ color:var(--ink-soft); margin:0 0 20px; }
.quiz .res .btns{ display:flex; flex-wrap:wrap; gap:10px; }
.quiz .otra{ background:none; border:0; color:var(--ink-soft); text-decoration:underline; cursor:pointer; font:inherit; font-size:14px; margin-top:14px; padding:0; }
@media (max-width:860px){ .test .caja{ grid-template-columns:1fr; } }

/* programas */
.programas .cab{ text-align:center; max-width:760px; margin:0 auto; }
.programas .cab .lead{ margin-left:auto; margin-right:auto; }
.pr3{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:44px; align-items:stretch; }
.prg{ position:relative; display:flex; flex-direction:column; gap:14px; padding:32px 28px; border-radius:24px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sombra); }
.prg .chip{ align-self:flex-start; font:800 12.5px/1 Inter, sans-serif; padding:8px 12px; border-radius:999px; background:var(--pc); color:var(--po); }
.prg h3{ font-size:28px; }
.prg p{ margin:0; color:var(--ink-soft); font-size:15px; }
.prg .precio b{ display:block; font:800 44px/1 var(--dfont); letter-spacing:-.04em; }
.prg .precio span{ font-size:14px; color:var(--ink-soft); }
.prg .ahorro{ font-size:13.5px; font-weight:700; color:var(--acc); }
.prg ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; }
.prg li{ display:flex; gap:10px; }
.prg li::before{ content:"✓"; font-weight:800; color:var(--acc); }
.prg .btn{ margin-top:auto; width:100%; }
.prg.dest{ background:var(--oscuro); color:#F3F3F0; border-color:var(--oscuro); transform:translateY(-10px); box-shadow:var(--sombra-alta); }
.prg.dest p, .prg.dest .precio span{ color:rgba(243,243,240,.72); }
.prg.dest .btn{ border-color:#F3F3F0; }
@media (max-width:980px){ .pr3{ grid-template-columns:1fr; max-width:520px; margin-left:auto; margin-right:auto; } .prg.dest{ transform:none; } }

/* plus Espacio Común */
.app-plus{ display:flex; gap:10px; align-items:center; padding:12px 14px; border-radius:14px; background:color-mix(in srgb, var(--pc) 16%, transparent); border:1px dashed var(--pc); font-size:14px; font-weight:600; line-height:1.3; }
.app-plus b{ flex:none; font:800 11px/1 Inter, sans-serif; letter-spacing:.08em; text-transform:uppercase; padding:6px 8px; border-radius:999px; background:var(--pc); color:var(--po); }
.prg.dest .app-plus{ color:#F3F3F0; }
.app{ background:var(--crema); }
.app .ec{ background:linear-gradient(90deg, #FF4D2E, #8B5CF6 50%, #2F5BFF); -webkit-background-clip:text; background-clip:text; color:transparent; }
.app-cab{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(24px, 4vw, 56px); align-items:end; }
.app-gratis{ display:grid; gap:8px; padding:22px 24px; border-radius:20px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sombra); font-size:15px; }
.app-gratis b{ font:800 18px/1.2 var(--dfont); }
.app-gratis span::before{ content:"✓ "; color:var(--acc); font-weight:800; }
.app-gratis a{ font-weight:800; color:var(--acc); margin-top:6px; }
.sis{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:36px; }
.sis div{ position:relative; padding:22px 22px 20px; border-radius:18px; background:var(--surface); border:1px solid var(--line); overflow:hidden; }
.sis i{ position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--sc); }
.sis b{ display:block; font:800 24px/1.1 var(--dfont); letter-spacing:-.02em; color:var(--sc); }
.sis small{ display:block; font-weight:700; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); margin:6px 0 10px; }
.sis span{ font-size:14.5px; color:var(--ink-soft); }
.niv{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:20px; }
.niv div{ padding:22px 24px; border-radius:18px; background:var(--pc); color:var(--po); display:grid; gap:10px; align-content:start; }
.niv .chip{ justify-self:start; font:800 12px/1 Inter, sans-serif; padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.22); }
.niv b{ font:800 22px/1.15 var(--dfont); letter-spacing:-.01em; }
.niv ul{ list-style:none; margin:0; padding:0; display:grid; gap:6px; font-size:14.5px; opacity:.92; }
.niv li::before{ content:"✓ "; font-weight:800; }
@media (max-width:900px){ .app-cab{ grid-template-columns:1fr; } .sis, .niv{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .sis, .niv{ grid-template-columns:1fr; } }

/* kit de marca en Crea, claude, reemplaza */
.ec{ background:linear-gradient(90deg, #FF4D2E, #8B5CF6 50%, #2F5BFF); -webkit-background-clip:text; background-clip:text; color:transparent; }
.prg .precio b small{ font-size:.42em; letter-spacing:-.01em; margin-left:4px; opacity:.75; }
.crea{ background:var(--oscuro); color:#F3F3F0; }
.crea .lead{ color:rgba(243,243,240,.74); }
.crea .k{ color:var(--lima); }
.crea-cab{ display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(24px, 4vw, 56px); align-items:end; }
.crea-pasos{ list-style:none; margin:0; padding:0; display:grid; gap:10px; counter-reset:c; }
.crea-pasos li{ padding:16px 18px; border-radius:16px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); font-size:15px; color:rgba(243,243,240,.8); }
.crea-pasos b{ display:block; font:800 19px/1.2 var(--dfont); color:#fff; margin-bottom:2px; }
.crea-g{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:36px; }
.crea-g div{ display:grid; gap:6px; align-content:start; padding:22px; border-radius:18px; background:linear-gradient(160deg, rgba(255,77,46,.16), rgba(139,92,246,.12) 55%, rgba(47,91,255,.14)); border:1px solid rgba(255,255,255,.12); }
.crea-g span{ font:800 14px/1 var(--dfont); color:var(--lima); }
.crea-g b{ font:800 24px/1.1 var(--dfont); letter-spacing:-.02em; }
.crea-g small{ font-size:14.5px; color:rgba(243,243,240,.72); }
.crea-nota{ margin:22px 0 0; padding:16px 20px; border-radius:14px; border:1px dashed rgba(215,255,58,.5); color:rgba(243,243,240,.82); font-size:15px; max-width:820px; }
.crea-nota b{ color:var(--lima); }
.claude{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(20px, 3vw, 40px); align-items:center; margin-top:20px; padding:clamp(22px, 3vw, 34px); border-radius:22px; background:#F4EDE4; color:#1F1A17; border:1px solid rgba(217,119,87,.35); }
.claude .k{ color:#C2552F; }
.claude h3{ font-size:clamp(24px, 2.6vw, 32px); margin:10px 0; }
.claude p{ margin:0; color:rgba(31,26,23,.72); }
.claude ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:15px; }
.claude li{ padding:10px 14px; border-radius:12px; background:#fff; border:1px solid rgba(31,26,23,.08); }
.claude li::before{ content:"✦ "; color:#D97757; font-weight:800; }
.reemp{ list-style:none; margin:20px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.reemp li{ font-size:14px; font-weight:600; padding:8px 12px; border-radius:999px; background:var(--surface); border:1px solid var(--line); }
.reemp li::before{ content:"✓ "; color:var(--acc); font-weight:800; }
@media (max-width:900px){ .crea-cab, .claude{ grid-template-columns:1fr; } .crea-g{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .crea-g{ grid-template-columns:1fr; } }

/* plataforma */
.plat .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px, 5vw, 72px); align-items:center; }
.plat .vis{ position:relative; aspect-ratio:4/3; border-radius:24px; overflow:hidden; background:var(--oscuro); box-shadow:var(--sombra-alta); }
.plat .vis img{ width:100%; height:100%; object-fit:cover; opacity:.85; }
.plat .vis .ch{ position:absolute; background:var(--surface); color:var(--ink); border-radius:14px; padding:12px 14px; box-shadow:var(--sombra-alta); font-size:13px; }
.plat .vis .ch b{ display:block; font:800 22px/1 var(--dfont); color:var(--acc); }
.plat .btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
@media (max-width:860px){ .plat .wrap{ grid-template-columns:1fr; } }

/* preguntas */
.faq .wrap{ display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(28px, 5vw, 80px); }
.faq details{ border-top:1px solid var(--line); padding:20px 0; }
.faq details:last-child{ border-bottom:1px solid var(--line); }
.faq summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:16px; font:700 19px/1.3 var(--dfont); letter-spacing:-.01em; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font:400 28px/1 Inter, sans-serif; color:var(--acc); transition:transform .2s; }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ margin:12px 0 0; color:var(--ink-soft); }
@media (max-width:860px){ .faq .wrap{ grid-template-columns:1fr; } }

/* cierre */
.cierre{ padding:0 0 clamp(64px, 8vw, 110px); }
.cierre .caja{ border-radius:28px; background:var(--pc, var(--acc)); color:var(--po, #fff); padding:clamp(40px, 6vw, 80px); display:grid; grid-template-columns:1.3fr 1fr; gap:32px; align-items:center; position:relative; overflow:hidden; }
.cierre .caja::after{ content:""; position:absolute; right:-80px; bottom:-120px; width:360px; height:360px; border-radius:50%; background:rgba(255,255,255,.14); }
.cierre h2{ font-size:clamp(34px, 5vw, 62px); }
.cierre p{ margin:14px 0 0; font-size:18px; opacity:.88; }
.cierre .btns{ display:flex; flex-direction:column; gap:12px; position:relative; z-index:1; }
.cierre .btn{ border-color:currentColor; }
.cierre .btn-blanco{ background:#fff; color:#111; border-color:#fff; }
@media (max-width:860px){ .cierre .caja{ grid-template-columns:1fr; } }

/* página de pilar */
.ph{ padding:clamp(48px, 7vw, 96px) 0 clamp(40px, 5vw, 64px); background:var(--pc); color:var(--po); position:relative; overflow:hidden; }
.ph .wrap{ display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(28px, 5vw, 64px); align-items:end; position:relative; z-index:1; }
.ph .n{ font:800 clamp(120px, 20vw, 260px)/.8 var(--dfont); letter-spacing:-.06em; position:absolute; right:-.05em; bottom:-.12em; opacity:.14; z-index:0; }
.ph .k{ color:inherit; opacity:.85; }
.ph h1{ font-size:clamp(46px, 7vw, 96px); margin-top:14px; }
.ph .lead{ color:inherit; opacity:.86; }
.ph .para{ background:rgba(255,255,255,.14); border-radius:20px; padding:22px 24px; }
.ph .para b{ display:block; font:800 18px/1.2 var(--dfont); margin-bottom:10px; }
.ph .para ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.ph .para li::before{ content:"→ "; font-weight:800; }
.ph .btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.ph .btn{ border-color:currentColor; }
.ph .btn-blanco{ background:var(--po); color:var(--pc); border-color:var(--po); }
@media (max-width:860px){ .ph .wrap{ grid-template-columns:1fr; } }
.serv{ display:grid; grid-template-columns:repeat(2, 1fr); gap:20px; margin-top:40px; }
.sv{ display:flex; flex-direction:column; gap:12px; padding:28px; border-radius:22px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--sombra); }
.sv h3{ font-size:26px; }
.sv p{ margin:0; color:var(--ink-soft); }
.sv .precio{ margin-top:auto; padding-top:14px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; }
.sv .precio b{ font:800 30px/1 var(--dfont); letter-spacing:-.03em; }
.sv .precio span{ color:var(--ink-soft); font-size:14px; }
.sv a{ font-weight:800; color:var(--acc); }
@media (max-width:760px){ .serv{ grid-template-columns:1fr; } }
.proc ol{ list-style:none; margin:40px 0 0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; counter-reset:p; }
.proc li{ counter-increment:p; padding:24px 22px; border-radius:20px; background:var(--surface); border:1px solid var(--line); }
.proc li::before{ content:counter(p); display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:var(--pc); color:var(--po); font:800 18px/1 var(--dfont); margin-bottom:16px; }
.proc li b{ display:block; font:800 20px/1.15 var(--dfont); margin-bottom:6px; }
.proc li span{ color:var(--ink-soft); font-size:15px; }
@media (max-width:900px){ .proc ol{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .proc ol{ grid-template-columns:1fr; } }
.otros{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:28px; }
.otros a{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:22px 24px; border-radius:20px; background:var(--pc); color:var(--po); font:800 22px/1.1 var(--dfont); }
.otros a small{ display:block; font:500 14px/1.3 Inter, sans-serif; opacity:.85; margin-top:4px; }
@media (max-width:700px){ .otros{ grid-template-columns:1fr; } }

/* pie */
.pie{ background:var(--oscuro); color:#F3F3F0; padding:clamp(48px, 6vw, 72px) 0 32px; }
.pie .logo i{ background:#F3F3F0; color:#111; }
.pie .logo i::after{ border-color:var(--oscuro); }
.pie-a{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; padding-bottom:32px; border-bottom:1px solid rgba(243,243,240,.14); }
.pie-a p{ color:rgba(243,243,240,.7); margin:14px 0 20px; max-width:36ch; }
.pie-a nav{ display:grid; gap:10px; align-content:start; font-size:15px; }
.pie-a nav b{ font:800 16px/1.2 var(--dfont); margin-bottom:4px; }
.pie-a nav a{ color:rgba(243,243,240,.75); }
.pie-a nav a:hover{ color:#fff; }
.pie-b{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; padding-top:22px; font-size:13px; color:rgba(243,243,240,.6); }
.proy{ display:flex; align-items:center; gap:8px; }
.proy-logo{ display:inline-flex; align-items:center; gap:7px; font:800 15px/1 var(--dfont); color:#F3F3F0; }
.proy-logo i{ width:22px; height:22px; border-radius:7px; background:#F3F3F0; color:#111; display:grid; place-items:center; font-style:normal; font:800 12px/1 var(--dfont); }
@media (max-width:860px){ .pie-a{ grid-template-columns:1fr; } }
.wa-flot{ position:fixed; right:18px; bottom:18px; z-index:50; width:58px; height:58px; border-radius:50%; background:#25D366; display:grid; place-items:center; box-shadow:0 12px 30px -10px rgba(0,0,0,.45); transition:transform .2s; }
.wa-flot:hover{ transform:scale(1.06); }
.wa-flot svg{ width:30px; height:30px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linejoin:round; }
.wa-flot svg path:last-child{ fill:#fff; stroke:none; }
.rv{ opacity:0; transform:translateY(20px); transition:opacity .7s, transform .7s cubic-bezier(.22,1,.36,1); }
.rv.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; } .rv{ opacity:1; transform:none; } }