/* =========================================================
   THE LOCAL ESTATE
   CIERRE FINAL PREMIUM
========================================================= */

#tle-final-closing {

  --tle-green:
    #718e72;

  --tle-black:
    #080808;

  --tle-card-black:
    #101010;

  --tle-white:
    #ffffff;

  --tle-text:
    #171817;

  --tle-muted:
    #676c67;


  position:
    relative;

  width:
    100vw;

  max-width:
    100vw;

  margin-left:
    calc(50% - 50vw);

  margin-right:
    calc(50% - 50vw);

  overflow:
    hidden;

  background:
    var(--tle-black);

  color:
    var(--tle-white);

  font-family:
    Arial,
    Helvetica,
    sans-serif;
}


#tle-final-closing,
#tle-final-closing * {
  box-sizing:
    border-box;
}


#tle-final-closing a {
  text-decoration:
    none;
}


.tle-final-shell {
  width:
    min(1380px, 100%);

  margin:
    0 auto;

  padding-left:
    clamp(22px, 5vw, 80px);

  padding-right:
    clamp(22px, 5vw, 80px);
}


/* =========================================================
   SISTEMA TIPOGRÁFICO UNIFICADO
========================================================= */

/* KICKERS */
.tle-final-eyebrow,
.tle-final-path__number,
.tle-final-path__eyebrow,
.tle-final-map__eyebrow,
.tle-final-footer__label {

  font-size:
    10px;

  line-height:
    1.2;

  font-weight:
    700;

  letter-spacing:
    0.18em;

  text-transform:
    uppercase;
}


/* =========================================================
   01. CTA EDITORIAL
========================================================= */

.tle-final-cta {
  position:
    relative;

  min-height:
    520px;

  display:
    flex;

  align-items:
    center;

  overflow:
    hidden;

  background:
    #080808;
}


.tle-final-cta::before {
  content:
    "";

  position:
    absolute;

  top:
    0;

  left:
    clamp(22px, 5vw, 80px);

  width:
    72px;

  height:
    9px;

  background:
    var(--tle-green);
}


/* MARCA DE AGUA */
.tle-final-cta__watermark {
  position:
    absolute;

  top:
    50%;

  right:
    -150px;

  width:
    640px;

  height:
    640px;

  background-image:
    url("https://thelocalestate-97c99edc16.live-website.com/wp-content/uploads/2026/07/TLE-LOGO-scaled.png");

  background-repeat:
    no-repeat;

  background-size:
    contain;

  background-position:
    center;

  opacity:
    0.045;

  filter:
    grayscale(1)
    invert(1);

  transform:
    translateY(-50%);

  pointer-events:
    none;
}


.tle-final-cta__content {
  position:
    relative;

  z-index:
    3;

  width:
    min(760px, 100%);

  padding:
    clamp(88px, 9vw, 128px)
    0;
}


.tle-final-eyebrow {
  display:
    block;

  margin-bottom:
    14px;

  color:
    var(--tle-green);
}


.tle-final-cta h2 {
  margin:
    0
    0
    22px;

  color:
    #ffffff;

  font-size:
    clamp(
      28px,
      2.4vw,
      40px
    );

  line-height:
    1.05;

  font-weight:
    500;

  letter-spacing:
    0.01em;

  text-transform:
    uppercase;
}


.tle-final-cta h2 span {
  display:
    block;

  color:
    var(--tle-green);
}


.tle-final-cta p {
  width:
    min(620px, 100%);

  margin:
    0;

  color:
    rgba(
      255,
      255,
      255,
      0.72
    );

  font-size:
    14px;

  line-height:
    1.65;

  font-weight:
    400;
}


.tle-final-cta__actions {
  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    14px;

  margin-top:
    34px;
}


/* BOTONES */
.tle-final-button {
  min-height:
    56px;

  padding:
    15px
    26px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    14px;

  font-size:
    11px;

  line-height:
    1.2;

  font-weight:
    700;

  letter-spacing:
    0.08em;

  text-transform:
    uppercase;

  transition:
    background-color
    280ms
    ease,

    border-color
    280ms
    ease,

    color
    280ms
    ease,

    transform
    280ms
    ease;
}


.tle-final-button:hover {
  transform:
    translateY(-3px);
}


/* PRIMARIO */
.tle-final-button--primary {
  background:
    #ffffff;

  color:
    #111111;
}


.tle-final-button--primary:hover,
.tle-final-button--primary:focus-visible {
  background:
    var(--tle-green);

  color:
    #ffffff;
}


