/* ZENKUA — hoja de estilos única */
:root {
  --fondo: #FBFAF7;
  --tinta: #17211F;
  --terracota: #C15A38;
  --terracota-osc: #8f4128;
  --verde: #244A42;
  --dorado: #C9A24B;
  --gris: #6E7A74;
  --texto: #4A544F;
  --texto-2: #5C6661;
  --panel: #EDEFEA;
  --claro: #A8B2AC;
  --claro-2: #8E9A94;
  --pad-h: 22px;
  --pad-v: 48px;
  --h1: 40px;
  --h2: 28px;
  --sora: 'Sora', sans-serif;
  --manrope: 'Manrope', sans-serif;
}
@media (min-width: 760px) {
  :root { --pad-h: 44px; --pad-v: 68px; --h1: 52px; --h2: 34px; }
}
@media (min-width: 1120px) {
  :root { --pad-h: 72px; --pad-v: 92px; --h1: 66px; --h2: 42px; }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--manrope);
  background: var(--fondo);
  color: var(--tinta);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
main { flex: 1; }
img { max-width: 100%; display: block; }
a { color: var(--terracota); text-decoration: none; }
a:hover { color: var(--terracota-osc); }
h1, h2, h3 { font-family: var(--sora); color: var(--tinta); margin: 0; }
p { margin: 0; }
input, select, textarea, button { font: inherit; }
input, select, textarea { outline: none; }
:focus-visible { outline: 2px solid var(--terracota); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Encabezado ---------- */
.header {
  position: sticky; top: 0; z-index: 60;
  background: rgba(251, 250, 247, 0.9);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px var(--pad-h);
  border-bottom: 1px solid rgba(23, 33, 31, 0.08);
}
.marca { display: flex; align-items: center; gap: 12px; }
.marca img { height: 36px; width: 36px; object-fit: contain; }
.marca span { font-family: var(--sora); font-weight: 700; font-size: 21px; letter-spacing: 0.14em; color: var(--tinta); }
.nav { display: none; gap: 36px; align-items: center; }
.nav a {
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  font-family: var(--sora); font-size: 13px; letter-spacing: 0.02em; color: var(--tinta); font-weight: 500;
}
.nav a::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: transparent; }
.nav a:hover { color: var(--terracota); }
.nav a[aria-current="page"] { color: var(--terracota); font-weight: 700; }
.nav a[aria-current="page"]::after { background: var(--terracota); }
.hamburguesa {
  display: flex; flex-direction: column; gap: 5px; cursor: pointer;
  padding: 6px; background: none; border: none;
}
.hamburguesa span { width: 22px; height: 2px; background: var(--tinta); display: block; }
.menu-movil {
  display: none; background: var(--tinta); flex-direction: column;
  padding: 24px var(--pad-h) 32px; gap: 18px;
  position: sticky; top: 69px; z-index: 59;
}
.menu-movil.abierto { display: flex; }
.menu-movil a { font-family: var(--sora); font-size: 22px; font-weight: 600; color: var(--fondo); }
@media (min-width: 760px) {
  .nav { display: flex; }
  .hamburguesa, .menu-movil, .menu-movil.abierto { display: none; }
}

