/* Vanguardia · páginas internas (componentes compartidos + bloques propios de cada página) */

.crumbs { margin-bottom: clamp(20px, 3vh, 36px); }

/* ---------- FAQ: fichas con pestaña (details exclusivos) ---------- */

.faq__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 40px var(--gutter); align-items: start; }
.faq__side { position: sticky; top: 110px; }
.faq__lead { margin: 20px 0 28px; font-size: var(--step-lead); line-height: 1.35; color: var(--tinta-2); max-width: 30ch; }
.faq__stack { display: grid; }
.ficha { --tab: clamp(16px, 9vw, 140px); --c: var(--papel-2); position: relative; margin-top: 4px; }
.ficha:nth-child(3n+2) { --c: #D9DEE8; }
.ficha:nth-child(3n) { --c: var(--hielo); }
.ficha summary {
  list-style: none; cursor: pointer; position: relative;
  display: grid; gap: 6px; padding: 56px clamp(20px, 3vw, 40px) 26px;
  background: var(--c);
  clip-path: polygon(calc(var(--i) * var(--tab)) 0, calc(var(--i) * var(--tab) + 210px) 0, calc(var(--i) * var(--tab) + 240px) 30px, 100% 30px, 100% 100%, 0 100%, 0 30px, calc(var(--i) * var(--tab)) 30px);
}
.ficha summary::-webkit-details-marker { display: none; }
.ficha__tab { position: absolute; top: 6px; left: calc(var(--i) * var(--tab) + 18px); font-weight: 600; font-size: .9375rem; }
.ficha__q { font: 700 clamp(1.25rem, 1rem + .9vw, 1.75rem)/1.15 var(--f-display); letter-spacing: -.015em; padding-right: 48px; color: var(--noche); }
.ficha__q::after { content: ""; position: absolute; right: clamp(20px, 3vw, 40px); bottom: 30px; width: 22px; height: 22px; background: var(--vanguardia); clip-path: polygon(40% 0, 60% 0, 60% 40%, 100% 40%, 100% 60%, 60% 60%, 60% 100%, 40% 100%, 40% 60%, 0 60%, 0 40%, 40% 40%); transition: transform var(--d-state) var(--ease-out); }
.ficha[open] .ficha__q::after { transform: rotate(45deg); }
.ficha__a { background: var(--c); padding: 0 clamp(20px, 3vw, 40px) 36px; max-width: none; }
.ficha__a p { max-width: 60ch; }
.ficha summary:focus-visible { outline-offset: -4px; }
.on-dark .ficha { color: var(--tinta); }

/* ---------- CTA de cierre (internas): banda con la flecha gigante ---------- */
.cta-band { position: relative; overflow: hidden; background: var(--vanguardia); color: #fff; padding-block: clamp(100px, 14vw, 220px); }
.cta-band__flecha { position: absolute; right: -6vw; bottom: -18vw; width: 62vw; fill: var(--noche); opacity: .55; pointer-events: none; }
.cta-band .wrap { position: relative; }
.cta-band h2 { font-size: var(--step-giant); max-width: 9ch; }
.cta-band__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; margin-top: clamp(32px, 4vw, 56px); }

/* ---------- Lista de dos extremos (bullets flecha) ---------- */
.lista { display: grid; }
.lista li { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start; padding: 18px 0; font-size: var(--step-lead); line-height: 1.3; font-weight: 500; }
.lista .bullet { width: 26px; height: 26px; margin-top: .1em; }
.lista .bullet path { fill: none; stroke: var(--ambar-2); stroke-width: 34; stroke-linejoin: miter; }
.on-dark .lista .bullet path { stroke: var(--ambar); }
.lista small { display: block; font-size: var(--step-body); font-weight: 400; color: var(--tinta-2); margin-top: 4px; }
.on-dark .lista small { color: var(--hielo); }

/* =========================================================
   RECAUDACIÓN DE EVENTOS
   ========================================================= */
.r-hero { position: relative; min-height: 100svh; padding: 120px var(--gutter) clamp(48px, 8vh, 96px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; overflow: hidden; }
.r-hero__copy { grid-column: 1 / span 6; position: relative; z-index: 2; }
.r-hero h1 { font-size: var(--step-hero); color: var(--noche); }
.r-hero__lead { margin-top: 24px; max-width: 36ch; font-size: var(--step-lead); line-height: 1.35; color: var(--tinta-2); }
.r-hero__actions { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; }
.r-hero__shape {
  position: absolute; right: -12vw; top: 0; bottom: 0; width: 64vw;
  clip-path: polygon(38% 0, 100% 0, 100% 100%, 0 100%);
  background: var(--noche);
}
.r-hero__shape img { width: 100%; height: 100%; object-fit: cover; }

.r-hace { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); }
.r-hace__copy { grid-column: 1 / span 6; }
.r-hace__copy h2 { margin-bottom: clamp(32px, 4vw, 56px); }
.r-hace__media { grid-column: 8 / -1; position: sticky; top: 110px; align-self: start; aspect-ratio: 3 / 4; overflow: hidden; }
.r-hace__media img { width: 100%; height: 118%; object-fit: cover; }

.r-show { position: relative; height: 110svh; overflow: hidden; display: flex; align-items: center; }
.r-show__media { position: absolute; inset: -12% 0; }
.r-show__media img { width: 100%; height: 100%; object-fit: cover; }
.r-show__text { position: relative; z-index: 1; color: #fff; font: 800 clamp(3rem, 1rem + 8vw, 10rem)/.9 var(--f-display); letter-spacing: -.045em; max-width: 9ch; }
.r-show::after { content: ""; position: absolute; inset: 0; background: rgba(6, 22, 52, .62); }
.r-show .wrap { position: relative; z-index: 1; }

.r-etapas__head { margin-bottom: clamp(40px, 5vw, 80px); }
.r-etapas__stack { display: grid; gap: 0; }
.etapa {
  position: sticky; top: calc(96px + var(--k) * 28px);
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--gutter); align-items: end;
  min-height: 46vh; padding: clamp(28px, 4vw, 64px);
  background: var(--bg); color: var(--fg); clip-path: var(--clip-cut);
  margin-bottom: 4vh;
}
.etapa h3 { font-size: clamp(3rem, 1rem + 6vw, 8.5rem); }
.etapa__head { display: grid; gap: 18px; align-content: end; }
.etapa__ico { display: grid; place-items: center; width: 60px; height: 60px; background: var(--ambar); clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); }
.etapa__ico svg { width: 32px; height: 32px; fill: var(--noche); }
.etapa__body p { font-size: var(--step-lead); line-height: 1.35; max-width: 34ch; }
.etapa__body ul { margin-top: 20px; display: grid; gap: 8px; list-style: none; padding: 0; }
.etapa__body li { display: flex; align-items: center; gap: 12px; font-weight: 600; }
.etapa__body li::before { content: ""; width: 14px; height: 14px; flex: none; background: currentColor; opacity: .55; clip-path: polygon(0 0, 70% 0, 100% 30%, 100% 100%, 30% 100%, 0 70%); }

