/* ==========================================================
   Habita · Tema «Noche»
   Casa moderna al anochecer: grafito, luz cálida de ventanas,
   agua turquesa de alberca y vidrio.
   ========================================================== */
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Regular.woff") format("woff"); font-weight: 100 549; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Bold.woff") format("woff"); font-weight: 550 900; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url("../fonts/InstrumentSerif-Regular.woff") format("woff"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url("../fonts/InstrumentSerif-Italic.woff") format("woff"); font-weight: 400; font-style: italic; font-display: swap; }

:root {
    color-scheme: dark;
    --hb-bg: #0b0c0e;
    --hb-s1: #111315;
    --hb-s2: #17191c;
    --hb-s3: #1f2226;
    --hb-line: rgb(255 255 255 / 8%);
    --hb-line-2: rgb(255 255 255 / 14%);
    --hb-text: #eeebe5;
    --hb-muted: #a8a39b;
    --hb-dim: #7f7b75;
    --hb-pill: #f5f2ec;
    --hb-glow: #f2b766;      /* luz cálida de ventana */
    --hb-glow-2: #ffd9a3;
    --hb-pool: #4fd1c5;      /* agua de alberca */
    --hb-serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
    --font-sans: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

    /* Tailwind → noche (claros y oscuros invertidos) */
    --color-white: #111315;
    --color-black: #f5f2ec;
    --color-slate-50: #0f1113; --color-slate-100: #17191c; --color-slate-200: #24272b; --color-slate-300: #34373c;
    --color-slate-400: #85817a; --color-slate-500: #a29d95; --color-slate-600: #bab5ad; --color-slate-700: #d0cbc3;
    --color-slate-800: #e3dfd8; --color-slate-900: #f2efe9; --color-slate-950: #ffffff;
    --color-gray-50: #0f1113; --color-gray-100: #17191c; --color-gray-200: #24272b; --color-gray-300: #34373c;
    --color-gray-400: #85817a; --color-gray-500: #a29d95; --color-gray-600: #bab5ad; --color-gray-700: #d0cbc3;
    --color-gray-800: #e3dfd8; --color-gray-900: #f2efe9;
    --color-neutral-50: #0f1113; --color-neutral-100: #17191c; --color-neutral-200: #24272b; --color-neutral-300: #34373c;
    --color-neutral-400: #85817a; --color-neutral-500: #a29d95; --color-neutral-600: #bab5ad; --color-neutral-700: #d0cbc3;
    --color-neutral-800: #e3dfd8; --color-neutral-900: #f2efe9; --color-neutral-950: #ffffff;
    /* marca: píldora clara + luz cálida */
    --color-emerald-50: #1d1912; --color-emerald-100: #272015; --color-emerald-200: #3b301e; --color-emerald-300: #5e4b2b;
    --color-emerald-400: #b8925a; --color-emerald-500: #e0ad68; --color-emerald-600: #f5f2ec; --color-emerald-700: #f2b766;
    --color-emerald-800: #f4c584; --color-emerald-900: #f7d6a6; --color-emerald-950: #fbe8cb;
    --color-amber-50: #231a0b; --color-amber-100: #2d210d; --color-amber-200: #463312; --color-amber-300: #6d4e18;
    --color-amber-500: #f5a524; --color-amber-600: #fbbf24; --color-amber-700: #fcd34d; --color-amber-800: #fde68a;
    --color-amber-900: #fef3c7; --color-amber-950: #fffbeb;
    --color-orange-50: #26170c; --color-orange-800: #fdba74;
    --color-red-50: #2a1213; --color-red-100: #381719; --color-red-200: #55201f; --color-red-600: #f87171;
    --color-red-700: #fca5a5; --color-red-800: #fecaca;
    --color-rose-50: #2a1218; --color-rose-100: #36171e; --color-rose-200: #55202b; --color-rose-500: #fb7185;
    --color-rose-600: #fb7185; --color-rose-700: #fda4af; --color-rose-800: #fecdd3; --color-rose-900: #ffe4e6; --color-rose-950: #fff1f2;
    --color-blue-50: #0e1d21; --color-blue-100: #12272c; --color-blue-300: #1f5a60; --color-blue-500: #4fd1c5;
    --color-blue-600: #6fdcd2; --color-blue-700: #8fe6de; --color-blue-800: #b2efe9; --color-blue-900: #d4f7f3; --color-blue-950: #ecfdfb;
    --color-violet-50: #1b1726; --color-violet-100: #231d31; --color-violet-800: #ddd6fe;
}

