/*
 * FINCAS LAXE
 * SISTEMA VISUAL V2
 *
 * Identidade atlántica:
 * azul + laranxa + branco.
 *
 * Sen fontes nin librarías externas.
 */

:root {

    /* Marca */

    --fl-azul: var(--fl-primary, #007AC2);
    --fl-azul-hover: #00659F;

    --fl-naranja: var(--fl-orange, #F77E21);

    --fl-tinta: var(--fl-text, #172D3C);

    --fl-gris: #61727F;

    --fl-superficie: #F1F7FB;
    --fl-superficie-suave: #F8FBFD;

    --fl-borde: #DFE9EF;

    --fl-blanco: #FFFFFF;

    /* Tipografía */

    --fl-cuerpo: system-ui, -apple-system,
        BlinkMacSystemFont, "Segoe UI", sans-serif;

    --fl-titulos: system-ui, -apple-system,
        BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* Proporcións */

    --fl-contenedor: var(--fl-width, 1180px);

    --fl-espacio-seccion: clamp(
        55px,
        calc(var(--fl-spacing, 110px) * .78),
        100px
    );

    --fl-radio: 10px;

    --fl-sombra:
        0 9px 28px rgba(18, 69, 103, .075);
}

/* ==========================================
   BASE TIPOGRÁFICA
========================================== */

body {
    font-family: var(--fl-cuerpo);
    color: var(--fl-tinta);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4 {
    font-family: var(--fl-titulos);
    color: inherit;
}

h1,
h2,
h3 {
    text-wrap: balance;
}

h1 {
    line-height: 1.12;
    letter-spacing: -.035em;
}

h2 {
    line-height: 1.2;
    letter-spacing: -.03em;
}

h3 {
    line-height: 1.3;
    letter-spacing: -.02em;
}

p {
    line-height: 1.7;
}

a {
    text-underline-offset: 3px;
}

a,
button {
    -webkit-tap-highlight-color: transparent;
}

/* ==========================================
   CONTEDORES
========================================== */

.container,
.flv-contenedor {
    width: min(
        var(--fl-contenedor),
        calc(100% - 40px)
    );
    margin-inline: auto;
}

.section {
    padding-block: var(--fl-espacio-seccion);
}

/* ==========================================
   IDENTIDADE DA CABECEIRA
========================================== */

.site-header {
    z-index: 30;
}

.header-inner {
    min-height: 84px;
    display: flex;
    align-items: center;
}

.site-header .brand {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.site-header .flx-logo {
    display: block;
    width: auto;
    height: 65px;
    max-width: 155px;
    object-fit: contain;
    filter: drop-shadow(
        0 2px 4px rgba(0,0,0,.15)
    );
}

.main-nav a {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.01em;
    transition: opacity .2s ease;
}

.main-nav a:hover {
    opacity: .75;
}

.header-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 41px;
    font-size: 13px;
    font-weight: 650;
    border-radius: 7px;
    transition:
        background .2s ease,
        color .2s ease;
}

/* ==========================================
   PORTADA
========================================== */

.hero h1 {
    font-family: var(--fl-titulos);
    font-size: clamp(45px, 5vw, 72px);
    font-weight: 750;
    line-height: 1.075;
    letter-spacing: -.045em;
    max-width: 790px;
}

.hero .eyebrow {
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .15em;
}

.hero .hero-text {
    font-size: clamp(16px, 1.35vw, 19px);
    font-weight: 400;
    line-height: 1.65;
}

.hero .hero-actions {
    gap: 12px;
}

/* ==========================================
   BOTÓNS E ACCIÓNS
========================================== */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    text-decoration: none;
    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.btn-primary,
.hero .btn-primary {
    background: var(--fl-naranja);
    border-color: var(--fl-naranja);
    color: #FFFFFF;
}

.btn-primary:hover,
.hero .btn-primary:hover {
    background: #FF923B;
    border-color: #FF923B;
    color: #FFFFFF;
}

/* FLX_HOME_BUSCADOR_V3 */

main button[type="submit"] {
    font-weight: 700;
}

main button.flh-boton {
    background: var(--fl-naranja, #F77E21);
    border-color: var(--fl-naranja, #F77E21);
    color: #FFFFFF;
    font-weight: 750;
}

main button.flh-boton:hover {
    background: #FF923B;
    border-color: #FF923B;
    color: #FFFFFF;
}

@media (hover:hover) and
       (prefers-reduced-motion:no-preference) {

    .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow:
            0 6px 16px rgba(247,126,33,.20);
    }
}

/* ==========================================
   FORMULARIOS E BUSCADORES
========================================== */

main input:not([type="checkbox"]):not([type="radio"]),
main select,
main textarea {
    font-family: var(--fl-cuerpo);
    border-radius: 7px;
}

main input,
main select,
main button {
    font-size: 14px;
}

main input:focus,
main select:focus,
main textarea:focus {
    border-color: var(--fl-azul);
}

:where(
    main input,
    main select,
    main textarea,
    main button,
    main a
):focus-visible {
    outline: 2px solid var(--fl-azul);
    outline-offset: 3px;
}

/* ==========================================
   TÍTULOS DE SECCIÓN
========================================== */

.section-kicker,
.flv-cabecera > p,
.fl-local-otras-eyebrow,
.flc-eyebrow {
    color: var(--fl-azul);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.section h2,
.flv-cabecera h2,
.flc-cabecera h1,
.fl-local-info h2,
.fl-local-otras-cabecera h2 {
    font-family: var(--fl-titulos);
    font-weight: 750;
    line-height: 1.18;
    letter-spacing: -.035em;
    color: var(--fl-tinta);
}

.flv-cabecera h2 {
    font-size: clamp(29px, 3.1vw, 42px);
}

.flv-cabecera > span,
.fl-local-otras-cabecera > p {
    color: var(--fl-gris);
}

/* ==========================================
   VÍDEOS DA PORTADA
========================================== */

.flv-seccion {
    background: var(--fl-superficie);
    padding-block: var(--fl-espacio-seccion);
}

.flv-cabecera {
    margin-bottom: 34px;
}

.flv-listado {
    gap: 24px;
}

.flv-multimedia {
    border-radius: var(--fl-radio);
    box-shadow: var(--fl-sombra);
}

.flv-informacion a {
    color: var(--fl-tinta);
    font-weight: 700;
    line-height: 1.45;
}

.flv-informacion a:hover {
    color: var(--fl-azul);
}

.flv-informacion strong {
    color: var(--fl-azul);
    font-weight: 800;
}

/* ==========================================
   TARXETAS INMOBILIARIAS
========================================== */

.flc-tarjeta {
    background: #fff;
    border: 1px solid var(--fl-borde);
    border-radius: var(--fl-radio);
    overflow: hidden;
    box-shadow: 0 3px 14px rgba(18,69,103,.035);
    transition:
        box-shadow .2s ease,
        transform .2s ease;
}

.flc-tarjeta h2,
.flc-tarjeta h3 {
    font-family: var(--fl-titulos);
    color: var(--fl-tinta);
    font-weight: 750;
    line-height: 1.3;
}

.flc-tarjeta a {
    text-decoration: none;
}

.flc-tarjeta a:hover {
    color: var(--fl-azul);
}

.flc-tarjeta-pie strong {
    color: var(--fl-azul);
    font-weight: 800;
}

@media (hover:hover) and
       (prefers-reduced-motion:no-preference) {

    .flc-tarjeta:hover {
        transform: translateY(-3px);
        box-shadow: var(--fl-sombra);
    }
}

/* ==========================================
   FICHAS INMOBILIARIAS
========================================== */

.flp-page {
    color: var(--fl-tinta);
}

.flp-precio {
    color: var(--fl-azul);
}

.flp-galeria {
    border-radius: var(--fl-radio);
    overflow: hidden;
}

.flp-extras h3 {
    font-family: var(--fl-titulos);
    font-weight: 750;
}

.flp-extra svg {
    color: var(--fl-azul);
}

/* ==========================================
   PÁXINAS SEO LOCAIS
========================================== */

.fl-local-info {
    color: var(--fl-tinta);
}

.fl-local-info p {
    color: var(--fl-gris);
}

.fl-local-cta {
    color: var(--fl-azul);
}

.fl-local-nav {
    background: var(--fl-superficie);
    border: 1px solid var(--fl-borde);
    border-radius: var(--fl-radio);
}

.fl-local-nav h2 {
    font-family: var(--fl-titulos);
    font-weight: 750;
    color: var(--fl-tinta);
}

.fl-local-nav a {
    border-color: var(--fl-borde);
    border-radius: 6px;
    color: var(--fl-azul);
}

/* ==========================================
   MÓBIL
========================================== */

@media (max-width: 700px) {

    .container,
    .flv-contenedor {
        width: calc(100% - 32px);
    }

    .header-inner {
        min-height: 70px;
    }

    .site-header .flx-logo {
        height: 52px;
        max-width: 125px;
    }

    .hero h1 {
        font-size: clamp(39px, 9.3vw, 53px);
        line-height: 1.09;
    }

    .hero .hero-text {
        font-size: 16px;
    }

    .flv-seccion {
        padding-block: 58px;
    }

    .flv-cabecera h2 {
        font-size: clamp(27px, 7vw, 36px);
    }

    .flv-listado {
        gap: 16px;
    }

    .section {
        padding-block: 65px;
    }
}

/* Respectar preferencias de movemento reducido */

@media (prefers-reduced-motion: reduce) {

    .flc-tarjeta,
    .btn {
        transition: none;
    }
}


/* FLX_BUSCADOR_AZUL_V4 */

/* Botón azul do buscador da portada */

#buscar button.flh-boton,
#buscar button[type="submit"] {
    background: #007AC2;
    border-color: #007AC2;
    color: #FFFFFF;
    border-radius: 14px;
    min-height: 48px;
    padding: 12px 20px;
    font-size: 15px;
    font-weight: 700;
    transition: background-color .2s ease;
}

#buscar button.flh-boton:hover,
#buscar button[type="submit"]:hover {
    background: #00659F;
    border-color: #00659F;
    color: #FFFFFF;
}

/* Etiquetas do panel */

#buscar label {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

/* Textos dos selectores */

#buscar select {
    font-size: 15px;
    border-radius: 9px;
    min-height: 45px;
}

/* FIN_FLX_BUSCADOR_AZUL_V4 */



/* FLX_HERO_AJUSTE_FINAL_V2 */

/* Máis aire baixo a cabeceira */

.hero.hero--custom .hero-content {
    position: relative;
    top: 56px;
}

/* Título branco con contraste */

.hero.hero--custom h1 {
    text-shadow:
        0 3px 18px rgba(0,0,0,.48),
        0 1px 3px rgba(0,0,0,.30);
}

/* Descrición máis lexible */

.hero.hero--custom .hero-text {
    font-weight: 500;
    text-shadow:
        0 2px 10px rgba(0,0,0,.65),
        0 1px 3px rgba(0,0,0,.45);
}

/* Adaptación móbil */

@media (max-width:700px) {

    .hero.hero--custom .hero-content {
        top: 60px;
    }

}

/* FIN_FLX_HERO_AJUSTE_FINAL_V2 */



/* FLX_ESPACIO_HERO_DESKTOP_V1 */

@media (min-width: 901px) {

    .hero.hero--custom {
        min-height: 680px;
    }

    .hero.hero--custom .hero-content {
        top: 32px;
    }

}

/* FIN_FLX_ESPACIO_HERO_DESKTOP_V1 */




/* FLX_HEADER_INTERIOR_AZUL_V3 */

/* Cabeceira azul en todas as páxinas interiores */

body:not(.home):not(.front-page) .site-header {
    background: #155F8C !important;
    color: #FFFFFF;
    border-bottom: 1px solid rgba(255,255,255,.12);
    box-shadow: none;
}

/* Logo directamente sobre o azul */

body:not(.home):not(.front-page) .site-header .brand {
    display: inline-flex;
    align-items: center;
    background: transparent !important;
    padding: 0 !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: #FFFFFF;
    text-decoration: none;
}

body:not(.home):not(.front-page) .site-header .flx-logo {
    filter: none;
}

/* Menú */

body:not(.home):not(.front-page) .site-header .main-nav a {
    color: #FFFFFF;
}

body:not(.home):not(.front-page) .site-header .main-nav a:hover {
    color: #FFFFFF;
    opacity: .8;
}

/* Botón Contactar */


body:not(.home):not(.front-page) .site-header .header-cta {
    background: #007AC2;
    border: 1px solid #007AC2;
    color: #FFFFFF;
    border-radius: 9px;
    padding-inline: 19px;
}



body:not(.home):not(.front-page) .site-header .header-cta:hover {
    background: #00659F;
    border-color: #00659F;
    color: #FFFFFF;
}


/* Proporcións */

body:not(.home):not(.front-page) .site-header .header-inner {
    min-height: 82px;
    padding-block: 10px;
}

@media (max-width:700px) {
    body:not(.home):not(.front-page) .site-header .header-inner {
        min-height: 72px;
        padding-block: 8px;
    }
}

/* FIN_FLX_HEADER_INTERIOR_AZUL_V3 */




/* FLX_BOTONES_COHERENTES_V1 */

/* Contactar: azul vivo e contorno branco */

body:not(.home):not(.front-page) .site-header .header-cta {
    background: #007AC2;
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
}

body:not(.home):not(.front-page) .site-header .header-cta:hover {
    background: #00659F;
    border-color: #FFFFFF;
    color: #FFFFFF;
}

/* FIN_FLX_BOTONES_COHERENTES_V1 */