/*==================================================
  LEGAL PAGES
==================================================*/

.legal-page{
  background:
    radial-gradient(circle at top,#143327 0%,#081611 46%,#050908 100%);
  color:#eef4f1;
}


/*==================================================
  HEADER
==================================================*/

.legal-header{
  position:sticky;
  top:0;
  z-index:100;

  backdrop-filter:blur(18px);

  background:
    rgba(5,12,9,.82);

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

.legal-header__inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:84px;
}

.legal-header .brand img{
  width:170px;
  height:auto;
}


/*==================================================
  MAIN
==================================================*/

.legal-main{
  padding:5rem 0 7rem;
}


/*==================================================
  HERO
==================================================*/

.legal-hero{
  max-width:860px;
  margin:0 auto 3.5rem;
  text-align:center;
}

.legal-hero h1{
  margin:.8rem 0 1.2rem;

  font-size:clamp(2.8rem,5vw,4.4rem);

  line-height:1.05;

  letter-spacing:-.03em;
}

.legal-hero p:last-child{
  margin:0;

  font-size:1.08rem;

  line-height:1.85;

  color:rgba(255,255,255,.75);
}
/*==================================================
  DOCUMENTO LEGAL
==================================================*/

.legal-document{
  max-width:920px;

  margin:0 auto;

  padding:3.5rem;

  border-radius:30px;

  border:1px solid rgba(255,255,255,.08);

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.05),
      rgba(255,255,255,.018)
    );

  backdrop-filter:blur(12px);

  box-shadow:
    0 30px 80px rgba(0,0,0,.22);
}

.legal-meta{
  margin:0 0 2.5rem;

  font-size:.92rem;

  letter-spacing:.08em;

  text-transform:uppercase;

  color:rgba(255,255,255,.58);
}


/*==================================================
  TIPOGRAFÍA
==================================================*/

.legal-document h2{
  margin:2.6rem 0 1rem;

  font-size:1.65rem;

  line-height:1.2;

  color:#ffffff;
}

.legal-document h2:first-of-type{
  margin-top:0;
}

.legal-document p,
.legal-document li{
  font-size:1.05rem;

  line-height:1.95;

  color:rgba(255,255,255,.76);
}

.legal-document strong{
  color:#ffffff;
}

.legal-document ul{
  margin:1rem 0 1.6rem 1.5rem;

  padding:0;
}

.legal-document li{
  margin-bottom:.7rem;
}
/*==================================================
  ENLACES
==================================================*/

.legal-document a{
  color:var(--color-accent);

  text-decoration:none;

  transition:
    color .25s ease,
    opacity .25s ease;
}

.legal-document a:hover{
  opacity:.85;
}

.legal-document a:focus-visible{
  outline:3px solid var(--color-accent);
  outline-offset:4px;
  border-radius:4px;
}


/*==================================================
  BOTONES
==================================================*/

.legal-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:1rem;

  margin-top:3.5rem;
  padding-top:2.5rem;

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

.legal-actions .button{
  min-width:220px;
}


/*==================================================
  SEPARADORES
==================================================*/

.legal-document h2{
  position:relative;
}

.legal-document h2::after{
  content:"";

  display:block;

  width:72px;
  height:3px;

  margin-top:.7rem;

  border-radius:999px;

  background:var(--color-accent);

  opacity:.45;
}


/*==================================================
  RESALTADOS
==================================================*/

.legal-document strong{
  font-weight:700;
}

.legal-document ::selection{
  background:rgba(210,169,73,.30);
  color:#ffffff;
}
/*==================================================
  TABLET
==================================================*/

@media (max-width:900px){

  .legal-header__inner{
    min-height:76px;
  }

  .legal-header .brand img{
    width:150px;
  }

  .legal-main{
    padding:4rem 0 6rem;
  }

  .legal-hero{
    margin-bottom:3rem;
  }

  .legal-document{
    padding:2.8rem;
    border-radius:26px;
  }

  .legal-document h2{
    font-size:1.5rem;
  }

  .legal-document p,
  .legal-document li{
    font-size:1rem;
  }

}
/*==================================================
  MOBILE
==================================================*/

@media (max-width:768px){

  .legal-header__inner{
    flex-direction:column;
    justify-content:center;
    gap:1rem;

    padding:1rem 0;
  }

  .legal-header .brand img{
    width:140px;
  }

  .legal-main{
    padding:3rem 0 5rem;
  }

  .legal-hero{
    margin-bottom:2.5rem;
  }

  .legal-hero h1{
    font-size:clamp(2rem,9vw,3rem);
  }

  .legal-hero p:last-child{
    font-size:1rem;
    line-height:1.75;
  }

  .legal-document{
    padding:2rem 1.5rem;
    border-radius:22px;
  }

  .legal-document h2{
    font-size:1.35rem;
    margin:2rem 0 .9rem;
  }

  .legal-document p,
  .legal-document li{
    font-size:.98rem;
    line-height:1.8;
  }

  .legal-document ul{
    margin-left:1.2rem;
  }

  .legal-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .legal-actions .button{
    width:100%;
    min-width:0;
  }

}


/*==================================================
  MOBILE PEQUEÑO
==================================================*/

@media (max-width:480px){

  .legal-main{
    padding:2.5rem 0 4rem;
  }

  .legal-document{
    padding:1.6rem 1.2rem;
    border-radius:18px;
  }

  .legal-document h2{
    font-size:1.25rem;
  }

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

.legal-page a:focus-visible,
.legal-page button:focus-visible{
  outline:3px solid var(--color-accent);
  outline-offset:4px;
}

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

  .legal-page *,
  .legal-page *::before,
  .legal-page *::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }

}


/*==================================================
  DETALLES VISUALES
==================================================*/

.legal-document{
  position:relative;
  overflow:hidden;
}

.legal-document::before{
  content:"";

  position:absolute;
  inset:0;

  pointer-events:none;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.035),
      transparent 42%
    );
}

.legal-document > *{
  position:relative;
  z-index:1;
}

.legal-document h2{
  color:#ffffff;
}

.legal-document h2:hover{
  color:var(--color-accent);
}


/*==================================================
  FOOTER (FUTURO)
==================================================*/

.legal-page .site-footer{
  border-top:1px solid rgba(255,255,255,.06);
}


/*==================================================
  AJUSTES FINALES
==================================================*/

html{
  scroll-behavior:smooth;
}

.legal-page{
  min-height:100vh;
}

.legal-document{
  text-wrap:pretty;
}

.legal-document p{
  text-wrap:pretty;
}