/* Tulum · home 2026 (index.html). Va DESPUÉS de tulum.css: solo lo propio de la home.
   Página en carbón; un solo capítulo en hueso (Portfolio, "de día"), como el perfil.
   Esquinas rectas, filetes de 1 px, oro como acento (oro vivo en una frase por sección). */

:root{--hm-gap:clamp(20px,2.4vw,40px);--hm-head:clamp(40px,5vw,72px)}
html.lb-open{overflow:hidden}
/* menú sobre carbón: el texto que sube por debajo no se cruza con los enlaces (sobre hueso manda tulum.css) */
.nav:not(.on-day){background:linear-gradient(180deg,rgba(19,18,17,.94) 0,rgba(19,18,17,.8) 56%,rgba(19,18,17,0))}
main{display:block}

/* ---------- HERO: la aguja y el hilo arriba, el texto abajo (la foto primero, el texto después) ---------- */
.hm-hero{position:relative;min-height:max(100svh,640px);overflow:hidden;background:var(--carbon);isolation:isolate}
.hm-poster,.hm-video{position:absolute;left:0;top:-12%;width:100%;height:120%;object-fit:cover;object-position:50% 0}   /* el hilo sube sobre el texto y la franja blanca del piso queda casi fuera */
.hm-video{opacity:0;transition:opacity 1.4s var(--ease)}
.hm-video.on{opacity:1}
.hm-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  linear-gradient(0deg,rgba(19,18,17,.94) 0,rgba(19,18,17,.72) 30%,rgba(19,18,17,0) 58%),
  linear-gradient(90deg,rgba(19,18,17,.55) 0,rgba(19,18,17,0) 55%),
  linear-gradient(180deg,rgba(19,18,17,.45) 0,rgba(19,18,17,0) 16%)}
.hm-hero-in{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--g) clamp(72px,11vh,120px)}
.hm-h1{font-weight:400;max-width:980px}
.hm-h1 .k{display:block;font:500 11px/16px var(--text);letter-spacing:.28em;text-transform:uppercase;color:#CFC8BC;margin-bottom:clamp(14px,2vh,22px)}
.hm-h1 .t{display:block;font-family:var(--display);font-size:clamp(36px,min(5.4vw,7.6vh),88px);line-height:1.04;letter-spacing:-.016em;color:var(--bone);text-wrap:balance;max-width:15ch}
.hm-h1 .t em{font-family:var(--italic);font-variation-settings:"opsz" 96}
.hm-h1 .s{display:block;margin-top:clamp(16px,2.4vh,26px);font:300 clamp(16px,1.3vw,19px)/1.6 var(--text);color:#CFC8BC;max-width:46ch}
.hm-act{display:flex;align-items:center;flex-wrap:wrap;gap:14px clamp(24px,3vw,44px);margin-top:clamp(22px,3.4vh,36px)}
.hm-act .cta{margin-top:0}
.hm-moq{font:500 11px/1 var(--text);letter-spacing:.24em;text-transform:uppercase;color:var(--bone);padding:12px 16px;border:1px solid rgba(242,239,233,.28)}
.hm-scroll{position:absolute;z-index:2;right:var(--g);bottom:clamp(28px,4.4vh,44px);display:flex;align-items:center;gap:14px;font:500 10px/1 var(--text);letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
.hm-scroll .dash{width:40px;height:1px;background:currentColor;transform-origin:left}
/* entrada: el titular ya está (es el LCP); el resto llega detrás, corto y sin rebote */
@media (prefers-reduced-motion:no-preference){
  .hm-h1 .k,.hm-h1 .s,.hm-act,.hm-scroll{animation:hm-in 1s var(--ease) both}
  .hm-h1 .s{animation-delay:.15s}.hm-act{animation-delay:.3s}.hm-scroll{animation-delay:.9s}
  .hm-scroll .dash{animation:hm-dash 2.8s cubic-bezier(.65,0,.35,1) 1.6s infinite}
}
@keyframes hm-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes hm-dash{0%{transform:scaleX(0)}45%{transform:scaleX(1);transform-origin:left}55%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
@media(max-width:760px){
  .hm-poster,.hm-video{top:-15%;height:120%}
  .hm-hero-in{padding-bottom:88px}
  .hm-scroll{left:var(--g);right:auto;bottom:32px}
}

/* ---------- cabecera de sección apilada (rótulo, titular, bajada) ---------- */
.hm-head{max-width:880px}
.hm-head .h2{margin-top:22px}
.hm-head .body{margin-top:26px;max-width:52ch}

/* ---------- I. Historia ---------- */
.hm-about-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(40px,7vw,120px);align-items:center}
.hm-about-ph{aspect-ratio:4/5}
.hm-about-txt .h2{margin:22px 0 36px}
/* Polvo dorado (home.js goldDust): el anillo duro del Midas se oculta y el pan de oro baja para que la foto se vea */
.hm-about-ph.dust .glint{display:none}
.hm-about-ph.dust .gild{opacity:.45}
.dust-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;mix-blend-mode:screen}
.hm-about-txt .body{max-width:52ch}
.hm-about-txt .body+.body{margin-top:18px}
@media(max-width:900px){.hm-about-grid{grid-template-columns:1fr}.hm-about-ph{aspect-ratio:4/3}}

/* ---------- Fundador: el video manda ---------- */
.hm-founder{padding-top:0}
.hm-founder-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,3vw,44px);border-top:1px solid var(--line);padding-top:clamp(28px,3vw,40px)}
.hm-founder-head .h2{font-size:clamp(34px,4vw,60px)}
.hm-founder-video{position:relative;background:var(--raised);aspect-ratio:16/9}
.hm-founder-video video{width:100%;height:100%;object-fit:cover;background:var(--raised)}

