/* assets/css/sitio-web.css — Los sitios públicos (servicemotors.com.ar, rosariocorreadistribucion.com.ar, checkmotors.com.ar).
   Sitio público, tanda S1. Se monta ARRIBA del sistema del panel: sm-ui.css (tokens), sm-patente.css (la chapa),
   sm-telefono.css (país del teléfono) y temas/taller-pro.css (oscuro). Acá sólo va el armado de las páginas.
   Reglas (las mismas del ERP): nada de style="" ni <style> en las páginas; colores sólo con tokens --sm-* / --sw-*;
   esquinas con var(--sm-r-*, valor) (jobs/test_forma.php). Prefijo: sw- (sitio web).
   El <html> lleva class="sw-html" (lo pone includes/head.php): así el blog, que imprime su propio <body>, queda igual. */

/* ---------- Tokens del sitio (Clásico; Taller Pro abajo) ---------- */
:root {
    --sw-hero: linear-gradient(135deg, #17355C 0%, #1f4a86 55%, #2A61A8 100%);
    --sw-hero-ink: #ffffff;
    --sw-hero-muted: #d7e3f4;
    --sw-hero-line: rgba(255, 255, 255, .28);
    --sw-band: #eef3fa;
    --sw-acento: var(--sm-accent, #FEBC35);
    --sw-acento-ink: #0f172a;
    --sw-link: var(--sm-primary, #2A61A8);
    --sw-icono-bg: #e8eff9;
    --sw-icono-ink: var(--sm-primary, #2A61A8);
    --sw-top-bg: rgba(255, 255, 255, .92);
    --sw-pie-bg: #0f1a2e;
    --sw-wrap: 1200px;
}
:root[data-tema="taller-pro"] {
    --sw-hero: radial-gradient(1200px 500px at 85% 0%, rgba(254, 188, 53, .10), transparent 60%), #070a10;
    --sw-hero-ink: #f1f5f9;
    --sw-hero-muted: #a7b4c6;
    --sw-hero-line: rgba(255, 255, 255, .2);
    --sw-band: #0e1420;
    --sw-link: var(--sm-accent, #FEBC35);
    --sw-icono-bg: rgba(254, 188, 53, .12);
    --sw-icono-ink: #e2e8f0;
    --sw-top-bg: rgba(11, 15, 23, .88);
    --sw-pie-bg: #05070c;
}

/* ---------- Piel de marca (Clásico): la de las pantallas de ingreso (clientes/index.php y admin.php, ingreso.css) ----------
   Barlow + Barlow Condensed, papel cálido, azul marino profundo y tarjetas blancas con sombra azulada.
   Sólo pisa tokens y el color de los títulos: Taller Pro (oscuro) queda como está. */
:root.sw-html:not([data-tema="taller-pro"]) {
    --sm-font: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --sm-font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
    --sm-primary: #17355C;
    --sm-bg: #F3F1EC;
    --sm-surface: #ffffff;
    --sm-surface-2: #eef1f5;
    --sm-line: rgba(23, 53, 92, .12);
    --sm-ink: #17212e;
    --sm-ink-2: #3d4654;
    --sm-muted: #5b6472;
    --sm-shadow: 0 1px 2px rgba(23, 53, 92, .06), 0 24px 48px -28px rgba(23, 53, 92, .35);
    --sw-hero: radial-gradient(900px 420px at 88% 0%, rgba(42, 97, 168, .35), transparent 62%), #0d1b2e;
    --sw-hero-muted: #c3cfdf;
    --sw-hero-line: rgba(255, 255, 255, .18);
    --sw-band: #E9E5DC;
    --sw-link: #2A61A8;
    --sw-icono-bg: #eef1f5;
    --sw-icono-ink: #17355C;
    --sw-top-bg: rgba(243, 241, 236, .92);
    --sw-pie-bg: #0d1b2e;
    --sw-titulo: #17355C;
}
/* Títulos en azul marino; sobre los fondos oscuros, blancos; dentro de una tarjeta blanca, azul marino otra vez */
:root.sw-html:not([data-tema="taller-pro"]) :is(.sw-hero, .sw-pagina-hero, .sw-turno) { --sw-titulo: var(--sw-hero-ink); }
:root.sw-html:not([data-tema="taller-pro"]) :is(.sw-tarjeta, .sw-wz-caja) { --sw-titulo: #17355C; }
:root.sw-html:not([data-tema="taller-pro"]) :is(.sw-h1, .sw-h2) { color: var(--sw-titulo); letter-spacing: 0; line-height: .98; }
:root.sw-html:not([data-tema="taller-pro"]) .sw-h2 { font-size: clamp(2rem, 3.6vw, 3rem); }
:root.sw-html:not([data-tema="taller-pro"]) :is(.sw-h3, .sw-tarjeta-tit, .sw-oferta-tit, .sw-nota-tit) { color: var(--sw-titulo); font-family: var(--sm-font); font-weight: 700; }
:root.sw-html:not([data-tema="taller-pro"]) .sw-eyebrow { letter-spacing: .14em; }
:root.sw-html:not([data-tema="taller-pro"]) :is(.sw-servicio, .sw-paso) { box-shadow: var(--sm-shadow); }
:root.sw-html:not([data-tema="taller-pro"]) .sw-btn--tinta { background: var(--sm-primary); color: var(--sm-primary-ink) !important; }   /* como "Ver mi auto" del portal */

/* ---------- Base ---------- */
/* border-box como en el panel (ahí lo pone Bootstrap): la chapa y los botones se miden igual en los dos lados */
.sw-html *, .sw-html *::before, .sw-html *::after { box-sizing: border-box; }
.sw-html [hidden] { display: none !important; }   /* que un display:flex de una clase no le gane a hidden */
.sw-html body { margin: 0; padding: 0; background: var(--sm-bg); color: var(--sm-ink); font-family: var(--sm-font); -webkit-font-smoothing: antialiased; }
:where(.sw-html) body :where(a) { color: inherit; }   /* sin peso: cualquier clase del sitio manda sobre esto */
.sw-html body img { max-width: 100%; }
.sw-wrap { max-width: var(--sw-wrap); margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.sw-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sw-saltar { position: absolute; left: 12px; top: -60px; z-index: 2000; padding: 10px 16px; border-radius: var(--sm-r-sm, 10px); background: var(--sm-ink); color: var(--sm-bg) !important; font-weight: 700; text-decoration: none; }
.sw-saltar:focus { top: 12px; }
.sw-ico { font-family: 'Material Symbols Rounded'; font-weight: normal; font-style: normal; font-size: 1.25em; line-height: 1; display: inline-block; vertical-align: -.22em; font-variation-settings: 'FILL' 0, 'wght' 500; }
.sw-svg { width: 1.2em; height: 1.2em; fill: currentColor; vertical-align: -.22em; flex: 0 0 auto; }

/* Títulos */
.sw-eyebrow { display: inline-block; font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--sw-link); }
.sw-h1 { margin: 0; font-family: var(--sm-font-display); font-size: clamp(2.2rem, 5vw, 3.8rem); line-height: 1.02; font-weight: 800; letter-spacing: -.02em; }
.sw-h2 { margin: 6px 0 0; font-family: var(--sm-font-display); font-size: clamp(1.7rem, 3.2vw, 2.6rem); line-height: 1.08; font-weight: 800; letter-spacing: -.015em; }
.sw-h3 { margin: 0; font-family: var(--sm-font-display); font-size: 1.2rem; font-weight: 800; }
.sw-lead { margin: 10px 0 0; font-size: 1.08rem; line-height: 1.6; color: var(--sm-ink-2); max-width: 680px; }
:root[data-tema="taller-pro"] :is(.sw-h1, .sw-h2, .sw-h3) { text-transform: uppercase; letter-spacing: .01em; }
.sw-acento { color: var(--sw-acento); }
.sw-seccion { padding: 84px 0; }
.sw-seccion--band { background: var(--sw-band); }
.sw-seccion-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 32px; }
.sw-seccion-cab--centro { flex-direction: column; align-items: center; text-align: center; gap: 8px; }
.sw-seccion-cab--centro .sw-tabs { margin-top: 14px; }
.sw-seccion-cab--centro .sw-lead { margin-left: auto; margin-right: auto; }

/* ---------- Botones ---------- */
.sw-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border: 1px solid transparent; border-radius: var(--sm-r-md, 14px);
    font: 800 1rem/1 var(--sm-font); text-decoration: none; cursor: pointer; transition: filter var(--sm-dur-fast), transform var(--sm-dur-fast), background var(--sm-dur-fast); white-space: nowrap; }
.sw-btn:hover { filter: brightness(1.06); }
.sw-btn:active { transform: translateY(1px); }
.sw-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--sw-link) 45%, transparent); outline-offset: 2px; }
.sw-btn[disabled] { opacity: .6; cursor: wait; }
.sw-btn--acento { background: var(--sw-acento); color: var(--sw-acento-ink) !important; }
.sw-btn--azul { background: var(--sm-primary); color: var(--sm-primary-ink) !important; }
.sw-btn--tinta { background: var(--sm-ink); color: var(--sm-bg) !important; }
.sw-btn--borde { border-color: var(--sm-line); background: var(--sm-surface); color: var(--sm-ink) !important; }
.sw-btn--borde-claro { border-color: var(--sw-hero-line); background: transparent; color: var(--sw-hero-ink) !important; }
.sw-btn--wa { background: #1f9d55; color: #fff !important; }
.sw-btn--chico { min-height: 40px; padding: 0 16px; font-size: .9rem; border-radius: var(--sm-r-pill, 999px); }
.sw-btn--ancho { width: 100%; white-space: normal; text-align: center; line-height: 1.2; padding-top: 10px; padding-bottom: 10px; }
.sw-link { color: var(--sw-link) !important; font-weight: 700; text-decoration: none; }
.sw-link:hover { text-decoration: underline; }

/* ---------- Cartel (el logo: como el cartel del frente, que imita una patente Mercosur) ---------- */
.sw-cartel { display: inline-flex; flex-direction: column; text-decoration: none; border: 2px solid #1b1b1b; border-radius: var(--sm-r-xs, 6px); overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); }
.sw-cartel-banda { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 6px; background: linear-gradient(#1d56b0, #0b2f6e); color: #fff; white-space: nowrap;
    font: 700 .5rem/1.3 'Barlow Condensed', 'Arial Narrow', sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.sw-cartel-bandera { width: 14px; height: 9px; flex: 0 0 auto; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 20'%3E%3Crect width='30' height='20' fill='%2375aadb'/%3E%3Crect y='6.67' width='30' height='6.67' fill='%23fff'/%3E%3Ccircle cx='15' cy='10' r='2' fill='%23f6b40e'/%3E%3C/svg%3E") center / cover no-repeat; }
.sw-cartel-logo { display: flex; align-items: center; justify-content: center; padding: 5px 10px 6px; color: #2a60a8; }
.sw-cartel-logo svg { display: block; height: 15px; width: auto; max-width: 100%; fill: currentColor; }
.sw-top-in > .sw-cartel, .sw-marca, .sw-marca > .sw-cartel { flex: 0 0 auto; }
.sw-top-in > .sw-cartel, .sw-marca { margin-right: auto; }
.sw-cartel-sub { display: block; padding: 0 10px 4px; text-align: center; font: 700 .55rem/1 'Barlow Condensed', sans-serif; letter-spacing: .14em; color: #2a60a8; }
.sw-cartel--grande .sw-cartel-banda { font-size: .72rem; padding: 4px 10px; }
.sw-cartel--grande .sw-cartel-bandera { width: 22px; height: 14px; }
.sw-cartel--grande .sw-cartel-logo { padding: 10px 18px 8px; }
.sw-cartel--grande .sw-cartel-logo svg { height: 28px; }
.sw-cartel--grande .sw-cartel-sub { font-size: .8rem; padding-bottom: 8px; }

/* ---------- Barra superior ---------- */
.sw-top { position: sticky; top: 0; z-index: 1000; background: var(--sw-top-bg); backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid var(--sm-line); }
.sw-top-in { display: flex; align-items: center; gap: 22px; min-height: 72px; }
.sw-nav { display: flex; align-items: center; gap: 4px; margin-left: 8px; }
.sw-nav a { padding: 8px 12px; border-radius: var(--sm-r-sm, 10px); font-weight: 600; font-size: .95rem; color: var(--sm-ink-2); text-decoration: none; white-space: nowrap; }
.sw-nav a:hover, .sw-nav a[aria-current="page"] { color: var(--sm-ink); background: var(--sm-surface-2); }
.sw-top-acc { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.sw-tema-btn, .sw-menu-btn { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--sm-line);
    background: var(--sm-surface); color: var(--sm-ink); cursor: pointer; font-size: 1.15rem; }
.sw-menu-btn { display: none; }
.sw-tema-btn .sw-ico-oscuro { display: none; }
:root[data-tema="taller-pro"] .sw-tema-btn .sw-ico-claro { display: none; }
:root[data-tema="taller-pro"] .sw-tema-btn .sw-ico-oscuro { display: inline-block; }
@media (max-width: 1180px) {
    .sw-menu-btn { display: inline-flex; }
    .sw-nav { position: fixed; inset: 72px 0 auto 0; flex-direction: column; align-items: stretch; gap: 2px; margin: 0; padding: 12px 20px 20px; background: var(--sm-surface); border-bottom: 1px solid var(--sm-line);
        box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .35); transform: translateY(-8px); opacity: 0; visibility: hidden; transition: all var(--sm-dur); }
    .sw-nav.is-abierto { transform: none; opacity: 1; visibility: visible; }
    .sw-nav a { padding: 14px 12px; font-size: 1.05rem; }
    .sw-top-acc .sw-solo-desk { display: none; }
}

/* ---------- Portada ---------- */
.sw-hero { background: var(--sw-hero); color: var(--sw-hero-ink); padding: 72px 0 84px; position: relative; overflow: hidden; }
.sw-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.sw-hero .sw-lead { color: var(--sw-hero-muted); font-size: 1.15rem; }
.sw-hero .sw-eyebrow { color: var(--sw-acento); }
.sw-hero-chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--sm-r-pill, 999px); background: rgba(255, 255, 255, .14); font-size: .85rem; font-weight: 700; }
.sw-hero-acc { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.sw-hero-datos { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 22px; font-size: .92rem; color: var(--sw-hero-muted); }
.sw-hero-datos b { color: var(--sw-hero-ink); }
.sw-estrellas { color: var(--sw-acento); letter-spacing: 1px; }
.sw-hero-col { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
@media (max-width: 900px) { .sw-hero-grid { grid-template-columns: minmax(0, 1fr); } .sw-hero { padding: 48px 0 56px; } }

/* Tarjeta clara sobre el hero (estado del auto, formularios) */
.sw-tarjeta { background: var(--sm-surface); color: var(--sm-ink); border: 1px solid var(--sm-line); border-radius: var(--sm-r-lg, 22px); padding: 28px; box-shadow: 0 24px 60px -24px rgba(8, 15, 30, .45); }
.sw-tarjeta-tit { margin: 0 0 4px; font-family: var(--sm-font-display); font-size: 1.5rem; font-weight: 800; }
.sw-tarjeta-sub { margin: 0 0 18px; color: var(--sm-muted); font-size: .95rem; }

/* ---------- Formularios ---------- */
.sw-form { display: flex; flex-direction: column; gap: 14px; }
.sw-form-fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 560px) { .sw-form-fila { grid-template-columns: minmax(0, 1fr); } }
.sw-campo { display: flex; flex-direction: column; gap: 6px; font-size: .88rem; font-weight: 700; color: var(--sm-ink-2); }
.sw-campo-ayuda { font-weight: 500; color: var(--sm-muted); font-size: .8rem; }
.sw-input { width: 100%; box-sizing: border-box; min-height: 48px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--sm-ink) 18%, transparent); border-radius: var(--sm-r-sm, 12px);
    background: var(--sm-surface-2); color: var(--sm-ink); font: 500 1rem var(--sm-font); }
.sw-input:focus { outline: none; border-color: var(--sw-link); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sw-link) 22%, transparent); background: var(--sm-surface); }
textarea.sw-input { min-height: 96px; resize: vertical; }
.sw-input.is-invalida { border-color: var(--sm-bad); }
.sw-chapa-lugar { display: flex; justify-content: flex-start; }
.sw-opciones { display: flex; flex-wrap: wrap; gap: 8px; }
.sw-opcion { position: relative; }
.sw-opcion input { position: absolute; opacity: 0; inset: 0; }
.sw-opcion span { display: inline-flex; flex-direction: column; align-items: center; min-width: 64px; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--sm-ink) 16%, transparent); border-radius: var(--sm-r-sm, 12px);
    font-weight: 700; font-size: .9rem; color: var(--sm-ink); background: var(--sm-surface); cursor: pointer; line-height: 1.15; }
