/* =====================================================================
   INICIO (index.html) · Fase 1 del rediseño
   Hoja exclusiva de esta página: no afecta Portafolio, El taller,
   Piezas de autor ni Tengo un proyecto.
   Paleta v3: marfil de fondo, Thorn Crown en títulos, texto y acciones,
   Blood Bargain en la sección oscura del taller, cobalto en flechas. Sin filtros sobre las fotos.
   ===================================================================== */

.home-hero h1,.home-recent h2,.home-craft h2,.home-close h2,.home-work h3{
  font-family:var(--font-display);color:var(--thorn);margin:0;letter-spacing:-.03em;
}
.home-hero h1::after,.home-recent h2::after,.home-close h2::after{content:none}

/* ---------- Enlaces tipográficos (sin botones de plantilla) ---------- */
.home-link{display:inline-flex;align-items:baseline;gap:.5em;font-family:var(--font-body);font-weight:600;font-size:.95rem;color:var(--thorn);text-decoration:none;padding-bottom:.25em;border-bottom:1px solid currentColor;transition:color .2s,gap .25s var(--ease-out)}
.home-link span{transition:transform .25s var(--ease-out)}
.home-link:hover{color:var(--cobalto)}
.home-link:hover span{transform:translateX(3px)}
.home-link--main{color:var(--thorn)}
.home-link--main:hover{color:var(--cobalto)}
.home-link--light{color:var(--marfil)}
.home-link--light:hover{color:var(--rosa)}

/* ---------- Portada ---------- */
.home-hero{display:grid;grid-template-columns:minmax(0,66fr) minmax(0,34fr);column-gap:clamp(2rem,5vw,5.5rem);align-items:end;padding-top:clamp(1.5rem,3vw,2.5rem)}
.home-hero__media{margin:0}
.home-hero__media img{display:block;width:100%;height:auto}
.home-hero__media figcaption{margin-top:.7rem;font-size:.8rem}
.home-hero__media figcaption a{color:var(--texto-suave);text-decoration:none}
.home-hero__media figcaption a:hover{color:var(--cobalto)}
.home-hero__text{padding-bottom:clamp(2rem,4vw,3.5rem)}
.home-hero h1{font-weight:700;font-size:clamp(2.6rem,4.4vw,4.6rem);line-height:.98}
.home-hero__text p{margin:clamp(1.25rem,2vw,1.75rem) 0 clamp(1.75rem,3vw,2.5rem);max-width:30ch;font-size:clamp(1rem,1.15vw,1.1rem);line-height:1.6;color:var(--thorn)}
.home-links{display:flex;flex-wrap:wrap;gap:1.25rem 2rem}

/* ---------- Proyectos recientes ---------- */
.home-recent{padding-top:clamp(5rem,11vw,10rem)}
.home-recent__head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr) auto;column-gap:clamp(1.5rem,4vw,4rem);align-items:end;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.home-recent h2{font-weight:600;font-size:clamp(2rem,3.6vw,3.6rem);line-height:1}
.home-recent__head p{margin:0;max-width:42ch;color:var(--texto-suave);line-height:1.6}
.home-recent__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,2.4vw,2.5rem);row-gap:clamp(2.5rem,5vw,4.5rem);align-items:start}
.home-work{display:block;text-decoration:none;color:inherit}
.home-work img{display:block;width:100%;height:auto;transition:opacity .3s}
.home-work:hover img{opacity:.92}
.home-work h3{margin-top:.8rem;font-weight:500;font-size:clamp(1.15rem,1.6vw,1.5rem);transition:color .2s}
.home-work:hover h3{color:var(--cobalto)}
.home-work{min-width:0}
/* Composición: Suite Moraleja a la izquierda; Dos Amores y Vestidor Okume
   apilados a la derecha. Las tres fotos comparten bordes superior e inferior. */
.home-recent__grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:1fr 1fr;row-gap:clamp(1.5rem,2.4vw,2.25rem);align-items:stretch}
.home-work{display:flex;flex-direction:column}
.home-work__img{position:relative}
.home-work--main{grid-column:1;grid-row:1 / span 2}
.home-work--main .home-work__img{aspect-ratio:4 / 3}
.home-work--second{grid-column:2;grid-row:1}
.home-work--third{grid-column:2;grid-row:2}
.home-work--second .home-work__img,.home-work--third .home-work__img{flex:1;min-height:0}
.home-work__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.home-work--main .home-work__img img{position:static}

