:root{
  --cobalto:#0F4C81; --cobalto2:#0A3A66; --verde:#2E7D5B; --oro:#E4A11B;
  --tinta:#14263D; --cal:#FAF8F4; --arena:#EFE7D6; --linea:#E3DAC7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--tinta);background:var(--cal);margin:0;line-height:1.65}
.font-display{font-family:'Bricolage Grotesque','Inter',sans-serif;font-weight:700;letter-spacing:-.015em;line-height:1.05}
a{color:inherit}
img{max-width:100%;display:block}

/* azulejo tile background (repeating) */
.azulejo{
  background-color:var(--cobalto);
  background-image:
    radial-gradient(circle at 0 0, transparent 34%, rgba(255,255,255,.10) 35% 40%, transparent 41%),
    radial-gradient(circle at 32px 32px, transparent 34%, rgba(255,255,255,.10) 35% 40%, transparent 41%),
    radial-gradient(circle at 0 32px, rgba(228,161,27,.35) 8%, transparent 9%),
    radial-gradient(circle at 32px 0, rgba(228,161,27,.35) 8%, transparent 9%),
    linear-gradient(45deg, rgba(255,255,255,.06) 25%, transparent 25% 75%, rgba(255,255,255,.06) 75%);
  background-size:32px 32px;
}
.azulejo-verde{background-color:var(--verde)}
.azulejo-oro{background-color:var(--oro)}

/* photo placeholder */
.foto-ph{position:relative;overflow:hidden;background:var(--arena);border:1px dashed #C9BFA6;display:flex;align-items:center;justify-content:center}
.foto-ph .marca{position:absolute;bottom:8px;left:8px;font-size:11px;letter-spacing:.02em;color:#8a7c5e;background:rgba(250,248,244,.85);padding:2px 8px;border-radius:999px}
.foto-ph .icono{color:#B7A882;font-size:34px}

/* tile motif corner */
.cinta{height:8px;background:
  repeating-linear-gradient(45deg,var(--cobalto) 0 10px,var(--oro) 10px 20px,var(--verde) 20px 30px)}

.conten{max-width:1180px;margin:0 auto;padding:0 20px}
.card{background:#fff;border:1px solid var(--linea);border-radius:14px;overflow:hidden;transition:border-color .15s,transform .15s}
.card:hover{border-color:var(--cobalto)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px}
.badge-azul{background:#E7EFF7;color:var(--cobalto)}
.badge-verde{background:#E6F1EB;color:var(--verde)}
.badge-oro{background:#FBEFD3;color:#9a6b06}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;border-radius:11px;padding:12px 20px;cursor:pointer;border:1px solid transparent;transition:background .15s,color .15s,border-color .15s;text-decoration:none}
.btn-primario{background:var(--cobalto);color:#fff}
.btn-primario:hover{background:var(--cobalto2)}
.btn-oro{background:var(--oro);color:#3a2a00}
.btn-oro:hover{background:#cf9013}
.btn-linea{background:#fff;border-color:var(--linea);color:var(--tinta)}
.btn-linea:hover{border-color:var(--cobalto);color:var(--cobalto)}
.enlace{color:var(--cobalto);font-weight:600;text-decoration:none}
.enlace:hover{text-decoration:underline}

.campo{width:100%;padding:11px 13px;border:1px solid var(--linea);border-radius:10px;background:#fff;font:inherit;color:inherit}
.campo:focus{outline:2px solid var(--cobalto);outline-offset:1px;border-color:var(--cobalto)}
label{font-size:14px;font-weight:600}

*:focus-visible{outline:2px solid var(--cobalto);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.menu-oculto{display:none}
@media(min-width:1024px){.solo-movil{display:none!important}.solo-desktop{display:flex!important}}
@media(max-width:1023px){.solo-desktop{display:none!important}}