
:root {
    --crema: #f4efe9;
    --crema-oscuro: #e8ded3;
    --marfil: #fffdf9;
    --tinta: #201d1a;
    --texto: #5f5954;
    --arcilla: #9a6f5a;
    --arcilla-oscura: #68483a;
    --dorado: #b69566;
    --dorado-suave: #d8c4a6;
    --verde: #25b16b;
    --verde-oscuro: #1c8a54;
    --blanco: #ffffff;
    --linea: rgba(32, 29, 26, .14);
    --sombra: 0 28px 70px rgba(42, 31, 26, .14);
    --sombra-suave: 0 10px 30px rgba(42, 31, 26, .12);
    --serif: "Fraunces", Georgia, "Times New Roman", serif;
    --sans: "Plus Jakarta Sans", Arial, Helvetica, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { background: var(--marfil); color: var(--tinta); font-family: var(--sans); line-height: 1.6; }
body.menu-abierto { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.saltar-contenido {
    background: var(--tinta); color: white; left: 16px; padding: 11px 16px;
    position: fixed; top: 12px; transform: translateY(-160%); z-index: 9999;
}
.saltar-contenido:focus { transform: translateY(0); }
a:focus-visible, button:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }

.cabecera {
    align-items: center; display: flex; height: 92px; isolation: isolate;
    justify-content: space-between; left: 0; padding: 0 5.5%; position: sticky; top: 0;
    transition: height .3s ease; z-index: 1000;
}
.cabecera::before {
    backdrop-filter: blur(18px); background: rgba(255,253,249,.86);
    border-bottom: 1px solid var(--linea); content: ""; inset: 0; position: absolute;
    transition: background .3s ease, box-shadow .3s ease; z-index: -1;
}
.cabecera.con-scroll::before { background: rgba(255,253,249,.96); box-shadow: 0 10px 30px rgba(32,29,26,.08); }
.marca { align-items: center; display: flex; gap: 12px; }
.marca img {
    border: 1px solid rgba(154,111,90,.35); border-radius: 50%; height: 58px;
    object-fit: cover; width: 58px;
}
.marca strong, .marca small { display: block; }
.marca strong { font-family: var(--serif); font-size: 21px; font-weight: 400; letter-spacing: .2px; }
.marca small { color: var(--texto); font-size: 9px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; }

.navegacion { align-items: center; display: flex; gap: 29px; }
.navegacion a {
    font-size: 12px; font-weight: 700; letter-spacing: .8px; position: relative;
    text-transform: uppercase; transition: color .2s ease, letter-spacing .2s ease;
}
.navegacion a::after {
    background: var(--arcilla); bottom: -8px; content: ""; height: 1px; left: 0;
    position: absolute; transform: scaleX(0); transform-origin: left; transition: transform .3s cubic-bezier(.2,.7,.2,1); width: 100%;
}
.navegacion a:hover { color: var(--arcilla-oscura); letter-spacing: 1.1px; }
.navegacion a:hover::after { transform: scaleX(1); }
.nav-whatsapp { display: none; }
.boton-menu span { border-radius: 2px; }
.boton-menu:hover span { background: var(--arcilla); }

.boton-menu { background: transparent; border: 0; cursor: pointer; display: none; height: 34px; width: 34px; }
.boton-menu span { background: var(--tinta); display: block; height: 1px; margin: 6px 0; transition: .25s; width: 28px; }
.boton-menu.activo span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.boton-menu.activo span:nth-child(2) { opacity: 0; }
.boton-menu.activo span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.boton {
    align-items: center; background: var(--arcilla); border: 1px solid var(--arcilla);
    color: white; display: inline-flex; font-size: 12px; font-weight: 800;
    justify-content: center; letter-spacing: .7px; min-height: 48px; padding: 13px 23px;
    text-transform: uppercase; transition: .25s ease;
}
.boton:hover { background: var(--arcilla-oscura); border-color: var(--arcilla-oscura); transform: translateY(-2px); }
.boton-cabecera { min-height: 43px; padding: 10px 19px; }
.boton-claro { background: var(--crema); border-color: var(--crema); color: var(--tinta); }
.boton-claro:hover { background: white; border-color: white; color: var(--tinta); }
.boton-transparente { background: transparent; border-color: rgba(255,255,255,.55); color: white; }
.boton-transparente:hover { background: white; border-color: white; color: var(--tinta); }
.boton-borde { background: transparent; border-color: var(--tinta); color: var(--tinta); }
.boton-borde:hover { background: var(--tinta); border-color: var(--tinta); color: white; }

.hero {
    align-items: center; color: white; display: flex; min-height: calc(100vh - 92px);
    overflow: hidden; padding: 130px 7% 150px; position: relative;
}
.hero-fondo {
    background: url("56d6aa24-4db8-4801-a72b-13b5991c00d7.jpg") center 40% / cover;
    inset: 0; position: absolute; transform: scale(1.02);
}
.hero-velo {
    background: linear-gradient(90deg, rgba(22,18,16,.82) 0%, rgba(22,18,16,.5) 44%, rgba(22,18,16,.15) 75%),
                linear-gradient(0deg, rgba(22,18,16,.38), transparent 45%);
    inset: 0; position: absolute;
}
.hero-contenido {
    max-width: 720px; position: relative; width: 100%; z-index: 2;
}
.sobrelinea { font-size: 11px; font-weight: 800; letter-spacing: 2.4px; margin-bottom: 18px; text-transform: uppercase; }
.sobrelinea.oscura { color: var(--arcilla); }
.hero h1 {
    font-family: var(--serif); font-size: clamp(65px, 8.2vw, 126px); font-weight: 400;
    letter-spacing: -5px; line-height: .84; margin-bottom: 30px;
}
.hero h1 em { color: #e5cbb9; font-weight: 400; }
.hero-texto { color: rgba(255,255,255,.82); font-size: 18px; max-width: 610px; }
.acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 35px; }

.hero-ficha {
    background: rgba(255,253,249,.93); bottom: 56px; color: var(--tinta);
    padding: 25px 28px; position: absolute; right: 5.5%; width: 285px; z-index: 2;
}
.hero-ficha span { color: var(--arcilla); display: block; font-size: 10px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; }
.hero-ficha strong { display: block; font-family: var(--serif); font-size: 24px; font-weight: 400; margin-top: 5px; }
.hero-ficha p { color: var(--texto); font-size: 13px; }
.hero-ficha a { border-bottom: 1px solid var(--linea); display: inline-block; font-size: 12px; font-weight: 800; margin-top: 15px; padding-bottom: 3px; }

.desplazar {
    align-items: center; bottom: 32px; display: flex; font-size: 9px; font-weight: 800;
    gap: 10px; left: 7%; letter-spacing: 1.7px; position: absolute; text-transform: uppercase; z-index: 2;
}
.desplazar span { background: rgba(255,255,255,.7); height: 1px; width: 42px; }

.franja-confianza {
    background: var(--crema); display: grid; grid-template-columns: repeat(4, 1fr); padding: 29px 7%;
}
.franja-confianza div { border-right: 1px solid var(--linea); padding-left: 30px; }
.franja-confianza div:first-child { padding-left: 0; }
.franja-confianza div:last-child { border-right: 0; }
.franja-confianza strong { display: block; font-family: var(--serif); font-size: 22px; font-weight: 400; }
.franja-confianza span { color: var(--texto); font-size: 10px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; }

.seccion { padding: 125px 7%; }
.presentacion { align-items: center; display: grid; gap: 9%; grid-template-columns: .9fr 1.1fr; }
.presentacion-imagen { min-height: 650px; position: relative; }
.presentacion-imagen > img { height: 650px; object-fit: cover; width: 88%; }
.sello {
    background: var(--arcilla); bottom: 55px; color: white; padding: 28px; position: absolute; right: 0; width: 215px;
}
.sello span, .sello strong { display: block; font-family: var(--serif); font-size: 25px; font-weight: 400; line-height: 1.05; }
.sello strong { font-style: italic; }
.presentacion-texto { max-width: 680px; }
.presentacion h2, .cabecera-seccion h2, .experiencia h2, .cta h2, .contacto h2 {
    font-family: var(--serif); font-size: clamp(43px, 5.2vw, 77px); font-weight: 400;
    letter-spacing: -2.7px; line-height: .98;
}
.presentacion-texto > p:not(.sobrelinea) { color: var(--texto); font-size: 17px; margin-top: 25px; max-width: 620px; }
.enlace-linea { border-bottom: 1px solid var(--tinta); display: inline-flex; font-size: 12px; font-weight: 800; gap: 40px; margin-top: 34px; padding-bottom: 7px; text-transform: uppercase; }
.enlace-linea span { color: var(--arcilla); }

.servicios { background: #eee6de; }
.cabecera-seccion { align-items: end; display: flex; justify-content: space-between; margin-bottom: 62px; }
.cabecera-seccion > p { color: var(--texto); max-width: 420px; }
.cabecera-seccion.centrada { justify-content: center; text-align: center; }

.servicios-grid { display: grid; gap: 18px; grid-template-columns: 1.2fr .8fr; }
.servicio { min-height: 430px; overflow: hidden; position: relative; }
.servicio-grande { grid-row: span 2; min-height: 878px; }
.servicio-ancho { min-height: 430px; }
.servicio img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: transform .7s ease; width: 100%; }
.servicio:hover img { transform: scale(1.045); }
.servicio-capa { background: linear-gradient(0deg, rgba(24,19,17,.85), rgba(24,19,17,.05) 70%); inset: 0; position: absolute; }
.servicio-contenido { bottom: 0; color: white; left: 0; padding: 35px; position: absolute; right: 0; }
.servicio-contenido > span { font-size: 10px; font-weight: 800; letter-spacing: 1.7px; }
.servicio h3 { font-family: var(--serif); font-size: 41px; font-weight: 400; line-height: 1; margin: 9px 0 10px; }
.servicio p { color: rgba(255,255,255,.78); max-width: 440px; }
.servicio a { border-bottom: 1px solid rgba(255,255,255,.6); display: inline-block; font-size: 11px; font-weight: 800; margin-top: 18px; padding-bottom: 4px; text-transform: uppercase; }

.experiencia { color: white; min-height: 760px; overflow: hidden; padding: 120px 7%; position: relative; }
.experiencia-fondo {
    background: linear-gradient(90deg, rgba(27,23,20,.92), rgba(27,23,20,.45)),
                url("c67af0e8-4e30-424c-83e3-0300f27524d1.jpg") center / cover;
    inset: 0; position: absolute;
}
.experiencia-contenido { max-width: 1150px; position: relative; z-index: 1; }
.experiencia h2 { max-width: 820px; }
.pasos { display: grid; gap: 40px; grid-template-columns: repeat(3, 1fr); margin-top: 75px; }
.pasos article { border-top: 1px solid rgba(255,255,255,.32); padding-top: 25px; }
.pasos span { color: #dfc6b4; font-size: 11px; font-weight: 800; }
.pasos h3 { font-family: var(--serif); font-size: 30px; font-weight: 400; margin: 9px 0; }
.pasos p { color: rgba(255,255,255,.72); max-width: 280px; }

.resenas { background: var(--marfil); }
.testimonios-grid {
    display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0,1fr));
    margin: 0 auto 60px; max-width: 1150px;
}
.testimonio-tarjeta {
    background: var(--crema); border: 1px solid var(--linea); display: flex; flex-direction: column;
    gap: 18px; padding: 34px 30px; transition: box-shadow .3s ease, transform .3s ease;
}
.testimonio-tarjeta:hover { box-shadow: var(--sombra-suave); transform: translateY(-4px); }
.testimonio-tarjeta .estrellas { color: var(--dorado); display: flex; gap: 3px; margin: 0; }
.testimonio-tarjeta .estrellas svg { fill: var(--dorado); height: 15px; width: 15px; }
.testimonio-tarjeta p { color: var(--tinta); flex-grow: 1; font-size: 15px; line-height: 1.55; }
.testimonio-autor { border-top: 1px solid var(--linea); display: flex; flex-direction: column; gap: 2px; padding-top: 16px; }
.testimonio-autor strong { font-family: var(--serif); font-size: 17px; font-weight: 400; }
.testimonio-autor span { color: var(--arcilla); font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; }
.resena-destacada {
    background: var(--crema); border: 1px solid var(--linea); box-shadow: var(--sombra-suave);
    display: flex; flex-direction: column; align-items: center; margin: auto; max-width: 620px;
    padding: 64px 56px; text-align: center; transition: box-shadow .35s ease, transform .35s ease;
}
.resena-destacada:hover { box-shadow: var(--sombra); transform: translateY(-4px); }
.google-g { height: 42px; margin-bottom: 18px; width: 42px; }
.estrellas { color: var(--dorado); display: flex; gap: 5px; margin-bottom: 26px; }
.estrellas svg { fill: var(--dorado); height: 19px; width: 19px; }
.resena-destacada h3 { font-family: var(--serif); font-size: clamp(28px, 3.4vw, 36px); font-weight: 400; line-height: 1.15; margin-bottom: 14px; }
.resena-destacada p { color: var(--texto); margin-bottom: 30px; max-width: 460px; }
.resena-botones { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.resena-destacada .boton span { transition: transform .25s ease; display: inline-block; }
.resena-destacada .boton:hover span { transform: translateX(4px); }

.cta {
    background: var(--arcilla-oscura); color: white; min-height: 510px; padding: 105px 7%;
    position: relative; text-align: center;
}
.cta::before {
    border: 1px solid rgba(255,255,255,.16); content: ""; inset: 25px; pointer-events: none; position: absolute;
}
.cta-contenido { margin: auto; max-width: 850px; position: relative; }
.cta h2 { font-size: clamp(55px, 7vw, 95px); }
.cta p:not(.sobrelinea) { color: rgba(255,255,255,.76); font-size: 17px; margin: 20px 0 30px; }

.contacto { align-items: stretch; display: grid; gap: 7%; grid-template-columns: .82fr 1.18fr; }
.contacto-info { padding: 30px 0; }
.contacto h2 { margin-bottom: 45px; }
.dato-contacto { border-top: 1px solid var(--linea); padding: 22px 0; }
.dato-contacto > span { color: var(--arcilla); display: block; font-size: 10px; font-weight: 800; letter-spacing: 1.6px; margin-bottom: 8px; text-transform: uppercase; }
.dato-contacto p { color: var(--texto); margin-bottom: 7px; }
.dato-contacto a { border-bottom: 1px solid var(--linea); font-size: 12px; font-weight: 800; }
.contacto-botones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.mapa { min-height: 670px; }
.mapa iframe { border: 0; filter: grayscale(.16); height: 100%; min-height: 670px; width: 100%; }

.pie { background: #1c1917; color: white; padding: 70px 5.5% 34px; }
.pie-superior {
    display: grid; gap: 48px 40px;
    grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr));
    padding-bottom: 45px;
}
.pie-marca { max-width: 340px; }
.pie-lema { color: rgba(255,255,255,.55); font-size: 13px; line-height: 1.65; margin-top: 20px; }
.marca-pie img { border-color: rgba(255,255,255,.24); }
.marca-pie small { color: rgba(255,255,255,.55); }
.pie-columna { display: flex; flex-direction: column; gap: 12px; }
.pie-columna h2 {
    color: var(--dorado-suave); font-family: var(--sans); font-size: 10px; font-weight: 800;
    letter-spacing: 1.6px; margin-bottom: 6px; text-transform: uppercase;
}
.pie-columna a {
    color: rgba(255,255,255,.72); font-size: 13px; transition: color .2s ease;
    width: fit-content;
}
.pie-columna a:hover { color: white; text-decoration: underline; text-underline-offset: 4px; }
.pie-inferior {
    align-items: center; border-top: 1px solid rgba(255,255,255,.14); display: flex;
    flex-direction: column; gap: 8px; justify-content: center; padding: 28px 140px 0;
    text-align: center;
}
.pie-inferior p { color: rgba(255,255,255,.45); font-size: 11px; }

