#header{display:block;min-height:var(--ds-header, 64px);box-sizing:border-box}#footer{display:block;min-height:380px;box-sizing:border-box;background:var(--ds-navy)}@media(max-width:760px){#footer{min-height:620px}}.ds-header{position:fixed;inset:0 0 auto;z-index:1000;height:var(--ds-header);background:#ffffffdb;border-bottom:1px solid rgba(11,79,159,.12);backdrop-filter:blur(18px)}.ds-nav{display:flex;align-items:center;justify-content:center;width:min(100% - var(--ds-gx),var(--ds-max-data));height:100%;margin:0 auto;gap:16px}.ds-brand{display:inline-flex;align-items:center;gap:10px;min-width:max-content;color:var(--ds-navy);font-weight:600;text-decoration:none}.ds-brand img{width:42px;height:42px;border-radius:12px;box-shadow:0 8px 20px #006cff2e}.ds-brand span{line-height:1.05}.ds-brand small{display:block;color:var(--ds-blue-600);font-size:.67rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.ds-menu{display:flex;align-items:center;justify-content:center;gap:6px}.ds-menu a{display:inline-flex;align-items:center;min-height:40px;padding:0 13px;color:#263b55;font-size:1.06rem;font-weight:600;text-decoration:none;border-radius:999px}.ds-menu a:hover,.ds-menu a:focus,.ds-menu a[aria-current=page]{color:var(--ds-blue-600);background:#006cff14}.ds-menu .ds-menu-cta{margin-left:14px;padding:0 16px;min-height:38px;gap:8px;color:#fff;background:linear-gradient(135deg,var(--ds-navy),var(--ds-blue));border-radius:999px;font-size:.82rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 4px 14px #0b4f9f38;transition:transform .15s,box-shadow .15s,background .15s}.ds-menu .ds-menu-cta:hover,.ds-menu .ds-menu-cta:focus{color:#fff;background:linear-gradient(135deg,var(--ds-blue),var(--ds-navy));box-shadow:0 6px 18px #0b4f9f52;transform:translateY(-1px)}.ds-menu .ds-menu-cta[aria-current=page]{color:#fff;background:linear-gradient(135deg,var(--ds-blue),var(--ds-navy));box-shadow:0 6px 18px #0b4f9f52}.ds-menu .ds-menu-cta svg{width:14px;height:14px;flex-shrink:0;transition:transform .15s}.ds-menu .ds-menu-cta:hover svg,.ds-menu .ds-menu-cta:focus svg{transform:translate(2px)}.ds-menu .ds-menu-account{margin-left:14px;padding:0 16px;min-height:38px;gap:8px;color:var(--ds-blue-600);background:#fff;border:1.5px solid var(--ds-blue-600);border-radius:999px;font-size:.87rem;font-weight:600;transition:color .15s,background .15s,box-shadow .15s,transform .15s}.ds-menu .ds-menu-account:hover,.ds-menu .ds-menu-account:focus,.ds-menu .ds-menu-account[aria-current=page]{color:#fff;background:linear-gradient(135deg,var(--ds-navy),var(--ds-blue));box-shadow:0 6px 18px #0b4f9f42;transform:translateY(-1px)}.ds-menu .ds-menu-account svg{width:17px;height:17px;flex-shrink:0}.ds-menu .ds-menu-account--user{padding-left:6px;gap:9px}.ds-menu-account__pic{position:relative;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;border-radius:50%;overflow:hidden;background:#eaf1ff;color:var(--ds-blue-600)}.ds-menu-account__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.ds-menu-account__pic svg{width:15px;height:15px}.ds-menu-account__name{white-space:nowrap}.ds-menu-account__caret{width:14px;height:14px;margin-left:2px;transition:transform .15s ease}.ds-menu-account[aria-expanded=true] .ds-menu-account__caret{transform:rotate(180deg)}.ds-menu-account-wrap{position:relative;display:inline-flex}.ds-menu-account-wrap button.ds-menu-account{appearance:none;cursor:pointer;font:inherit;text-align:left}.ds-menu-account__dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background:#fff;border:1px solid var(--ds-line);border-radius:14px;box-shadow:0 18px 46px #06183329;padding:6px;z-index:60;display:flex;flex-direction:column}.ds-menu-account__dropdown[hidden]{display:none}.ds-menu-account__dropdown a,.ds-menu-account__dropdown button{appearance:none;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;background:transparent;color:var(--ds-ink, #0b1628);font:600 .92rem/1.2 Montserrat,Arial,sans-serif;text-decoration:none;text-align:left;border-radius:10px;cursor:pointer;width:100%}.ds-menu-account__dropdown a:hover,.ds-menu-account__dropdown button:hover{background:#f1f5f9}.ds-menu-account__dropdown svg{width:18px;height:18px;flex-shrink:0;color:#475569}.ds-menu-account__dropdown button[data-ds-signout]{color:#b91c1c}.ds-menu-account__dropdown button[data-ds-signout] svg{color:#b91c1c}.ds-header-actions{display:flex;align-items:center;gap:10px}.ds-mobile-toggle{display:none;width:42px;height:42px;padding:0;color:var(--ds-navy);background:#fff;border:1px solid var(--ds-line);border-radius:999px;cursor:pointer}.ds-mobile-toggle span,.ds-mobile-toggle:before,.ds-mobile-toggle:after{display:block;width:18px;height:2px;margin:4px auto;content:"";background:currentColor;border-radius:999px}.ds-footer{padding:46px 0 34px;color:#d8e6f8;background:var(--ds-navy)}.ds-footer-grid{display:grid;grid-template-columns:2fr .7fr 1fr .7fr;gap:40px 36px;width:min(100% - var(--ds-gx),var(--ds-max-data));margin:0 auto;align-items:start}.ds-footer-grid>section{min-width:0}.ds-footer-grid>section:first-child p{max-width:38ch}.ds-footer a{color:#d8e6f8;text-decoration:none}.ds-footer a:hover,.ds-footer a:focus{color:#fff}.ds-footer h2,.ds-footer h3{margin:0 0 18px;color:#fff;font-size:1.05rem;letter-spacing:.01em}.ds-footer p{max-width:560px;margin:0;color:#b8c9dd;line-height:1.7}.ds-footer-links{display:grid;gap:12px;grid-auto-rows:min-content;align-content:start}.ds-footer-links a{line-height:1.3}.ds-footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;width:min(100% - var(--ds-gx),var(--ds-max-data));margin:34px auto 0;padding-top:22px;color:#9fb4cc;font-size:.85rem;text-align:center;overflow-wrap:break-word;border-top:1px solid rgba(255,255,255,.12)}.ds-footer-bottom .made-in-spain{flex-basis:100%;text-align:center;white-space:normal;overflow-wrap:break-word}.ds-footer-bottom .ds-footer-flags{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.4em;vertical-align:-.15em;margin-left:.2rem}.ds-footer-bottom .flag-cat,.ds-footer-bottom .flag-es,.ds-footer-bottom .flag-eu{display:inline-block;height:1em;width:auto;border-radius:2px}@media(max-width:479.98px){.ds-footer-bottom .made-in-spain{font-size:.74rem;flex-wrap:wrap;justify-content:center;text-align:center;white-space:normal;overflow-wrap:break-word}}@media(max-width:1240px){.ds-nav{justify-content:space-between}.ds-mobile-toggle{display:inline-block}/* max-height+scroll: el panel es position:fixed y con 8 ítems + "Acceder" mide ~484px; en móvil apaisado (alto útil ~390px) los últimos quedaban fuera de pantalla y sin forma de alcanzarlos. */
.ds-menu{position:fixed;top:var(--ds-header);left:12px;right:12px;display:none;grid-template-columns:1fr;padding:12px;max-height:calc(100vh - var(--ds-header) - 24px);max-height:calc(100dvh - var(--ds-header) - 24px);overflow-y:auto;overscroll-behavior:contain;background:#fffffff5;border:1px solid var(--ds-line);border-radius:var(--ds-radius-md);box-shadow:var(--ds-shadow-md)}.ds-menu.is-open{display:grid}.ds-menu a{justify-content:center;min-height:46px}.ds-menu .ds-menu-cta{margin-left:0;margin-top:6px;min-height:48px;justify-content:center}.ds-menu .ds-menu-account{margin-left:0;margin-top:10px;min-height:40px;padding:0 22px;justify-self:center;align-self:center;width:auto}.ds-menu .ds-menu-account--user{width:100%;justify-self:stretch;align-self:stretch;align-items:center;justify-content:flex-start;gap:12px;margin-top:12px;padding:14px 6px 2px;min-height:0;border:0;border-top:1px solid var(--ds-line);border-radius:0;background:transparent;color:var(--ds-navy)}.ds-menu .ds-menu-account--user:hover,.ds-menu .ds-menu-account--user:focus{background:transparent;color:var(--ds-blue-600);box-shadow:none;transform:none}.ds-menu .ds-menu-account--user .ds-menu-account__pic{flex:0 0 44px;width:44px;height:44px}.ds-menu .ds-menu-account--user .ds-menu-account__name{max-width:none;font-weight:600;white-space:normal}/* El panel es scroller (max-height+overflow-y), así que un popover position:absolute dentro quedaría recortado y "Cerrar sesión" dejaría de verse al pulsar el nombre. En móvil el desplegable de cuenta pasa al flujo, como un acordeón: aporta altura al panel y se alcanza con el propio scroll. */
.ds-menu .ds-menu-account-wrap{display:block;width:100%}.ds-menu .ds-menu-account__dropdown{position:static;width:100%;min-width:0;margin-top:8px;box-shadow:none;border-radius:12px}.ds-header-actions .ds-btn--ghost{display:none}.ds-footer-grid{grid-template-columns:1fr 1fr;gap:36px 32px}}@media(max-width:760px){.ds-nav,.ds-footer-grid,.ds-footer-bottom{width:min(100% - 24px,var(--ds-max))}.ds-brand span{font-size:.92rem}.ds-footer-grid,.ds-footer-bottom{grid-template-columns:1fr;flex-direction:column}.ds-footer-grid{gap:28px}}
/* Foco visible en el header (a11y, 2026-07-19).  Las reglas de arriba llevaban
   "outline:none" en :focus y lo único que quedaba era un fondo #006cff14 sobre
   header blanco —1,1:1 de contraste—, así que quien navega con teclado no veía
   dónde estaba.  Se quitó ese outline:none y aquí se repone un anillo propio con
   :focus-visible, que NO se dibuja al hacer clic con el ratón. */
