/* BeCleaning · estilos compartidos
   Paleta tomada del logo: amarillo #FFDF2A y negro. Granito para la piedra gallega. */
:root{
  --amarillo:#FFDF2A;
  --amarillo-2:#F2CF0C;
  --negro:#000;
  --grafito:#24231F;
  --granito:#6E6A62;
  --blanco:#fff;
  --papel:#F5F5F2;
  --display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --texto:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --borde:3px solid var(--negro);
  --ancho:1240px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;font-family:var(--texto);font-size:1.0625rem;line-height:1.6;color:var(--negro);background:var(--blanco)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--negro);outline-offset:3px;box-shadow:0 0 0 6px var(--amarillo)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.salto{position:absolute;left:1rem;top:-4rem;background:var(--negro);color:var(--amarillo);padding:.6rem 1rem;z-index:100;font-weight:700}
.salto:focus{top:1rem}
.caja{width:min(100% - 2.5rem,var(--ancho));margin-inline:auto}

/* Tipografía */
h1,h2,h3{font-family:var(--display);font-weight:900;line-height:.9;letter-spacing:.005em;margin:0;text-transform:uppercase}
h1{font-size:clamp(3.1rem,8.4vw,7.6rem)}
h2{font-size:clamp(2.4rem,5.4vw,4.6rem)}
h3{font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1}
p{margin:0 0 1em;max-width:66ch}
.entrada{font-size:clamp(1.15rem,1.6vw,1.35rem);line-height:1.5;max-width:44ch}

/* Botones */
.boton{display:inline-flex;align-items:center;gap:.6rem;font:700 1.05rem/1 var(--texto);padding:1rem 1.35rem;border:var(--borde);border-radius:6px;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s}
.boton svg{width:1.25em;height:1.25em;flex:none}
.boton--negro{background:var(--negro);color:var(--amarillo)}
.boton--claro{background:transparent;color:var(--negro)}
.boton--amarillo{background:var(--amarillo);color:var(--negro);border-color:var(--amarillo)}
.boton:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--negro)}
.boton--amarillo:hover{box-shadow:4px 4px 0 var(--blanco)}
.botones{display:flex;flex-wrap:wrap;gap:.8rem}

/* Cabecera */
.cabecera{background:var(--amarillo);border-bottom:var(--borde);position:sticky;top:0;z-index:50}
.cabecera .caja{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:76px}
.marca img{width:190px}
.menu{display:flex;align-items:center;gap:1.6rem}
.menu a{text-decoration:none;font-weight:600}
.menu a:not(.boton):hover,.menu a[aria-current]{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}
.menu .boton{padding:.7rem 1rem}
.abrir-menu{display:none;background:var(--negro);color:var(--amarillo);border:0;border-radius:6px;font:700 1rem var(--texto);padding:.7rem 1rem;cursor:pointer}
@media (max-width:900px){
  .abrir-menu{display:block}
  .marca img{width:160px}
  .menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--amarillo);border-bottom:var(--borde);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1.25rem}
  .menu.abierto{display:flex}
  .menu a:not(.boton){padding:.85rem 0;border-bottom:1px solid rgba(0,0,0,.25);font-size:1.15rem}
  .menu .boton{margin-top:1rem;justify-content:center}
}

/* Portada: héroe con fachada interactiva */
.heroe{background:var(--amarillo);border-bottom:var(--borde);overflow:hidden}
.heroe .caja{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:clamp(2.5rem,6vw,5.5rem)}
.heroe h1{margin-bottom:1.6rem}
.heroe h1 span{display:block}
.heroe .entrada{margin-bottom:2rem}
.zona-linea{margin-top:2rem;font-weight:600;display:flex;gap:.5rem;align-items:center}
.zona-linea svg{width:22px;height:22px;flex:none}

