/* =====================================================================
   Vestido «Fresco» (app/Vestidos.php): claro y aireado. Blanco con tonos suaves del acento y del apoyo, curvas, sombras amplias
   y la portada centrada. Las franjas «alterno» y «acento» son tintes suaves, nunca bloques de color fuerte.
   ===================================================================== */
.vestido-fresco { --sombra-fresca: 0 24px 50px -28px color-mix(in srgb, var(--t-primario) 45%, transparent); }
.vestido-fresco .fondo-alterno { --bg: color-mix(in srgb, var(--t-apoyo) 10%, var(--t-fondo)); }
.vestido-fresco .fondo-acento { --bg: color-mix(in srgb, var(--t-acento) 9%, var(--t-fondo)); --tx: var(--t-texto); --su: var(--t-suave); --at: var(--t-acento-texto); --b: var(--t-acento); --bt: var(--t-sobre-acento); }
.vestido-fresco .s h1, .vestido-fresco .s h2, .vestido-fresco .s h3 { font-weight: 400; line-height: 1.06; }
.vestido-fresco .s .s-ceja { display: inline-flex; padding: 6px 14px; border-radius: 999px; background: color-mix(in srgb, var(--t-apoyo) 11%, var(--t-fondo)); color: color-mix(in srgb, var(--t-apoyo-texto) 72%, var(--t-texto)); font-weight: 700; font-size: .78rem; letter-spacing: .02em; text-transform: none; }
.vestido-fresco .s-cab { text-align: center; max-width: 660px; margin: 0 auto 44px; }
.vestido-fresco .s-cab h2 { font-size: calc(clamp(2.2rem, 4.6vw, 3.5rem) * var(--t-tamano)); }
.vestido-fresco .s-boton { box-shadow: 0 14px 28px -14px var(--b); }
.vestido-fresco .s-boton-borde { background: var(--t-superficie); border-color: transparent; box-shadow: var(--sombra-fresca); }

/* --- cabecera: el menú en una píldora --- */
.vestido-fresco .w-cabecera { background: color-mix(in srgb, var(--t-fondo) 82%, transparent); border-bottom: 0; }
.vestido-fresco .w-cabecera-fila { min-height: 76px; }
.vestido-fresco .w-marca span { font-weight: 400; font-size: 1.35rem; }
@media (min-width: 901px) {
  .vestido-fresco .w-nav { gap: 2px; padding: 6px; border-radius: 999px; background: color-mix(in srgb, var(--t-texto) 4%, var(--t-fondo)); }
  .vestido-fresco .w-nav a:not(.s-boton) { padding: 8px 14px; border-radius: 999px; font-size: .92rem; color: var(--t-suave); }
  .vestido-fresco .w-nav a:not(.s-boton):hover { background: var(--t-superficie); color: var(--t-texto); }
}

/* --- portada: centrada sobre manchas suaves de color, la foto grande y redondeada --- */
.vestido-fresco .portada { background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--t-apoyo) 16%, transparent) 0, transparent 34%), radial-gradient(circle at 88% 28%, color-mix(in srgb, var(--t-acento) 13%, transparent) 0, transparent 32%), var(--bg); }
.vestido-fresco .portada h1 { font-size: calc(clamp(2.8rem, 6.2vw, 5.4rem) * var(--t-tamano)); }
.vestido-fresco .portada .s-bajada { font-size: 1.12rem; }
.vestido-fresco .portada .s-garantias .ico { color: var(--t-apoyo-texto); }
.vestido-fresco .portada.f-centrado .fot { aspect-ratio: 16 / 7; border-radius: 32px; border: 6px solid var(--t-superficie); box-shadow: var(--sombra-fresca); }
.vestido-fresco .portada:not(.f-centrado) .fot { border-radius: 32px; border: 6px solid var(--t-superficie); box-shadow: var(--sombra-fresca); }
.vestido-fresco .portada .pega { display: grid; top: 18px; left: 18px; right: auto; padding: 12px 18px; border-radius: 20px; transform: none; }
.vestido-fresco .pega small { color: color-mix(in srgb, var(--t-apoyo-texto) 70%, var(--t-texto)); text-transform: none; letter-spacing: 0; }
.vestido-fresco .pega strong { color: var(--t-acento-texto); }

/* --- cinta: chapitas suaves --- */
.vestido-fresco .s-cinta.fondo-acento, .vestido-fresco .s-cinta.fondo-alterno { --bg: var(--t-fondo); --tx: var(--t-suave); padding-block: 22px; }
.vestido-fresco .rueda { gap: 14px; font: 600 .95rem var(--t-cuerpo); }
.vestido-fresco .rueda span { padding: 8px 18px; border-radius: 999px; background: color-mix(in srgb, var(--t-texto) 5%, var(--t-fondo)); }
.vestido-fresco .rueda span::after { content: none; }

