:root{
  --y:#FFD006; --y2:#FFE67A; --b:#053661; --b2:#0A4A55; --soft:#EAF7FF; --w:#F7F8FA;
  --ink:#1A1A1A; --ink2:#334155;
  --r:22px; --r2:30px;
  --shadow: 0 18px 46px rgba(5,54,97,.14);
  --shadow2: 0 10px 24px rgba(15,23,42,.10);
  --line: rgba(5,54,97,.14);
  --max:1140px; --pad: clamp(16px,3vw,28px);
  --h:"Bebas Neue", system-ui, sans-serif;
  --f:"Inter", system-ui, sans-serif;
  --focus: 0 0 0 4px rgba(5,54,97,.18), 0 0 0 1px rgba(255,208,6,.85);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:var(--f);color:var(--ink);
  background:radial-gradient(1100px 740px at 15% 8%, rgba(255,208,6,.44), transparent 60%),
    radial-gradient(900px 660px at 92% 10%, rgba(5,54,97,.12), transparent 60%),
    linear-gradient(180deg,#ffe36a 0%,var(--w) 34%,var(--soft) 100%);
  overflow-x:hidden; min-height:100vh;}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.55;
  background-image:url("../assets/pattern.svg");background-size:420px 420px;mix-blend-mode:multiply;}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
.container{width:min(var(--max), calc(100% - 2*var(--pad))); margin-inline:auto}
.skip{position:absolute;left:-999px;top:12px;background:var(--y);color:var(--b);padding:10px 12px;border-radius:12px;z-index:9999}
.skip:focus{left:12px;outline:none;box-shadow:var(--focus)}

.top{position:sticky;top:0;z-index:80;background:linear-gradient(180deg, rgba(255,208,6,.98), rgba(255,208,6,.86));
  box-shadow:0 10px 26px rgba(5,54,97,.12);}
.top__inner{display:flex;align-items:center;justify-content:space-between;padding:16px 0 12px;gap:14px}
.logoCard{display:flex;gap:12px;align-items:center;background:rgba(247,248,250,.95);padding:10px 14px;border-radius:18px;box-shadow:var(--shadow2);border:1px solid rgba(5,54,97,.10)}
.logoCard__mark{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:rgba(255,208,6,.55)}
.logoCard__mark svg{width:22px;height:22px}
.logoCard__sub{font-weight:800;color:var(--b);opacity:.82;font-size:12px;margin-top:2px}
.top__right{display:flex;align-items:center;gap:12px}
.top__label{font-weight:700;color:var(--b)}
.callPill{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:var(--b);color:var(--y);
  box-shadow:0 12px 24px rgba(5,54,97,.18);border:1px solid rgba(255,208,6,.35)}
.callPill__label{display:none}
.callPill__num{font-weight:900;letter-spacing:.3px}
.callPill:focus{outline:none;box-shadow:var(--focus)}
.burger{width:44px;height:44px;border-radius:14px;border:1px solid rgba(5,54,97,.18);background:rgba(247,248,250,.95);box-shadow:var(--shadow2);display:none}
.burger span,.burger span::before,.burger span::after{display:block;width:18px;height:2px;background:var(--b);border-radius:2px;position:relative;margin:auto}
.burger span::before{content:"";position:absolute;top:-6px;left:0} .burger span::after{content:"";position:absolute;top:6px;left:0}

.nav{display:flex;gap:18px;align-items:center;justify-content:center;padding:10px 0 14px;border-top:1px solid rgba(5,54,97,.10)}
.nav a{font-weight:800;color:var(--b);padding:10px 12px;border-radius:14px}
.nav a:hover{background:rgba(247,248,250,.75)}
.nav__cta{background:var(--y);color:var(--b);box-shadow:var(--shadow2);border:1px solid rgba(5,54,97,.14)}

.blueBand{height:14px;background:var(--b);border-top:1px solid rgba(255,208,6,.35)}

