/* ============================================================
   SNG — Inner page styles (Labs, Research, About, Design, Tech, Contact)
   ============================================================ */

.display-mid{
  font-weight:700; letter-spacing:-0.03em; line-height:1.0;
  font-size:clamp(34px,4.6vw,68px);
}

/* hero stat row (labs) */
.hero-stat-row{ display:flex; gap:48px; margin-top:40px; padding-top:26px; border-top:1px solid var(--line-2); }
.hero-stat{ display:flex; flex-direction:column; gap:6px; }
.hero-stat .num{ font-size:34px; font-weight:700; letter-spacing:-0.02em; }
.hero-stat .mono-sm{ color:var(--gray-2); }

/* ---------------- LABS ---------------- */
.prog-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:56px; align-items:center; }
.prog-name{ margin:14px 0 18px; }
.prog-mods{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.prog-mod-chip{
  font-family:var(--mono); font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; font-weight:600;
  background:none; border:1px solid var(--ink); padding:9px 15px; transition:.2s; color:var(--ink);
}
.prog-mod-chip:hover{ background:var(--ink); color:var(--paper); }
@media(max-width:880px){ .prog-row{ grid-template-columns:1fr; gap:28px; } }

.mods{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.mods > .reveal{ display:flex; }
.mods > .reveal > .mod-card{ width:100%; }
.mod-card{ background:var(--paper); padding:32px 28px; display:flex; flex-direction:column; gap:16px; transition:background .25s; }
.mod-card:hover{ background:var(--paper-2); }
.mod-head{ display:flex; justify-content:space-between; align-items:center; }
.mod-code{ color:var(--mk); font-weight:600; }
.mod-i{ color:var(--gray); font-size:12px; }
.mod-name{ margin:0; }
.mod-desc{ font-size:15.5px; flex:1; }
.mod-meta{ display:flex; flex-direction:column; gap:12px; margin:8px 0 0; padding-top:18px; border-top:1px solid var(--line-2); }
.mod-meta div{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; }
.mod-meta dt{ margin:0; }
.mod-meta dd{ margin:0; font-size:14px; font-weight:500; text-align:right; }
.mod-link{ margin-top:6px; }
@media(max-width:880px){ .mods{ grid-template-columns:1fr; } }

.pilot-grid{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:60px; align-items:center; }
.pilot-info{ display:flex; flex-direction:column; align-items:flex-start; gap:22px; }
.pilot-name{ margin:0; }
.pilot-points{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:0; width:100%; }
.pilot-points li{ display:flex; align-items:center; gap:18px; padding:16px 0; border-top:1px solid var(--line-dark); font-size:16px; }
.pilot-points li:last-child{ border-bottom:1px solid var(--line-dark); }
.pilot-points .num{ color:var(--accent-3); font-size:12px; }
.pilot-btn{ margin-top:8px; background:var(--accent); border-color:var(--mk); color:var(--ink); }
.pilot-btn:hover{ background:var(--paper); color:var(--ink); border-color:var(--paper); }
.pilot-cap{ padding-top:12px; }

/* pixel tree (Filosofía hero) */
.page-about .pagehero{ position:relative; }
.page-about .pagehero .wrap{ position:relative; }
.pixtree{ display:grid; grid-template-columns:repeat(13,1fr); gap:2px; width:clamp(200px,26vw,302px); }
.page-about .pixtree{ position:absolute; top:50%; left:50%; right:0; margin-inline:auto; transform:translateY(-50%); }
.pixtree-cell{ width:100%; aspect-ratio:1; }
@media(max-width:1040px){ .page-about .pixtree{ position:static; transform:none; left:auto; right:auto; margin:36px auto 0; width:clamp(200px,58vw,280px); } }

/* pixel isometric cube (Design hero) */
.page-design .pagehero{ position:relative; }
.page-design .pagehero .wrap{ position:relative; }
.pixcube{ display:grid; grid-template-columns:repeat(17,1fr); gap:2px; width:clamp(210px,26vw,300px); }
.page-design .pixcube{ position:absolute; top:50%; left:50%; right:0; margin-inline:auto; transform:translateY(-50%); }
.pixcube-cell{ width:100%; aspect-ratio:1; }
@media(max-width:1040px){ .page-design .pixcube{ position:static; transform:none; left:auto; right:auto; margin:36px auto 0; width:clamp(200px,52vw,260px); } }

/* pixel isometric cylinder (Tech hero) */
.page-tech .pagehero{ position:relative; }
.page-tech .pagehero .wrap{ position:relative; }
.pixcyl{ display:grid; grid-template-columns:repeat(11,1fr); gap:2px; width:clamp(116px,14vw,168px); }
.pixcyl-cell{ width:100%; aspect-ratio:1; }
.page-tech .pixcyl{ position:absolute; top:50%; left:50%; right:0; margin-inline:auto; transform:translateY(-50%); }
@media(max-width:1040px){ .page-tech .pixcyl{ position:static; transform:none; left:auto; right:auto; margin:36px auto 0; width:clamp(110px,30vw,150px); } }

/* pixel computer (Research hero) */
.page-research .pagehero{ position:relative; }
.page-research .pagehero .wrap{ position:relative; }
.pixcomp{ display:grid; grid-template-columns:repeat(22,1fr); gap:2px; width:clamp(250px,30vw,366px); }
.page-research .pixcomp{ position:absolute; top:50%; left:50%; right:0; margin-inline:auto; transform:translateY(-50%); }
.pixcomp-cell{ width:100%; aspect-ratio:1; }
@media(max-width:1040px){ .page-research .pixcomp{ position:static; transform:none; left:auto; right:auto; margin:36px auto 0; width:clamp(240px,62vw,340px); } }

/* pixel mountain (Labs hero) */
.page-labs .pagehero{ position:relative; }
.page-labs .pagehero .wrap{ position:relative; }
.pixmtn{ display:grid; grid-template-columns:repeat(23,1fr); gap:2px; width:clamp(240px,30vw,348px); }
.page-labs .pixmtn{ position:absolute; top:50%; left:50%; right:0; margin-inline:auto; transform:translateY(-50%); }
.pixmtn-cell{ width:100%; aspect-ratio:1; }
@media(max-width:1040px){ .page-labs .pixmtn{ position:static; transform:none; left:auto; right:auto; margin:36px auto 0; width:clamp(220px,58vw,300px); } }

/* pilots grid (coded) */
.pilots-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.pilots-grid > .reveal{ display:flex; }
.pilots-grid .pilot-card{ width:100%; }
.pilot-card{ background:#1d1d1a; border:0; text-align:left; color:var(--paper); display:flex; flex-direction:column; overflow:hidden; transition:transform .28s cubic-bezier(.2,.7,.3,1); min-width:0; }
.pilot-card:hover{ transform:translateY(-5px); }
.pilot-card-media{ aspect-ratio:16/10; overflow:hidden; }
.pilot-card-media .ph{ border:0; transition:transform .5s cubic-bezier(.2,.7,.3,1); }
.pilot-card:hover .pilot-card-media .ph{ transform:scale(1.05); }
.pilot-card-body{ padding:24px; display:flex; flex-direction:column; gap:13px; flex:1; }
.pilot-card-name{ margin:0; color:var(--paper); letter-spacing:-0.01em; }
.pilot-tags{ display:flex; gap:8px; flex-wrap:wrap; }
.pilot-tag{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; border:1px solid var(--line-dark); padding:5px 10px; color:var(--accent-3); white-space:nowrap; }
.pilot-card-desc{ font-size:14.5px; line-height:1.5; color:var(--gray); }
.pilot-card-link{ color:var(--accent-3); margin-top:auto; }
@media(max-width:880px){ .pilots-grid{ grid-template-columns:1fr; } }

/* ===== Research Bank (grouped) ===== */
.rb2-filter{ display:flex; align-items:center; gap:18px; padding-bottom:24px; margin-bottom:36px; border-bottom:1px solid var(--ink); flex-wrap:wrap; }
.rb2-count{ margin-left:auto; font-size:12px; color:var(--gray-2); letter-spacing:0.1em; }
.rb2-group{ margin-bottom:56px; }
.rb2-grouphead{ display:flex; align-items:baseline; gap:16px; padding-bottom:16px; margin-bottom:22px; border-bottom:1px solid var(--line-2); }
.rb2-groupn{ font-size:13px; color:var(--mk); }
.rb2-groupname{ margin:0; }
.rb2-groupdesc{ margin-left:auto; }
.rb2-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.rb2-grid > .reveal{ display:flex; }
.rb2-grid > .reveal > .rb2-card{ width:100%; }
.rb2-card{ background:var(--paper); border:1px solid var(--line-2); text-align:left; color:var(--ink); display:flex; flex-direction:column; overflow:hidden; transition:transform .25s, box-shadow .25s; min-width:0; }
.rb2-card:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(20,20,16,.12); }
.rb2-cover{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.rb2-cover .ph{ border:0; transition:transform .5s cubic-bezier(.2,.7,.3,1); }
.rb2-card:hover .rb2-cover .ph{ transform:scale(1.05); }
.rb2-type{ position:absolute; right:12px; top:12px; z-index:3; font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; font-weight:600; background:rgba(23,23,18,.82); color:var(--paper); padding:5px 9px; }
.rb2-body{ padding:20px; display:flex; flex-direction:column; gap:10px; flex:1; }
.rb2-meta{ display:flex; justify-content:space-between; align-items:center; }
.rb2-ttl{ font-size:17px; font-weight:700; letter-spacing:-0.015em; line-height:1.22; transition:color .2s; }
.rb2-card:hover .rb2-ttl{ color:var(--mk); }
.rb2-ex{ font-size:14px; line-height:1.5; color:var(--gray-2); }
.rb2-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-top:2px; }
.rb2-tag{ font-family:var(--mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gray-2); border:1px solid var(--line-2); padding:4px 8px; }
.rb2-foot{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:auto; padding-top:12px; border-top:1px solid var(--line-2); }
.rb2-pdf{ font-family:var(--mono); font-size:10px; letter-spacing:0.1em; font-weight:700; background:var(--accent); color:var(--ink); padding:4px 8px; }
@media(max-width:980px){ .rb2-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .rb2-grid{ grid-template-columns:1fr; } .rb2-groupdesc{ display:none; } }

/* status badge (shared across layouts) */
.proj-badge{ position:absolute; top:12px; left:12px; z-index:3; font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; font-weight:600; background:var(--paper); color:var(--ink); padding:5px 9px; }
.proj-badge.up{ background:var(--accent-2); color:var(--ink); }
.proj-badge.done{ background:var(--labs); color:#fff; }
.proj-badge.prog{ background:#d8b54a; color:var(--ink); }

/* ===== Pilot detail ===== */
.page-pilot .pd-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:22px; }
.pd-grid{ display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:48px; margin-top:48px; align-items:start; }
.pd-main{ display:flex; flex-direction:column; gap:48px; min-width:0; }
.pd-lbl{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--mk); font-weight:600; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid var(--line-2); }
.pd-summary{ color:var(--ink-2); }
.pd-timeline{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.pd-step{ background:var(--paper); padding:22px; }
.pd-step-n{ font-size:13px; color:var(--mk); }
.pd-step-t{ margin:8px 0 6px; font-size:18px; font-weight:700; letter-spacing:-0.01em; }
.pd-step-d{ font-size:14px; color:var(--gray-2); line-height:1.5; }
.pd-metrics{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.pd-metric{ border:1px solid var(--line-2); padding:18px; display:flex; flex-direction:column; gap:8px; }
.pd-metric-k{ color:var(--accent); font-weight:600; font-size:11px; }
.pd-metric-v{ font-size:15px; font-weight:500; }
.pd-gallery{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.pd-side{ display:flex; flex-direction:column; gap:20px; position:sticky; top:calc(var(--nav-h) + 20px); }
.pd-card{ border:1px solid var(--line-2); padding:22px; }
.pd-fields{ margin:0; display:flex; flex-direction:column; gap:12px; }
.pd-fields div{ display:flex; justify-content:space-between; gap:14px; align-items:baseline; }
.pd-fields dt{ margin:0; } .pd-fields dd{ margin:0; font-size:14px; font-weight:500; text-align:right; }
.pd-team{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.pd-team li{ font-size:14px; padding:9px 0; border-top:1px solid var(--line-2); }
.pd-team li:first-child{ border-top:0; }
.pd-docs{ display:flex; flex-direction:column; gap:10px; }
/* designed pilot cover (used when no high-res photo exists) */
.pd-brandcover{ aspect-ratio:16/7; background:var(--labs); color:#fff; padding:clamp(20px,3vw,34px) clamp(22px,3.2vw,38px); display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; }
.pd-bc-top{ display:flex; justify-content:space-between; gap:16px; color:rgba(255,255,255,.8); }
.pd-bc-ico{ position:absolute; right:clamp(24px,5%,56px); top:50%; transform:translateY(-50%); width:clamp(90px,12vw,150px); opacity:.95; }
.pd-bc-foot{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.pd-bc-code{ margin:0; font-size:clamp(30px,5vw,64px); letter-spacing:-0.02em; line-height:1; text-transform:uppercase; font-weight:800; white-space:nowrap; }
.pd-bc-loc{ color:rgba(255,255,255,.8); }
@media(max-width:620px){ .pd-bc-ico{ width:64px; top:auto; bottom:54px; transform:none; } }

.pd-doc{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--ink); font-size:13.5px; transition:.2s; color:var(--ink); width:100%; text-align:left; background:var(--paper); cursor:pointer; font-family:inherit; }
.pd-doc:hover{ background:var(--ink); color:var(--paper); }
.pd-doc-arw{ display:inline-flex; color:var(--mk); transition:transform .2s, color .2s; }
.pd-doc:hover .pd-doc-arw{ color:var(--paper); transform:translateX(3px); }

/* document summary modal */
.doc-modal{ position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:24px; background:rgba(23,23,18,.55); animation:docFade .2s ease both; }
@keyframes docFade{ from{ opacity:0; } to{ opacity:1; } }
.doc-modal-card{ position:relative; background:var(--paper); border:1px solid var(--ink); max-width:560px; width:100%; padding:34px 36px 38px; box-shadow:0 24px 60px rgba(20,20,16,.3); }
.doc-modal-x{ position:absolute; top:12px; right:16px; background:none; border:0; font-size:26px; line-height:1; cursor:pointer; color:var(--ink-2); font-family:inherit; }
.doc-modal-x:hover{ color:var(--ink); }
.doc-modal-ttl{ margin:12px 0 16px; font-size:clamp(21px,3vw,26px); letter-spacing:-0.01em; }
.doc-modal-body{ color:var(--ink-2); line-height:1.6; font-size:16px; text-wrap:pretty; }
.pd-empty{ margin:0; }

/* animated pixel pilot banner */
.pd-pixbanner{ position:relative; aspect-ratio:16/7; overflow:hidden; border:1px solid var(--ink); }
.pd-pixbanner canvas{ display:block; width:100%; height:100%; image-rendering:pixelated; }
.pd-px-top{ position:absolute; top:24px; left:30px; right:30px; display:flex; justify-content:space-between; gap:16px; color:var(--ink); }
.pd-px-foot{ position:absolute; bottom:22px; left:30px; right:30px; display:flex; justify-content:space-between; align-items:flex-end; gap:16px; color:var(--ink); }
.pd-px-code{ margin:0; font-size:clamp(26px,4.4vw,54px); letter-spacing:-0.02em; line-height:1; }
.pd-px-loc{ color:var(--ink-2); }
.pb-casas-flotantes-01 .pd-px-loc{ color:#EAF2FC; }
.pb-casas-flotantes-01 .pd-px-code{ color:#0E2350; }

/* ===== Programs (gated access) ===== */
.page-programs{ padding-top:calc(var(--nav-h) + 8px); }
.page-programs .article-back{ display:inline-flex; margin-bottom:34px; }
.page-programs .eyebrow{ display:block; }
.page-programs .pg-title{ margin:14px 0 18px; }
.page-programs .pg-lead{ max-width:62ch; }
.pg-gate{ margin-top:44px; max-width:520px; border-top:1px solid var(--ink); padding-top:26px; }
.pg-gate-lbl{ display:block; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:12px; }
.pg-gate-row{ display:flex; gap:12px; align-items:stretch; }
.pg-input{ flex:1; min-width:0; font-family:var(--mono); font-size:15px; letter-spacing:0.12em; padding:13px 16px; border:1px solid var(--ink); background:var(--paper); color:var(--ink); border-radius:0; }
.pg-input:focus{ outline:2px solid var(--mk); outline-offset:-1px; }
.pg-input.err{ border-color:#B3402F; outline:2px solid #B3402F; outline-offset:-1px; }
.pg-err{ color:#B3402F; margin:12px 0 0; }
.pg-note{ margin:14px 0 0; }
.pg-open{ margin-top:44px; }
.pg-open-bar{ display:flex; justify-content:space-between; align-items:center; gap:18px; border-top:1px solid var(--ink); padding:18px 0; }
.pg-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.pg-card{ background:var(--paper); padding:26px 24px 22px; display:flex; flex-direction:column; gap:6px; }
.pg-card-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.pg-card-code{ margin:0; font-size:clamp(19px,2vw,23px); }
.pg-card-loc{ display:block; }
.pg-card-key{ display:flex; align-items:center; gap:10px; margin-top:12px; }
.pg-key-chip{ font-family:var(--mono); font-size:13px; letter-spacing:0.08em; font-weight:600; color:var(--ink); background:var(--mk); padding:4px 10px; }
.pg-card-lbl{ letter-spacing:0.08em; text-transform:uppercase; color:var(--gray-2); margin-top:16px; }
.pg-doclist{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; }
.pg-doc{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:11px 2px; border-top:1px solid var(--line-2); font-size:15px; color:var(--ink); text-decoration:none; transition:color .2s; }
a.pg-doc:hover{ color:var(--mk); }
.pg-doc-tag{ flex:none; color:var(--gray-2); }
button.pg-doc{ width:100%; background:none; border:0; border-top:1px solid var(--line-2); cursor:pointer; font-family:inherit; text-align:left; }
button.pg-doc:hover{ color:var(--mk); }
button.pg-doc:hover .pg-doc-tag{ color:var(--mk); }
.pg-card-gate{ margin-top:16px; border-top:1px solid var(--ink); padding-top:14px; }
.pg-card-gate .pg-gate-lbl{ margin-bottom:10px; }
.pg-card-gate .pg-input{ font-size:13px; padding:10px 12px; }
.pg-card-gate .btn{ padding:10px 16px; }
a.pg-doc .pg-doc-tag{ color:var(--mk); }
.pg-doc-soon span:first-child{ color:var(--gray-2); }

/* Labs → programs band */
.pg-band{ width:100%; margin-top:1px; display:flex; justify-content:space-between; align-items:center; gap:24px; text-align:left; background:var(--mk); color:var(--ink); border:0; cursor:pointer; padding:26px 28px; font-family:inherit; }
.pg-band:hover .pg-band-a{ text-decoration:underline; text-underline-offset:4px; }
.pg-band-txt{ display:flex; flex-direction:column; gap:6px; }
.pg-band-q{ letter-spacing:0.08em; text-transform:uppercase; }
.pg-band-a{ margin:0; display:inline-flex; align-items:center; gap:10px; }
.pg-band-note{ color:rgba(23,23,18,0.65); }
@media(max-width:720px){ .pg-band{ flex-direction:column; align-items:flex-start; } .pg-gate-row{ flex-direction:column; } }

/* inline document reading view (web, not downloadable) */
.pd-read{ display:flex; flex-direction:column; border-top:1px solid var(--ink); }
.pd-read-item{ border-bottom:1px solid var(--ink); }
.pd-read-head{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:20px 2px; background:none; border:0; cursor:pointer; color:var(--ink); text-align:left; font-family:inherit; transition:color .2s; }
.pd-read-head:hover{ color:var(--mk); }
.pd-read-ttl{ font-size:clamp(17px,2.1vw,21px); font-weight:600; letter-spacing:-0.01em; }
.pd-read-ico{ position:relative; width:15px; height:15px; flex:none; }
.pd-read-ico::before,.pd-read-ico::after{ content:""; position:absolute; background:var(--mk); transition:transform .25s ease, opacity .25s ease; }
.pd-read-ico::before{ top:6.5px; left:0; width:15px; height:2px; }
.pd-read-ico::after{ left:6.5px; top:0; width:2px; height:15px; }
.pd-read-item.open .pd-read-ico::after{ transform:scaleY(0); opacity:0; }
.pd-read-body{ color:var(--ink-2); line-height:1.65; font-size:16px; text-wrap:pretty; max-width:70ch; margin:0; padding:0 2px 26px; animation:docFade .25s ease both; display:flex; flex-direction:column; gap:14px; }
.pd-read-body p{ margin:0; }
.pd-read-stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2); margin:6px 0; }
.pd-read-stat{ background:var(--paper); padding:16px 16px 14px; display:flex; flex-direction:column; gap:6px; }
.pd-read-stat-v{ font-size:clamp(22px,2.6vw,30px); font-weight:600; letter-spacing:-0.02em; color:var(--ink); }
.pd-read-stat-k{ font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--gray-2); line-height:1.5; }
@media(max-width:720px){ .pd-read-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.pd-dl{ margin-top:34px; }
.pd-stubrow{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:24px; padding-top:22px; border-top:1px solid var(--line-2); }
@media(max-width:880px){ .pd-grid{ grid-template-columns:1fr; gap:30px; } .pd-side{ position:static; } .pd-timeline{ grid-template-columns:1fr; } }

/* ===== pixel world (Maquetación B hero) ===== */
.pixworld{ display:grid; grid-template-columns:repeat(19,1fr); gap:2px; width:clamp(210px,22vw,310px); flex:none; }
.pixworld-cell{ width:100%; aspect-ratio:1; }
.pixglobe{ width:clamp(210px,24vw,320px); aspect-ratio:1; flex:none; }
.pixglobe canvas{ display:block; width:100%; height:100%; image-rendering:pixelated; }
.v2 .fw-hero{ position:relative; }
.v2 .fw-hero .eyebrow{ color:var(--accent); }
.fw-herorow{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:clamp(28px,4vw,60px); }
.fw-herotext{ min-width:0; }
.v2 .fw-hero .pixworld, .v2 .fw-hero .pixglobe{ justify-self:center; align-self:center; }
@media(max-width:720px){ .fw-herorow{ grid-template-columns:1fr; } .v2 .fw-hero .pixworld, .v2 .fw-hero .pixglobe{ justify-self:start; margin:34px 0 0; } }
@media(max-width:880px){ .pilot-grid{ grid-template-columns:1fr; gap:34px; } }

.process{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.proc-step{ background:var(--paper); padding:30px 24px; display:flex; flex-direction:column; gap:14px; min-height:220px; transition:background .25s; }
.proc-step:hover{ background:var(--paper-2); }
.proc-n{ font-size:42px; font-weight:700; letter-spacing:-0.02em; color:var(--mk); }
.proc-t{ margin:0; }
.proc-d{ font-size:15px; }
@media(max-width:880px){ .process{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .process{ grid-template-columns:1fr; } }

/* ---------------- RESEARCH ---------------- */
.filters{ display:flex; flex-wrap:wrap; align-items:center; gap:30px; padding-bottom:30px; margin-bottom:10px; border-bottom:1px solid var(--ink); }
.filter-group{ display:flex; align-items:center; gap:14px; }
.filter-lbl{ }
.filter-pills{ display:flex; gap:8px; flex-wrap:wrap; }
.fpill{
  font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; font-weight:600;
  background:none; border:1px solid var(--line-2); padding:8px 13px; color:var(--gray-2); transition:.2s;
}
.fpill:hover{ border-color:var(--ink); color:var(--ink); }
.fpill.on{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.filter-count{ margin-left:auto; font-size:12px; color:var(--gray-2); letter-spacing:0.1em; }

.rb-list{ display:flex; flex-direction:column; }
.rb-row{
  display:grid; grid-template-columns:auto 180px 1fr auto auto; gap:30px; align-items:start;
  background:none; border:0; border-bottom:1px solid var(--line-2); padding:34px 0;
  text-align:left; color:var(--ink); transition:.25s; width:100%;
}
.rb-row:hover{ padding-left:14px; padding-right:14px; background:var(--paper-2); }
.rb-idx{ font-size:12px; color:var(--gray); padding-top:5px; }
.rb-kind{ display:flex; flex-direction:column; gap:10px; padding-top:3px; }
.rb-main{ max-width:60ch; }
.rb-ttl{ margin:0 0 10px; transition:color .2s; }
.rb-row:hover .rb-ttl{ color:var(--mk); }
.rb-ex{ font-size:15px; }
.rb-date{ font-size:13px; color:var(--gray-2); padding-top:5px; white-space:nowrap; }
.rb-arw{ color:var(--gray); padding-top:3px; transition:.25s; }
.rb-row:hover .rb-arw{ color:var(--mk); transform:translateX(5px); }
.rb-empty{ padding:60px 0; color:var(--gray-2); }
@media(max-width:920px){
  .rb-row{ grid-template-columns:auto 1fr auto; row-gap:16px; }
  .rb-kind{ grid-column:2; }
  .rb-main{ grid-column:1 / -1; }
  .rb-date{ grid-column:3; grid-row:1; }
  .rb-arw{ display:none; }
}

/* ---------------- ARTICLE ---------------- */
.page-article{ padding-top:calc(var(--nav-h) + 56px); }
.article-head{ padding-bottom:36px; }
.article-back{ margin-bottom:40px; color:var(--gray-2); }
.article-back:hover{ color:var(--mk); }
.article-meta{ display:flex; gap:16px; align-items:center; margin-bottom:24px; }
.article-ttl{ max-width:20ch; }
.article-byline{ margin-top:30px; padding-top:20px; border-top:1px solid var(--line-2); display:flex; gap:16px; }
.article-cap{ margin-top:12px; }
.article-body{ max-width:680px; margin-top:56px; padding-bottom:40px; }
.art-p{ font-size:19px; line-height:1.65; color:var(--ink-2); margin-bottom:26px; }
.art-h{ font-size:clamp(24px,2.6vw,34px); font-weight:700; letter-spacing:-0.02em; line-height:1.1; margin:48px 0 22px; }
.art-list{ list-style:none; margin:0 0 30px; padding:0; }
.art-list li{ display:flex; gap:18px; align-items:baseline; padding:13px 0; border-top:1px solid var(--line-2); font-size:17px; color:var(--ink-2); }
.art-list li:last-child{ border-bottom:1px solid var(--line-2); }
.art-li-n{ color:var(--mk); font-size:12px; }
.art-quote{ margin:44px 0; padding:36px 0 36px 36px; border-left:3px solid var(--accent); }
.art-table{ margin:8px 0 34px; border-top:1px solid var(--ink); }
.art-tr{ display:flex; justify-content:space-between; align-items:baseline; gap:24px; padding:15px 2px; border-bottom:1px solid var(--line-2); }
.art-td-k{ font-family:var(--mono); font-size:12.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--mk); font-weight:600; flex:none; }
.art-td-v{ font-size:17px; color:var(--ink-2); text-align:right; }

/* area research (articles of one area, on Design/Tech pages) */
.area-articles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px; }
.area-art{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; text-align:left; background:var(--paper); border:1px solid var(--line-2); padding:28px; color:var(--ink); cursor:pointer; font-family:inherit; transition:transform .25s, box-shadow .25s; }
.area-art:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(20,20,16,.12); }
.area-art-ttl{ font-size:clamp(19px,2vw,24px); font-weight:700; letter-spacing:-0.015em; line-height:1.2; }
.area-art-ex{ color:var(--ink-2); font-size:15px; }
.area-art .tlink{ margin-top:6px; }

/* print → save as PDF (article reading view) */
@media print {
  .nav, .footer, .cta-band, .nextlink, .pd-dl, .backbar, .grid-overlay, .article-cap { display:none !important; }
  .page-article{ padding:0 !important; }
  .article-head{ padding-top:0 !important; }
  .article-cover{ max-height:300px; }
  .article-body{ max-width:none; }
  .art-quote, .art-table, .art-tr{ break-inside:avoid; }
  .art-h{ break-after:avoid; }
  body, .v2{ background:#fff !important; }
}
.art-quote p{ font-size:clamp(24px,3vw,34px); font-weight:700; letter-spacing:-0.02em; line-height:1.18; }
.art-quote cite{ display:block; margin-top:18px; font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; font-style:normal; color:var(--gray-2); }
.article-stub-ex{ max-width:46ch; margin-top:26px; color:var(--ink-2); }
.article-stub-note{ display:flex; flex-direction:column; gap:10px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line-2); }

/* ---------------- ABOUT ---------------- */
.premises{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.premise{ background:var(--paper-2); padding:34px 28px; display:flex; flex-direction:column; gap:14px; min-height:240px; }
.premise-n{ color:var(--mk); font-size:13px; }
.premise-t{ margin:0; }
.premise-d{ font-size:15.5px; }
@media(max-width:880px){ .premises{ grid-template-columns:1fr; } }

.mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
.mv-card{ background:var(--ink); padding:44px 38px; display:flex; flex-direction:column; gap:20px; }
.mv-card .eyebrow{ color:var(--accent-3); }
.mv-text{ font-weight:500; letter-spacing:-0.015em; line-height:1.28; font-size:clamp(20px,2.1vw,27px); color:var(--paper); }
@media(max-width:780px){ .mv-grid{ grid-template-columns:1fr; } }

.objectives{ display:flex; flex-direction:column; }
.obj-row{ display:grid; grid-template-columns:90px minmax(0,1fr) minmax(0,1.4fr); gap:36px; align-items:start; padding:34px 0; border-top:1px solid var(--line-2); }
.obj-row:last-child{ border-bottom:1px solid var(--line-2); }
.obj-n{ font-size:15px; color:var(--mk); padding-top:5px; }
.obj-t{ margin:0; }
.obj-d{ color:var(--ink-2); }
@media(max-width:780px){ .obj-row{ grid-template-columns:1fr; gap:12px; } }

.values{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.value-card{ background:var(--paper-2); padding:26px 20px; display:flex; flex-direction:column; gap:12px; min-height:230px; }
.value-n{ color:var(--mk); font-size:12px; }
.value-t{ margin:4px 0 0; font-size:17px; font-weight:700; letter-spacing:-0.01em; line-height:1.15; }
.value-d{ font-size:13.5px; line-height:1.5; color:var(--gray-2); margin:0; }
@media(max-width:980px){ .values{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .values{ grid-template-columns:1fr; } }

/* ---------------- DESIGN / TECH ---------------- */
.dt-intro{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:56px; align-items:start; }
.dt-lead{ letter-spacing:-0.02em; }
.dt-body{ padding-top:6px; }
.dt-flow{ grid-column:1 / -1; display:flex; align-items:center; gap:18px; margin-top:44px; padding-top:30px; border-top:1px solid var(--line-2); flex-wrap:wrap; }
.dt-flow-node{ font-family:var(--mono); font-size:13px; letter-spacing:0.12em; text-transform:uppercase; font-weight:600; border:1px solid var(--line-2); padding:12px 22px; color:var(--gray-2); }
.dt-flow-node.on{ background:var(--accent); border-color:var(--mk); color:var(--ink); }
.dt-flow-arw{ color:var(--gray); }
@media(max-width:880px){ .dt-intro{ grid-template-columns:1fr; gap:26px; } }

.triad-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
.triad-card{ background:var(--ink); padding:36px 30px; display:flex; flex-direction:column; gap:16px; min-height:300px; transition:background .25s; }
.triad-card:hover{ background:#1f1f1b; }
.triad-card-top{ display:flex; justify-content:space-between; align-items:center; }
.triad-card-k{ color:var(--accent-3); font-weight:600; }
.triad-card-top .num{ color:var(--gray-2); font-size:12px; }
.triad-card-t{ margin:6px 0 0; color:var(--paper); }
.triad-card-d{ font-size:15.5px; line-height:1.55; color:var(--gray); margin:auto 0 0; }
@media(max-width:880px){ .triad-cards{ grid-template-columns:1fr; } }

.principles{ list-style:none; margin:0; padding:0; counter-reset:p; }
.principle{ display:flex; align-items:baseline; gap:30px; padding:30px 0; border-top:1px solid var(--line-2); }
.principle:last-child{ border-bottom:1px solid var(--line-2); }
.principle-n{ color:var(--mk); font-size:14px; }
.principle-t{ font-size:clamp(22px,2.6vw,34px); font-weight:700; letter-spacing:-0.025em; }

.metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-2); border:1px solid var(--line-2); }
.metric-card{ background:var(--paper); padding:30px 24px; display:flex; flex-direction:column; gap:12px; min-height:250px; transition:background .25s; }
.metric-card:hover{ background:var(--paper-2); }
.metric-n{ font-size:12px; color:var(--gray); }
.metric-k{ color:var(--mk); font-weight:600; }
.metric-v{ margin:2px 0 0; }
.metric-d{ font-size:14.5px; margin-top:auto; }
@media(max-width:880px){ .metrics{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .metrics{ grid-template-columns:1fr; } }

.lines{ display:flex; flex-direction:column; }
.line-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:48px; align-items:center; padding:40px 0; border-top:1px solid var(--line-2); }
.line-row:last-child{ border-bottom:1px solid var(--line-2); }
.line-l{ display:flex; align-items:baseline; gap:24px; }
.line-n{ color:var(--mk); font-size:14px; }
.line-t{ margin:0; }
.line-d{ color:var(--ink-2); }
@media(max-width:780px){ .line-row{ grid-template-columns:1fr; gap:16px; } }

/* ---------------- CONTACT ---------------- */
.contact-grid{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:72px; align-items:start; }
.contact-form{ display:flex; flex-direction:column; gap:24px; }
.field{ display:flex; flex-direction:column; gap:10px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.field label{ }
.field input, .field textarea, .select-wrap select{
  background:var(--paper); border:0; border-bottom:1px solid var(--ink); padding:12px 0;
  font-family:var(--sans); font-size:17px; color:var(--ink); width:100%; transition:border-color .2s;
}
.field input:focus, .field textarea:focus, .select-wrap select:focus{ outline:none; border-color:var(--mk); }
.field textarea{ resize:vertical; }
.select-wrap{ position:relative; }
.select-wrap select{ appearance:none; -webkit-appearance:none; padding-right:30px; cursor:pointer; }
.select-arw{ position:absolute; right:2px; top:50%; transform:translateY(-50%) rotate(90deg); color:var(--gray-2); pointer-events:none; }
.contact-submit{ margin-top:8px; align-self:flex-start; }
.contact-sent{ display:flex; flex-direction:column; gap:20px; padding:40px 0; }

.contact-side{ display:flex; flex-direction:column; gap:18px; padding-top:6px; }
.channels{ display:flex; flex-direction:column; }
.channel{ display:flex; flex-direction:column; gap:6px; padding:18px 0; border-top:1px solid var(--line-2); transition:padding-left .2s; }
.channel:last-child{ border-bottom:1px solid var(--line-2); }
.channel:hover{ padding-left:8px; }
.channel-v{ font-size:18px; font-weight:500; letter-spacing:-0.01em; }
.channel:hover .channel-v{ color:var(--mk); }
.contact-social{ display:flex; gap:22px; margin-top:18px; flex-wrap:wrap; }
.contact-loc{ margin-top:24px; padding-top:24px; border-top:1px solid var(--line-2); display:flex; flex-direction:column; gap:10px; }
.contact-loc .body{ font-size:15px; }
@media(max-width:880px){ .contact-grid{ grid-template-columns:1fr; gap:48px; } }
@media(max-width:520px){ .field-row{ grid-template-columns:1fr; } }