:root {
  --papel:#f7f4ee;
  --tinta:#191816;
  --vino:#8b0b20;
  --linea:#c9c2b9;
  --serif:'Bodoni MT',Didot,'Times New Roman',serif;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--papel); color:var(--tinta); font:16px/1.6 Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,textarea,select { font:inherit; }
img { display:block; max-width:100%; }
h1,h2,h3,p { margin:0; }

h1,h2,h3 {
  font-family:var(--serif);
  font-weight:400;
  line-height:1.02;
  letter-spacing:-.045em;
}

h1 { font-size:clamp(3.5rem,7.5vw,6.5rem); }
h2 { font-size:clamp(2.4rem,4.3vw,4rem); }
h3 { font-size:1.55rem; letter-spacing:-.025em; }

a:focus-visible,button:focus-visible {
  outline:3px solid var(--vino);
  outline-offset:6px;
}

.wrap { width:88%; max-width:1280px; margin-inline:auto; }

.header {
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.marca {
  font:clamp(1.15rem,2.2vw,1.65rem)/1.2 var(--serif);
  letter-spacing:-.04em;
  overflow-wrap:anywhere;
}

.nav { display:flex; align-items:center; gap:30px; font-size:.8rem; }
.nav a { padding-block:10px; border-bottom:1px solid transparent; }
.nav a[aria-current='page'],.nav a:hover { border-color:var(--vino); }

.hero {
  position:relative;
  isolation:isolate;
  min-height:clamp(500px,50vw,720px);
  display:flex;
  align-items:center;
  color:var(--papel);
  background:#121211;
}

.hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,0) 76%);
  pointer-events:none;
}

.hero .copy {
  position:relative;
  z-index:1;
  padding-block:90px;
  pointer-events:none;
}

.hero .copy a { pointer-events:auto; }
.hero h1 { max-width:8.8ch; }

.eyebrow {
  font-size:.68rem;
  line-height:1.6;
  letter-spacing:.28em;
  margin-bottom:20px;
}

.subtitulo {
  margin-top:22px;
  font:clamp(1.15rem,2.3vw,1.9rem)/1.4 var(--serif);
}

.acciones {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:32px;
  margin-top:34px;
}

.boton {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:12px 28px;
  background:var(--vino);
  color:#fffaf4;
  font:1.05rem/1.4 var(--serif);
  border:1px solid var(--vino);
  transition:background .2s,transform .2s;
}

.boton:hover { background:#650819; transform:translateY(-2px); }

.enlace {
  display:inline-block;
  padding-bottom:4px;
  border-bottom:1px solid currentColor;
  font-size:.8rem;
}

.seccion { padding-block:40px; }

.encabezado {
  display:flex;
  justify-content:space-between;
  align-items:end;
  flex-wrap:wrap;
  gap:24px;
  margin-bottom:28px;
}

.tarjetas {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.tarjeta { min-width:0; text-align:center; }
.tarjeta h3 { margin-top:16px; }
.tarjeta p { font-size:.8rem; color:#59544e; margin-top:5px; }

.foto {
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
  aspect-ratio:1;
  background:#e7e1d8;
}

.foto::after {
  content:attr(data-etiqueta);
  position:relative;
  padding:20px;
  color:#665f57;
  font-size:.6rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-align:center;
}

.foto img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.foto.con-imagen::after { display:none; }

.hero .foto {
  position:absolute;
  inset:0;
  aspect-ratio:auto;
  background:#191817;
}

.hero .foto::after {
  position:absolute;
  left:63%;
  right:5%;
  color:#b7ada3;
}

.taller {
  display:grid;
  grid-template-columns:1.05fr 1fr;
  align-items:stretch;
}

.taller .foto { aspect-ratio:1.55; }
.taller .copy { padding:50px clamp(28px,6vw,90px); align-self:center; }
.taller h2 { max-width:14ch; }
.taller .subtitulo { font-size:1.2rem; color:#59544e; }
.taller .enlace { margin-top:28px; }

.colecciones h1 { font-size:clamp(2.8rem,5vw,4.4rem); }
.colecciones .subtitulo { margin-bottom:32px; color:#59544e; }
.colecciones .tarjeta { text-align:left; }

.footer {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  border-top:1px solid var(--linea);
  margin-top:24px;
  padding-block:24px;
}

.footer .marca { font-size:1.05rem; }
.footer p { font-size:.7rem; color:#59544e; }

@media(max-width:760px) {
  .header { padding-block:18px; flex-wrap:wrap; gap:12px; }
  .nav { width:100%; gap:24px; }
  .hero { min-height:700px; align-items:flex-start; }
  .hero .copy { padding-block:56px 330px; }
  .hero::after { background:linear-gradient(180deg,rgba(0,0,0,.8),transparent); }
  .hero .foto::after { left:0; right:0; top:auto; bottom:100px; }
  .tarjetas { grid-template-columns:1fr; gap:32px; }
  .taller { grid-template-columns:1fr; }
  .taller .copy { padding:36px 6%; }
  .seccion { padding-block:38px; }
}

@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; }
}

/* Acceso directo al contenido mediante teclado. */
.rc-saltar {
  position:fixed;
  top:12px;
  left:16px;
  z-index:2000;
  transform:translateY(calc(-100% - 16px));
  padding:12px 16px;
  background:#8b0b20;
  color:#fffaf4;
  font:600 14px/1.4 Arial,sans-serif;
}
.rc-saltar:focus {
  transform:none;
  outline:3px solid #b99a68;
  outline-offset:3px;
}