/**
 * Estilos del sitio público de Más X Menos.
 *
 * El bloque central es la hoja del diseño de Figma, tal cual: se conservan
 * sus clases para que una revisión del diseño se pueda comparar línea por
 * línea. Lo propio del tema va al final, en «Añadidos del tema».
 */

/* Fuentes, servidas por el tema (licencia OFL, en assets/fonts). */
@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-latin.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Public Sans";
	src: url("../fonts/public-sans-latin.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* Lo mínimo del reinicio que el diseño daba por hecho. */
*, ::before, ::after { box-sizing: border-box; border: 0 solid; }
ol, ul, menu { list-style: none; }
img, svg { display: block; max-width: 100%; height: auto; }
button { background-color: transparent; color: inherit; }
table { border-collapse: collapse; }
summary { display: list-item; }
[hidden] { display: none !important; }

/* Diseño de Figma. */
:root{--red:#fa0000;--link:#b60000;--hover:#8a0000;--tint:#ffecec;--black:#000;--white:#fff;--surface:#f5f5f5;--line:#e4e4e4;--muted:#5a5a5a;--note:#6b6b6b;--max:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{color:var(--black);background:var(--white);margin:0;font:400 17px/1.58 Public Sans,sans-serif}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--hover)}
h1,h2,h3{letter-spacing:-.025em;margin:0;font-family:Archivo,sans-serif;line-height:1.05}
h1{font-size:clamp(2.7rem,5vw,4.65rem)}
h2{font-size:clamp(2rem,3vw,3rem)}
h3{font-size:1.35rem}
p{margin:0}
ul,ol{margin:0;padding:0}
button,input,select,textarea{min-height:44px}
.shell{width:min(100% - 80px, var(--max));margin-inline:auto}
.site-header{z-index:30;border-bottom:1px solid var(--line);background:#fffffff7;position:sticky;top:0}
.header-inner{align-items:center;gap:28px;min-height:88px;display:flex}
.brand-link{flex:0 0 176px;display:block}
.logo-crop{width:176px;display:block}
.logo-crop img{width:100%;height:auto;display:block}
.nav{align-items:center;gap:26px;margin-right:auto;display:flex}
.nav a{color:var(--black);font-size:.92rem;font-weight:500}
.menu-button{border:1px solid var(--line);background:0 0;padding:0 16px;font-weight:600;display:none}
.button{background:var(--link);min-height:52px;color:var(--white);cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;padding:0 24px;font-weight:600;display:inline-flex}
.button:hover{background:var(--hover);color:var(--white)}
.button.secondary{color:var(--black);background:var(--white);border:1px solid #cfcfcf}
.button.light{color:var(--black);background:var(--white)}
.button.wide{width:100%;margin-top:20px}
.button:disabled{opacity:.45;cursor:not-allowed}
.hero{grid-template-columns:1.05fr .9fr;align-items:center;gap:72px;padding-block:82px;display:grid}
.hero-copy{gap:26px;display:grid}
.hero-copy h1 em{color:var(--red);font-style:normal}
.hero-copy>p{color:var(--muted);font-size:1.15rem}
.hero-copy small{color:var(--note)}
.eyebrow{width:fit-content;color:var(--link);background:var(--tint);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:7px 12px;font-size:.77rem;font-weight:700;display:inline-flex}
.actions{flex-wrap:wrap;gap:12px;display:flex}
.mini-sim{border:1px solid var(--line);background:var(--surface);border-radius:18px;gap:16px;padding:30px;display:grid}
.mini-sim>p{color:var(--muted);font-size:.9rem}
label,legend{font-size:.92rem;font-weight:600}
.big-number{font-variant-numeric:tabular-nums;font:700 2rem/1 Archivo}
input[type=range]{width:100%;accent-color:var(--red)}
.range-labels{color:var(--muted);justify-content:space-between;font-size:.8rem;display:flex}
.chips{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}
.chips button{cursor:pointer;background:#fff;border:1px solid #d5d5d5;border-radius:8px}
.chips button.active{border-color:var(--red);color:#fff;background:var(--red)}
.quote-card{border:1px solid var(--line);background:var(--white);border-radius:12px;gap:14px;padding:20px;display:grid}
.quote-card.dark{color:var(--white);background:var(--black);border-color:#222}
.quote-card>span{color:var(--muted);font-size:.85rem}
.quote-card.dark>span{color:#cfcfcf}
.quote-main{justify-content:space-between;align-items:end;gap:20px;display:flex}
.quote-main>strong{color:var(--red);font-variant-numeric:tabular-nums;font:700 clamp(2rem,4vw,3.4rem)/1 Archivo}
.quote-main div{text-align:right;display:grid}
.quote-main b{font-variant-numeric:tabular-nums;font:700 1.55rem/1.2 Archivo}
.quote-meta{border-top:1px solid var(--line);justify-content:space-between;gap:16px;padding-top:12px;font-size:.8rem;display:flex}
.quote-meta span{display:grid}
.text-link{font-weight:600}
.stats,.black-band{color:#fff;background:var(--black)}
.stats-grid{grid-template-columns:repeat(4,1fr);gap:42px;padding-block:40px;display:grid}
.stats-grid div{gap:4px;display:grid}
.stats-grid strong{font-variant-numeric:tabular-nums;font:700 1.75rem/1.15 Archivo}
.stats-grid div:last-child strong{color:#ff6b6b}
.stats-grid span{color:#cfcfcf;font-size:.82rem}
.section{padding-block:88px}
.section.soft,.soft{background:var(--surface)}
.section-title{gap:14px;max-width:760px;margin-bottom:38px;display:grid}
.section-title p,.intro p{color:var(--muted);font-size:1.05rem}
.two-col,.three-col,.steps{gap:22px;display:grid}
.two-col{grid-template-columns:repeat(2,1fr)}
.three-col,.steps.three{grid-template-columns:repeat(3,1fr)}
.steps.four{grid-template-columns:repeat(4,1fr)}
.route-card{border:1px solid var(--line);border-radius:14px;gap:18px;padding:32px;display:grid}
.route-card.gray{background:var(--surface)}
.route-card i{background:var(--red);border-radius:5px;width:38px;height:5px}
.route-card.gray i{background:var(--black)}
.route-card ul,.check-list{gap:10px;list-style:none;display:grid}
.route-card li:before,.check-list li:before{content:"—";color:var(--link);padding-right:10px;font-weight:700}
.steps article{border-top:3px solid var(--black);padding-top:20px}
.steps article b{color:var(--link);text-transform:uppercase;font-size:.8rem}
.steps article h3{margin:12px 0}
.three-col article{gap:12px;display:grid}
.contact-band{background:var(--tint);padding-block:68px}
.contact-list{align-content:center;gap:10px;padding-left:20%;display:grid}
.red-panel{background:var(--red);color:var(--white);border-radius:14px;padding:38px}
.red-panel p{margin:18px 0}
.red-panel a{color:var(--white);font-weight:600}
.number-list{counter-reset:item;gap:0;list-style:none;display:grid}
.number-list li{border-bottom:1px solid var(--line);counter-increment:item;padding:16px 0}
.number-list li:before{content:"0" counter(item);color:var(--link);padding-right:16px;font-weight:700}
.cta{color:#fff;background:var(--red);padding-block:52px}
.cta .shell{justify-content:space-between;align-items:center;gap:30px;display:flex}
.page-hero{grid-template-columns:1.4fr .7fr;align-items:center;gap:70px;padding-block:76px;display:grid}
.page-hero>div:first-child{gap:22px;display:grid}
.page-hero p{color:var(--muted);font-size:1.1rem}
.facts{background:var(--surface);border-radius:12px;gap:14px;padding:26px;display:grid}
.facts span{border-bottom:1px solid var(--line);justify-content:space-between;padding-bottom:10px;display:flex}
.black-band{padding-block:60px}
.black-band h2{margin-bottom:16px}
.black-band p{color:#cfcfcf}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;min-width:680px}
th{color:var(--note);text-align:left;text-transform:uppercase;letter-spacing:.04em;font-size:.75rem}
th,td{border-bottom:1px solid var(--line);padding:17px 14px}
td{font-weight:500}
details{border-bottom:1px solid var(--line);padding:16px 0}
summary{cursor:pointer;font-weight:600}
.intro{gap:15px;padding-top:64px;display:grid}
.intro h1{font-size:clamp(2.5rem,4vw,4rem)}
.sim-grid{grid-template-columns:1fr 1fr;align-items:start;gap:48px;display:grid}
.sim-controls{gap:13px;display:grid}
.fixed-rate{border:1px solid var(--line);background:var(--surface);border-radius:8px;justify-content:space-between;align-items:center;gap:20px;min-height:70px;padding:14px 16px;display:flex}
.fixed-rate span{color:var(--muted);font-size:.9rem}
.fixed-rate strong{font-variant-numeric:tabular-nums;font-family:Archivo,sans-serif}
input,select,textarea{color:#000;background:#fff;border:1px solid #cfcfcf;border-radius:7px;width:100%;padding:10px 12px}
fieldset{border:1px solid var(--line);border-radius:8px;gap:10px;margin:8px 0;padding:18px;display:grid}
fieldset label:has(input[type=radio]){align-items:center;gap:8px;display:flex}
input[type=radio]{width:20px;min-height:20px;accent-color:var(--red)}
.limit-error,.limit-ok{border-radius:6px;padding:10px 12px;font-size:.85rem;font-weight:600}
.limit-error{color:var(--link);background:var(--tint)}
.limit-ok{color:#fff;background:#262626}
.breakdown{gap:0;margin-top:20px;display:grid}
.breakdown h3{margin-bottom:12px}
.breakdown span{border-bottom:1px solid var(--line);justify-content:space-between;gap:20px;padding:13px 0;display:flex}
.breakdown p,.disclaimer{color:var(--note);margin-top:14px;font-size:.85rem}
.blocked{border:2px solid var(--link);background:var(--tint);border-radius:14px;padding:36px}
.blocked p{margin-top:20px}
.company-hero{color:#fff;background:#000}
.company-hero .page-hero p{color:#cfcfcf}
.dark-eyebrow{color:#fff;background:#2c2c2c}
.zero{border:1px solid #444;border-radius:14px;gap:8px;padding:30px;display:grid}
.zero strong,.panorama>strong,.cost-card strong{color:var(--red);font-variant-numeric:tabular-nums;font:700 clamp(3.5rem,7vw,6rem)/1 Archivo}
.form-card{background:var(--surface);border-radius:14px;padding:30px}
.form-card form{gap:16px;display:grid}
.form-card label,.form-grid label,.complaints label{gap:7px;display:grid}
.success{border-left:6px solid var(--red);background:var(--tint);padding:35px}
.success p{margin-top:15px}
.panorama{align-items:center;gap:48px;display:flex}
.timeline{grid-template-columns:repeat(3,1fr);gap:0;margin-bottom:30px;display:grid}
.timeline article{border-top:5px solid var(--red);background:#fff;padding:26px}
.timeline article+article{border-left:1px solid var(--line)}
.timeline h3{margin:12px 0}
.cost-card{border:1px solid var(--line);background:#fff;border-radius:12px;padding:28px}
.cost-card strong{font-size:3.4rem}
.faq{gap:42px;max-width:920px;display:grid}
.faq h2{color:var(--note);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px;font-size:1rem}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item button{text-align:left;cursor:pointer;background:#fff;border:0;justify-content:space-between;align-items:center;width:100%;padding:16px 0;font-weight:600;display:flex}
.faq-item p{color:var(--muted);padding:0 48px 20px 0}
.application,.complaints{grid-template-columns:1.6fr .8fr;align-items:start;gap:50px;display:grid}
.application aside,.complaints aside{background:var(--surface);gap:18px;padding:24px;display:grid;position:sticky;top:105px}
.application aside ul{padding-left:20px}
.progress{background:var(--line);border-radius:8px;height:8px;margin-bottom:16px;overflow:hidden}
.progress span{background:var(--red);height:100%;transition:width .2s;display:block}
.form-grid{grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px;display:grid}
.form-grid .button,.form-grid .full{grid-column:1/-1}
.confirmation{gap:20px;margin-top:24px;display:grid}
.complaint-head{color:#fff;background:var(--red);padding-block:45px}
.complaint-head .shell{justify-content:space-between;align-items:center;gap:30px;display:flex}
.complaint-head strong{font-variant-numeric:tabular-nums;font:700 2rem Archivo;display:block}
.complaints form{gap:24px;display:grid}
.complaints fieldset{gap:18px}
.complaints legend{font:700 1.3rem Archivo}
.choice{grid-template-columns:1fr 1fr;gap:10px;display:grid}
.choice label{border:1px solid var(--line);border-radius:8px;justify-content:center;align-items:center;min-height:58px;display:flex}
.success-page{align-content:center;justify-items:start;gap:20px;min-height:55vh;display:grid}
.footer{color:#cfcfcf;background:#000;padding-top:55px}
.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px;display:grid}
.footer-grid>div{align-content:start;gap:9px;display:grid}
.footer strong{color:#fff;text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}
.footer a{color:#fff;font-size:.9rem}
.footer p{font-size:.85rem}
.logo-pill{background:#fff;border-radius:8px;width:fit-content;padding:6px 12px}
.legal-row{border-top:1px solid #333;justify-content:space-between;gap:30px;margin-top:42px;padding-block:22px;display:flex}
.legal-row p{max-width:800px}
.footer.compact .footer-about,.footer.compact .footer-grid>div:nth-child(2){display:none}
.footer.compact .footer-grid{grid-template-columns:1fr 1fr}
@media (width<=800px){body{font-size:16px}
.shell{width:min(100% - 32px, var(--max))}
.site-header{position:relative}
.header-inner{gap:12px;min-height:78px}
.brand-link,.logo-crop{flex-basis:158px;width:158px}
.brand-link{margin-right:auto}
.menu-button{display:block}
.header-cta{display:none}
.nav{border-bottom:1px solid var(--line);background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:12px 16px 20px;display:none;position:absolute;top:78px;left:0;right:0}
.nav.open{display:flex}
.nav a{border-bottom:1px solid var(--line);align-items:center;min-height:48px;display:flex}
.hero{grid-template-columns:1fr;gap:30px;padding-block:42px}
.hero-copy{gap:18px}
.hero-copy h1{font-size:2.85rem}
.hero-copy>p{font-size:1rem}
.hero-copy small{display:none}
.mini-sim{padding:20px}
.mini-sim>h3,.mini-sim>p,.mini-sim>label:first-of-type,.mini-sim>.big-number,.mini-sim>input[type=range],.mini-sim>.range-labels,.mini-sim .quote-meta{display:none}
.mini-sim{color:#fff;background:#000;border-radius:12px}
.mini-sim .quote-card{color:#fff;background:#000;border:0;padding:0}
.mini-sim .quote-card>span{color:#cfcfcf}
.mini-sim .text-link{color:#fff}
.actions .button{flex:1}
.stats-grid,.three-col,.steps.three,.steps.four,.footer-grid{grid-template-columns:1fr}
.stats-grid{gap:26px}
.stats-grid div{grid-template-columns:1fr 1fr;align-items:baseline}
.two-col,.sim-grid,.application,.complaints,.page-hero{grid-template-columns:1fr}
.section{padding-block:58px}
.page-hero{gap:32px;padding-block:48px}
.page-hero h1{font-size:2.8rem}
.contact-list{padding-left:0}
.cta .shell,.complaint-head .shell{flex-direction:column;align-items:flex-start}
.timeline{grid-template-columns:1fr}
.timeline article+article{border-left:0}
.panorama{flex-direction:column;align-items:flex-start}
.form-grid{grid-template-columns:1fr}
.application aside,.complaints aside{position:static}
.footer-grid{gap:28px}
.footer.compact .footer-grid{grid-template-columns:1fr}
.legal-row{flex-direction:column}
}

/* Añadidos del tema. */
.chips { grid-template-columns: repeat(var(--chips, 5), 1fr); }

/*
 * En el diseño los botones heredan el color del texto, y en el móvil la
 * tarjeta de la portada es negra: quedaban blancos sobre blanco.
 */
.chips button { color: var(--black); }
.chips button.active { color: var(--white); }
.admin-bar .site-header { top: 32px; }
.nav a[aria-current="page"] { color: var(--link); }
:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.skip-link:focus {
	z-index: 100;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	clip: auto;
	padding: 12px 16px;
	background: var(--white);
}

/* Formularios que todavía no tienen a dónde enviar. */
.aviso {
	border-left: 6px solid var(--link);
	background: var(--tint);
	padding: 24px 28px;
	margin-bottom: 24px;
}

.aviso h2 { font-size: 1.35rem; }
.aviso p { margin-top: 10px; }

/* El centro de ayuda usa <details>, que funciona sin JavaScript. */
details.faq-item { padding: 0; }

.faq-item summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 16px 0;
	list-style: none;
}

.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-weight: 700; }
.faq-item[open] summary::after { content: "−"; }

/* La hoja se numera al registrar, no antes. */
.complaint-head strong { font-size: 1.2rem; }

/* Páginas genéricas, fuera de las plantillas del diseño. */
.contenido-libre { display: grid; gap: 18px; max-width: 760px; }
.contenido-libre p, .contenido-libre li { color: var(--muted); }
.contenido-libre ul { list-style: disc; padding-left: 22px; }

@media (width <= 782px) {
	.admin-bar .site-header { top: 0; }
}