.fachada{position:relative;border:var(--borde);border-radius:8px;background:#cfcabd;aspect-ratio:4/5;box-shadow:10px 10px 0 var(--negro);overflow:hidden;cursor:none;touch-action:none;user-select:none}
.fachada canvas{position:absolute;inset:0;width:100%;height:100%}
.fachada .boquilla{position:absolute;left:0;top:0;width:58px;height:58px;margin:-29px 0 0 -29px;border:3px solid var(--amarillo);border-radius:50%;pointer-events:none;opacity:0;transition:opacity .2s;box-shadow:0 0 0 2px var(--negro)}
.fachada.activa .boquilla{opacity:1}
.fachada-pie{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.4rem;font-weight:600}
.medidor{display:flex;align-items:center;gap:.7rem}
.medidor-barra{width:120px;height:12px;border:2px solid var(--negro);border-radius:6px;overflow:hidden;background:var(--blanco)}
.medidor-barra i{display:block;height:100%;width:0;background:var(--negro);transition:width .3s}
.ensuciar{background:none;border:0;font:600 1rem var(--texto);text-decoration:underline;text-underline-offset:4px;cursor:pointer;padding:.3rem}
.fachada-aviso{position:absolute;left:1rem;right:1rem;bottom:1rem;background:var(--negro);color:var(--amarillo);padding:.8rem 1rem;border-radius:6px;font-weight:600;pointer-events:none;transition:opacity .4s}
.fachada-aviso.oculto{opacity:0}
@media (max-width:900px){
  .heroe .caja{grid-template-columns:1fr}
  .fachada{aspect-ratio:5/4;box-shadow:6px 6px 0 var(--negro)}
}

/* Secciones */
.seccion{padding-block:clamp(4rem,9vw,7.5rem)}
.seccion--negra{background:var(--negro);color:var(--blanco)}
.seccion--amarilla{background:var(--amarillo);border-block:var(--borde)}
.seccion--papel{background:var(--papel)}
.cabeza{display:grid;grid-template-columns:1fr 1fr;gap:2rem 4rem;align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem)}
.cabeza p{margin:0}
@media (max-width:800px){.cabeza{grid-template-columns:1fr}}

/* Lista de servicios: filas grandes, no tarjetas */
.servicios{list-style:none;margin:0;padding:0;border-top:2px solid var(--amarillo)}
.servicios li{border-bottom:2px solid var(--amarillo)}
.servicios a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:1.5rem 3rem;align-items:center;padding:2rem 0;text-decoration:none;transition:padding .2s,background .2s,color .2s}
.servicios h3{font-size:clamp(2rem,4.4vw,3.6rem);color:var(--amarillo);transition:color .2s}
.servicios p{margin:0;color:#d6d6d0}
.servicios .flecha{width:56px;height:56px;border:2px solid var(--amarillo);border-radius:50%;display:grid;place-items:center;color:var(--amarillo)}
.servicios .flecha svg{width:24px;height:24px}
.servicios a:hover,.servicios a:focus-visible{background:var(--amarillo);padding-inline:1.5rem}
.servicios a:hover h3,.servicios a:focus-visible h3,.servicios a:hover p,.servicios a:focus-visible p{color:var(--negro)}
.servicios a:hover .flecha,.servicios a:focus-visible .flecha{border-color:var(--negro);color:var(--negro)}
@media (max-width:800px){.servicios a{grid-template-columns:1fr auto}.servicios p{grid-column:1/-1;grid-row:2}}

/* Proceso (secuencia real) */
.pasos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border:var(--borde);border-radius:8px;overflow:hidden;background:var(--blanco)}
.pasos li{padding:2rem 1.6rem;border-right:var(--borde)}
.pasos li:last-child{border-right:0}
.pasos .n{font:900 3.6rem/1 var(--display);display:block;margin-bottom:1rem;-webkit-text-stroke:2px var(--negro);color:transparent}
.pasos h3{font-size:1.7rem;margin-bottom:.6rem}
.pasos p{margin:0;font-size:1rem}
@media (max-width:900px){.pasos{grid-template-columns:1fr 1fr}.pasos li:nth-child(2){border-right:0}.pasos li:nth-child(-n+2){border-bottom:var(--borde)}}
@media (max-width:540px){.pasos{grid-template-columns:1fr}.pasos li{border-right:0;border-bottom:var(--borde)}.pasos li:last-child{border-bottom:0}}

/* Materiales / problemas */
.dos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem)}
@media (max-width:800px){.dos{grid-template-columns:1fr}}
.lista-raya{list-style:none;margin:0;padding:0}
.lista-raya li{padding:1rem 0 1rem 2.2rem;border-bottom:2px solid currentColor;position:relative;font-weight:500}
.lista-raya li::before{content:"";position:absolute;left:0;top:1.35rem;width:1.1rem;height:.7rem;background:var(--amarillo);border:2px solid var(--negro)}
.seccion--negra .lista-raya li::before{border-color:var(--amarillo)}
.lista-raya strong{display:block;font:900 1.5rem/1.1 var(--display);text-transform:uppercase}