/* =========================================================
   EVENTOS DEPORTIVOS
   ========================================================= */
.d-hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; padding: 120px var(--gutter) clamp(48px, 9vh, 110px); overflow: hidden; color: #fff; }
.d-hero__media { position: absolute; inset: 0; }
.d-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.d-hero__media::after { content: ""; position: absolute; inset: 0; background: rgba(6, 22, 52, .5); }
.d-hero__copy { position: relative; z-index: 1; max-width: var(--max); width: 100%; margin-inline: auto; }
.d-hero h1 { font-size: var(--step-giant); max-width: 11ch; }
.d-hero h1 .w { display: inline-block; }
.d-hero__lead { margin-top: 24px; max-width: 40ch; font-size: var(--step-lead); line-height: 1.35; }
.d-hero__actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; }
.d-hero .crumbs { color: var(--hielo); }

.tablero { background: var(--noche); color: #fff; padding-block: clamp(96px, 12vw, 180px); }
.tablero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gutter); align-items: end; }
.tablero h2 { grid-column: 1 / span 5; }
.tablero__board { grid-column: 6 / -1; }
.flap { display: flex; flex-wrap: wrap; gap: 6px; font: 800 clamp(2.2rem, 1rem + 4.6vw, 6rem)/1 var(--f-display); }
.flap__c { display: inline-grid; place-items: center; width: .82em; height: 1.16em; background: #0E2552; color: var(--ambar); clip-path: var(--clip-cut-sm); }
.flap__c:empty { background: #0B1E44; }
.tablero__note { margin-top: 24px; color: var(--hielo); }

.d-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(16px, 2vw, 32px) var(--gutter); }
.d-grid h2 { grid-column: 1 / span 6; margin-bottom: clamp(24px, 3vw, 48px); }
.d-card { position: relative; }
.d-card__media { overflow: hidden; background: var(--noche); }
.d-card__media img { width: 100%; height: 100%; object-fit: cover; }
.d-card h3 { font-size: clamp(1.6rem, 1rem + 1.8vw, 2.8rem); margin-top: 18px; }
.d-card p { margin-top: 8px; color: var(--tinta-2); max-width: 36ch; }
.d-card--a { grid-column: 1 / span 7; }
.d-card--a .d-card__media { aspect-ratio: 16 / 10; }
.d-card--b { grid-column: 9 / -1; margin-top: 18vh; }
.d-card--b .d-card__media { aspect-ratio: 3 / 4; }
.d-card--c { grid-column: 2 / span 4; margin-top: -6vh; }
.d-card--c .d-card__media { aspect-ratio: 4 / 5; }
.d-card--d { grid-column: 7 / -1; margin-top: 8vh; }
.d-card--d .d-card__media { aspect-ratio: 16 / 9; }
.d-card--e { grid-column: 3 / span 6; margin-top: 4vh; }
.d-card--e .d-card__media { aspect-ratio: 21 / 9; }

/* =========================================================
   TICKETERA
   ========================================================= */
.t-hero { min-height: 100svh; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; padding: 120px var(--gutter) 64px; background: var(--noche); color: #fff; overflow: hidden; }
.t-hero__copy { grid-column: 1 / span 6; }
.t-hero h1 { font-size: var(--step-hero); }
.t-hero__lead { margin-top: 24px; max-width: 36ch; font-size: var(--step-lead); line-height: 1.35; color: var(--hielo); }
.t-hero__brand { margin-top: 28px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; color: var(--hielo); font-size: .95rem; }
.t-hero__brand img { height: 28px; width: auto; }
.entrada__brand { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.entrada__brand img { height: 16px; width: auto; }
.t-hero__actions { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; }
.t-hero__stage { grid-column: 8 / -1; perspective: 1400px; display: grid; place-items: center; }
.entrada {
  width: min(380px, 80vw); background: var(--papel); color: var(--tinta);
  clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
  transform-style: preserve-3d; will-change: transform;
}
.entrada__top { background: var(--vanguardia); color: #fff; padding: 22px 24px; }
.entrada__top p:first-child { font: 800 1.6rem/1 var(--f-display); letter-spacing: -.02em; }
.entrada__top p + p { margin-top: 10px; color: var(--hielo); font-size: .875rem; }
.entrada__body { padding: 22px 24px 26px; display: grid; gap: 16px; }
.entrada__row { display: flex; justify-content: space-between; gap: 12px; font-size: .95rem; }
.entrada__row b { display: block; font: 700 1.15rem/1.1 var(--f-display); }
.entrada__qr { position: relative; width: 100%; aspect-ratio: 1; background: #fff; padding: 14px; overflow: hidden; }
.entrada__scan { position: absolute; left: 6px; right: 6px; top: 8%; height: 4px; background: var(--ambar); opacity: 0; }
.entrada__qr svg { width: 100%; height: 100%; }
.entrada__foot { display: flex; justify-content: space-between; align-items: center; font-size: .875rem; color: var(--tinta-2); }

.t-flujo { position: relative; }
.t-flujo__pin { min-height: 100svh; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; padding-block: 110px 60px; }
.t-flujo__copy { grid-column: 1 / span 5; }
.t-flujo__steps { margin-top: 32px; display: grid; gap: 4px; }
.t-flujo__steps li { font: 800 clamp(1.8rem, 1rem + 2.4vw, 3.6rem)/1.05 var(--f-display); letter-spacing: -.03em; color: #7C869A; transition: color var(--d-state) var(--ease-out); }
.t-flujo__steps li.is-on { color: var(--noche); }
.t-flujo__screens { grid-column: 7 / span 5; position: relative; height: min(74vh, 680px); aspect-ratio: 9 / 16; justify-self: center; overflow: hidden; }
.pantalla { position: absolute; inset: 0; background: #fff; color: var(--tinta); padding: 26px 22px; display: flex; flex-direction: column; gap: 14px; clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px)); }
.pantalla + .pantalla { transform: translateX(110%); }
.pantalla__bar { display: flex; justify-content: space-between; font-size: .875rem; color: var(--tinta-2); }
.pantalla h3 { font-size: 1.7rem; }
.pantalla__opt { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; background: var(--papel); font-weight: 600; }
.pantalla__opt.is-sel { background: var(--hielo); }
.pantalla__opt span:last-child { font-variant-numeric: tabular-nums; }
.pantalla__btn { margin-top: auto; background: var(--ambar); color: var(--noche); text-align: center; padding: 16px; font: 700 1.05rem/1 var(--f-display); }
.pantalla__qr { width: 70%; margin: 6px auto; aspect-ratio: 1; }
.pantalla__ok { font: 800 1.4rem/1.1 var(--f-display); color: var(--vanguardia); text-align: center; }

.t-panel { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 40px; align-items: center; }
.t-panel__copy { grid-column: 1 / span 5; }
.t-panel__copy h2 { margin-bottom: 32px; }
.panel { grid-column: 7 / -1; background: #fff; color: var(--tinta); padding: clamp(20px, 2.4vw, 36px); clip-path: var(--clip-cut); }
.panel__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.panel__head p:first-child { font: 800 1.5rem/1 var(--f-display); }
.panel__tag { font-size: .875rem; background: var(--ambar); padding: 4px 8px; font-weight: 600; }
.panel__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 24px 0; }
.panel__kpis div { background: var(--papel); padding: 14px; }
.panel__kpis dt { font-size: .875rem; color: var(--tinta-2); }
.panel__kpis dd { font: 800 clamp(1.3rem, 1rem + 1vw, 2rem)/1.1 var(--f-display); font-variant-numeric: tabular-nums; margin-top: 4px; }
.panel table { width: 100%; border-collapse: collapse; font-size: .95rem; font-variant-numeric: tabular-nums; }
.panel th { text-align: left; font-weight: 600; color: var(--tinta-2); padding: 8px 0; border-bottom: 2px solid var(--noche); }
.panel td { padding: 10px 0; border-bottom: 1px solid #D9DEE8; }
.panel td:last-child, .panel th:last-child { text-align: right; }
.sector-bar { display: block; height: 8px; background: var(--vanguardia); transform-origin: left; margin-top: 6px; }

/* =========================================================
   COBROS Y PAGOS
   ========================================================= */
.c-hero { min-height: 92svh; padding: 140px var(--gutter) clamp(48px, 8vh, 96px); display: flex; flex-direction: column; justify-content: flex-end; background: var(--papel); overflow: hidden; }
.c-hero h1 { font-size: clamp(3.4rem, 0.6rem + 8.6vw, 11rem); color: var(--noche); }
.c-hero h1 .line { padding-bottom: .04em; }
.c-hero__row { margin-top: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; }
.c-hero__lead { grid-column: 1 / span 5; font-size: var(--step-lead); line-height: 1.35; color: var(--tinta-2); }
.c-hero__actions { grid-column: 7 / -1; padding-right: 80px; display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; justify-content: flex-end; }
.c-hero__flecha { width: clamp(56px, 7vw, 110px); height: auto; fill: var(--ambar-2); display: inline-block; vertical-align: baseline; margin-left: .1em; }

.cye__title { margin-bottom: clamp(40px, 5vw, 72px); }
.cye { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 3vw, 48px) var(--gutter); }
.cye__item:nth-child(2) { margin-top: clamp(40px, 8vw, 120px); }
.cye__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--noche); }
.cye__media img { width: 100%; height: 100%; object-fit: cover; }
.cye__ico { position: absolute; left: 0; bottom: 0; width: clamp(64px, 6vw, 88px); height: clamp(64px, 6vw, 88px); display: grid; place-items: center; background: var(--ambar); clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.cye__ico svg { width: 52%; height: 52%; fill: var(--noche); }
.cye__item h3 { margin-top: 22px; font-size: clamp(1.8rem, 1rem + 2vw, 3rem); color: var(--noche); }
.cye__item > p { margin-top: 12px; font-size: var(--step-lead); line-height: 1.35; max-width: 40ch; }
.cye__list { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; }
.cye__list li { padding: 10px 14px; background: var(--papel-2); font-weight: 600; font-size: .95rem; clip-path: var(--clip-cut-sm); }
.medios { background: var(--noche); color: #fff; padding-block: clamp(80px, 10vw, 140px); overflow: hidden; }
.medios h2 { margin-bottom: clamp(32px, 4vw, 60px); }
.medios__row { display: flex; width: max-content; gap: 14px; }
.medio { display: flex; align-items: center; gap: 18px; padding: 26px 34px; background: #0B1E44; clip-path: var(--clip-cut-sm); font: 800 clamp(1.6rem, 1rem + 2vw, 3rem)/1 var(--f-display); letter-spacing: -.02em; white-space: nowrap; }
.medio img { width: 120px; height: 80px; object-fit: cover; }
.medios__logos { margin-top: clamp(28px, 4vw, 48px); }
.medios__logos .mp { background: #0B1E44; color: #fff; min-height: 60px; padding: 0 22px; font-size: 1.05rem; }
.medios__logos .mp svg, .medios__logos .medio-badge { width: 32px; height: 32px; }
.medios__logos .mp--visa svg { width: 44px; }

.c-conc { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 40px; }
.c-conc__copy { grid-column: 1 / span 4; }
.c-conc__copy h2 { margin-bottom: 24px; }
.c-conc__table { grid-column: 6 / -1; background: #fff; padding: clamp(20px, 2.4vw, 36px); clip-path: var(--clip-cut); overflow-x: auto; }
.c-conc__table table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: .98rem; min-width: 520px; }
.c-conc__table caption { text-align: left; font: 800 1.4rem/1 var(--f-display); margin-bottom: 18px; }
.c-conc__table th { text-align: left; font-weight: 600; color: var(--tinta-2); padding: 10px 8px 10px 0; border-bottom: 2px solid var(--noche); }
.c-conc__table td { padding: 14px 8px 14px 0; border-bottom: 1px solid #D9DEE8; }
.c-conc__table td:nth-child(3), .c-conc__table th:nth-child(3) { text-align: right; }
.estado { display: inline-block; padding: 4px 10px; font-weight: 600; font-size: .875rem; background: var(--papel-2); }
.estado.is-ok { background: var(--vanguardia); color: #fff; }

.c-incluye { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); }
.c-incluye__side { grid-column: 1 / span 5; }
.c-incluye__media { margin-top: 32px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--vanguardia); }
.c-incluye__media img { width: 100%; height: 100%; object-fit: cover; }
.c-incluye .lista { grid-column: 7 / -1; }

/* =========================================================
   NOSOTROS
   ========================================================= */
.n-hero { padding-top: 130px; overflow: hidden; }
.n-hero__copy { padding-inline: var(--gutter); margin-bottom: clamp(32px, 5vw, 72px); }
.n-hero h1 { font-size: var(--step-hero); color: var(--noche); }
.n-hero__media { height: 88svh; overflow: hidden; background: #e9e9e7; }
.n-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 45%; }
.n-nombre { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 32px; align-items: end; }
.n-nombre__word { grid-column: 1 / -1; font: 800 var(--step-giant)/.86 var(--f-display); letter-spacing: -.05em; color: var(--vanguardia); }
.n-nombre > p:not(.n-nombre__word) { grid-column: 7 / span 5; font-size: var(--step-lead); line-height: 1.4; }
.n-hace__title { margin-bottom: clamp(40px, 5vw, 72px); }
.n-hace { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 3vw, 48px) var(--gutter); }
.n-hace li:nth-child(even) { margin-top: clamp(48px, 9vw, 140px); }
.n-hace a { display: grid; gap: 10px; text-decoration: none; }
.n-hace__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--noche); }
.n-hace__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out); }
.n-hace a:hover .n-hace__media img { transform: scale(1.06); }
.n-hace__name { margin-top: 10px; font: 800 clamp(1.6rem, 1rem + 1.8vw, 2.8rem)/1 var(--f-display); letter-spacing: -.03em; color: var(--noche); }
.n-hace__desc { color: var(--tinta-2); max-width: 40ch; }
.n-para__list { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .35em; margin-top: clamp(32px, 4vw, 56px); font: 800 clamp(2.4rem, 1rem + 5.4vw, 7rem)/1.02 var(--f-display); letter-spacing: -.045em; color: var(--noche); }
.n-para__list li { display: inline-flex; align-items: center; }
.n-para__list li:not(:last-child)::after {
  content: ""; width: .38em; height: .38em; margin-left: .35em; background: var(--ambar-2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='800 140 345 345'%3E%3Cpath d='M1131 154 L918 248 L976 279 L723 629 L646 680 L724 792 L1046 353 L1084 397 Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='800 140 345 345'%3E%3Cpath d='M1131 154 L918 248 L976 279 L723 629 L646 680 L724 792 L1046 353 L1084 397 Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.principios__list { display: grid; }
.principio { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: baseline; padding-block: clamp(28px, 4vw, 56px); }
.principio h3 { grid-column: 1 / span 6; font-size: var(--step-head); }
.principio p { grid-column: 8 / -1; font-size: var(--step-lead); line-height: 1.35; color: var(--hielo); }

/* =========================================================
   CONTACTO
   ========================================================= */
.k-hero { padding: 140px var(--gutter) clamp(40px, 6vw, 80px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; }
.k-hero h1 { grid-column: 1 / span 8; font-size: var(--step-hero); color: var(--noche); }
.k-hero p { grid-column: 9 / -1; font-size: var(--step-lead); line-height: 1.35; color: var(--tinta-2); }
.k-wrap { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 56px; padding-bottom: var(--section); }
.form { grid-column: 1 / span 8; display: grid; gap: clamp(36px, 4vw, 56px); }
.form fieldset { border: 0; padding: 0; min-width: 0; }
.form legend, .form .lbl { font: 800 clamp(1.4rem, 1rem + 1.2vw, 2.1rem)/1.1 var(--f-display); letter-spacing: -.02em; color: var(--noche); margin-bottom: 18px; padding: 0; }
.form .req { color: var(--ambar-2); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 22px; background: var(--papel-2); font-weight: 600; clip-path: var(--clip-cut-sm); transition: background-color var(--d-micro), color var(--d-micro), transform var(--d-micro) var(--ease-out); }
.chip input:checked + span { background: var(--noche); color: #fff; }
.chip input:checked + span::before { content: ""; width: 12px; height: 12px; background: var(--ambar); clip-path: polygon(0 0, 70% 0, 100% 30%, 100% 100%, 30% 100%, 0 70%); }
.chip input:focus-visible + span { outline: 3px solid var(--luz); outline-offset: 2px; clip-path: none; }
.chip:active span { transform: scale(.96); }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 28px var(--gutter); }
.field { display: grid; gap: 8px; }
.field label { font-weight: 600; }
.field input, .field textarea, .field select { width: 100%; border: 0; border-bottom: 3px solid var(--noche); background: transparent; padding: 10px 0; font: 600 1.25rem/1.3 var(--f-text); border-radius: 0; }
.field textarea { min-height: 120px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; border-color: var(--luz); }
.field.is-error input, .field.is-error textarea { border-color: #B3261E; }
.err { color: #B3261E; font-weight: 600; font-size: .95rem; min-height: 1.2em; }
.form__send { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.form__ok { padding: clamp(28px, 3vw, 48px); background: var(--noche); color: #fff; clip-path: var(--clip-cut); }
.form__ok h2 { font-size: var(--step-head); margin-bottom: 16px; }
.k-side { grid-column: 10 / -1; align-self: start; position: sticky; top: 110px; display: grid; gap: 28px; }
.k-side__mail { padding: 28px; background: var(--vanguardia); color: #fff; clip-path: var(--clip-cut); scroll-margin-top: 100px; }
.k-side__mail h2 { font-size: clamp(1.6rem, 1rem + 1.4vw, 2.4rem); margin-bottom: 12px; }
.k-side__mail .btn { margin-top: 18px; }

/* =========================================================
   404 + créditos
   ========================================================= */
.e404 { min-height: 100svh; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; padding: 120px var(--gutter) 64px; background: var(--noche); color: #fff; overflow: hidden; }
.e404__copy { grid-column: 1 / span 6; }
.e404 h1 { font-size: var(--step-hero); }
.e404 p { margin: 24px 0 36px; font-size: var(--step-lead); color: var(--hielo); max-width: 30ch; }
.e404__flecha { grid-column: 8 / span 4; width: 100%; max-width: 360px; fill: var(--ambar); justify-self: center; }
.creditos table { width: 100%; border-collapse: collapse; }
.creditos th, .creditos td { text-align: left; padding: 14px 12px 14px 0; border-bottom: 1px solid #D9DEE8; vertical-align: top; }

/* ---------- Tablet / móvil ---------- */
@media (max-width: 1023px) {
  .r-hero { grid-template-columns: 1fr; align-content: end; padding-top: 0; min-height: 100svh; }
  .r-hero__shape { position: relative; grid-row: 1; right: auto; width: calc(100% + var(--gutter) * 2); margin: 0 calc(var(--gutter) * -1) 28px; height: 46svh; clip-path: polygon(0 0, 100% 0, 100% 72%, 0 100%); }
  .r-hero__copy { grid-column: 1; }
  .r-hace { grid-template-columns: 1fr; }
  .r-hace__copy, .r-hace__media { grid-column: 1; position: static; }
  .r-hace__media { aspect-ratio: 4 / 3; margin-top: 24px; }
  .r-show { height: 76svh; }
  .faq__grid { grid-template-columns: 1fr; }
  .faq__side { position: static; }
  .etapa { grid-template-columns: 1fr; min-height: 0; top: calc(72px + var(--k) * 16px); }
  .tablero__grid, .d-grid, .t-panel, .c-conc, .c-incluye, .n-nombre, .k-hero, .k-wrap, .t-hero, .t-flujo__pin, .e404 { grid-template-columns: 1fr; }
  .tablero__grid > *, .d-grid > *, .t-panel > *, .c-conc > *, .c-incluye > *, .n-nombre > *, .k-hero > *, .k-wrap > *, .t-hero > *, .t-flujo__pin > *, .e404 > * { grid-column: 1 !important; }
  .d-card { margin-top: 0 !important; }
  .d-card--b, .d-card--c { width: 82%; }
  .d-card--c { margin-left: auto; }
  .t-hero { padding-top: 96px; row-gap: 48px; }
  .t-hero__stage { order: -1; }
  .entrada { width: min(320px, 76vw); }
  .t-flujo__pin { min-height: 0; padding-block: 72px; }
  .t-flujo__screens { width: min(320px, 80vw); height: auto; margin-top: 32px; justify-self: start; }
  .c-hero { min-height: 84svh; padding-top: 110px; }
  .c-hero__row { grid-template-columns: 1fr; row-gap: 24px; }
  .c-hero__lead, .c-hero__actions { grid-column: 1; justify-content: flex-start; padding-right: 0; }
  .c-hero__actions .btn { flex: 1 1 100%; justify-content: center; }
  .principio { grid-template-columns: 1fr; row-gap: 12px; }
  .n-hace { grid-template-columns: 1fr; }
  .n-hace li:nth-child(even) { margin-top: 0; }
  .principio h3, .principio p { grid-column: 1; }
  .k-hero { padding-top: 104px; row-gap: 20px; }
  .fields { grid-template-columns: 1fr; }
  .k-side { position: static; }
  .ficha { --tab: 7vw; }
  .ficha summary { clip-path: polygon(calc(var(--i) * var(--tab)) 0, calc(var(--i) * var(--tab) + 130px) 0, calc(var(--i) * var(--tab) + 158px) 30px, 100% 30px, 100% 100%, 0 100%, 0 30px, calc(var(--i) * var(--tab)) 30px); }
  .cta-band__flecha { width: 110vw; bottom: -40vw; right: -30vw; }
  .cye { grid-template-columns: 1fr; }
  .cye__item:nth-child(2) { margin-top: 0; }
  /* Conciliación en móvil: cada fila es una ficha, sin scroll de costado */
  .c-conc__table { overflow: visible; padding: 22px 18px; }
  .c-conc__table table { min-width: 0; }
  .c-conc__table caption { font-size: 1.25rem; margin-bottom: 8px; }
  .c-conc__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .c-conc__table tbody, .c-conc__table tr, .c-conc__table td { display: block; }
  .c-conc__table tr { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 14px 0; border-bottom: 1px solid #D9DEE8; }
  .c-conc__table td { padding: 0; border: 0; }
  .c-conc__table td:nth-child(1) { font-weight: 700; font-size: 1.05rem; }
  .c-conc__table td:nth-child(2) { grid-row: 2; color: var(--tinta-2); font-size: .95rem; }
  .c-conc__table td:nth-child(3) { grid-column: 2; grid-row: 1; text-align: right; font-weight: 700; }
  .c-conc__table td:nth-child(4) { grid-column: 2; grid-row: 2; text-align: right; }
  /* Mockup de Nosotros: encuadre que muestra el logo completo */
  .n-hero__media { height: auto; aspect-ratio: 4 / 3; }
  .n-hero__media img { object-position: 50% 50%; }
  .e404__flecha { max-width: 180px; order: -1; justify-self: start; }
}

/* =========================================================
   TRASLADO DE VALORES
   ========================================================= */
.tv-hero { min-height: 100svh; display: flex; align-items: center; padding: 120px 0 clamp(48px, 6vw, 96px); overflow: hidden; }
.tv-hero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; }
.tv-hero__copy { grid-column: 1 / span 6; }
.tv-hero h1 { font-size: clamp(3.25rem, 1rem + 5.4vw, 7.5rem); color: var(--noche); }
.tv-hero__lead { margin-top: 24px; max-width: 42ch; font-size: var(--step-lead); line-height: 1.35; color: var(--tinta-2); }
.tv-hero__actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: center; }
.tv-hero__ruta { grid-column: 7 / -1; margin-right: calc(var(--gutter) * -1); }
.tv-hero__ruta .camion { width: 100%; max-width: 1180px; height: auto; margin-inline: auto; overflow: visible; }
.tv-pasos__title { margin-bottom: clamp(32px, 4vw, 56px); }
.tv-pasos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); list-style: none; padding: 0; counter-reset: paso; }
.tv-paso { padding: clamp(22px, 2.4vw, 36px); background: var(--papel-2); clip-path: var(--clip-cut); min-height: 280px; display: flex; flex-direction: column; }
.tv-paso:nth-child(3) { background: var(--vanguardia); color: #fff; }
.tv-paso:nth-child(4) { background: var(--noche); color: #fff; }
.tv-paso__ico { display: grid; place-items: center; width: 60px; height: 60px; background: var(--ambar); clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); }
.tv-paso__ico svg { width: 32px; height: 32px; fill: var(--noche); }
.tv-paso h3 { margin-top: auto; padding-top: 28px; font-size: clamp(1.6rem, 1rem + 1.4vw, 2.4rem); }
.tv-paso p { margin-top: 10px; line-height: 1.4; }
.tv-para { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 40px; align-items: center; }
.tv-para__media { grid-column: 1 / span 6; aspect-ratio: 4 / 3; overflow: hidden; background: var(--noche); }
.tv-para__media img { width: 100%; height: 100%; object-fit: cover; }
.tv-para__copy { grid-column: 8 / -1; }
.tv-para__copy h2 { margin-bottom: 24px; }
.tv-banda { position: relative; min-height: 80svh; display: flex; align-items: center; overflow: hidden; }
.tv-banda__media { position: absolute; inset: -10% 0; }
.tv-banda__media img { width: 100%; height: 100%; object-fit: cover; }
.tv-banda::after { content: ""; position: absolute; inset: 0; background: rgba(6, 22, 52, .62); }
.tv-banda .wrap { position: relative; z-index: 1; }
.tv-banda__text { color: #fff; font-size: clamp(2.4rem, 1rem + 5vw, 6.5rem); line-height: .95; max-width: 14ch; }
@media (max-width: 1023px) {
  .tv-hero { min-height: 0; display: block; padding-top: 100px; }
  .tv-hero__grid, .tv-para { grid-template-columns: 1fr; }
  .tv-hero__copy, .tv-hero__ruta, .tv-para__media, .tv-para__copy { grid-column: 1; }
  .tv-hero__actions .btn { flex: 1 1 100%; justify-content: center; }
  .tv-hero__ruta { margin: 40px 0 0; }
  .tv-pasos { grid-template-columns: 1fr 1fr; }
  .tv-paso { min-height: 220px; }
  .tv-banda { min-height: 60svh; }
}
@media (max-width: 639px) { .tv-pasos { grid-template-columns: 1fr; } .tv-paso { min-height: 0; } }