/* SECUNDARIO */
.tle-final-button--secondary {
  background:
    transparent;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      0.42
    );

  color:
    #ffffff !important;
}


.tle-final-button--secondary:hover,
.tle-final-button--secondary:focus-visible {
  background:
    var(--tle-green) !important;

  border-color:
    var(--tle-green) !important;

  color:
    #ffffff !important;
}


/* =========================================================
   02. ACCESOS COMPACTOS
========================================================= */

.tle-final-paths {
  padding:
    0
    0
    clamp(
      58px,
      7vw,
      92px
    );

  background:
    #080808;
}


.tle-final-paths__grid {
  display:
    grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  border-top:
    1px solid
    rgba(
      255,
      255,
      255,
      0.14
    );

  border-bottom:
    1px solid
    rgba(
      255,
      255,
      255,
      0.14
    );
}


.tle-final-path {
  position:
    relative;

  min-height:
    245px;

  padding:
    28px
    30px
    32px;

  color:
    #ffffff;

  background:
    #0b0b0b;

  border-right:
    1px solid
    rgba(
      255,
      255,
      255,
      0.14
    );

  transition:
    background-color
    350ms
    ease,

    color
    350ms
    ease;
}


.tle-final-path:last-child {
  border-right:
    0;
}


/* HOVER VERDE COMPLETO */
.tle-final-path:hover,
.tle-final-path:focus-visible {
  background:
    var(--tle-green);
}


.tle-final-path__number {
  display:
    block;

  margin-bottom:
    30px;

  color:
    var(--tle-green);

  transition:
    color
    300ms
    ease;
}


.tle-final-path__eyebrow {
  display:
    block;

  margin-bottom:
    9px;

  color:
    rgba(
      255,
      255,
      255,
      0.52
    );

  font-size:
    9px;

  letter-spacing:
    0.12em;

  transition:
    color
    300ms
    ease;
}


.tle-final-path h3 {
  margin:
    0
    0
    12px;

  color:
    #ffffff;

  font-size:
    clamp(
      22px,
      1.7vw,
      28px
    );

  line-height:
    1.05;

  font-weight:
    500;

  letter-spacing:
    0.01em;
}


.tle-final-path p {
  width:
    min(290px, 100%);

  margin:
    0;

  color:
    rgba(
      255,
      255,
      255,
      0.65
    );

  font-size:
    14px;

  line-height:
    1.6;

  transition:
    color
    300ms
    ease;
}


.tle-final-path__cta {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    13px;

  margin-top:
    24px;

  color:
    var(--tle-green);

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    0.1em;

  text-transform:
    uppercase;

  transition:
    color
    300ms
    ease;
}


.tle-final-path__cta span {
  font-size:
    18px;

  transition:
    transform
    300ms
    ease;
}


/* TODO BLANCO EN HOVER */
.tle-final-path:hover
.tle-final-path__number,

.tle-final-path:hover
.tle-final-path__eyebrow,

.tle-final-path:hover
.tle-final-path__cta,

.tle-final-path:focus-visible
.tle-final-path__number,

.tle-final-path:focus-visible
.tle-final-path__eyebrow,

.tle-final-path:focus-visible
.tle-final-path__cta {
  color:
    #ffffff;
}


.tle-final-path:hover p,
.tle-final-path:focus-visible p {
  color:
    rgba(
      255,
      255,
      255,
      0.88
    );
}


.tle-final-path:hover
.tle-final-path__cta span,

.tle-final-path:focus-visible
.tle-final-path__cta span {
  transform:
    translateX(7px);
}


/* =========================================================
   03. MAPA
========================================================= */

.tle-final-map {
  position:
    relative;

  width:
    100%;

  height:
    clamp(
      500px,
      52vw,
      680px
    );

  overflow:
    hidden;

  background:
    #d5d5d5;
}


.tle-final-map__iframe {
  position:
    absolute;

  inset:
    0;

  width:
    100%;

  height:
    100%;

  border:
    0;

  filter:
    grayscale(1)
    contrast(0.92)
    brightness(1.04);
}


.tle-final-map__veil {
  position:
    absolute;

  inset:
    0;

  background:
    rgba(
      255,
      255,
      255,
      0.08
    );

  pointer-events:
    none;
}


/* TARJETA */
.tle-final-map__card {
  position:
    absolute;

  top:
    50%;

  left:
    clamp(
      24px,
      6vw,
      92px
    );

  width:
    min(
      360px,
      calc(
        100%
        -
        48px
      )
    );

  padding:
    34px;

  background:
    rgba(
      11,
      11,
      11,
      0.94
    );

  color:
    #ffffff;

  transform:
    translateY(-50%);

  box-shadow:
    0
    22px
    52px
    rgba(
      0,
      0,
      0,
      0.24
    );

  backdrop-filter:
    blur(10px);
}


