/* =========================================================
   KEXAA · estilos
   Paleta tomada del logotipo: oro oliva + azul petróleo sobre negro pimienta
   ========================================================= */
:root {
  --tinta: #0c0d0a;
  --tinta-2: #14160f;
  --tinta-3: #1f2219;
  --hueso: #efe9dc;
  --hueso-2: #e2dac8;
  --papel: #f7f3ea;
  --oro: #b89a54;
  --oro-claro: #d8bd7a;
  --oro-hondo: #7d6a3a;
  --azul: #14809f;
  --azul-claro: #56bedb;
  --sube: #86c66f;
  --baja: #ec7a63;
  --linea-o: rgba(239, 233, 220, .16);   /* línea sobre oscuro */
  --linea-c: rgba(12, 13, 10, .16);      /* línea sobre claro */
  --texto-o: rgba(239, 233, 220, .72);
  --texto-c: rgba(12, 13, 10, .72);

  --serif: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --sans: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --borde: clamp(20px, 4.2vw, 72px);
  --seccion: clamp(88px, 12vw, 190px);
  --suave: cubic-bezier(.22, 1, .36, 1);
  --nav-h: 76px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: auto; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  margin: 0; background: var(--tinta); color: var(--hueso);
  font-family: var(--sans); font-size: clamp(16px, 1.05vw, 18px); line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
body.bloqueado { overflow: hidden; }
img, svg, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
::selection { background: var(--oro); color: var(--tinta); }
:focus-visible { outline: 2px solid var(--azul-claro); outline-offset: 3px; border-radius: 2px; }

.contenedor { width: 100%; max-width: 1680px; margin-inline: auto; padding-inline: var(--borde); }
.mono { font-family: var(--mono); font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; font-weight: 500; }

/* grano de película sobre todo el sitio: une fotos de calidades distintas */
body::after {
  content: ""; position: fixed; inset: -50%; z-index: 90; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grano 1.2s steps(6) infinite;
}
@keyframes grano { 0% { transform: translate(0, 0); } 20% { transform: translate(-3%, 2%); } 40% { transform: translate(2%, -4%); } 60% { transform: translate(-2%, 3%); } 80% { transform: translate(4%, 1%); } 100% { transform: translate(0, 0); } }

/* ---------- tipografía ---------- */
.titulo { font-family: var(--serif); font-weight: 300; line-height: .98; letter-spacing: -.028em; font-variation-settings: 'opsz' 144, 'SOFT' 40; text-wrap: balance; }
.titulo em, .it { font-style: italic; font-weight: 300; color: var(--oro); font-variation-settings: 'opsz' 144, 'SOFT' 100; }
.seccion--hueso .titulo em, .seccion--papel .titulo em { color: var(--oro-hondo); }
.titulo--xxl { font-size: clamp(2.9rem, 9vw, 9.6rem); }
.titulo--xl { font-size: clamp(2.6rem, 7.2vw, 7.4rem); }
.titulo--l { font-size: clamp(2.3rem, 5.2vw, 5.2rem); }
.titulo--m { font-size: clamp(2rem, 3.6vw, 3.6rem); line-height: 1.04; }
.lead { font-size: clamp(1.1rem, 1.45vw, 1.45rem); line-height: 1.45; max-width: 34ch; }
.ln-mask { padding-bottom: .16em; margin-bottom: -.16em; padding-right: .08em; }
.ln { will-change: transform; }

.etiqueta { display: inline-flex; align-items: center; gap: .9em; font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; }
.etiqueta .num { color: var(--oro); padding-right: .9em; border-right: 1px solid currentColor; }
.seccion--hueso .etiqueta .num, .seccion--papel .etiqueta .num { color: var(--oro-hondo); }
.punto { width: 7px; height: 7px; border-radius: 50%; background: var(--oro); flex: none; display: inline-block; }
.punto--vivo { background: var(--azul-claro); box-shadow: 0 0 0 0 rgba(86, 190, 219, .6); animation: latido 2s infinite; }
@keyframes latido { 70% { box-shadow: 0 0 0 9px rgba(86, 190, 219, 0); } 100% { box-shadow: 0 0 0 0 rgba(86, 190, 219, 0); } }

/* ---------- botones ---------- */
.btn {
  --bg: var(--hueso); --fg: var(--tinta);
  position: relative; display: inline-flex; align-items: center; gap: .8em; isolation: isolate; overflow: hidden;
  padding: 1.05em 1.7em; border-radius: 999px; background: var(--bg); color: var(--fg);
  font-weight: 600; font-size: .95rem; letter-spacing: .01em; line-height: 1; white-space: nowrap;
  transition: color .45s var(--suave);
}
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--hover, var(--tinta)); border-radius: inherit; transform: translateY(101%); transition: transform .55s var(--suave); }
.btn:hover::before { transform: translateY(0); }
.btn:hover { color: var(--hover-fg, var(--hueso)); }
.btn svg { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .45s var(--suave); }
.btn:hover svg { transform: translateX(4px); }
.btn--oro { --bg: var(--oro); --fg: var(--tinta); --hover: var(--hueso); --hover-fg: var(--tinta); }
.btn--tinta { --bg: var(--tinta); --fg: var(--hueso); --hover: var(--oro); --hover-fg: var(--tinta); }
.btn--chico { padding: .8em 1.3em; font-size: .85rem; --bg: var(--hueso); --hover: var(--oro); --hover-fg: var(--tinta); }
.btn--wa { --bg: transparent; --fg: var(--tinta); --hover: var(--tinta); border: 1px solid var(--tinta); align-self: flex-start; }
.enlace { position: relative; display: inline-block; padding-bottom: 3px; font-weight: 500; }
.enlace::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform-origin: right; transition: transform .5s var(--suave); }
.enlace:hover::after { transform: scaleX(0); }