/* ---------- Piezas comunes ---------- */
.etiqueta {
  font-family: var(--sora); font-size: 11px; font-weight: 600;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--terracota);
}
.etiqueta--dorada { color: var(--dorado); }
.etiqueta--gris { color: var(--gris); }
.h1 { font-weight: 800; font-size: var(--h1); line-height: 1; letter-spacing: -0.03em; }
.h2 { font-weight: 700; font-size: var(--h2); line-height: 1.05; letter-spacing: -0.02em; text-wrap: pretty; }
.lead { font-size: 18px; line-height: 1.65; color: var(--texto); }
.contenedor { max-width: 1280px; margin: 0 auto; width: 100%; }
.seccion { padding: var(--pad-v) var(--pad-h); }
.boton {
  display: inline-block; border: none; cursor: pointer;
  padding: 17px 32px; font-family: var(--sora); font-weight: 600; font-size: 14px;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.boton--oscuro { background: var(--tinta); color: var(--fondo); }
.boton--oscuro:hover { background: var(--terracota); color: var(--fondo); }
.boton--terracota { background: var(--terracota); color: var(--fondo); }
.boton--terracota:hover { background: var(--tinta); color: var(--fondo); }
.boton--borde { background: transparent; color: var(--tinta); border: 1px solid rgba(23, 33, 31, 0.3); }
.boton--borde:hover { border-color: var(--terracota); color: var(--terracota); }

/* Rejilla de tarjetas: 1 / 2 / 3 columnas */
.tarjetas { display: flex; flex-wrap: wrap; gap: 24px; }
.tarjetas > * { flex-basis: 100%; }
@media (min-width: 760px) { .tarjetas > * { flex-basis: 46%; flex-grow: 1; max-width: calc(50% - 12px); } }
@media (min-width: 1120px) { .tarjetas > * { flex-basis: 31%; max-width: calc(33.333% - 16px); } }

/* ---------- Hero (inicio y nosotros) ---------- */
.hero { display: flex; flex-direction: column; align-items: stretch; }
.hero__texto {
  flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 26px;
  padding: var(--pad-v) var(--pad-h);
}
.hero__img { flex: 1; display: flex; min-height: 360px; }
.hero__img img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; }
.hero--inicio { min-height: 480px; }
.hero--inicio .h1 { line-height: 0.98; }
.hero--inicio .lead { max-width: 480px; }
@media (min-width: 1120px) {
  .hero { flex-direction: row; }
  .hero--inicio { min-height: 620px; }
}
.punto-titulo { display: flex; align-items: center; gap: 10px; }
.punto-titulo::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--terracota); }
.botones { display: flex; gap: 14px; flex-wrap: wrap; }
.datos {
  display: flex; gap: 40px; flex-wrap: wrap; margin-top: 12px; padding-top: 26px;
  border-top: 1px solid rgba(23, 33, 31, 0.1);
}
.datos div { display: flex; flex-direction: column; gap: 4px; }
.datos strong { font-family: var(--sora); font-size: 24px; font-weight: 700; color: var(--terracota); }
.datos span { font-size: 13px; color: var(--gris); }