/* ---------- Capacidades: cinco oficios en una rejilla de filetes (3 + 2) ---------- */
.hm-caps{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:var(--hm-head);counter-reset:cap}
.hm-capc{grid-column:span 2;position:relative;overflow:hidden;background:var(--carbon);padding:clamp(28px,3vw,44px) clamp(24px,2.6vw,40px) clamp(32px,3.4vw,48px)}
.hm-capc:nth-child(n+4){grid-column:span 3}
.hm-capc::before{counter-increment:cap;content:counter(cap,lower-roman);display:block;font:italic 400 28px/1 var(--italic);color:var(--gold-text);margin-bottom:clamp(28px,4vw,56px)}
.hm-capc::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .6s var(--ease);
  background:radial-gradient(420px circle at var(--sx,50%) var(--sy,50%),rgba(201,160,78,.11),rgba(201,160,78,0) 62%)}
.hm-capc:hover::after{opacity:1}
.hm-capc h3{font:400 clamp(22px,1.9vw,28px)/1.2 var(--display);color:var(--bone);font-variation-settings:"opsz" 72}
.hm-capc p{margin-top:14px;font-size:15px;line-height:1.65;color:#CFC8BC;max-width:40ch}
@media(max-width:900px){.hm-caps{grid-template-columns:1fr 1fr}.hm-capc,.hm-capc:nth-child(n+4){grid-column:span 1}.hm-capc:last-child{grid-column:1/-1}}
@media(max-width:560px){.hm-caps{grid-template-columns:1fr}.hm-capc:last-child{grid-column:auto}}

/* mosaico de planta: una alta + cuatro (se abre en el visor) */
.hm-mosaic{display:grid;grid-template-columns:1.6fr 1fr 1fr;grid-auto-rows:clamp(180px,20vw,300px);gap:clamp(10px,1.2vw,18px);margin-top:clamp(56px,7vw,104px)}
.hm-mos{display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;cursor:zoom-in;color:inherit;font:inherit}
.hm-mos.tall{grid-row:span 2}
.hm-mos img{height:100%;transition:transform 1.2s var(--ease)}
.hm-mos:hover img{transform:scale(1.035)}
@media(max-width:760px){.hm-mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(150px,42vw,240px)}.hm-mos.tall{grid-column:1/-1;grid-row:auto}}