/* ---------- preloader ---------- */
.preloader { position: fixed; inset: 0; z-index: 200; background: var(--tinta); color: var(--hueso); display: grid; place-items: stretch; }
.no-js .preloader { display: none; }
.preloader__inner { display: flex; flex-direction: column; justify-content: space-between; padding: var(--borde); height: 100%; }
.preloader__marca { font-family: var(--serif); font-weight: 300; font-size: clamp(5rem, 22vw, 22rem); line-height: .8; letter-spacing: -.05em; color: var(--oro); display: flex; overflow: hidden; margin-top: auto; padding-bottom: .12em; font-variation-settings: 'opsz' 144, 'SOFT' 100; }
.preloader__marca span { display: inline-block; }
.preloader__marca .t, .pie__marca .t { color: var(--azul-claro); }
.preloader__pie { display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px solid var(--linea-o); padding-top: 18px; margin-top: 18px; }
.preloader__num { font-size: 1rem; color: var(--oro); }

/* ---------- cursor y progreso ---------- */
.cursor { position: fixed; left: 0; top: 0; z-index: 150; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--oro); pointer-events: none; mix-blend-mode: difference; opacity: 0; display: grid; place-items: center; transition: width .35s var(--suave), height .35s var(--suave), margin .35s var(--suave), opacity .3s; }
.cursor.is-visible { opacity: 1; }
.cursor.is-enlace { width: 54px; height: 54px; margin: -27px 0 0 -27px; }
.cursor.is-foto { width: 92px; height: 92px; margin: -46px 0 0 -46px; mix-blend-mode: normal; background: var(--oro); }
.cursor__txt { font-family: var(--mono); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta); opacity: 0; transition: opacity .2s; }
.cursor.is-foto .cursor__txt { opacity: 1; }
@media (hover: none), (pointer: coarse) { .cursor { display: none; } }
.progreso { position: fixed; left: 0; top: 0; right: 0; height: 2px; z-index: 120; pointer-events: none; }
.progreso i { display: block; height: 100%; background: var(--oro); transform-origin: left; transform: scaleX(0); }

/* ---------- navegación ---------- */
.nav { position: fixed; inset: 0 0 auto 0; z-index: 110; height: var(--nav-h); padding-inline: var(--borde); display: flex; align-items: center; justify-content: space-between; gap: 24px; transition: transform .6s var(--suave), background .4s, backdrop-filter .4s; }
.nav.is-oculta { transform: translateY(-100%); }
.nav.is-solida { background: rgba(12, 13, 10, .72); backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3); border-bottom: 1px solid var(--linea-o); }
.nav__logo img { width: clamp(104px, 9vw, 132px); filter: brightness(1.25) saturate(1.1); }
.nav__links { display: flex; gap: clamp(18px, 2.4vw, 40px); font-size: .9rem; font-weight: 500; }
.nav__links a { position: relative; padding: 6px 0; opacity: .82; transition: opacity .3s; }
.nav__links a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--oro); transform: scaleX(0); transform-origin: right; transition: transform .5s var(--suave); }
.nav__links a:hover, .nav__links a.is-activo { opacity: 1; }
.nav__links a:hover::after, .nav__links a.is-activo::after { transform: scaleX(1); transform-origin: left; }
.nav__acciones { display: flex; align-items: center; gap: 14px; }
.idioma { display: flex; border: 1px solid var(--linea-o); border-radius: 999px; padding: 3px; font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; }
.idioma button { padding: 6px 10px; border-radius: 999px; opacity: .6; transition: background .3s, color .3s, opacity .3s; }
.idioma button.is-activo { background: var(--hueso); color: var(--tinta); opacity: 1; }
.nav__menu { display: none; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--linea-o); position: relative; }
.nav__menu i { position: absolute; left: 13px; right: 13px; height: 1.5px; background: var(--hueso); transition: transform .5s var(--suave), top .5s var(--suave); }
.nav__menu i:first-child { top: 18px; } .nav__menu i:last-child { top: 25px; }
.menu-abierto .nav__menu i:first-child { top: 21.5px; transform: rotate(45deg); }
.menu-abierto .nav__menu i:last-child { top: 21.5px; transform: rotate(-45deg); }

