/* Bienvenida Inmoribera × Centry
   Mismos tokens y fuente que iacentry.com (tema oscuro, Jakarta).
   Autocontenido: no depende del build de centry-web-src. */

@font-face{font-family:'Jakarta';src:url('../fonts/pjs-var.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'Jakarta-fb';src:local('Segoe UI'),local('Helvetica Neue'),local('Arial');size-adjust:109.5%;ascent-override:94.8%;descent-override:20.3%;line-gap-override:0%}

:root{
  --bg:#000;--bg-1:#0a0a09;--bg-2:#111110;
  --line:#191817;--line-2:#302e2b;--line-3:#605d57;
  --fg:#fff;--fg-2:#c7c4be;--fg-3:#918d86;--fg-4:#88847d;
  --signal:#fff;--signal-bg:rgba(255,255,255,.07);
  --acc:#ff8080;            /* acento de Centry */
  --inmo:#cb0233;           /* rojo de Inmoribera, solo como detalle */
  --f-sans:'Jakarta','Jakarta-fb',system-ui,-apple-system,'Segoe UI',sans-serif;
  --t-display:clamp(2.2rem,5.2vw,4.1rem);
  --t-h2:clamp(1.75rem,3.6vw,2.7rem);
  --t-h3:clamp(1.18rem,1.9vw,1.5rem);
  --t-lead:clamp(1.1rem,.9rem + .9vw,1.28rem);
  --t-body:1.0625rem;--t-sm:.96rem;--t-xs:.875rem;--t-label:.78rem;
  --s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.5rem;--s6:2rem;--s7:2.75rem;--s8:4rem;
  --section-y:clamp(4rem,8.5vw,7.5rem);
  --gutter:clamp(1.25rem,4.6vw,3rem);
  --maxw:1080px;--measure:62ch;
  --e-out:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--fg);font-family:var(--f-sans);
  font-size:var(--t-body);line-height:1.62;word-spacing:.08em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit}
::selection{background:#fff;color:#000}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
strong,b{font-weight:700;color:var(--fg)}

.skip{position:absolute;top:-999px;left:var(--s4);z-index:50;background:#fff;color:#000;padding:.7rem 1.2rem;font-weight:600;text-decoration:none}
.skip:focus{top:var(--s4)}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);width:100%}
.sect{position:relative;padding-block:var(--section-y);border-top:1px solid var(--line)}

/* Tipografía */
.display,.h2,.h3{text-wrap:balance;word-spacing:normal}
.display{font-size:var(--t-display);font-weight:800;letter-spacing:-.032em;line-height:1.07}
.h2{font-size:var(--t-h2);font-weight:800;letter-spacing:-.028em;line-height:1.1}
.h3{font-size:var(--t-h3);font-weight:700;letter-spacing:-.016em;line-height:1.2}
.lead{font-size:var(--t-lead);line-height:1.62;color:var(--fg-2);max-width:var(--measure)}
.body{color:var(--fg-2);max-width:var(--measure)}
.sm{font-size:var(--t-sm);color:var(--fg-3);line-height:1.7}
em.hi{color:var(--acc);font-style:normal}
.label{
  display:flex;align-items:center;gap:.7rem;font-size:var(--t-label);letter-spacing:.15em;
  font-weight:600;text-transform:uppercase;color:var(--fg-3);margin-bottom:var(--s5);
}
.label::before{content:"";width:1.6rem;height:1px;background:var(--acc);flex:none}
@media(max-width:700px){.display br,.h2 br{display:none}}

/* Cabecera */
.hdr{position:sticky;top:0;z-index:20;background:rgba(0,0,0,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hdr-in{max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter);height:4.4rem;display:flex;align-items:center;justify-content:space-between;gap:var(--s5)}
.brand{font-weight:800;font-size:1.4rem;letter-spacing:.26em;text-transform:uppercase;text-decoration:none;color:var(--fg);margin-right:-.26em}
.hdr-tag{font-size:var(--t-label);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3);font-weight:600}
@media(max-width:480px){.hdr-tag{display:none}}

/* Hero */
.hero{position:relative;padding-block:clamp(3.5rem,8vw,7rem) clamp(3rem,6vw,5rem)}
.rule-grid{
  position:absolute;inset:0;pointer-events:none;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 55%,transparent 92%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 55%,transparent 92%);
}
.rule-grid span{position:absolute;top:0;bottom:0;width:1px;background:#1a1918}
.rule-grid span:nth-child(1){left:25%}.rule-grid span:nth-child(2){left:50%}.rule-grid span:nth-child(3){left:75%}
@media(max-width:820px){.rule-grid span:nth-child(1),.rule-grid span:nth-child(3){display:none}}
@media(max-width:600px){.rule-grid{display:none}}
.hero-in{position:relative;z-index:1}
.hero .display{max-width:17ch;margin-bottom:var(--s5)}
.pair{display:flex;align-items:center;gap:var(--s4);margin-top:var(--s7);flex-wrap:wrap}
.pair-logo{background:#fff;border-radius:6px;padding:4px;width:132px;flex:none}
.pair-logo img{border-radius:3px}
.pair-txt{font-size:var(--t-sm);color:var(--fg-3);line-height:1.5}
.pair-txt b{display:block;color:var(--fg-2);font-weight:600}

/* Cabecera de sección */
.hdr-lead{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--s7);align-items:end;margin-bottom:clamp(2.2rem,5vw,3.6rem)}
@media(max-width:820px){.hdr-lead{grid-template-columns:1fr;gap:var(--s4)}}

/* Tres ideas */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-2)}
.pillar{padding:var(--s6) var(--s5) var(--s6) 0;border-right:1px solid var(--line)}
.pillar + .pillar{padding-left:var(--s5)}
.pillar:last-child{border-right:none;padding-right:0}
.pillar-n{font-size:var(--t-label);letter-spacing:.08em;color:var(--fg-3);font-variant-numeric:tabular-nums;display:block;margin-bottom:var(--s4)}
.pillar h3{margin-bottom:var(--s3)}
.pillar p{font-size:var(--t-sm);color:var(--fg-3);line-height:1.7}
.pillar p + p{margin-top:var(--s3)}
.pillar .ej{color:var(--fg-2)}
@media(max-width:860px){
  .pillars{grid-template-columns:1fr}
  .pillar,.pillar + .pillar{padding:var(--s5) 0;border-right:none;border-bottom:1px solid var(--line)}
  .pillar:last-child{border-bottom:none}
}