/* ---------- Oficio y fabricación ---------- */
.home-craft{background:var(--blood);color:var(--marfil);margin-top:clamp(5rem,11vw,10rem);padding-block:clamp(4rem,9vw,8rem)}
.home-craft figure{margin:0}
.home-craft__text{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(1rem,2.4vw,2.5rem);align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem)}
.home-craft h2{color:var(--marfil);font-weight:600;font-size:clamp(2rem,3.6vw,3.6rem);line-height:1;max-width:12ch}
.home-craft__text p{margin:0 0 1.75rem;color:rgba(255,240,227,.85);line-height:1.65;max-width:38ch}
/* Dos fotos de la misma altura: herrería (principal) y carpintería */
.home-craft__fotos{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(1rem,2.4vw,2.5rem)}
.home-craft__main img{display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover}
.home-craft__detail{position:relative}
.home-craft__detail img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:40% 50%}

/* ---------- Cierre ---------- */
.home-close{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(2rem,5vw,5rem);align-items:end;padding-block:clamp(5rem,11vw,9rem)}
.home-close h2{color:var(--thorn);font-weight:700;font-size:clamp(2.4rem,5vw,5rem);line-height:.98}
.home-close p{margin:0 0 1.75rem;max-width:36ch;line-height:1.6}
body:has(.home-close) .site-footer{margin-top:0}

/* ---------- Tableta ---------- */
@media(max-width:1000px){
  .home-hero{grid-template-columns:1fr;row-gap:2rem}
  .home-hero__text{padding-bottom:0;max-width:40rem}
  .home-recent__head{grid-template-columns:1fr;row-gap:1rem}
  .home-close{grid-template-columns:1fr;row-gap:1.5rem}
}

/* ---------- Móvil ---------- */
@media(max-width:640px){
  .home-hero h1{font-size:clamp(2.4rem,11vw,3.4rem)}
  .home-hero__media figcaption{margin-top:.5rem}
  .home-recent__grid{grid-template-columns:1fr;grid-template-rows:none;row-gap:2.25rem}
  .home-work--main,.home-work--second,.home-work--third{grid-column:1;grid-row:auto}
  .home-work .home-work__img{aspect-ratio:3 / 2;flex:none}
  .home-craft__text{grid-template-columns:1fr;row-gap:1.25rem}
  .home-craft__fotos{grid-template-columns:1fr;row-gap:1rem}
  .home-craft__detail{aspect-ratio:16 / 9}
}

@media(prefers-reduced-motion:reduce){
  .home-link span,.home-work img,.home-work h3{transition:none}
}
.home-recent__head .home-link{justify-self:start}

/* Paleta v3: flechas en cobalto sobre fondo claro, rosa sobre fondo oscuro */
.home-link span{color:var(--cobalto)}
.home-link--light span{color:var(--rosa)}
.home-hero__media figcaption a span{color:var(--cobalto)}

/* ---------- Notas a mano con flecha (proyectos recientes) ---------- */
.home-work{position:relative}
.nota{position:absolute;z-index:2;display:flex;align-items:flex-start;gap:.15rem;color:var(--blood);pointer-events:none}
.nota__txt{font-family:'Caveat',var(--font-accent),cursive;font-weight:600;font-size:clamp(1.45rem,2vw,1.95rem);line-height:.9;white-space:nowrap}
.nota__flecha{width:clamp(54px,5vw,74px);height:auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
/* Suite Moraleja: arriba a la derecha, la flecha baja hacia la foto */
.nota--main{top:clamp(-4.6rem,-5vw,-3.4rem);right:8%;transform:rotate(-4deg)}
.nota--main .nota__txt{padding-top:.1rem}
/* Dos Amores: arriba a la izquierda, flecha hacia la foto */
.nota--second{top:clamp(-4.6rem,-5vw,-3.4rem);left:18%;flex-direction:row-reverse;transform:rotate(3deg)}
/* Vestidor Okume: debajo del nombre, la flecha sube a la foto */
.nota--third{bottom:clamp(-4.2rem,-4.6vw,-3.2rem);right:6%;align-items:flex-end;flex-direction:row-reverse;transform:rotate(-3deg)}
.home-recent__head{margin-bottom:clamp(4rem,7vw,6rem)}
.home-recent{padding-bottom:clamp(3.5rem,5vw,4.5rem)}
@media(max-width:640px){
  .nota{position:static;align-self:flex-end;margin:0 .5rem .35rem 0;transform:rotate(-3deg)}
  .nota--second,.nota--third{flex-direction:row;align-items:flex-start}
  .nota .nota__flecha{width:42px}
  .nota--third .nota__flecha{transform:scaleY(-1)}
}