.hero{
padding:26px 0 18px
}
.hero__grid{
display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:26px;
  align-items:start;
}
h1{
font-family:var(--h);
  font-size:clamp(44px,5.2vw,72px);
  line-height:.95;
  margin:0;
  color:var(--b);
}
.accent{text-shadow:0 10px 22px rgba(5,54,97,.10)}
.lead{
font-size:16px;
  line-height:1.6;
  color:var(--ink2);
  max-width:56ch;
  margin:12px 0 14px;
}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.checks li{
display:flex;
  gap:10px;
  align-items:flex-start;
  background:rgba(247,248,250,.86);
  border:1px solid rgba(5,54,97,.10);
  border-radius:16px;
  padding:10px 12px;
  box-shadow:var(--shadow2);
}
.tick{width:22px;height:22px;border-radius:999px;display:grid;place-items:center;background:rgba(255,208,6,.85);color:var(--b);font-weight:900;flex:0 0 auto}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:999px;font-weight:900;border:1px solid transparent;cursor:pointer}
/* RULES: blue bg -> yellow text; yellow bg -> blue text; WA green -> white text */
.btn--blue{background:var(--b);color:var(--y);border-color:rgba(255,208,6,.35)}
.btn--yellow{background:var(--y);color:var(--b);border-color:rgba(5,54,97,.14)}
.btn--wa{background:#25D366;color:#fff;border-color:rgba(0,0,0,.06)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow2)}
.btn:focus{outline:none;box-shadow:var(--focus)}

.trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;background:rgba(247,248,250,.85);border:1px solid rgba(5,54,97,.10);font-weight:800;color:var(--b)}
.chip img{width:18px;height:18px}


.hero__grid > .imgCard{
  width: 100%;
  max-width: 760px;
  justify-self: end;
  margin-right: -40px;
  margin-top: -18px;
}

.imgCard{background:rgba(247,248,250,.90);border:1px solid rgba(5,54,97,.12);border-radius:var(--r2);box-shadow:var(--shadow);padding:14px}

.strip{background:var(--b);color:var(--y);padding:16px 0}
.strip p{margin:0;text-align:center;font-weight:900;letter-spacing:.3px}

.section{padding:48px 0}
.section--soft{background:linear-gradient(180deg, rgba(234,247,255,.75), rgba(247,248,250,.55));border-top:1px solid rgba(5,54,97,.08);border-bottom:1px solid rgba(5,54,97,.08)}
.secTitle{font-family:var(--h);font-size:44px;margin:0 0 18px;color:var(--b);letter-spacing:.8px}
.sub{margin-top:-6px;color:var(--ink2)}

.svcGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.svcCard{background:rgba(247,248,250,.9);border:1px solid rgba(5,54,97,.12);border-radius:22px;box-shadow:var(--shadow2);padding:16px}
.svcCard__ic{width:44px;height:44px;border-radius:16px;background:rgba(255,208,6,.55);display:grid;place-items:center;margin-bottom:10px}
.svcCard__ic img{width:24px;height:24px}
.svcCard h3{margin:0 0 6px;color:var(--b)} .svcCard p{margin:0;color:var(--ink2)}
.svcCard:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:rgba(255,208,6,.55)}

.svcMore{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0 0}
.mini{display:flex;gap:10px;align-items:flex-start;background:rgba(247,248,250,.75);border:1px solid rgba(5,54,97,.10);border-radius:18px;padding:12px}
.mini__dot{width:12px;height:12px;border-radius:999px;background:var(--y);box-shadow:0 0 0 6px rgba(255,208,6,.22);margin-top:5px}
.mini h4{margin:0;color:var(--b)} .mini p{margin:4px 0 0;color:var(--ink2)}
.center{display:flex;justify-content:center;margin-top:18px}