.whatsapp-flotante {
    align-items: center; background: var(--verde); border-radius: 100px; bottom: 24px;
    box-shadow: 0 14px 34px rgba(28,138,84,.4); color: white; display: flex; font-size: 11px;
    font-weight: 800; gap: 11px; letter-spacing: 1px; padding: 14px 20px 14px 16px;
    position: fixed; right: 24px; text-transform: uppercase; transition: transform .25s ease, box-shadow .25s ease;
    z-index: 900;
}
.whatsapp-flotante:hover { box-shadow: 0 18px 40px rgba(28,138,84,.48); transform: translateY(-3px); }
.whatsapp-flotante strong {
    align-items: center; background: rgba(255,255,255,.16); border-radius: 50%;
    display: flex; flex-shrink: 0; height: 30px; justify-content: center; position: relative; width: 30px;
}
.whatsapp-flotante strong svg { height: 17px; position: relative; width: 17px; z-index: 1; }
.whatsapp-flotante strong::after {
    animation: pulso-whatsapp 2.4s ease-out infinite; border: 1px solid rgba(255,255,255,.85);
    border-radius: 50%; content: ""; inset: 0; position: absolute;
}
@keyframes pulso-whatsapp {
    0% { opacity: .8; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.9); }
}

.revelar { opacity: 0; transform: translateY(25px); transition: opacity .75s ease, transform .75s ease; }
.revelar.visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1050px) {
    .navegacion { gap: 17px; }
    .boton-cabecera { display: none; }
    .presentacion { gap: 6%; }
    .presentacion-imagen > img { width: 94%; }
}