/* --- listas: tarjetas blancas con la foto adentro, redondeada --- */
.vestido-fresco .s-lista.fondo-alterno, .vestido-fresco .s-lista.fondo-acento { margin-inline: 16px; border-radius: 48px; }
.vestido-fresco .filtros { width: max-content; max-width: 100%; margin-inline: auto; padding: 6px; border-radius: 999px; background: color-mix(in srgb, var(--tx) 5%, var(--bg)); gap: 2px; }
.vestido-fresco .filtros button { border: 0; border-radius: 999px; color: var(--su); }
.vestido-fresco .filtros button.act { background: var(--t-superficie); color: var(--t-texto); box-shadow: 0 8px 18px -12px rgba(0, 0, 0, .5); }
.vestido-fresco .item { padding: 10px; border: 0; border-radius: 26px; box-shadow: var(--sombra-fresca); }
.vestido-fresco .item .ifoto { border-radius: 18px; }
.vestido-fresco .icuerpo { padding: 14px 8px 6px; }
.vestido-fresco .s .icuerpo h3 { font-weight: 400; font-size: 1.32rem; }
.vestido-fresco { --tinte: color-mix(in srgb, var(--t-acento) 10%, var(--t-superficie)); --sobre-tinte: color-mix(in srgb, var(--t-acento-texto) 70%, var(--t-texto)); }
.vestido-fresco .ieti { background: var(--tinte); color: var(--sobre-tinte); }
.vestido-fresco .item.destacado { background: color-mix(in srgb, var(--t-acento) 9%, var(--t-superficie)); }
.vestido-fresco .iprecio { color: var(--t-texto); font-size: 1.2rem; }
.vestido-fresco .ipedir { border-radius: 999px; background: var(--tinte); color: var(--sobre-tinte) !important; }
.vestido-fresco .l-filas .item { padding: 14px 0; border-radius: 0; box-shadow: none; }
.vestido-fresco .l-filas .ifoto { border-radius: 18px; }
.vestido-fresco .item:hover { transform: translateY(-6px); }

/* menú del día: tarjeta blanca con los platos en cajitas */
.vestido-fresco .l-dia .item { border: 0; padding: 0; background: var(--t-superficie); box-shadow: var(--sombra-fresca); border-radius: 32px; }
.vestido-fresco .l-dia .icuerpo { padding: 36px 30px; }
.vestido-fresco .l-dia .icuerpo ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
.vestido-fresco .l-dia .icuerpo li { padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, var(--t-apoyo) 9%, var(--t-fondo)); color: var(--t-texto); font: 400 1.1rem/1.3 var(--t-titulos); }
.vestido-fresco .l-dia .ieti { background: color-mix(in srgb, var(--t-apoyo) 11%, var(--t-fondo)); color: color-mix(in srgb, var(--t-apoyo-texto) 72%, var(--t-texto)); }
.vestido-fresco .l-dia .iprecio { color: var(--t-acento-texto); font-size: 2.2rem; }
.vestido-fresco .l-dia .ipedir { background: var(--t-acento); color: var(--t-sobre-acento) !important; min-height: 46px; padding: 0 22px; }

/* opiniones: tarjetas blancas con un corazón */
.vestido-fresco .l-citas .item { padding: 0; text-align: left; }
.vestido-fresco .l-citas .icuerpo { padding: 28px; }
.vestido-fresco .l-citas .icuerpo::before { content: '★★★★★'; order: 9; color: #E9A23B; letter-spacing: .12em; }
.vestido-fresco .l-citas .icuerpo p { font: 400 1.06rem/1.55 var(--t-cuerpo); }
.vestido-fresco .s.l-citas .item h3 { display: flex; align-items: center; gap: 10px; color: var(--t-texto); font-weight: 700; font-size: .95rem; }
.vestido-fresco .s.l-citas .item h3::before { content: '♥'; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: color-mix(in srgb, var(--t-acento) 14%, var(--t-superficie)); color: var(--t-acento-texto); }

/* --- nosotros: la foto con forma de gota --- */
.vestido-fresco .nosotros .fot { aspect-ratio: 1; border-radius: 46% 54% 42% 58% / 52% 44% 56% 48%; box-shadow: var(--sombra-fresca); }
.vestido-fresco .nosotros h2 { font-size: calc(clamp(2.2rem, 4.2vw, 3.3rem) * var(--t-tamano)); }

/* --- contacto: una tarjeta con degradado suave --- */
.vestido-fresco .contacto .rej { padding: clamp(28px, 5vw, 56px); border-radius: 40px; background: linear-gradient(135deg, color-mix(in srgb, var(--t-apoyo) 16%, var(--t-fondo)), var(--t-fondo) 60%, color-mix(in srgb, var(--t-acento) 12%, var(--t-fondo))); }
.vestido-fresco .contacto h2 { font-size: calc(clamp(2.3rem, 4.6vw, 3.6rem) * var(--t-tamano)); }

.vestido-fresco .w-pie { background: var(--t-fondo); color: var(--t-suave); }
.vestido-fresco .w-pie strong { color: var(--t-texto); }

@media (max-width: 760px) {
  .vestido-fresco .portada.f-centrado .fot { aspect-ratio: 4 / 3; border-radius: 24px; }
  .vestido-fresco .s-lista.fondo-alterno, .vestido-fresco .s-lista.fondo-acento { margin-inline: 8px; border-radius: 30px; }
  .vestido-fresco .item { padding: 7px; border-radius: 20px; }
  .vestido-fresco .l-dia .icuerpo ul { grid-template-columns: minmax(0, 1fr); }
  .vestido-fresco .filtros { width: auto; border-radius: 22px; }
  .vestido-fresco .contacto .rej { border-radius: 28px; }
}
@media (prefers-reduced-motion: reduce) { .vestido-fresco .item:hover { transform: none; } }