/* ═══════════════════════════════════════════════════════════════════════
   Rikolver web 2.0 — capa de sitio (site-2.0.css)
   Base DS 9.0 en CDN (cuerpo ≡ 8.6.1): https://assets.rikolver.com/css/grk-ds-8_6.css
   Lane WEB-CONTENT-PORTING (R-188). Solo AÑADE lo que el bundle NO trae (B0 verificado):
     · paletas .fondo-* corporativas (el bundle solo define .fondo-azul-oxford;
       las de proyecto —oxido/arenisca/cedro/cal-viva— las inyecta cada landing)
     · .rk-legal*  (ausente en CDN → políticas quedarían sin estilo)
     · .boton-amplio (gap conocido DS: usada por form live/template, sin def en CDN)
     · .rk-card-thumb (el vivo pd2 la define inline; aquí para home/proyectos)
     · tabla PMC + helpers teaser/gated
   Tokens usados = canon DS 9.0 (arena #D6D2CC · cedar #493B32 · oxford #1B1E27 ·
     koala #94969A · blanco · marfil #F5F3EF). Sin colores inventados. R-168 aditivo.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --marfil: #F5F3EF;
  --site-max: var(--max-w, 1280px);
}

/* ── Paletas corporativas .fondo-* (mismo contrato de vars que el bundle) ──────
   Cada clase fija: background + --color-fondo/-texto-principal/-titulos/
   -subtitulos/-enlace/-acento + tokens de input/boton, igual que .fondo-azul-oxford
   del bundle. Así los componentes DS (titulo-seccion, texto-imagen, rk-card,
   formulario-contacto…) heredan color correcto por contexto. */