.sw-opcion span small { font-weight: 600; font-size: .72rem; color: var(--sm-muted); }
.sw-opcion input:checked + span { background: var(--sm-ink); border-color: var(--sm-ink); color: var(--sm-bg); }
.sw-opcion input:checked + span small { color: inherit; opacity: .8; }
.sw-opcion input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--sw-link) 45%, transparent); }
.sw-form-pie { margin: 0; font-size: .82rem; color: var(--sm-muted); }
.sw-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--sm-r-sm, 12px); font-size: .92rem; font-weight: 600; }
.sw-aviso--ok { background: var(--sm-ok-bg); color: var(--sm-ok-ink); }
.sw-aviso--mal { background: var(--sm-bad-bg); color: var(--sm-bad-ink); }
.sw-listo { text-align: center; padding: 18px 0; }
.sw-listo .sw-ico { font-size: 3.4rem; color: var(--sm-ok); }
.sw-listo h3 { margin: 8px 0 6px; font-family: var(--sm-font-display); font-size: 1.6rem; }

/* ---------- Ofertas con precio cerrado ---------- */
.sw-ofertas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sw-oferta { display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: var(--sm-r-lg, 20px); background: var(--sm-surface); border: 1px solid var(--sm-line); text-decoration: none;
    transition: transform var(--sm-dur), box-shadow var(--sm-dur); box-shadow: var(--sm-shadow); }