@media (max-width: 820px) {
    .cabecera { height: 78px; padding: 0 5%; }
    html { scroll-padding-top: 78px; }
    .marca img { height: 48px; width: 48px; }
    .marca strong { font-size: 18px; }
    .marca small { display: none; }
    .boton-menu { display: block; position: relative; z-index: 1002; }
    .navegacion {
        align-items: stretch; background: linear-gradient(165deg, var(--marfil) 0%, var(--crema) 100%);
        flex-direction: column; inset: 0; isolation: isolate;
        justify-content: center; opacity: 0; overflow-y: auto; padding: 110px 8% 40px;
        pointer-events: none; position: fixed; height: 100svh; transition: opacity .35s ease, visibility .35s ease;
        visibility: hidden; z-index: 1001; counter-reset: navlink;
    }
    .navegacion::before {
        background: radial-gradient(circle at 88% 8%, rgba(154,111,90,.18), transparent 55%);
        content: ""; inset: 0; pointer-events: none; position: absolute; z-index: -1;
    }
    .navegacion.abierta { opacity: 1; pointer-events: auto; visibility: visible; }
    .navegacion a {
        align-items: center; border-radius: 16px; counter-increment: navlink;
        display: flex; font-family: var(--serif); font-size: 34px; font-weight: 400;
        gap: 16px; letter-spacing: -1px; margin: 0 -14px; opacity: 0; padding: 14px 14px;
        text-transform: none; transform: translateY(16px);
        transition: opacity .45s ease, transform .45s ease, background .2s ease, color .2s ease;
        width: calc(100% + 28px);
    }
    .navegacion a:not(.nav-whatsapp):not(:last-of-type) { border-bottom: 1px solid var(--linea); }
    .navegacion a:hover, .navegacion a:active { background: rgba(154,111,90,.1); }
    .navegacion a.activo { color: var(--arcilla-oscura); }
    .navegacion a::before {
        align-items: center; background: var(--crema-oscuro); border-radius: 50%;
        color: var(--arcilla); content: counter(navlink, decimal-leading-zero); display: flex;
        flex-shrink: 0; font-family: var(--sans); font-size: 11px; font-weight: 700;
        height: 32px; justify-content: center; letter-spacing: .5px; width: 32px;
    }
    .navegacion a.activo::before { background: var(--arcilla); color: white; }
    .navegacion a:first-child { border-top: 0; }
    .navegacion.abierta a { opacity: 1; transform: translateY(0); }
    .navegacion.abierta a:nth-child(1) { transition-delay: .08s; }
    .navegacion.abierta a:nth-child(2) { transition-delay: .13s; }
    .navegacion.abierta a:nth-child(3) { transition-delay: .18s; }
    .navegacion.abierta a:nth-child(4) { transition-delay: .23s; }
    .navegacion.abierta a:nth-child(5) { transition-delay: .28s; }
    .navegacion.abierta a:nth-child(6) { transition-delay: .33s; }
    .navegacion a::after { display: none; }
    .nav-whatsapp {
        align-items: center; background: var(--verde); border-radius: 14px; border-top: 0 !important;
        box-shadow: var(--sombra-suave); color: white !important;
        display: flex; font-family: var(--sans) !important; font-size: 13px !important; font-weight: 800;
        gap: 10px; justify-content: center; letter-spacing: .6px; margin: 24px -14px 0; width: calc(100% + 28px);
        padding: 18px !important; text-transform: uppercase;
    }
    .nav-whatsapp:hover, .nav-whatsapp:active { background: var(--verde-oscuro); }
    .nav-whatsapp::before { display: none; }
    .nav-whatsapp svg { height: 18px; width: 18px; }
    .boton-menu.activo { background: var(--crema-oscuro); border-radius: 50%; }

    .hero { min-height: calc(100svh - 78px); padding: 110px 7% 130px; }
    .hero-fondo { background-position: 61% center; }
    .hero-velo { background: linear-gradient(90deg, rgba(20,17,15,.84), rgba(20,17,15,.32)); }
    .hero-contenido { max-width: none; }
    .hero h1 { font-size: clamp(58px, 16vw, 88px); letter-spacing: -3px; }
    .hero-texto { font-size: 16px; }
    .hero-ficha { display: none; }
    .desplazar { bottom: 22px; }

    .franja-confianza { grid-template-columns: repeat(2, 1fr); padding: 10px 5%; }
    .franja-confianza div { border-bottom: 1px solid var(--linea); border-right: 0; padding: 18px 12px; }
    .franja-confianza strong { font-size: 18px; }

    .seccion { padding: 85px 6%; }
    .presentacion { grid-template-columns: 1fr; }
    .presentacion-imagen { min-height: 510px; }
    .presentacion-imagen > img { height: 510px; width: 92%; }
    .presentacion-texto { margin-top: 45px; }
    .cabecera-seccion { align-items: start; flex-direction: column; gap: 25px; }
    .servicios-grid { grid-template-columns: 1fr; }
    .servicio, .servicio-grande, .servicio-ancho { grid-row: auto; min-height: 520px; }
    .pasos { grid-template-columns: 1fr; margin-top: 55px; }
    .experiencia { min-height: auto; }
    .testimonios-grid { grid-template-columns: 1fr; margin-bottom: 40px; }
    .resena-destacada { padding: 46px 28px; }
    .contacto { grid-template-columns: 1fr; }
    .mapa, .mapa iframe { min-height: 470px; }
    .pie { padding: 55px 6% 30px; }
    .pie-superior { gap: 38px 30px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pie-marca { grid-column: 1 / -1; max-width: none; }
    .pie-inferior { padding: 24px 24px 0; }
}

@media (max-width: 520px) {
    .hero { padding: 100px 6% 120px; }
    .hero-contenido { max-width: none; }
    .hero h1 { font-size: 58px; }
    .acciones .boton { width: 100%; }
    .sobrelinea { letter-spacing: 1.5px; }
    .presentacion h2, .cabecera-seccion h2, .experiencia h2, .cta h2, .contacto h2 { font-size: 43px; letter-spacing: -1.8px; }
    .presentacion-imagen { min-height: 430px; }
    .presentacion-imagen > img { height: 430px; width: 100%; }
    .sello { bottom: -25px; right: 12px; width: 190px; }
    .presentacion-texto { margin-top: 70px; }
    .servicio, .servicio-grande, .servicio-ancho { min-height: 470px; }
    .servicio-contenido { padding: 27px; }
    .servicio h3 { font-size: 36px; }
    .resena-destacada h3 { font-size: 32px; }
    .cta { min-height: 470px; padding: 85px 7%; }
    .cta::before { inset: 14px; }
    .contacto-botones .boton { width: 100%; }
    .whatsapp-flotante span { display: none; }
    .whatsapp-flotante { border-radius: 50%; padding: 10px; }
    .pie-superior { grid-template-columns: 1fr; gap: 32px; }
    .pie-inferior { align-items: center; gap: 6px; padding: 24px 20px 0; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important; animation-iteration-count: 1 !important;
        scroll-behavior: auto !important; transition-duration: .01ms !important;
    }
    .revelar { opacity: 1; transform: none; }
}


/* Corrección de desbordamiento horizontal */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.hero,
.franja-confianza,
.seccion,
.experiencia,
.cta,
.contacto,
.pie {
    min-width: 0;
    max-width: 100%;
}

.franja-confianza > div {
    min-width: 0;
}

.franja-confianza strong,
.franja-confianza span {
    overflow-wrap: anywhere;
}

/* Los títulos largos nunca deben desbordar en pantallas estrechas */
h1, h2, h3, .precios-lista span, .testimonio-tarjeta p { overflow-wrap: break-word; }

/* Áreas táctiles cómodas en móvil */
@media (max-width: 820px) {
    .pie-columna a, .migas a { padding: 5px 0; }
    .pie-columna { gap: 6px; }
}

@media (max-width: 1150px) {
    .franja-confianza {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .franja-confianza div {
        border-bottom: 1px solid var(--linea);
        border-right: 0;
        padding: 22px 24px;
    }

    .franja-confianza div:nth-child(odd) {
        border-right: 1px solid var(--linea);
    }

    .franja-confianza div:nth-last-child(-n + 2) {
        border-bottom: 0;
    }
}

@media (max-width: 560px) {
    .franja-confianza {
        grid-template-columns: 1fr;
        padding: 8px 6%;
    }

    .franja-confianza div,
    .franja-confianza div:nth-child(odd) {
        border-bottom: 1px solid var(--linea);
        border-right: 0;
        padding: 17px 0;
    }

    .franja-confianza div:last-child {
        border-bottom: 0;
    }
}


/* Navegación multipágina */
.navegacion a.activo::after { transform: scaleX(1); }
.migas {
    align-items: center; background: var(--crema); color: var(--texto); display: flex;
    font-size: 11px; gap: 12px; letter-spacing: .5px; padding: 15px 7%;
}
.migas strong { color: var(--tinta); }

.subhero {
    align-items: center; color: white; display: flex; min-height: 690px;
    overflow: hidden; padding: 120px 7%; position: relative;
}
.subhero > img {
    height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%;
}
.subhero-capa {
    background: linear-gradient(90deg, rgba(22,18,16,.84), rgba(22,18,16,.2));
    inset: 0; position: absolute;
}
.subhero-contenido {
    max-width: 760px; position: relative; width: 100%; z-index: 2;
}
.subhero h1, .cabecera-simple h1 {
    font-family: var(--serif); font-size: clamp(58px, 7.5vw, 110px);
    font-weight: 400; letter-spacing: -4px; line-height: .9;
}
.subhero-contenido > p:not(.sobrelinea) {
    color: rgba(255,255,255,.82); font-size: 18px; margin: 28px 0 32px; max-width: 620px;
}

.detalle-grid {
    display: grid; gap: 1px; grid-template-columns: repeat(2, minmax(0,1fr)); background: var(--linea);
}
.detalle-tarjeta { background: var(--marfil); min-height: 280px; padding: 44px; }
.detalle-tarjeta span { color: var(--arcilla); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; }
.detalle-tarjeta h3 { font-family: var(--serif); font-size: 34px; font-weight: 400; margin: 18px 0 12px; }
.detalle-tarjeta p { color: var(--texto); max-width: 520px; }

.bloque-metodo {
    background: var(--arcilla-oscura); color: white; display: grid; gap: 9%;
    grid-template-columns: .9fr 1.1fr; padding: 110px 7%;
}
.bloque-metodo h2 {
    font-family: var(--serif); font-size: clamp(48px, 5vw, 74px); font-weight: 400; letter-spacing: -2.5px; line-height: .98;
}
.metodo-lista { list-style: none; }
.metodo-lista li {
    border-top: 1px solid rgba(255,255,255,.25); display: grid; gap: 25px;
    grid-template-columns: 55px 1fr; padding: 27px 0;
}
.metodo-lista span { color: #dec1ad; font-size: 11px; font-weight: 800; }
.metodo-lista h3 { font-family: var(--serif); font-size: 28px; font-weight: 400; }
.metodo-lista p { color: rgba(255,255,255,.7); margin-top: 5px; }

.precios-contenedor { display: grid; gap: 0 70px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.precios-grupo { border-top: 1px solid var(--linea); padding: 40px 0; }
.precios-contenedor > .precios-grupo:nth-child(1),
.precios-contenedor > .precios-grupo:nth-child(2) { border-top: 0; }
.precios-grupo h3 {
    font-family: var(--serif); font-size: 15px; font-weight: 700; letter-spacing: 1.2px;
    margin-bottom: 20px; text-transform: uppercase; color: var(--arcilla);
}
.precios-lista { list-style: none; }
.precios-lista li {
    align-items: baseline; border-top: 1px solid var(--linea); display: flex;
    gap: 18px; justify-content: space-between; padding: 13px 0;
}
.precios-lista li:first-child { border-top: 0; }
.precios-lista span:first-child { color: var(--texto); }
.precios-lista strong {
    color: var(--tinta); font-family: var(--serif); font-size: 18px;
    font-weight: 400; white-space: nowrap;
}
.precios-nota-grupo { color: var(--texto); font-size: 12px; font-style: italic; margin-top: 14px; }
.precios-pie {
    color: var(--texto); font-size: 13px; margin-top: 50px; padding-top: 30px;
    border-top: 1px solid var(--linea);
}
.precios-contenedor.simple { grid-template-columns: 1fr; max-width: 640px; }
@media (max-width: 820px) {
    .precios-contenedor { grid-template-columns: 1fr; }
    .precios-contenedor > .precios-grupo:nth-child(2) { border-top: 1px solid var(--linea); }
}

.faq-lista { margin: auto; max-width: 960px; }
.faq-item { border-top: 1px solid var(--linea); }
.faq-item:last-child { border-bottom: 1px solid var(--linea); }
.faq-item summary {
    cursor: pointer; font-family: var(--serif); font-size: 25px; list-style: none; padding: 25px 50px 25px 0; position: relative;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:focus-visible { outline: 3px solid var(--arcilla); outline-offset: 2px; }
.faq-item summary:hover { color: var(--arcilla-oscura); }
.faq-item summary::after { color: var(--arcilla); content: "+"; font-family: var(--sans); font-size: 28px; position: absolute; right: 5px; top: 20px; }
.faq-item[open] summary::after { content: "−"; }
.faq-item p { color: var(--texto); padding: 0 55px 26px 0; }

.enlaces-servicio-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.enlace-servicio { min-height: 560px; overflow: hidden; position: relative; }
.enlace-servicio img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: transform .7s; width: 100%; }
.enlace-servicio::after { background: linear-gradient(0deg, rgba(24,19,17,.88), rgba(24,19,17,.05)); content:""; inset:0; position:absolute; }
.enlace-servicio:hover img { transform: scale(1.04); }
.enlace-servicio > div { bottom: 0; color: white; left: 0; padding: 36px; position: absolute; right: 0; z-index: 2; }
.enlace-servicio span { font-size: 10px; font-weight: 800; letter-spacing: 1.5px; }
.enlace-servicio h3 { font-family: var(--serif); font-size: 42px; font-weight: 400; line-height: 1; margin: 10px 0; }
.enlace-servicio p { color: rgba(255,255,255,.74); }
.enlace-servicio strong { border-bottom: 1px solid rgba(255,255,255,.6); display: inline-block; font-size: 11px; margin-top: 18px; padding-bottom: 4px; text-transform: uppercase; }

.cabecera-simple { background: var(--crema); padding: 110px 7% 85px; }
.cabecera-simple p:last-child { color: var(--texto); font-size: 18px; margin-top: 22px; }
.historia { align-items: start; display: grid; gap: 9%; grid-template-columns: 1fr 1fr; }
.historia-texto p { color: var(--texto); font-size: 18px; margin-bottom: 24px; }
.valores { background: var(--crema); display: grid; gap: 1px; grid-template-columns: repeat(3,1fr); padding: 0 7% 110px; }
.valores article { background: var(--marfil); min-height: 300px; padding: 45px; }
.valores span { color: var(--arcilla); font-size: 10px; font-weight: 800; }
.valores h3 { font-family: var(--serif); font-size: 32px; font-weight: 400; margin: 22px 0 12px; }
.valores p { color: var(--texto); }
.contacto-pagina { padding-top: 80px; }

@media (max-width: 1050px) {
    .navegacion { gap: 14px; }
    .navegacion a { font-size: 10px; }
}
@media (max-width: 820px) {
    .subhero { min-height: 610px; padding: 110px 7%; }
    .subhero h1, .cabecera-simple h1 { font-size: 58px; letter-spacing: -2.5px; }
    .detalle-grid, .enlaces-servicio-grid, .bloque-metodo, .historia, .valores { grid-template-columns: 1fr; }
    .enlace-servicio { min-height: 500px; }
    .bloque-metodo { gap: 55px; }
    .valores { padding: 0 6% 80px; }
}
@media (max-width: 520px) {
    .subhero { min-height: 540px; padding: 100px 6%; }
    .subhero-contenido { max-width: none; }
    .subhero h1, .cabecera-simple h1 { font-size: 47px; }
    .detalle-tarjeta { min-height: auto; padding: 32px 25px; }
    .detalle-tarjeta h3 { font-size: 30px; }
    .enlace-servicio { min-height: 450px; }
    .enlace-servicio > div { padding: 26px; }
    .enlace-servicio h3 { font-size: 36px; }
    .bloque-metodo { padding: 80px 6%; }
    .faq-item summary { font-size: 22px; }
}


/* =========================
   V4 — PORTFOLIO PREMIUM
   ========================= */
html { scroll-behavior: smooth; }
.hero-v4 { min-height: 100svh; }
.hero-v4 .hero-fondo {
    background-image: url("56d6aa24-4db8-4801-a72b-13b5991c00d7.jpg");
    background-attachment: fixed;
    transform: scale(1.035);
}
.hero-brillo {
    background: radial-gradient(circle at 75% 20%, rgba(255,255,255,.16), transparent 35%);
    inset: 0; pointer-events: none; position: absolute; z-index: 1;
}
@media (min-width: 821px) { .hero-v4 .hero-contenido { max-width: 920px; } }
.hero-v4 h1 { font-size: clamp(70px, 9.2vw, 142px); line-height: .82; }
.hero-v4 .hero-texto { max-width: 680px; }
.boton-principal { box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.hero-datos {
    display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 34px;
}
.hero-datos span {
    color: rgba(255,255,255,.73); font-size: 10px; font-weight: 700;
    letter-spacing: 1.4px; text-transform: uppercase;
}
.hero-scroll {
    align-items: center; bottom: 28px; color: white; display: flex; flex-direction: column;
    font-size: 9px; gap: 10px; left: 50%; letter-spacing: 2px; position: absolute;
    text-transform: uppercase; transform: translateX(-50%); z-index: 3;
}
.hero-scroll i { background: rgba(255,255,255,.5); height: 58px; overflow: hidden; position: relative; width: 1px; }
.hero-scroll i::after {
    animation: scrollLine 1.9s infinite; background: white; content:""; height: 24px;
    left: 0; position: absolute; top: -24px; width: 1px;
}
@keyframes scrollLine { 0% { transform: translateY(0); } 70%,100% { transform: translateY(82px); } }

.galeria-premium { background: var(--marfil); }
.galeria-mosaico {
    display: grid; gap: 12px; grid-template-columns: 1.25fr .75fr; grid-template-rows: 330px 330px;
}
.foto-galeria {
    background: #ddd; border: 0; cursor: zoom-in; display: block; overflow: hidden; padding: 0; position: relative;
}
.foto-galeria img { height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1); width: 100%; }
.foto-galeria::after {
    background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.16));
    content:""; inset:0; opacity:0; position:absolute; transition:opacity .3s;
}
.foto-galeria:hover img { transform: scale(1.055); }
.foto-galeria:hover::after { opacity:1; }
.foto-grande { grid-row: 1 / span 2; }
.foto-horizontal { display:none; }

.lightbox {
    align-items: center; background: rgba(14,12,11,.94); display: flex; inset: 0;
    justify-content: center; opacity: 0; padding: 5vw; pointer-events: none;
    position: fixed; transition: opacity .25s; z-index: 1000;
}
.lightbox.abierto { opacity:1; pointer-events:auto; }
.lightbox img { max-height: 88vh; max-width: 92vw; object-fit: contain; }
.lightbox-cerrar {
    background: transparent; border: 0; color: white; cursor:pointer; font-size: 42px;
    position:absolute; right:28px; top:18px;
}

.reserva-seccion {
    background: var(--arcilla-oscura); color: white; display: grid; gap: 9%;
    grid-template-columns: .85fr 1.15fr; padding: 120px 7%;
}
.reserva-intro h2 {
    font-family: var(--serif); font-size: clamp(54px, 6vw, 88px);
    font-weight: 400; letter-spacing: -3px; line-height: .9; margin: 16px 0 25px;
}
.reserva-intro > p:not(.sobrelinea) { color: rgba(255,255,255,.72); font-size: 17px; max-width: 520px; }
.reserva-nota {
    border-top: 1px solid rgba(255,255,255,.22); display:flex; flex-direction:column;
    gap:5px; margin-top:50px; padding-top:23px;
}
.reserva-nota strong { font-family: var(--serif); font-size:22px; font-weight:400; }
.reserva-nota span { color:rgba(255,255,255,.58); font-size:12px; }

.formulario-reserva {
    background: var(--marfil); color: var(--tinta); display: grid; gap: 22px; padding: 48px;
}
.formulario-reserva label { display:grid; gap:8px; }
.formulario-reserva label > span {
    font-size: 10px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase;
}
.formulario-reserva input,
.formulario-reserva select,
.formulario-reserva textarea {
    background: transparent; border: 0; border-bottom: 1px solid var(--linea);
    border-radius: 0; color: var(--tinta); font: inherit; outline: none; padding: 13px 2px;
    width:100%;
}
.formulario-reserva input:focus,
.formulario-reserva select:focus,
.formulario-reserva textarea:focus { border-bottom-color: var(--arcilla); }
.formulario-reserva textarea { resize: vertical; }
.formulario-doble { display:grid; gap:20px; grid-template-columns:1fr 1fr; }
.boton-formulario { background: var(--arcilla-oscura); border:0; cursor:pointer; margin-top:6px; width:100%; }
.formulario-privacidad { color:var(--texto); font-size:11px; line-height:1.5; }

@media (max-width: 900px) {
    .hero-v4 .hero-fondo { background-attachment: scroll; }
    .galeria-mosaico { grid-template-columns: 1fr 1fr; grid-template-rows: 430px 260px; }
    .foto-grande { grid-column: 1 / span 2; grid-row:auto; }
    .reserva-seccion { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
    .hero-v4 h1 { font-size: 62px; letter-spacing:-3px; }
    .hero-scroll { display:none; }
    .hero-datos { display:grid; gap:7px; }
    .galeria-mosaico { display:grid; grid-template-columns:1fr; grid-template-rows:none; }
    .foto-galeria, .foto-grande { grid-column:auto; height:330px; }
    .foto-horizontal { display:block; }
    .reserva-seccion { padding:80px 6%; }
    .formulario-reserva { padding:30px 22px; }
    .formulario-doble { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    .hero-v4 .hero-fondo { background-attachment:scroll; }
    .hero-scroll i::after { animation:none; }
}

/* Páginas legales */
.contenido-legal {
    max-width: 900px; margin: auto; line-height: 1.8;
}
.contenido-legal h2 {
    color: var(--arcilla-oscura); font-size: 22px; margin: 32px 0 16px;
    font-family: var(--serif); font-weight: 400;
}
.contenido-legal h3 {
    color: var(--arcilla); font-size: 16px; margin: 20px 0 12px;
    font-family: var(--sans); font-weight: 700;
}
.contenido-legal p { margin-bottom: 16px; }
.contenido-legal ul li { margin-bottom: 10px; }
.contenido-legal a { color: var(--arcilla); text-decoration: underline; }
.contenido-legal a:hover { color: var(--arcilla-oscura); }
