@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

/* ============ TOKENS ============ */
:root{
  --rojo: #C41230;
  --rojo-oscuro: #8C0C22;
  --negro: #0E0E0F;
  --blanco: #FFFFFF;
  --hueso: #F6F4F0;
  --gris: #5B5B5B;
  --gris-claro: #B9B6B0;
  --linea: rgba(14,14,15,0.12);
  --linea-clara: rgba(255,255,255,0.35);

  --f-display: 'Bebas Neue', sans-serif;
  --f-body: 'Public Sans', -apple-system, sans-serif;
  --f-mono: 'IBM Plex Mono', monospace;

  --header-h: 122px;
  --header-h-short: 64px;
  --ease: cubic-bezier(.22,.9,.3,1);
}

*{ box-sizing: border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--f-body);
  color: var(--negro);
  background: var(--blanco);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
body.menu-abierto{ overflow:hidden; touch-action:none; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
.skip-link{ position:fixed; z-index:1000; left:16px; top:-80px; background:var(--blanco); color:var(--negro); padding:12px 16px; border:2px solid var(--rojo); }
.skip-link:focus{ top:16px; }
.sr-only{ position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
:focus-visible{ outline: 3px solid var(--rojo); outline-offset: 2px; }
.eyebrow{
  font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--rojo);
}
.folio{ font-family: var(--f-mono); font-variant-numeric: tabular-nums; }

/* ============ PANTALLA DE CARGA ============ */
.page-loader{
  position:fixed; inset:0; z-index:2000; display:grid; place-items:center;
  background:var(--rojo); color:var(--blanco);
  transition:opacity .55s var(--ease), visibility .55s var(--ease);
}
.page-loader.is-done{ opacity:0; visibility:hidden; pointer-events:none; }
.page-loader-inner{ width:min(620px,calc(100vw - 48px)); }
.page-loader-brand{ font-family:var(--f-display); font-size:clamp(44px,9vw,92px); letter-spacing:.035em; line-height:1; }
.page-loader-status{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-top:34px; }
.page-loader-label{ font-family:var(--f-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.page-loader-number{ font-family:var(--f-display); font-size:clamp(54px,10vw,104px); line-height:.72; }
.page-loader-track{ height:3px; margin-top:24px; background:rgba(255,255,255,.3); overflow:hidden; }
.page-loader-bar{ display:block; width:0; height:100%; background:var(--blanco); transition:width .18s linear; }

/* ============ HEADER ============ */
.site-header{
  position: fixed; top:0; left:0; right:0; z-index: 100;
  height: var(--header-h);
  background: transparent;
  transition: background-color .45s var(--ease), height .4s var(--ease), border-color .4s var(--ease);
  display:flex; flex-direction:column; justify-content:space-between;
}
.site-header .top-row{
  display:flex; align-items:center; justify-content:center;
  height: 64px; flex-shrink:0;
}
.menu-toggle{ display:none; }
.site-header .logo{
  font-family: var(--f-display); font-size: 26px; letter-spacing:.04em;
  color: var(--blanco); transition: color .35s var(--ease);
}
.site-header .divider{
  width:90%; margin:0 auto; height:1px; flex-shrink:0;
  background: var(--linea-clara); transition: background-color .35s var(--ease);
}
.site-header nav.main-nav{
  overflow:hidden; max-height: 66px; opacity:1;
  transition: max-height .4s var(--ease), opacity .3s var(--ease);
}
.site-header nav.main-nav ul{
  list-style:none; display:flex; justify-content:center; gap:38px;
  padding: 19px 0 22px;
}
.site-header nav.main-nav a{
  font-family: var(--f-mono); font-size: 12.5px; letter-spacing:.09em;
  text-transform:uppercase; color: var(--blanco); transition: color .25s var(--ease);
}
.site-header nav.main-nav a:hover{ color: var(--rojo); }

/* Páginas sin hero: transparentes arriba y blancas desde el primer scroll. */
.site-header.interior .logo{ color:var(--negro); }
.site-header.interior .divider{ background:var(--linea); }
.site-header.interior nav.main-nav a{ color:var(--negro); }
.site-header.interior:hover{ background:var(--blanco); }
.site-header.interior:hover .logo{ color:var(--rojo); }

/* Estado: texto/logo negro (usado cuando el fondo del header es blanco) */
.site-header.on-white .logo{ color: var(--rojo); }
.site-header.on-white .divider{ background: var(--linea); }
.site-header.on-white nav.main-nav a{ color: var(--negro); }
.site-header.on-white nav.main-nav a:hover{ color: var(--rojo); }

/* Hover sobre el header mientras aún estamos dentro del hero: fondo blanco */
.site-header.in-hero:not(.past-hero):hover{ background: var(--blanco); }
.site-header.in-hero:not(.past-hero):hover .logo{ color: var(--rojo); }
.site-header.in-hero:not(.past-hero):hover .divider{ background: var(--linea); }
.site-header.in-hero:not(.past-hero):hover nav.main-nav a{ color: var(--negro); }
.site-header.in-hero:not(.past-hero):hover nav.main-nav a:hover{ color: var(--rojo); }

/* Al hacer scroll dentro del hero: header más corto, menú se oculta */
.site-header.scrolled:not(.past-hero){ height: var(--header-h-short); background: transparent; }
.site-header.scrolled:not(.past-hero) .top-row{ height: var(--header-h-short); }
.site-header.scrolled:not(.past-hero) nav.main-nav{ max-height:0; opacity:0; }
.site-header.scrolled:not(.past-hero):hover{ height: var(--header-h); background: var(--blanco); }
.site-header.scrolled:not(.past-hero):hover .top-row{ height:64px; }
.site-header.scrolled:not(.past-hero):hover nav.main-nav{ max-height:66px; opacity:1; }

/* Fuera del hero: header blanco y corto por default, expande con hover */
.site-header.past-hero{
  height: var(--header-h-short); background: var(--blanco);
  border-bottom: 1px solid var(--linea);
}
.site-header.past-hero .logo{ color:var(--rojo); }
.site-header.past-hero .divider{ background:var(--linea); }
.site-header.past-hero nav.main-nav a{ color:var(--negro); }
.site-header.past-hero nav.main-nav a:hover{ color:var(--rojo); }
.site-header.past-hero .top-row{ height: var(--header-h-short); }
.site-header.past-hero nav.main-nav{ max-height:0; opacity:0; }
.site-header.past-hero:hover{ height: var(--header-h); }
.site-header.past-hero:hover .top-row{ height:64px; }
.site-header.past-hero:hover nav.main-nav{ max-height:66px; opacity:1; }

/* ============ HERO (video, página pública) ============ */
.hero-fixed{
  position:absolute; inset:0; height:100vh; z-index:0; overflow:hidden;
  background: var(--negro);
}
.hero-fixed video, .hero-fixed .hero-img{
  width:100%; height:100%; object-fit:cover;
}
.hero-fixed picture{ display:block; width:100%; height:100%; }
.hero-fixed::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.05) 30%, rgba(0,0,0,.55) 100%);
}
.hero-spacer{ height:100vh; position:relative; z-index:0; }
.hero-spacer.half{ height:50vh; }
.hero-copy{
  position:absolute; z-index:2; left:clamp(24px,7vw,110px); bottom:clamp(34px,5vh,60px);
  max-width:760px; color:var(--blanco);
}
.hero-copy h1{ font-family:var(--f-display); font-size:clamp(52px,8vw,112px); line-height:.88; letter-spacing:.02em; margin:14px 0 20px; }
.hero-copy p{ font-size:clamp(16px,2vw,21px); max-width:600px; }
.hero-report-cta{ position:absolute; z-index:3; right:clamp(24px,7vw,110px); bottom:clamp(34px,5vh,60px); }
.hero-report-cta.flip-text{ position:absolute; }
.btn.hero-report-cta{ border-color:var(--blanco); background:var(--blanco); color:var(--negro); }
.btn.hero-report-cta:hover,.btn.hero-report-cta:focus-visible{ border-color:var(--rojo); background:var(--rojo); color:var(--blanco); }

