/* ===========================================================================
   DRAKORP GROUP — la casa. Piel propia (no la comparte ningún otro sitio).
   Dirección: oscuro con profundidad. Casi-negro con un toque azul (no #000), cuatro
   superficies que suben de luz poco a poco, bordes de 1 px semitransparentes, las
   líneas de las empresas como LUZ (brillo suave), ruido levísimo para quitar lo plano.
   Letra: Archivo ancha (titulares grandes, interletraje apretado) + Inter Tight (lectura).
   El rojo de marca aparece poco y con intención: logo, una palabra del titular, la línea D.
   =========================================================================== */
@font-face{font-family:Archivo;src:url("/fuentes/Archivo-var.woff2") format("woff2-variations");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:Inter;src:url("/fuentes/InterTight-var.woff2") format("woff2-variations");font-weight:100 900;font-display:swap}
:root{
  --f0:oklch(0.155 0.012 265); --f1:oklch(0.19 0.014 265); --f2:oklch(0.23 0.016 265); --f3:oklch(0.285 0.018 265);
  --borde:oklch(1 0 0 / .09); --borde-2:oklch(1 0 0 / .16);
  --t:oklch(0.97 0.004 265); --t2:oklch(0.86 0.01 265); --t3:oklch(0.76 0.014 265);
  --rojo:#DC2626; --rojo-t:#F0524C;
  --l-d:#DC2626; --l-f:#4FA3F7; --l-m:#14B8A6; --l-p:#F2F2F2; --senal:#FFD000;
  --curva:cubic-bezier(.16,1,.3,1); --ancho-max:1240px;
}
html{background:var(--f0);color-scheme:dark}
body{background:var(--f0);color:var(--t);font:400 18px/1.58 Inter,system-ui,sans-serif;font-feature-settings:"ss01","cv11"}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3,.d{font-family:Archivo,system-ui,sans-serif;font-stretch:112%;letter-spacing:-.035em;margin:0;font-weight:760}
h1{font-size:clamp(40px,8.4vw,104px);line-height:.98}
h2{font-size:clamp(30px,5.2vw,64px);line-height:1.02}
h3{font-size:clamp(21px,2vw,26px);line-height:1.12;letter-spacing:-.02em;font-stretch:105%}
p{margin:0}
.rojo{color:var(--rojo)}
.sub{font-size:clamp(18px,1.6vw,21px);color:var(--t2);max-width:38ch;margin-top:16px}
a{text-decoration-thickness:1px;text-underline-offset:4px}