.steps{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.step{display:flex;gap:12px;align-items:flex-start;background:rgba(247,248,250,.82);border:1px solid rgba(5,54,97,.10);border-radius:22px;padding:14px;box-shadow:var(--shadow2)}
.step__n{width:36px;height:36px;border-radius:14px;background:var(--y);color:var(--b);display:grid;place-items:center;font-weight:900}
.step h3{margin:0;color:var(--b)} .step p{margin:6px 0 0;color:var(--ink2)}

.priceGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.priceCard{background:rgba(247,248,250,.92);border:1px solid rgba(5,54,97,.12);border-radius:24px;padding:18px;box-shadow:var(--shadow2);position:relative}
.priceCard--best{border-color:rgba(255,208,6,.75);box-shadow:var(--shadow)}
.best{position:absolute;top:14px;right:14px;background:var(--b);color:var(--y);padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px}
.priceCard h3{margin:0;color:var(--b)} .price{font-size:34px;font-family:var(--h);color:var(--b);margin:10px 0 8px}
.priceCard ul{margin:0;padding-left:18px;color:var(--ink2)} .priceCard li{margin:6px 0}
.fine{color:var(--ink2);font-size:13px}

.slider{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(5,54,97,.12);background:rgba(247,248,250,.75);box-shadow:var(--shadow2)}
.slider__track{display:flex;gap:12px; padding:16px; scroll-behavior:smooth; overflow:auto; scrollbar-width:none}
.slider__track::-webkit-scrollbar{display:none}
.rev{flex:0 0 320px;max-width:320px;min-width:280px;background:rgba(247,248,250,.92);border:1px solid rgba(5,54,97,.10);border-radius:22px;padding:14px}
.stars{color:var(--b);letter-spacing:1px} .rev p{margin:8px 0;color:var(--ink2)} .rev span{font-weight:800;color:var(--b)}
.slider__controls{position:absolute;right:14px;top:14px;display:flex;gap:8px}
.sbtn{width:38px;height:38px;border-radius:14px;border:1px solid rgba(5,54,97,.12);background:var(--y);color:var(--b);font-weight:900}
.sbtn:focus{outline:none;box-shadow:var(--focus)}

.faq__item{background:rgba(247,248,250,.85);border:1px solid rgba(5,54,97,.12);border-radius:20px;padding:10px 12px;box-shadow:var(--shadow2);margin:10px 0}
.faq__item summary{cursor:pointer;font-weight:900;color:var(--b)} .faq__c{color:var(--ink2);padding:10px 2px 6px}

.contact{display:grid;grid-template-columns: .9fr 1.1fr;gap:16px;align-items:start}
.infoCard{background:rgba(247,248,250,.9);border:1px solid rgba(5,54,97,.12);border-radius:24px;box-shadow:var(--shadow2);padding:14px}
.row{display:flex;justify-content:space-between;gap:10px;padding:10px 6px;border-bottom:1px solid rgba(5,54,97,.08)}
.row:last-child{border-bottom:none}
.row span{color:var(--ink2);font-weight:800}
.form{background:rgba(247,248,250,.95);border:1px solid rgba(5,54,97,.12);border-radius:26px;box-shadow:var(--shadow);padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{display:grid;gap:6px;font-weight:800;color:var(--b)}
input,select,textarea{font:inherit;padding:12px 12px;border-radius:16px;border:1px solid rgba(5,54,97,.14);background:#fff}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:var(--focus)}
.full{grid-column:1/-1}
.chk{grid-column:1/-1;display:flex;align-items:center;gap:10px}
.chk input{width:18px;height:18px}
.form__actions{grid-column:1/-1;display:flex;gap:12px;flex-wrap:wrap}
.btn--big{padding:14px 18px}

.footer{padding:34px 0;background:rgba(247,248,250,.85);border-top:1px solid rgba(5,54,97,.10)}
.footer__inner{display:grid;grid-template-columns:1.2fr .7fr .6fr;gap:16px}
.footDot{width:12px;height:12px;border-radius:999px;background:var(--y);box-shadow:0 0 0 6px rgba(255,208,6,.20);display:inline-block;margin-right:10px}
.footLinks,.footLegal{display:grid;gap:8px} .footer a:hover{text-decoration:underline}

/* Floating WhatsApp + mobile bar */
.waFab{position:fixed;right:18px;bottom:86px;background:#25D366;color:#fff;padding:12px 14px;border-radius:999px;
  box-shadow:0 18px 40px rgba(0,0,0,.12);font-weight:900;z-index:60;display:flex;align-items:center;gap:10px}
.waFab__dot{width:10px;height:10px;border-radius:999px;background:#fff;opacity:.9}
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:10px;padding:10px 12px;
  background:rgba(247,248,250,.92);backdrop-filter:blur(8px);border-top:1px solid rgba(5,54,97,.12)}
.mbar__btn{flex:1;text-align:center;padding:12px 14px;border-radius:16px;font-weight:900;border:1px solid rgba(5,54,97,.12)}
.mbar__btn--call{background:var(--b);color:var(--y)}
.mbar__btn--wa{background:#25D366;color:#fff;border-color:rgba(0,0,0,.06)}

/* Reveal */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto} .reveal{transition:none;transform:none;opacity:1} .btn:hover{transform:none} }


/* Strong, visible focus without dark themes */
:focus-visible{
  outline:none;
  box-shadow: var(--focus);
}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible{
  border-radius:14px;
}

/* Hero statement band */
.statementBand{
  background: var(--b);
  color: var(--y);
  padding: 18px 0;
  margin-top: 10px;
  border-top: 1px solid rgba(255,208,6,.35);
  border-bottom: 1px solid rgba(255,208,6,.25);
}
.statementBand p{
  margin:0;
  text-align:center;
  font-weight:900;
  letter-spacing:.4px;
}
.hero::before,
.hero::after,
.background-pattern,
.wave-pattern,
.circle-pattern {
  display: none !important;
}
.hero img,
.hero svg path[stroke] {
  stroke: none !important;
}
/* ELIMINAR OVERLAY DE GARABATOS DEFINITIVAMENTE */
body::before,
body::after {
  content: none !important;
  display: none !important;
}


@media (max-width: 980px){
  .hero__grid{grid-template-columns:1fr}
  .svcGrid{grid-template-columns:repeat(2,1fr)}
  .svcMore{grid-template-columns:repeat(2,1fr)}
  .contact{grid-template-columns:1fr}
  .footer__inner{grid-template-columns:1fr}

  .burger{display:grid}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;
        background:rgba(247,248,250,.96);
        border-top:1px solid rgba(5,54,97,.10);
        padding:12px;
        flex-direction:column}
  .nav.open{display:flex}
  .mbar{display:flex}
}

/* HERO (definitivo): agrandar foto + marco hacia arriba y a la derecha */
.hero .imgCard{
  position: relative !important;
  width: 100% !important;
  max-width: 860px !important;
  transform: scale(1.20) translateX(140px) !important;
  transform-origin: top right !important;
  z-index: 2;
}
@media (max-width: 980px){
  .hero .imgCard{
    transform: none !important;
    max-width: 100% !important;
    margin-right: 0 !important;
  }
}
/* Separar botones del bloque superior (checks) */
.hero .checks{
  margin-bottom: 24px !important;
}
/* Separar botones de la banda azul inferior */
.hero{
  padding-bottom: 36px !important;
}
/* Separación REAL entre los botones del hero y la banda azul */
.hero__cta{
  margin-bottom: 32px !important;
}

/* La banda azul real en tu CSS es .strip (no .statementBand) */
.strip{
  margin-top: 18px !important;
}
img[src*="shield.svg"]{
  vertical-align: middle;
}
/* Subir el icono shield.svg (tu SVG tiene “aire” arriba/abajo) */
img[src*="shield.svg"]{
  display: block;
  transform: translateY(-80px);
}

img[src*="shield.svg"]{
  display: inline-block;
  transform: translateY(-60px) scale(1.35);
  transform-origin: center;
}
/* Slider reseñas: 3 visibles en desktop, desplaza 1 a 1 con botones */
.slider__track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding-right:110px}
.rev{scroll-snap-align:start}
@media (max-width: 980px){
  .rev{flex-basis: 85%;}
}
/* ===========================
   FIX MOVIL (NO TOCA ESCRITORIO)
   =========================== */
