/* Portada de ALTHEA Dental Office. Solo se carga en la home. */

.home{
  --oro:#b3934f;
  --oro-claro:#d8c393;
  --tinta:#1c1c1a;
  --crema:#f6f4f0;
  --hueso:#ecebe6;
  --verde:#4a5a41;
  --display:"Cormorant Garamond",Georgia,serif;
}

/* La portada arranca pegada a la cabecera */
.home .sitio__contenido{padding-top:0}
.home .wrap{width:100%;max-width:var(--ancho-contenido);margin:0 auto;padding:0 24px}

.home .ph{background:linear-gradient(135deg,#d9d4cb,#b9b2a6);position:relative;width:100%;height:100%;min-height:120px}
.home .ph::after{content:attr(data-tag);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#fff9}
.home .foto{width:100%;height:100%;object-fit:cover;display:block}

/* Botones */
.home .btn{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;border:1px solid var(--oro);color:var(--oro);text-decoration:none;transition:.25s;border-radius:0}
.home .btn:hover{background:var(--oro);color:#fff}
.home .btn--solido{background:var(--verde);border-color:var(--verde);color:#fff}
.home .btn--solido:hover{background:#3b4a34;border-color:#3b4a34;color:#fff}
.home .btn--claro{border-color:#ffffff88;color:#fff}
.home .btn--claro:hover{background:#fff;color:var(--tinta)}
.home .acciones{display:flex;flex-wrap:wrap;gap:14px}
.home .acciones--centro{justify-content:center;margin-top:26px}

/* Hero */
.home .hero{position:relative;min-height:640px;display:flex;align-items:center;color:#fff;overflow:hidden}
.home .hero__fondo{position:absolute;inset:0}
.home .hero__fondo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,#1c1c1ae6 0%,#1c1c1a66 55%,#1c1c1a11 100%)}
.home .hero__texto{position:relative;z-index:2;padding-top:60px;padding-bottom:60px}
.home .hero h1{font-family:var(--display);font-size:clamp(34px,5vw,58px);font-weight:300;letter-spacing:.03em;
  text-transform:uppercase;line-height:1.14;max-width:15ch;color:#fff;margin:0}
.home .hero p{margin:22px 0 30px;max-width:44ch;font-size:14px;color:#ffffffcc}
.home .hero__ubicacion{position:absolute;right:28px;bottom:32px;z-index:2;text-align:right;font-size:12px;color:#ffffffcc;margin:0}

/* Bloques */
.home .bloque{padding:74px 0}
.home .bloque--crema{background:var(--crema)}
.home .bloque--hueso{background:var(--hueso)}
.home .bloque__titulo{font-family:var(--display);font-size:clamp(22px,2.6vw,30px);font-weight:400;letter-spacing:.1em;
  text-transform:uppercase;text-align:center;color:var(--tinta);margin:0}
.home .bloque__titulo--izq{text-align:left;line-height:1.25}
.home .sep{display:block;width:56px;height:1px;background:var(--oro);margin:14px auto 40px}
.home .sep--izq{margin-left:0}

/* Razones */
.home .razones{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;text-align:center}
.home .razon__marca{display:block;width:44px;height:44px;margin:0 auto 14px;border:1px solid var(--oro);border-radius:6px}
.home .razon span{font-size:13px;line-height:1.45;display:block}

/* Servicios */
.home .servicios{display:grid;grid-template-columns:repeat(8,1fr);gap:14px}
.home .servicio{background:#fff}
.home .servicio__foto,.home .servicio .ph{aspect-ratio:1/1.15}
.home .servicio__nombre{font-family:inherit;font-size:12px;font-weight:400;text-align:center;padding:14px 8px;margin:0;
  line-height:1.35;color:var(--texto)}

/* Especialistas */
.home .especialistas{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.home .perfil{display:grid;grid-template-columns:200px 1fr;gap:26px;background:#fff;padding:26px}
.home .perfil__foto,.home .perfil .ph{aspect-ratio:3/4}
.home .perfil h3{font-family:var(--display);font-size:24px;font-weight:400;text-transform:uppercase;letter-spacing:.05em;
  line-height:1.2;margin:0;color:var(--tinta)}
.home .perfil__rol{color:var(--oro);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin:8px 0 14px}
.home .perfil p{font-size:13px;margin:0}

/* Tecnología */
.home .tecnologia{display:grid;grid-template-columns:270px 1fr;gap:40px;align-items:start}
.home .tecnologia p{font-size:13px}
.home .equipos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.home .equipo__foto,.home .equipo .ph{aspect-ratio:4/3}
.home .equipo span{display:block;text-align:center;font-size:13px;margin-top:12px}

/* Casos */
.home .casos{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.home .caso{margin:0;display:grid;gap:4px}
.home .caso__foto,.home .caso .ph{aspect-ratio:16/9}

/* Agenda */
.home .agenda{display:grid;grid-template-columns:1fr 1.3fr 1fr;background:var(--hueso)}
.home .agenda__lado{min-height:250px}
.home .agenda__centro{padding:56px 34px;text-align:center}
.home .agenda__centro p{font-size:14px;margin:0}
.home .agenda__datos{padding:44px 34px;background:#fff;font-size:13px;display:flex;flex-direction:column;
  justify-content:center;gap:18px}
.home .agenda__edificio,.home .agenda__datos .ph{min-height:130px;max-height:170px;object-fit:cover}
.home .agenda__datos .btn{align-self:flex-start}

@media (max-width:980px){
  .home .razones{grid-template-columns:repeat(3,1fr)}
  .home .servicios{grid-template-columns:repeat(4,1fr)}
  .home .especialistas,.home .tecnologia,.home .agenda{grid-template-columns:1fr}
  .home .equipos,.home .casos{grid-template-columns:repeat(2,1fr)}
  .home .bloque__titulo--izq{text-align:center}
  .home .sep--izq{margin-left:auto}
}
@media (max-width:560px){
  .home .razones,.home .servicios{grid-template-columns:repeat(2,1fr)}
  .home .perfil{grid-template-columns:1fr}
  .home .hero{min-height:520px}
  .home .hero__ubicacion{position:static;text-align:left;padding:0 24px 28px}
}