/* Tema Oliver · grid.css — retícula de 12 columnas y superposición de desarrollo (líneas 285–357 de la maqueta, sin cambios) */
/* ===== Retícula: 12 columnas fluidas, ancho máximo 1200 px =====
   Escritorio ≥1024: 12 col · medianil 24 · margen 40 (a 1440 px el margen queda en 120)
   Tableta 600–1023: 8 col · medianil 20 · margen 32
   Móvil <600: 4 col · medianil 16 · margen 16 */
:root{--cols:4;--gutter:16px;--side:16px;--maxw:1200px;--row:40px;--logo-filter:none}
@media (min-width:600px){:root{--cols:8;--gutter:20px;--side:32px}}
@media (min-width:1024px){:root{--cols:12;--gutter:24px;--side:40px;--row:48px}}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--logo-filter:invert(1)}}
:root[data-theme="dark"]{--logo-filter:invert(1)}
.wrap,.wrap:is(*){max-width:calc(var(--maxw) + 2*var(--side));padding-left:max(var(--side),env(safe-area-inset-left,0px));padding-right:max(var(--side),env(safe-area-inset-right,0px))}
.g,.split,.hero-grid,.cards,.figs,.two-col,.plants,.case,.foot-top{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter);row-gap:var(--row)}
.cards,.plants,.figs{row-gap:var(--gutter)}
.figs{row-gap:0}
.g>*,.split>*,.hero-grid>*,.cards>*,.figs>*,.two-col>*,.plants>*,.case>*,.foot-top>*{grid-column:1/-1;min-width:0}
.timeline,.process{display:contents}
.proc{counter-reset:p}
[hidden]{display:none!important}
.figs.cols-3{grid-template-columns:repeat(var(--cols),minmax(0,1fr))}
.figs.n1{grid-template-columns:minmax(0,1fr)}
.figs.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.figs.n1>*,.figs.n2>*{grid-column:auto}
.row2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gutter)}
@media (max-width:599px){.row2{grid-template-columns:minmax(0,1fr)}}
.gallery .ph{border-radius:28px;overflow:hidden;aspect-ratio:4/3;background:var(--surface)}
.gallery .ph img{width:100%;height:100%;object-fit:cover}
.video-el{display:block;width:100%;aspect-ratio:16/9;border-radius:28px;background:#000}
.marquee li{display:flex;align-items:center;padding-block:30px}
.marquee img{display:block;width:auto;max-width:none;filter:var(--logo-filter);opacity:.72}
.marquee li.txt{font:700 1.45rem/1 var(--sans);letter-spacing:.02em;color:var(--ink);opacity:.72}
.logo-row{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:28px;align-items:center}
.logo-row img{display:block;width:auto;filter:var(--logo-filter);opacity:.8}
.g-lead{align-self:start}
.timeline li{padding-top:24px}
/* Móvil: 4 columnas */
@media (max-width:599px){
  .figs>*{grid-column:span 2}
  .figs>:last-child:nth-child(odd){grid-column:1/-1}
  .process li{grid-column:span 2}
  .process li:last-child:nth-child(odd){grid-column:1/-1}
}
/* Tableta: 8 columnas */
@media (min-width:600px) and (max-width:1023px){
  .cards>*,.figs>*,.plants>*,.foot-top>*,.timeline li,.process li,.gallery>*{grid-column:span 4}
  .cards>:last-child:nth-child(odd),.figs>:last-child:nth-child(odd),.gallery>:last-child:nth-child(odd){grid-column:1/-1}
  .tl .timeline li:last-child,.proc .process li:last-child{grid-column:1/-1}
}
/* Escritorio: 12 columnas */
@media (min-width:1024px){
  .split>:first-child{grid-column:1/span 6}
  .split>:last-child{grid-column:7/span 6}
  .split.s65>:last-child{grid-column:8/span 5}
  .split.rev>:first-child{grid-column:7/span 6;grid-row:1}
  .split.rev>:last-child{grid-column:1/span 6;grid-row:1}
  .hero-grid>:first-child{grid-column:1/span 7}
  .hero-grid>:last-child{grid-column:9/span 4}
  .cards>*,.gallery>*,.figs.cols-3>*{grid-column:span 4}
  .figs>*{grid-column:span 3}
  .two-col>*,.plants>*,.case>*{grid-column:span 6}
  .foot-top>*{grid-column:span 3}
  .g-lead{grid-column:1/span 2}
  .timeline li,.process li{grid-column:span 2}
  .section-head{max-width:calc((100% - 11*var(--gutter))/12*8 + 7*var(--gutter))}
}
/* Superposición de la retícula (botón «Retícula» o tecla G) */
.grid-overlay{position:fixed;inset:0;z-index:200;pointer-events:none}
.grid-overlay .wrap{height:100%;margin-inline:auto;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gutter)}
.grid-overlay span{background:color-mix(in srgb,var(--cyan) 14%,transparent);border-inline:1px solid color-mix(in srgb,var(--cyan) 45%,transparent)}
.grid-overlay span:nth-child(n+5){display:none}
@media (min-width:600px){.grid-overlay span:nth-child(n+5){display:block}.grid-overlay span:nth-child(n+9){display:none}}
@media (min-width:1024px){.grid-overlay span:nth-child(n+9){display:block}}
.grid-toggle{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:201;font:600 .8rem var(--sans);padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;box-shadow:0 4px 18px rgba(11,20,35,.12)}
.grid-toggle[aria-pressed="true"]{background:var(--cyan);color:var(--on-cyan);border-color:var(--cyan)}