/* Ejemplo: un domingo a las 23:40 */
.demo{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,4rem);margin-top:clamp(2.5rem,6vw,4.5rem);padding:clamp(1.4rem,3.5vw,2.6rem);background:var(--bg-1);border:1px solid var(--line-2)}
.demo-txt .h3{margin-bottom:var(--s3)}
.demo-txt .sm{max-width:44ch}
.demo-flag{display:inline-block;margin-top:var(--s5);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-4);font-weight:600;border:1px dashed var(--line-3);padding:.35rem .7rem}
@media(max-width:820px){.demo{grid-template-columns:1fr}}
.chat{display:flex;flex-direction:column;gap:var(--s3);max-width:34rem;width:100%;margin-inline:auto}
.bub{max-width:88%;padding:.75rem 1rem;font-size:var(--t-sm);line-height:1.55;border:1px solid var(--line-2);background:var(--bg-2);color:var(--fg-2)}
.bub small{display:block;margin-top:.35rem;font-size:.75rem;color:var(--fg-4);letter-spacing:.04em}
.bub--in{align-self:flex-start;border-radius:2px 14px 14px 14px}
.bub--out{align-self:flex-end;border-radius:14px 2px 14px 14px;background:#fff;border-color:#fff;color:#111}
.bub--out small{color:#5a5650}
.note{align-self:stretch;display:flex;gap:.7rem;align-items:flex-start;font-size:var(--t-xs);color:var(--fg-2);line-height:1.55;border-left:2px solid var(--inmo);background:var(--signal-bg);padding:.8rem 1rem}
.note b{display:block;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);font-weight:600;margin-bottom:.15rem}

/* Pasos */
.proc{max-width:760px}
.step{display:grid;grid-template-columns:4.2rem minmax(0,1fr);gap:var(--s4);padding-block:var(--s6);border-top:1px solid var(--line)}
.step:first-child{border-top:none;padding-top:0}
.step-n{font-size:var(--t-label);letter-spacing:.08em;color:var(--signal);padding-top:.5rem;font-variant-numeric:tabular-nums;text-transform:uppercase;font-weight:600}
.step h3{font-size:clamp(1.3rem,1.05rem + .8vw,1.6rem);font-weight:700;letter-spacing:-.016em;line-height:1.22;margin-bottom:.5rem;text-wrap:balance;word-spacing:normal}
.step p{font-size:var(--t-sm);color:var(--fg-3);line-height:1.75;max-width:58ch}
.step .step-out{margin-top:var(--s3);padding-top:var(--s3);border-top:1px dashed var(--line-2);font-size:var(--t-label);letter-spacing:.07em;font-weight:600;text-transform:uppercase;color:var(--fg-4)}
.step .step-out b{color:var(--fg-2);font-weight:400}
.step--after .step-n{color:var(--acc)}
.step .step-date{font-size:var(--t-label);letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--acc);margin-bottom:.45rem}
@media(max-width:560px){.step{grid-template-columns:1fr;gap:var(--s2)}.step-n{padding-top:0}}