/* Zonas */
.zonas{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.zona{border:var(--borde);border-radius:8px;padding:2rem;background:var(--blanco)}
.zona h3{font-size:clamp(2.2rem,4vw,3.4rem);margin-bottom:1rem}
.zona p{margin-bottom:1.2rem}
.zona a{font-weight:700}
@media (max-width:700px){.zonas{grid-template-columns:1fr}}

/* Galería (pendiente de fotos reales) */
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.galeria figure{margin:0;border:var(--borde);border-radius:8px;overflow:hidden;background:var(--blanco)}
.galeria figcaption{padding:.7rem 1rem;font-weight:600;border-top:var(--borde)}
@media (max-width:800px){.galeria{grid-template-columns:1fr}}

/* Preguntas */
.preguntas details{border-bottom:var(--borde)}
.preguntas details:first-child{border-top:var(--borde)}
.preguntas summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.4rem 0;font:800 clamp(1.35rem,2.2vw,1.75rem)/1.15 var(--display);text-transform:uppercase}
.preguntas summary::-webkit-details-marker{display:none}
.preguntas summary::after{content:"+";font:900 2.2rem/1 var(--display);transition:transform .2s;flex:none}
.preguntas details[open] summary::after{transform:rotate(45deg)}
.preguntas details p{padding-bottom:1.2rem}