.hm-capacity{margin-top:clamp(64px,8vw,120px);display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,5vw,80px);align-items:end}
.hm-capacity .statement{max-width:18ch}
.hm-capacity .body{max-width:48ch}
@media(max-width:900px){.hm-capacity{grid-template-columns:1fr}}

/* ---------- Por qué Colombia: ocho cifras en odómetro + la comparación ---------- */
.hm-why{background:var(--raised)}
.hm-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:0 var(--hm-gap);margin-top:var(--hm-head)}
.hm-fig{border-top:1px solid var(--line);padding:28px 0 44px}
.hm-fig .num{font-family:var(--display);font-size:clamp(44px,4.4vw,68px);line-height:1;color:var(--bone);font-variation-settings:"opsz" 96;font-feature-settings:"lnum","tnum"}
.hm-fig h3{margin-top:18px;font:500 12px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--bone)}
.hm-fig p{margin-top:12px;font-size:14px;line-height:1.65;color:var(--muted);max-width:34ch}
@media(max-width:1100px){.hm-figs{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.hm-figs{grid-template-columns:1fr}.hm-fig{padding-bottom:32px}}

.hm-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;margin-top:clamp(48px,6vw,88px);border:1px solid var(--line)}
.hm-vs-col{padding:clamp(28px,3.4vw,52px)}
.hm-vs-col.colombia{background:var(--carbon);position:relative}
.hm-vs-col h3{font:400 clamp(26px,2.4vw,38px)/1.1 var(--display);color:var(--bone)}
.hm-vs-col.asia h3{color:var(--muted)}
.hm-badge{position:absolute;top:clamp(28px,3.4vw,52px);right:clamp(28px,3.4vw,52px);font:500 10px/1 var(--text);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-text)}
.hm-vs-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(24px,3vw,40px)}
.hm-vs-i .val{font:400 clamp(28px,2.8vw,44px)/1 var(--display);font-feature-settings:"lnum","tnum";color:var(--bone);white-space:nowrap}
.hm-vs-col.asia .val{color:var(--muted)}
.hm-vs-i .lbl{margin-top:10px;font:500 10px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.hm-vs-mid{display:grid;place-items:center;padding:0 clamp(12px,2vw,28px);border-left:1px solid var(--line);border-right:1px solid var(--line);font:italic 400 clamp(24px,2.4vw,36px)/1 var(--italic);color:var(--muted)}
@media(max-width:900px){
  .hm-vs{grid-template-columns:1fr}
  .hm-vs-mid{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
}
@media(max-width:420px){.hm-vs-row{grid-template-columns:1fr 1fr}}

/* ---------- Interludio: Los Ángeles → Medellín, un hilo que se tiende ---------- */
.hm-inter{text-align:center}
.hm-inter .wrap{max-width:1100px}
.hm-inter-h{margin-top:28px;font-family:var(--display);font-weight:400;font-size:clamp(40px,6.6vw,104px);line-height:1.04;letter-spacing:-.018em;font-variation-settings:"opsz" 96;text-wrap:balance}
.hm-inter-h .line{display:block}
.hm-inter-h em{font-family:var(--italic);color:#E9DFC9}
.hm-inter-sub{margin:32px auto 0;max-width:60ch;color:#CFC8BC;font-size:16px;line-height:1.7}
.hm-arc{margin:clamp(40px,6vw,80px) auto 0;max-width:920px}
.hm-arc svg{width:100%;height:auto;overflow:visible}
.hm-arc .arc-base{fill:none;stroke:#5A544C;stroke-width:1;stroke-dasharray:2 7}
.hm-arc .arc-gold{fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round}
.hm-arc .node{fill:var(--bone)}
.hm-arc .city{font:400 17px var(--display);fill:var(--bone)}
.hm-arc .city-sub{font:500 10px var(--text);letter-spacing:.2em;fill:var(--muted)}
.hm-arc .needle path{fill:var(--gold)}
.hm-arc .needle .eye{fill:var(--carbon)}
.hm-inter-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--line)}
.hm-stat{padding:28px 12px 0}
.hm-stat+.hm-stat{border-left:1px solid var(--line)}
.hm-stat .num{font:400 clamp(40px,4.4vw,68px)/1 var(--display);color:var(--bone);font-variation-settings:"opsz" 96}
.hm-stat .unit{font-size:.5em;margin-left:.06em;color:#CFC8BC}
.hm-stat .lbl{margin-top:12px;font:500 10px/1.5 var(--text);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hm-inter-cta{display:flex;flex-direction:column;align-items:center;gap:18px;margin-top:clamp(48px,6vw,80px)}
.hm-inter-cta .cta{margin-top:0}
.hm-meta{font-size:13px;color:var(--muted)}
@media(max-width:760px){.hm-arc svg{overflow:visible}.hm-arc .city{font-size:30px}.hm-arc .city-sub{font-size:18px;transform:translateY(16px)}.hm-arc .node{r:7px}}
@media(max-width:760px){.hm-inter-stats{grid-template-columns:1fr 1fr}.hm-stat:nth-child(3){border-left:0}.hm-stat:nth-child(n+3){border-top:1px solid var(--line);margin-top:28px}}

/* ---------- Impacto (pantalla partida del perfil) ---------- */
.hm-impact .txt .h2{margin:24px 0 32px}
.hm-impact .body{max-width:44ch}
.hm-istats{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0 clamp(28px,4vw,56px);margin-top:48px;border-top:1px solid var(--line);padding-top:28px}
.hm-istat .stat-number{font:400 clamp(34px,3.4vw,52px)/1 var(--display);color:var(--bone)}
.hm-istat .stat-label{margin-top:10px;font:500 10px/1.5 var(--text);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);max-width:16ch}
@media(max-width:480px){.hm-istats{grid-template-columns:1fr 1fr;gap:24px}}

/* ---------- Cinta de categorías (la única de la página) ---------- */
.hm-marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(28px,4vw,52px) 0}
.hm-mq-track{display:flex;width:max-content;will-change:transform}
.marquee-item{font:italic 400 clamp(34px,5vw,76px)/1.1 var(--italic);font-variation-settings:"opsz" 96;color:var(--bone);white-space:nowrap;padding:0 .42em}
.marquee-item.sep{font-family:var(--text);font-style:normal;color:var(--muted);font-size:clamp(18px,2vw,28px);align-self:center}

/* ---------- Portfolio: capítulo "de día" (hueso) ---------- */
.hm-port .h2 em{padding-right:.04em}
.hm-cards{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(28px,3vw,44px) clamp(14px,1.6vw,24px);margin-top:var(--hm-head)}
.hm-card{grid-column:span 3;display:flex;flex-direction:column;text-decoration:none;color:var(--carbon)}
.hm-card:first-child{grid-column:span 6;grid-row:span 2}
.hm-card .ph{display:block;aspect-ratio:4/5}
.hm-card:first-child .ph{flex:1;aspect-ratio:auto;min-height:320px}
.hm-card .ph img{position:absolute;inset:0;transition:transform 1.4s var(--ease)}
.hm-card:hover .ph img{transform:scale(1.04)}
.hm-card-t{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid transparent}
.product-card-name{display:block;font:400 clamp(20px,1.6vw,24px)/1.2 var(--display);transition:color .4s}
.product-card-detail{display:block;font:500 10px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);text-align:right}
.hm-card:hover .product-card-name,.hm-card:focus-visible .product-card-name{color:var(--gold-text-lt)}
@media(max-width:900px){.hm-cards{grid-template-columns:1fr 1fr}.hm-card{grid-column:span 1}.hm-card:first-child{grid-column:1/-1;grid-row:auto}.hm-card:first-child .ph{flex:none;aspect-ratio:4/5;min-height:0}}
@media(max-width:480px){.hm-card-t{flex-direction:column;gap:4px}.product-card-detail{text-align:left}}

/* ---------- En cifras: cuatro números grandes, oro en odómetro ---------- */
.hm-nums-lede{margin-top:40px;max-width:26ch;color:#CFC8BC}
.hm-nums .h2{margin-top:22px}
.hm-nums-row{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(56px,7vw,104px);border-top:1px solid var(--line)}
.hm-nums-row .fig{padding:32px clamp(12px,2vw,28px) 0 0}
.hm-nums-row .fig+.fig{border-left:1px solid var(--line);padding-left:clamp(16px,2vw,28px)}
.hm-nums-row .num{font-size:clamp(48px,6vw,104px);white-space:nowrap}
.hm-nums-row .fig p{text-transform:uppercase;letter-spacing:.16em;font-size:11px;line-height:1.6}
@media(max-width:900px){.hm-nums-row{grid-template-columns:1fr 1fr}.hm-nums-row .fig:nth-child(3){border-left:0;padding-left:0}.hm-nums-row .fig:nth-child(n+3){border-top:1px solid var(--line);margin-top:32px}}

/* ---------- Contacto y formulario ---------- */
.hm-contact{border-top:1px solid var(--line)}
.hm-contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(48px,7vw,120px);align-items:start}
.hm-contact-info{position:sticky;top:112px}
.hm-contact-info .h2{margin:22px 0 28px}
.hm-contact-info .body{max-width:42ch}
.hm-details{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px;margin-top:48px;border-top:1px solid var(--line);padding-top:28px}
.hm-details dt{font-size:10px;letter-spacing:.24em}
.hm-details dd{margin-top:8px;font-size:15px;line-height:1.55;color:var(--bone);overflow-wrap:anywhere}
.hm-details dd a{text-decoration:none;border-bottom:1px solid var(--line);transition:border-color .3s,color .3s}
.hm-details dd a:hover{color:var(--gold-text);border-bottom-color:var(--gold-text)}
.hm-details .small-detail{font-size:14px;color:#CFC8BC}
.hm-details .contact-detail-item:last-child{grid-column:1/-1}
@media(max-width:900px){.hm-contact-grid{grid-template-columns:1fr}.hm-contact-info{position:static}}

.hm-form{background:var(--raised);border:1px solid var(--line);padding:clamp(28px,4vw,56px)}
.hm-form h3{font:400 clamp(26px,2.4vw,36px)/1.15 var(--display);color:var(--bone)}
.hm-form .form-subtitle{margin:10px 0 36px;font-size:15px;color:var(--muted)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.form-group{margin-bottom:28px}
.form-label{display:block;margin-bottom:10px;font:500 11px/1.5 var(--text);letter-spacing:.18em;text-transform:uppercase;color:#CFC8BC}
.form-label .opt{letter-spacing:.06em;text-transform:none;color:var(--muted);font-weight:400}
.form-input,.form-select{display:block;width:100%;background:transparent;border:0;border-bottom:1px solid #4A4540;border-radius:0;padding:12px 0 13px;color:var(--bone);font:300 16px/1.3 var(--text);transition:border-color .3s}
.form-select{-webkit-appearance:none;appearance:none;padding-right:28px;cursor:pointer;
  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='%23A8A195' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 4px center}
.form-select option{background:var(--carbon);color:var(--bone)}
.form-input::placeholder{color:#8C857A;opacity:1}
.form-input:hover,.form-select:hover{border-bottom-color:var(--muted)}
.form-input:focus,.form-select:focus{outline:none;border-bottom-color:var(--gold-text)}
.form-input:focus-visible,.form-select:focus-visible{outline:2px solid var(--gold-text);outline-offset:4px}
.form-input:user-invalid,.form-select:user-invalid{border-bottom-color:#E08A7A}
.form-submit{display:block;width:100%;margin-top:32px;padding:19px 20px;background:var(--gold);color:var(--carbon);border:0;border-radius:0;cursor:pointer;font:500 12px/1.3 var(--text);letter-spacing:.24em;text-transform:uppercase;transition:background .3s,transform .15s}
.form-submit:hover{background:#D8B465}
.form-submit:active{transform:translateY(1px)}
.form-submit:focus-visible{outline:2px solid var(--bone);outline-offset:3px}
.form-submit:disabled{cursor:progress;opacity:.8}
.form-submit.is-ok{background:#2d6a4f;color:var(--bone)}
.form-submit.is-err{background:#c0392b;color:var(--bone)}
@media(max-width:600px){.form-row{grid-template-columns:1fr}}

/* aviso bajo el mínimo: bloque con filete completo (sin franja lateral) */
#moq-warning{margin:-4px 0 28px;padding:20px 22px;border:1px solid rgba(224,189,114,.42);background:rgba(201,160,78,.06);font-size:14px;line-height:1.65;color:#CFC8BC}
#moq-warning strong{color:var(--bone);font-weight:500}
#moq-warning #moq-warning-title,#moq-warning>strong:first-child{display:block;margin-bottom:8px;font:400 19px/1.3 var(--display)!important;color:var(--gold-text)!important}

/* antes de enviar: lista de precios con guías punteadas */
.invest{margin-top:8px;padding:28px 0 0;border-top:1px solid var(--line)}
.invest__eyebrow{font:500 11px/1 var(--text);letter-spacing:.28em;text-transform:uppercase;color:var(--gold-text);margin-bottom:20px}
.invest__row{display:flex;align-items:baseline;gap:12px;padding:9px 0}
.invest__k{order:1;flex:0 1 auto;font-size:14px;line-height:1.45;color:#CFC8BC}
.invest__row::after{content:"";order:2;flex:1 1 24px;min-width:16px;border-bottom:1px dotted #5A544C;transform:translateY(-4px)}
.invest__v{order:3}
.invest__k em{color:var(--muted)}
.invest__v{flex:none;font:400 22px/1 var(--display);color:var(--bone);font-feature-settings:"lnum","tnum";white-space:nowrap}
.invest__cur{font:500 10px/1 var(--text);letter-spacing:.12em;color:var(--muted);margin-right:3px;vertical-align:.45em}
.invest__unit{font:400 12px/1 var(--text);color:var(--muted);margin-left:6px}
.invest__note{margin-top:20px;font-size:13px;line-height:1.7;color:var(--muted)}
.invest__note strong,.invest__foot strong{color:#CFC8BC;font-weight:500}
.invest__example{margin-top:18px;padding:18px 20px;border:1px solid var(--line);font-size:14px;line-height:1.7;color:#CFC8BC}
.invest__example b{display:block;margin-bottom:6px;font:500 11px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--bone)}
.invest__example .sum{font-family:var(--display);font-size:1.25em;color:var(--bone)}
.invest__foot{margin-top:18px;font-size:13px;line-height:1.7;color:var(--muted)}
.invest a{color:var(--gold-text);text-underline-offset:3px}
@media(max-width:480px){.invest__row{flex-wrap:wrap;gap:4px 12px}.invest__row::after{display:none}.invest__k{flex-basis:100%}}

/* lecturas: guía y página en español */
.hm-further{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 40px;padding:28px var(--g);border-top:1px solid var(--line);font-size:14px;line-height:1.5}
.hm-further a{color:#CFC8BC;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:3px;transition:color .3s,border-color .3s}
.hm-further a:hover{color:var(--gold-text);border-bottom-color:var(--gold-text)}

/* ---------- Visor de fotos ---------- */
.lightbox{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:rgba(19,18,17,.96);opacity:0;transition:opacity .26s var(--ease)}
.lightbox[hidden]{display:none}
.lightbox.active{opacity:1}
.lightbox img{max-width:min(88vw,1400px);max-height:82vh;width:auto;height:auto;object-fit:contain;transition:opacity .14s}
.lightbox button{position:absolute;display:grid;place-items:center;width:52px;height:52px;padding:0;border:1px solid rgba(242,239,233,.24);border-radius:0;background:rgba(19,18,17,.5);color:var(--bone);cursor:pointer;transition:border-color .3s,background .3s}
.lightbox button:hover{border-color:var(--gold-text);background:rgba(19,18,17,.8)}
.lightbox button:focus-visible{outline:2px solid var(--gold-text);outline-offset:3px}
.lightbox-close{top:20px;right:20px;font:200 30px/1 var(--text)}
.lightbox-arrow{top:50%;margin-top:-26px}
.lightbox-arrow--prev{left:20px}.lightbox-arrow--next{right:20px}
.lightbox-arrow::before{content:"";width:12px;height:12px;border-left:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateX(3px) rotate(45deg)}
.lightbox-arrow--next::before{transform:translateX(-3px) rotate(-135deg)}
.lightbox-counter{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font:500 11px/1 var(--text);letter-spacing:.24em;color:var(--muted)}
@media(max-width:600px){.lightbox-arrow{top:auto;bottom:12px;margin:0}.lightbox-counter{bottom:30px}}

/* ---------- Movimiento reducido: quieto y legible ---------- */
@media (prefers-reduced-motion:reduce){
  .hm-video{display:none}
  .hm-mos img,.hm-card .ph img,.lightbox,.lightbox img{transition:none}
  .hm-mos:hover img,.hm-card:hover .ph img{transform:none}
  .hm-capc::after{display:none}
}

/* Palabras clave: el mismo oro vivo + cursiva Bodoni de los titulares (Jose 29-sep). Una frase corta por párrafo (contención, Bottega). */
.hm-about-txt .body .gw,.hm-head .body .gw,.hm-impact .body .gw,.hm-contact .body .gw,.body .gw{font-family:var(--italic);font-style:italic;font-size:1.12em;line-height:1;display:inline-block;font-variation-settings:"opsz" 96;letter-spacing:.005em}
/* Tipografía editorial de "Our Story" (Jose 29-sep: "esta letra puede ser más premium"): primer párrafo en serif grande, cuerpo con más peso y contraste */
.hm-about-txt .body{font-weight:340;font-size:clamp(16px,1.12vw,18px);line-height:1.85;letter-spacing:.012em;color:#DAD4C8;max-width:54ch}
.hm-about-txt h2+.body{font-family:var(--display);font-weight:400;font-size:clamp(21px,1.85vw,28px);line-height:1.42;letter-spacing:-.003em;color:var(--bone);max-width:36ch;margin-bottom:34px;text-wrap:pretty}
.hm-about-txt h2+.body::after{content:"";display:block;width:44px;height:1px;background:var(--gold);margin-top:30px}
.hm-about-txt .body+.body{margin-top:22px}

/* Banda a todo el ancho: macro de la aguja con hilo de oro (foto aprobada por Jose 29-sep). Sin recorte en escritorio; el polvo dorado corre encima */
.hm-band{padding:0 var(--g,24px) clamp(56px,8vw,120px)}
.hm-band-ph{position:relative;max-width:1528px;margin:0 auto;aspect-ratio:1700/699;overflow:hidden;background:var(--raised)}
.hm-band-ph img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:900px){.hm-band-ph{aspect-ratio:4/3}.hm-band-ph img{object-position:58% 50%}}

/* Video del fundador (Jose, 29-sep): póster = primer fotograma real del video (antes una panorámica borrosa de la planta); mismo filtro en póster y video
   para que no haya salto de color al dar play; escala de grises nítida (el fondo de ladrillo terracota y las máquinas turquesa eran de la paleta vieja). */
/* (el blanco y negro va en el propio archivo de video: un filtro CSS también apagaba el dorado de los subtítulos) */
/* Subtítulos en oro, serif de marca; sombra oscura para leerse sobre cualquier fotograma */
.hm-founder-video video::cue{
  color:#E4BE6A;background:rgba(19,18,17,0);
  font-family:"Libre Caslon Display","Bodoni Moda",Georgia,serif;font-weight:400;font-size:1.55rem;line-height:1.3;letter-spacing:.012em;
  text-shadow:0 0 14px rgba(19,18,17,.95),0 1px 3px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.9)}
.hm-founder-video video::cue(i){font-family:"Bodoni Moda","Libre Caslon Display",Georgia,serif;font-style:italic}

/* 29-sep-2026 · "La costura de la cadena" (home, tras Capacidades). Sin fotos: un hilo de oro en puntadas cose 6 estaciones
   mientras se baja (--p lo pone home.js con ScrollTrigger) y remata en el monograma, que brilla al final (.done). */
.hm-seam{--p:0;margin-top:clamp(80px,10vw,150px)}
.hm-seam-head{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,5vw,80px);align-items:end}
.hm-seam-head .statement{max-width:18ch}
.hm-seam-head .body{max-width:48ch;color:#BDB6AA}
.hm-seam-track{position:relative;margin-top:clamp(48px,5vw,80px);padding-right:64px}
.seam-guide,.seam-thread{position:absolute;left:0;top:29px;height:2px}
.seam-guide{right:64px;background:repeating-linear-gradient(90deg,rgba(242,239,233,.14) 0 14px,transparent 14px 22px)}
.seam-thread{width:calc((100% - 64px) * var(--p));background:repeating-linear-gradient(90deg,#E0BD72 0 14px,transparent 14px 22px);filter:drop-shadow(0 0 5px rgba(224,189,114,.45))}
.seam-needle{position:absolute;top:25px;left:calc((100% - 64px) * var(--p) - 6px);width:88px;height:10px;opacity:calc(min(var(--p) * 25, 1) * min((1 - var(--p)) * 25, 1));pointer-events:none}
.seam-mono{position:absolute;right:8px;top:-2px;width:40px;height:60px;opacity:.55;transition:opacity .8s,filter .8s}
.hm-seam.done .seam-mono{opacity:1;filter:drop-shadow(0 0 16px rgba(224,189,114,.6))}
.seam-st{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(12px,2vw,32px)}
.seam-st li{position:relative;padding-top:64px;opacity:.2;transform:translateY(12px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.seam-st li.on{opacity:1;transform:none}
.seam-st li::before{content:"";position:absolute;left:0;top:24px;width:10px;height:10px;border:1px solid rgba(242,239,233,.35);border-radius:50%;background:var(--carbon);transition:background .5s,border-color .5s,box-shadow .5s}
.seam-st li.on::before{background:#E0BD72;border-color:#E0BD72;box-shadow:0 0 10px rgba(224,189,114,.6)}
.seam-st .n{font:500 11px/16px var(--text);letter-spacing:.28em;color:var(--gold-text)}
.seam-st h3{font-family:var(--display);font-weight:400;font-size:clamp(28px,2.9vw,46px);line-height:1.05;margin:10px 0 12px;color:var(--bone)}
.seam-st p{font:300 14px/1.55 var(--text);color:#A8A195;margin:0;max-width:22ch}
@media(max-width:900px){.hm-seam-head{grid-template-columns:1fr}}
@media(max-width:760px){
  .hm-seam-track{padding:0 0 90px 44px}
  .seam-guide,.seam-thread{top:0;left:14px;width:2px}
  .seam-guide{right:auto;bottom:90px;height:auto;background:repeating-linear-gradient(180deg,rgba(242,239,233,.14) 0 14px,transparent 14px 22px)}
  .seam-thread{height:calc((100% - 90px) * var(--p));background:repeating-linear-gradient(180deg,#E0BD72 0 14px,transparent 14px 22px)}
  .seam-needle{left:10px;top:calc((100% - 90px) * var(--p) - 6px);transform:rotate(90deg);transform-origin:5px 5px}
  .seam-mono{right:auto;left:-5px;top:auto;bottom:10px}
  .seam-st{grid-template-columns:1fr;gap:36px}
  .seam-st li{padding-top:0}
  .seam-st li::before{left:-35px;top:6px}
  .seam-st p{max-width:34ch}
}
.seam-st .nw{white-space:nowrap}
.seam-thread::after{content:"";position:absolute;top:-4px;left:-140px;width:140px;height:10px;background:radial-gradient(closest-side,rgba(255,244,210,.95),rgba(224,189,114,0));opacity:0;pointer-events:none}
.hm-seam.done .seam-thread::after{animation:seamGlint 1.8s var(--ease) .15s 1 forwards}
@keyframes seamGlint{0%{left:-140px;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
@media(max-width:760px){.hm-seam.done .seam-thread::after{animation:none}}
@media(prefers-reduced-motion:reduce){.seam-st li{transition:none}.hm-seam.done .seam-thread::after{animation:none}}

/* design-review 30-sep FINDING-004: 4 px de scroll horizontal en escritorio (scrollWidth 1444 > 1440) en la home; overflow-x:clip en main lo contiene sin crear contenedor de scroll (sticky y pin siguen) */
main{overflow-x:clip}