@media (max-width: 768px) {

  /* Evita desbordes horizontales */
  html, body { overflow-x: hidden; }

  /* 1) HEADER: que no se amontone */
  .top { overflow: hidden; }
  .top .container { display: flex; flex-wrap: wrap; gap: 10px; }
  .brand { max-width: 70%; }
  .callPill { margin-left: auto; }

  /* 2) PRECIOS: se ve “cortado” porque son 3 tarjetas en fila.
        Solución PRO: carrusel horizontal (tipo PC) */
  .priceGrid {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
  }
  .priceCard {
    flex: 0 0 85%;
    max-width: 85%;
    scroll-snap-align: start;
  }

  /* 3) OPINIONES: los botones pisan las estrellas
        Los llevamos arriba a la derecha y dejamos espacio */
  .slider { position: relative; }
  .slider__controls {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    display: flex;
    gap: 10px;
  }
  .slider__track { padding-top: 56px; }

  /* 4) CONTACTO: formulario “no encaja”
        En móvil todo a 1 columna y inputs al 100% */
  .contact {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .infoCard, .form { width: 100%; }

  .form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .form label,
  .form label.full { width: 100%; }

  .form input,
  .form select,
  .form textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .form__actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .form__actions .btn { width: 100%; }

  /* Email/links largos que se salgan */
  .infoCard a, .infoCard strong { word-break: break-word; }
}
}


/* Ajuste final: jerarquía visual del logo en móvil */
@media (max-width: 768px) {
  .logoCard__title {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: var(--primary-dark, #0b3c5d) !important;
  }

  .logoCard__sub,
  .logoCard__tagline {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--ink-muted, #355) !important;
    margin-top: 2px;
    display: block !important;
  }
}


/* Override final v3: título azul corporativo y subtítulo debajo (solo móvil) */
@media (max-width: 768px) {
  .logoCard__title{
    display:block !important;
    font-size: 32px !important;
    font-weight: 900 !important;
    color: var(--b) !important; /* azul oscuro corporativo */
    letter-spacing: .2px !important;
    line-height: 1.0 !important;
  }
  .logoCard__sub{
    display:block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--b) !important;
    opacity: .85 !important;
    margin-top: 4px !important;
    line-height: 1.0 !important;
  }
}


