:root{--navy:#10213e;--blue:#2563eb;--ink:#17253e;--muted:#617087;--line:#dce5f0;--pale:#f4f7fc}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);line-height:1.6}
a{color:inherit}
.container{width:min(1160px,calc(100% - 40px));margin:auto}
.header{background:#fff;position:sticky;top:0;z-index:10;border-bottom:1px solid #edf0f5}
.header-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:78px}
.brand{text-decoration:none;display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;letter-spacing:-.6px}
.brand strong{color:var(--blue)}
.brand-icon{display:grid;place-items:center;width:38px;height:38px;background:var(--blue);color:#fff;border-radius:10px;font-size:29px}
nav{display:flex;align-items:center;gap:25px}
nav a{text-decoration:none;font-size:14px;font-weight:600}
.nav-cta{background:var(--blue);color:#fff;padding:11px 18px;border-radius:9px}
.hero{background:linear-gradient(125deg,#10213e,#173a70);color:white;padding:75px 0 90px}
.hero-grid{display:grid;grid-template-columns:1fr 480px;gap:65px;align-items:start}
.hero-copy{padding-top:60px}
.eyebrow,.form-kicker,.section-kicker{font-size:12px;letter-spacing:1.5px;font-weight:800;color:#93c5fd}
.hero h1{font-size:clamp(38px,4.4vw,64px);line-height:1.12;letter-spacing:-2px;margin:20px 0}
.hero h1 span{color:#9dc6ff}
.hero-copy>p{font-size:19px;color:#d8e5f6;max-width:580px}
.button{display:inline-block;text-decoration:none;border-radius:10px;padding:14px 23px;font-weight:750;margin-top:18px}
.button-white{background:#fff;color:var(--navy)}
.button-blue{background:var(--blue);color:#fff}
.hero-note{font-size:13px!important;margin-top:17px;color:#bcd0ea!important}
.form-card{background:white;color:var(--ink);padding:30px;border-radius:17px;box-shadow:0 20px 55px #07152b35}
.form-kicker,.section-kicker{color:var(--blue)}
.form-card h2{font-size:25px;line-height:1.25;margin:9px 0}
.form-card>p{font-size:14px;color:var(--muted);margin:0 0 22px}
.field{margin-bottom:13px}
.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;min-width:0;padding:12px 13px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--ink);font:inherit;font-size:14px}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid #93c5fd;outline-offset:1px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.checks{display:grid;gap:10px;margin:17px 0}
.checks label{font-size:12px;line-height:1.5;display:flex;align-items:start;gap:9px}
.checks input{margin-top:3px;accent-color:var(--blue)}
.checks a{color:var(--blue)}
.honeypot{position:absolute;left:-9999px}
form button{border:0;border-radius:9px;background:#94a3b8;color:#fff;font:inherit;font-weight:750;width:100%;padding:14px;cursor:not-allowed}
.form-note{font-size:12px;color:var(--muted);text-align:center;margin:11px 0 0}
.section{padding:85px 0}
.section h2{font-size:clamp(29px,3vw,40px);line-height:1.2;letter-spacing:-1px;max-width:720px;margin:12px 0 30px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:1px solid var(--line);border-radius:14px;padding:27px;background:#fff}
.step{font-size:29px;font-weight:850;color:var(--blue)}
.card h3{font-size:20px;margin:13px 0 8px}
.card p,.section-intro{color:var(--muted)}
.section-muted{background:var(--pale)}
.types{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:27px 0 15px}
.types span{background:#fff;border:1px solid var(--line);padding:16px;border-radius:10px;font-weight:650;font-size:14px}
.final-cta{text-align:center}
.final-cta h2{margin:0 auto 15px}
.final-cta p{color:var(--muted)}
.footer{background:var(--navy);color:#d8e5f6;padding:28px 0;font-size:13px}
.footer-inner{display:flex;justify-content:space-between;gap:18px}
.footer a{margin-left:20px;text-decoration:none}
#solicitud{scroll-margin-top:100px}
@media(max-width:900px){
.hero-grid{grid-template-columns:1fr;gap:32px}
.hero-copy{padding-top:0}
.hero{padding:45px 0 55px}
.cards{grid-template-columns:1fr}
.types{grid-template-columns:repeat(2,1fr)}
nav a:not(.nav-cta){display:none}
}
@media(max-width:560px){
.container{width:min(100% - 28px,1160px)}
.header-inner{min-height:68px}
.brand{font-size:16px}
.brand-icon{width:33px;height:33px}
nav{gap:0}
.nav-cta{padding:9px 11px;font-size:12px}
.hero h1{letter-spacing:-1.3px}
.hero-copy>p{font-size:16px}
.form-card{padding:21px}
.field-grid{grid-template-columns:1fr;gap:0}
.types{grid-template-columns:1fr 1fr}
.types span{font-size:12px;padding:12px}
.section{padding:60px 0}
.footer-inner{flex-direction:column}
.footer a{margin:0 18px 0 0}
}

/* Logotipo corporativo */
.brand-logo{
    display:block;
    width:42px;
    height:42px;
    object-fit:contain;
}
@media(max-width:560px){
    .brand-logo{width:36px;height:36px}
}

/* vendomicasaya-legal-pages */
.legal-content{max-width:850px}
.legal-content h1{font-size:clamp(32px,4vw,46px);line-height:1.2;letter-spacing:-1px;margin:0 0 12px}
.legal-content h2{font-size:22px;line-height:1.3;letter-spacing:0;margin:32px 0 12px}
.legal-content p{color:#475569;margin:12px 0}
.legal-content a{color:#2563eb}
.legal-date{font-size:13px;color:#64748b!important}
.legal-notice{background:#f4f7fc;border-left:4px solid #2563eb;padding:18px 20px;border-radius:8px;margin-top:32px;font-size:14px}



/* VENDOMICASAYA DESIGN V2 */

/* Cabecera */
.header{
  box-shadow:0 2px 12px rgba(16,33,62,.035);
}
.header-inner{
  min-height:84px;
}
.brand{
  letter-spacing:-.45px;
}
.nav-cta{
  border-radius:8px;
  transition:background .2s ease,transform .2s ease;
}
.nav-cta:hover{
  background:#1d4ed8;
  transform:translateY(-1px);
}

/* Portada principal */
.hero{
  background:
    radial-gradient(circle at 12% 20%,rgba(59,130,246,.18),transparent 38%),
    linear-gradient(125deg,#10213e,#173a70);
  padding:84px 0 95px;
}
.hero-grid{
  gap:55px;
}
.hero-copy{
  padding-top:48px;
}
.hero h1{
  font-size:clamp(39px,4.7vw,67px);
  line-height:1.09;
  letter-spacing:-2.2px;
  font-weight:850;
}
.hero-copy>p{
  font-size:19px;
  line-height:1.75;
}
.hero-note{
  line-height:1.7;
}

/* Botones */
.button{
  border-radius:8px;
  font-weight:750;
  transition:background .2s ease,transform .2s ease;
}
.button:hover{
  transform:translateY(-1px);
}
.button-blue:hover{
  background:#1d4ed8;
}

/* Formulario */
.form-card{
  border-radius:15px;
  padding:34px;
  box-shadow:0 18px 45px rgba(7,21,43,.16);
}
.form-card h2{
  font-size:27px;
  letter-spacing:-.5px;
}
.field label{
  font-size:14px;
  margin-bottom:7px;
}
.field input,
.field select,
.field textarea{
  min-height:47px;
  font-size:16px;
  border-radius:8px;
  padding:12px 14px;
}
.field textarea{
  min-height:100px;
}
.field input:focus,
.field select:focus,
.field textarea:focus{
  border-color:#2563eb;
  outline:2px solid rgba(37,99,235,.15);
}
.checks label{
  font-size:13px;
}
form button{
  min-height:50px;
  font-size:15px;
}

/* Secciones */
.section{
  padding:90px 0;
}
.section h2{
  letter-spacing:-1.2px;
}
.card{
  border-radius:13px;
  padding:29px;
  transition:border-color .2s ease;
}
.card:hover{
  border-color:#b6c9e7;
}
.card h3{
  line-height:1.35;
}
.types span{
  border-radius:9px;
}

/* Accesibilidad */
a:focus-visible,
button:focus-visible{
  outline:3px solid #60a5fa;
  outline-offset:3px;
}

/* Tablet */
@media(max-width:900px){
  .hero{
    padding:55px 0 65px;
  }
  .hero-copy{
    padding-top:0;
  }
  .hero-grid{
    gap:35px;
  }
  .section{
    padding:70px 0;
  }
}

/* Móvil */
@media(max-width:560px){
  .header-inner{
    min-height:68px;
    gap:10px;
  }
  .brand{
    font-size:15px;
    gap:7px;
  }
  .brand-logo{
    width:35px;
    height:35px;
  }
  .nav-cta{
    padding:10px 12px;
    font-size:12px;
    white-space:nowrap;
  }
  .hero{
    padding:42px 0 55px;
  }
  .hero h1{
    font-size:clamp(35px,9vw,44px);
    line-height:1.12;
    letter-spacing:-1.4px;
    margin:14px 0;
  }
  .hero-copy>p{
    font-size:16px;
    line-height:1.7;
  }
  .form-card{
    padding:22px 19px;
    border-radius:13px;
  }
  .form-card h2{
    font-size:24px;
  }
  .field input,
  .field select,
  .field textarea{
    font-size:16px;
    min-height:49px;
  }
  .section{
    padding:62px 0;
  }
  .section h2{
    font-size:30px;
    letter-spacing:-.8px;
  }
  .card{
    padding:24px;
  }
  .button{
    padding:14px 19px;
  }
}

/* Respeto a usuarios que prefieren menos movimiento */
@media(prefers-reduced-motion:reduce){
  .button,
  .nav-cta,
  .card{
    transition:none;
  }
  .button:hover,
  .nav-cta:hover{
    transform:none;
  }
}



/* VENDOMICASAYA FORM SIMPLE V3 */

.form-card{
  padding:27px;
}

.form-card h2{
  font-size:25px;
  margin:5px 0 8px;
}

.form-card>p{
  margin-bottom:17px;
}

.field{
  margin-bottom:10px;
}

.field label{
  font-size:13px;
  margin-bottom:5px;
}

.field input,
.field select,
.field textarea{
  padding:10px 12px;
  min-height:45px;
}

.field textarea{
  min-height:75px;
}

.field-grid{
  gap:10px;
}

.checks{
  margin:13px 0;
  gap:8px;
}

.checks label{
  line-height:1.45;
}

.form-note{
  margin-top:13px;
  font-size:13px;
  line-height:1.6;
  color:#475569;
  background:#f0f5ff;
  border:1px solid #dbeafe;
  padding:13px 15px;
  border-radius:9px;
  text-align:left;
}

@media(max-width:560px){
  .form-card{
    padding:20px 17px;
  }

  .form-card h2{
    font-size:23px;
  }

  .field{
    margin-bottom:9px;
  }

  .field input,
  .field select,
  .field textarea{
    min-height:46px;
  }

  .field textarea{
    min-height:72px;
  }

  .checks{
    gap:9px;
  }
}



/* VENDOMICASAYA FORM SECTIONS V4 */

.form-section-heading{
  display:flex;
  align-items:center;
  gap:11px;
  margin:23px 0 15px;
  padding-top:17px;
  border-top:1px solid #e6edf5;
}

.form-section-heading:first-child{
  margin-top:5px;
  padding-top:0;
  border-top:0;
}

.form-section-number{
  width:30px;
  height:30px;
  flex:none;
  display:grid;
  place-items:center;
  background:#eaf1ff;
  color:#2563eb;
  border-radius:8px;
  font-size:14px;
  font-weight:800;
}

.form-section-heading strong{
  display:block;
  font-size:15px;
  color:#17253e;
  line-height:1.3;
}

.form-section-heading small{
  display:block;
  font-size:12px;
  color:#64748b;
  margin-top:2px;
  line-height:1.4;
}

#realestate-form .field label{
  font-weight:650;
}

#realestate-form .field input,
#realestate-form .field select,
#realestate-form .field textarea{
  background:#fff;
  border:1px solid #d9e3ef;
}

#realestate-form .field input::placeholder,
#realestate-form .field textarea::placeholder{
  color:#94a3b8;
}

@media(max-width:560px){
  .form-section-heading{
    margin:20px 0 13px;
    padding-top:16px;
  }

  .form-section-heading strong{
    font-size:15px;
  }

  .form-section-heading small{
    font-size:12px;
  }
}


/* VENDOMICASAYA: ESTADOS DEL BOTON DE ENVIO */

#realestate-form button[type="submit"]:not(:disabled) {
    background: var(--blue, #2563eb);
    color: #ffffff;
    cursor: pointer;
    opacity: 1;
    transition: background-color .2s ease;
}

#realestate-form button[type="submit"]:not(:disabled):hover {
    background: #1d4ed8;
}

#realestate-form button[type="submit"]:disabled {
    background: #94a3b8;
    color: #ffffff;
    cursor: not-allowed;
    opacity: .75;
}

#realestate-form button[type="submit"]:focus-visible {
    outline: 3px solid #60a5fa;
    outline-offset: 3px;
}


/* VENDOMICASAYA TARJETAS FOTOGRAFICAS 20261020 */

#como-funciona .cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

#como-funciona .cards .card {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    min-height: 350px;
    padding: 30px;
    border: 0;
    border-radius: 14px;
    background-color: #17324c;
    background-size: cover;
    background-position: center;
    box-shadow: none;
}

#como-funciona .cards .card:nth-child(1) {
    background-image:
        linear-gradient(180deg, rgba(8,22,38,.10), rgba(8,22,38,.94)),
        url("https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?auto=format&fit=crop&w=900&q=80");
}

#como-funciona .cards .card:nth-child(2) {
    background-image:
        linear-gradient(180deg, rgba(8,22,38,.10), rgba(8,22,38,.94)),
        url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=900&q=80");
}

#como-funciona .cards .card:nth-child(3) {
    background-image:
        linear-gradient(180deg, rgba(8,22,38,.10), rgba(8,22,38,.94)),
        url("https://images.unsplash.com/photo-1560518883-ce09059eeffa?auto=format&fit=crop&w=900&q=80");
}

#como-funciona .cards .step {
    display: block;
    color: #c6e2ff;
    font-size: 47px;
    font-weight: 850;
    line-height: 1;
    letter-spacing: -2px;
    margin-bottom: 22px;
}

#como-funciona .cards h3 {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: 23px;
    line-height: 1.2;
}

#como-funciona .cards p {
    margin: 0;
    color: #e8eef6;
    font-size: 15px;
    line-height: 1.6;
}

@media (max-width: 800px) {
    #como-funciona .cards {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    #como-funciona .cards .card {
        min-height: 290px;
        padding: 26px;
        border-radius: 12px;
    }

    #como-funciona .cards .step {
        font-size: 43px;
        margin-bottom: 18px;
    }

    #como-funciona .cards h3 {
        font-size: 22px;
    }
}


/* VENDOMICASAYA CHECKBOXES GRANDES 20261020 */

/* Casillas de aceptación del formulario */
#presupuesto input[type="checkbox"],
#formulario input[type="checkbox"],
form input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;
    margin: 0 10px 0 0 !important;
    padding: 0 !important;
    border: 2px solid #64748b;
    border-radius: 5px;
    accent-color: #2563eb;
    cursor: pointer;
    vertical-align: middle;
}

/* Mejor alineación de texto y casilla */
form label:has(input[type="checkbox"]) {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.5;
    cursor: pointer;
}

/* Versión móvil */
@media (max-width: 800px) {
    form input[type="checkbox"] {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        flex-basis: 24px !important;
    }
}