.franja {
  background: var(--tinta); padding: 22px var(--pad-h);
  display: flex; align-items: center; gap: 18px; overflow: hidden;
}
.franja span { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.franja span:nth-child(3n+1) { background: var(--terracota); }
.franja span:nth-child(3n+2) { background: var(--dorado); }
.franja span:nth-child(3n) { background: var(--verde); }

/* Pilares */
.pilares-split { display: flex; flex-direction: column; gap: 56px; }
.pilares-split > .h2 { flex: 1; }
.pilares-lista { flex: 1; display: flex; flex-direction: column; gap: 32px; }
.pilar { display: flex; gap: 18px; padding-bottom: 28px; border-bottom: 1px solid rgba(23, 33, 31, 0.12); }
.pilar__n { font-family: var(--sora); font-size: 12px; font-weight: 600; color: var(--terracota); padding-top: 6px; }
.pilar div { display: flex; flex-direction: column; gap: 8px; }
.pilar h3, .pilar-col h3 { font-weight: 600; font-size: 20px; }
.pilar p, .pilar-col p { font-size: 15px; line-height: 1.65; color: var(--texto); }
@media (min-width: 760px) { .pilares-split { flex-direction: row; } }

/* Categorías */
.cabecera-seccion {
  display: flex; align-items: baseline; justify-content: space-between;
  flex-wrap: wrap; gap: 16px; margin-bottom: 36px;
}
.cabecera-seccion a { font-family: var(--sora); font-size: 13px; font-weight: 600; }
.categoria { display: flex; flex-direction: column; gap: 16px; color: inherit; }
.categoria:hover { color: inherit; }
.categoria__img { overflow: hidden; background: var(--panel); }
.categoria__img img { width: 100%; aspect-ratio: 1; object-fit: contain; transition: transform 0.5s ease; }
.categoria:hover .categoria__img img { transform: scale(1.04); }
.categoria h3 { font-weight: 600; font-size: 18px; }
.categoria p { font-size: 14px; line-height: 1.55; color: var(--texto-2); margin-top: 6px; }

/* Clientes */
.clientes { background: var(--verde); }
.clientes .h2 { color: var(--fondo); margin: 14px 0 40px; }
.clientes .tarjetas { gap: 20px; }
.cliente { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.cliente img { width: 100%; aspect-ratio: 1; object-fit: contain; background: var(--fondo); }
.cliente figcaption { font-family: var(--sora); font-weight: 600; font-size: 13px; color: var(--fondo); }
@media (min-width: 760px) { .clientes .tarjetas > * { max-width: calc(50% - 10px); } }
@media (min-width: 1120px) { .clientes .tarjetas > * { max-width: calc(33.333% - 14px); } }

/* Eventos */
.titulo-bloque { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.eventos { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-top: 40px; }
.evento { display: flex; flex-direction: column; gap: 14px; }
.evento img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #E8E3DA; }
.evento h3 { font-weight: 700; font-size: 18px; }
.evento p { font-size: 15px; line-height: 1.5; color: #4A524F; text-wrap: pretty; }

.cierre { display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; }
.cierre .h2 { font-weight: 800; max-width: 640px; }

/* ---------- Servicios ---------- */
.intro-pagina .h1 { margin: 16px 0 20px; }
.intro-pagina .lead { max-width: 620px; }
.bolsas { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 32px 24px; margin-top: 40px; }
.bolsa { display: flex; flex-direction: column; gap: 12px; }
.bolsa img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--panel); }
.bolsa h3 { font-weight: 700; font-size: 18px; line-height: 1.2; margin-top: 4px; }
.bolsa p { font-size: 15px; line-height: 1.55; color: var(--texto); text-wrap: pretty; }
.bolsa small { font-family: var(--sora); font-size: 12px; font-weight: 600; color: var(--verde); }
.tecnicas { display: flex; flex-direction: column; gap: 14px; padding-top: 28px; border-top: 1px solid #DCDDD6; margin-top: 40px; }
.tecnicas h3 { font-size: 13px; font-weight: 700; }
.tecnicas ul { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; }
.tecnicas li { font-size: 14px; border: 1px solid #C9CBC2; padding: 8px 14px; }
.lineas { display: flex; flex-direction: column; gap: 56px; }
.linea { display: flex; flex-direction: column; gap: 48px; align-items: center; }
.linea img { flex: 1.1; width: 100%; aspect-ratio: 1; max-height: 520px; object-fit: contain; background: var(--panel); }
.linea div { flex: 1; display: flex; flex-direction: column; gap: 16px; }
.linea span { font-family: var(--sora); font-size: 12px; font-weight: 600; color: var(--terracota); }
.linea h3 { font-weight: 700; font-size: 28px; line-height: 1.1; letter-spacing: -0.02em; }
.linea p { font-size: 16px; line-height: 1.7; color: var(--texto); }
@media (min-width: 760px) {
  .lineas { gap: 84px; }
  .linea { flex-direction: row; }
  .linea:nth-of-type(odd) { flex-direction: row-reverse; }
  .linea img { min-width: 0; }
}
.proceso { background: var(--tinta); }
.proceso .h2 { color: var(--fondo); margin-bottom: 44px; }
.pasos { display: flex; flex-wrap: wrap; gap: 28px; }
.paso, .pilar-col { flex-basis: 100%; display: flex; flex-direction: column; gap: 12px; padding-top: 22px; }
.paso { border-top: 1px solid rgba(251, 250, 247, 0.22); }
.paso span { font-family: var(--sora); font-weight: 700; font-size: 13px; color: var(--dorado); }
.paso h3 { font-weight: 600; font-size: 19px; color: var(--fondo); }
.paso p { font-size: 14px; line-height: 1.65; color: var(--claro); }
@media (min-width: 760px) { .paso, .pilar-col { flex-basis: 46%; flex-grow: 1; } }
@media (min-width: 1120px) { .paso, .pilar-col { flex-basis: 22%; } }

/* ---------- Galería ---------- */
.galeria { display: flex; flex-wrap: wrap; gap: 16px; }
.galeria figure { margin: 0; flex-basis: 100%; min-width: 220px; flex-grow: 1; display: flex; flex-direction: column; gap: 10px; }
.galeria img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--panel); }
.galeria figcaption { font-family: var(--sora); font-weight: 500; font-size: 12px; color: var(--gris); }
@media (min-width: 760px) {
  .galeria .g-lg { flex-basis: 48%; }
  .galeria .g-sm { flex-basis: 31%; }
}

/* ---------- Nosotros ---------- */
.hero--nosotros .hero__texto { gap: 24px; }
.hero--nosotros .lead { line-height: 1.75; max-width: 520px; }
.hero--nosotros .hero__img, .hero--nosotros .hero__img img { min-height: 340px; }
.pilares-fila { display: flex; flex-wrap: wrap; gap: 32px; }
.pilar-col { border-top: 1px solid rgba(23, 33, 31, 0.15); }
.pilar-col::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--verde); }