.menu { position: fixed; inset: 0; z-index: 105; background: var(--tinta-2); padding: calc(var(--nav-h) + 24px) var(--borde) 32px; display: flex; flex-direction: column; justify-content: space-between; clip-path: inset(0 0 100% 0); visibility: hidden; transition: clip-path .8s var(--suave), visibility 0s .8s; }
.menu-abierto .menu { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path .8s var(--suave), visibility 0s; }
.menu__links { display: flex; flex-direction: column; }
.menu__links a { display: flex; align-items: baseline; gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--linea-o); font-family: var(--serif); font-weight: 300; font-size: clamp(2.1rem, 9vw, 3.4rem); line-height: 1.1; letter-spacing: -.02em; overflow: hidden; }
.menu__links a small { font-family: var(--mono); font-size: .7rem; color: var(--oro); letter-spacing: .1em; }
.menu__links a span { display: inline-block; transform: translateY(110%); transition: transform .8s var(--suave); }
.menu-abierto .menu__links a span { transform: none; }
.menu__links a:nth-child(2) span { transition-delay: .05s; } .menu__links a:nth-child(3) span { transition-delay: .1s; } .menu__links a:nth-child(4) span { transition-delay: .15s; } .menu__links a:nth-child(5) span { transition-delay: .2s; } .menu__links a:nth-child(6) span { transition-delay: .25s; }
.menu__pie { display: flex; flex-direction: column; gap: 10px; color: var(--texto-o); }

