.neon-hero {
position: relative;
background: var(--ink-900);
color: var(--text-inv);
overflow: hidden;
padding-block: clamp(2rem, 1.4rem + 3vw, 4rem);
}
.neon-hero::before {
content: "";
position: absolute;
inset: -30% -10% auto -10%;
height: 80%;
background:
radial-gradient(50% 60% at 20% 40%, rgba(255, 79, 163, 0.30), transparent 70%),
radial-gradient(45% 55% at 85% 15%, rgba(90, 210, 255, 0.20), transparent 70%);
filter: blur(10px);
pointer-events: none;
}
.neon-hero__rejilla {
position: relative;
display: grid;
gap: var(--sp-5);
align-items: center;
}
@media (min-width: 62rem) {
.neon-hero__rejilla { grid-template-columns: 1fr 1fr; gap: var(--sp-7); }
}
.neon-hero h1 { color: var(--text-inv); margin-bottom: var(--sp-4); }
.neon-hero h1 em { font-style: normal; color: var(--accent); }
.neon-hero__entrada {
font-size: var(--fs-lg);
color: var(--text-inv-2);
max-width: 34rem;
margin-bottom: var(--sp-5);
}
.neon-hero__acciones { margin-bottom: var(--sp-5); }
.neon-hero__acciones .boton { width: 100%; }
@media (min-width: 30rem) { .neon-hero__acciones .boton { width: auto; } }
.neon-hero__confianza { padding-top: var(--sp-5); border-top: 1px solid rgba(255, 255, 255, 0.16); }
.neon-hero__confianza li { color: var(--text-inv); }
@media (max-width: 61.99rem) {
}
.neon-config { scroll-margin-top: 4.5rem; }
.editor { display: block; }
.editor > .editor__visual { margin-bottom: var(--sp-5); }
@media (min-width: 66rem) {
.editor {
display: grid;
grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
gap: var(--sp-7);
align-items: start;
}
.editor > .editor__visual { margin-bottom: 0; }
}
.editor__visual {
position: sticky;
z-index: 3;
top: 4.25rem;
background: var(--paper);
padding-bottom: var(--sp-3);
}
@media (min-width: 66rem) {
.editor__visual {
top: 5.25rem;
padding-bottom: 0;
max-height: calc(100vh - 6.5rem);
overflow-y: auto;
scrollbar-width: thin;
}
}
@media (max-height: 34rem) {
.editor__visual { position: static; }
}
.escenario { position: relative; }
.neon-lienzo {
position: relative;
display: grid;
place-items: center;
width: 100%;
aspect-ratio: 5 / 3;
padding: var(--sp-3);
border-radius: var(--r-2);
overflow: hidden;
background:
radial-gradient(120% 120% at 50% 30%, #1d2230 0%, #0a0c11 70%),
var(--ink-900);
box-shadow: var(--shadow-3);
--neon-color: #ffd9a8;
transition: background var(--dur) var(--ease);
}
.neon-lienzo__placeholder {
position: absolute;
z-index: 2;
inset: 50% auto auto 50%;
width: max-content;
max-width: calc(100% - 2rem);
margin: 0;
padding: 0.55rem 0.9rem;
transform: translate(-50%, -50%);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 999px;
background: rgba(10, 12, 17, 0.62);
color: rgba(255, 255, 255, 0.82);
font-size: var(--fs-sm);
font-weight: 700;
text-align: center;
pointer-events: none;
}
.neon-lienzo__placeholder[hidden] { display: none; }
.escenario[data-contenido="false"] .escenario__controles,
.escenario[data-contenido="false"] .escenario__vistas { display: none; }
@media (max-width: 65.99rem) {
.editor__visual {
position: static;
top: auto;
z-index: auto;
}
.editor__visual .neon-lienzo {
width: 100%;
height: auto;
max-width: 100%;
aspect-ratio: 5 / 3;
margin-inline: auto;
padding: var(--sp-2);
}
}
.neon-lienzo::before {
content: "";
position: absolute;
inset: 0;
background-image:
repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 26px),
repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.028) 0 1px, transparent 1px 58px);
pointer-events: none;
}
.neon-lienzo[data-encendido="false"] {
background:
radial-gradient(120% 120% at 50% 30%, #2a2f3b 0%, #141821 70%),
var(--ink-800);
}
.neon-escena {
position: relative;
z-index: 1;
display: block;
width: 100%;
height: 100%;
}
.neon-escena text { font-variant-numeric: tabular-nums; }
.neon-escena [data-neon-cotas] { opacity: 0.75; }
.neon-lienzo[data-encendido="false"] .neon-escena [data-neon-cotas] { opacity: 0.5; }
.escenario__aviso--atencion {
padding: var(--sp-2) var(--sp-3);
border-radius: var(--r-1);
background: var(--warn-bg);
color: var(--warn);
font-weight: 700;
}
.escenario__aviso {
margin: var(--sp-2) 0 0;
font-size: var(--fs-xs);
font-weight: 700;
color: var(--text-2);
text-align: center;
}
.escenario__controles {
position: absolute;
right: var(--sp-3);
bottom: var(--sp-3);
z-index: 2;
display: flex;
gap: var(--sp-2);
}
.escenario__boton {
border: 1px solid rgba(255, 255, 255, 0.28);
background: rgba(10, 12, 17, 0.6);
backdrop-filter: blur(6px);
color: #fff;
border-radius: var(--r-full);
padding: 0.4rem 0.85rem;
font-family: inherit;
font-size: var(--fs-xs);
font-weight: 800;
letter-spacing: 0.06em;
text-transform: uppercase;
cursor: pointer;
min-height: 2.25rem;
}
.escenario__boton:hover { background: rgba(10, 12, 17, 0.85); }
.escenario__pie {
margin: var(--sp-2) 0 0;
font-size: var(--fs-xs);
color: var(--text-2);
text-align: center;
}
.resumen-vivo {
list-style: none;
margin: var(--sp-3) 0 0;
padding: 0;
font-size: var(--fs-xs);
color: var(--text-2);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
justify-content: center;
}
.precio-vivo {
margin-top: var(--sp-3);
padding: var(--sp-4);
border-radius: var(--r-2);
background: var(--ink-900);
color: var(--text-inv);
display: grid;
gap: var(--sp-2);
}
.precio-vivo__etiqueta {
margin: 0;
font-size: var(--fs-xs);
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-inv-2);
}
.precio-vivo__cifra {
margin: 0;
font-size: clamp(1.9rem, 1.4rem + 2.4vw, 3rem);
font-weight: 800;
letter-spacing: -0.045em;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.precio-vivo__sin-iva,
.precio-vivo .boton { margin-top: var(--sp-2); }
.precio-vivo__avisos { display: grid; gap: var(--sp-2); }
.precio-vivo__avisos:empty { display: none; }
.precio-vivo__avisos .nota { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.14); color: var(--text-inv-2); }
.precio-vivo__avisos .nota--ok { background: rgba(56, 240, 212, 0.10); border-color: rgba(56, 240, 212, 0.25); color: var(--neon); }
.precio-vivo__ayuda { margin: 0; font-size: var(--fs-xs); color: var(--text-inv-2); }
.precio-vivo__ayuda a { color: var(--text-inv); font-weight: 700; }
@media (max-width: 65.99rem) {
.editor__visual { padding-bottom: var(--sp-2); }
.editor__visual .escenario { display: grid; justify-items: center; }
.editor__visual .escenario__controles {
position: static;
margin-top: var(--sp-1);
justify-content: center;
gap: var(--sp-2);
}
.editor__visual .escenario__boton {
padding: 0.4rem 0.85rem;
font-size: 0.66rem;
min-height: 2rem;
}
.editor__visual .escenario__vistas {
position: static;
margin-top: var(--sp-1);
background: var(--paper-2);
order: 3;
}
.editor__visual .escenario__vista {
color: var(--text-2);
padding: 0.35rem 0.75rem;
font-size: 0.66rem;
}
.editor__visual .escenario__vista[aria-pressed="true"] {
background: var(--accent-050);
color: var(--accent-700);
}
.editor__visual .precio-vivo__ayuda,
.editor__visual .escenario__pie .pie__extra { display: none; }
.editor__visual .incluido { margin-top: var(--sp-2); }
.editor__visual .incluido > summary {
padding: 0.15rem 0;
min-height: 1.9rem;
font-size: 0.7rem;
}
.editor__visual .incluido__iconos svg { width: 0.9rem; height: 0.9rem; }
.editor__visual .precio-vivo__plazo { margin-top: 0.15rem; }
.editor__visual .plazo__principal { font-size: var(--fs-sm); }
.editor__visual .plazo__detalle { font-size: 0.62rem; }
.editor__visual .precio-vivo__sin-iva { font-size: var(--fs-xs); }
.escenario__pie {
margin-top: var(--sp-1);
font-size: 0.68rem;
line-height: 1.3;
}
.resumen-vivo {
margin-top: var(--sp-2);
padding-inline: var(--sp-2);
white-space: normal;
overflow: visible;
text-overflow: clip;
text-align: center;
line-height: 1.45;
overflow-wrap: anywhere;
}
.precio-vivo {
margin-top: var(--sp-2);
padding: var(--sp-2) var(--sp-4) var(--sp-3);
grid-template-columns: auto 1fr;
align-items: baseline;
gap: 0 var(--sp-3);
}
.precio-vivo__etiqueta { grid-column: 1 / -1; font-size: 0.62rem; text-align: center; }
.precio-vivo__cifra { font-size: 1.75rem; }
.precio-vivo__sin-iva { text-align: right; font-size: var(--fs-xs); }
.precio-vivo__plazo,
.precio-vivo .incluido { grid-column: 1 / -1; }
.precio-vivo__plazo { text-align: center; }
.editor__visual .incluido > summary { justify-content: center; text-align: left; }
.precio-vivo .boton,
.precio-vivo__avisos,
.precio-vivo__ayuda { display: none; }
}
.editor__controles { display: grid; gap: var(--sp-5); border: 0; margin: 0; padding: 0; min-width: 0; }
.editor__aviso-movil { margin: 0; font-size: var(--fs-xs); color: var(--text-2); text-align: center; }
@media (min-width: 66rem) { .editor__aviso-movil { display: none; } }
.editor__promesa {
margin: 0;
padding: var(--sp-3) var(--sp-4);
border-radius: var(--r-1);
background: var(--paper-2);
color: var(--text-2);
font-size: var(--fs-sm);
font-weight: 700;
}
.dialogo-preview {
border: 0;
padding: 0;
background: transparent;
max-width: min(92vw, 60rem);
width: 100%;
}
.dialogo-preview::backdrop { background: rgba(6, 7, 10, 0.82); }
.dialogo-preview__caja { padding: var(--sp-4); }
.dialogo-preview .escenario--grande .neon-lienzo { max-height: 70vh; }
.dialogo-preview .escenario__pie { color: var(--text-inv-2); }
@media (prefers-reduced-motion: reduce) {
.neon-lienzo, .neon-escena { transition: none; }
}
.neon-medidas { display: grid; gap: var(--sp-4); }
@media (min-width: 30rem) { .neon-medidas { grid-template-columns: 1fr 1fr; } }
.neon-textarea {
width: 100%;
padding: 0.85rem 0.9rem;
border: 1.5px solid var(--line-2);
border-radius: var(--r-1);
background: var(--paper);
font-family: inherit;
font-size: var(--fs-md);
font-weight: 600;
line-height: 1.4;
resize: vertical;
min-height: 5.5rem;
}
.neon-textarea:focus { border-color: var(--accent-700); }
.editor__controles .campo input[type="number"] {
width: 100%;
padding: 0.85rem 3rem 0.85rem 0.9rem;
border: 1.5px solid var(--line-2);
border-radius: var(--r-1);
background: var(--paper);
font-size: var(--fs-lg);
font-weight: 700;
min-height: 3.25rem;
-moz-appearance: textfield;
}
.editor__controles .campo input[type="number"]::-webkit-outer-spin-button,
.editor__controles .campo input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.editor__controles .campo input:focus { border-color: var(--accent-700); }
.editor__controles .campo input[aria-invalid="true"] { border-color: #b42318; background: #fff5f4; }
[data-neon-aviso-lineas][data-limite="true"] { color: var(--warn); font-weight: 700; }
[data-neon-aviso-lineas][data-aviso="true"] {
display: inline-block;
padding: 0.15em 0.5em;
border-radius: 4px;
background: var(--warn-bg);
}
.archivo__quitar {
border: 0;
background: none;
color: var(--accent-700);
font-family: inherit;
font-size: var(--fs-sm);
font-weight: 700;
cursor: pointer;
text-decoration: underline;
padding: var(--sp-1);
}
.fuentes { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-2); }
.fuentes > * { min-width: 0; }
@media (min-width: 40rem) { .fuentes { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 66rem) { .fuentes { grid-template-columns: repeat(2, 1fr); } }
.fuente {
position: relative;
display: grid;
grid-template-columns: auto 1fr;
grid-template-areas: "numero muestra" "nombre nota";
align-items: center;
gap: var(--sp-1) var(--sp-2);
padding: var(--sp-3) var(--sp-2);
border: 1.5px solid var(--line);
border-radius: var(--r-2);
background: var(--paper);
text-align: left;
min-height: 5.5rem;
}
.fuente input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.fuente__numero {
grid-area: numero;
align-self: start;
font-size: var(--fs-xs);
font-weight: 700;
font-variant-numeric: tabular-nums;
color: var(--text-3);
}
.fuente__muestra {
grid-area: muestra;
display: block;
min-width: 0;
font-size: 1.3rem;
line-height: 1.12;
color: var(--text);
max-width: 100%;
overflow: hidden;
overflow-wrap: anywhere;
}
.fuente__muestra[data-lineas="2"] { font-size: 1.02rem; }
.fuente__muestra[data-lineas="3"] { font-size: 0.85rem; line-height: 1.08; }
.fuente__nombre { grid-area: nombre; font-size: var(--fs-xs); font-weight: 700; color: var(--text-2); }
.fuente__nota {
grid-area: nota;
justify-self: end;
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.02em;
color: var(--warn);
background: var(--warn-bg);
border-radius: 999px;
padding: 0.1rem 0.5rem;
}
.fuente:has(input:checked) { border-color: var(--accent-700); background: var(--accent-050); }
.fuente:has(input:checked) .fuente__nombre { color: var(--accent-700); }
.fuente:has(input:focus-visible) { outline: 3px solid var(--accent-700); outline-offset: 2px; }
.escenario__vistas {
position: absolute;
left: var(--sp-3);
bottom: var(--sp-3);
display: flex;
gap: 0.25rem;
padding: 0.2rem;
border-radius: 999px;
background: rgba(10, 12, 17, 0.62);
backdrop-filter: blur(6px);
}
.escenario__vista {
border: 0;
border-radius: 999px;
padding: 0.35rem 0.7rem;
font: inherit;
font-size: var(--fs-xs);
font-weight: 700;
color: rgba(255, 255, 255, 0.72);
background: transparent;
cursor: pointer;
min-height: 2rem;
}
.escenario__vista[aria-pressed="true"] { background: rgba(255, 255, 255, 0.16); color: #fff; }
.escenario__vista:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.archivo__promesa {
margin: 0;
padding: var(--sp-3);
border-radius: var(--r-1);
border: 1px solid var(--line);
background: var(--paper);
font-size: var(--fs-xs);
line-height: 1.5;
color: var(--text-2);
text-align: left;
}
.colores { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.color { position: relative; display: block; }
.color input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.color__muestra {
display: block;
width: 2.75rem;
height: 2.75rem;
border-radius: 50%;
background: var(--tono);
box-shadow: 0 0 0 2px var(--paper), 0 0 0 3px var(--line-2), 0 0 14px var(--tono);
transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.color input:checked + .color__muestra {
transform: scale(1.08);
box-shadow: 0 0 0 2px var(--paper), 0 0 0 3px var(--accent-700), 0 0 20px var(--tono);
}
.color input:focus-visible + .color__muestra { outline: 3px solid var(--accent-700); outline-offset: 4px; }
.colores__nota { margin: var(--sp-3) 0 0; font-size: var(--fs-sm); color: var(--text-2); }
.neon-barra {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 90;
background: var(--ink-900);
color: var(--text-inv);
padding: var(--sp-3) var(--sp-4);
padding-bottom: max(var(--sp-3), env(safe-area-inset-bottom));
display: flex;
align-items: center;
gap: var(--sp-3);
box-shadow: 0 -8px 24px rgba(10, 12, 17, 0.28);
transform: translateY(115%);
transition: transform var(--dur) var(--ease);
}
.neon-barra[data-visible="true"] { transform: translateY(0); }
.neon-barra[data-hay-precio="false"] { transform: translateY(115%); }
.neon-barra__info { min-width: 0; flex: 1; }
.neon-barra__etiqueta { font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-inv-2); margin: 0; }
.neon-barra__cifra { font-size: 1.4rem; font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; margin: 0; }
.neon-barra .boton { min-height: 2.9rem; padding-inline: 0.85rem; font-size: 0.72rem; letter-spacing: 0.03em; flex: none; }
@media (min-width: 66rem) { .neon-barra { display: none; } }
.con-barra-neon { padding-bottom: 6.75rem; }
@media (min-width: 66rem) { .con-barra-neon { padding-bottom: 0; } }
.neon-galeria { display: grid; gap: var(--sp-4); }
@media (min-width: 40rem) { .neon-galeria { grid-template-columns: repeat(3, 1fr); } }
.neon-galeria figure { margin: 0; }
.neon-galeria figcaption { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--text-2); }
.neon-galeria h3 { font-size: var(--fs-md); margin-bottom: var(--sp-1); }
.proyecto-especial { display: grid; gap: var(--sp-6); align-items: center; scroll-margin-top: 4.5rem; }
@media (min-width: 62rem) { .proyecto-especial { grid-template-columns: 1fr 1fr; gap: var(--sp-8); } }
.proyecto-especial p { font-size: var(--fs-lg); margin-bottom: var(--sp-5); max-width: 34rem; }
.opciones--3 { display: grid; gap: var(--sp-3); }
@media (min-width: 30rem) { .opciones--3 { grid-template-columns: repeat(3, 1fr); } }
.opcion--figura .opcion__caja {
display: grid;
justify-items: center;
gap: var(--sp-2);
text-align: center;
}
.figura {
display: block;
width: 100%;
max-width: 6.5rem;
}
.figura svg {
display: block;
width: 100%;
height: auto;
fill: var(--ink-800);
stroke: var(--ink-800);
stroke-width: 1.5;
}
.opcion--figura input:checked + .opcion__caja .figura svg {
fill: var(--accent-700);
stroke: var(--accent-700);
}
.producciones { display: grid; gap: var(--sp-3); }
@media (min-width: 34rem) { .producciones { grid-template-columns: repeat(3, 1fr); } }
.produccion { position: relative; display: block; }
.produccion input {
position: absolute;
inset: 0;
opacity: 0;
width: 100%;
height: 100%;
margin: 0;
cursor: pointer;
}
.produccion__caja {
display: grid;
gap: 0.15rem;
height: 100%;
padding: var(--sp-4) var(--sp-3);
border: 1.5px solid var(--line);
border-radius: var(--r-2);
background: var(--paper);
}
.produccion__nombre {
font-size: var(--fs-xs);
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--text-2);
}
.produccion__fecha {
margin-top: var(--sp-1);
font-size: var(--fs-md);
font-weight: 800;
line-height: 1.25;
color: var(--text);
}
.produccion__precio {
margin-top: var(--sp-1);
font-size: var(--fs-sm);
font-weight: 800;
color: var(--text);
font-variant-numeric: tabular-nums;
}
.produccion__dias {
margin-top: var(--sp-2);
font-size: var(--fs-xs);
line-height: 1.4;
color: var(--text-2);
}
.produccion input:checked + .produccion__caja .produccion__nombre,
.produccion input:checked + .produccion__caja .produccion__precio {
color: var(--accent-700);
}
.produccion input:checked + .produccion__caja {
border-color: var(--accent-700);
background: var(--accent-050);
}
.produccion input:focus-visible + .produccion__caja {
outline: 3px solid var(--accent-700);
outline-offset: 2px;
}
.editor__uso {
display: flex;
align-items: baseline;
gap: var(--sp-2);
margin: 0 0 var(--sp-5);
padding: var(--sp-3) var(--sp-4);
border-radius: var(--r-2);
background: var(--paper-2);
font-size: var(--fs-sm);
color: var(--text-2);
}
.editor__uso-marca { color: var(--accent-700); }
.incluido {
margin: var(--sp-3) 0 0;
font-size: var(--fs-xs);
color: var(--text-inv-2);
}
.incluido > summary {
display: flex;
align-items: center;
gap: var(--sp-2);
padding: var(--sp-2) 0;
cursor: pointer;
list-style: none;
line-height: 1.35;
min-height: 2.25rem;
}
.incluido > summary::-webkit-details-marker { display: none; }
.incluido > summary::after {
content: "+";
margin-left: auto;
font-weight: 800;
color: var(--text-inv-2);
}
.incluido[open] > summary::after { content: "−"; }
.incluido > summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.incluido__iconos { display: inline-flex; gap: 0.35rem; flex: none; }
.incluido__iconos svg {
width: 1.05rem;
height: 1.05rem;
fill: none;
stroke: var(--ok);
stroke-width: 1.7;
stroke-linecap: round;
stroke-linejoin: round;
}
.incluido ul {
margin: 0 0 var(--sp-2);
padding-left: 1.1rem;
display: grid;
gap: 0.25rem;
line-height: 1.45;
}
.incluido ul b { color: var(--text-inv); }
.precio-vivo__plazo { margin: var(--sp-2) 0 0; }
.plazo__principal {
margin: 0;
font-size: var(--fs-md);
font-weight: 800;
color: var(--text-inv);
}
.plazo__detalle {
margin: 0.1rem 0 0;
font-size: var(--fs-xs);
color: var(--text-inv-2);
}
.resumen__mini {
aspect-ratio: 5 / 3;
max-width: 22rem;
margin: 0 auto var(--sp-4);
}
.resumen__incluye {
margin: var(--sp-3) 0 0;
padding: var(--sp-3);
border-radius: var(--r-1);
background: var(--ok-bg);
color: var(--ok);
font-size: var(--fs-sm);
font-weight: 700;
}
.resumen__detalles { margin-top: var(--sp-4); }
.resumen__detalles > summary {
cursor: pointer;
padding: var(--sp-2) 0;
font-size: var(--fs-sm);
font-weight: 700;
color: var(--accent-700);
min-height: 2.75rem;
display: flex;
align-items: center;
}
.resumen__detalles > summary:focus-visible {
outline: 3px solid var(--accent-700);
outline-offset: 2px;
}
.resumen__detalles .datos { margin-top: var(--sp-2); }
.resumen__ayuda { margin: 0; font-size: var(--fs-sm); color: var(--text-2); }
.franja-confianza {
display: grid;
gap: var(--sp-3);
margin: var(--sp-5) 0 0;
padding: 0;
list-style: none;
}
@media (min-width: 40rem) { .franja-confianza { grid-template-columns: repeat(2, 1fr); } }
.franja-confianza li {
position: relative;
padding-left: 1.4rem;
font-size: var(--fs-sm);
line-height: 1.5;
color: var(--text-inv-2);
}
.franja-confianza li::before {
content: "✓";
position: absolute;
left: 0;
color: var(--ok);
font-weight: 800;
}
.franja-confianza b { color: var(--text-inv); }
.salida-especial { padding-block: var(--sp-6); }
.salida-especial .contenedor {
display: grid;
gap: var(--sp-2);
padding: var(--sp-5);
border: 1.5px solid var(--line);
border-radius: var(--r-2);
background: var(--paper-2);
}
.salida-especial__texto { margin: 0; font-size: var(--fs-sm); color: var(--text-2); }
.salida-especial__texto b { color: var(--text); }
.salida-especial__acciones { margin: 0; font-size: var(--fs-sm); }
.cierre-neon__caja {
display: grid;
justify-items: center;
gap: var(--sp-3);
text-align: center;
}
.cierre-neon__caja p { margin: 0; color: var(--text-2); }
.incluido-config {
border: 1px solid var(--line);
border-radius: var(--r-2);
background: var(--paper-2);
padding: var(--sp-3) var(--sp-4);
}
.incluido-config__titulo {
margin: 0;
font-size: var(--fs-xs);
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--ok);
}
.incluido-config__lista { margin: 0.2rem 0 0; font-size: var(--fs-sm); font-weight: 700; }
.incluido-config__nota { margin: 0.15rem 0 0; font-size: var(--fs-xs); color: var(--text-2); }
.resumen__pedir { margin-bottom: var(--sp-2); }
.resumen__garantia {
margin: 0 0 var(--sp-3);
font-size: var(--fs-xs);
color: var(--text-2);
text-align: center;
}
.envio-produccion { margin-top: var(--sp-3); }
.envio-produccion__incluido {
margin: 0;
font-size: var(--fs-sm);
font-weight: 800;
color: var(--ok);
}
.envio-produccion__transporte {
margin: 0.15rem 0 0;
font-size: var(--fs-xs);
color: var(--text-2);
}
@media (max-width: 40rem) {
.resumen { scroll-margin-top: 5.25rem; }
.resumen .encabezado { text-align: center; }
.resumen__cabecera {
display: grid;
justify-items: center;
text-align: center;
}
.resumen__cuerpo,
.resumen__pie { padding: var(--sp-4); }
.resumen__ayuda { text-align: center; }
.datos div { align-items: start; }
.datos dt,
.datos dd { min-width: 0; overflow-wrap: anywhere; }
}
.neon-hero__media-pie {
margin: var(--sp-2) 0 0;
font-size: var(--fs-xs);
color: var(--text-inv-2);
line-height: 1.45;
}
.neon-hero__media-pie strong {
display: block;
font-size: var(--fs-sm);
color: var(--text-inv);
}
.neon-tecnica {
margin-top: var(--sp-6);
display: grid;
gap: var(--sp-5);
align-items: center;
}
@media (min-width: 66rem) {
.neon-tecnica { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); }
}
.neon-tecnica__media { margin: 0; }
.neon-tecnica__media img {
display: block;
width: 100%;
height: auto;
border-radius: var(--r-2);
}
.neon-tecnica__texto h3 { margin: 0 0 var(--sp-2); }
.neon-tecnica__texto p { margin: 0; color: var(--text-2); }