
:root{
  --rojo:#DD1107; --negro:#000000; --gris:#6B7280; --blanco:#FFFFFF;
  --texto:#1B1F24; --texto2:#4A5360; --meta:#7A8491; --fondo:#F6F7F9; --fondo2:#EEF1F5;
  --sep:#E2E7ED; --borde:#CBD3DD; --rojo-osc:#B50E06; --rojo-suave:#FDECEB;
  --web-topbar:#CDD6DC; --web-pie:#E7EDEF; --web-pie-osc:#232323;
  --m:96px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--blanco)}
body{width:100%;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--texto);-webkit-font-smoothing:antialiased;font-feature-settings:"kern" 1}
a{color:inherit;text-decoration:none}
.wrap{padding:0 var(--m)}
.topbar{height:32px;background:var(--web-topbar);display:flex;justify-content:flex-end;align-items:center;padding:0 25px;gap:0;font-size:14px;color:#000}
.topbar a{padding:0 12px}
.topbar a+a{border-left:1px solid rgba(0,0,0,.25)}
.topbar a:last-child{padding-right:0}
.mainhead{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid var(--sep);background:#fff}
.mainhead .logo img{height:64px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:22px;font-size:17.6px;font-weight:500;color:#000}
.nav .dd::after{content:"";display:inline-block;width:6px;height:6px;border-right:1.4px solid #555;border-bottom:1.4px solid #555;transform:rotate(45deg);margin:0 0 4px 6px}
.nav .activo{color:var(--rojo)}
.nav .contacto{border:2px solid var(--rojo);color:var(--rojo);border-radius:99px;font-size:14.5px;font-weight:600;padding:7px 17px;margin-left:4px}
.hero{position:relative;height:640px;overflow:hidden;background:#fff}
.hero .foto{position:absolute;left:0;top:240px;width:1440px;height:480px;display:block}
.hero .fundido{position:absolute;left:0;top:239px;width:1440px;height:71px;
  background:linear-gradient(to bottom,#fff 0%,rgba(255,255,255,.97) 10%,rgba(255,255,255,.90) 20%,rgba(255,255,255,.78) 30%,rgba(255,255,255,.64) 40%,rgba(255,255,255,.50) 50%,rgba(255,255,255,.35) 60%,rgba(255,255,255,.22) 70%,rgba(255,255,255,.10) 80%,rgba(255,255,255,.03) 90%,rgba(255,255,255,0) 100%)}
.hero .logoA{position:absolute;left:92px;top:52px;width:292.98px;height:116.17px}
.hero h1.promesa{position:absolute;left:96px;top:184px;font-size:48px;line-height:1.05;font-weight:700;letter-spacing:-0.06em;color:var(--negro);white-space:nowrap}
.promesa .p{color:var(--gris)} .promesa .d{color:var(--rojo)}
.buscador{position:absolute;left:96px;top:338px;width:700px}
.buscador label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.campo{height:64px;border:2px solid var(--meta);border-radius:32px;background:#fff;display:flex;align-items:center;padding:0 6px 0 24px;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.campo svg{flex:none;margin-right:14px}
.campo .ph{flex:1;font-size:18px;color:var(--texto2);white-space:nowrap;overflow:hidden}
.campo .btn{flex:none;height:50px;padding:0 30px;border-radius:25px;background:var(--rojo);color:#fff;font-size:17px;font-weight:600;display:flex;align-items:center}
.ejemplos{margin-top:16px;font-size:15px;color:var(--texto2);white-space:nowrap}
.ejemplos a{color:var(--texto);text-decoration:underline;text-decoration-color:var(--rojo);text-decoration-thickness:1.5px;text-underline-offset:3px;margin-left:6px}
.ejemplos a+a::before{content:"·";color:var(--meta);display:inline-block;margin-right:8px;text-decoration:none}
.kicker{font-size:15px;font-weight:700;letter-spacing:-0.005em;color:#000}
.kicker::before{content:"/ ";color:var(--rojo)}
h2{font-size:36px;line-height:1.15;font-weight:800;letter-spacing:-0.02em;color:#000}
.aux{font-size:16px;line-height:1.5;color:var(--texto2)}
.enlace{font-size:16px;font-weight:600;color:var(--texto);text-decoration:underline;text-decoration-color:var(--rojo);text-decoration-thickness:1.5px;text-underline-offset:4px;white-space:nowrap}
.flecha{color:var(--rojo);font-weight:600}
.cabsec{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px}
.cabsec .t{display:flex;flex-direction:column;gap:12px}
.accesos{padding-top:72px;padding-bottom:88px}
.accesos .kicker{margin-bottom:28px}
.acc{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.acc a{display:flex;flex-direction:column;border-top:2px solid #000;padding-top:22px;min-height:168px}
.acc .n{font-size:13px;font-weight:700;color:var(--gris);letter-spacing:.04em}
.acc .tt{font-size:24px;line-height:1.2;font-weight:700;letter-spacing:-0.02em;color:#000;margin-top:0}
.acc .ds{font-size:15px;line-height:1.5;color:var(--texto2);margin-top:10px}
.acc .ir{margin-top:auto;padding-top:18px;font-size:20px}
.areas{padding-top:16px;padding-bottom:104px}
.grid8{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.area{background:var(--fondo);padding:26px 26px 24px;min-height:196px;display:flex;flex-direction:column}
.area .n{font-size:13px;font-weight:700;color:var(--gris);letter-spacing:.04em}
.area .nom{font-size:22px;line-height:1.22;font-weight:700;letter-spacing:-0.015em;color:#000;margin-top:16px}
.area .pie{margin-top:auto;padding-top:18px;display:flex;justify-content:space-between;align-items:center;font-size:15px;color:var(--texto2)}
.area .pie .flecha{font-size:19px}
.retos{padding:96px 0 104px;border-top:1px solid var(--sep)}
.retos .cols{display:grid;grid-template-columns:4fr 8fr;gap:64px}
.retos .izq{display:flex;flex-direction:column;gap:18px}
.retos .izq h2{max-width:400px}
.lista a{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;border-top:1px solid var(--sep);font-size:20px;line-height:1.35;font-weight:600;color:#000;letter-spacing:-0.01em}
.lista a:last-child{border-bottom:1px solid var(--sep)}
.lista .flecha{font-size:20px;flex:none}
.playbooks{background:var(--fondo);padding:88px 0 96px}
.etq{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--rojo-osc);background:var(--rojo-suave);padding:5px 10px;border-radius:4px;vertical-align:middle}
.pbrow{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pb{background:#fff;border:1.5px dashed var(--borde);padding:26px 26px 28px;display:flex;flex-direction:column}
.pb .marca{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--meta)}
.pb .tt{font-size:21px;line-height:1.3;font-weight:700;color:#000;margin-top:14px;letter-spacing:-0.01em}
.pb ol{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:10px;counter-reset:p}
.pb li{counter-increment:p;display:flex;gap:12px;font-size:15.5px;line-height:1.4;color:var(--texto)}
.pb li::before{content:counter(p);flex:none;width:24px;height:24px;border-radius:12px;background:var(--fondo2);color:var(--texto2);font-size:12.5px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:-1px}
.nota{margin-top:24px;font-size:14px;color:var(--texto2)}
.modelos{padding-top:96px;padding-bottom:104px}
.grid4m{display:grid;grid-template-columns:1fr 1fr;gap:28px 48px}
.mod{border-top:2px solid #000;padding-top:22px;display:flex;flex-direction:column}
.mod .aut{font-size:12.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--texto2)}
.mod .nom{font-size:26px;line-height:1.2;font-weight:700;letter-spacing:-0.02em;color:#000;margin-top:12px}
.mod .res{font-size:16px;line-height:1.6;color:var(--texto);margin-top:12px;max-width:540px}
.mod .enlace{margin-top:18px;align-self:flex-start;font-size:15px}
.cierre{padding-top:0;padding-bottom:64px}
.cierre .fila{border-top:1px solid var(--sep);padding-top:56px}
.cierre .fila{display:flex;justify-content:space-between;align-items:center;gap:48px}
.cierre p{font-size:20px;line-height:1.45;color:var(--texto);max-width:760px}
.cierre p strong{font-weight:700;color:#000}
.pie{font-family:Inter,sans-serif}
.pie .sup{background:var(--web-pie);padding:60px 25px 56px;display:grid;grid-template-columns:356px 1fr 232px;align-items:start}
.pie .sup .logo img{height:56px;width:auto;display:block}
.pie .redes{display:flex;gap:12px;margin-top:22px}
.pie .navp{display:flex;gap:16px;font-size:17px;color:#000;padding-top:8px}
.pie .contacto{font-size:17.6px;color:#424242;line-height:1.6}
.pie .contacto b{display:block;color:#000;font-weight:600;margin-bottom:6px}
.pie .contacto a{color:#000;display:block}
.pie .inf{background:var(--web-pie-osc);height:58px;display:flex;justify-content:space-between;align-items:center;padding:0 25px;font-size:14.3px;color:rgba(255,255,255,.5)}
.pie .inf .leg{display:flex;gap:16px}
.comercial{background:var(--fondo);padding:88px 0 96px;margin-bottom:96.15625px} 
.comercial .cabsec{margin-bottom:40px}
.comercial .t{max-width:820px}
.comercial .entradilla{font-size:18px;line-height:1.55;color:var(--texto2);max-width:720px}
.servicios{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.serv{background:#fff;border:1px solid var(--sep);border-top:2px solid #000;padding:30px 30px 28px;display:flex;flex-direction:column}
.serv h3{font-size:23px;line-height:1.25;font-weight:700;letter-spacing:-0.015em;color:#000}
.serv p{font-size:16px;line-height:1.6;color:var(--texto);margin-top:14px}
.serv .acciones{margin-top:auto;padding-top:28px;min-height:96px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:14px} 
.com-cta{font-size:17px;font-weight:600;color:var(--rojo);text-decoration:underline;text-decoration-color:var(--rojo);text-decoration-thickness:1.5px;text-underline-offset:4px}
.com-cta:hover{color:var(--rojo-osc);text-decoration-thickness:2px}
.com-cta:focus-visible,.secundario:focus-visible,.otro .enlace:focus-visible{outline:2px solid var(--rojo);outline-offset:3px;border-radius:2px}
.secundario{font-size:15px;color:var(--texto2);text-decoration:underline;text-decoration-color:var(--borde);text-decoration-thickness:1px;text-underline-offset:3px}
.secundario:hover{color:var(--rojo);text-decoration-color:var(--rojo)}
.otro{margin-top:32px;padding-top:28px;border-top:1px solid var(--borde);display:flex;justify-content:space-between;align-items:center;gap:48px}
.otro p{font-size:18px;line-height:1.5;color:var(--texto);max-width:760px}
.otro .enlace{font-size:16px}
.menu-btn,.drawer{display:none}
@media (min-width:1280px){ body{width:1440px} }
@media (max-width:1279px){
  :root{--m:48px}
  .nav{gap:18px;margin-left:auto}
  .nav > a{display:none}
  .nav > a.activo,.nav > a.contacto{display:inline-flex}
  .menu-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-left:10px}
  .mainhead{padding:0 15px 0 25px}
  .drawer:target{display:block;position:fixed;inset:0;z-index:50}
  .drawer .velo{position:absolute;inset:0;background:rgba(11,11,11,.6)}
  .drawer .panel{position:absolute;top:0;right:0;width:300px;height:100%;background:#fff;padding-top:30px;display:flex;flex-direction:column}
  .drawer .panel > a{display:flex;align-items:center;height:58px;padding:0 20px;border-top:1px solid #ECECEC;font-size:17.6px;font-weight:500;color:#000}
  .drawer .panel > a.cerrar{position:absolute;top:2px;right:10px;border:0;height:40px;padding:0 8px;font-size:30px;font-weight:400;color:#424242}
  .drawer .panel > a:nth-child(2){border-top:0}
  .drawer .panel > a.sub{justify-content:space-between}
  .drawer .panel > a.sub::after{content:"";width:8px;height:8px;border-right:1.6px solid #555;border-bottom:1.6px solid #555;transform:rotate(45deg);margin:-4px 6px 0 0}
  .drawer .panel > a.activo{color:var(--rojo)}
  .drawer .cta{display:block;padding:16px 20px;border-top:1px solid #ECECEC}
  .drawer .cta .contacto{display:inline-block;border:2px solid var(--rojo);color:var(--rojo);border-radius:99px;font-size:14.5px;font-weight:600;padding:7px 17px}
  .hero{height:560px}
  .hero .foto{width:100%;height:auto;top:auto;bottom:-80px;left:0}
  .hero .fundido{width:100%;top:calc(640px - 33.3333vw - 1px);height:61px}
  .hero .logoA{left:44.4px;top:36.4px;width:263.68px;height:104.56px}
  .hero h1.promesa{left:48px;top:155.4px;font-size:43.2px}
  .buscador{left:48px;top:284px;width:680px}
  .campo{height:60px;border-radius:30px;padding-left:22px}
  .campo .ph{font-size:17px}
  .campo .btn{height:48px;border-radius:24px;padding:0 26px}
  h2{font-size:32px}
  .accesos{padding-top:56px;padding-bottom:72px}
  .acc{grid-template-columns:1fr 1fr;gap:36px 40px}
  .acc a{min-height:0;padding-bottom:6px}
  .acc .ir{padding-top:14px}
  .areas{padding-bottom:88px}
  .cabsec{margin-bottom:28px}
  .grid8{gap:16px}
  .area{padding:22px 20px 20px;min-height:184px}
  .area .nom{font-size:19px;line-height:1.25}
  .retos{padding-top:80px;padding-bottom:88px}
  .retos .cols{grid-template-columns:5fr 7fr;gap:40px}
  .lista a{font-size:18px;padding:20px 0}
  .playbooks{padding-top:72px;padding-bottom:80px}
  .pbrow{gap:16px}
  .pb{padding:22px 20px 24px}
  .pb .tt{font-size:19px}
  .pb .marca{font-size:11px;letter-spacing:.05em}
  .modelos{padding-top:80px;padding-bottom:88px}
  .grid4m{gap:28px 36px}
  .mod .nom{font-size:23px}
  .cierre p{font-size:19px}
  .pie .sup{grid-template-columns:1fr auto;grid-template-areas:"marca contacto" "nav nav";row-gap:36px;padding:56px 25px 48px}
  .pie .sup .marca{grid-area:marca}
  .pie .contacto{grid-area:contacto}
  .pie .navp{grid-area:nav;justify-content:center;flex-wrap:wrap;padding-top:0}
}
@media (max-width:899px){
  :root{--m:40px}
  .topbar{display:none}
  .mainhead{justify-content:center;position:relative;padding:0 15px}
  .nav{display:none}
  .menu-btn{position:absolute;right:15px;top:23px;margin:0}
  .hero{height:calc(333px + 39.0625vw)}
  .hero .foto{width:117.1875vw;height:auto;left:auto;right:0;top:373px;bottom:auto}
  .hero .fundido{width:100%;top:372px;height:51px}
  .hero .logoA{left:36.8px;top:32.8px;width:234.38px;height:92.94px}
  .hero h1.promesa{left:40px;top:138.6px;font-size:38.4px}
  .buscador{left:40px;top:253px;width:calc(100% - 80px)}
  h2{font-size:30px}
  .acc{gap:32px 32px}
  .grid8{grid-template-columns:1fr 1fr}
  .area{min-height:150px}
  .area .nom{font-size:20px}
  .retos .cols{grid-template-columns:1fr;gap:32px}
  .retos .izq h2{max-width:none}
  .pbrow{grid-template-columns:1fr}
  .pb .marca{font-size:12px;letter-spacing:.08em}
  .grid4m{grid-template-columns:1fr;gap:28px}
  .pie .inf{flex-direction:column-reverse;justify-content:center;gap:12px;height:auto;padding:18px 25px}
}
.buscador .ayuda{display:none}
@media (max-width:599px){
  :root{--m:24px}
  .mainhead{height:68px}
  .mainhead .logo img{height:48px}
  .menu-btn{right:12px;top:12px}
  .drawer .panel{width:300px;max-width:84vw}
  .drawer .panel > a{height:58px}
  .hero{height:auto;display:flex;flex-direction:column;padding:22px var(--m) 0}
  .hero .logoA{position:static;order:1;width:161.14px;height:63.89px;margin:-2.2px 0 0 -2.2px}
  .hero h1.promesa{position:static;order:2;font-size:28px;white-space:normal;max-width:8.2em;margin-top:8.65px}
  .hero h1.promesa br{display:none}
  .buscador{position:static;order:3;width:100%;margin-top:18px}
  .buscador .ayuda{display:block;font-size:16px;line-height:1.4;color:var(--texto);margin:0 0 10px}
  .campo{height:56px;border-radius:28px;padding:0 5px 0 18px}
  .campo .ph{visibility:hidden}
  .campo .btn{height:46px;border-radius:23px;padding:0 22px;font-size:16px}
  .ejemplos{display:none}
  .hero .foto{position:static;order:4;width:170.7547vw;max-width:none;height:auto;margin:16px 0 0 calc(-70.7547vw - var(--m))}
  .hero .fundido{position:relative;order:5;top:auto;left:auto;width:calc(100% + 2 * var(--m));margin:calc(-56.9182vw - 1px) 0 calc(56.9182vw - 32px) calc(-1 * var(--m));height:33px}
  h2{font-size:26px;line-height:1.18}
  .kicker{font-size:14px}
  .cabsec{flex-direction:column;align-items:flex-start;gap:18px;margin-bottom:24px}
  .aux{font-size:15.5px}
  .enlace{font-size:15.5px;padding:6px 0;display:inline-block}
  .accesos{padding-top:44px;padding-bottom:52px}
  .accesos .kicker{margin-bottom:18px}
  .acc{grid-template-columns:1fr;gap:0}
  .acc a{display:grid;grid-template-columns:1fr auto;column-gap:16px;align-items:center;padding:18px 0 18px;min-height:76px;border-top:2px solid #000}
  .acc a:last-child{border-bottom:1px solid var(--sep)}
  .acc .tt{grid-column:1;font-size:20px}
  .acc .ds{grid-column:1;margin-top:4px;font-size:14.5px}
  .acc .ir{grid-column:2;grid-row:1 / span 2;margin:0;padding:0;font-size:22px}
  .areas{padding-bottom:60px}
  .grid8{grid-template-columns:1fr;gap:10px}
  .area{display:grid;grid-template-columns:30px 1fr 24px;column-gap:8px;align-items:start;padding:16px 16px 16px 18px;min-height:0}
  .area .n{grid-column:1;grid-row:1;margin-top:4px}
  .area .nom{grid-column:2;grid-row:1;margin-top:0;font-size:18.5px;line-height:1.28}
  .area .pie{display:contents}
  .area .pie > span:first-child{grid-column:2;grid-row:2;margin-top:4px;font-size:14.5px}
  .area .pie .flecha{grid-column:3;grid-row:1 / span 2;align-self:center;justify-self:end}
  .retos{padding-top:56px;padding-bottom:60px}
  .retos .cols{gap:22px}
  .lista a{font-size:17px;line-height:1.38;padding:18px 0;min-height:60px}
  .playbooks{padding-top:52px;padding-bottom:56px}
  .pb{padding:20px 18px 22px}
  .pb .marca{font-size:11px;letter-spacing:.06em}
  .pb .tt{font-size:18.5px}
  .pb li{font-size:15px}
  .pbrow{gap:12px}
  .nota{font-size:13.5px}
  .modelos{padding-top:56px;padding-bottom:60px}
  .grid4m{gap:26px}
  .mod{position:relative}
  .mod .nom{font-size:21px}
  .mod .res{font-size:15.5px}
  .mod .enlace::after{content:"";position:absolute;inset:0}
  .cierre{padding-bottom:48px}
  .cierre .fila{flex-direction:column;align-items:flex-start;gap:12px;padding-top:36px}
  .cierre p{font-size:18px}
  .pie .sup{grid-template-columns:1fr;grid-template-areas:"marca" "contacto" "nav";row-gap:30px;padding:56px 15px 40px}
  .pie .contacto{font-size:16px}
  .pie .navp{font-size:15.5px;gap:4px 16px}
  .pie .navp a{padding:9px 0}
  .pie .inf{flex-direction:column;gap:12px;padding:18px 15px;font-size:12.3px}
  .pie .inf .leg{gap:14px;flex-wrap:wrap;justify-content:center}
  .pie .inf .leg a{padding:8px 0}
}
@media (max-width:1279px){
  .comercial{padding:72px 0 80px;margin-bottom:80px}
  .comercial .cabsec{margin-bottom:32px}
  .comercial .t{max-width:700px}
  .comercial .entradilla{font-size:17px}
  .servicios{gap:20px}
  .serv{padding:26px 24px 24px}
  .serv h3{font-size:21px}
  .serv p{font-size:15.5px}
  .serv .acciones{min-height:116px;gap:0} 
  .com-cta,.secundario,.otro .enlace{display:inline-block;line-height:20px;padding:12px 0}
  .otro p{font-size:17px}
}
@media (max-width:899px){
  .comercial{padding:64px 0 72px;margin-bottom:64px}
  .servicios{grid-template-columns:1fr;gap:16px}
  .serv{display:grid;grid-template-columns:1fr 232px;column-gap:32px;align-items:start;padding:26px 26px 26px}
  .serv h3,.serv p{grid-column:1}
  .serv h3{font-size:22px}
  .serv .acciones{grid-column:2;grid-row:1 / span 2;margin-top:0;padding-top:2px;min-height:0}
  .otro{flex-direction:column;align-items:flex-start;gap:12px;margin-top:28px;padding-top:24px}
}
@media (max-width:599px){
  .comercial{padding:52px 0 56px;margin-bottom:48px}
  .comercial .cabsec{margin-bottom:26px}
  .comercial .entradilla{font-size:16.5px;margin-top:2px}
  .servicios{gap:14px}
  .serv{display:flex;flex-direction:column;padding:24px 22px 16px}
  .serv h3{font-size:21px}
  .serv p{font-size:16px;margin-top:10px}
  .serv .acciones{margin-top:0;padding-top:10px;min-height:0}
  .otro{gap:4px;margin-top:26px;padding-top:22px}
}
.campo input.ph{visibility:visible;border:0;background:transparent;font-family:inherit;color:var(--texto);outline:none;min-width:0;padding:0;height:100%;-webkit-appearance:none;appearance:none}
.campo input.ph::placeholder{color:var(--texto2);opacity:1}
.campo input.ph::-webkit-search-cancel-button{display:none}
.campo button.btn{border:0;cursor:pointer;font-family:inherit}
.campo:focus-within{border-color:var(--texto)}
.campo button.btn:focus-visible{outline:3px solid var(--texto);outline-offset:2px}
@media (max-width:599px){.campo input.ph::placeholder{color:transparent}}
.pb a.tt{display:block;text-decoration:none}
.pb a.tt:hover{text-decoration:underline;text-decoration-color:var(--rojo);text-underline-offset:4px}
.pb li a{color:inherit;text-decoration:none}
.pb li a:hover{text-decoration:underline}
@media (min-width:1441px){
  body{margin-left:auto;margin-right:auto}
}
@media (min-width:1280px) and (max-width:1439px){
  body{width:auto}
  .hero .foto,.hero .fundido{width:100%}
  .hero .foto{object-fit:cover;object-position:center}
}


/* Portada de la Biblioteca en móvil — corrección de capa de Digitis (la fuente de Emilio
   queda intacta). A 640 o menos su hero flex dejaba el buscador montado sobre la foto, el
   texto de ayuda suelto encima de la montaña y el header con el logo grande centrado.
   Reordenamos el flujo: lockup, claim, buscador y la foto como banda de cierre. */
@media (max-width: 640px) {
  /* Header del site compacto y alineado: logo a la izquierda, hamburguesa centrada */
  header .mainhead { display: flex !important; align-items: center !important; justify-content: space-between !important; min-height: 56px; padding: 8px 16px !important; }
  header .mainhead .logo img, header .mainhead .logo svg { height: 30px !important; width: auto !important; }
  header .mainhead .menu-btn { margin: 0 !important; }

  /* El hero, en columna y sin solapes */
  .hero { display: flex !important; flex-direction: column !important; align-items: stretch !important; padding: 20px 20px 0 !important; min-height: 0 !important; height: auto !important; }
  .hero > * { position: static !important; margin: 0 !important; max-width: none !important; }
  .hero .logoA { order: 1; height: 58px; width: auto; align-self: flex-start; margin-bottom: 14px !important; }
  .hero .promesa { order: 2; margin-bottom: 18px !important; }
  .hero .buscador { order: 3; width: 100% !important; margin-bottom: 10px !important; }
  .hero .buscador .ayuda { color: #4A5360 !important; text-shadow: none !important; margin-bottom: 10px !important; }
  .hero .buscador .ejemplos { margin-top: 10px !important; }
  /* La foto pasa a banda de cierre, a sangre y con altura contenida */
  .hero .foto { order: 9; width: calc(100% + 40px) !important; margin: 18px -20px 0 !important; height: 200px !important; object-fit: cover; object-position: center 30%; }
  .hero .fundido { display: none !important; }
}