/* Centrar "Manitas & Reparaciones" respecto al título */
@media (max-width: 768px) {
  .logoCard {
    align-items: center;
  }

  .logoCard__sub,
  .logoCard__tagline {
    text-align: center;
    width: 100%;
  }
}


/* ===========================
   LOGO ESCRITORIO (PC) — solo desktop
   =========================== */
@media (min-width: 769px) {
  /* Pastilla blanca: más larga como en tu captura, respetando borde/radio */
  .logoCard{
    width: auto;
    max-width: 720px;          /* largo de la pastilla en PC */
    padding: 14px 22px;
    gap: 14px;
  }

  /* Mantener el texto en una línea (título + subtítulo a la derecha) */
  .logoCard__title,
  .logoCard__sub{
    white-space: nowrap;
  }

  /* Jerarquía: título fuerte y azul corporativo */
  .logoCard__title{
    font-size: 30px;
    font-weight: 900;
    color: var(--b);
    line-height: 1;
  }

  /* Subtítulo a la derecha: más pequeño, menos peso */
  .logoCard__sub{
    display: inline-block;
    margin-left: 10px;
    font-size: 15px;
    font-weight: 700;
    color: var(--b);
    opacity: .78;
    line-height: 1;
    position: relative;
    top: 2px; /* baja un pelín para que “respire” */
  }
}


/* === FIX MOVIL: 'Arregla Fácil Jerez' en una sola línea (NO TOCA PC) === */
@media (max-width: 768px) {
  .logoCard__title{
    white-space: nowrap !important;
    font-size: 24px !important;      /* ajusta para que quepa en una línea */
    letter-spacing: -0.3px !important;
  }
}


/* === FIX MOVIL: centrar todo el bloque del header (logo + teléfono + menú) === */
@media (max-width: 768px) {
  /* Centra el contenido del header */
  .top__inner{
    justify-content: center !important;
  }

  /* Logo centrado */
  .logoCard{
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Fila inferior (Llámanos + botón + hamburguesa) centrada */
  .top__right{
    margin-left: 0 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
  }

  /* Evita empujes laterales en el botón de llamada */
  .callPill{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* =========================================================
   AJUSTES UX MÓVIL (NO TOCA PC)
   1) Quitar barra fija inferior "Llamar / WhatsApp" (deja el WhatsApp flotante lateral)
   2) Alinear la pastilla del logo con las tarjetas/pastillas del contenido
   ========================================================= */
@media (max-width: 768px) {

  /* 1) Ocultar barra inferior fija (si existe con estos nombres) */
  .mbar,
  .mobileBar,
  .mobile-actions,
  .actions-fixed,
  .stickyActions,
  .bottomBar,
  .ctaBar {
    display: none !important;
  }

  /* 2) Alinear la pastilla del logo con el mismo “margen lateral” que usan las cards
        (32px = 16px a cada lado). Si tus cards usan otro margen, cambia 32px. */
  .logoCard {
    max-width: calc(100% - 32px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* === AJUSTE FINO ALINEACIÓN LOGO (SOLO MÓVIL, PC INTACTO) === */
@media (max-width: 768px) {
  header.top{
    padding-left:16px !important;
    padding-right:16px !important;
  }
  .logoCard{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .top__inner{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}


/* === FIX: Separador del header full-width + márgenes iguales a las pastillas (SOLO MÓVIL) === */
@media (max-width: 768px) {

  /* 1) No metas padding al "contenedor" donde vive la línea azul (para que no se corte) */
  header.top{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 2) El contenido del header sí lleva el mismo margen lateral que el resto (16px) */
  header.top .container,
  header.top .top__inner,
  header.top .top__container,
  header.top .inner,
  header.top .wrap{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* 3) La pastilla del logo con el mismo margen lateral que las cards */
  .logoCard{
    margin-left: 16px !important;
    margin-right: 16px !important;
    width: auto !important;
    max-width: none !important;
  }

  /* 4) Forzar que la línea/separador del header sea "full bleed" */
  header.top hr,
  header.top .divider,
  header.top .topDivider,
  header.top .top__divider,
  header.top .navDivider,
  header.top .rule,
  header.top .line {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  /* 5) Si el separador es un pseudo-elemento, también lo hacemos full bleed */
  header.top::after,
  header.top::before{
    width: 100vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}