.tle-final-map__eyebrow {
  display:
    block;

  margin-bottom:
    12px;

  color:
    var(--tle-green);
}


.tle-final-map__card h2 {
  margin:
    0
    0
    16px;

  color:
    #ffffff;

  font-size:
    clamp(
      28px,
      2.4vw,
      40px
    );

  line-height:
    1.05;

  font-weight:
    500;

  letter-spacing:
    0.01em;

  text-transform:
    uppercase;
}


.tle-final-map__card h2 span {
  display:
    block;

  color:
    var(--tle-green);
}


.tle-final-map__card p {
  margin:
    0;

  color:
    rgba(
      255,
      255,
      255,
      0.76
    );

  font-size:
    14px;

  line-height:
    1.65;
}


.tle-final-map__schedule {
  margin-top:
    22px;

  padding-top:
    18px;

  border-top:
    1px solid
    rgba(
      255,
      255,
      255,
      0.15
    );
}


.tle-final-map__schedule span {
  display:
    block;

  margin-bottom:
    7px;

  color:
    var(--tle-green);

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    0.14em;
}


.tle-final-map__schedule strong {
  color:
    #ffffff;

  font-size:
    14px;

  line-height:
    1.55;

  font-weight:
    500;
}


.tle-final-map__card > a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    12px;

  margin-top:
    24px;

  color:
    #ffffff;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    0.1em;

  text-transform:
    uppercase;
}


.tle-final-map__card > a span {
  color:
    var(--tle-green);

  font-size:
    18px;
}


/* =========================================================
   04. FOOTER BLANCO FINAL
========================================================= */

.tle-final-footer {
  padding:
    52px
    0
    24px;

  background:
    #ffffff;

  color:
    var(--tle-text);
}


.tle-final-footer__grid {
  display:
    grid;

  grid-template-columns:
    1fr
    1fr
    1fr;

  gap:
    38px;

  align-items:
    center;
}


/* COLUMNAS */
.tle-final-footer__column {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;
}


.tle-final-footer__column--right {
  align-items:
    flex-end;

  text-align:
    right;
}


.tle-final-footer__label {
  display:
    block;

  margin-bottom:
    16px;

  color:
    var(--tle-green);
}


/* TELÉFONO */
.tle-final-footer__phone {
  color:
    #111111;

  font-size:
    clamp(
      22px,
      1.8vw,
      28px
    );

  line-height:
    1.05;

  font-weight:
    500;
}


/* EMAIL */
.tle-final-footer__email {
  margin-top:
    8px;

  color:
    #454a45;

  font-size:
    13px;
}


.tle-final-footer__column p {
  margin:
    20px
    0
    0;

  color:
    #737873;

  font-size:
    12px;

  line-height:
    1.6;
}


/* MARCA CENTRAL */
.tle-final-footer__brand {
  text-align:
    center;
}


.tle-final-footer__brand img {
  width:
    92px;

  height:
    68px;

  object-fit:
    contain;

  filter:
    grayscale(1);

  mix-blend-mode:
    multiply;
}


.tle-final-footer__brand p {
  width:
    min(280px, 100%);

  margin:
    16px
    auto
    0;

  color:
    #737873;

  font-size:
    12px;

  line-height:
    1.6;
}


/* REDES */
.tle-final-socials {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    10px;
}


.tle-final-socials a {
  width:
    38px;

  height:
    38px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  border:
    1px solid
    #d9dcd7;

  color:
    #111111;

  background:
    #ffffff;

  transition:
    background-color
    260ms
    ease,

    border-color
    260ms
    ease,

    color
    260ms
    ease,

    transform
    260ms
    ease;
}


/* HOVER VERDE */
.tle-final-socials a:hover,
.tle-final-socials a:focus-visible {
  background:
    var(--tle-green);

  border-color:
    var(--tle-green);

  color:
    #ffffff;

  transform:
    translateY(-2px);
}


.tle-final-socials svg {
  width:
    17px;

  height:
    17px;

  fill:
    currentColor;
}


.tle-final-footer__address {
  margin-top:
    18px;

  color:
    #555a55;

  font-size:
    12px;

  line-height:
    1.6;
}


/* BARRA FINAL */
.tle-final-footer__bottom {
  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    20px;

  margin-top:
    38px;

  padding-top:
    20px;

  border-top:
    1px solid
    #dedfdb;

  color:
    #767b76;

  font-size:
    9px;

  line-height:
    1.2;

  font-weight:
    700;

  letter-spacing:
    0.1em;

  text-transform:
    uppercase;
}


