/* ============================================================
   SOL&DEAS — Capa de coherencia para subpáginas
   Alinea las subpáginas (output de Claude Design) con el Home:
   tipografía Cera Pro, paleta tinta, motion y detalles de pulido.
   Se carga DESPUÉS del <style> propio de cada página para armonizar
   sin reescribir su layout. (enriquecida por workflow de 5 lentes)
   ============================================================ */

/* ---------- Cera Pro (la sans del Home) ---------- */
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:100;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Thin.otf') format('opentype');}
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:300;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Light.otf') format('opentype');}
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:400;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Regular.otf') format('opentype');}
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:500;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Medium.otf') format('opentype');}
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:700;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Bold.otf') format('opentype');}
@font-face{font-family:'Cera Pro';font-style:normal;font-weight:900;font-display:swap;src:url('/wp-content/themes/themesolideas/assets/fonts/CeraPro-Black.otf') format('opentype');}

/* ---------- pulido base coherente con el Home ---------- */
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
::selection{ background:#1d1d1b; color:#fff; }

/* foco accesible (ink sobre claro) — coincide con el Home */
:focus-visible{ outline:2px solid #1d1d1b; outline-offset:3px; border-radius:4px; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ============================================================
   SOL&DEAS — coherence.css (capa aditiva, sin @font-face)
   Se carga DESPUES del <style> propio de cada subpagina.
   El base de este archivo YA cubre: scroll-behavior,
   -webkit-text-size-adjust, -webkit-font-smoothing,
   text-rendering, ::selection, :focus-visible y
   prefers-reduced-motion. Aqui SOLO va lo que el base NO tiene,
   deduplicado y seguro (cero layout, cero !important fuera de
   los estados permitidos). Si dudaba, lo omiti.
   ============================================================ */

/* lente design-taste / emil: paridad de seleccion en Firefox.
   El ::selection (WebKit/estandar) ya vive en el base; aqui solo
   se anade el equivalente Gecko para que la seleccion tinta-sobre-
   blanco se sienta intencional cross-browser. Cosmetico, sin riesgo. */
::-moz-selection{ background:#1d1d1b; color:#fff; }

/* lente ui-ux / emil: refinamiento tipografico no destructivo.
   Kerning, ligaduras y alternativas contextuales en todo el doc.
   font-feature-settings NO fija tamano, peso ni interlinea -> no
   altera ninguna caja ni composicion; solo afina el render. */
html{ font-feature-settings:"kern" 1,"liga" 1,"calt" 1; }

/* lente ui-ux / emil: cifras tabulares en eyebrows/labels/specs
   (Space Mono del Home). Asi precios y medidas del configurador no
   "saltan" al cambiar opciones. Solo features OpenType en elementos
   mono ya existentes; no toca fuente, tamano ni caja. */
[class*="eyebrow"],[class*="label"],[class*="mono"],code,kbd{
  font-feature-settings:"kern" 1,"tnum" 1;
}

/* lente design-taste / emil / ui-ux: buen "rag" en titulares y parrafos.
   text-wrap solo redistribuye saltos de linea dentro del ancho YA
   existente (evita viudas/huerfanas); degrada a no-op en navegadores
   viejos. No cambia tamano ni mueve el layout. */
h1,h2,h3{ text-wrap:balance; }
p,li,blockquote,figcaption{ text-wrap:pretty; }

/* lente motion (ui-ux / design-motion / emil): easing del Home.
   transition-timing-function NO crea una transicion donde no la hay
   (sin duration no anima), solo armoniza la curva --ease del Home en
   los hover/transiciones que la pagina YA declara en enlaces/botones.
   Sin transition-property ni duration para no animar layout por error. */
a,button{transition:color .3s,background-color .3s,border-color .3s,opacity .3s;transition-timing-function:cubic-bezier(.16,1,.3,1) !important;}
a > svg, button > svg{ flex:none; }

/* lente design-taste / ui-ux / emil: scrollbar sutil de marca.
   Ninguna de las 17 paginas define una -> 100% aditivo. Tinta
   translucida sobre off-white; overlay/pseudo-elemento que no afecta
   el flujo del contenido. Solo en punteros finos para no estorbar
   en tactil. */
@media (pointer:fine){
  ::-webkit-scrollbar{ width:10px; height:10px; }
  ::-webkit-scrollbar-track{ background:#F5F4F1; }
  ::-webkit-scrollbar-thumb{
    background:rgba(29,29,27,.22);
    border:2px solid #F5F4F1; border-radius:10px;
  }
  ::-webkit-scrollbar-thumb:hover{ background:rgba(29,29,27,.40); }
}
html{ scrollbar-width:thin; scrollbar-color:rgba(29,29,27,.30) #F5F4F1; }

/* NOTA: se OMITE el override de color de <image-slot> (::part frame/ring).
   Conflictua con los placeholders OSCUROS intencionales de los heros
   (texto blanco encima): aclararlos baja el contraste del titular.
   Los placeholders ya traen su fondo correcto inline desde el diseno;
   la foto real los reemplaza despues. */

/* Bot Solideas (Botpress): burbuja encima del float de WhatsApp */
#webchat,#bp-web-widget,#bp-web-widget-container{z-index:180 !important;}
.bpFab,#webchat .bpFab{bottom:96px !important;right:20px !important;}

/* v2.9: minimo 16px de texto legible (labels micro/eyebrow se conservan) */
p:not(.micro):not(.eyebrow), li, dd, input, select, textarea{font-size:max(1em,16px);}

/* ===== v2.9.1: scroll horizontal sin barra + solo-horizontal en carruseles ===== */
.sol-hscroll{scrollbar-width:none !important;-ms-overflow-style:none !important;}
.sol-hscroll::-webkit-scrollbar{display:none !important;width:0 !important;height:0 !important;}
[style*="overflow-x:auto"],[style*="overflow-x: auto"]{scrollbar-width:none;-ms-overflow-style:none;}
[style*="overflow-x:auto"]::-webkit-scrollbar,[style*="overflow-x: auto"]::-webkit-scrollbar{display:none;height:0;}

/* ============================================================
   v3.0 — SPLIT HERO (sph): hero 100svh a dos paneles.
   data-side="left"  -> imagen izquierda (complementos)
   data-side="right" -> imagen derecha  (pergolas y cubiertas)
   El header del kit va fijo y solido: el hero desciende bajo el
   (padding-top = alto del bar) y completa exactamente 1 viewport.
   ============================================================ */
.sph{position:relative;display:grid;grid-template-columns:repeat(2,1fr);min-height:100vh;min-height:100svh;padding-top:74px;background:#262626;overflow:hidden;}
.sph-media{position:relative;overflow:hidden;background:#141412;}
.sph[data-side="right"] .sph-media{order:2;}
.sph[data-side="right"] .sph-info{order:1;}
.sph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.sph-chip{position:absolute;left:22px;bottom:22px;z-index:2;font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-size:11px;font-weight:600;line-height:1;letter-spacing:.22em;text-transform:uppercase;color:#fff;background:rgba(20,20,18,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:10px 14px;border-radius:10px;}
.sph[data-side="right"] .sph-chip{left:auto;right:22px;}
.sph-info{position:relative;display:flex;flex-direction:column;justify-content:center;padding:clamp(36px,6vh,64px) clamp(28px,6vw,92px) clamp(64px,9vh,92px);background:#262626;}
.sph-stack{max-width:580px;}
.sph-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 clamp(16px,2.4vh,24px);font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-size:12px;font-weight:600;line-height:1.4;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.72);}
.sph-eyebrow::before{content:"";width:26px;height:1px;background:rgba(255,255,255,.85);flex:none;}
.sph-title{margin:0 0 clamp(16px,2.6vh,26px);font-family:'Archivo',system-ui,sans-serif;font-weight:800;font-size:clamp(38px,4.4vw,64px);line-height:1.03;letter-spacing:-.02em;color:#fff;text-wrap:balance;}
.sph-title em{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-weight:600;letter-spacing:0;}
.sph-lead{margin:0 0 clamp(24px,3.6vh,36px);font-size:17px;line-height:1.62;color:rgba(255,255,255,.72);max-width:52ch;}
.sph-ctas{display:flex;flex-wrap:wrap;gap:12px;}
.sph-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:16px 28px;border-radius:10px;font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-size:15px;font-weight:700;line-height:1;text-decoration:none;transition:transform .3s cubic-bezier(.16,1,.3,1),background .3s cubic-bezier(.16,1,.3,1),color .3s cubic-bezier(.16,1,.3,1),border-color .3s cubic-bezier(.16,1,.3,1);}
.sph-btn svg{flex:none;}
.sph-btn--primary{background:#fff;color:#1d1d1b;border:1px solid #fff;}
.sph-btn--primary:hover{transform:translateY(-2px);}
.sph-btn--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.32);}
.sph-btn--ghost:hover{border-color:#fff;transform:translateY(-2px);}
.sph-specs{list-style:none;display:flex;margin:clamp(28px,4.4vh,44px) 0 0;padding:clamp(20px,3vh,26px) 0 0;border-top:1px solid rgba(255,255,255,.16);}
.sph-spec{flex:1;display:flex;flex-direction:column;gap:5px;padding-right:18px;}
.sph-spec + .sph-spec{padding-left:18px;border-left:1px solid rgba(255,255,255,.16);}
.sph-spec strong{font-family:'Archivo',system-ui,sans-serif;font-weight:800;font-size:clamp(19px,1.8vw,24px);letter-spacing:-.01em;color:#fff;}
.sph-spec span{font-size:13px;line-height:1.4;color:rgba(255,255,255,.62);}
.sph-cue{position:absolute;bottom:24px;left:clamp(28px,6vw,92px);display:flex;align-items:center;gap:10px;font-family:'Cera Pro',system-ui,sans-serif;font-size:10.5px;font-weight:600;line-height:1;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.55);}
.sph-cue i{width:34px;height:1px;background:rgba(255,255,255,.55);transform-origin:left center;animation:sphCue 2.6s cubic-bezier(.16,1,.3,1) infinite;}
@keyframes sphUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes sphImgL{from{clip-path:inset(0 100% 0 0);transform:scale(1.05)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes sphImgR{from{clip-path:inset(0 0 0 100%);transform:scale(1.05)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes sphCue{0%,100%{transform:scaleX(.35);opacity:.4}50%{transform:scaleX(1);opacity:1}}
.sph-eyebrow,.sph-title,.sph-lead,.sph-ctas,.sph-specs{animation:sphUp .75s cubic-bezier(.16,1,.3,1) both;}
.sph-eyebrow{animation-delay:.08s}.sph-title{animation-delay:.16s}.sph-lead{animation-delay:.24s}.sph-ctas{animation-delay:.32s}.sph-specs{animation-delay:.42s}
.sph[data-side="left"] .sph-img{animation:sphImgL 1.05s cubic-bezier(.16,1,.3,1) both;}
.sph[data-side="right"] .sph-img{animation:sphImgR 1.05s cubic-bezier(.16,1,.3,1) both;}
.sph-chip{animation:sphUp .6s cubic-bezier(.16,1,.3,1) .55s both;}
@media (max-width:980px){
  .sph{grid-template-columns:1fr;}
  .sph-media{order:-1 !important;min-height:42svh;max-height:50svh;}
  .sph[data-side="right"] .sph-info{order:0;}
  .sph-info{justify-content:flex-start;padding:clamp(26px,4.5vh,38px) clamp(20px,5vw,32px) 56px;}
  .sph-title{font-size:clamp(32px,9vw,44px);}
  .sph-lead{font-size:16px;}
  .sph-cue{display:none;}
  .sph-chip{left:16px;bottom:16px;}
  .sph[data-side="right"] .sph-chip{right:16px;}
  .sph[data-side="left"] .sph-img,.sph[data-side="right"] .sph-img{animation:sphUp .9s cubic-bezier(.16,1,.3,1) both;}
}
@media (max-width:680px){
  .sph{padding-top:64px;}
  .sph-spec{padding-right:12px;}
  .sph-spec + .sph-spec{padding-left:12px;}
}
@media (prefers-reduced-motion:reduce){
  .sph-eyebrow,.sph-title,.sph-lead,.sph-ctas,.sph-specs,.sph-img,.sph-chip{animation:none !important;}
  .sph-cue i{animation:none !important;transform:none;}
  .sph-btn:hover{transform:none !important;}
}

/* ============================================================
   v3.1 — BENTO BOARD (sbb): mosaico moderno de caracteristicas
   con popup explicativo por tarjeta (scroll-lock detras).
   Tarjetas: <button.sbb-card data-eyebrow data-title data-desc>
   Variantes de tamano: --xl (2x2) · --w (2x1) · --t (1x2)
   ============================================================ */
.sbb{padding:clamp(72px,9vw,116px) 0;background:#fff;}
.sbb-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(20px,5vw,48px);}
.sbb-head{max-width:720px;margin-bottom:clamp(30px,4.5vw,52px);}
.sbb-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 14px;font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#3b3b38;}
.sbb-eyebrow::before{content:"";width:26px;height:1px;background:#1d1d1b;flex:none;}
.sbb-title{margin:0;font-family:'Archivo',system-ui,sans-serif;font-weight:800;font-size:clamp(30px,4.2vw,52px);line-height:1.04;letter-spacing:-.02em;color:#1d1d1b;text-wrap:balance;}
.sbb-title em{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-weight:600;letter-spacing:0;}
.sbb-sub{margin:14px 0 0;font-size:16px;line-height:1.6;color:#6e6e6a;max-width:56ch;}
.sbb-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,16.5vw,235px);grid-auto-flow:dense;gap:14px;}
.sbb-card{position:relative;display:block;padding:0;margin:0;border:0;border-radius:10px;overflow:hidden;cursor:pointer;text-align:left;background:#141412;-webkit-appearance:none;appearance:none;}
.sbb-card--xl{grid-column:span 2;grid-row:span 2;}
.sbb-card--w{grid-column:span 2;}
.sbb-card--t{grid-row:span 2;}
.sbb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.16,1,.3,1);}
.sbb-card:hover .sbb-img,.sbb-card:focus-visible .sbb-img{transform:scale(1.05);}
.sbb-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,18,0) 52%,rgba(20,20,18,.38) 74%,rgba(20,20,18,.72) 100%);pointer-events:none;}
.sbb-meta{position:absolute;left:18px;right:56px;bottom:16px;display:flex;flex-direction:column;gap:5px;pointer-events:none;}
.sbb-k{display:none;}
.sbb-t{font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-style:normal;font-weight:700;font-size:clamp(15.5px,1.5vw,20px);letter-spacing:.01em;line-height:1.25;color:#fff;text-wrap:balance;}
.sbb-plus{position:absolute;right:14px;bottom:14px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.35);color:#fff;transition:transform .35s cubic-bezier(.16,1,.3,1),background .35s cubic-bezier(.16,1,.3,1),color .35s cubic-bezier(.16,1,.3,1);pointer-events:none;}
.sbb-plus svg{display:block;}
.sbb-card:hover .sbb-plus,.sbb-card:focus-visible .sbb-plus{transform:rotate(90deg);background:#fff;color:#1d1d1b;}
.sbb-card:focus-visible{outline:2px solid #1d1d1b;outline-offset:3px;}
@media (max-width:980px){
  .sbb-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(132px,22vw,190px);}
  .sbb-card--t{grid-row:span 1;}
  .sbb-meta{left:14px;right:50px;bottom:12px;}
}
@media (max-width:560px){
  .sbb-grid{gap:10px;grid-auto-rows:clamp(120px,26vw,160px);}
  .sbb-t{font-size:15.5px;}
  .sbb-plus{width:30px;height:30px;right:10px;bottom:10px;}
}
/* popup */
.sbbm{position:fixed;inset:0;z-index:420;display:none;align-items:center;justify-content:center;padding:18px;}
.sbbm.on{display:flex;}
.sbbm-bg{position:absolute;inset:0;background:rgba(18,18,16,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .25s cubic-bezier(.16,1,.3,1);}
.sbbm.is-in .sbbm-bg{opacity:1;}
.sbbm-card{position:relative;display:grid;grid-template-columns:1.05fr .95fr;width:min(880px,94vw);max-height:min(86vh,640px);background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 48px 90px -32px rgba(0,0,0,.55);opacity:0;transform:translateY(14px) scale(.965);transition:opacity .3s cubic-bezier(.16,1,.3,1),transform .35s cubic-bezier(.16,1,.3,1);}
.sbbm.is-in .sbbm-card{opacity:1;transform:none;}
.sbbm-media{position:relative;min-height:320px;background:#141412;}
.sbbm-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.sbbm-body{padding:clamp(26px,4vw,46px);display:flex;flex-direction:column;justify-content:center;gap:12px;overflow-y:auto;}
.sbbm-k{display:flex;align-items:center;gap:10px;margin:0;font-family:'Cera Pro','Archivo',system-ui,sans-serif;font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#3b3b38;}
.sbbm-k::before{content:"";width:22px;height:1px;background:#1d1d1b;flex:none;}
.sbbm-t{margin:0;font-family:'Archivo',system-ui,sans-serif;font-weight:800;font-size:clamp(22px,2.6vw,30px);line-height:1.08;letter-spacing:-.015em;color:#1d1d1b;text-wrap:balance;}
.sbbm-d{margin:0;font-size:16px;line-height:1.68;color:#6e6e6a;}
.sbbm-x{position:absolute;top:14px;right:14px;z-index:2;width:40px;height:40px;border-radius:10px;border:1px solid rgba(0,0,0,.14);background:#fff;color:#1d1d1b;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .25s cubic-bezier(.16,1,.3,1),color .25s cubic-bezier(.16,1,.3,1);}
.sbbm-x:hover{background:#1d1d1b;color:#fff;}
.sbbm-card.no-media{grid-template-columns:1fr;}
.sbbm-card.no-media .sbbm-media{display:none;}
@media (max-width:760px){
  .sbbm{padding:12px;}
  .sbbm-card{grid-template-columns:1fr;width:min(560px,96vw);max-height:90vh;overflow-y:auto;}
  .sbbm-media{min-height:0;height:36vh;}
  .sbbm-body{justify-content:flex-start;padding:22px;}
}
@media (prefers-reduced-motion:reduce){
  .sbb-img,.sbb-plus,.sbbm-bg,.sbbm-card{transition:none !important;}
  .sbb-card:hover .sbb-img{transform:none;}
  .sbbm-bg,.sbbm-card{opacity:1;transform:none;}
}