/* ============ SOBRE MÍ ============ */
.sobre-mi{
  position:relative; z-index:1; background: var(--hueso);
  padding: 120px 24px 140px; border-radius: 28px 28px 0 0;
  box-shadow: 0 -40px 80px rgba(0,0,0,.25);
}
.sobre-mi .bloques{
  max-width: 760px; margin: 0 auto; display:flex; flex-direction:column; gap:64px;
}
.sobre-encabezado{ max-width:980px; margin:0 auto 90px; text-align:center; }
.sobre-encabezado h2{ font-family:var(--f-display); font-size:clamp(42px,6vw,78px); line-height:1; margin-top:14px; letter-spacing:.02em; }
.firma-fundador{ margin:36px auto 0; display:flex; flex-direction:column; align-items:center; gap:5px; }
.firma-fundador strong{ font-family:var(--f-display); font-size:clamp(30px,4vw,48px); letter-spacing:.025em; }
.firma-fundador span{ font-family:var(--f-mono); font-size:12px; letter-spacing:.075em; text-transform:uppercase; color:var(--rojo); }
.firma-fundador small{ font-size:14px; color:var(--gris); }
.sobre-mi .bloque{
  text-align:center; font-size: 19px; line-height:1.75; color: var(--negro);
  opacity:0; transform: translateY(40px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.sobre-mi .bloque.visible{ opacity:1; transform: translateY(0); }

/* ============ SECCIÓN OPCIONES (grid 4 bloques con imagen) ============ */
.opciones-grid{
  position:relative; z-index:1;
  display:grid; grid-template-columns: 1fr; gap:5px;
  background: var(--blanco);
}
.opcion-bloque{
  position:relative; height:75vh; overflow:hidden; display:block;
}
.opcion-bloque img{
  width:100%; height:100%; object-fit:cover;
  transition: transform .8s var(--ease);
}
.opcion-bloque picture{ display:block; width:100%; height:100%; }
.opcion-bloque::before{
  content:''; position:absolute; inset:0;
  background: rgba(14,14,15,.35); transition: background .4s var(--ease);
}
.opcion-bloque .titulo{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family: var(--f-display); font-size: clamp(28px,4vw,48px); letter-spacing:.05em;
  color: var(--rojo); text-transform:uppercase; opacity:1;
  text-shadow:0 2px 18px rgba(0,0,0,.65);
  background:linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.38));
  transition: opacity .4s var(--ease);
}
.opcion-bloque:hover img{ transform: scale(1.08); }
.opcion-bloque:hover::before{ background: rgba(196,18,48,.55); }
.opcion-bloque:hover .titulo{ opacity:1; }