.sw-oferta:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -20px rgba(15, 23, 42, .35); }
.sw-oferta--destacada { background: var(--sw-acento); color: var(--sw-acento-ink); border-color: transparent; }
.sw-oferta-tag { align-self: flex-start; padding: 5px 12px; border-radius: var(--sm-r-pill, 999px); background: var(--sw-icono-bg); color: var(--sw-icono-ink); font-size: .74rem; font-weight: 800; letter-spacing: .05em; }
.sw-oferta--destacada .sw-oferta-tag { background: rgba(0, 0, 0, .12); color: inherit; }
.sw-oferta-tit { font-family: var(--sm-font-display); font-size: 1.55rem; font-weight: 800; line-height: 1.1; }
.sw-oferta-txt { font-size: .98rem; line-height: 1.5; opacity: .85; }
.sw-oferta-pie { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-top: 12px; border-top: 1px solid color-mix(in srgb, currentColor 15%, transparent); font-size: .85rem; }
.sw-oferta-pie b { font-size: 1rem; white-space: nowrap; }
.sw-oferta-pie { flex-wrap: wrap; }
.sw-oferta-pie > span { overflow-wrap: anywhere; }
@media (max-width: 900px) { .sw-ofertas { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Servicios (íconos con cuerpo, dibujados en includes/sitio.php → sw_icono_servicio) ---------- */
.sw-servicios { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.sw-servicios--chico { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sw-servicio { display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface); border: 1px solid var(--sm-line); text-decoration: none;
    transition: transform var(--sm-dur), border-color var(--sm-dur); }
.sw-servicio:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--sw-link) 45%, transparent); }
.sw-servicio-ico { width: 60px; height: 60px; display: grid; place-items: center; border-radius: var(--sm-r-md, 16px); background: var(--sw-icono-bg); color: var(--sw-icono-ink); box-shadow: inset 0 0 0 1px var(--sm-line); }
.sw-servicio-ico svg { width: 34px; height: 34px; }
.sw-servicio-txt { font-size: .95rem; line-height: 1.5; color: var(--sm-ink-2); }
.sw-servicio-mas { margin-top: auto; font-size: .9rem; font-weight: 800; color: var(--sw-link); }
@media (max-width: 1100px) { .sw-servicios { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .sw-servicios, .sw-servicios--chico { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .sw-servicios { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Cómo trabajamos ---------- */
.sw-pasos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: paso; list-style: none; margin: 0; padding: 0; }
.sw-paso { padding: 24px; border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface); border: 1px solid var(--sm-line); }
.sw-paso::before { counter-increment: paso; content: '0' counter(paso); display: block; font-family: var(--sm-font-display); font-size: 2.4rem; font-weight: 800; color: var(--sw-link); line-height: 1; margin-bottom: 10px; }
.sw-paso p { margin: 8px 0 0; color: var(--sm-ink-2); line-height: 1.5; }
@media (max-width: 900px) { .sw-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .sw-pasos { grid-template-columns: minmax(0, 1fr); } }

/* ---------- "Esto es lo que recibís": pestañas + documentos de ejemplo ---------- */
.sw-tabs { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--sm-line); background: var(--sm-surface); }
.sw-tab { border: 0; cursor: pointer; padding: 10px 16px; border-radius: var(--sm-r-pill, 999px); background: transparent; color: var(--sm-ink-2); font: 700 .9rem var(--sm-font); }
.sw-tab[aria-selected="true"] { background: var(--sm-ink); color: var(--sm-bg); }
.sw-vitrina { border-radius: var(--sm-r-lg, 24px); background: var(--sw-band); border: 1px solid var(--sm-line); padding: 40px 20px; display: flex; justify-content: center; }
.sw-vitrina [role="tabpanel"][hidden] { display: none; }
.sw-vitrina [role="tabpanel"] { width: 100%; display: flex; justify-content: center; }
/* Los documentos imitan los reales del portal: van siempre claros, como el papel / la pantalla del cliente */
.sw-doc { width: 100%; max-width: 760px; background: #fff; color: #0f172a; border-radius: var(--sm-r-sm, 8px); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .35); font-family: 'Barlow', system-ui, sans-serif; font-size: 13px; }
.sw-doc b, .sw-doc strong { color: inherit; }
.sw-doc-mut { color: #64748b; }
.sw-doc-chico { font-size: 10px; font-weight: 800; letter-spacing: .06em; color: #475569; text-transform: uppercase; }
/* Orden (como la ve el cliente en el portal) */
.sw-doc--orden { background: #f1f4f9; overflow: hidden; border-radius: var(--sm-r-md, 16px); }
.sw-orden-top { background: #1d3a66; color: #fff; padding: 12px 18px; display: flex; justify-content: space-between; }
.sw-orden-top b { font-style: italic; font-size: 15px; }
.sw-orden-cuerpo { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.sw-orden-auto { background: linear-gradient(135deg, #1d3a66, #142a4c); color: #fff; border-radius: var(--sm-r-md, 14px); padding: 16px 18px; display: flex; justify-content: space-between; gap: 12px; }
.sw-orden-estado { display: inline-block; padding: 4px 10px; border-radius: var(--sm-r-pill, 999px); background: rgba(255, 255, 255, .16); font-weight: 700; font-size: 12px; }
.sw-orden-modelo { font-weight: 800; font-size: 22px; margin: 8px 0; }
.sw-orden-datos { display: flex; gap: 18px; font-size: 12px; margin-top: 8px; }
.sw-orden-datos b { display: block; font-size: 15px; }
.sw-orden-logo { width: 56px; height: 56px; border-radius: var(--sm-r-md, 14px); background: #fff; color: #1d3a66; display: grid; place-items: center; font-weight: 800; }
.sw-orden-caja { background: #fff; border-radius: var(--sm-r-md, 14px); padding: 12px 16px; }
.sw-orden-dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 6px; }
.sw-seguimiento { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 12px; text-align: center; font-size: 11px; font-weight: 700; position: relative; }
.sw-seguimiento::before { content: ''; position: absolute; left: 10%; right: 10%; top: 16px; height: 3px; background: linear-gradient(90deg, #1d3a66 55%, #e2e8f0 55%); }
.sw-seguimiento span { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.sw-seguimiento i { width: 34px; height: 34px; border-radius: var(--sm-r-pill, 999px); background: #1d3a66; color: #fff; display: grid; place-items: center; font-style: normal; }
.sw-seguimiento .actual i { box-shadow: 0 0 0 5px #cbd5e1; }
.sw-seguimiento .falta { color: #64748b; }
.sw-seguimiento .falta i { background: #e2e8f0; color: #64748b; }
.sw-orden-botones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sw-orden-botones span { text-align: center; padding: 11px; border-radius: var(--sm-r-pill, 999px); color: #fff; font-weight: 800; background: #1d3a66; }
.sw-orden-botones span + span { background: #16a34a; }
/* Informe de inspección (inspeccion_informe.php) */
.sw-doc--informe { padding: 30px 34px; }
.sw-informe-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; border-bottom: 3px solid #1d3a66; padding-bottom: 12px; }
.sw-informe-cab .tit { font-weight: 800; font-size: 20px; }
.sw-informe-auto { margin-top: 12px; background: #f1f4f9; border-radius: var(--sm-r-sm, 10px); padding: 10px 14px; display: flex; flex-wrap: wrap; gap: 20px; }
.sw-informe-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.sw-informe-kpis div { border: 1px solid #e2e8f0; border-top: 5px solid #cbd5e1; border-radius: var(--sm-r-sm, 10px); padding: 8px 10px; }
.sw-informe-kpis b { display: block; font-size: 22px; }
.sw-informe-kpis .ok { border-top-color: #16a34a; } .sw-informe-kpis .pronto { border-top-color: #d97706; } .sw-informe-kpis .ya { border-top-color: #dc2626; }
.sw-informe-caja { margin-top: 10px; border-left: 4px solid; border-radius: var(--sm-r-sm, 8px); padding: 10px 14px; }
.sw-informe-caja--ya { background: #fdecec; border-color: #dc2626; } .sw-informe-caja--ya .sw-doc-chico { color: #b91c1c; }
.sw-informe-caja--pronto { background: #fff7e0; border-color: #d97706; } .sw-informe-caja--pronto .sw-doc-chico { color: #92400e; }
.sw-informe-caja p { margin: 6px 0 0; }
.sw-informe-tabla { margin-top: 12px; }
.sw-informe-tabla .sec { background: #f1f4f9; padding: 6px 10px; font-weight: 800; }
.sw-informe-tabla .fila { display: grid; grid-template-columns: minmax(0, 1.4fr) 1fr 1fr; padding: 6px 10px; border-bottom: 1px solid #e2e8f0; }
.sw-punto { display: inline-block; width: 9px; height: 9px; border-radius: var(--sm-r-pill, 999px); margin-right: 6px; background: #16a34a; }
.sw-punto--pronto { background: #d97706; } .sw-punto--ya { background: #dc2626; }
/* Presupuesto online (aprobar_presupuesto.php) */
.sw-doc--presu { max-width: 560px; padding: 22px; font-family: 'Open Sans', 'Barlow', system-ui, sans-serif; font-size: 11px; }
.sw-presu-cab { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 2px solid #1d3a66; padding-bottom: 8px; }
.sw-presu-marca { font-weight: 800; font-style: italic; font-size: 19px; color: #1d3a66; }
.sw-presu-num { display: inline-block; background: #7c3aed; color: #fff; font-weight: 800; padding: 4px 8px; border-radius: var(--sm-r-xs, 4px); }
.sw-presu-cajas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.sw-presu-cajas div { border: 1px solid #e2e8f0; border-radius: var(--sm-r-xs, 6px); padding: 8px 10px; }
.sw-presu-motivo { margin-top: 10px; background: #f8fafc; border-left: 3px solid #7c3aed; padding: 6px 10px; }
.sw-presu-items { margin-top: 10px; }
.sw-presu-items .cab, .sw-presu-items .it { display: grid; grid-template-columns: minmax(0, 1fr) 40px 80px; padding: 6px 8px; }
.sw-presu-items .cab { background: #1d3a66; color: #fff; font-weight: 800; font-size: 9px; }
.sw-presu-items .it { border-bottom: 1px solid #e2e8f0; }
.sw-presu-items .it:nth-child(odd) { background: #fafbfc; }
.sw-presu-items .num { text-align: right; }
.sw-presu-badge { display: inline-block; font-size: 8px; padding: 1px 5px; border-radius: var(--sm-r-pill, 999px); background: #7c3aed; color: #fff; margin-left: 4px; }
.sw-presu-badge--rep { background: #f1f5f9; color: #334155; border: 1px solid #e2e8f0; }
.sw-presu-totales { margin: 10px 0 0 auto; width: 210px; display: flex; flex-direction: column; gap: 4px; }
.sw-presu-totales span { display: flex; justify-content: space-between; }
.sw-presu-totales .bonif { color: #dc2626; }
.sw-presu-totales .total { border-top: 2px solid #1d3a66; padding-top: 4px; font-size: 15px; font-weight: 800; }
.sw-presu-vig { margin: 12px 0 0; text-align: center; color: #64748b; font-size: 9px; }
.sw-presu-vig b { color: #7c3aed; }
.sw-presu-acc { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.sw-presu-acc span { text-align: center; padding: 10px; border-radius: var(--sm-r-xs, 6px); font-weight: 800; font-size: 12px; background: #198754; color: #fff; }
.sw-presu-acc span + span { background: #ffc107; color: #0f172a; }
@media (max-width: 640px) { .sw-informe-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sw-doc--informe { padding: 20px; } .sw-seguimiento { font-size: 9px; } }

/* ---------- Galería ---------- */
.sw-galeria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 230px; gap: 14px; }
.sw-foto { margin: 0; position: relative; overflow: hidden; border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface-2); }
.sw-foto img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--sm-dur-slow); }
.sw-foto:hover img { transform: scale(1.03); }
.sw-foto figcaption { position: absolute; left: 12px; bottom: 12px; padding: 6px 12px; border-radius: var(--sm-r-pill, 999px); background: rgba(8, 12, 20, .74); color: #fff; font-size: .82rem; font-weight: 700; }
.sw-foto--alta { grid-row: span 2; }
.sw-foto--ancha { grid-column: span 2; }
@media (max-width: 860px) { .sw-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 200px; } .sw-foto--ancha { grid-column: span 2; } }

/* ---------- Reseñas ---------- */
.sw-resenas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sw-resena { margin: 0; padding: 24px; border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface); border: 1px solid var(--sm-line); display: flex; flex-direction: column; gap: 12px; }
.sw-resena blockquote { margin: 0; font-size: 1rem; line-height: 1.6; }
.sw-resena figcaption { margin-top: auto; font-size: .88rem; color: var(--sm-muted); }
.sw-resena figcaption b { color: var(--sm-ink); }
.sw-puntaje { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.sw-puntaje-num { font-family: var(--sm-font-display); font-size: 2.6rem; font-weight: 800; line-height: 1; }
@media (max-width: 900px) { .sw-resenas { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Turno + contacto ---------- */
.sw-turno { background: var(--sw-hero); color: var(--sw-hero-ink); }
.sw-turno .sw-lead { color: var(--sw-hero-muted); }
.sw-turno .sw-eyebrow, .sw-pagina-hero .sw-eyebrow { color: var(--sw-acento); }
.sw-hero .sw-tarjeta .sw-eyebrow { color: var(--sw-link); }
.sw-turno-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; align-items: start; }
.sw-contacto { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; font-size: 1.02rem; }
.sw-contacto li { display: flex; gap: 12px; align-items: flex-start; }
.sw-contacto a { text-decoration: none; }
.sw-contacto .sw-ico { color: var(--sw-acento); }
.sw-mapa { margin-top: 22px; position: relative; border-radius: var(--sm-r-lg, 18px); overflow: hidden; border: 1px solid var(--sw-hero-line); background: var(--sw-hero-line); }
.sw-mapa iframe { display: block; width: 100%; height: 280px; border: 0; }
.sw-mapa-txt { position: absolute; right: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--sm-r-pill, 999px); background: rgba(8, 12, 20, .82); color: #fff; font-weight: 700; font-size: .9rem; text-decoration: none; }
.sw-mapa-txt:hover, .sw-mapa-txt:focus-visible { background: #000; }
@media (max-width: 900px) { .sw-turno-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Pie ---------- */
.sw-pie { background: var(--sw-pie-bg); color: #cbd5e1; padding: 56px 0 28px; font-size: .95rem; }
.sw-pie-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 32px; }
.sw-pie h4 { margin: 0 0 12px; color: #fff; font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; }
.sw-pie ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.sw-pie a { color: #cbd5e1; text-decoration: none; }
.sw-pie a:hover { color: #fff; }
.sw-pie-redes { display: flex; gap: 10px; margin-top: 16px; }
.sw-pie-redes a { width: 40px; height: 40px; border-radius: var(--sm-r-pill, 999px); display: grid; place-items: center; background: rgba(255, 255, 255, .08); }
.sw-pie-base { margin-top: 36px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .1); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: .85rem; color: #94a3b8; }
@media (max-width: 900px) { .sw-pie-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sw-pie-grid { grid-template-columns: minmax(0, 1fr); } }
.sw-wa-fab { position: fixed; right: 20px; bottom: 20px; z-index: 900; width: 58px; height: 58px; border-radius: var(--sm-r-pill, 999px); background: #25D366; color: #fff !important; display: grid; place-items: center;
    box-shadow: 0 12px 28px -8px rgba(0, 0, 0, .45); }
.sw-wa-fab svg { width: 30px; height: 30px; fill: currentColor; }
@media (max-width: 560px) { .sw-wa-fab { width: 52px; height: 52px; right: 14px; bottom: 14px; } }

/* ---------- Páginas de servicio ---------- */
.sw-pagina-hero { background: var(--sw-hero); color: var(--sw-hero-ink); padding: 48px 0 52px; }
.sw-migas { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 18px; padding: 0; font-size: .85rem; color: var(--sw-hero-muted); }
.sw-migas li + li::before { content: '›'; margin-right: 6px; }
.sw-migas a { text-decoration: none; }
.sw-pagina-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; }
.sw-pagina-hero .sw-lead { color: var(--sw-hero-muted); }
.sw-pagina-ico { width: 132px; height: 132px; border-radius: var(--sm-r-lg, 28px); display: grid; place-items: center; background: rgba(255, 255, 255, .1); color: var(--sw-hero-ink); box-shadow: inset 0 0 0 1px var(--sw-hero-line); }
.sw-pagina-ico svg { width: 80px; height: 80px; }
@media (max-width: 700px) { .sw-pagina-hero-grid { grid-template-columns: minmax(0, 1fr); } .sw-pagina-ico { display: none; } }
.sw-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
@media (max-width: 960px) { .sw-cols { grid-template-columns: minmax(0, 1fr); } }
.sw-texto { font-size: 1.05rem; line-height: 1.7; color: var(--sm-ink-2); }
.sw-texto h2 { color: var(--sm-ink); font-family: var(--sm-font-display); font-size: 1.7rem; line-height: 1.15; margin: 0 0 14px; }
.sw-texto h3 { color: var(--sm-ink); font-family: var(--sm-font-display); font-size: 1.25rem; margin: 34px 0 10px; }
.sw-texto p { margin: 0 0 14px; }
.sw-texto strong { color: var(--sm-ink); }
.sw-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.sw-lista li { display: flex; gap: 10px; align-items: flex-start; }
.sw-lista li::before { font-family: 'Material Symbols Rounded'; font-size: 1.25rem; line-height: 1.3; flex: 0 0 auto; content: 'check_circle'; color: var(--sm-ok); font-variation-settings: 'FILL' 1; }
.sw-lista--alerta li::before { content: 'warning'; color: var(--sm-warn); }
.sw-aside { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 16px; }
.sw-aside .sw-tarjeta { padding: 24px; box-shadow: var(--sm-shadow); }
.sw-cta-band { text-align: center; }
.sw-cta-band .sw-hero-acc { justify-content: center; }

/* ---------- Elegí tu auto: marca → modelo → motor → precio → turno (assets/js/sitio-reserva.js) ---------- */
.sw-wz { max-width: 980px; margin: 0 auto; }
.sw-wz-pasos { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 18px; list-style: none; padding: 0; }
.sw-wz-pasos li { display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--sm-line); background: var(--sm-surface); font-weight: 700; font-size: .88rem; color: var(--sm-muted); }
.sw-wz-pasos li span { width: 22px; height: 22px; border-radius: var(--sm-r-pill, 999px); display: grid; place-items: center; background: var(--sm-surface-2); font-size: .78rem; }
.sw-wz-pasos .is-hecho { color: var(--sm-ok); }
.sw-wz-pasos .is-hecho span { background: var(--sm-ok); color: #fff; }
.sw-wz-pasos .is-actual { background: var(--sm-ink); color: var(--sm-bg); border-color: var(--sm-ink); }
.sw-wz-pasos .is-actual span { background: rgba(255, 255, 255, .2); color: inherit; }
.sw-wz-caja { background: var(--sm-surface); border: 1px solid var(--sm-line); border-radius: var(--sm-r-lg, 22px); padding: 26px; box-shadow: var(--sm-shadow); }
.sw-wz-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.sw-migas-wz { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-weight: 700; font-size: .92rem; }
.sw-migas-wz button { border: 0; background: none; padding: 0; color: var(--sw-link); font: inherit; cursor: pointer; }
.sw-migas-wz span { color: var(--sm-muted); }
.sw-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px; }
.sw-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 120px; padding: 14px 10px; border: 1px solid var(--sm-line); border-radius: var(--sm-r-md, 16px);
    background: var(--sm-surface); color: var(--sm-ink); cursor: pointer; font: 800 .9rem var(--sm-font); text-align: center; line-height: 1.15; transition: transform var(--sm-dur-fast), border-color var(--sm-dur-fast); }
.sw-tile:hover, .sw-tile:focus-visible { transform: translateY(-3px); border-color: var(--sw-link); outline: none; }
.sw-tile-img { height: 54px; display: flex; align-items: center; justify-content: center; }
.sw-tile-img img { max-width: 100px; max-height: 54px; object-fit: contain; }
:root[data-tema="taller-pro"] .sw-tile-img img { filter: drop-shadow(0 0 1px rgba(255, 255, 255, .5)); }
.sw-tile-ph { width: 50px; height: 50px; border-radius: var(--sm-r-md, 14px); display: grid; place-items: center; background: var(--sw-icono-bg); color: var(--sw-icono-ink); font-size: 1.4rem; }
.sw-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.sw-pill { border: 2px solid var(--sm-line); background: var(--sm-surface); color: var(--sm-ink); border-radius: var(--sm-r-sm, 12px); padding: 12px 18px; font: 800 1rem var(--sm-font); cursor: pointer; }
.sw-pill:hover, .sw-pill:focus-visible, .sw-pill[aria-pressed="true"] { border-color: var(--sw-link); outline: none; }
.sw-wz-msj { padding: 30px 10px; text-align: center; color: var(--sm-muted); }
.sw-cargando::after { content: ''; display: inline-block; width: 1em; height: 1em; margin-left: 8px; vertical-align: -.15em; border: 2px solid currentColor; border-right-color: transparent; border-radius: var(--sm-r-pill, 999px); animation: sw-gira .8s linear infinite; }
@keyframes sw-gira { to { transform: rotate(360deg); } }
.sw-combos { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin-top: 18px; }
.sw-combos--uno { grid-template-columns: minmax(0, 1fr); }
.sw-combo { display: flex; flex-direction: column; border: 1px solid var(--sm-line); border-radius: var(--sm-r-lg, 18px); overflow: hidden; background: var(--sm-surface); }
.sw-combo-cuerpo { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.sw-combo-desc { color: var(--sm-muted); font-size: .92rem; margin: 0; }
.sw-combo ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: .94rem; }
.sw-combo li { display: flex; gap: 8px; }
.sw-combo li::before { content: 'check'; font-family: 'Material Symbols Rounded'; color: var(--sm-ok); font-size: 1.1rem; line-height: 1.3; }
.sw-combo .sw-bonif { color: var(--sm-ok); font-weight: 700; }
.sw-precio { margin-top: auto; padding-top: 8px; }
.sw-precio-num { display: block; font-family: var(--sm-font-display); font-size: 2.2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.sw-precio small { display: block; margin-top: 4px; font-size: .8rem; color: var(--sm-muted); }
.sw-combo .sw-btn { border-radius: 0; min-height: 54px; }
.sw-kit-tipo { align-self: flex-start; display: inline-flex; gap: 6px; align-items: center; padding: 5px 12px; border-radius: var(--sm-r-pill, 999px); background: var(--sm-surface-2); font-weight: 800; font-size: .82rem; }
.sw-wz-ayuda { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; padding: 14px 18px; border-radius: var(--sm-r-md, 14px); background: var(--sm-ok-bg); color: var(--sm-ok-ink); font-size: .94rem; }
.sw-planes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sw-plan { display: flex; flex-direction: column; gap: 6px; padding: 18px; border: 2px solid var(--sm-line); border-radius: var(--sm-r-md, 16px); background: var(--sm-surface); cursor: pointer; text-align: left; font: inherit; color: var(--sm-ink); }
.sw-plan[aria-pressed="true"] { border-color: var(--sw-link); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sw-link) 18%, transparent); }
.sw-plan b { font-size: 1.05rem; }
.sw-plan .sw-precio-num { font-size: 1.8rem; }
@media (max-width: 560px) { .sw-planes { grid-template-columns: minmax(0, 1fr); } .sw-wz-caja { padding: 18px; } }

/* Cuadro de reserva: <dialog> nativo (teclado, Escape y foco los resuelve el navegador) */
.sw-dialogo { width: min(520px, calc(100vw - 24px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: var(--sm-r-lg, 22px); background: var(--sm-surface); color: var(--sm-ink);
    box-shadow: 0 40px 100px -20px rgba(0, 0, 0, .55); }
.sw-dialogo::backdrop { background: rgba(8, 15, 30, .6); backdrop-filter: blur(3px); }
.sw-dialogo-in { padding: 24px; }
.sw-dialogo-cab { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.sw-dialogo-cab h2 { margin: 0; font-family: var(--sm-font-display); font-size: 1.35rem; }
.sw-dialogo-cab p { margin: 4px 0 0; color: var(--sm-muted); font-size: .92rem; }
.sw-cerrar { flex: 0 0 auto; width: 40px; height: 40px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--sm-line); background: var(--sm-surface-2); color: var(--sm-ink); cursor: pointer; font-size: 1.2rem; }

/* Piezas de los formularios armados por JS */
.sw-trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.sw-sin-borde { border: 0; margin: 0; padding: 0; min-width: 0; }
.sw-sin-borde legend { padding: 0; margin-bottom: 6px; }
.sw-wz-cab h2:focus, .sw-listo:focus { outline: none; }
.sw-listo-chapa { display: flex; justify-content: center; margin: 14px 0; }
.sw-listo-chapa :is(.patente-mercosur, .patente-old) { --pat-fs: 30px; }
.sw-listo .sw-precio { margin: 0 0 16px; }
.sw-plan .sw-servicio-ico { width: 48px; height: 48px; font-size: 1.3rem; }
/* sm-telefono.js usa los íconos "outlined" del panel; en los sitios se carga sólo la familia Rounded */
.sw-html .material-symbols-outlined { font-family: 'Material Symbols Rounded'; font-weight: normal; font-style: normal; line-height: 1; letter-spacing: normal; text-transform: none; white-space: nowrap; direction: ltr; -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga'; }


/* ---------- Íconos de servicio dibujados (includes/sitio.php → sw_icono_servicio): cuerpo, trazo y acento ---------- */
.sw-isvc { width: 1em; height: 1em; overflow: visible; --sw-isvc-acento: var(--sw-acento); }
.sw-servicio-ico .sw-isvc { width: 36px; height: 36px; }
.sw-isvc .c { fill: currentColor; opacity: .17; stroke: none; }
.sw-isvc .t { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.sw-isvc .a { fill: none; stroke: var(--sw-isvc-acento); stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; }
.sw-isvc .t.f { fill: currentColor; }
.sw-isvc .a.f { fill: var(--sw-isvc-acento); }
.sw-isvc .g { stroke-width: 5.5; }
:root:not([data-tema="taller-pro"]) .sw-servicio-ico .sw-isvc { --sw-isvc-acento: #e09b0b; }

/* ---------- Piezas de las páginas (tanda S1) ---------- */
.sw-solo-cel { display: none; }
@media (max-width: 1180px) { .sw-solo-cel { display: inline; } }
.sw-estrellas { display: inline-flex; gap: 1px; color: var(--sw-acento); vertical-align: -.2em; }
.sw-estrellas .sw-ico { font-size: 1.05em; }
.sw-estrellas .is-llena { font-variation-settings: 'FILL' 1, 'wght' 500; }
.sw-hero-dato { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; }
.sw-hero-dato .sw-ico { color: var(--sw-acento); }
.sw-mi-auto .sm-chapa-campo { align-self: flex-start; }
.sw-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.sw-h1--pagina { font-size: clamp(2rem, 4vw, 3rem); }
.sw-lead--centro { margin-left: auto; margin-right: auto; text-align: center; }
.sw-seccion--wz { padding-top: 40px; }

.sw-oferta-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.sw-oferta-ico { width: 46px; height: 46px; color: var(--sw-link); }
.sw-oferta--destacada .sw-oferta-ico { color: var(--sw-acento-ink); --sw-isvc-acento: #ffffff; }

.sw-razones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sw-razones .sw-servicio:hover { transform: none; }
.sw-razones .sw-servicio-txt { margin: 0; }
.sw-razones .sw-servicio-ico .sw-ico, .sw-plan .sw-servicio-ico .sw-ico { font-size: 1.8rem; }
@media (max-width: 900px) { .sw-razones { grid-template-columns: minmax(0, 1fr); } }

.sw-chequeo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.sw-chequeo-cat { border: 1px solid var(--sm-line); border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface); overflow: hidden; }
.sw-chequeo-cat h3 { margin: 0; display: flex; align-items: center; gap: 10px; padding: 14px 18px; background: var(--sw-hero); color: var(--sw-hero-ink); font: 800 1.05rem var(--sm-font-display); }
.sw-chequeo-cat h3 .sw-ico { color: var(--sw-acento); }
.sw-chequeo-cat .sw-lista { padding: 16px 18px 18px; }
@media (max-width: 720px) { .sw-chequeo { grid-template-columns: minmax(0, 1fr); } }

.sw-mini { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 18px 0; }
.sw-mini--nota { grid-template-columns: minmax(0, 1fr); }
.sw-mini-caja { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; border-radius: var(--sm-r-md, 16px); background: var(--sw-band); border: 1px solid var(--sm-line); }
.sw-mini--nota .sw-mini-caja { border-left: 4px solid var(--sw-link); }
.sw-mini-caja > b { color: var(--sm-ink); font-size: 1.02rem; }
.sw-mini-caja p { margin: 0; }
.sw-mini-caja .sw-btn { align-self: flex-start; }
.sw-texto-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 8px 0 18px; }
.sw-texto-cols h2 { font-size: 1.3rem; }
.sw-cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 18px 0 8px; }
.sw-cifras div { padding: 14px; border-radius: var(--sm-r-md, 14px); background: var(--sw-band); text-align: center; }
.sw-cifras b { display: block; font: 800 1.5rem var(--sm-font-display); color: var(--sm-ink); }
.sw-cifras span { font-size: .8rem; font-weight: 700; color: var(--sm-muted); }
@media (max-width: 640px) { .sw-mini, .sw-texto-cols { grid-template-columns: minmax(0, 1fr); } .sw-cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sw-lista--2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 560px) { .sw-lista--2col { grid-template-columns: minmax(0, 1fr); } }
.sw-foto--lado { aspect-ratio: 3 / 4; position: sticky; top: 96px; }

.sw-aside-acc { display: flex; flex-direction: column; gap: 10px; }
.sw-aside-tit { margin: 22px 0 12px; padding-top: 18px; border-top: 1px solid var(--sm-line); font: 800 1rem var(--sm-font-display); }
.sw-aside .sw-lista { font-size: .95rem; }
.sw-aside-pie { margin: 16px 0 0; font-size: .85rem; color: var(--sm-muted); line-height: 1.7; }
.sw-aside-pie .sw-ico { margin-right: 4px; }
.sw-wz-ayuda-acc { display: flex; flex-wrap: wrap; gap: 8px; }

.sw-doc-chapa { --pat-fs: 15px; margin-top: 2px; }

.sw-notas-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sw-nota { display: flex; flex-direction: column; gap: 10px; padding: 20px; border-radius: var(--sm-r-lg, 18px); background: var(--sm-surface); border: 1px solid var(--sm-line); text-decoration: none; transition: transform var(--sm-dur); }
.sw-nota:hover { transform: translateY(-3px); }
.sw-nota-meta { font-size: .8rem; font-weight: 700; color: var(--sw-link); }
.sw-nota-tit { font: 800 1.08rem/1.35 var(--sm-font-display); color: var(--sm-ink); }
@media (max-width: 900px) { .sw-notas-grid { grid-template-columns: minmax(0, 1fr); } }

.sw-pie-txt { margin: 16px 0 0; line-height: 1.6; max-width: 320px; }
.sw-pie-h4-2 { margin-top: 22px !important; }
.sw-pie-contacto li { display: flex; gap: 10px; align-items: flex-start; }
.sw-pie-contacto .sw-ico, .sw-pie-contacto .sw-svg { color: var(--sm-accent, #FEBC35); flex: 0 0 auto; }
.sw-pie-redes svg { width: 20px; height: 20px; fill: currentColor; }

.sw-error-acc { justify-content: center; }
.sw-error-links { list-style: none; padding: 0; margin: 28px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; }



/* ---------- Sitios satélite (rosariocorreadistribucion, checkmotors): marca, planes, galería ---------- */
.sw-marca { display: inline-flex; align-items: center; gap: 12px; }
.sw-submarca { display: flex; align-items: center; gap: 10px; padding-left: 12px; border-left: 2px solid var(--sm-line); text-decoration: none; color: var(--sm-ink) !important; min-width: 0; }
.sw-submarca-ico { flex: 0 0 auto; width: 40px; height: 40px; border-radius: var(--sm-r-sm, 10px); display: grid; place-items: center; background: var(--sw-icono-bg); color: var(--sw-icono-ink); box-shadow: inset 0 0 0 1px var(--sm-line); }
.sw-submarca-ico .sw-isvc { width: 27px; height: 27px; }
.sw-submarca-txt { display: flex; flex-direction: column; gap: 2px; line-height: 1.05; min-width: 0; }
.sw-submarca-txt b { font: 800 1.08rem/1 'Barlow Condensed', 'Arial Narrow', sans-serif; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; }
.sw-submarca-txt small { font-size: .72rem; font-weight: 600; color: var(--sm-muted); white-space: nowrap; }
@media (max-width: 1320px) { .sw-submarca-txt small { display: none; } }
@media (max-width: 560px) { .sw-submarca-txt { display: none; } .sw-submarca { padding-left: 8px; } }
@media (max-width: 420px) { .sw-submarca { display: none; } }
.sw-ofertas--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sw-oferta .sw-lista { font-size: .95rem; }
.sw-oferta > .sw-btn { align-self: flex-start; margin-top: auto; }
.sw-oferta--destacada .sw-lista li::before { color: var(--sw-acento-ink); }
.sw-oferta-cab > .sw-ico.sw-oferta-ico { font-size: 2.2rem; width: auto; height: auto; }
.sw-razones--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sw-galeria--cm { grid-auto-rows: 220px; }
.sw-galeria--cm .sw-foto img { transform-origin: var(--sw-ox, 50%) var(--sw-oy, 50%); }
@media (max-width: 900px) { .sw-ofertas--2, .sw-razones--6 { grid-template-columns: minmax(0, 1fr); } }


/* Acceso clientes: botón en la barra (escritorio), última opción del menú (celular) */
.sw-nav .sw-nav-acceso { display: none; }
@media (max-width: 1400px) { .sw-top-acc .sw-acceso { padding: 0 11px; font-size: 0; gap: 0; } .sw-top-acc .sw-acceso .sw-ico { font-size: 1.25rem; } }
@media (max-width: 1180px) {
    .sw-top-acc .sw-acceso { display: none; }
    .sw-nav .sw-nav-acceso { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 8px; border: 1px solid var(--sm-line); font-weight: 800; color: var(--sm-ink); }
}

/* Las personas que atienden (turnos de la portada) */
.sw-personas-tit { margin: 24px 0 0; font-weight: 800; }
.sw-personas { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.sw-persona { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--sm-r-md, 14px); background: rgba(255, 255, 255, .08); border: 1px solid var(--sw-hero-line); }
.sw-persona-ini { flex: 0 0 auto; width: 42px; height: 42px; border-radius: var(--sm-r-pill, 999px); display: grid; place-items: center; background: var(--sw-acento); color: var(--sw-acento-ink); font: 800 1.2rem 'Barlow Condensed', sans-serif; }
.sw-persona-txt { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.sw-persona-txt small { color: var(--sw-hero-muted); font-size: .84rem; }
.sw-persona .sw-btn { flex: 0 0 auto; }
@media (max-width: 480px) { .sw-persona { flex-wrap: wrap; } .sw-persona .sw-btn { width: 100%; } }
.sw-pie-contacto a small { display: block; font-size: .78rem; color: #94a3b8; }


/* Listas largas del asistente: buscador, filtro por cilindrada y motores en lista compacta */
.sw-buscar { position: relative; display: flex; align-items: center; margin-bottom: 14px; }
.sw-buscar > .sw-ico { position: absolute; left: 14px; color: var(--sm-muted); pointer-events: none; }
.sw-buscar .sw-buscar-in { padding-left: 44px; padding-right: 120px; }
.sw-buscar-cuenta { position: absolute; right: 14px; font-size: .8rem; font-weight: 700; color: var(--sm-muted); }
.sw-chips-filtro { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.sw-chip { border: 1px solid var(--sm-line); background: var(--sm-surface); color: var(--sm-ink-2); border-radius: var(--sm-r-pill, 999px); padding: 7px 14px; font: 700 .86rem var(--sm-font); cursor: pointer; }
.sw-chip[aria-pressed="true"] { background: var(--sm-ink); border-color: var(--sm-ink); color: var(--sm-bg); }
.sw-motores { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 420px; overflow-y: auto; padding: 2px 4px 2px 2px; }
.sw-motor { text-align: left; border: 1px solid var(--sm-line); background: var(--sm-surface); color: var(--sm-ink); border-radius: var(--sm-r-sm, 10px); padding: 11px 14px; font: 600 .92rem/1.25 var(--sm-font); cursor: pointer; }
.sw-motor:hover, .sw-motor:focus-visible { border-color: var(--sw-link); outline: none; background: var(--sm-surface-2); }
.sw-motor[aria-pressed="true"] { border-color: var(--sw-link); box-shadow: inset 3px 0 0 var(--sw-link); }
.sw-motor-elegido { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border-radius: var(--sm-r-md, 14px); background: var(--sm-surface-2); border: 1px solid var(--sm-line); scroll-margin-top: 90px; }
.sw-motor-elegido-txt { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sw-motor-elegido-txt .sw-ico { color: var(--sw-link); }
@media (max-width: 640px) { .sw-motores { grid-template-columns: minmax(0, 1fr); max-height: 360px; } .sw-buscar .sw-buscar-in { padding-right: 14px; } .sw-buscar-cuenta { display: none; } }

/* ---------- Celular: más compacto, el formulario primero, nada que se desborde ---------- */
@media (max-width: 640px) {
    .sw-seccion { padding: 56px 0; }
    .sw-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; max-width: 100%; border-radius: var(--sm-r-md, 16px); scrollbar-width: none; }
    .sw-tab { white-space: nowrap; flex: 0 0 auto; }
    .sw-vitrina { padding: 16px 10px; }
    .sw-seguimiento { font-size: 8px; }
    .sw-seguimiento span { min-width: 0; overflow-wrap: anywhere; }
    .sw-mapa iframe { height: 220px; }
}
@media (max-width: 420px) {
    .sw-top-in { gap: 10px; }
    .sw-top-acc { gap: 6px; }
    .sw-top-acc .sw-btn--chico { padding: 0 11px; }
    .sw-top-acc .sw-solo-cel { display: none; }
    .sw-tema-btn, .sw-menu-btn { width: 38px; height: 38px; }
}
@media (max-width: 560px) {
    .sw-servicios { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .sw-servicio { padding: 16px; gap: 8px; }
    .sw-servicio .sw-h3 { font-size: 1rem; }
    .sw-servicios .sw-servicio-txt, .sw-servicios .sw-servicio-mas { display: none; }
    .sw-servicio-ico { width: 48px; height: 48px; }
    .sw-servicio-ico .sw-isvc { width: 30px; height: 30px; }
}

/* ---------- Página de error ---------- */
.sw-error { min-height: 60vh; display: grid; place-items: center; text-align: center; padding: 60px 20px; }
.sw-error .sw-cartel { margin-bottom: 24px; }
.sw-error-cod { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 6rem; line-height: 1; color: var(--sw-link); }

/* Aparición suave al entrar en pantalla (sitio-web.js agrega .is-visto; sin JS todo se ve igual) */
@media (prefers-reduced-motion: no-preference) {
    .sw-js .sw-revelar { opacity: 0; transform: translateY(14px); transition: opacity .5s var(--sm-ease), transform .5s var(--sm-ease); }
    .sw-js .sw-revelar.is-visto { opacity: 1; transform: none; }
}

/* ===================================================================================================================
   Portada a pantalla fija (servicemotors.com.ar/index.php, tanda S2)
   Escritorio: panel de marca (izq., el azul profundo de clientes/admin.php) + escenario blanco (der.) donde se abre un
   panel por vez con el dock flotante. Celular: el panel de marca es la portada y cada panel sube como hoja.
   Lo fijo sólo rige con JS (.sw-js lo pone sitio-tema.js): sin JS la página se ve entera, una sección abajo de la otra.
   Oscuro: Taller Pro (DOCS/UX-DEMOS/01-taller-pro.html). Prefijo: swi- (sitio, inicio). JS: sitio-inicio.js.
   =================================================================================================================== */
.sw-html--fija {
    --swi-col: clamp(420px, 40vw, 820px);   /* ancho del panel de marca: el dock (fixed) se centra con esto sobre el escenario */
    --swi-marca: #0d1b2e;
    --swi-marca-ink: #ffffff;
    --swi-marca-muted: #c3cfdf;
    --swi-marca-linea: rgba(255, 255, 255, .14);
    --swi-marca-chip: rgba(255, 255, 255, .07);
    --swi-escena: #ffffff;
    --swi-borde: #dfe3ea;
    --swi-top-bg: #17355C;
    --swi-top-ink: #ffffff;
    --swi-top-muted: #c3cfdf;
    --swi-top-acento: #FEBC35;
    --swi-dock: rgba(13, 27, 46, .92);
    --swi-dock-ink: #c3cfdf;
    --swi-dock-on: #FEBC35;
    --swi-dock-on-ink: #0d1b2e;
    --swi-brillo: none;
}
:root.sw-html--fija:not([data-tema="taller-pro"]) { --sm-bg: #ffffff; --sw-band: #F3F1EC; }
:root[data-tema="taller-pro"].sw-html--fija {
    --swi-marca: radial-gradient(900px 520px at 100% 0%, rgba(254, 188, 53, .10), transparent 60%), #070a10;
    --swi-marca-muted: #a7b4c6;
    --swi-marca-linea: rgba(255, 255, 255, .1);
    --swi-marca-chip: rgba(255, 255, 255, .05);
    --swi-escena: #0b0f17;
    --swi-borde: rgba(255, 255, 255, .08);
    --swi-top-bg: #FEBC35;
    --swi-top-ink: #0b0f17;
    --swi-top-muted: #3b2f12;
    --swi-top-acento: #0b0f17;
    --swi-dock: rgba(18, 24, 38, .94);
    --swi-dock-ink: #a7b4c6;
    --swi-brillo: 0 0 40px rgba(254, 188, 53, .25);
}

/* ---------- Panel de marca ---------- */
.swi-marca { --sw-titulo: var(--swi-marca-ink); background: var(--swi-marca); color: var(--swi-marca-ink); display: flex; flex-direction: column; gap: 20px; padding: 28px clamp(20px, 3.2vw, 52px) 24px; }
.swi-marca-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.swi-marca-acc { display: flex; gap: 8px; }
.swi-chico { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 16px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--swi-marca-linea);
    background: var(--swi-marca-chip); color: var(--swi-marca-ink) !important; font: 700 .9rem/1 var(--sm-font); text-decoration: none; cursor: pointer; white-space: nowrap; }
.swi-chico:hover { border-color: var(--swi-marca-muted); }
.swi-chico:focus-visible { outline: 3px solid var(--sw-acento); outline-offset: 2px; }
.swi-chico--redondo { width: 42px; padding: 0; }
.swi-ico-oscuro, :root[data-tema="taller-pro"] .swi-ico-claro { display: none; }
:root[data-tema="taller-pro"] .swi-ico-oscuro { display: inline-block; }
.swi-marca-centro { margin-top: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.swi-estado { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--sm-r-pill, 999px); background: var(--swi-marca-chip); border: 1px solid var(--swi-marca-linea); font-size: .88rem; font-weight: 600; color: var(--swi-marca-muted); }
.swi-estado b { color: var(--swi-marca-ink); }
.swi-estado i { width: 8px; height: 8px; border-radius: 50%; background: var(--swi-marca-muted); flex: 0 0 auto; }
.swi-estado.is-abierto i { background: #4ade80; box-shadow: 0 0 0 4px rgba(74, 222, 128, .2); }
.swi-h1 { font-size: clamp(2.6rem, 4.4vw, 4.6rem); text-shadow: var(--swi-brillo); }
.swi-lead { margin: 0; max-width: 34em; font-size: 1.08rem; line-height: 1.55; color: var(--swi-marca-muted); }
.swi-hero-acc { display: flex; flex-wrap: wrap; gap: 10px; }
.swi-datos { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .9rem; color: var(--swi-marca-muted); }
.swi-datos b { color: var(--swi-marca-ink); }
.swi-marca-pie { display: flex; flex-direction: column; gap: 14px; padding-top: 16px; border-top: 1px solid var(--swi-marca-linea); }
.swi-personas { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.swi-personas .sw-persona { flex-wrap: wrap; gap: 8px 10px; padding: 10px 12px; background: var(--swi-marca-chip); border-color: var(--swi-marca-linea); }
.swi-personas .sw-persona-ini { width: 36px; height: 36px; font-size: 1.05rem; }
.swi-personas .sw-persona-txt small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--swi-marca-muted); }
.swi-personas .sw-persona .sw-btn { width: 100%; min-height: 36px; }
.swi-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: .86rem; }
.swi-links a { color: var(--swi-marca-muted); text-decoration: none; }
.swi-links a:hover { color: var(--swi-marca-ink); }
.swi-redes { margin-left: auto; display: inline-flex; gap: 12px; }
.swi-redes .sw-svg { width: 18px; height: 18px; }

/* ---------- Escenario y paneles ---------- */
.swi-escena { background: var(--swi-escena); outline: none; }
.swi-panel { display: flex; flex-direction: column; gap: 16px; width: 100%; max-width: 900px; margin: 0 auto; padding: 40px 0; }
.swi-panel-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.swi-panel-cab .sw-h2 { font-size: clamp(1.9rem, 2.8vw, 2.7rem); }
.swi-sub { margin: 6px 0 0; color: var(--sm-muted); font-size: .98rem; max-width: 46em; }
.swi-cerrar { display: none; flex: 0 0 auto; width: 40px; height: 40px; border-radius: var(--sm-r-pill, 999px); border: 1px solid var(--swi-borde); background: var(--sm-surface); color: var(--sm-ink); cursor: pointer; place-items: center; }
.swi-cuerpo { display: flex; flex-direction: column; gap: 14px; }
.swi-escena :is(.sw-oferta, .sw-resena, .sw-paso, .swi-servicio, .swi-camino, .swi-tarjeta) { border: 1px solid var(--swi-borde); box-shadow: var(--sm-shadow); }
.swi-tarjeta { padding: 22px; }

/* Inicio */
.swi-caminos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.swi-camino { display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: var(--sm-r-lg, 20px); background: var(--sm-surface); color: var(--sm-ink); text-decoration: none; transition: transform var(--sm-dur), border-color var(--sm-dur); }
.swi-camino:hover { transform: translateY(-3px); border-color: var(--sw-link); }
.swi-camino > .sw-ico { font-size: 1.9rem; color: var(--sw-link); }
.swi-camino b { font: 700 1.3rem/1.15 var(--sm-font); color: var(--sw-titulo, var(--sm-ink)); }
.swi-camino span:not(.sw-ico) { font-size: .93rem; color: var(--sm-muted); }
.swi-camino em { margin-top: auto; padding-top: 6px; font-style: normal; font-weight: 800; font-size: .9rem; color: var(--sw-link); }
.swi-camino--top { background: var(--swi-top-bg); border-color: var(--swi-top-bg) !important; }
.swi-camino--top b, .swi-camino--top > .sw-ico { color: var(--swi-top-ink); }
.swi-camino--top span:not(.sw-ico) { color: var(--swi-top-muted); }
.swi-camino--top em { color: var(--swi-top-acento); }
.swi-franja { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.swi-franja div { display: flex; flex-direction: column; padding: 14px 16px; border-radius: var(--sm-r-md, 14px); background: var(--sw-band); }
.swi-franja b { font: 800 2rem/1 var(--sm-font-display); color: var(--sw-titulo, var(--sm-ink)); font-variant-numeric: tabular-nums; }
.swi-franja span { font-size: .86rem; color: var(--sm-muted); }

/* Turno: en escritorio, grilla de 3 (nombre · WhatsApp · patente / auto · qué le pasa · horario) para que entre sin scroll */
.swi-form { gap: 12px; }
@media (min-width: 901px) {
    .swi-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 14px; }
    .swi-form .sw-form-fila { display: contents; }
    .swi-form > :not(.sw-form-fila) { grid-column: 1 / -1; }
    .swi-form .sm-chapa-campo :is(.patente-mercosur, .patente-old) { --pat-fs: 26px; }
}
.swi-form .sw-input { min-height: 44px; padding-top: 9px; padding-bottom: 9px; }
.swi-dias { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.swi-dias .sw-opcion span { min-width: 58px; padding: 7px 8px; }

/* Servicios */
.swi-servicios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.swi-servicio { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: var(--sm-r-md, 14px); background: var(--sm-surface); color: var(--sm-ink); text-decoration: none; transition: border-color var(--sm-dur); }
.swi-servicio:hover { border-color: var(--sw-link); }
.swi-servicio .sw-servicio-ico { width: 46px; height: 46px; flex: 0 0 auto; }
.swi-servicio .sw-servicio-ico svg { width: 28px; height: 28px; }
.swi-servicio-txt { display: flex; flex-direction: column; min-width: 0; }
.swi-servicio-txt b { font-size: 1rem; color: var(--sw-titulo, var(--sm-ink)); }
.swi-servicio-txt span { font-size: .84rem; color: var(--sm-muted); line-height: 1.35; }
.swi-mas { align-self: flex-start; }

/* Cómo trabajamos */
.swi-pasos { gap: 10px; }
.swi-pasos .sw-paso { padding: 16px; }
.swi-pasos .sw-paso::before { font-size: 1.8rem; margin-bottom: 6px; }
.swi-pasos .sw-paso p { margin: 4px 0 0; font-size: .86rem; color: var(--sm-muted); line-height: 1.4; }
.sw-vitrina-compacta { display: flex; flex-direction: column; gap: 10px; }
.sw-vitrina-compacta-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; }
.sw-vitrina-compacta-tit { margin: 0; font-size: .92rem; color: var(--sm-muted); }
.sw-vitrina-compacta-tit b { color: var(--sm-ink); }
.sw-vitrina-compacta .sw-vitrina { padding: 20px 14px; }

/* Opiniones */
.swi-puntaje { justify-content: flex-start; }
.swi-escena .sw-resena { padding: 18px; }
.swi-escena .sw-resena blockquote { font-size: .93rem; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }

/* El taller */
.swi-taller { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; }
.swi-mapa { margin-top: 0; min-height: 320px; border-color: var(--swi-borde); }
.swi-mapa iframe { height: 100%; min-height: 320px; }
.swi-taller-lado { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.swi-contacto { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: .95rem; }
.swi-contacto li { display: flex; align-items: center; gap: 10px; min-width: 0; }
.swi-contacto .sw-ico { color: var(--sw-link); }
.swi-contacto a { color: var(--sm-ink); overflow-wrap: anywhere; }
.swi-fotos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.swi-fotos .sw-foto { aspect-ratio: 4 / 3; border-radius: var(--sm-r-md, 14px); }

/* Acceso */
.swi-acceso { max-width: 460px; }
.swi-acceso-chapa { align-items: flex-start; }

/* Dock */
.swi-dock { display: none; }
.swi-dock a { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 80px; padding: 9px 10px 7px; border-radius: var(--sm-r-md, 16px); color: var(--swi-dock-ink); font-size: .78rem; font-weight: 700; text-decoration: none; text-align: center; line-height: 1.15; transition: background var(--sm-dur-fast), color var(--sm-dur-fast); }
.swi-dock a .sw-ico { font-size: 1.5rem; }
.swi-dock a:hover { color: #ffffff; background: rgba(255, 255, 255, .08); }
.swi-dock a[aria-current="true"] { background: var(--swi-dock-on); color: var(--swi-dock-on-ink); }
.swi-dock a[aria-current="true"] .sw-ico { font-variation-settings: 'FILL' 1, 'wght' 500; }
.swi-dock a:focus-visible { outline: 3px solid var(--sw-acento); outline-offset: 2px; }
.swi-velo { display: none; }

/* ---------- Lo fijo (con JS) ---------- */
.sw-js.sw-html--fija, .sw-js.sw-html--fija body { height: 100%; overflow: hidden; }
.sw-js .swi { height: 100%; display: grid; grid-template-columns: var(--swi-col) minmax(0, 1fr); }
.sw-js .swi-marca { min-height: 0; overflow: hidden; }
.sw-js .swi-escena { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: 28px clamp(20px, 3.2vw, 52px) 112px; }
.sw-js .swi-panel { display: none; padding: 0; }
.sw-js .swi-panel.is-activo { display: flex; margin: auto; max-height: 100%; min-height: 0; animation: swi-entra var(--sm-dur-slow) var(--sm-ease); }
.sw-js .swi-cuerpo { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 4px; margin: -4px; scrollbar-width: thin; }
.sw-js .swi-dock { display: flex; gap: 4px; position: fixed; left: calc(var(--swi-col) + (100vw - var(--swi-col)) / 2); bottom: 22px; transform: translateX(-50%); z-index: 20; padding: 6px; border-radius: var(--sm-r-lg, 22px);
    background: var(--swi-dock); border: 1px solid var(--swi-marca-linea); backdrop-filter: blur(14px) saturate(1.4); box-shadow: 0 20px 40px -16px rgba(5, 10, 20, .55); }
@keyframes swi-entra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Notebooks bajas: más compacto para que entre sin scroll */
@media (min-width: 901px) and (max-height: 820px) {
    .sw-js .swi-marca { gap: 14px; padding-top: 20px; padding-bottom: 18px; }
    .sw-js .swi-h1 { font-size: clamp(2.4rem, 3.8vw, 3.8rem); }
    .sw-js .swi-lead { font-size: .98rem; }
    .sw-js .swi-marca-centro { gap: 12px; }
    .sw-js .swi-escena { padding-top: 20px; padding-bottom: 100px; }
    .sw-js .swi-dock { bottom: 14px; }
    .swi-tarjeta { padding: 16px 18px; }
}
@media (min-width: 901px) and (max-height: 700px) {
    .sw-js .swi-lead, .sw-js .swi-links { display: none; }
}
@media (min-width: 901px) and (max-width: 1240px) {
    .sw-html--fija { --swi-col: clamp(360px, 38vw, 480px); }
    .swi-personas { grid-template-columns: minmax(0, 1fr); }
    .swi-personas .sw-persona { flex-wrap: nowrap; }
    .swi-personas .sw-persona .sw-btn { width: auto; }
    .swi-dock a { min-width: 64px; padding-inline: 6px; }
    .swi-caminos, .swi-franja { grid-template-columns: minmax(0, 1fr); }
    .swi-camino { padding: 16px 18px; }
    .swi-franja { display: none; }
    .swi-servicio-txt span { display: none; }
    .swi-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .swi-taller { grid-template-columns: minmax(0, 1fr); }
    .swi-escena .sw-resenas { grid-template-columns: minmax(0, 1fr); }
    .sw-js .swi-panel.is-activo .sw-ofertas { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Celular: portada + hoja ---------- */
@media (max-width: 900px) {
    .swi-marca { padding: 16px 16px 24px; gap: 14px; }
    .swi-chico-txt { display: none; }
    .swi-chico { width: 42px; padding: 0; }
    .swi-h1 { font-size: clamp(2.3rem, 10.5vw, 3.3rem); }
    .swi-lead { font-size: .98rem; }
    .swi-hero-acc { width: 100%; }
    .swi-hero-acc .sw-btn { flex: 1; padding: 0 14px; }
    .swi-hero-acc .sw-btn .sw-ico { display: none; }
    .swi-personas { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .swi-personas .sw-persona { flex-wrap: nowrap; padding: 8px 10px; }
    .swi-personas .sw-persona .sw-btn { width: auto; }
    .swi-panel { padding: 32px 16px; }
    .swi-caminos, .swi-franja, .swi-taller, .swi-servicios { grid-template-columns: minmax(0, 1fr); }
    .swi-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .swi-servicio-txt span { display: none; }
    .swi-escena .sw-resenas { grid-template-columns: minmax(0, 1fr); }

    .sw-js .swi { grid-template-columns: minmax(0, 1fr); }
    .sw-js .swi-marca { height: 100%; padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
    .sw-js .swi-escena { position: fixed; left: 0; right: 0; bottom: 0; max-height: calc(100% - 52px); padding: 10px 16px calc(96px + env(safe-area-inset-bottom, 0px));
        border-radius: var(--sm-r-lg, 22px) var(--sm-r-lg, 22px) 0 0; box-shadow: 0 -20px 40px -10px rgba(0, 0, 0, .4); z-index: 950;
        transform: translateY(105%); transition: transform var(--sm-dur-slow) var(--sm-ease); }
    .sw-js .swi-escena::before { content: ''; flex: 0 0 auto; align-self: center; width: 44px; height: 5px; border-radius: var(--sm-r-xs, 3px); background: var(--swi-borde); margin-bottom: 10px; }
    .sw-js.swi-hoja .swi-escena { transform: none; }
    .sw-js .swi-panel.is-activo { margin: 0; animation: none; }
    .sw-js .swi-cerrar { display: grid; }
    .sw-js .swi-velo { display: block; position: fixed; inset: 0; z-index: 940; background: rgba(5, 10, 20, .55); }
    .sw-js .swi-velo[hidden] { display: none; }
    .sw-js .swi-dock { position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); transform: none; justify-content: space-between; z-index: 960; }
    .sw-js .swi-dock a { min-width: 0; flex: 1; padding: 8px 2px 6px; font-size: .66rem; }
    .sw-js .swi-dock a .sw-ico { font-size: 1.4rem; }
    .sw-js .swi-fab { display: none; }
    .swi-tarjeta { padding: 16px; }
    .swi-mapa, .swi-mapa iframe { min-height: 220px; }
}
@media (max-width: 900px) and (max-height: 740px) {
    .sw-js .swi-lead { display: none; }
    .sw-js .swi-dato-anios { display: none; }
}
@media (max-width: 900px) and (max-height: 600px) {
    .sw-js .swi-marca-pie { display: none; }
    .sw-js .swi-fab { display: grid; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) {
    .sw-js .swi-panel.is-activo { animation: none; }
    .sw-js .swi-escena { transition: none; }
}
