/* Murcia Camper - estilos de la web */
:root{
  --naranja:#EE7828; --marron:#CFB495; --negro:#171717; --gris-oscuro:#4D4D4D; --gris-claro:#DEDEDE;
  --arena:#F4EFE8; --marron-texto:#9A5A22;
  --titular:'Michroma',sans-serif; --texto:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
  --lado:clamp(20px,5vw,80px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--negro);font-family:var(--texto);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
a:hover{opacity:.85}
a:focus-visible{outline:3px solid var(--naranja);outline-offset:3px}
h1,h2,h3,p{margin:0}
.contenedor{max-width:1240px;margin:0 auto}
.sec{padding:112px var(--lado)}
.antetitulo{font-size:15px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--marron-texto)}
.titulo{font-family:var(--titular);font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1.25;text-transform:uppercase}
.boton{display:inline-block;text-decoration:none;font-weight:600;font-size:17px;padding:16px 28px;border-radius:6px}
.boton-naranja{background:var(--naranja);color:var(--negro)}
.boton-borde{border:2px solid #fff;color:#fff;padding:14px 26px}

/* Portada */
.portada{position:relative;min-height:760px;display:flex;flex-direction:column;color:#fff;
  background:var(--negro) url(../img/portada.jpg) 0% 55% / 140% auto no-repeat}
.portada::before{content:"";position:absolute;inset:0;background:rgba(23,23,23,.4)}
.cabecera{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:28px var(--lado)}
.cabecera img{width:200px;height:auto}
.menu{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;font-size:16px;font-weight:500}
.menu a{text-decoration:none;padding:10px 0}
.menu .boton{padding:12px 20px}
.portada-texto{position:relative;flex-grow:1;display:flex;flex-direction:column;justify-content:center;gap:28px;padding:40px var(--lado) 96px;max-width:1100px}
.portada-texto .antetitulo{color:var(--marron)}
.portada h1{font-family:var(--titular);font-weight:400;font-size:clamp(34px,5.4vw,76px);line-height:1.12;text-transform:uppercase}
.portada h1 span{color:var(--naranja)}
.portada-texto p.entrada{font-size:clamp(18px,1.6vw,22px);line-height:1.5;max-width:640px}
.botones{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}

/* Quiénes somos */
.nosotros-fila{display:flex;flex-wrap:wrap;gap:64px;align-items:center}
.nosotros-texto{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:22px}
.nosotros-texto p{font-size:19px;line-height:1.65;color:var(--gris-oscuro)}
.nosotros-foto{flex:1 1 420px;min-width:0;height:460px;object-fit:cover;border-radius:10px}
.valores{margin-top:72px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.valor{background:var(--negro);color:#fff;border-radius:10px;padding:32px;display:flex;flex-direction:column;gap:12px}
.valor span{font-family:var(--titular);font-size:15px;color:var(--naranja)}
.valor h3{font-size:22px;font-weight:600}
.valor p{color:var(--gris-claro)}

/* Trabajos */
.trabajos{background:var(--arena)}
.cabecera-seccion{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:40px}
.cabecera-seccion > div{display:flex;flex-direction:column;gap:14px;max-width:640px}
.cabecera-seccion a{font-weight:600;padding:10px 0}
.galeria{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.galeria img{width:100%;height:320px;object-fit:cover;border-radius:8px}

/* Cómo trabajamos */
.pasos{margin:48px 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.pasos li{border-top:4px solid var(--naranja);padding-top:22px;display:flex;flex-direction:column;gap:10px}
.pasos span{font-family:var(--titular);font-size:28px}
.pasos h3{font-size:21px;font-weight:600}
.pasos p{color:var(--gris-oscuro)}
.instalaciones{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch}
.instalaciones img{flex:1 1 360px;min-width:0;height:340px;object-fit:cover;border-radius:8px}
.instalaciones div{flex:1 1 300px;min-width:0;background:var(--negro);color:#fff;border-radius:8px;padding:32px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.instalaciones h3{font-family:var(--titular);font-weight:400;font-size:20px;line-height:1.35;text-transform:uppercase;color:var(--naranja)}
.instalaciones p{color:var(--gris-claro)}

/* Opiniones */
.opiniones{background:var(--arena)}
.nota-google{text-decoration:none;font-size:17px}
.estrellas{color:var(--naranja);letter-spacing:2px;font-size:18px}
.resenas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:20px}
.resena{margin:0;background:#fff;border-radius:10px;padding:32px;display:flex;flex-direction:column;gap:16px}
.resena blockquote{margin:0;display:flex;flex-direction:column;gap:12px;flex-grow:1}
.resena p{color:var(--gris-oscuro);font-size:17px;line-height:1.6}
.resena figcaption{font-weight:600;display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--gris-claro);padding-top:14px}
.resena figcaption span{font-weight:400;font-size:14px;color:var(--marron-texto)}
.resena-destacada{grid-column:1/-1;background:var(--negro)}
.resena-destacada p{color:#fff;font-size:clamp(18px,1.7vw,22px)}
.resena-destacada figcaption{color:#fff;border-top-color:rgba(255,255,255,.2)}
.resena-destacada figcaption span{color:var(--marron)}
.resenas-botones{margin-top:32px}
.boton-negro{background:var(--negro);color:#fff}

.intro{color:var(--gris-oscuro);font-size:18px;line-height:1.6}
.instalaciones .antetitulo{color:var(--marron)}
.llamada .antetitulo{color:var(--marron)}
.llamada .nota-formulario{font-size:16px;color:var(--marron);margin-top:4px}

/* Llamada final */
.llamada{background:var(--negro);color:#fff;padding:104px var(--lado)}
.llamada .contenedor{max-width:900px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:24px}
.llamada h2 span{color:var(--naranja)}
.llamada p{font-size:19px;color:var(--gris-claro);max-width:620px}
.llamada .botones{justify-content:center;margin:0}

/* Pie */
.pie{background:var(--naranja);color:var(--negro);padding:80px var(--lado) 40px}
.pie-fila{display:flex;flex-wrap:wrap;justify-content:space-between;gap:48px}
.pie-fila > img{width:280px;height:auto;align-self:flex-start}
.datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:32px 56px;flex:1 1 min(100%,520px);min-width:0;max-width:760px}
.datos div{display:flex;flex-direction:column;gap:8px}
.datos span{font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.datos a,.datos address{font-size:20px;font-weight:500;text-decoration:none;font-style:normal;line-height:1.4}
.legal{margin-top:56px;border-top:1px solid rgba(23,23,23,.35);padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:15px}
.legal nav{display:flex;flex-wrap:wrap;gap:6px 20px}

/* Páginas legales */
.pagina-legal{max-width:820px;margin:0 auto;padding:48px var(--lado) 96px}
.pagina-legal .volver{display:inline-block;margin-bottom:32px;font-weight:600}
.pagina-legal h1{font-family:var(--titular);font-weight:400;font-size:clamp(24px,3vw,34px);text-transform:uppercase;margin-bottom:24px}
.pagina-legal h2{font-size:20px;margin:32px 0 10px}
.pagina-legal p,.pagina-legal li{color:var(--gris-oscuro)}
.pagina-legal p{margin-bottom:12px}
.barra-legal{background:var(--negro);padding:20px var(--lado)}
.barra-legal img{width:170px;height:auto}

/* Móvil */
@media (max-width:1000px){.portada{background-size:cover;background-position:62% 50%}}
@media (max-width:720px){
  .portada{min-height:620px}
  .menu a:not(.boton){display:none}
  .sec,.llamada{padding-top:64px;padding-bottom:64px}
  .portada-texto{padding-bottom:56px}
  .galeria img,.instalaciones img{height:240px}
  .nosotros-foto{height:300px}
  .nosotros-fila{gap:40px}
  .valores{margin-top:48px}
}