/* ============ CONTACTO ============ */
#contacto{ position:relative; z-index:1; background:var(--blanco); overflow:hidden; }
.contacto-banner{
  position:relative; z-index:1; width:100%; height:300px;
  background: var(--rojo); display:flex; align-items:center; justify-content:center;
}
.contacto-banner h2{
  font-family: var(--f-display); font-size: clamp(40px,6vw,72px); letter-spacing:.04em;
  color: var(--blanco); opacity:0; transform: translateY(24px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.contacto-banner h2.visible{ opacity:1; transform:translateY(0); }

.contacto-desc{
  max-width: 620px; margin: 72px auto; text-align:center; padding:0 24px;
  color: var(--gris); font-size:17px; opacity:0; transform: translateY(20px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.contacto-desc.visible{ opacity:1; transform:translateY(0); }

.contacto-medios{
  max-width: 980px; margin: 0 auto 100px; padding:0 24px;
  display:grid; grid-template-columns: repeat(4,1fr); gap:32px; text-align:center;
}
.contacto-medios .item .eyebrow{ display:block; margin-bottom:8px; }
.contacto-medios .item p{ font-size:15px; color: var(--negro); }

.faq{ max-width: 760px; margin: 0 auto 140px; padding: 0 24px; }
.faq-item{ border-bottom: 1px solid var(--linea); }
.faq-item button{
  width:100%; background:none; border:none; text-align:left; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between;
  padding: 26px 0; font-family: var(--f-body); font-size:17px; font-weight:600; color: var(--negro);
}
.faq-item .plus{
  font-family: var(--f-mono); font-size:22px; color: var(--rojo); flex-shrink:0; margin-left:20px;
  transition: transform .35s var(--ease);
}
.faq-item.open .plus{ transform: rotate(135deg); }
.faq-item .panel{
  max-height:0; overflow:hidden; transition: max-height .4s var(--ease);
}
.faq-item .panel p{ padding: 0 0 26px; color: var(--gris); font-size:15px; line-height:1.7; }

/* ============ FOOTER ============ */
.site-footer{
  position:relative; z-index:1; background: var(--rojo); color: var(--blanco);
  padding: 64px 24px 32px;
}
.site-footer .top{ text-align:center; margin-bottom:56px; }
.site-footer .logo{ font-family: var(--f-display); font-size:30px; letter-spacing:.04em; }
.site-footer .copy{ font-family: var(--f-mono); font-size:12px; margin-top:10px; opacity:.85; }
.site-footer .bottom{
  max-width: 1100px; margin:0 auto; display:flex; align-items:center; justify-content:center;
  padding-top: 28px; border-top: 1px solid var(--linea-clara); flex-wrap:wrap; gap:16px;
}
.site-footer .aviso a{ font-family: var(--f-mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; }
.site-footer .aviso a:hover{ color: var(--negro); }
.site-footer .social{ display:flex; gap:22px; }
.site-footer .social a{ font-family: var(--f-mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; }
.site-footer .social a[href="#"]{ display:none; }
.site-footer .social a:hover{ color: var(--negro); }
.legal{ max-width:820px; margin:0 auto; padding:160px 24px 120px; }
.legal h1{ font-family:var(--f-display); font-size:clamp(40px,6vw,64px); margin-bottom:18px; }
.legal h2{ font-size:21px; margin:38px 0 12px; }
.legal h3{ font-size:16px; margin:26px 0 8px; }
.legal p,.legal li{ color:var(--gris); font-size:15px; line-height:1.8; }
.legal ul,.legal ol{ padding-left:22px; margin:10px 0 16px; }
.legal a{ color:var(--rojo); text-decoration:underline; text-underline-offset:3px; }
.legal .legal-meta{ font-family:var(--f-mono); font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--rojo); margin-bottom:32px; }
.legal-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:28px; }
.legal-card{ border:1px solid var(--linea); padding:24px; }
.legal-card h2{ margin-top:0; }
.legal-card a{ font-family:var(--f-mono); font-size:12px; text-transform:uppercase; }
.footer-legal{ display:flex; flex-wrap:wrap; gap:16px; }
.footer-legal a{ font-family:var(--f-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; }

/* ============ AVISO DE COOKIES ============ */
.cookie-banner{
  position:fixed; z-index:900; left:24px; right:24px; bottom:24px;
  max-width:1120px; margin:0 auto; padding:20px 22px;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:20px 32px;
  background:var(--negro); color:var(--blanco); border:1px solid rgba(255,255,255,.24);
  box-shadow:0 20px 60px rgba(0,0,0,.32);
  transform:translateY(calc(100% + 40px)); opacity:0;
  transition:transform .55s var(--ease), opacity .45s var(--ease);
}
.cookie-banner.is-visible{ transform:translateY(0); opacity:1; }
.cookie-banner h2{ font-family:var(--f-display); font-size:25px; letter-spacing:.035em; }
.cookie-banner p{ margin-top:4px; color:var(--gris-claro); font-size:13px; line-height:1.55; }
.cookie-banner a{ color:var(--blanco); text-decoration:underline; text-underline-offset:3px; }
.cookie-actions{ display:flex; gap:10px; align-items:center; }
.cookie-button{ border:1px solid var(--blanco); background:var(--blanco); color:var(--negro); padding:12px 18px; cursor:pointer; font:11px var(--f-mono); letter-spacing:.07em; text-transform:uppercase; }
.cookie-button:hover{ background:var(--rojo); border-color:var(--rojo); color:var(--blanco); }

/* ============ ERROR 404 ============ */
.error-page{ min-height:100vh; background:var(--hueso); display:grid; place-items:center; padding:150px 24px 80px; }
.error-card{ width:min(900px,100%); text-align:center; }
.error-code{ font-family:var(--f-display); font-size:clamp(150px,31vw,360px); line-height:.65; color:var(--rojo); letter-spacing:-.025em; }
.error-card h1{ margin-top:54px; font-family:var(--f-display); font-size:clamp(42px,7vw,78px); line-height:.95; }
.error-card p{ max-width:570px; margin:22px auto 34px; color:var(--gris); font-size:17px; }
.error-actions{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }

/* ============ PÁGINAS INTERIORES ============ */
main.pagina{ position:relative; z-index:1; background: var(--blanco); }
.pagina-intro{
  max-width: 720px; margin: 0 auto; text-align:center; padding: 90px 24px 60px;
  opacity:0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.pagina-intro.visible{ opacity:1; transform:translateY(0); }
.pagina-intro h1{ font-family: var(--f-display); font-size: clamp(32px,5vw,52px); letter-spacing:.03em; margin-bottom:18px; }
.pagina-intro p{ color: var(--gris); font-size:16px; }

.filtros-banner{
  width:100%; background: var(--rojo); padding: 28px 24px;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:center; align-items:center;
}
.filtros-banner select, .filtros-banner input{
  font-family: var(--f-mono); font-size:12.5px; letter-spacing:.05em; text-transform:uppercase;
  background: var(--blanco); border:none; padding:11px 16px; color: var(--negro);
}

/* Mapa */
.mapa-wrap{ width:100%; height:640px; background: var(--hueso); position:relative; }
.mapa-privacidad,.estado-datos{ max-width:1100px; margin:18px auto 0; padding:0 24px; color:var(--gris); font-size:13px; }
.mapa-stats{
  max-width:1100px; margin:0 auto; padding: 48px 24px 100px;
  display:grid; grid-template-columns: repeat(3,1fr); gap:24px;
}
.stat-card{
  border:1px solid var(--linea); padding:28px; text-align:center; transition: border-color .3s;
}
.stat-card:hover{ border-color: var(--rojo); }
.stat-card .num{ font-family: var(--f-mono); font-size:38px; color: var(--rojo); }
.stat-card .lbl{ font-size:13px; color: var(--gris); margin-top:8px; }
.stat-card button,.stat-card .btn{
  margin-top:18px; font-family: var(--f-mono); font-size:11.5px; letter-spacing:.08em;
  text-transform:uppercase; padding:12px 18px;
}

/* Guía nuevo reporte */
.guia{
  max-width:1100px; margin:0 auto; padding: 100px 24px; display:grid;
  grid-template-columns: 320px 1fr; gap:80px;
}
.guia .titulo-sticky{ position: sticky; top: 140px; align-self:start; transition: top .3s var(--ease); }
.guia .titulo-sticky h2{ font-family: var(--f-display); font-size: clamp(28px,3.4vw,40px); letter-spacing:.03em; }
.guia .pasos{ display:flex; flex-direction:column; gap:56px; }
.guia .paso{ display:flex; gap:24px; }
.guia .paso .n{ font-family:var(--f-mono); font-size:34px; color: var(--rojo); flex-shrink:0; width:52px; }
.guia .paso p{ font-size:16px; color: var(--negro); padding-top:6px; }
.guia-ctas{ display:flex; gap:18px; justify-content:center; padding: 0 24px 120px; flex-wrap:wrap; }
.btn{
  font-family: var(--f-mono); font-size:13px; letter-spacing:.08em; text-transform:uppercase;
  padding:18px 32px; border:2px solid var(--negro); background:transparent; color:var(--negro);
  cursor:pointer; transition: background-color .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease); display:inline-block;
}
.btn:hover{ background: var(--rojo); border-color:var(--rojo); color: var(--blanco); }
.btn.rojo{ border-color:var(--negro); background:transparent; color:var(--negro); }
.btn.rojo:hover{ background:var(--rojo); border-color:var(--rojo); color:var(--blanco); }

/* 3D text flip compartido: el control conserva su tamaño y solo gira el texto. */
.flip-text{ position:relative; overflow:hidden; }
.flip-text .flip-label{
  display:block; transform-origin:50% 0; transform-style:preserve-3d;
  transition:transform .42s var(--ease); backface-visibility:hidden;
}
.flip-text::after{
  content:attr(data-flip-label); position:absolute; inset:0; display:flex;
  align-items:center; justify-content:center; color:inherit; pointer-events:none;
  transform:rotateX(-90deg) translateY(100%); transform-origin:50% 100%;
  transition:transform .42s var(--ease); backface-visibility:hidden;
}
.flip-text:hover .flip-label,.flip-text:focus-visible .flip-label{ transform:rotateX(90deg) translateY(-100%); }
.flip-text:hover::after,.flip-text:focus-visible::after{ transform:rotateX(0) translateY(0); }
.main-nav .flip-text::after,.site-header .logo.flip-text::after,.site-footer .flip-text::after{ justify-content:flex-start; }

/* Casos y reportes: cards */
.cards-grid{
  max-width:1200px; margin:0 auto; padding: 60px 24px 120px;
  display:grid; grid-template-columns: repeat(3,1fr); gap:32px;
}
.consulta-folio{ max-width:1100px; margin:0 auto 32px; padding:28px; background:var(--hueso); display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.8fr); gap:24px 48px; align-items:end; }
.consulta-folio h2{ font-family:var(--f-display); font-size:clamp(30px,4vw,48px); margin:8px 0; }
.consulta-folio p{ color:var(--gris); }
.consulta-folio label{ display:block; font-family:var(--f-mono); font-size:12px; text-transform:uppercase; margin-bottom:8px; }
.consulta-folio-controles{ display:flex; gap:10px; }
.consulta-folio input{ width:100%; min-width:0; border:1px solid var(--linea); background:var(--blanco); padding:14px; font:16px var(--f-mono); text-transform:uppercase; }
.consulta-folio .btn{ padding:13px 18px; }
.consulta-resultado{ grid-column:1/-1; min-height:24px; border-top:1px solid var(--linea); padding-top:18px; }
.consulta-resultado strong{ font-family:var(--f-mono); color:var(--rojo); }
.consulta-resultado p{ margin-top:6px; }
.caso-card{ border:1px solid var(--linea); display:flex; flex-direction:column; transition: box-shadow .3s; }
.caso-card:hover{ box-shadow: 0 20px 40px rgba(0,0,0,.08); }
.caso-card img{ width:100%; height:190px; object-fit:cover; }
.caso-card .body{ padding:22px; display:flex; flex-direction:column; gap:10px; flex:1; }
.caso-card .folio{ font-size:11px; color: var(--rojo); }
.caso-card h3{ font-size:18px; }
.caso-card p{ font-size:14px; color: var(--gris); flex:1; }
.progreso{ height:6px; background: var(--linea); position:relative; overflow:hidden; }
.progreso span{ position:absolute; inset:0 auto 0 0; background: var(--rojo); }
.progreso-lbl{ font-family: var(--f-mono); font-size:11px; color: var(--gris); display:flex; justify-content:space-between; }

/* Transparencia */
.transparencia-tabla{ max-width:1100px; margin: 0 auto 100px; padding:0 24px; }
.transparencia-tabla table{ width:100%; border-collapse:collapse; }
.transparencia-tabla th, .transparencia-tabla td{
  text-align:left; padding:16px 12px; border-bottom:1px solid var(--linea); font-size:14px;
}
.transparencia-tabla th{ font-family:var(--f-mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color: var(--gris); }
.transparencia-tabla a.pdf{ color: var(--rojo); font-family: var(--f-mono); font-size:12.5px; }

.cronometros{ max-width:1100px; margin: 0 auto 120px; padding: 0 24px; display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.cronometro{ background: var(--negro); color: var(--blanco); padding:32px; text-align:center; }
.cronometro .dias{ font-family: var(--f-mono); font-size:56px; color: var(--rojo); line-height:1; }
.cronometro .lbl{ font-size:13px; color: var(--gris-claro); margin-top:10px; }
.cronometro .caso{ font-size:12px; margin-top:16px; opacity:.7; }

@media (max-width: 880px){
  :root{ --header-h:64px; }
  .site-header{ background:transparent; backdrop-filter:none; height:64px; }
  .site-header .top-row{ position:relative; z-index:2; justify-content:space-between; padding:0 max(20px,env(safe-area-inset-right)) 0 max(20px,env(safe-area-inset-left)); }
  .menu-toggle{ min-width:82px; min-height:44px; display:flex; align-items:center; justify-content:flex-end; gap:10px; border:0; background:transparent; color:var(--blanco); padding:8px 0; font-family:var(--f-mono); text-transform:uppercase; font-size:11px; letter-spacing:.06em; cursor:pointer; }
  .menu-toggle-icon{ position:relative; width:19px; height:14px; display:block; }
  .menu-toggle-icon i{ position:absolute; left:0; width:19px; height:1px; background:currentColor; transition:transform .3s var(--ease), top .3s var(--ease); }
  .menu-toggle-icon i:first-child{ top:3px; }
  .menu-toggle-icon i:last-child{ top:10px; }
  .menu-activo .menu-toggle-icon i:first-child{ top:7px; transform:rotate(45deg); }
  .menu-activo .menu-toggle-icon i:last-child{ top:7px; transform:rotate(-45deg); }
  .site-header.interior .menu-toggle,.site-header.past-hero .menu-toggle{ color:var(--negro); }
  .site-header.menu-activo{ height:64px!important; background:var(--blanco)!important; border-bottom:1px solid var(--linea); }
  .site-header.menu-activo .logo{ color:var(--rojo)!important; }
  .site-header.menu-activo .menu-toggle{ color:var(--negro)!important; }
  .site-header .divider{ display:none; }
  .site-header nav.main-nav,.site-header.scrolled:not(.past-hero) nav.main-nav,.site-header.past-hero nav.main-nav{
    position:fixed; z-index:1; top:64px; left:0; right:0; bottom:0;
    max-height:none; height:calc(100dvh - 64px); opacity:0; visibility:hidden; pointer-events:none;
    overflow-y:auto; overscroll-behavior:contain; background:var(--blanco);
    transform:translateY(-12px); transition:opacity .28s var(--ease), transform .35s var(--ease), visibility 0s linear .35s;
  }
  .menu-abierto .site-header nav.main-nav{ max-height:none!important; height:calc(100dvh - 64px); opacity:1!important; visibility:visible; pointer-events:auto; transform:translateY(0); transition-delay:0s; }
  .site-header nav.main-nav ul{ min-height:100%; flex-direction:column; justify-content:center; gap:0; padding:28px max(24px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left)); }
  .site-header nav.main-nav li{ width:100%; border-bottom:1px solid var(--linea); }
  .site-header nav.main-nav a,.site-header.in-hero nav.main-nav a{ display:flex; align-items:center; min-height:58px; color:var(--negro)!important; padding:12px 2px; font-size:13px; }
  .site-header nav.main-nav a[aria-current="page"]{ color:var(--rojo)!important; }
  .hero-fixed,.hero-spacer{ min-height:100svh; height:100svh; }
  .hero-spacer.half{ min-height:52svh; height:52svh; }
  .hero-copy{ left:24px; right:24px; bottom:132px; }
  .hero-copy h1{ font-size:clamp(50px,17vw,76px); }
  .hero-copy p{ font-size:16px; line-height:1.5; }
  .hero-report-cta,.hero-report-cta.flip-text{ left:24px; right:24px; bottom:max(38px,calc(20px + env(safe-area-inset-bottom))); width:auto; text-align:center; }
  .opcion-bloque{ height:62svh; min-height:420px; }
  .transparencia-tabla{ overflow-x:auto; }
  .opciones-grid{ grid-template-columns: 1fr; }
  .guia{ grid-template-columns: 1fr; gap:32px; }
  .guia .titulo-sticky{ position:static; }
  .cards-grid{ grid-template-columns: 1fr; }
  .contacto-medios{ grid-template-columns: repeat(2,1fr); }
  .legal-grid{ grid-template-columns:1fr; }
  .mapa-stats{ grid-template-columns: 1fr; }
  .cronometros{ grid-template-columns: 1fr; }
  .consulta-folio{ margin:0 16px 24px; padding:22px 18px; grid-template-columns:1fr; }
  .consulta-folio-controles{ flex-direction:column; }
  .consulta-folio .btn{ width:100%; text-align:center; }
  .cookie-banner{ left:12px; right:12px; bottom:12px; grid-template-columns:1fr; }
  .cookie-actions{ justify-content:stretch; }
  .cookie-button{ width:100%; }
}
@media (max-width: 560px){
  .sobre-mi{ padding:88px 20px 100px; }
  .sobre-encabezado{ margin-bottom:64px; }
  .sobre-mi .bloques{ gap:44px; }
  .sobre-mi .bloque{ font-size:17px; }
  .firma-fundador span{ max-width:330px; line-height:1.55; }
  .contacto-medios{ grid-template-columns:1fr; gap:28px; }
  .contacto-desc{ margin:54px auto; }
  .faq{ margin-bottom:96px; }
  .site-footer{ padding-inline:20px; }
  .site-footer .copy{ line-height:1.7; }
  .footer-legal{ justify-content:center; row-gap:12px; }
  .legal{ padding:120px 20px 88px; }
  .mapa-wrap{ height:68svh; min-height:480px; }
  .guia{ padding:76px 20px; }
  .guia .pasos{ gap:42px; }
  .guia .paso{ gap:16px; }
  .guia .paso .n{ width:42px; font-size:30px; }
  .guia-ctas .btn,.error-actions .btn{ width:100%; text-align:center; }
  .cards-grid{ padding:42px 16px 88px; }
  .transparencia-tabla{ padding:0 16px; }
  .filtros-banner select,.filtros-banner input{ width:100%; min-height:46px; }
}
@media (hover:none), (pointer:coarse){
  .flip-text .flip-label{ transform:none!important; }
  .flip-text::after{ display:none; }
  .opcion-bloque:hover img{ transform:none; }
}
@media (prefers-reduced-motion: reduce){
  *{ transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
@media (prefers-contrast: more){
  :root{ --gris:#353535; --linea:rgba(0,0,0,.35); }
  .btn,.filtros-banner select,.filtros-banner input{ border-width:2px; }
}