/* ---------- hero ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; background: var(--tinta); isolation: isolate; }
.hero__fondo { position: absolute; inset: -6% 0; z-index: -3; }
.hero__fondo img { width: 100%; height: 100%; object-fit: cover; }
.hero__granos { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.hero__velo { position: absolute; inset: 0; z-index: -2; background:
  linear-gradient(180deg, rgba(12, 13, 10, .78) 0%, rgba(12, 13, 10, .25) 34%, rgba(12, 13, 10, .55) 68%, var(--tinta) 100%),
  linear-gradient(90deg, rgba(12, 13, 10, .82) 0%, rgba(12, 13, 10, .2) 62%, rgba(12, 13, 10, .45) 100%); }
.hero__contenido { padding-top: calc(var(--nav-h) + 40px); padding-bottom: clamp(36px, 5vw, 72px); }
.hero__coord { color: var(--texto-o); margin-bottom: clamp(18px, 2.4vw, 34px); flex-wrap: wrap; row-gap: 6px; }
.hero__coord span:first-of-type { color: var(--oro-claro); }
.hero__titulo { font-family: var(--serif); font-weight: 300; font-size: clamp(3.25rem, 10.6vw, 11.4rem); line-height: .9; letter-spacing: -.04em; font-variation-settings: 'opsz' 144, 'SOFT' 30; }
.hero__titulo .linea { display: block; overflow: hidden; padding-bottom: .14em; margin-bottom: -.14em; }
.hero__titulo .linea > span { display: inline-block; will-change: transform; }
.hero__titulo .linea:nth-child(2) { padding-left: clamp(0px, 7vw, 150px); }
.hero__base { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px 60px; flex-wrap: wrap; margin-top: clamp(26px, 3.4vw, 54px); padding-top: clamp(20px, 2vw, 30px); border-top: 1px solid var(--linea-o); }
.hero__texto { max-width: 46ch; color: var(--texto-o); font-size: clamp(1rem, 1.2vw, 1.2rem); line-height: 1.5; }
.hero__cta { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.hero__sello { position: absolute; right: var(--borde); top: calc(var(--nav-h) + clamp(20px, 6vh, 80px)); width: clamp(110px, 11vw, 170px); aspect-ratio: 1; }
.hero__sello svg { width: 100%; height: 100%; animation: gira 26s linear infinite; }
.hero__sello text { font-family: var(--mono); font-size: 12.5px; fill: var(--hueso); text-transform: uppercase; }
.hero__sello-centro { position: absolute; inset: 37%; border-radius: 50%; background: radial-gradient(circle at 34% 30%, #5b4f3c, #1a1611 58%, #060504); box-shadow: inset -4px -6px 10px rgba(0, 0, 0, .6); }
@keyframes gira { to { transform: rotate(360deg); } }

/* ---------- franja de precios ---------- */
.franja { position: relative; z-index: 3; display: flex; align-items: stretch; background: var(--hueso); color: var(--tinta); border-block: 1px solid var(--tinta); }
.franja__rotulo { flex: none; display: flex; align-items: center; gap: 14px; padding: 14px clamp(16px, 2vw, 30px) 14px var(--borde); background: var(--tinta); color: var(--hueso); position: relative; z-index: 2; }
.franja__rotulo b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.12rem; line-height: 1.1; letter-spacing: -.01em; }
.franja__rotulo small { display: block; font-size: .6rem; color: var(--azul-claro); margin-top: 4px; }
.franja__pista { flex: 1; overflow: hidden; display: flex; align-items: center; -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.franja__cinta { display: flex; flex: none; white-space: nowrap; will-change: transform; }
.franja__cinta.is-lista { animation: cinta var(--dur, 60s) linear infinite; }
.franja:hover .franja__cinta { animation-play-state: paused; }
@keyframes cinta { to { transform: translateX(-50%); } }
.franja__item { display: inline-flex; align-items: baseline; gap: 12px; padding: 0 clamp(20px, 2.4vw, 40px); border-right: 1px solid var(--linea-c); font-family: var(--mono); font-size: .8rem; letter-spacing: .04em; }
.franja__item .cod { font-weight: 600; font-size: .64rem; padding: 3px 6px; border: 1px solid var(--tinta); border-radius: 3px; align-self: center; }
.franja__item .org { text-transform: uppercase; letter-spacing: .08em; }
.franja__item .val { font-family: var(--serif); font-size: 1.5rem; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.franja__item .var { font-weight: 600; }
.var--sube { color: #2f7a1f; } .var--baja { color: #b8402b; } .var--igual { color: var(--texto-c); }
.seccion--tinta .var--sube { color: var(--sube); } .seccion--tinta .var--baja { color: var(--baja); } .seccion--tinta .var--igual { color: var(--texto-o); }
.franja__item--info { color: var(--texto-c); text-transform: uppercase; }
.franja__item--ec .cod { background: var(--tinta); color: var(--hueso); }
.franja__item--ec .org { font-weight: 600; }
.franja__cotizar { align-self: center; padding: 5px 11px; border-radius: 999px; background: var(--oro); color: var(--tinta); font-weight: 600; text-transform: uppercase; font-size: .68rem; letter-spacing: .08em; transition: background .3s; }
.franja__item--ec:hover .franja__cotizar { background: var(--tinta); color: var(--hueso); }

/* ---------- secciones ---------- */
.seccion { position: relative; padding-block: var(--seccion); }
.seccion--hueso { background: var(--hueso); color: var(--tinta); }
.seccion--papel { background: var(--papel); color: var(--tinta); }
.seccion--tinta { background: var(--tinta); color: var(--hueso); }
.cabecera { display: flex; margin-bottom: clamp(34px, 5vw, 78px); padding-bottom: 18px; border-bottom: 1px solid var(--linea-c); }
.seccion--tinta .cabecera, .origen .cabecera { border-color: var(--linea-o); }
.cabecera--doble { justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }

.marco { position: relative; overflow: hidden; border-radius: 4px; background: var(--tinta-3); }
.marco img { width: 100%; height: 116%; object-fit: cover; will-change: transform; }
.marco--alto { aspect-ratio: 4 / 5; }
.marco--arco { aspect-ratio: 4 / 5.4; border-radius: 999px 999px 4px 4px; }
.marco figcaption { position: absolute; left: 14px; bottom: 14px; color: var(--hueso); background: rgba(12, 13, 10, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 7px 11px; border-radius: 999px; font-size: .62rem; }

/* nosotros */
.manifiesto { font-family: var(--serif); font-weight: 300; font-size: clamp(1.75rem, 5.1vw, 5.6rem); line-height: 1.08; letter-spacing: -.03em; max-width: 22ch; font-variation-settings: 'opsz' 144, 'SOFT' 50; }
.manifiesto .palabra { display: inline-block; }
.nos__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 7vw, 130px); align-items: center; margin-top: clamp(56px, 9vw, 150px); }
.nos__texto { display: grid; gap: 1.5em; max-width: 54ch; }
.nos__texto .titulo { margin-bottom: .25em; }
.nos__texto p { color: var(--texto-c); }
.nota { padding: 1.3em 1.5em; border-left: 2px solid var(--oro-hondo); background: rgba(12, 13, 10, .045); font-size: .95em; }
.nota b { color: var(--tinta); letter-spacing: .04em; }
.cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(56px, 8vw, 130px); border-top: 1px solid var(--tinta); }
.cifras li { padding: clamp(18px, 2.2vw, 34px) clamp(12px, 1.6vw, 28px) 0 0; display: grid; gap: 10px; align-content: start; }
.cifras li + li { padding-left: clamp(12px, 1.6vw, 28px); border-left: 1px solid var(--linea-c); }
.cifras b { font-family: var(--serif); font-weight: 300; font-size: clamp(2.8rem, 6.4vw, 6.6rem); line-height: .9; letter-spacing: -.04em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cifras b small, .cifras b sup { font-family: var(--mono); font-size: .17em; letter-spacing: .08em; font-weight: 500; margin-left: .5em; color: var(--oro-hondo); vertical-align: baseline; text-transform: uppercase; }
.cifras b sup { font-family: var(--serif); font-size: .42em; margin-left: .05em; letter-spacing: 0; vertical-align: super; text-transform: none; }
.cifras li > span { color: var(--texto-c); font-size: .92rem; max-width: 20ch; line-height: 1.35; }

/* origen */
.origen { background: var(--tinta); color: var(--hueso); overflow: hidden; isolation: isolate; }
.origen__fondo { position: absolute; inset: 0; z-index: -1; }
.origen__fondo img { width: 100%; height: 124%; object-fit: cover; opacity: .5; }
.origen__fondo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--tinta) 0%, rgba(12, 13, 10, .55) 30%, rgba(12, 13, 10, .82) 70%, var(--tinta) 100%); }
.clima { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border: 1px solid var(--linea-o); border-radius: 999px; background: rgba(12, 13, 10, .4); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--texto-o); }
.clima b { color: var(--hueso); font-weight: 500; }
.clima[hidden] { display: none; }
.perfil { margin-top: clamp(40px, 6vw, 90px); border: 1px solid var(--linea-o); border-radius: 6px; background: rgba(12, 13, 10, .5); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.perfil__lienzo { min-width: 660px; padding: clamp(14px, 2vw, 30px); }
.perfil svg { width: 100%; height: auto; overflow: visible; }
.perfil__t { font-family: var(--mono); font-size: 13px; letter-spacing: .06em; fill: var(--texto-o); text-transform: uppercase; }
.perfil__t--der { text-anchor: end; } .perfil__t--guia { fill: rgba(239, 233, 220, .55); font-size: 12px; } .perfil__t--centro { text-anchor: middle; }
.perfil__t--fuerte { fill: var(--hueso); font-weight: 600; font-size: 14px; }
.perfil__t--oro { fill: var(--oro-claro); font-size: 15px; font-weight: 600; }
.perfil__guia { stroke: var(--linea-o); stroke-width: 1; stroke-dasharray: 3 6; }
.perfil__zona { fill: rgba(134, 198, 111, .08); }
.perfil__ola { fill: none; stroke: var(--azul-claro); stroke-width: 2; }
.perfil__linea { fill: none; stroke: var(--oro-claro); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.perfil__linea--andes { stroke: var(--texto-o); stroke-width: 2; stroke-dasharray: .012 .014; }
.perfil__cota line, .perfil__marca line { stroke: var(--hueso); stroke-width: 1; }
.perfil__marca line { stroke-dasharray: 2 4; opacity: .6; }
.perfil__marca circle { fill: var(--oro-claro); stroke: var(--tinta); stroke-width: 2; }
.perfil__marca .pulso { fill: none; stroke: var(--oro-claro); stroke-width: 1.5; transform-origin: 620px 203px; animation: pulso 2.4s ease-out infinite; }
@keyframes pulso { from { transform: scale(1); opacity: .9; } to { transform: scale(3.4); opacity: 0; } }
.origen__pie { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 5vw, 90px); margin-top: clamp(30px, 4vw, 60px); }
.origen__texto { color: var(--texto-o); max-width: 50ch; font-size: clamp(1rem, 1.25vw, 1.25rem); line-height: 1.5; }

/* producto */
.pro__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(30px, 6vw, 110px); align-items: start; }
.pro__visual { position: sticky; top: calc(var(--nav-h) + 30px); display: grid; justify-items: center; gap: 22px; }
.disco { width: min(100%, 560px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--tinta); box-shadow: 0 40px 80px -30px rgba(12, 13, 10, .55), 0 0 0 1px var(--linea-c), 0 0 0 14px var(--hueso), 0 0 0 15px var(--linea-c); }
.disco img { width: 100%; height: 100%; object-fit: cover; will-change: transform; }
.pro__tag { color: var(--texto-c); }
.pro__info { display: grid; gap: clamp(22px, 2.6vw, 40px); justify-items: start; }
.pro__info .lead { color: var(--texto-c); }
.ficha { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--tinta); }
.ficha > div { padding: clamp(16px, 1.8vw, 28px) clamp(10px, 1.4vw, 22px) clamp(18px, 2vw, 30px) 0; border-bottom: 1px solid var(--linea-c); display: grid; gap: 8px; align-content: start; }
.ficha > div:not(:nth-child(3n + 1)) { padding-left: clamp(10px, 1.4vw, 22px); border-left: 1px solid var(--linea-c); }
.ficha dt { font-family: var(--mono); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-c); }
.ficha dd { font-family: var(--serif); font-weight: 300; font-size: clamp(2.3rem, 4.4vw, 4.6rem); line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ficha dd.txt { letter-spacing: -.02em; font-size: clamp(2rem, 3.6vw, 3.8rem); }
.ficha dd small { font-family: var(--mono); font-size: .24em; letter-spacing: .06em; margin-left: .35em; color: var(--oro-hondo); font-weight: 500; }
.ficha p { font-size: .85rem; color: var(--texto-c); line-height: 1.3; }

.galeria { margin-top: var(--seccion); overflow: hidden; }
.galeria__fila { display: flex; gap: clamp(10px, 1.4vw, 22px); width: max-content; will-change: transform; padding-inline: var(--borde); }
.galeria__fila img { width: clamp(180px, 24vw, 400px); aspect-ratio: 1; object-fit: cover; border-radius: 4px; filter: saturate(.9); transition: filter .5s; }
.galeria__fila img:nth-child(even) { margin-top: clamp(20px, 4vw, 70px); }
.galeria__fila img:hover { filter: saturate(1.15); }

/* proceso (desplazamiento horizontal) */
.proceso { position: relative; background: var(--tinta-2); color: var(--hueso); overflow: hidden; }
.proceso__pista { display: flex; align-items: center; gap: clamp(20px, 3vw, 54px); width: max-content; padding: clamp(84px, 11vh, 140px) var(--borde) clamp(70px, 9vh, 110px); min-height: 100svh; will-change: transform; }
.proceso__intro { width: min(86vw, 640px); display: grid; gap: clamp(18px, 2.4vw, 34px); padding-right: clamp(10px, 4vw, 80px); flex: none; }
.proceso__intro .lead { color: var(--texto-o); max-width: 36ch; }
.proceso__pista-txt { display: inline-flex; align-items: center; gap: 10px; color: var(--oro-claro); }
.proceso__pista-txt svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; animation: empuja 1.6s var(--suave) infinite; }
@keyframes empuja { 50% { transform: translateX(8px); } }
.paso { flex: none; width: clamp(250px, 25vw, 420px); display: grid; gap: 18px; }
.paso:nth-of-type(even) { margin-top: clamp(40px, 9vh, 110px); }
.paso figure { aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; background: var(--tinta-3); }
.paso img { width: 124%; max-width: none; height: 100%; object-fit: cover; margin-left: -12%; will-change: transform; }
.paso > div { display: grid; grid-template-columns: auto 1fr; column-gap: 16px; row-gap: 6px; align-items: baseline; padding-top: 16px; border-top: 1px solid var(--linea-o); }
.paso__n { color: var(--oro-claro); }
.paso h3 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.7rem, 2.3vw, 2.4rem); letter-spacing: -.02em; line-height: 1.05; }
.paso p { grid-column: 2; color: var(--texto-o); font-size: .95rem; line-height: 1.45; max-width: 32ch; }
.proceso__barra { position: absolute; left: var(--borde); right: var(--borde); bottom: clamp(26px, 4vh, 44px); height: 1px; background: var(--linea-o); }
.proceso__barra i { display: block; height: 3px; margin-top: -1px; background: var(--oro); transform-origin: left; transform: scaleX(0); }