.ds-menu a:focus-visible,.ds-menu .ds-menu-cta:focus-visible,.ds-menu .ds-menu-account:focus-visible,.ds-brand:focus-visible,.ds-mobile-toggle:focus-visible{outline:2px solid var(--ds-blue-600);outline-offset:2px}
/* Menú de dos filas (Pedro 2026-07-19): "Driver" en la fila superior y el nombre del producto en la inferior; el ítem "Inicio" sale del menú (la marca ya enlaza a la home). Regla aparte de ".ds-menu a" para que "Acceder" siga en una sola fila. En el desplegable móvil (≤1240px) las dos palabras se funden en una línea: "Driver Tacho". */
.ds-menu a.ds-menu-2l{flex-direction:column;align-items:center;justify-content:center;gap:0;min-height:0;padding:5px 10px;border-radius:14px;text-align:center}.ds-menu-2l .ds-menu-2l__fam{display:block;font-size:.98rem;font-weight:600;line-height:1.15}.ds-menu-2l .ds-menu-2l__page{display:block;font-size:.98rem;font-weight:600;line-height:1.15}@media(max-width:1240px){.ds-menu a.ds-menu-2l{flex-direction:row;gap:.34em;min-height:46px;padding:0 12px}.ds-menu-2l .ds-menu-2l__fam{font-size:1rem;opacity:1;line-height:inherit}.ds-menu-2l .ds-menu-2l__page{font-size:1rem;line-height:inherit}}