.fondo-marfil{
  background-color: var(--marfil);
  --color-fondo: var(--marfil);
  --color-texto-principal: var(--color-marron-cedar,#493B32);
  --color-titulos: var(--color-azul-oxford,#1B1E27);
  --color-subtitulos: #6E6A63;
  --color-enlace: var(--color-marron-cedar,#493B32);
  --color-acento: var(--color-marron-cedar,#493B32);
  --color-input-bg: #FFFFFF;
  --color-input-text: var(--color-marron-cedar,#493B32);
  --color-boton-enviar: var(--color-azul-oxford,#1B1E27);
  --color-boton-enviar-hover: var(--color-marron-cedar,#493B32);
  --color-boton-enviar-texto: var(--marfil);
  --color-boton-enviar-texto-hover: var(--color-arena,#D6D2CC);
  --grk-linea: rgba(73,59,50,.20);
  --grk-linea-strong: rgba(73,59,50,.30);
}
.fondo-marfil a:hover{ color: var(--color-azul-oxford,#1B1E27); }

.fondo-arena{
  background-color: var(--color-arena,#D6D2CC);
  --color-fondo: var(--color-arena,#D6D2CC);
  --color-texto-principal: var(--color-marron-cedar,#493B32);
  --color-titulos: var(--color-azul-oxford,#1B1E27);
  --color-subtitulos: #6E6A63;
  --color-enlace: var(--color-azul-oxford,#1B1E27);
  --color-acento: var(--color-marron-cedar,#493B32);
  --color-input-bg: var(--marfil);
  --color-input-text: var(--color-marron-cedar,#493B32);
  --color-boton-enviar: var(--color-azul-oxford,#1B1E27);
  --color-boton-enviar-hover: var(--color-marron-cedar,#493B32);
  --color-boton-enviar-texto: var(--marfil);
  --color-boton-enviar-texto-hover: var(--color-arena,#D6D2CC);
  --grk-linea: rgba(73,59,50,.20);
  --grk-linea-strong: rgba(73,59,50,.30);
}
.fondo-arena a:hover{ color: var(--color-marron-cedar,#493B32); }

.fondo-cedro{
  background-color: var(--color-marron-cedar,#493B32);
  --color-fondo: var(--color-marron-cedar,#493B32);
  --color-texto-principal: var(--color-arena,#D6D2CC);
  --color-titulos: var(--marfil);
  --color-subtitulos: var(--color-arena,#D6D2CC);
  --color-enlace: var(--marfil);
  --color-acento: var(--color-arena,#D6D2CC);
  --color-input-bg: var(--color-arena,#D6D2CC);
  --color-input-text: var(--color-marron-cedar,#493B32);
  --color-boton-enviar: var(--color-arena,#D6D2CC);
  --color-boton-enviar-hover: var(--marfil);
  --color-boton-enviar-texto: var(--color-marron-cedar,#493B32);
  --color-boton-enviar-texto-hover: var(--color-marron-cedar,#493B32);
  --grk-linea: rgba(214,210,204,.18);
  --grk-linea-strong: rgba(214,210,204,.26);
}
.fondo-cedro a:hover{ color: var(--marfil); }

/* ── .boton-amplio — versión full-width del botón enviar (gap DS, aditivo) ───── */
.boton-amplio{
  display:block; width:100%;
  background-color: var(--color-boton-enviar);
  color: var(--color-boton-enviar-texto);
  font-family: var(--fuente-ui,'Archia',system-ui,sans-serif);
  font-weight:500; font-size:1rem; letter-spacing:.02em;
  padding:14px 32px; margin-top:.5rem;
  border:none; border-radius:8px; cursor:pointer;
  transition: background-color .3s, color .3s;
}
.boton-amplio:hover{
  background-color: var(--color-boton-enviar-hover);
  color: var(--color-boton-enviar-texto-hover);
}

/* ── .rk-card-thumb — miniatura 4:3 dentro de .rk-card (port del vivo pd2) ───── */
.rk-card{ display:flex; flex-direction:column; overflow:hidden; }
.rk-card-thumb{
  aspect-ratio:4/3; overflow:hidden; margin:-2rem -2rem 1.5rem;
  background: color-mix(in srgb, var(--color-acento) 8%, transparent);
}
.rk-card-thumb img{
  width:100%; height:100%; object-fit:cover;
  transition: transform var(--dur-med,450ms) var(--ease-quart,cubic-bezier(.25,1,.5,1));
}
.rk-card:hover .rk-card-thumb img{ transform: scale(1.04); }
.rk-card-badge{
  align-self:flex-start; margin-top:.75rem;
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color: var(--color-acento); opacity:.85;
}

/* ═══════════════════════════════════════════════════════════════════════
   .rk-legal — páginas legales (privacidad / cookies). Portado de 10-legal.css
   (DS 9.0) con FALLBACKS en cada token que el bundle CDN 8.6.1 NO trae
   (--t-sm/md/lg/xl · --color-marfil · --max-w-text · --radio-btn), para
   garantizar legibilidad aunque el token falte (B0 fail-soft, R-134).
   ═══════════════════════════════════════════════════════════════════════ */
.rk-legal{
  background-color: var(--color-marfil, #F5F3EF);
  padding: var(--pad-v,clamp(3.5rem,7vw,7rem)) var(--gutter,clamp(1.2rem,5vw,5.5rem));
}
.rk-legal-inner{ max-width: var(--max-w-text, 760px); margin:0 auto; }
.rk-legal h1{
  font-family: var(--fuente-display,'ArgestaDisplay',Georgia,serif);
  font-size: var(--t-xl, clamp(2.1rem,4.5vw,3.1rem)); font-weight:400;
  color: var(--color-azul-oxford,#1B1E27); line-height:1.15;
  margin-bottom: var(--sp-5,40px);
}
.rk-legal h2{
  font-family: var(--fuente-display,'ArgestaDisplay',Georgia,serif);
  font-size: var(--t-lg, clamp(1.45rem,2.6vw,2rem)); font-weight:400;
  color: var(--color-azul-oxford,#1B1E27); line-height:1.2;
  margin-top: var(--sp-6,56px); margin-bottom: var(--sp-3,24px);
  padding-bottom: var(--sp-1,8px);
  border-bottom:1px solid var(--color-marron-cedar,#493B32);
}
.rk-legal h3{
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size: var(--t-md, clamp(1.05rem,1.6vw,1.25rem)); font-weight:600;
  color: var(--color-azul-oxford,#1B1E27);
  margin-top: var(--sp-4,32px); margin-bottom: var(--sp-2,16px);
}
.rk-legal p{
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size: var(--t-sm, clamp(.95rem,1.2vw,1.05rem)); font-weight:400;
  line-height:1.7; color: var(--color-azul-oxford,#1B1E27);
  margin-bottom: var(--sp-3,24px);
}
.rk-legal p.rk-legal-sub{
  font-weight:600; letter-spacing:.02em;
  color: var(--color-marron-cedar,#493B32);
  margin-top: var(--sp-4,32px); margin-bottom: var(--sp-2,16px);
}
.rk-legal ul, .rk-legal ol{ padding-left: var(--sp-4,32px); margin-bottom: var(--sp-3,24px); }
.rk-legal li{
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size: var(--t-sm, clamp(.95rem,1.2vw,1.05rem)); font-weight:400;
  line-height:1.7; color: var(--color-azul-oxford,#1B1E27); margin-bottom: var(--sp-1,8px);
}
.rk-legal li strong{ font-weight:600; color: var(--color-azul-oxford,#1B1E27); }
.rk-legal a{
  color: var(--color-marron-cedar,#493B32);
  text-decoration:underline; text-underline-offset:3px;
  transition: color var(--dur-fast,200ms);
}
.rk-legal a:hover{ color: var(--color-azul-oxford,#1B1E27); }
.rk-legal table{
  width:100%; border-collapse:collapse; margin: var(--sp-4,32px) 0;
  font-family: var(--fuente-ui,'Archia',sans-serif); font-size: var(--t-xs,clamp(.7rem,.9vw,.8rem));
}
.rk-legal thead th{
  text-align:left; font-weight:600; padding: var(--sp-2,16px);
  background-color: var(--color-azul-oxford,#1B1E27); color: var(--color-gris-koala,#94969A);
  border-bottom:2px solid var(--color-marron-cedar,#493B32);
}
.rk-legal tbody td{
  padding: var(--sp-2,16px); border-bottom:1px solid var(--color-arena,#D6D2CC);
  vertical-align:top; line-height:1.6; color: var(--color-azul-oxford,#1B1E27);
}
.rk-legal tbody tr:last-child td{ border-bottom:none; }
.rk-legal-date{
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size: var(--t-label,clamp(.65rem,.8vw,.75rem)); font-weight:500;
  letter-spacing:.08em; text-transform:uppercase;
  color: var(--color-gris-koala,#94969A); margin-bottom: var(--sp-3,24px);
}
@media (max-width:768px){
  .rk-legal table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
}

/* ═══════════════════════════════════════════════════════════════════════
   Tabla de unidades PMC (sin plano · sin económico — ARQ-083 / decisión 5)
   ═══════════════════════════════════════════════════════════════════════ */
.pmc-tabla-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin-top: var(--sp-5,40px); }
.pmc-tabla{
  width:100%; border-collapse:collapse;
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size: var(--t-xs,clamp(.8rem,1vw,.92rem));
}
.pmc-tabla thead th{
  text-align:left; font-weight:600; white-space:nowrap;
  padding:14px 16px; letter-spacing:.04em;
  color: var(--color-titulos);
  border-bottom:2px solid var(--grk-linea-strong, rgba(73,59,50,.30));
}
.pmc-tabla tbody td{
  padding:14px 16px; vertical-align:middle;
  color: var(--color-texto-principal);
  border-bottom:1px solid var(--grk-linea, rgba(73,59,50,.18));
}
.pmc-tabla tbody tr:hover{ background: color-mix(in srgb, var(--color-acento) 6%, transparent); }
.pmc-badge{
  display:inline-block; font-size:.72rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  padding:4px 10px; border-radius:100px;
  background: color-mix(in srgb, var(--color-acento) 16%, transparent);
  color: var(--color-titulos);
}
.pmc-badge--reservada{ opacity:.65; }
.pmc-badge--vendida{ opacity:.5; }
.pmc-nota{
  margin-top: var(--sp-3,24px);
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size:.8rem; color: var(--color-subtitulos); opacity:.9;
}
/* Móvil: tabla → tarjetas apiladas usando data-l */
@media (max-width:640px){
  .pmc-tabla thead{ display:none; }
  .pmc-tabla, .pmc-tabla tbody, .pmc-tabla tr, .pmc-tabla td{ display:block; width:100%; }
  .pmc-tabla tr{ margin-bottom:1rem; border:1px solid var(--grk-linea,rgba(73,59,50,.18)); border-radius:6px; padding:.4rem .2rem; }
  .pmc-tabla td{ border:none; display:flex; justify-content:space-between; gap:1rem; padding:8px 14px; text-align:right; }
  .pmc-tabla td::before{ content:attr(data-l); font-weight:600; color:var(--color-subtitulos); text-align:left; }
}

/* ═══════════════════════════════════════════════════════════════════════
   Teaser gated (Centralis · sin feed) — helpers propios del sitio
   ═══════════════════════════════════════════════════════════════════════ */
.gated{
  max-width:720px; margin:0 auto;
  padding: var(--pad-v,4rem) var(--gutter,2rem); text-align:center;
}
.gated .lock{
  display:inline-block; margin-bottom:1rem;
  font-family: var(--fuente-ui,'Archia',sans-serif);
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color: var(--color-acento); opacity:.85;
}
.teaser-frame{
  position:relative; width:100%; aspect-ratio:16/9; margin-top: var(--sp-4,32px);
  border-radius:8px; overflow:hidden;
  background: color-mix(in srgb, var(--color-acento) 10%, transparent);
}
.teaser-frame img{ width:100%; height:100%; object-fit:cover; opacity:.85; }