/* propósito */
.prp__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr) minmax(0, 1fr); gap: clamp(24px, 4.5vw, 84px); align-items: start; }
.prp__bloque { display: grid; gap: 1.2em; }
.prp__bloque p { color: var(--texto-c); max-width: 46ch; }
.prp__bloque--abajo { align-self: end; }
.valores { margin-top: clamp(64px, 10vw, 160px); }
.etiqueta--sola { margin-bottom: 22px; color: var(--texto-c); }
.valores li { position: relative; display: grid; grid-template-columns: 4.5rem minmax(0, 1.2fr) minmax(0, 1fr); gap: 12px 24px; align-items: center; padding: clamp(18px, 2.3vw, 36px) clamp(0px, 1.4vw, 22px); border-top: 1px solid var(--linea-c); transition: color .5s var(--suave), padding .5s var(--suave); isolation: isolate; }
.valores li:last-child { border-bottom: 1px solid var(--linea-c); }
.valores li::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--tinta); transform: scaleY(0); transform-origin: bottom; transition: transform .55s var(--suave); }
.valores li span { color: var(--oro-hondo); }
.valores h3 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.8rem, 4.2vw, 4.4rem); line-height: 1; letter-spacing: -.03em; }
.valores li p { color: var(--texto-c); max-width: 40ch; transition: color .5s; }
@media (hover: hover) {
  .valores li:hover { color: var(--hueso); padding-inline: clamp(12px, 2.6vw, 44px); }
  .valores li:hover::before { transform: scaleY(1); transform-origin: top; }
  .valores li:hover p { color: var(--texto-o); }
  .valores li:hover span { color: var(--oro-claro); }
}