/* cabecera */
.cab{position:sticky;top:0;z-index:50;background:color-mix(in oklch,var(--f0) 82%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--borde)}
.cab .ancho{display:flex;align-items:center;gap:18px;min-height:64px}
.logo{display:flex;align-items:center;gap:10px;font:800 20px Archivo;font-stretch:118%;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
.logo i{width:11px;height:11px;border-radius:50%;background:var(--rojo);box-shadow:0 0 0 3px var(--f0),0 0 0 4.5px var(--rojo),0 0 18px var(--rojo)}
.nav{display:flex;gap:4px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a{padding:10px 12px;border-radius:8px;text-decoration:none;color:var(--t2);font-size:15.5px;white-space:nowrap}
.nav a[aria-current]{color:var(--t);background:var(--f2)}
@media (hover:hover){.nav a:hover{color:var(--t);background:var(--f1)}}
.cab .wa{display:none}
@media (max-width:759px){.cab .ancho{flex-wrap:wrap;gap:0;min-height:auto;padding-top:10px}.nav{width:100%;margin:6px 0 4px;margin-left:-12px;padding-left:0}}
@media (max-width:759px){.nav{gap:0;flex-wrap:wrap;overflow:visible}.nav a{padding:8px 9px;font-size:15px}.nav .larga{display:none}}
@media (min-width:760px){.nav .corta{display:none}}
@media (min-width:760px){.cab .wa{display:inline-flex}}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border-radius:10px;font:650 17px Inter;text-decoration:none;border:1px solid transparent;transition:transform 160ms var(--curva),box-shadow 200ms var(--curva),background-color 200ms}
.btn-wa{background:var(--senal);color:#111;box-shadow:0 10px 30px -10px oklch(0.88 0.18 95 / .55)}
.btn-wa::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:var(--ic-wa) center/contain no-repeat;mask:var(--ic-wa) center/contain no-repeat}
.btn-2{border-color:var(--borde-2);color:var(--t);background:oklch(1 0 0 / .03)}
@media (hover:hover){.btn:hover{transform:translateY(-2px)}.btn-wa:hover{box-shadow:0 16px 38px -12px oklch(0.88 0.18 95 / .7)}}
.btn:active{transform:scale(.98)}
:root{--ic-wa:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2-.5.1-1 .2-3.4-.7-2.8-1.1-4.6-4-4.8-4.2-.1-.2-1.1-1.5-1.1-2.9s.7-2 1-2.3c.3-.3.6-.3.8-.3h.6c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.4.6-.4.4c-.1.1-.3.3-.1.6.2.3.7 1.2 1.5 1.9 1 .9 1.9 1.2 2.2 1.3.3.1.4.1.6-.1l.8-1c.2-.3.4-.2.6-.1l1.9.9c.3.1.5.2.5.3.1.2.1.7-.1 1.4z'/%3E%3C/svg%3E")}

/* secciones */
.sec{padding-block:clamp(64px,9vw,128px) 0}
.sec .cab-sec{max-width:760px;margin-bottom:clamp(24px,3vw,40px)}
.sec .cab-sec p{color:var(--t2);margin-top:14px;max-width:56ch}
.linea-sep{display:block;height:3px;width:88px;border-radius:2px;margin-bottom:22px;background:linear-gradient(90deg,var(--l-d),var(--l-f),var(--l-m),var(--l-p))}

/* PORTADA */
.portada{position:relative;padding-block:clamp(28px,5vw,72px) 0}
.portada::before{content:"";position:absolute;inset:-120px 0 auto auto;width:min(900px,100%);height:700px;pointer-events:none;z-index:-1;
  background:radial-gradient(closest-side at 70% 30%,oklch(0.55 0.16 265 / .22),transparent),radial-gradient(closest-side at 30% 60%,oklch(0.6 0.2 25 / .12),transparent)}
.portada-g{display:grid;gap:28px}
.portada .yo{display:inline-flex;align-items:center;gap:8px;color:var(--t2);font-size:15.5px;margin-bottom:16px}
.portada .yo i{display:flex;gap:3px}.portada .yo i b{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
@media (min-width:1000px){.portada-g{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:start}.portada h1{font-size:clamp(56px,5.6vw,88px)}}

/* diagnóstico — la herramienta (viste el módulo aprobado comun/diagnostico.js) */
.herr{background:linear-gradient(180deg,var(--f1),color-mix(in oklch,var(--f1) 70%,var(--f0)));border:1px solid var(--borde);border-radius:18px;padding:20px 16px 18px;box-shadow:0 30px 80px -40px #000,inset 0 1px 0 oklch(1 0 0 / .05)}
.dx-vivo{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.dx-progreso{display:flex;gap:6px;margin:0 0 12px;width:132px}
.dx-progreso span{flex:1;height:4px;border-radius:2px;background:var(--f3)}
.dx-progreso span.on{background:var(--t2)}
.dx-progreso span.on:not(:has(~ span.on)){background:var(--senal);box-shadow:0 0 10px oklch(0.88 0.18 95 / .7)}
.dx-num{color:var(--t3);font-size:14.5px}
.dx-pregunta,.dx-res-titulo{font:760 clamp(24px,5.6vw,30px)/1.1 Archivo;font-stretch:108%;letter-spacing:-.03em;margin:4px 0 4px;outline:none}
.dx-ayuda{color:var(--t3);font-size:16px}
.dx-ops{display:grid;gap:8px;margin-top:14px}
@media (min-width:560px){.dx-ops-2{grid-template-columns:1fr 1fr}}
.dx-op{--c:var(--f3);position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:10px;width:100%;min-height:62px;padding:12px 14px;text-align:left;
  background:var(--f2);color:var(--t);border:1px solid var(--borde);border-radius:12px;cursor:pointer;transition:transform 160ms var(--curva),border-color 200ms,background-color 200ms}
.dx-op.con-mini{grid-template-columns:76px 1fr;column-gap:12px;padding:8px 28px 8px 8px}
.dx-mini{grid-row:1 / span 2;width:76px;height:57px;object-fit:cover;border-radius:8px;border:1px solid var(--borde)}
.dx-op-txt{font-weight:650;font-size:17.5px;line-height:1.2}
.dx-op-sub{color:var(--t3);font-size:14.5px;margin-top:2px}
.dx-op[data-e]::after,.dx-op:not(.con-mini)::after{content:"";position:absolute;right:12px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c)}
.dx-op[data-e=drakorp]{--c:var(--l-d)}.dx-op[data-e=fludra]{--c:var(--l-f)}.dx-op[data-e=montela]{--c:var(--l-m)}.dx-op[data-e=promo]{--c:var(--l-p)}
@media (hover:hover){.dx-op:hover{border-color:color-mix(in oklch,var(--c) 60%,var(--borde-2));background:var(--f3)}}
.dx-op:active{transform:scale(.985)}
.dx-atras{margin-top:10px;background:none;border:0;color:var(--t3);font-size:16px;min-height:44px;padding:8px 0;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.dx-res{--c:var(--t);border-left:4px solid var(--c);padding:2px 0 2px 14px;box-shadow:-10px 0 24px -14px var(--c)}
.dx-res[data-e=drakorp]{--c:var(--l-d)}.dx-res[data-e=fludra]{--c:var(--l-f)}.dx-res[data-e=montela]{--c:var(--l-m)}.dx-res[data-e=promo]{--c:var(--l-p)}
.dx-res .dx-num{color:var(--senal);font-weight:650}
.dx-res-giro,.dx-nota{color:var(--t3);font-size:15.5px;margin:0 0 10px}
.dx-res-que{margin:0 0 14px}
.dx-etq{display:block;font-weight:600;font-size:15.5px;margin-bottom:6px}
.dx-msg{width:100%;font-size:17px;padding:12px;background:var(--f0);color:var(--t);border:1px solid var(--borde-2);border-radius:10px}
.dx-wa{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;margin-top:10px;background:var(--senal);color:#111;font-weight:700;font-size:18px;text-decoration:none;border-radius:10px}
.dx-wa::after{content:"→"}
.dx-cruce{margin-top:14px;padding:12px 14px;background:var(--f2);border-radius:10px;font-size:15.5px}
.dx-cruce a,.dx-ver{color:var(--t);font-weight:650}
.dx-pie{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px}

/* LAS CUATRO — cada una con su mini-demo */
.cuatro{display:grid;gap:14px}
@media (min-width:860px){.cuatro{grid-template-columns:1fr 1fr;gap:18px}}
.emp{--c:var(--t);position:relative;display:grid;grid-template-rows:auto 1fr;background:var(--f1);border:1px solid var(--borde);border-radius:18px;overflow:hidden;text-decoration:none;isolation:isolate;transition:transform 220ms var(--curva),border-color 220ms}
.emp::before{content:"";position:absolute;inset:auto -20% -40% -20%;height:70%;z-index:-1;background:radial-gradient(closest-side,color-mix(in oklch,var(--c) 26%,transparent),transparent);opacity:.7;transition:opacity 300ms}
@media (hover:hover){.emp:hover{transform:translateY(-4px);border-color:color-mix(in oklch,var(--c) 55%,var(--borde))}.emp:hover::before{opacity:1}}
.emp[data-e=drakorp]{--c:var(--l-d)}.emp[data-e=fludra]{--c:var(--l-f)}.emp[data-e=montela]{--c:var(--l-m)}.emp[data-e=promo]{--c:var(--l-p)}
.emp .ver{position:relative;aspect-ratio:16/10;margin:0;overflow:hidden;background:var(--f0);border-bottom:1px solid var(--borde)}
.emp .ver img{width:100%;height:100%;object-fit:cover}
.emp .ver .rot{position:absolute;left:12px;bottom:12px;font-size:12.5px;color:var(--t2);background:oklch(0.12 0.01 265 / .78);padding:4px 9px;border-radius:6px;border:1px solid var(--borde)}
.emp .ver.dispositivo{display:grid;place-items:center;padding:18px;background:radial-gradient(closest-side,oklch(0.4 0.1 250 / .35),transparent),var(--f0)}
.emp .ver.dispositivo img{height:auto;max-height:100%;width:auto;max-width:100%;border-radius:10px;box-shadow:0 0 0 7px #0d0f14,0 0 0 8px oklch(1 0 0 / .12),0 30px 60px -20px #000;object-fit:contain}
.emp .tx{padding:20px 20px 22px}
.emp .marca{display:flex;align-items:center;gap:10px}
.emp .marca b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--c);color:#111;font:800 14px Archivo;box-shadow:0 0 16px color-mix(in oklch,var(--c) 70%,transparent)}
.emp[data-e=drakorp] .marca b{color:#fff}
.emp h3{font-size:26px}
.emp .giro{color:var(--t3);font-size:15px}
.emp p.que{margin-top:10px;color:var(--t2)}
.emp .ir{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-weight:650;color:var(--t)}
.emp .ir::after{content:"→";transition:transform 200ms var(--curva)}
@media (hover:hover){.emp:hover .ir::after{transform:translateX(4px)}}

/* reporte de ejemplo (Drakorp) */
.rep{position:absolute;inset:0;display:grid;align-content:center;gap:14px;padding:22px 24px;background:radial-gradient(closest-side at 70% 30%,oklch(0.6 0.2 25 / .18),transparent),var(--f0)}
.rep .eti{font-size:13px;color:var(--rojo-t);font-weight:650;letter-spacing:.01em}
.rep .barras{display:flex;align-items:flex-end;gap:14px;height:110px}
.rep .barras i{flex:1;border-radius:6px 6px 0 0;background:var(--f3)}
.rep .barras i.g{background:linear-gradient(180deg,#ff6b6b,var(--rojo));box-shadow:0 0 30px oklch(0.6 0.2 25 / .5)}
.rep .ejes{display:flex;justify-content:space-between;font-size:13px;color:var(--t3)}

/* proyecto cruzado: el stand con las cuatro */
.expo{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--borde);background:#0B0D12}
.expo img{width:100%}
.punto{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;text-decoration:none}
.punto b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--c);color:#111;font:800 13px Archivo;box-shadow:0 0 0 4px oklch(0.12 0.01 265 / .7),0 0 22px var(--c)}
.punto span{font-size:13.5px;font-weight:650;background:oklch(0.12 0.01 265 / .86);padding:5px 9px;border-radius:7px;border:1px solid var(--borde);white-space:nowrap}
.punto[data-e=drakorp]{--c:var(--l-d)}.punto[data-e=drakorp] b{color:#fff}.punto[data-e=fludra]{--c:var(--l-f)}.punto[data-e=montela]{--c:var(--l-m)}.punto[data-e=promo]{--c:var(--l-p)}
.punto.arriba{transform:translate(-50%,-115%)}.punto.abajo{transform:translate(-50%,15%)}
@media (max-width:640px){.punto span{display:none}.punto.arriba,.punto.abajo{transform:translate(-50%,-50%)}}
.pasos{display:grid;gap:12px;margin-top:18px}
@media (min-width:860px){.pasos{grid-template-columns:repeat(4,1fr)}}
.paso{--c:var(--t);background:var(--f1);border:1px solid var(--borde);border-top:3px solid var(--c);border-radius:14px;padding:16px}
.paso[data-e=drakorp]{--c:var(--l-d)}.paso[data-e=fludra]{--c:var(--l-f)}.paso[data-e=montela]{--c:var(--l-m)}.paso[data-e=promo]{--c:var(--l-p)}
.paso b{display:block;font-size:17.5px}.paso span{color:var(--t3);font-size:15.5px}

/* el equipo (sin caras inventadas) */
.duo{display:grid;gap:14px}
@media (min-width:860px){.duo{grid-template-columns:5fr 7fr;gap:40px;align-items:center}}
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));gap:1px;background:var(--borde);border:1px solid var(--borde);border-radius:16px;overflow:hidden}
.cifras div{background:var(--f1);padding:18px 14px}
.cifras b{display:block;font:780 clamp(30px,4vw,46px)/1 Archivo;font-stretch:112%;letter-spacing:-.04em}
.cifras span{display:block;color:var(--t3);font-size:14.5px;margin-top:6px}

/* exhibición de trabajos */
.mosaico{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:860px){.mosaico{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
.obra{position:relative;border-radius:14px;overflow:hidden;background:var(--f1);border:1px solid var(--borde);text-decoration:none;aspect-ratio:4/3}
.obra img{width:100%;height:100%;object-fit:cover;transition:transform 400ms var(--curva)}
@media (hover:hover){.obra:hover img{transform:scale(1.04)}}
.obra figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;background:linear-gradient(transparent,oklch(0.1 0.01 265 / .92));font-size:14px;line-height:1.3}
.obra figcaption b{display:block;font-size:15px}
.obra.grande{grid-column:span 2;aspect-ratio:16/10}

/* cierre */
.cierre{margin-top:clamp(64px,9vw,128px);padding-block:clamp(48px,7vw,96px);border-top:1px solid var(--borde);background:radial-gradient(closest-side at 50% 0%,oklch(0.6 0.2 25 / .14),transparent)}
.cierre h2{max-width:16ch}
.cierre .acc{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}

/* páginas de texto (nosotros, blog, legales) */
.doc{max-width:720px}
.doc h1{font-size:clamp(38px,6vw,72px);margin-bottom:18px}
.doc h2{font-size:clamp(24px,3vw,32px);margin:40px 0 12px}
.doc p,.doc li{color:var(--t2);font-size:18px;margin:0 0 14px}
.doc ul{padding-left:22px}
.doc .lead{font-size:20px;color:var(--t)}
.fig{margin:28px 0;border-radius:16px;overflow:hidden;border:1px solid var(--borde);background:var(--f1)}
.fig figcaption{padding:10px 14px;font-size:14px;color:var(--t3)}
.migas{display:flex;gap:8px;flex-wrap:wrap;font-size:14.5px;color:var(--t3);padding-top:28px}
.migas a{color:var(--t3)}
.post-l{display:grid;gap:14px}
@media (min-width:860px){.post-l{grid-template-columns:repeat(3,1fr)}}
.post{background:var(--f1);border:1px solid var(--borde);border-radius:16px;overflow:hidden;text-decoration:none;display:grid}
.post img{aspect-ratio:16/10;object-fit:cover;width:100%}
.post div{padding:16px}.post h3{font-size:21px}.post p{color:var(--t3);font-size:15.5px;margin-top:6px}
.valores{display:grid;gap:12px;margin:18px 0}
@media (min-width:760px){.valores{grid-template-columns:1fr 1fr}}
.valores div{background:var(--f1);border:1px solid var(--borde);border-radius:14px;padding:16px}
.valores b{display:block;font-size:18px;color:var(--t)}.valores span{color:var(--t3);font-size:16px}

/* pie */
.pie{margin-top:clamp(64px,8vw,110px);border-top:1px solid var(--borde);padding-block:36px 120px;color:var(--t3);font-size:15px}
.pie .ancho{display:grid;gap:22px}
@media (min-width:860px){.pie .ancho{grid-template-columns:2fr 1fr 1fr;padding-bottom:0}.pie{padding-bottom:40px}}
.pie b{color:var(--t);display:block;margin-bottom:8px;font-size:15.5px}
.pie a{display:block;color:var(--t2);text-decoration:none;padding:5px 0}
@media (hover:hover){.pie a:hover{color:var(--t)}}

/* la acción única, fija abajo en el teléfono */
.fijo{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:70;display:flex;transition:transform 260ms var(--curva),opacity 260ms}
.fijo .btn{flex:1;min-height:56px;font-size:17.5px}
.fijo.fuera{transform:translateY(140%);opacity:0}
@media (min-width:860px){.fijo{display:none}}

/* scroll que cuenta: los puntos del proyecto cruzado se encienden en orden al entrar */
@supports (animation-timeline: view()){
  .expo .punto{animation:enciende linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
  .expo .punto[data-e=fludra]{animation-range:entry 30% cover 50%}.expo .punto[data-e=promo]{animation-range:entry 40% cover 55%}.expo .punto[data-e=drakorp]{animation-range:entry 50% cover 60%}
  @keyframes enciende{from{opacity:0;scale:.6}to{opacity:1;scale:1}}
  .linea-sep{animation:traza linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
  @keyframes traza{from{width:0}to{width:88px}}
}
@media (prefers-reduced-motion:reduce){.expo .punto,.linea-sep{animation:none!important;opacity:1}}

/* fila de las cuatro empresas al pie de la portada: llena el pliegue con lo que el visitante busca (examen ciego 5, 17-oct) */
.cuatro-fila{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:clamp(28px,4vw,48px);padding-top:18px;border-top:1px solid var(--borde)}
.cuatro-fila .lbl{width:100%;color:var(--t3);font-size:14px}
.cuatro-fila a{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 14px 0 8px;border:1px solid var(--borde-2);border-radius:999px;text-decoration:none;font-size:15.5px;color:var(--t);background:var(--f1);transition:border-color .2s,background .2s}
.cuatro-fila a b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--c);color:#000;font:800 12.5px Archivo;box-shadow:0 0 12px color-mix(in oklch,var(--c) 60%,transparent)}
.cuatro-fila a[data-red=agencia] b{color:#fff}
.cuatro-fila a span{color:var(--t3)}
@media (hover:hover){.cuatro-fila a:hover{border-color:var(--c);background:var(--f2)}}
@media (min-width:1000px){.portada{min-height:calc(100svh - 104px);display:flex;flex-direction:column;justify-content:center;padding-bottom:28px}.cuatro-fila .lbl{width:auto;margin-right:6px;align-self:center}}