html { font-size: 100%; background: var(--hb-bg); }
body {
    background:
        radial-gradient(60rem 40rem at 85% -10%, rgb(242 183 102 / 7%), transparent 60%),
        radial-gradient(50rem 30rem at -10% 110%, rgb(79 209 197 / 5%), transparent 60%),
        var(--hb-bg) !important;
    background-attachment: fixed !important;
    color: var(--hb-text);
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
}
::selection { background: rgb(242 183 102 / 35%); color: #fff; }
* { scrollbar-color: rgb(255 255 255 / 16%) transparent; }

/* Fondos fijos del diseño anterior */
.bg-\[\#f5f6f8\] { background-color: transparent !important; }
.bg-\[\#122d29\] { background-color: var(--hb-pill) !important; color: #111315 !important; }
.text-\[\#122d29\] { color: var(--hb-text) !important; }

/* Títulos con serif elegante (como revista de arquitectura) */
#content h1, .hb-serif, .adm-title, main h1 {
    font-family: var(--hb-serif) !important; font-weight: 400 !important; letter-spacing: -.01em !important;
}
#content h1:not(.hb-title) { font-size: clamp(2rem, 1.4rem + 2vw, 2.9rem); line-height: 1.05; }

/* ---------- Formularios ---------- */
input, select, textarea { color-scheme: dark; }
.field-label { color: var(--hb-muted) !important; font-size: .9rem; }
.field-input, input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="month"], input[type="url"], select, textarea {
    background-color: var(--hb-s2);
    border-color: var(--hb-line-2);
    color: var(--hb-text);
}
.field-input { border-radius: .9rem; }
.field-input::placeholder, input::placeholder, textarea::placeholder { color: var(--hb-dim); }
.field-input:focus, input:focus, select:focus, textarea:focus { border-color: var(--hb-glow) !important; box-shadow: 0 0 0 4px rgb(242 183 102 / 14%) !important; outline: none; }
option { background: var(--hb-s2); color: var(--hb-text); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--hb-glow); }

/* ---------- Botones: píldora clara con flecha (como la referencia) ---------- */
.button-primary {
    border-radius: 999px !important; background: var(--hb-pill) !important; color: #111315 !important;
    box-shadow: 0 10px 30px rgb(0 0 0 / 35%), inset 0 -1px 0 rgb(0 0 0 / 8%) !important;
    transition: transform .15s ease, box-shadow .2s ease, background .2s ease !important;
}
.button-primary:hover { background: #ffffff !important; transform: translateY(-1px); box-shadow: 0 14px 34px rgb(242 183 102 / 22%) !important; }
.button-primary svg { width: 1.9rem; height: 1.9rem; padding: .4rem; border-radius: 999px; background: #111315; color: #fff; }
.button-secondary { border-radius: 999px !important; background: transparent !important; border-color: var(--hb-line-2) !important; color: var(--hb-text) !important; }
.button-secondary:hover { background: rgb(255 255 255 / 6%) !important; }
.habita-floating-ai { background: var(--hb-pill) !important; color: #111315 !important; box-shadow: 0 12px 30px rgb(0 0 0 / 45%), 0 0 0 1px rgb(255 255 255 / 10%) !important; }
.habita-floating-ai:hover { background: #fff !important; }
.habita-floating-help { display: none !important; }
.habita-assistant-dialog { background: var(--hb-s1) !important; color: var(--hb-text) !important; border-color: var(--hb-line-2) !important; }

/* Tarjetas con borde fino y brillo superior */
#content .rounded-2xl.bg-white, #content .rounded-xl.bg-white, #content .adm-card, #content .hs-card, #content .ez-step {
    border-color: var(--hb-line) !important;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 4%), 0 20px 40px -24px rgb(0 0 0 / 60%) !important;
}
#content table thead, #content table th { color: var(--hb-muted); }
#content hr { border-color: var(--hb-line); }

/* Paginación de Laravel (usa clases dark: propias) */
nav[role="navigation"] a, nav[role="navigation"] span[aria-current] > span, nav[role="navigation"] span[aria-disabled] > span, nav[role="navigation"] .relative {
    background-color: var(--hb-s2) !important; color: var(--hb-text) !important; border-color: var(--hb-line) !important;
}
nav[role="navigation"] span[aria-current] > span { background: var(--hb-pill) !important; color: #111315 !important; }
nav[role="navigation"] p { color: var(--hb-muted) !important; }

/* ---------- Encabezado superior ---------- */
header.sticky { background: rgb(11 12 14 / 72%) !important; backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); border-color: var(--hb-line) !important; }
.hb-search { position: relative; display: none; align-items: center; flex: 1; max-width: 26rem; }
.hb-search svg { position: absolute; left: .9rem; width: 1.05rem; height: 1.05rem; color: var(--hb-dim); pointer-events: none; }
.hb-search input { width: 100%; min-height: 2.75rem; padding: .55rem 1rem .55rem 2.6rem; border-radius: 999px; border: 1px solid var(--hb-line); background: rgb(255 255 255 / 4%); color: var(--hb-text); font: inherit; font-size: .9rem; transition: border-color .2s, background .2s; }
.hb-search input:focus { background: rgb(255 255 255 / 7%); }

/* ==========================================================
   Menú lateral de vidrio
   ========================================================== */
:root {
    --hx-line: var(--hb-line);
    --hx-text: #c9c4bc;
    --hx-dim: #7f7b75;
    --hx-strong: #f5f2ec;
    --hx-hover: rgb(255 255 255 / 5%);
    --hx-w: 17.5rem;
    --hx-w-mini: 5rem;
}
.hx-aside { display: none; }
@media (min-width: 64rem) {
    .hx-aside {
        position: sticky; top: 0; z-index: 30;
        display: flex; flex-direction: column; flex-shrink: 0;
        width: var(--hx-w); height: 100vh; height: 100dvh;
        background: linear-gradient(180deg, rgb(20 22 25 / 92%), rgb(11 12 14 / 96%));
        border-right: 1px solid var(--hb-line);
        color: var(--hx-text);
        transition: width .25s cubic-bezier(.2,.8,.2,1);
    }
    .hx-aside::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 14rem; pointer-events: none; background: radial-gradient(18rem 10rem at 20% 0%, rgb(242 183 102 / 9%), transparent 70%); }
    html.hx-mini .hx-aside { width: var(--hx-w-mini); }
}
.hx-sheet { display: flex; flex-direction: column; height: 100%; min-height: 0; background: linear-gradient(180deg, #15171a, #0b0c0e); color: var(--hx-text); }
.habita-navigation-dialog { background: #0b0c0e; color: var(--hx-text); box-shadow: 16px 0 60px rgb(0 0 0 / 60%); }
.habita-navigation-dialog::backdrop { background: rgb(0 0 0 / 55%); backdrop-filter: blur(4px); }

.hx-brand { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 1.2rem 1rem .9rem 1.15rem; }
.hx-logo { display: flex; align-items: center; gap: .7rem; color: var(--hx-strong); text-decoration: none; min-width: 0; }
.hx-logo-mark {
    position: relative; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; flex-shrink: 0; border-radius: .85rem;
    background: linear-gradient(145deg, #2a2d33, #121417); color: var(--hb-glow-2);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 12%), 0 0 0 1px rgb(255 255 255 / 6%), 0 8px 24px rgb(242 183 102 / 18%);
}
.hx-logo-mark::after { content: ""; position: absolute; inset: auto 22% -2px; height: 2px; border-radius: 2px; background: var(--hb-glow); box-shadow: 0 0 12px 2px rgb(242 183 102 / 60%); }
.hx-logo-text { font-family: var(--hb-serif); font-size: 1.75rem; font-weight: 400; letter-spacing: -.01em; white-space: nowrap; }
.hx-logo-text span { color: var(--hb-glow); }
.hx-collapse, .hx-close {
    display: grid; place-items: center; flex-shrink: 0; cursor: pointer;
    border: 1px solid var(--hb-line); background: rgb(255 255 255 / 4%); color: var(--hx-text);
    border-radius: 999px; transition: background .15s, color .15s, transform .25s;
}
.hx-collapse { width: 2.1rem; height: 2.1rem; transform: rotate(180deg); }
.hx-close { width: 2.75rem; height: 2.75rem; }
.hx-collapse:hover, .hx-close:hover { background: rgb(255 255 255 / 10%); color: #fff; }

.hx-scroll { position: relative; z-index: 1; flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 .8rem 1rem; scrollbar-width: thin; }
.hx-foot { padding: .6rem .8rem; border-top: 1px solid var(--hb-line); }
.hx-sheet .hx-foot { padding-bottom: max(.75rem, env(safe-area-inset-bottom)); }
.hx-logout { display: flex; width: 100%; align-items: center; gap: .75rem; min-height: 2.75rem; padding: .5rem .6rem; border: 0; border-radius: .9rem; background: transparent; color: var(--hx-dim); font: inherit; font-size: .9rem; font-weight: 500; cursor: pointer; transition: background .15s, color .15s; }
.hx-logout:hover { background: rgb(248 113 113 / 10%); color: #fca5a5; }

.hx-nav { display: flex; flex-direction: column; gap: .35rem; }
.hx-me { display: flex; align-items: center; gap: .75rem; padding: .75rem; border-radius: 1.1rem; background: rgb(255 255 255 / 3.5%); border: 1px solid var(--hb-line); text-decoration: none; color: inherit; transition: background .2s, border-color .2s; }
.hx-me:hover { background: rgb(255 255 255 / 6%); border-color: var(--hb-line-2); }
.hx-avatar { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; flex-shrink: 0; border-radius: 999px; background: linear-gradient(145deg, var(--hb-glow-2), var(--hb-glow)); color: #2a1a05; font-weight: 700; font-size: 1rem; box-shadow: 0 0 0 3px rgb(242 183 102 / 15%); }
.hx-me-text { display: flex; flex-direction: column; min-width: 0; gap: .1rem; }
.hx-me-name { color: var(--hx-strong); font-size: .92rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-me-sub { color: var(--hx-dim); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-chip { align-self: flex-start; margin-top: .35rem; padding: .16rem .55rem; border-radius: 999px; font-size: .68rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; background: rgb(255 255 255 / 7%); color: #e8e3da; border: 1px solid var(--hb-line); }
.hx-chip--trial { background: rgb(79 209 197 / 12%); color: #a7f0e8; border-color: rgb(79 209 197 / 25%); }
.hx-chip--warn { background: rgb(242 183 102 / 12%); color: var(--hb-glow-2); border-color: rgb(242 183 102 / 25%); }
.hx-chip--admin { background: rgb(242 183 102 / 12%); color: var(--hb-glow-2); border-color: rgb(242 183 102 / 25%); }

.hx-quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; margin: .35rem 0 .4rem; }
.hx-quick a { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2.7rem; border-radius: 999px; background: var(--hb-pill); color: #111315; font-size: .85rem; font-weight: 700; text-decoration: none; box-shadow: 0 8px 22px rgb(0 0 0 / 35%); transition: transform .15s, box-shadow .2s, background .2s; }
.hx-quick a + a { background: transparent; color: var(--hx-strong); box-shadow: none; border: 1px solid var(--hb-line-2); }
.hx-quick a:hover { transform: translateY(-1px); background: #fff; box-shadow: 0 10px 26px rgb(242 183 102 / 20%); }
.hx-quick a + a:hover { background: rgb(255 255 255 / 7%); box-shadow: none; }

.hx-section { display: flex; flex-direction: column; gap: .15rem; }
.hx-heading { margin: .9rem 0 .35rem; padding: 0 .7rem; color: var(--hx-dim); font-size: .66rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.hx-section .hx-heading:first-child { margin-top: .7rem; }
.hx-ico { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; flex-shrink: 0; border-radius: .7rem; color: #9d988f; transition: background .2s, color .2s; }
.hx-link { position: relative; display: flex; align-items: center; gap: .7rem; min-height: 3rem; padding: .3rem .55rem .3rem .4rem; border-radius: 999px; color: var(--hx-text); font-size: .95rem; font-weight: 500; text-decoration: none; transition: background .2s, color .2s, transform .2s; }
.hx-link .hx-label { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-link:hover { background: var(--hx-hover); color: #fff; }
.hx-link:hover .hx-ico { color: var(--hb-glow-2); }
.hx-link.is-active { background: var(--hb-pill); color: #111315; font-weight: 650; box-shadow: 0 10px 26px rgb(0 0 0 / 40%), 0 0 0 1px rgb(255 255 255 / 30%); }
.hx-link.is-active .hx-ico { background: #111315; color: var(--hb-glow-2); box-shadow: 0 0 14px rgb(242 183 102 / 30%); }
.hx-link.is-active::before { content: ""; position: absolute; left: -.8rem; top: .7rem; bottom: .7rem; width: 3px; border-radius: 0 3px 3px 0; background: var(--hb-glow); box-shadow: 0 0 14px 2px rgb(242 183 102 / 55%); }
.hx-pill { margin-left: auto; min-width: 1.4rem; padding: .08rem .45rem; border-radius: 999px; background: var(--hb-glow); color: #2a1a05; font-size: .7rem; font-weight: 800; text-align: center; }
.hx-link.is-active .hx-pill { background: #111315; color: var(--hb-glow-2); }
.hx-pill--ghost { background: transparent; color: var(--hx-dim); min-width: 0; }

.hx-group { margin-top: .35rem; border-radius: 1.1rem; border: 1px solid transparent; transition: background .2s, border-color .2s; }
.hx-group[open] { background: rgb(255 255 255 / 2.5%); border-color: var(--hb-line); }
.hx-sum { display: flex; align-items: center; gap: .7rem; min-height: 3.1rem; padding: .35rem .55rem .35rem .4rem; border-radius: 1rem; list-style: none; cursor: pointer; color: var(--hx-text); transition: background .2s, color .2s; user-select: none; }
.hx-sum::-webkit-details-marker { display: none; }
.hx-sum:hover { background: var(--hx-hover); color: #fff; }
.hx-sum .hx-label { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.hx-sum-title { font-size: .95rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-sum-hint { margin-top: .05rem; color: var(--hx-dim); font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hx-chev { display: grid; place-items: center; color: var(--hx-dim); transition: transform .25s ease; }
.hx-group[open] > .hx-sum .hx-chev { transform: rotate(90deg); color: var(--hb-glow); }
.hx-group-body { display: flex; flex-direction: column; gap: .1rem; padding: 0 .3rem .45rem 1.1rem; position: relative; }
.hx-group-body::before { content: ""; position: absolute; left: 1.45rem; top: 0; bottom: .7rem; width: 1px; background: linear-gradient(var(--hb-line-2), transparent); }
.hx-group-body .hx-link { padding-left: .55rem; min-height: 2.75rem; font-size: .9rem; }
.hx-group-body .hx-link.is-active::before { left: -.1rem; }
.hx-group[open] .hx-group-body { animation: hx-drop .25s ease; }
@keyframes hx-drop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.hx-empty { margin: 1rem .5rem; padding: 1rem; border: 1px dashed var(--hb-line-2); border-radius: 1rem; color: var(--hx-text); font-size: .82rem; text-align: center; }
.hx-empty span { display: block; margin-top: .2rem; color: var(--hx-dim); font-size: .74rem; }

.hx-help { display: flex; flex-direction: column; gap: .3rem; margin-top: 1rem; padding: .45rem; border-radius: 1.1rem; background: rgb(255 255 255 / 3%); border: 1px solid var(--hb-line); }
.hx-help-row { display: flex; align-items: center; gap: .7rem; min-height: 2.9rem; padding: .3rem .4rem; border-radius: .85rem; color: var(--hx-text); text-decoration: none; transition: background .2s; }
.hx-help-row:hover { background: var(--hx-hover); }
.hx-help-row .hx-label { display: flex; flex-direction: column; min-width: 0; }
.hx-help-row strong { color: var(--hx-strong); font-size: .88rem; font-weight: 600; }
.hx-help-row small { color: var(--hx-dim); font-size: .74rem; }
.hx-help-row--wa .hx-ico { background: rgb(37 211 102 / 14%); color: #4ade80; }
.hx-help-row--wa:hover { background: rgb(37 211 102 / 8%); }

.hx-aside :focus-visible, .hx-sheet :focus-visible { outline: 2px solid var(--hb-glow); outline-offset: 2px; }

@media (min-width: 64rem) {
    html.hx-mini .hx-aside .hx-brand { flex-direction: column; padding: 1rem .5rem .6rem; }
    html.hx-mini .hx-aside .hx-logo-text, html.hx-mini .hx-aside .hx-label, html.hx-mini .hx-aside .hx-me-text,
    html.hx-mini .hx-aside .hx-heading, html.hx-mini .hx-aside .hx-chev, html.hx-mini .hx-aside .hx-pill--ghost,
    html.hx-mini .hx-aside .hx-empty { display: none !important; }
    html.hx-mini .hx-aside .hx-collapse { transform: none; }
    html.hx-mini .hx-aside .hx-scroll { padding: 0 .55rem 1rem; overflow-x: visible; }
    html.hx-mini .hx-aside .hx-me { justify-content: center; padding: .45rem; }
    html.hx-mini .hx-aside .hx-quick { grid-template-columns: 1fr; }
    html.hx-mini .hx-aside .hx-section { margin-top: .5rem; padding-top: .5rem; border-top: 1px solid var(--hb-line); }
    html.hx-mini .hx-aside .hx-link, html.hx-mini .hx-aside .hx-sum, html.hx-mini .hx-aside .hx-help-row, html.hx-mini .hx-aside .hx-logout { justify-content: center; padding: .35rem; }
    html.hx-mini .hx-aside .hx-group-body { padding: 0 0 .3rem; }
    html.hx-mini .hx-aside .hx-group-body::before { display: none; }
    html.hx-mini .hx-aside .hx-pill { position: absolute; top: .1rem; right: .1rem; min-width: 1.1rem; padding: 0 .25rem; font-size: .6rem; }
    html.hx-mini .hx-aside .hx-link.is-active::before { left: -.55rem; }
}
.hx-tip { position: fixed; z-index: 80; padding: .4rem .7rem; border-radius: .6rem; background: var(--hb-pill); color: #111315; font-size: .78rem; font-weight: 650; white-space: nowrap; box-shadow: 0 8px 24px rgb(0 0 0 / 45%); pointer-events: none; transform: translateY(-50%); }
.hx-tip[hidden] { display: none; }

/* ==========================================================
   Escenas de casas (hero) y vidrio
   ========================================================== */
.hb-hero { position: relative; isolation: isolate; overflow: hidden; border-radius: 1.75rem; border: 1px solid var(--hb-line); background: #07080a; min-height: 22rem; box-shadow: 0 40px 80px -40px rgb(0 0 0 / 80%); }
.hb-hero-media, .hb-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hb-hero-media { z-index: -2; overflow: hidden; }
.hb-hero-media img { object-fit: cover; object-position: var(--hb-focus, 60% 50%); max-width: none !important; }
.hb-hero-media .hb-on { opacity: 0; }
.hb-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
    linear-gradient(90deg, rgb(7 8 10 / 88%) 0%, rgb(7 8 10 / 55%) 38%, rgb(7 8 10 / 0%) 70%),
    linear-gradient(0deg, rgb(7 8 10 / 75%) 0%, transparent 45%); }
.hb-hero-body { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 1rem; min-height: inherit; padding: clamp(1.3rem, 1rem + 2vw, 2.6rem); max-width: 40rem; }
.hb-eyebrow { display: inline-flex; align-items: center; gap: .55rem; margin: 0; color: var(--hb-glow-2); font-size: .74rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.hb-eyebrow::before { content: ""; width: 1.8rem; height: 1px; background: currentColor; opacity: .7; }
.hb-title { margin: 0; font-family: var(--hb-serif); font-weight: 400; font-size: clamp(2.4rem, 1.6rem + 3.6vw, 4.4rem); line-height: .98; letter-spacing: -.015em; color: #fff; text-wrap: balance; }
.hb-title em { font-style: italic; color: var(--hb-glow-2); }
.hb-lead { margin: 0; max-width: 30rem; color: #d6d1c9; font-size: 1.05rem; line-height: 1.55; }
.hb-word { position: absolute; z-index: -1; left: 50%; top: 4%; transform: translateX(-50%); font-family: var(--font-sans); font-weight: 800; font-size: clamp(5rem, 15vw, 13rem); letter-spacing: .04em; line-height: 1; white-space: nowrap; color: transparent; background: linear-gradient(180deg, rgb(255 255 255 / 30%), rgb(255 255 255 / 3%)); -webkit-background-clip: text; background-clip: text; pointer-events: none; }
.hb-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: .3rem; }
.hb-pill { display: inline-flex; align-items: center; gap: .8rem; min-height: 3.2rem; padding: .35rem .4rem .35rem 1.35rem; border-radius: 999px; background: var(--hb-pill); color: #111315 !important; font-size: .95rem; font-weight: 700; text-decoration: none !important; box-shadow: 0 12px 30px rgb(0 0 0 / 45%); transition: transform .2s, box-shadow .25s, background .2s; }
.hb-pill i { display: grid; place-items: center; width: 2.45rem; height: 2.45rem; border-radius: 999px; background: #111315; color: #fff; font-style: normal; transition: transform .25s; }
.hb-pill:hover { transform: translateY(-2px); background: #fff; box-shadow: 0 16px 40px rgb(242 183 102 / 25%); }
.hb-pill:hover i { transform: translateX(3px) rotate(-30deg); }
.hb-pill--ghost { background: rgb(255 255 255 / 8%); color: #fff !important; border: 1px solid rgb(255 255 255 / 22%); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding-right: 1.35rem; box-shadow: none; }
.hb-pill--ghost:hover { background: rgb(255 255 255 / 16%); }
.hb-glass { background: rgb(18 20 23 / 52%); border: 1px solid rgb(255 255 255 / 14%); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); border-radius: 1.2rem; box-shadow: inset 0 1px 0 rgb(255 255 255 / 10%), 0 20px 40px -20px rgb(0 0 0 / 70%); }
.hb-stats { position: absolute; right: clamp(1rem, .6rem + 1.5vw, 2rem); top: clamp(1rem, .6rem + 1.5vw, 2rem); display: grid; gap: .6rem; width: min(13rem, 34%); }
.hb-stat { display: block; padding: .85rem 1rem; color: #fff !important; text-decoration: none !important; transition: transform .25s, background .25s; }
.hb-stat:hover { transform: translateX(-4px); background: rgb(30 33 37 / 62%); }
.hb-stat strong { display: block; font-family: var(--hb-serif); font-weight: 400; font-size: 1.9rem; line-height: 1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.hb-stat span { display: block; margin-top: .3rem; color: #cfc9c0; font-size: .76rem; line-height: 1.3; }
@media (max-width: 47.99rem) {
    .hb-stats { position: static; width: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: .4rem; }
    .hb-stat { padding: .7rem .75rem; }
    .hb-stat strong { font-size: 1.45rem; }
    .hb-hero::before { background: linear-gradient(0deg, rgb(7 8 10 / 92%) 0%, rgb(7 8 10 / 60%) 55%, rgb(7 8 10 / 15%) 100%); }
}

/* Animación: la casa enciende sus luces, la cámara se acerca y todo aparece con suavidad */
@media (prefers-reduced-motion: no-preference) {
    .hb-hero-media img { animation: hb-drift 22s ease-out both; }
    .hb-hero-media .hb-on { animation: hb-drift 22s ease-out both, hb-lights 2.6s .7s ease-in-out forwards; }
    .hb-reveal > * { animation: hb-rise .8s cubic-bezier(.2,.8,.2,1) both; }
    .hb-reveal > *:nth-child(2) { animation-delay: .08s; } .hb-reveal > *:nth-child(3) { animation-delay: .16s; }
    .hb-reveal > *:nth-child(4) { animation-delay: .24s; } .hb-reveal > *:nth-child(5) { animation-delay: .32s; }
    .hb-reveal > *:nth-child(6) { animation-delay: .4s; }
    .hb-stats > * { animation: hb-slide .9s cubic-bezier(.2,.8,.2,1) both; }
    .hb-stats > *:nth-child(1) { animation-delay: 1.1s; } .hb-stats > *:nth-child(2) { animation-delay: 1.25s; } .hb-stats > *:nth-child(3) { animation-delay: 1.4s; }
    .hb-word { animation: hb-fade 2.4s .2s ease both; }
    #content > * { animation: hb-rise .6s cubic-bezier(.2,.8,.2,1) both; }
    #content > *:nth-child(2) { animation-delay: .05s; } #content > *:nth-child(3) { animation-delay: .1s; } #content > *:nth-child(4) { animation-delay: .15s; }
}
@media (prefers-reduced-motion: reduce) { .hb-hero-media .hb-on { opacity: 1; } }
@keyframes hb-drift { from { transform: scale(1.12) translate3d(1.5%, 1%, 0); } to { transform: scale(1.02) translate3d(0, 0, 0); } }
@keyframes hb-lights { 0% { opacity: 0; } 30% { opacity: .35; } 38% { opacity: .2; } 100% { opacity: 1; } }
@keyframes hb-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes hb-slide { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes hb-fade { from { opacity: 0; letter-spacing: .2em; } to { opacity: 1; } }

/* Tarjetas tipo «servicios» de la referencia */
.hb-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
@media (min-width: 64rem) { .hb-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.hb-tile { position: relative; display: flex; flex-direction: column; gap: .5rem; min-height: 9.5rem; padding: 1.15rem; border-radius: 1.3rem; background: linear-gradient(160deg, var(--hb-s3), var(--hb-s1)); border: 1px solid var(--hb-line); color: var(--hb-text) !important; text-decoration: none !important; overflow: hidden; transition: transform .25s, border-color .25s, box-shadow .25s; }
.hb-tile::after { content: ""; position: absolute; inset: auto -30% -60% auto; width: 12rem; height: 12rem; border-radius: 999px; background: radial-gradient(rgb(242 183 102 / 16%), transparent 65%); opacity: 0; transition: opacity .3s; }
.hb-tile:hover { transform: translateY(-4px); border-color: rgb(242 183 102 / 35%); box-shadow: 0 24px 50px -24px rgb(242 183 102 / 35%); }
.hb-tile:hover::after { opacity: 1; }
.hb-tile-ico { display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border-radius: .9rem; background: rgb(255 255 255 / 5%); border: 1px solid var(--hb-line); color: var(--hb-glow-2); }
.hb-tile b { font-size: 1.02rem; font-weight: 650; line-height: 1.25; }
.hb-tile span { color: var(--hb-muted); font-size: .82rem; line-height: 1.4; }
.hb-tile .hb-go { position: absolute; right: 1rem; bottom: 1rem; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 999px; border: 1px solid var(--hb-line-2); color: var(--hb-text); font-size: .9rem; transition: background .25s, color .25s, transform .25s; }
.hb-tile:hover .hb-go { background: var(--hb-pill); color: #111315; transform: rotate(-30deg); }
.hb-tile--main { background: linear-gradient(160deg, #2a2418, #15130f 70%); border-color: rgb(242 183 102 / 25%); }
.hb-tile--main .hb-tile-ico { background: var(--hb-glow); color: #2a1a05; border: 0; box-shadow: 0 0 24px rgb(242 183 102 / 40%); }

/* Galería de propiedades («Proyectos seleccionados») */
.hb-strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(14rem, 1fr); gap: .8rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .3rem; }
.hb-card { position: relative; display: block; aspect-ratio: 4/3.2; border-radius: 1.3rem; overflow: hidden; border: 1px solid var(--hb-line); background: var(--hb-s2); scroll-snap-align: start; color: #fff !important; text-decoration: none !important; }
.hb-card img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.hb-card:hover img { transform: scale(1.06); }
.hb-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgb(7 8 10 / 90%), transparent 55%); }
.hb-card-info { position: absolute; z-index: 1; left: 1rem; right: 1rem; bottom: .9rem; }
.hb-card-info b { display: block; font-size: 1rem; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-card-info small { display: block; color: #d0cbc3; font-size: .8rem; }
.hb-card-tag { position: absolute; z-index: 1; top: .8rem; left: .8rem; padding: .25rem .65rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.hb-card-ph { display: grid; place-items: center; width: 100%; height: 100%; color: rgb(242 183 102 / 70%); background: radial-gradient(circle at 50% 120%, rgb(242 183 102 / 18%), transparent 60%), linear-gradient(160deg, var(--hb-s3), var(--hb-s1)); }

/* Secciones con título serif y enlace */
.hb-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.hb-section-head h2 { margin: 0; font-family: var(--hb-serif); font-weight: 400; font-size: 1.9rem; line-height: 1.05; color: var(--hb-text); }
.hb-section-head p { margin: 0 0 .3rem; color: var(--hb-dim); font-size: .7rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.hb-link-pill { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.4rem; padding: .3rem .95rem; border-radius: 999px; border: 1px solid var(--hb-line-2); color: var(--hb-text) !important; font-size: .82rem; font-weight: 650; text-decoration: none !important; white-space: nowrap; transition: background .2s; }
.hb-link-pill:hover { background: rgb(255 255 255 / 7%); }

/* ---------- Ajustes responsivos generales ---------- */
#content .hd, #content .adm { grid-template-columns: minmax(0, 1fr); }
#content .hd > *, #content .adm > *, #content .adm-grid > *, #content .hd-grid > * { min-width: 0; }
#content .overflow-x-auto, #content .adm-scroll { position: relative; max-width: 100%; -webkit-overflow-scrolling: touch; }
#content img, #content video { max-width: 100%; height: auto; }
#content pre, #content code { white-space: pre-wrap; overflow-wrap: anywhere; }
#content .adm-mini, #content .adm-split > * { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 40rem) { #content table { font-size: .8125rem; } }
@media (max-width: 26rem) {
    #content .hd-actions, #content .adm-actions { flex-wrap: wrap; }
    #content .hd-actions .hd-btn { flex: 1 1 100%; }
}
@media (max-width: 22.5rem) { #content .adm-split { grid-template-columns: minmax(0, 1fr) !important; } }
@media (max-width: 40rem) {
    .habita-floating-tools { right: max(.75rem, env(safe-area-inset-right)); bottom: max(.75rem, env(safe-area-inset-bottom)); flex-direction: column-reverse; gap: .6rem; }
    .habita-floating-ai { width: 3.4rem; height: 3.4rem; min-height: 0; padding: 0; justify-content: center; border-radius: 999px; }
    .habita-floating-ai > span:not([data-ai-limit-badge]) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
    .habita-floating-ai { position: relative; }
    .habita-floating-ai [data-ai-limit-badge] { position: absolute; top: .55rem; right: .6rem; }
    #content { padding-bottom: 6rem; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- Entrar / registrarse ---------- */
.hb-auth { display: grid; min-height: 100vh; min-height: 100dvh; }
.hb-auth-hero { min-height: 19rem; border-radius: 0 0 1.75rem 1.75rem; border-width: 0 0 1px; }
.hb-auth-hero .hb-hero-body { padding-top: 5rem; min-height: 100%; height: 100%; }
.hb-auth-hero .hb-title { font-size: clamp(2.2rem, 1.5rem + 3vw, 4.6rem); }
.hb-auth-logo { position: absolute; z-index: 2; top: 1.4rem; left: 1.5rem; display: flex; align-items: center; gap: .7rem; color: #fff; text-decoration: none; }
.hb-auth-lead, .hb-auth-chips { display: none; }
.hb-auth-chips { flex-wrap: wrap; gap: .5rem; }
.hb-auth-chips span { padding: .55rem .9rem; border-radius: 999px; color: #f1ede6; font-size: .82rem; font-weight: 600; }
.hb-auth-form { display: flex; justify-content: center; padding: 2rem 1.25rem 3rem; }
.hb-auth-inner { width: 100%; max-width: 27rem; display: grid; gap: 2rem; align-content: start; }
.hb-auth-inner h2 { font-family: var(--hb-serif); font-weight: 400; font-size: 2.6rem; line-height: 1.02; letter-spacing: -.01em; }
@media (min-width: 64rem) {
    .hb-auth { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
    .hb-auth-hero { position: sticky; top: 0; height: 100vh; height: 100dvh; margin: .75rem 0 .75rem .75rem; height: calc(100dvh - 1.5rem); border-radius: 1.75rem; border-width: 1px; }
    .hb-auth-hero .hb-hero-body { padding: 3rem; }
    .hb-auth-lead { display: block; }
    .hb-auth-chips { display: flex; }
    .hb-auth-form { align-items: center; padding: 3rem; }
}

/* ---------- Buscador ---------- */
.hb-results { display: grid; gap: 1.5rem; }
.hb-results h2 { margin: 0 0 .7rem; font-family: var(--hb-serif); font-weight: 400; font-size: 1.6rem; }
.hb-results ul { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.hb-row { display: flex; align-items: center; gap: .9rem; padding: .75rem .9rem; border-radius: 1rem; border: 1px solid var(--hb-line); background: linear-gradient(160deg, var(--hb-s2), var(--hb-s1)); color: var(--hb-text) !important; text-decoration: none !important; transition: border-color .2s, transform .2s; }
.hb-row:hover { border-color: rgb(242 183 102 / 40%); transform: translateX(3px); }
.hb-row-img { width: 3.4rem; height: 3.4rem; border-radius: .8rem; object-fit: cover; flex-shrink: 0; background: var(--hb-s3); display: grid; place-items: center; color: var(--hb-glow); }
.hb-row b { display: block; font-size: .98rem; }
.hb-row small { display: block; color: var(--hb-muted); font-size: .8rem; }
.hb-row > span:nth-child(2) { flex: 1; min-width: 0; }
.hb-row > span:nth-child(2) b, .hb-row > span:nth-child(2) small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-bigsearch { position: relative; display: flex; align-items: center; }
.hb-bigsearch svg { position: absolute; left: 1.2rem; width: 1.3rem; height: 1.3rem; color: var(--hb-dim); pointer-events: none; }
.hb-bigsearch input { width: 100%; min-height: 3.6rem; padding: .7rem 7.5rem .7rem 3.3rem; border-radius: 999px; border: 1px solid var(--hb-line-2); background: var(--hb-s2); color: var(--hb-text); font: inherit; font-size: 1.05rem; }
.hb-bigsearch button { position: absolute; right: .35rem; min-height: 2.9rem; padding: 0 1.2rem; border: 0; border-radius: 999px; background: var(--hb-pill); color: #111315; font: inherit; font-weight: 700; cursor: pointer; }

/* ---------- «Me interesa» del catálogo ---------- */
.hb-lead-form { display: grid; gap: .7rem; padding-top: 1rem; border-top: 1px solid var(--hb-line); }
.hb-lead-form h3 { margin: 0; font-family: var(--hb-serif); font-weight: 400; font-size: 1.5rem; }
.hb-lead-form p { margin: 0; color: var(--hb-muted); font-size: .85rem; }
.hb-lead-ok { padding: 1rem; border-radius: 1rem; background: rgb(79 209 197 / 9%); border: 1px solid rgb(79 209 197 / 25%); color: #bff3ee; font-weight: 600; font-size: .92rem; }
.hb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

@media (min-width: 48rem) { .hb-search { display: flex; } .hb-search-btn { display: none !important; } }
main p a:not([class]), main td a:not([class]), .prose a { color: var(--hb-glow-2); }
@media (max-width: 47.99rem) { .hb-word { display: none; } .hb-auth-hero .hb-hero-body { padding-top: 4.5rem; } }
.hb-results, .hb-results > header { grid-template-columns: minmax(0, 1fr); }
.hb-results > *, .hb-results > header > * { min-width: 0; }
.hb-bigsearch input { min-width: 0; }
@media (max-width: 22rem) { .hb-bigsearch input { padding-right: 1rem; } .hb-bigsearch button { position: static; margin-left: .4rem; } .hb-bigsearch { gap: 0; } }
.hb-results ul { grid-template-columns: minmax(0, 1fr); } .hb-results li { min-width: 0; }

.hb-link-pill { font-family: var(--font-sans) !important; }
.hb-tile > span:not(.hb-go):not(.hb-tile-ico) { padding-right: 2.4rem; }

/* ---------- Flecha de regreso ---------- */
.hb-back { display: inline-flex; align-items: center; gap: .3rem; min-height: 2.75rem; min-width: 2.75rem; padding: 0 .85rem 0 .6rem; border-radius: 999px; border: 1px solid var(--hb-line-2); background: rgb(255 255 255 / 4%); color: var(--hb-text) !important; font-size: .88rem; font-weight: 650; text-decoration: none !important; flex-shrink: 0; transition: background .2s, transform .2s; }
.hb-back:hover { background: rgb(255 255 255 / 9%); transform: translateX(-2px); }
@media (max-width: 40rem) { .hb-back { padding: 0; justify-content: center; } .hb-back-text { display: none; } }

/* ---------- Subir archivos (contratos, logos, portadas) ---------- */
.hb-drop { position: relative; display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 1.2rem 1rem; border: 2px dashed rgb(242 183 102 / 40%); border-radius: 1rem; background: rgb(242 183 102 / 4%); text-align: center; cursor: pointer; transition: border-color .2s, background .2s; }
.hb-drop:hover { border-color: rgb(242 183 102 / 70%); background: rgb(242 183 102 / 7%); }
.hb-drop > span { font-size: 1.6rem; }
.hb-drop b { color: var(--hb-text); font-size: .95rem; }
.hb-drop small { color: var(--hb-muted); font-size: .8rem; }
.hb-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.hb-files { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: minmax(0, 1fr); }
.hb-files li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; padding: .6rem; border: 1px solid var(--hb-line); border-radius: 1rem; background: rgb(255 255 255 / 2%); }
.hb-file { display: flex; align-items: center; gap: .8rem; min-width: 0; flex: 1 1 14rem; color: var(--hb-text) !important; text-decoration: none !important; }
.hb-file img, .hb-file-ico { width: 3.2rem; height: 3.2rem; border-radius: .7rem; object-fit: cover; flex-shrink: 0; }
.hb-file-ico { display: grid; place-items: center; background: rgb(242 183 102 / 14%); color: var(--hb-glow-2); font-size: .72rem; font-weight: 800; letter-spacing: .05em; }
.hb-file > span:last-child { min-width: 0; }
.hb-file b { display: block; font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-file small { display: block; color: var(--hb-muted); font-size: .78rem; }
.hb-file-actions { display: flex; gap: 1rem; align-items: center; padding-right: .3rem; }
.hb-file-actions form { margin: 0; }
.hb-file-actions button { background: none; border: 0; cursor: pointer; font: inherit; }

/* ---------- Registro de rentas ---------- */
.hb-ledger { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.hb-ledger-row { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: .5rem 1rem; align-items: center; padding: 1rem 1.25rem; border-top: 1px solid var(--hb-line); }
.hb-ledger-row:first-child { border-top: 0; }
.hb-ledger-month { display: grid; place-items: center; align-content: center; width: 4.6rem; height: 4.2rem; border-radius: 1rem; background: rgb(242 183 102 / 9%); border: 1px solid rgb(242 183 102 / 22%); grid-row: span 2; }
.hb-ledger-month b { font-size: .92rem; color: var(--hb-glow-2); }
.hb-ledger-month small { font-size: .72rem; color: var(--hb-muted); }
.hb-ledger-main { min-width: 0; }
.hb-ledger-main a { color: var(--hb-text) !important; text-decoration: none !important; }
.hb-ledger-main b { display: block; font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-ledger-main small { display: block; color: var(--hb-muted); font-size: .8rem; }
.hb-ledger-money { display: flex; flex-wrap: wrap; gap: .3rem 1rem; font-size: .82rem; color: var(--hb-muted); }
.hb-ledger-money b { color: var(--hb-text); font-variant-numeric: tabular-nums; }
.hb-ledger-actions { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.hb-ledger-actions form { margin: 0; }
.hb-ledger-pay { min-height: 2.3rem; padding: 0 .9rem; border-radius: 999px; border: 0; background: var(--hb-pill); color: #111315; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
@media (min-width: 64rem) {
    .hb-ledger-row { grid-template-columns: 4.6rem minmax(0, 1.4fr) minmax(0, 1.4fr) auto; }
    .hb-ledger-month { grid-row: auto; }
    .hb-ledger-actions { grid-column: auto; justify-content: flex-end; }
}

/* ---------- Subir a mi catálogo (casilla) ---------- */
.hb-publish { position: relative; display: flex; gap: .8rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: 1rem; border: 1px solid rgb(242 183 102 / 30%); background: linear-gradient(160deg, rgb(242 183 102 / 8%), transparent); cursor: pointer; }
.hb-publish input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hb-publish-box { width: 1.4rem; height: 1.4rem; border-radius: .45rem; border: 2px solid var(--hb-line-2); flex-shrink: 0; margin-top: .1rem; display: grid; place-items: center; transition: background .2s, border-color .2s; }
.hb-publish input:checked + .hb-publish-box { background: var(--hb-glow); border-color: var(--hb-glow); }
.hb-publish input:checked + .hb-publish-box::after { content: "✓"; color: #2a1a05; font-weight: 900; font-size: .85rem; }
.hb-publish input:focus-visible + .hb-publish-box { outline: 2px solid var(--hb-glow); outline-offset: 2px; }
.hb-publish b { display: block; color: var(--hb-text); font-size: .98rem; }
.hb-publish small { display: block; margin-top: .15rem; color: var(--hb-muted); font-size: .84rem; line-height: 1.45; }
.hb-publish a { color: var(--hb-glow-2); font-weight: 600; }

/* ---------- Editor del catálogo ---------- */
.hb-cat-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.3rem; border-radius: 1.3rem; border: 1px solid rgb(242 183 102 / 28%); background: linear-gradient(160deg, rgb(242 183 102 / 8%), transparent); }
.hb-cat-state { margin: 0 0 .2rem; font-weight: 700; color: var(--hb-muted); }
.hb-cat-state.on { color: var(--hb-pool); }
.hb-cat-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.hb-cat-actions button { cursor: pointer; background: none; font: inherit; }
.hb-cat-form { display: grid; gap: 1.2rem; }
.hb-cat-card { padding: 1.4rem; border-radius: 1.3rem; border: 1px solid var(--hb-line); background: linear-gradient(160deg, var(--hb-s2), var(--hb-s1)); }
.hb-cat-card h2 { margin: 0 0 1.1rem; font-family: var(--hb-serif); font-weight: 400; font-size: 1.6rem; }
.hb-cat-preview { display: flex; align-items: center; gap: .8rem; margin-top: .5rem; color: var(--hb-muted); }
.hb-cat-preview img { width: 9rem; height: 5rem; object-fit: cover; border-radius: .8rem; border: 1px solid var(--hb-line); }
.hb-cat-preview.logo img { width: 4.5rem; height: 4.5rem; object-fit: contain; background: #fff; padding: .3rem; }
.hb-cat-themes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: .5rem; max-width: 30rem; }
.hb-cat-themes input, .hb-cat-swatches input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hb-cat-themes label { position: relative; cursor: pointer; }
.hb-cat-theme { display: flex; flex-direction: column; gap: .15rem; padding: 1rem; border-radius: 1rem; border: 2px solid var(--hb-line-2); }
.hb-cat-theme.dark { background: linear-gradient(145deg, #1f2226, #0b0c0e); color: #f5f2ec; }
.hb-cat-theme.light { background: linear-gradient(145deg, #ffffff, #efece6); color: #17181b; }
.hb-cat-theme small { opacity: .7; font-size: .8rem; }
.hb-cat-themes input:checked + .hb-cat-theme { border-color: var(--hb-glow); box-shadow: 0 0 0 3px rgb(242 183 102 / 25%); }
.hb-cat-swatches { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: .6rem; }
.hb-cat-swatches label { position: relative; display: flex; flex-direction: column; align-items: center; gap: .3rem; cursor: pointer; width: 3.6rem; }
.hb-cat-swatches label > span { width: 2.6rem; height: 2.6rem; border-radius: 999px; border: 3px solid transparent; box-shadow: 0 0 0 1px var(--hb-line-2); }
.hb-cat-swatches input:checked + span, .hb-cat-swatches input:checked + input[type="color"] { border-color: var(--hb-text); box-shadow: 0 0 0 3px rgb(255 255 255 / 15%); }
.hb-cat-swatches input[type="color"] { width: 2.6rem; height: 2.6rem; border-radius: 999px; border: 3px solid transparent; padding: 0; background: none; cursor: pointer; }
.hb-cat-swatches small { font-size: .72rem; color: var(--hb-muted); }

/* ==========================================================
   Catálogo público personalizable (color de marca + tema Día/Noche)
   ========================================================== */
.hb-catalog { --hb-glow: var(--hb-accent, #f2b766); --hb-glow-2: color-mix(in oklab, var(--hb-accent, #f2b766) 72%, white); --color-emerald-700: var(--hb-glow); --color-emerald-800: var(--hb-glow-2); --color-emerald-600: var(--hb-pill); }
.hb-cat-wrap { width: 100%; max-width: 72rem; margin: 0 auto; padding: 0 1.25rem; }
.hb-cat-header { position: sticky; top: 0; z-index: 20; background: color-mix(in oklab, var(--hb-bg) 82%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--hb-line); }
.hb-cat-header .hb-cat-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.5rem; }
.hb-cat-brand { display: flex; align-items: center; gap: .7rem; min-width: 0; color: var(--hb-text) !important; text-decoration: none !important; }
.hb-cat-brand img { width: 2.75rem; height: 2.75rem; object-fit: contain; border-radius: .7rem; background: #fff; padding: .2rem; flex-shrink: 0; }
.hb-cat-brand span { font-family: var(--hb-serif); font-size: 1.55rem; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-cat-wa { display: inline-flex; align-items: center; min-height: 2.6rem; padding: 0 1.1rem; border-radius: 999px; background: var(--hb-glow); color: #111315 !important; font-weight: 700; font-size: .9rem; text-decoration: none !important; flex-shrink: 0; }
.hb-cat-main { display: grid; gap: 1.6rem; padding-top: 1.6rem; padding-bottom: 3rem; grid-template-columns: minmax(0, 1fr); }
.hb-cat-footer { border-top: 1px solid var(--hb-line); padding: 2rem 0 2.5rem; color: var(--hb-muted); font-size: .9rem; }
.hb-cat-footer .hb-cat-wrap { display: grid; gap: 1rem; }
.hb-cat-foot-brand b { font-family: var(--hb-serif); font-weight: 400; font-size: 1.5rem; color: var(--hb-text); }
.hb-cat-foot-brand p { margin: .3rem 0 0; }
.hb-cat-foot-list, .hb-cat-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; }
.hb-cat-foot-list a { color: inherit; }
.hb-cat-social a { display: inline-flex; min-height: 2.3rem; align-items: center; padding: 0 .9rem; border-radius: 999px; border: 1px solid var(--hb-line-2); color: var(--hb-text); text-decoration: none; font-weight: 600; font-size: .85rem; }
.hb-cat-legal { margin: 0; font-size: .78rem; color: var(--hb-dim); }

/* Ficha de la casa */
.hb-prop-head { display: grid; gap: .4rem; }
.hb-prop-title { margin: 0; font-family: var(--hb-serif) !important; font-weight: 400 !important; font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.6rem) !important; line-height: 1.02; color: var(--hb-text); }
.hb-prop-place { margin: 0; color: var(--hb-muted); }
.hb-prop-grid { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 64rem) { .hb-prop-grid { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); } .hb-prop-aside { position: sticky; top: 5.5rem; } }
.hb-prop-main { display: grid; gap: 1.2rem; min-width: 0; }
.hb-gallery { display: grid; gap: .5rem; border-radius: 1.4rem; overflow: hidden; }
.hb-gallery.many { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 7.5rem; }
.hb-gallery-item { position: relative; display: block; overflow: hidden; background: var(--hb-s2); }
.hb-gallery-item img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .6s; }
.hb-gallery-item:hover img { transform: scale(1.04); }
.hb-gallery:not(.many) .hb-gallery-item img { max-height: 32rem; }
.hb-gallery.many .hb-gallery-item.main { grid-column: span 4; grid-row: span 3; }
@media (min-width: 48rem) { .hb-gallery.many { grid-auto-rows: 9rem; } .hb-gallery.many .hb-gallery-item.main { grid-column: span 3; grid-row: span 3; } }
.hb-gallery-more { position: absolute; inset: 0; display: grid; place-items: center; background: rgb(0 0 0 / 55%); color: #fff; font-weight: 700; }
.hb-more-photos summary { cursor: pointer; font-weight: 650; color: var(--hb-glow-2); }
.hb-more-photos > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: .5rem; margin-top: .7rem; }
.hb-more-photos img { width: 100%; height: 7rem !important; object-fit: cover; border-radius: .8rem; }
.hb-specs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.hb-specs li { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .9rem; border-radius: 999px; border: 1px solid var(--hb-line-2); background: var(--hb-s2); color: var(--hb-text); font-size: .9rem; font-weight: 600; }
.hb-prop-card, .hb-prop-aside { padding: 1.4rem; border-radius: 1.4rem; border: 1px solid var(--hb-line); background: var(--hb-s1); }
.hb-prop-card h2 { margin: 0 0 .7rem; font-family: var(--hb-serif); font-weight: 400; font-size: 1.7rem; color: var(--hb-text); }
.hb-prop-about { margin: 0; white-space: pre-line; overflow-wrap: anywhere; line-height: 1.7; color: var(--hb-muted); }
.hb-prop-addr { margin: .9rem 0 0; color: var(--hb-text); }
.hb-prop-aside { display: grid; gap: .7rem; }
.hb-prop-price { padding-bottom: .6rem; border-bottom: 1px solid var(--hb-line); }
.hb-prop-price > div p { margin: 0; font-family: var(--hb-serif); font-weight: 400; font-size: 2rem; line-height: 1.15; color: var(--hb-text); }
.hb-prop-price > div p span { font-family: var(--hb-sans, inherit); font-size: .8rem !important; color: var(--hb-muted) !important; }
.hb-prop-price > p { margin: .3rem 0 0; font-size: .78rem; color: var(--hb-dim); }
.hb-prop-fine { margin: 0; font-size: .78rem; color: var(--hb-dim); }

/* Tema Día (claro) */
html.hb-light {
    color-scheme: light;
    --hb-bg: #f7f6f3; --hb-s1: #ffffff; --hb-s2: #f3f1ec; --hb-s3: #e9e6df;
    --hb-line: rgb(0 0 0 / 8%); --hb-line-2: rgb(0 0 0 / 15%);
    --hb-text: #17181b; --hb-muted: #57534e; --hb-dim: #78736c; --hb-pill: #17181b;
    --color-white: #fff; --color-black: #000;
    --color-slate-50: oklch(98.4% .003 247.858); --color-slate-100: oklch(96.8% .007 247.896); --color-slate-200: oklch(92.9% .013 255.508); --color-slate-300: oklch(86.9% .022 252.894);
    --color-slate-400: oklch(70.4% .04 256.788); --color-slate-500: oklch(55.4% .046 257.417); --color-slate-600: oklch(44.6% .043 257.281); --color-slate-700: oklch(37.2% .044 257.287);
    --color-slate-800: oklch(27.9% .041 260.031); --color-slate-900: oklch(20.8% .042 265.755);
    --color-gray-500: oklch(55.1% .027 264.364); --color-neutral-500: oklch(55.6% 0 none);
}
html.hb-light .hb-catalog { --hb-glow-2: color-mix(in oklab, var(--hb-accent, #f2b766) 55%, black); --color-emerald-700: var(--hb-glow-2); --color-emerald-800: var(--hb-glow-2); --color-emerald-50: color-mix(in oklab, var(--hb-accent) 12%, white); }
html.hb-light body { background: var(--hb-bg) !important; color: var(--hb-text); }
html.hb-light .button-primary { background: #17181b !important; color: #fff !important; }
html.hb-light .button-primary:hover { background: #000 !important; }
html.hb-light .button-primary svg { background: #fff; color: #17181b; }
html.hb-light .field-input, html.hb-light input, html.hb-light select, html.hb-light textarea { background-color: #fff; color: #17181b; }
html.hb-light .hb-lead-ok { color: #0f5f58; background: rgb(79 209 197 / 14%); }
html.hb-light .hb-hero .hb-eyebrow { color: #fff; }
.hb-share-link { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; padding: .8rem 1rem; border-radius: 1rem; border: 1px dashed var(--hb-line-2); background: var(--hb-s2); font-size: .9rem; }
.hb-share-link a { color: var(--hb-glow-2); min-width: 0; flex: 1 1 14rem; }
.hb-mobile-logo { white-space: nowrap; }
@media (max-width: 25rem) { .hb-menu-word { display: none; } }