/* mercado */
.mer__act { display: inline-flex; align-items: center; gap: 10px; color: var(--texto-o); }
.mer__act b { color: var(--hueso); font-weight: 500; }
.mer__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(30px, 5vw, 90px); margin-top: clamp(40px, 6vw, 90px); align-items: start; }
.tablero { border: 1px solid var(--linea-o); border-radius: 6px; background: var(--tinta-2); padding: clamp(18px, 2.2vw, 34px); }
.tablero__cab { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.tablero h3, .noticias h3 { font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; color: var(--texto-o); }
.unidades { display: flex; border: 1px solid var(--linea-o); border-radius: 999px; padding: 3px; font-family: var(--mono); font-size: .66rem; letter-spacing: .06em; }
.unidades button { padding: 7px 12px; border-radius: 999px; opacity: .6; transition: background .3s, color .3s, opacity .3s; }
.unidades button.is-activo { background: var(--azul-claro); color: var(--tinta); opacity: 1; font-weight: 600; }
.fila { display: grid; grid-template-columns: 2.6rem minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 8px 16px; align-items: center; padding: clamp(13px, 1.5vw, 20px) 0; border-top: 1px solid var(--linea-o); }
.fila .cod { font-family: var(--mono); font-size: .64rem; font-weight: 600; letter-spacing: .06em; padding: 4px 0; text-align: center; border: 1px solid var(--linea-o); border-radius: 3px; color: var(--texto-o); }
.fila .org b { display: block; font-weight: 500; font-size: 1.05rem; line-height: 1.2; }
.fila .org small { font-family: var(--mono); font-size: .64rem; letter-spacing: .06em; color: var(--texto-o); text-transform: uppercase; }
.fila .val { font-family: var(--serif); font-weight: 300; font-size: clamp(1.7rem, 2.7vw, 2.7rem); letter-spacing: -.03em; line-height: 1; text-align: right; font-variant-numeric: tabular-nums; }
.fila .var { font-family: var(--mono); font-size: .76rem; font-weight: 600; min-width: 5.4em; text-align: right; }
.fila.is-ref .cod { border-color: var(--oro); color: var(--oro-claro); }
.fila--ec { border-top: 0; margin: 0 calc(clamp(18px, 2.2vw, 34px) * -1 + 8px) 6px; padding-inline: calc(clamp(18px, 2.2vw, 34px) - 8px); border-radius: 4px; background: linear-gradient(90deg, rgba(184, 154, 84, .2), rgba(184, 154, 84, .05)); box-shadow: inset 2px 0 0 var(--oro); }
.fila--ec + .fila { border-top: 0; }
.fila--ec .cod { background: var(--oro); border-color: var(--oro); color: var(--tinta); }
.fila--ec .org small { color: var(--oro-claro); }
.fila__cotizar { grid-column: 3 / -1; justify-self: end; display: inline-flex; align-items: center; gap: .6em; padding: .8em 1.25em; border-radius: 999px; background: var(--oro); color: var(--tinta); font-weight: 600; font-size: .88rem; line-height: 1; white-space: nowrap; transition: background .35s, transform .35s var(--suave); }
.fila__cotizar svg { width: 1.1em; height: 1.1em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--suave); }
.fila__cotizar:hover { background: var(--hueso); } .fila__cotizar:hover svg { transform: translateX(4px); }
.fila.is-ref .org small::after { content: " · " attr(data-ref); color: var(--oro-claro); }
.tablero__nota { margin-top: 18px; font-size: .78rem; line-height: 1.5; color: rgba(239, 233, 220, .5); max-width: 62ch; }
.tablero__nota a { text-decoration: underline; text-underline-offset: 3px; }
.noticias h3 { padding-bottom: 14px; }
.noticias__lista li { border-top: 1px solid var(--linea-o); }
.noticias__lista li:last-child { border-bottom: 1px solid var(--linea-o); }
.noticias__lista a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 18px; padding: clamp(14px, 1.6vw, 22px) 0; align-items: start; transition: padding .5s var(--suave); }
.noticias__lista .meta { grid-column: 1 / -1; font-family: var(--mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: var(--azul-claro); }
.noticias__lista .meta time { color: var(--texto-o); }
.noticias__lista h4 { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(1.1rem, 1.45vw, 1.42rem); line-height: 1.24; letter-spacing: -.01em; text-wrap: pretty; }
.noticias__lista svg { width: 20px; height: 20px; margin-top: 4px; fill: none; stroke: var(--oro-claro); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .5s var(--suave); }
.noticias__lista a:hover { padding-left: 12px; }
.noticias__lista a:hover svg { transform: translate(4px, -4px); }
.noticias__vacio { padding: 22px 0; color: var(--texto-o); border-block: 1px solid var(--linea-o); }
.esqueleto { height: 1.1em; border-radius: 4px; background: linear-gradient(90deg, var(--tinta-3), #2b2f22, var(--tinta-3)); background-size: 200% 100%; animation: brillo 1.4s linear infinite; }
@keyframes brillo { to { background-position: -200% 0; } }

/* contacto */
.contacto { background: var(--hueso); color: var(--tinta); }
.contacto__banda { position: relative; overflow: hidden; isolation: isolate; color: var(--hueso); padding-block: clamp(90px, 13vw, 210px) clamp(50px, 7vw, 110px); background: var(--tinta); }
.contacto__banda > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 126%; object-fit: cover; }
.contacto__banda::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--tinta) 0%, rgba(12, 13, 10, .5) 45%, rgba(12, 13, 10, .86) 100%); }
.contacto__banda .etiqueta { margin-bottom: clamp(20px, 3vw, 40px); }
.contacto__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(36px, 7vw, 130px); padding-block: clamp(56px, 8vw, 130px); }
.contacto__datos { display: grid; gap: clamp(24px, 3vw, 42px); align-content: start; }
.contacto__datos h3 { color: var(--oro-hondo); margin-bottom: 10px; }
.contacto__datos p { font-size: 1.08rem; line-height: 1.55; }
.reloj b { font-family: var(--serif); font-weight: 300; font-size: 2.6rem; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1; }
.reloj small { color: var(--texto-c); margin-left: 8px; }
.btn--wa svg { width: 1.3em; height: 1.3em; }
.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px clamp(18px, 2.4vw, 40px); align-content: start; }
.campo { position: relative; padding-top: 22px; }
.campo--ancho, .form__pie { grid-column: 1 / -1; }
.campo input, .campo textarea { width: 100%; font: inherit; font-size: 1.12rem; color: var(--tinta); background: transparent; border: 0; border-bottom: 1px solid var(--tinta); border-radius: 0; padding: 14px 0 14px; outline: none; resize: vertical; transition: border-color .3s; }
.campo textarea { min-height: 120px; }
.campo label { position: absolute; left: 0; top: 36px; color: var(--texto-c); pointer-events: none; transform-origin: left top; transition: transform .4s var(--suave), color .3s; }
.campo input:focus + label, .campo input:not(:placeholder-shown) + label, .campo textarea:focus + label, .campo textarea:not(:placeholder-shown) + label { transform: translateY(-30px) scale(.74); color: var(--oro-hondo); }
.campo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--oro-hondo); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--suave); }
.campo:focus-within::after { transform: scaleX(1); }
.campo.is-error input, .campo.is-error textarea { border-color: #b8402b; }
.campo--trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__pie { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 26px; }
.form__estado { font-size: .88rem; color: var(--texto-c); }
.form__estado.is-ok { color: #2f7a1f; font-weight: 600; } .form__estado.is-error { color: #b8402b; font-weight: 600; }
.form__estado a { text-decoration: underline; text-underline-offset: 3px; }

/* pie */
.pie { background: var(--tinta); color: var(--hueso); padding-top: clamp(56px, 7vw, 110px); overflow: hidden; }
.pie__arriba { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; flex-wrap: wrap; }
.pie__frase { font-family: var(--serif); font-weight: 300; font-size: clamp(1.5rem, 2.6vw, 2.6rem); line-height: 1.1; letter-spacing: -.02em; max-width: 16ch; }
.pie__nav { display: grid; grid-template-columns: repeat(2, auto); gap: 10px clamp(30px, 5vw, 90px); }
.pie__nav a { opacity: .75; transition: opacity .3s, color .3s; }
.pie__nav a:hover { opacity: 1; color: var(--oro-claro); }
.pie__marca { display: flex; justify-content: center; font-family: var(--serif); font-weight: 300; font-size: clamp(6rem, 31vw, 34rem); line-height: .74; letter-spacing: -.055em; color: var(--oro); margin-top: clamp(30px, 5vw, 70px); padding-bottom: .1em; overflow: hidden; font-variation-settings: 'opsz' 144, 'SOFT' 100; user-select: none; }
.pie__marca span { display: inline-block; will-change: transform; }
.pie__abajo { display: flex; justify-content: space-between; gap: 12px 30px; flex-wrap: wrap; padding-block: 22px; border-top: 1px solid var(--linea-o); color: var(--texto-o); }
.pie__abajo a:hover { color: var(--oro-claro); }
.pie__credito { color: var(--hueso); border-bottom: 1px solid var(--oro); padding-bottom: 2px; transition: color .3s; }

/* leyenda del perfil y textos alternos: solo en móvil */
.perfil__leyenda, .solo-movil { display: none; }

/* ---------- adaptable ---------- */
@media (max-width: 1100px) {
  .nav__links, .nav .btn--chico { display: none; }
  .nav__menu { display: block; }
  .pro__grid { grid-template-columns: 1fr; }
  .pro__visual { position: static; }
  .disco { width: min(78vw, 460px); }
  .mer__grid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  :root { --nav-h: 66px; }
  .nos__grid, .origen__pie, .contacto__grid, .prp__grid { grid-template-columns: 1fr; }
  .prp__grid .marco--arco { max-width: 360px; order: -1; }
  .cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .cifras li:nth-child(3) { padding-left: 0; border-left: 0; }
  .cifras li:nth-child(n + 3) { border-top: 1px solid var(--linea-c); }
  .ficha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ficha > div:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .ficha > div:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--linea-c); }
  .valores li { grid-template-columns: 2.4rem 1fr; }
  .valores li p { grid-column: 2; }
  .hero__sello { width: 86px; top: calc(var(--nav-h) + 14px); opacity: .85; }
  .hero__titulo .linea:nth-child(2) { padding-left: 0; }
  .franja__rotulo small { display: none; }
  .franja__rotulo b { font-size: .95rem; }
  /* proceso: introducción fija y tarjetas que se deslizan con el dedo */
  .proceso__pista { display: grid; grid-template-columns: repeat(6, 74vw); grid-template-rows: auto auto; gap: 34px 16px; width: auto; min-height: 0; align-items: start; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: var(--borde); padding-block: var(--seccion) 64px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .proceso__pista::-webkit-scrollbar { display: none; }
  .proceso__intro { grid-column: 1 / -1; grid-row: 1; position: sticky; left: var(--borde); width: calc(100vw - var(--borde) * 2); padding-right: 0; }
  .paso { grid-row: 2; width: auto; scroll-snap-align: start; } .paso:nth-of-type(even) { margin-top: 0; }
  .solo-esc { display: none; } .solo-movil { display: inline; }
  /* perfil: el dibujo entra completo y los rótulos pasan a una leyenda */
  .perfil { overflow: visible; }
  .perfil__lienzo { min-width: 0; padding: 16px 12px 4px; }
  .perfil__t { display: none; }
  .perfil__linea { stroke-width: 7; } .perfil__linea--andes { stroke-width: 5; }
  .perfil__guia, .perfil__cota line, .perfil__marca line { stroke-width: 2.5; }
  .perfil__ola { stroke-width: 5; }
  .perfil__marca circle { r: 14px; stroke-width: 4; } .perfil__marca .pulso { r: 18px; stroke-width: 3; }
  .perfil__leyenda { display: grid; gap: 10px; padding: 14px 16px 18px; border-top: 1px solid var(--linea-o); color: var(--texto-o); font-size: .66rem; line-height: 1.5; }
  .perfil__leyenda li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; }
  .perfil__leyenda b { color: var(--oro-claro); font-weight: 600; }
  .perfil__leyenda i { height: 12px; margin-top: 2px; }
  .l-punto { width: 12px; border-radius: 50%; background: var(--oro-claro); justify-self: center; }
  .l-cota { border-inline: 1.5px solid var(--hueso); background: linear-gradient(var(--hueso), var(--hueso)) center / 100% 1.5px no-repeat; }
  .l-guia { background: repeating-linear-gradient(90deg, var(--texto-o) 0 3px, transparent 3px 7px) center / 100% 1.5px no-repeat; }
  .proceso__barra { display: none; }
  .fila { grid-template-columns: 2.4rem minmax(0, 1fr) auto; }
  .fila .var { grid-column: 3; text-align: right; }
  .fila .val { grid-column: 3; }
  .fila .cod { grid-row: span 2; align-self: start; margin-top: 4px; }
  .fila .org { grid-row: span 2; }
  .fila__cotizar { grid-column: 3; grid-row: span 2; align-self: center; }
}
@media (max-width: 560px) {
  .form { grid-template-columns: 1fr; }
  .hero__cta { gap: 18px; }
  .idioma button { padding: 6px 8px; }
  .pie__nav { gap: 8px 30px; }
}

/* ---------- accesibilidad: sin movimiento ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; }
  body::after { animation: none; }
  .preloader { display: none; }
  .franja__cinta.is-lista { animation: none !important; }
  .franja__pista { overflow-x: auto; }
}