/* =========================================================
   ACCESIBILIDAD
========================================================= */

#tle-final-closing a:focus-visible {
  outline:
    2px solid
    var(--tle-green);

  outline-offset:
    4px;
}


/* =========================================================
   ELEMENTOR FULL WIDTH
========================================================= */

.elementor-widget-html:has(#tle-final-closing),

.elementor-widget-html:has(#tle-final-closing)
> .elementor-widget-container {

  width:
    100% !important;

  max-width:
    none !important;

  margin:
    0 !important;

  padding:
    0 !important;
}


.e-con:has(#tle-final-closing),

.e-con-inner:has(#tle-final-closing) {

  --container-max-width:
    100% !important;

  --content-width:
    100% !important;

  --gap:
    0px !important;

  width:
    100% !important;

  max-width:
    none !important;

  margin:
    0 !important;

  padding:
    0 !important;

  gap:
    0 !important;
}


/* EDITOR ELEMENTOR */
body.elementor-editor-active
#tle-final-closing {

  width:
    100% !important;

  max-width:
    100% !important;

  margin-left:
    0 !important;

  margin-right:
    0 !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 980px) {

  .tle-final-paths__grid {
    grid-template-columns:
      1fr;
  }


  .tle-final-path {
    min-height:
      auto;

    border-right:
      0;

    border-bottom:
      1px solid
      rgba(
        255,
        255,
        255,
        0.14
      );
  }


  .tle-final-path:last-child {
    border-bottom:
      0;
  }


  .tle-final-footer__grid {
    grid-template-columns:
      1fr;

    gap:
      34px;
  }


  .tle-final-footer__brand {
    text-align:
      left;
  }


  .tle-final-footer__brand p {
    margin-left:
      0;
  }


  .tle-final-footer__column--right {
    align-items:
      flex-start;

    text-align:
      left;
  }


  .tle-final-socials {
    justify-content:
      flex-start;
  }

}


/* =========================================================
   MÓVIL
========================================================= */

@media (max-width: 767px) {

  .tle-final-cta {
    min-height:
      auto;
  }


  .tle-final-cta__watermark {
    right:
      -250px;

    width:
      520px;

    height:
      520px;
  }


  .tle-final-cta__actions {
    flex-direction:
      column;

    align-items:
      stretch;
  }


  .tle-final-button {
    width:
      100%;
  }


  .tle-final-path {
    padding:
      26px
      22px
      30px;
  }


  .tle-final-path__number {
    margin-bottom:
      24px;
  }


  .tle-final-map {
    height:
      640px;
  }


  .tle-final-map__card {
    top:
      auto;

    bottom:
      18px;

    left:
      18px;

    width:
      calc(
        100%
        -
        36px
      );

    transform:
      none;

    padding:
      28px;
  }


  .tle-final-footer__bottom {
    flex-direction:
      column;

    align-items:
      flex-start;
  }

}


/* =========================================================
   MÓVIL PEQUEÑO
========================================================= */

@media (max-width: 480px) {

  .tle-final-map__card {
    padding:
      24px;
  }


  .tle-final-footer {
    padding-top:
      42px;
  }

}


/* =========================================================
   MOVIMIENTO REDUCIDO
========================================================= */

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

  .tle-final-button,
  .tle-final-path,
  .tle-final-path__cta span,
  .tle-final-socials a {

    transition:
      none !important;
  }

}/* =========================================================
   THE LOCAL ESTATE
   PARCHE FINAL FOOTER
   1. HOVERS VERDES
   2. LOGO CENTRADO
========================================================= */


/* =========================================================
   01. TRANSICIÓN SUAVE
========================================================= */

#tle-final-closing
.tle-final-footer__phone,

#tle-final-closing
.tle-final-footer__email,

#tle-final-closing
.tle-final-footer__address {
  transition:
    color 260ms ease !important;
}


/* =========================================================
   02. TELÉFONO
   ESTADO NORMAL
========================================================= */

#tle-final-closing
.tle-final-footer__phone,

#tle-final-closing
.tle-final-footer__phone:visited {
  color:
    #111111 !important;
}


/* TELÉFONO HOVER VERDE */
#tle-final-closing
.tle-final-footer__phone:hover,

#tle-final-closing
.tle-final-footer__phone:focus-visible {
  color:
    #718e72 !important;
}


/* =========================================================
   03. CORREO
   ESTADO NORMAL
========================================================= */

#tle-final-closing
.tle-final-footer__email,

#tle-final-closing
.tle-final-footer__email:visited {
  color:
    #454a45 !important;
}


/* CORREO HOVER VERDE */
#tle-final-closing
.tle-final-footer__email:hover,

#tle-final-closing
.tle-final-footer__email:focus-visible {
  color:
    #718e72 !important;
}


/* =========================================================
   04. DIRECCIÓN
   ESTADO NORMAL
========================================================= */

#tle-final-closing
.tle-final-footer__address,

#tle-final-closing
.tle-final-footer__address:visited {
  color:
    #555a55 !important;
}


/* DIRECCIÓN HOVER VERDE */
#tle-final-closing
.tle-final-footer__address:hover,

#tle-final-closing
.tle-final-footer__address:focus-visible {
  color:
    #718e72 !important;
}


/* =========================================================
   05. CENTRAR LOGOTIPO
========================================================= */

#tle-final-closing
.tle-final-footer__brand {
  display:
    flex !important;

  flex-direction:
    column !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  text-align:
    center !important;
}


/* ENLACE QUE CONTIENE EL LOGO */
#tle-final-closing
.tle-final-footer__brand > a {
  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  width:
    100% !important;

  margin:
    0 auto !important;

  padding:
    0 !important;
}


/* IMAGEN DEL LOGO */
#tle-final-closing
.tle-final-footer__brand img {
  display:
    block !important;

  width:
    92px !important;

  height:
    68px !important;

  margin:
    0 auto !important;

  object-fit:
    contain !important;

  object-position:
    center center !important;

  transform:
    none !important;
}


/* =========================================================
   06. TEXTO DE MARCA TAMBIÉN CENTRADO
========================================================= */

#tle-final-closing
.tle-final-footer__brand p {
  width:
    min(280px, 100%) !important;

  margin:
    16px auto 0 !important;

  text-align:
    center !important;
}

/* =========================================================
   GLOBAL FOOTER — PLUGIN
   v1.2.2
========================================================= */

#tle-final-closing[data-tle-global-footer="1"] {
  z-index: 2;
}

