/* ===== FUENTES ===== */
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&display=swap');


*{ box-sizing:border-box; }


body{
  margin:0;
  font-family:'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: #ffffff;
  color:#000000;
  line-height:1.65;
}

h1, h2, h3{
  font-family:'Libre Baskerville', serif;
  font-style: normal;
  margin:0;
}

p{ margin:0 0 1rem; }

a{
  color:#000000;
  text-decoration: underline;
  text-underline-offset:3px;
}
a:hover{ text-decoration:none; }

.muted{ color:#666666; }

/* ===== CABECERA ===== */

header{
  background:#000;
  color:#fff;
  padding:3rem 1rem 2.5rem;
  text-align:center;
}

header a {
    color: white;
    text-decoration: none;
}

.logo-header{
  width:96px;
  height:96px;
  object-fit:contain;
  display:block;
  margin:0 auto 1rem;
}

.subtitle{
  margin-top:.75rem;
  font-size:1.05rem;
  opacity:.95;
  
}



/* ===== SECCIONES ===== */

main section{
  padding:3rem 1rem;
}

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

.section-title{
  display:inline-block;
  font-size:1.9rem;
  font-weight:700;
  border-bottom:2px solid #000;
  padding-bottom:.25rem;
  margin-bottom:1.25rem;
}



/* ===== LISTAS ===== */

ul{ padding-left:1.1rem; margin:0; }
li{ margin-bottom:.65rem; }

/* ===== TRES PATAS ===== */

.tres-patas h3{ font-size:1.45rem; margin-bottom:.6rem; }
.tres-patas p{ font-size:.95rem; margin:0; }

/* ===== Tarjetas home ===== */
.card-link{
  text-decoration: none;
  color: inherit;
  border: 1px solid #eee;
  border-radius: 1rem;
  transition: 
    transform .25s ease,
    box-shadow .25s ease;
}

.card-link:hover{
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

.card-link:active{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
}

.card-body p{
  margin-bottom: 0;
}


/* ===== LOGOS ===== */

.client-logo{
  max-height:56px;
  width:auto;
  opacity:.85;
  transition: opacity .25s ease;
  display:inline-block;
}
.client-logo:hover{ opacity:1; }

.han-contado{
  padding-top:2rem;
  border-top:1px solid #f0f0f0;
  margin-top:2rem;
}
.han-contado .col-6,
.han-contado .col-md-3{
  padding-top:1.25rem;
  padding-bottom:1.25rem;
}

/* ===== FOOTER ===== */

footer{
  margin-top:2rem;
  padding:2rem 1rem;
  text-align:center;
  color:#666666;
  font-size:.9rem;
  border-top:1px solid #eee;
}

/* ===== ACCESIBILIDAD ===== */
:focus-visible{
  outline:2px solid #000;
  outline-offset:3px;
}

/* ===== TÍTULO DE PÁGINA (interiores) ===== */
/* Importante: lo ponemos DESPUÉS para que gane a main section */
/* TÍTULO INTERIOR: aplica aunque no esté dentro de main */


.page-h2{
  font-size: 2rem;
  margin: .35rem 0 .35rem;
}

.page-sub{
  margin: 0;
  color: #666666;
  max-width: 72ch;
}

.breadcrumb-mini{
  font-size: .9rem;
  color: #666666;
}

.breadcrumb-mini a{
  color: #666666;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.breadcrumb-mini a:hover{ text-decoration:none; }

#backToTop{
  position: fixed;
  right: 24px;
  bottom: 24px;

  width: 42px;
  height: 42px;
  border-radius: 50%;

  background: #000;
  color: #fff;
  border: none;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
  line-height: 1;

  cursor: pointer;

  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease;

  z-index: 9999;
}

#backToTop.visible{
  opacity: 0.75;
  pointer-events: auto;
  transform: translateY(0);
}

#backToTop:hover{
  opacity: 1;
}