/* Presupuesto */
.presupuesto{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,6rem);align-items:start}
@media (max-width:900px){.presupuesto{grid-template-columns:1fr}}
.contacto-directo{display:grid;gap:.9rem;margin-top:2rem}
.contacto-directo a{display:flex;gap:.8rem;align-items:center;font:800 1.6rem/1.1 var(--display);text-decoration:none}
.contacto-directo a:hover{text-decoration:underline}
.contacto-directo svg{width:30px;height:30px;flex:none}
.formulario{background:var(--blanco);border:var(--borde);border-radius:8px;padding:clamp(1.4rem,3vw,2.4rem);box-shadow:10px 10px 0 var(--negro);display:grid;gap:1.1rem}
.formulario .fila{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media (max-width:560px){.formulario .fila{grid-template-columns:1fr}}
.formulario label{display:grid;gap:.35rem;font-weight:600}
.formulario input,.formulario select,.formulario textarea{font:inherit;padding:.8rem .9rem;border:2px solid var(--negro);border-radius:6px;background:var(--blanco);width:100%}
.formulario textarea{min-height:120px;resize:vertical}
.formulario .nota{font-size:.92rem;margin:0;color:#3d3c38}
.formulario .boton{justify-content:center}

/* Páginas interiores */
.portada{background:var(--amarillo);border-bottom:var(--borde);padding-block:clamp(2.5rem,6vw,5rem)}
.migas{font-size:.95rem;margin-bottom:1.5rem}
.migas ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0}
.migas li+li::before{content:"/";margin-right:.4rem}
.portada h1{font-size:clamp(2.6rem,7vw,6rem);max-width:16ch;margin-bottom:1.4rem}
.portada .entrada{margin-bottom:2rem}
.texto h2{margin:2.5rem 0 1.2rem;font-size:clamp(2rem,4vw,3.2rem)}
.texto h2:first-child{margin-top:0}
.texto ul{padding-left:1.2rem;max-width:66ch}
.texto li{margin-bottom:.4rem}
.legal h2{font-size:1.9rem;margin:2.2rem 0 .8rem}
.legal .hueco{background:var(--amarillo);padding:0 .3rem;font-weight:700}

/* Llamada final */
.final{background:var(--negro);color:var(--blanco);padding-block:clamp(3.5rem,8vw,6rem)}
.final .caja{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem}
.final h2{color:var(--amarillo);max-width:18ch}

/* Pie */
.cinta{height:14px;background:repeating-linear-gradient(-45deg,var(--amarillo) 0 18px,var(--negro) 18px 36px);border-top:var(--borde)}
.pie{background:var(--negro);color:#d6d6d0;padding-block:3.5rem 2rem;font-size:.98rem}
.pie .caja{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:2.5rem}
.pie img{width:220px;margin-bottom:1.2rem}
.pie h2{font-size:1.5rem;color:var(--amarillo);margin-bottom:.9rem}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.pie a{text-decoration:none}
.pie a:hover{color:var(--amarillo);text-decoration:underline}
.pie .bajo{grid-column:1/-1;border-top:1px solid #3a3a36;padding-top:1.5rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.9rem}
@media (max-width:900px){.pie .caja{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.pie .caja{grid-template-columns:1fr}}

/* Barra fija en móvil */
.barra-movil{display:none}
@media (max-width:760px){
  body{padding-bottom:68px}
  .barra-movil{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:60;border-top:var(--borde)}
  .barra-movil a{display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:64px;font-weight:700;text-decoration:none}
  .barra-movil a:first-child{background:var(--amarillo);color:var(--negro);border-right:var(--borde)}
  .barra-movil a:last-child{background:var(--negro);color:var(--amarillo)}
  .barra-movil svg{width:22px;height:22px}
}
.medidor span{white-space:nowrap}
@media (max-width:420px){.medidor-barra{width:80px}.fachada-pie{font-size:.95rem}}

/* Descuento */
.sello{display:inline-block;background:var(--negro);color:var(--amarillo);font:800 1.15rem/1.2 var(--display);text-transform:uppercase;letter-spacing:.02em;padding:.55rem .9rem;border-radius:6px;transform:rotate(-1.5deg);margin:1rem 0 0}
.seccion--negra .sello,.final .sello{background:var(--amarillo);color:var(--negro)}
.servicios .precio{display:block;margin-top:.4rem;font-weight:700;color:var(--amarillo)}
.servicios a:hover .precio,.servicios a:focus-visible .precio{color:var(--negro)}

/* Precios */
.precios{width:100%;border-collapse:collapse;border:var(--borde);border-radius:8px;overflow:hidden;font-size:1.05rem}
.precios th,.precios td{padding:1rem 1.1rem;text-align:left;border-bottom:2px solid var(--negro)}
.precios thead th{background:var(--negro);color:var(--amarillo);font:800 1.2rem var(--display);text-transform:uppercase}
.precios tbody th{font-weight:600}
.precios td{font:800 1.35rem/1 var(--display);white-space:nowrap}
.precios tbody tr:nth-child(odd){background:var(--papel)}

/* Blog */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.posts--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:900px){.posts,.posts--2{grid-template-columns:1fr}}
.post a{display:flex;flex-direction:column;gap:.8rem;height:100%;padding:1.8rem;border:var(--borde);border-radius:8px;text-decoration:none;background:var(--blanco);transition:transform .15s,box-shadow .15s}
.post a:hover,.post a:focus-visible{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--negro)}
.post time{font-weight:600;font-size:.95rem}
.post h2,.post h3{font-size:clamp(1.7rem,2.6vw,2.2rem);line-height:1}
.post p{margin:0;flex:1}
.post .leer{font-weight:700;text-decoration:underline;text-underline-offset:4px}
.articulo{max-width:760px}
.articulo h3{font-size:1.7rem;margin:1.8rem 0 .6rem}
.articulo .preguntas{margin-bottom:1rem}
.portada time{font-weight:600}
@media (max-width:560px){.precios th,.precios td{padding:.85rem .7rem}.precios td{font-size:1.15rem}}

/* Trabajos: antes y después */
.trabajos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,2.5rem)}
@media (max-width:800px){.trabajos{grid-template-columns:1fr}}
.pareja{margin:0}
.pareja-fotos{display:grid;grid-template-columns:1fr 1fr;gap:6px;border:var(--borde);border-radius:8px;overflow:hidden;background:var(--negro)}
.pareja-fotos>div{position:relative}
.pareja-fotos img{width:100%;aspect-ratio:4/5;object-fit:cover}
.etiqueta{position:absolute;left:.7rem;top:.7rem;z-index:1;background:var(--negro);color:var(--blanco);font:800 1rem/1 var(--display);text-transform:uppercase;padding:.45rem .6rem;border-radius:4px}
.etiqueta--despues{background:var(--amarillo);color:var(--negro)}
.pareja figcaption,.foto-ancha figcaption{margin-top:.8rem;font-size:1rem}
.foto-ancha{margin:clamp(1.5rem,3vw,2.5rem) 0 0;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:2rem;align-items:center}
.foto-ancha img{border:var(--borde);border-radius:8px;width:100%;aspect-ratio:4/5;object-fit:cover}
@media (max-width:800px){.foto-ancha{grid-template-columns:1fr;gap:0}}
.articulo .foto-ancha,.articulo>.pareja{margin:0 0 2.5rem}
.articulo .foto-ancha{grid-template-columns:1fr;gap:0;max-width:440px}
.post img{width:calc(100% + 3.6rem);max-width:none;margin:-1.8rem -1.8rem .4rem;aspect-ratio:16/10;object-fit:cover;border-bottom:var(--borde)}
.post a{overflow:hidden}
.texto .pareja{margin-top:2rem}
@media (max-width:800px){.foto-ancha img{aspect-ratio:4/3;object-position:50% 30%}}