.stmt{border-left:2px solid var(--signal);background:var(--signal-bg);padding:1.35rem 1.6rem;margin-top:var(--s7);max-width:760px}
.stmt p{font-size:1.18rem;font-weight:700;line-height:1.45;max-width:46ch}
.stmt small{display:block;font-size:var(--t-xs);color:var(--fg-2);margin-top:.5rem;line-height:1.65;font-weight:400;max-width:62ch}

/* Lo que necesitamos */
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.need{border-top:1px solid var(--line-3);padding-top:var(--s4)}
.need h3{font-size:1.1rem;font-weight:700;margin-bottom:.4rem;letter-spacing:-.01em;word-spacing:normal}
.need p{font-size:var(--t-sm);color:var(--fg-3);line-height:1.7}
@media(max-width:760px){.needs{grid-template-columns:1fr;gap:var(--s5)}}

/* Cierre */
.close{padding-block:clamp(4rem,9vw,7.5rem)}
.close .display{max-width:16ch;margin-bottom:var(--s5)}
.contact{margin-top:var(--s6);font-size:var(--t-sm);color:var(--fg-3)}
.contact a{color:var(--fg);text-decoration-color:var(--line-3);text-underline-offset:.25em}
.contact a:hover{text-decoration-color:var(--acc)}

.ftr{border-top:1px solid var(--line);padding-block:var(--s6)}
.ftr-in{display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;font-size:var(--t-xs);color:var(--fg-4)}

/* Entrada al hacer scroll: solo transform y opacity; sin JS todo se ve */
.js [data-rv]{opacity:0;transform:translateY(18px);transition:opacity .8s var(--e-out),transform .8s var(--e-out);transition-delay:calc(var(--d,0) * 90ms)}
.js [data-rv].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js [data-rv]{transition:opacity .3s linear;transform:none}
}
/* ── Cursor burbuja (mismo que iacentry.com) ──────────────────────
   Anillo de 40 px que crece a 64 al pasar por lo clicable, punto de 5 px.
   El cursor nativo solo se apaga cuando el sustituto ya existe en el DOM. */
:root{--cur-size:40px;--cur-hot:1.6;--cur-bd:rgba(255,255,255,.58);--cur-bd-hot:rgba(255,255,255,.9);--cur-fill-hot:rgba(255,255,255,.06);--cur-dot:#fff}
html.cur-on,html.cur-on *,html.cur-on *::before,html.cur-on *::after{cursor:none!important}
.cur,.cur-dot{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;opacity:0;transition:opacity .25s ease;will-change:transform}
.cur.is-on,.cur-dot.is-on{opacity:1}
.cur-dot{width:5px;height:5px;border-radius:50%;background:var(--cur-dot);box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.cur{width:0;height:0}
.cur__ring{
  position:absolute;top:0;left:0;width:var(--cur-size);height:var(--cur-size);box-sizing:border-box;
  border:1.5px solid var(--cur-bd);border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.22);
  transform:translate(-50%,-50%) scale(1);
  transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s ease,border-width .3s ease,background-color .3s ease;
}
.cur.is-hot .cur__ring{transform:translate(-50%,-50%) scale(var(--cur-hot));border-color:var(--cur-bd-hot);border-width:.94px;background-color:var(--cur-fill-hot)}
.cur.is-down .cur__ring{transform:translate(-50%,-50%) scale(.85)}
.cur.is-hot.is-down .cur__ring{transform:translate(-50%,-50%) scale(calc(var(--cur-hot) * .88))}
@media(pointer:coarse),(hover:none){
  html.cur-on,html.cur-on *,html.cur-on *::before,html.cur-on *::after{cursor:auto!important}
  .cur,.cur-dot{display:none!important}
}
@media(forced-colors:active){
  html.cur-on,html.cur-on *{cursor:auto!important}
  .cur,.cur-dot{display:none!important}
}
@media print{.hdr{position:static}.js [data-rv]{opacity:1;transform:none}}