/* ---------- Contacto ---------- */
.contacto { display: flex; flex-direction: column; align-items: stretch; }
.contacto__info {
  flex: 1; background: var(--tinta); padding: var(--pad-v) var(--pad-h);
  display: flex; flex-direction: column; gap: 22px; justify-content: center;
}
.contacto__info .h1 { color: var(--fondo); }
.contacto__info p { font-size: 17px; line-height: 1.7; color: var(--claro); max-width: 430px; }
.contacto__tel { font-family: var(--sora); font-weight: 700; font-size: 26px; color: var(--fondo); letter-spacing: -0.01em; }
.contacto__tel:hover { color: var(--dorado); }
.contacto__nota { font-size: 14px; color: var(--claro-2); }
.contacto__form {
  flex: 1; padding: var(--pad-v) var(--pad-h);
  display: flex; flex-direction: column; gap: 14px; justify-content: center;
}
.contacto__form input, .contacto__form select, .contacto__form textarea {
  padding: 15px 0; border: none; border-bottom: 1px solid rgba(23, 33, 31, 0.22);
  background: transparent; font-family: var(--manrope); font-size: 15px; color: var(--tinta);
  border-radius: 0; width: 100%;
}
.contacto__form input:focus, .contacto__form select:focus, .contacto__form textarea:focus { border-bottom-color: var(--terracota); }
.contacto__form textarea { resize: vertical; }
.contacto__form select {
  -webkit-appearance: none; appearance: none; cursor: pointer; padding-right: 28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2317211F' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 4px center;
}
.contacto__form select:invalid, .contacto__form select.vacio { color: #7d8781; }
.contacto__form ::placeholder { color: #7d8781; }
.contacto__form .boton { align-self: flex-start; margin-top: 14px; padding: 16px 34px; }
.contacto__form .boton[disabled] { opacity: 0.6; cursor: wait; }
.autorizo { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: var(--texto); margin-top: 8px; }
.autorizo input { width: auto; margin-top: 3px; accent-color: var(--terracota); }
.trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-estado { font-size: 15px; line-height: 1.5; min-height: 1.5em; }
.form-estado.ok { color: var(--verde); font-weight: 600; }
.form-estado.error { color: var(--terracota-osc); }
@media (min-width: 1120px) { .contacto { flex-direction: row; } }

/* ---------- Pie ---------- */
.pie {
  background: var(--tinta); color: var(--fondo);
  padding: var(--pad-v) var(--pad-h) 28px; display: flex; flex-direction: column; gap: 44px;
}
.pie__cols { display: flex; flex-direction: column; gap: 40px; justify-content: space-between; }
.pie__col { display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pie__col:first-child { flex: 1.4; gap: 14px; }
.pie__col:first-child img { width: 100%; max-width: 280px; object-fit: contain; }
.pie__lema { font-size: 14px; color: var(--dorado); letter-spacing: 0.08em; }
.pie__titulo { font-family: var(--sora); font-weight: 600; font-size: 11px; letter-spacing: 0.2em; color: var(--claro-2); }
.pie__col a { color: var(--fondo); font-size: 15px; }
.pie__col a:hover { color: var(--dorado); }
.pie__col > span:not(.pie__titulo):not(.pie__lema) { font-size: 15px; color: var(--claro); }
.pie__legal { border-top: 1px solid rgba(251, 250, 247, 0.15); padding-top: 20px; font-size: 12px; color: var(--claro-2); display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }
.pie__legal a { color: var(--claro-2); text-decoration: underline; }
@media (min-width: 760px) { .pie__cols { flex-direction: row; } }

/* ---------- Página legal ---------- */
.legal { max-width: 780px; }
.legal h2 { font-size: 20px; margin: 36px 0 12px; }
.legal p, .legal li { font-size: 16px; line-height: 1.7; color: var(--texto); }
.legal p + p { margin-top: 12px; }