#tle-final-closing[data-tle-global-footer="1"] .tle-final-map__iframe {
  filter:
    grayscale(1)
    contrast(0.92)
    brightness(1.04);
}

#tle-final-closing[data-tle-global-footer="1"] .tle-final-socials a[aria-label="TikTok"] {
  display: none !important;
}

body.elementor-editor-active #tle-final-closing[data-tle-global-footer="1"] {
  display: none !important;
}



/* =========================================================
   v1.2.3 — MAPA: TARJETA A LA DERECHA
========================================================= */

#tle-final-closing[data-tle-global-footer="1"] .tle-final-map {
  position: relative;
}

#tle-final-closing[data-tle-global-footer="1"] .tle-final-map__card {
  left: auto !important;
  right: clamp(28px, 5vw, 72px) !important;
}

@media (max-width: 1024px) {
  #tle-final-closing[data-tle-global-footer="1"] .tle-final-map__card {
    right: 24px !important;
    left: auto !important;
  }
}

@media (max-width: 767px) {
  #tle-final-closing[data-tle-global-footer="1"] .tle-final-map__card {
    right: 16px !important;
    left: 16px !important;
  }
}



/* =========================================================
   v1.2.4 — FOOTER LIMPIO + MAPA A COLOR
========================================================= */

/* Quitar footer nativo de Astra / tema */
body.tle-has-global-header footer#colophon,
body.tle-has-global-header .site-footer,
body.tle-has-global-header .ast-footer-overlay,
body.tle-has-global-header .ast-small-footer,
body.tle-has-global-header .ast-footer-copyright,
body.tle-has-global-header .ast-builder-footer-grid-columns,
body.tle-has-global-header .site-below-footer-wrap,
body.tle-has-global-header .site-primary-footer-wrap,
body.tle-has-global-header .site-above-footer-wrap,
body.tle-has-global-header [data-section="section-footer-builder"],
body.tle-has-global-header [data-section="section-fb-copyright"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Pero NO tocar el footer premium del plugin */
body.tle-has-global-header #tle-final-closing,
body.tle-has-global-header #tle-final-closing .tle-final-footer {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: initial !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

/* Mapa en color original */
#tle-final-closing[data-tle-global-footer="1"] .tle-final-map__iframe {
  filter: none !important;
}

/* Quitar velo blanco sobre el mapa */
#tle-final-closing[data-tle-global-footer="1"] .tle-final-map__veil {
  display: none !important;
}