/* ── Selector de idioma ────────────────────────────────────────────────
   Patrón canónico del ecosistema (el mismo de peritocamion.com): botón con
   la bandera y el nombre del idioma ACTUAL, y un menú con los otros dos.
   Los nombres van siempre en el idioma de la página, nunca cada uno en el
   suyo, que es la norma de todas las webs de Pedro. */
.lang-switch{position:relative;display:inline-flex;margin-left:10px}
.lang-switch__toggle{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 12px;color:#263b55;font:inherit;font-size:.87rem;font-weight:600;background:#fff;border:1px solid var(--ds-line,#dbe7f5);border-radius:999px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.lang-switch__toggle:hover,.lang-switch__toggle:focus-visible{border-color:var(--ds-blue-600,#0b4f9f);box-shadow:0 4px 14px #0b4f9f22}
.lang-switch__chev{flex:0 0 auto;transition:transform .18s ease}
.lang-switch.open .lang-switch__chev{transform:rotate(180deg)}
.lang-flag{flex:0 0 auto;border-radius:2px;box-shadow:0 0 0 1px #06183314}
.lang-switch__menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;min-width:180px;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--ds-line,#dbe7f5);border-radius:14px;box-shadow:0 18px 46px #06183329;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .16s ease,transform .16s ease}
.lang-switch.open .lang-switch__menu{opacity:1;transform:translateY(0);pointer-events:auto}
.lang-switch__menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;color:var(--ds-ink,#0b1628);font-size:.92rem;font-weight:600;text-decoration:none;border-radius:10px}
.lang-switch__menu a:hover,.lang-switch__menu a:focus-visible{background:#006cff14;color:var(--ds-blue-600,#0b4f9f)}
@media(max-width:1240px){.lang-switch{margin:8px 0 0;width:100%}.lang-switch__toggle{width:100%;justify-content:flex-start}.lang-switch__menu{left:0;right:0;min-width:0}}

/* Zonas tactiles (revision de accesibilidad). En el movil, 44 px de alto como pide la pauta; en escritorio 32, que con raton sobra y evita que el pie crezca un 51 %. */
.ds-footer-links a{display:flex;align-items:center;min-height:32px}
.ds-brand,.ds-menu-account{min-height:44px}
.ds-mobile-toggle{min-width:44px;min-height:44px}
@media(max-width:900px){.ds-footer-links a{min-height:44px}}
