:root{
  --green:#087d69;--green-2:#0a967c;--green-3:#eaf7f4;--ink:#14252b;--muted:#617077;--line:#dfe9e7;--soft:#f6faf9;--white:#fff;
  --shadow:0 24px 70px rgba(16,55,49,.12);--radius:24px;--max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.5}a{color:inherit}img{max-width:100%;display:block}.container{width:min(calc(100% - 40px),var(--max));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(223,233,231,.76);backdrop-filter:blur(16px)}.nav-wrap{height:78px;display:flex;align-items:center;gap:28px}.brand{display:block;width:190px;flex:none}.brand img{width:100%;height:58px;object-fit:cover;object-position:center 72%}.main-nav{display:flex;align-items:center;gap:26px;margin-left:auto}.main-nav a{text-decoration:none;font-size:14px;font-weight:650;color:#3b4d53;transition:.2s}.main-nav a:hover{color:var(--green)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:14px;text-decoration:none;font-weight:800;font-size:15px;transition:transform .2s,box-shadow .2s,background .2s}.btn:hover{transform:translateY(-2px)}.btn--sm{min-height:42px;padding:0 18px;font-size:14px}.btn--primary{background:linear-gradient(135deg,var(--green-2),#05725f);color:#fff;box-shadow:0 12px 28px rgba(8,125,105,.22)}.btn--primary:hover{box-shadow:0 16px 34px rgba(8,125,105,.32)}.btn--ghost{border:1px solid #b9d7d1;background:#fff;color:var(--green)}.btn--light{background:#fff;color:var(--ink);box-shadow:0 12px 30px rgba(0,0,0,.15)}.menu-btn{display:none;border:0;background:transparent;padding:8px;margin-left:auto}.menu-btn span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:9px}.hero{padding:82px 0 70px;overflow:hidden;background:radial-gradient(circle at 86% 13%,rgba(10,150,124,.09),transparent 28%),linear-gradient(#fff,#fff)}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:55px;align-items:center}.eyebrow{display:inline-block;color:var(--green);font-weight:850;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}.hero h1{font-size:clamp(43px,5vw,70px);line-height:.97;letter-spacing:-.045em;margin:0 0 25px;max-width:720px}.hero h1 em{display:block;color:var(--green);font-style:normal}.hero-lead{font-size:18px;color:var(--muted);max-width:650px;margin:0 0 30px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-points{display:flex;gap:23px;flex-wrap:wrap;margin-top:26px;color:#4a5d62;font-size:13px;font-weight:650}.hero-points span::first-letter{color:var(--green)}.product-stage{min-height:510px;position:relative}.phone-card{position:absolute;left:0;top:12px;width:255px;background:#fff;border:9px solid #15282e;border-radius:38px;padding:19px 15px 15px;box-shadow:var(--shadow);z-index:3}.phone-top{display:flex;justify-content:space-between;font-size:9px;font-weight:800;margin-bottom:16px}.phone-brand{display:flex;align-items:center;justify-content:center;gap:5px;font-size:12px;margin-bottom:17px}.phone-brand img{width:23px;height:26px;object-fit:cover;object-position:center 32%;border-radius:3px}.resident-head{display:flex;align-items:center;gap:10px;background:var(--soft);border-radius:13px;padding:9px}.resident-head strong{display:block;font-size:11px}.resident-head small{display:block;color:var(--muted);font-size:9px}.avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--green-3);color:var(--green);font-size:10px;font-weight:900}.qr-demo{width:145px;height:145px;margin:18px auto 8px;display:grid;grid-template-columns:repeat(9,1fr);gap:2px;background:#fff;padding:7px;border:1px solid #edf0f0}.qr-demo i{background:#fff}.qr-demo i.on{background:#101a1d}.credential-label{text-align:center;font-size:9px;color:var(--muted)}.status-pill{display:block;width:max-content;margin:8px auto 12px;padding:4px 9px;border-radius:999px;background:#e8f8ef;color:#158654;font-weight:800;font-size:9px}.phone-tabs{display:flex;justify-content:space-between;border-top:1px solid #edf1f1;padding-top:10px;font-size:7px;color:#768487}.phone-tabs b{color:var(--green)}.access-panel{position:absolute;right:-6px;top:88px;width:390px;min-height:295px;background:#183138;color:#fff;border-radius:25px;padding:20px 22px 24px;box-shadow:0 30px 85px rgba(16,42,47,.25);z-index:2}.access-panel__top{display:flex;justify-content:space-between;font-size:12px;margin-bottom:28px}.access-panel__top span{color:#a9d4cb}.approved-icon{margin:auto;width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2cb88c,var(--green));font-size:44px;font-weight:300;box-shadow:0 0 0 14px rgba(36,181,140,.09)}.access-panel h2{text-align:center;color:#55d7b5;font-size:30px;margin:16px 0 6px;letter-spacing:.03em}.access-panel>strong,.access-panel>p{text-align:center;display:block;margin:0}.access-panel>p{font-size:12px;color:#aac0c4}.access-meta{display:flex;justify-content:space-between;margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:10px;color:#bdd0d3}.live-badge{position:absolute;right:29px;bottom:34px;z-index:4;background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:999px;box-shadow:0 13px 35px rgba(13,69,59,.12);font-size:11px;font-weight:750}.live-badge span{display:inline-block;width:8px;height:8px;background:#1db67f;border-radius:50%;margin-right:7px;box-shadow:0 0 0 5px rgba(29,182,127,.12)}.feature-strip{padding:0 0 75px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{display:flex;gap:17px;padding:24px;background:#fff;border:1px solid #e4ecea;border-radius:19px;box-shadow:0 11px 30px rgba(21,56,51,.05)}.feature-card h3{margin:1px 0 5px;font-size:18px}.feature-card p{margin:0;color:var(--muted);font-size:14px}.feature-icon{width:48px;height:48px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--green-3);color:var(--green);font-weight:900;font-size:21px}.section{padding:88px 0}.section--soft{background:var(--soft)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:44px}.section-head h2,.integration-copy h2,.realtime-copy h2{font-size:clamp(33px,4vw,50px);line-height:1.05;letter-spacing:-.035em;margin:0}.section-head>p{max-width:480px;color:var(--muted);margin:0 0 4px}.steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:15px;align-items:center}.step{position:relative;min-height:280px;padding:31px 27px;border:1px solid var(--line);border-radius:22px;background:#fff}.step-n{position:absolute;right:20px;top:20px;width:30px;height:30px;border-radius:50%;background:var(--green-3);display:grid;place-items:center;color:var(--green);font-weight:900}.step-icon{width:58px;height:58px;border-radius:18px;background:var(--green-3);display:grid;place-items:center;color:var(--green);font-size:27px;font-weight:900}.step h3{font-size:20px;margin:24px 0 8px}.step p{margin:0;color:var(--muted);font-size:14px}.step-arrow{color:#83a7a0;font-size:26px}.amenities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.amenity{background:#fff;border:1px solid #e0ebe8;border-radius:21px;padding:27px;min-height:190px}.amenity>div{width:52px;height:52px;border-radius:17px;background:var(--green-3);display:grid;place-items:center;color:var(--green);font-size:28px;font-weight:900}.amenity h3{margin:20px 0 7px;font-size:20px}.amenity p{margin:0;color:var(--muted);font-size:13px}.integrations-box{background:#152e34;color:#fff;border-radius:32px;padding:55px;display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;box-shadow:var(--shadow)}.integration-copy .eyebrow{color:#54d9b7}.integration-copy p{color:#b8c9cc}.integration-list{display:grid;gap:13px}.integration-list article{display:flex;gap:17px;padding:20px;border-radius:17px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09)}.integration-list h3{margin:1px 0 4px;font-size:17px}.integration-list p{margin:0;color:#b8c9cc;font-size:13px}.integration-icon{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:13px;background:rgba(44,206,163,.14);color:#60ddbd;font-weight:900}.real-time{padding-top:30px}.realtime-grid{display:grid;grid-template-columns:1fr .85fr;gap:80px;align-items:center}.realtime-copy p{font-size:17px;color:var(--muted)}.realtime-copy ul{padding:0;list-style:none;margin:25px 0 0;display:grid;gap:9px}.realtime-copy li:before{content:'✓';color:var(--green);font-weight:900;margin-right:9px}.state-demo{border:1px solid var(--line);border-radius:28px;padding:28px;background:#fff;box-shadow:var(--shadow)}.state-row{display:flex;justify-content:space-between;align-items:center;background:var(--soft);padding:18px;border-radius:16px;font-weight:800}.state-row b{font-size:12px;padding:7px 10px;border-radius:999px}.bad{background:#fff0ef;color:#b34c43}.good{background:#e9f8ef;color:#128454}.sync-line{height:41px;display:flex;flex-direction:column;align-items:center;justify-content:center}.sync-line span{width:1px;height:11px;background:#cbd9d6}.sync-line i{width:7px;height:7px;border-radius:50%;background:#b5c7c3}.sync-line.active i{background:#20b781;box-shadow:0 0 0 5px rgba(32,183,129,.12)}.state-event{text-align:center;padding:13px;border:1px dashed #bcd5d0;border-radius:15px}.state-event small{display:block;color:var(--green);font-weight:900}.state-event strong{display:block;margin-top:2px}.state-event p{margin:2px 0 0;color:var(--muted);font-size:12px}.cta-section{padding:50px 0 95px}.cta-box{border-radius:32px;background:linear-gradient(120deg,#0b7665,#10464b);padding:48px 55px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:35px;position:relative;overflow:hidden}.cta-box:after{content:'';position:absolute;width:330px;height:330px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-120px;top:-160px}.eyebrow--light{color:#83ead0}.cta-box h2{font-size:clamp(35px,4vw,50px);line-height:1.02;margin:0 0 12px;letter-spacing:-.035em}.cta-box p{margin:0;color:#c7dfda;max-width:660px}.cta-box .btn{position:relative;z-index:2;flex:none}.site-footer{border-top:1px solid var(--line);padding:28px 0 38px}.footer-wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.footer-brand{display:flex;align-items:center;gap:18px}.footer-brand img{width:130px;height:48px;object-fit:cover;object-position:center 72%}.footer-brand p{font-size:12px;color:var(--muted);margin:0}.footer-copy{display:flex;gap:20px;font-size:11px;color:#879398}.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}.reveal.is-visible{opacity:1;transform:none}.reveal-delay{transition-delay:.12s}
@media(max-width:980px){.main-nav,.nav-cta{display:none}.menu-btn{display:block}.main-nav.is-open{display:flex;position:absolute;left:20px;right:20px;top:70px;flex-direction:column;align-items:stretch;background:#fff;padding:17px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.main-nav.is-open a{padding:10px}.hero{padding-top:54px}.hero-grid{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-lead{margin-left:auto;margin-right:auto}.hero-actions,.hero-points{justify-content:center}.product-stage{width:min(100%,610px);margin:auto;min-height:500px}.feature-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.step-arrow{transform:rotate(90deg);text-align:center}.amenities-grid{grid-template-columns:repeat(2,1fr)}.integrations-box,.realtime-grid{grid-template-columns:1fr}.cta-box{flex-direction:column;align-items:flex-start}.section-head{align-items:flex-start;flex-direction:column}.section-head>p{max-width:700px}}
@media(max-width:640px){.container{width:min(calc(100% - 28px),var(--max))}.nav-wrap{height:68px}.brand{width:155px}.brand img{height:50px}.hero{padding:40px 0 45px}.hero h1{font-size:44px}.hero-lead{font-size:16px}.hero-actions{display:grid}.btn{width:100%}.hero-points{gap:10px 16px;font-size:12px}.product-stage{min-height:465px;margin-top:18px}.phone-card{width:192px;border-width:7px;border-radius:30px;padding:13px 10px;left:0}.qr-demo{width:103px;height:103px}.access-panel{width:248px;right:0;top:102px;min-height:235px;padding:15px}.approved-icon{width:55px;height:55px;font-size:30px}.access-panel h2{font-size:21px}.access-meta{font-size:8px}.live-badge{right:5px;bottom:20px;font-size:9px;padding:8px 10px}.section{padding:65px 0}.section-head{margin-bottom:28px}.amenities-grid{grid-template-columns:1fr}.amenity{min-height:auto}.integrations-box{padding:29px 22px;border-radius:24px;gap:32px}.realtime-grid{gap:35px}.cta-section{padding-bottom:65px}.cta-box{padding:31px 23px;border-radius:24px}.footer-wrap,.footer-brand,.footer-copy{flex-direction:column;align-items:flex-start}.footer-copy{gap:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn{transition:none}}


/* HABNEX - logo horizontal optimizado */
.brand {
    width: 230px;
    overflow: visible;
}
.brand img {
    width: 100%;
    height: auto;
    max-height: 64px;
    object-fit: contain;
    object-position: left center;
}
.footer-brand img {
    width: 165px;
    height: auto;
    max-height: 56px;
    object-fit: contain;
    object-position: left center;
}
.phone-brand img {
    object-fit: contain;
}

@media(max-width:640px) {
    .brand {
        width: 185px;
    }
    .brand img {
        height: auto;
        max-height: 52px;
    }
}


/* HABNEX - banner de instalación */
.hn-install-overlay[hidden],
.hn-install-card [hidden] {
    display: none !important;
}
.hn-install-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    align-items: end;
    justify-items: center;
    padding: 18px;
    background: rgba(8, 24, 21, .50);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.hn-install-card {
    position: relative;
    width: min(100%, 460px);
    overflow: hidden;
    padding: 24px;
    border: 1px solid rgba(8, 125, 105, .16);
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 0%, rgba(20, 180, 150, .16), transparent 34%),
        linear-gradient(180deg, #ffffff 0%, #f8fbfa 100%);
    box-shadow: 0 26px 80px rgba(3, 30, 24, .28);
    animation: hnInstallIn .34s cubic-bezier(.2,.85,.25,1);
}
@keyframes hnInstallIn {
    from { opacity: 0; transform: translateY(36px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.hn-install-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #eef4f2;
    color: #31413d;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.hn-install-brand {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 23px;
}
.hn-install-brand img {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    box-shadow: 0 8px 22px rgba(0, 122, 101, .18);
}
.hn-install-brand span,
.hn-install-brand small {
    display: block;
}
.hn-install-brand span {
    color: #142523;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: .04em;
}
.hn-install-brand small {
    margin-top: 2px;
    color: #72817d;
    font-size: 11px;
}
.hn-install-kicker {
    display: block;
    margin-bottom: 7px;
    color: #087d69;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
}
.hn-install-card h2 {
    margin: 0 36px 8px 0;
    color: #132522;
    font-size: clamp(24px, 6vw, 31px);
    line-height: 1.05;
    letter-spacing: -.035em;
}
.hn-install-card p {
    margin: 0;
    color: #64746f;
    font-size: 13px;
    line-height: 1.55;
}
.hn-install-benefits {
    display: grid;
    gap: 9px;
    margin: 19px 0 21px;
    padding: 14px;
    border-radius: 16px;
    background: #f0f7f5;
}
.hn-install-benefits div {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #334641;
    font-size: 12px;
    font-weight: 750;
}
.hn-install-benefits b {
    display: grid;
    place-items: center;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: #d9f2eb;
    color: #087d69;
}
.hn-install-primary {
    width: 100%;
    min-height: 51px;
    border: 0;
    border-radius: 14px;
    background: linear-gradient(135deg, #0b947c, #087360);
    color: #fff;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 12px 25px rgba(8, 125, 105, .24);
}
.hn-install-later {
    width: 100%;
    margin-top: 10px;
    min-height: 41px;
    border: 0;
    background: transparent;
    color: #75827f;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
}
.hn-ios-steps {
    display: grid;
    gap: 12px;
    margin: 21px 0 16px;
    padding: 0;
    list-style: none;
}
.hn-ios-steps li {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 11px;
    align-items: start;
    padding: 12px;
    border-radius: 15px;
    background: #f4f8f7;
}
.hn-step-number {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: #087d69;
    color: #fff;
    font-weight: 900;
}
.hn-ios-steps strong,
.hn-ios-steps small {
    display: block;
}
.hn-ios-steps strong {
    color: #263733;
    font-size: 13px;
}
.hn-ios-steps small {
    margin-top: 4px;
    color: #75817e;
    font-size: 11px;
    line-height: 1.45;
}
.hn-share-symbol {
    display: inline-block;
    padding: 1px 5px;
    border: 1px solid #cdd9d5;
    border-radius: 6px;
    background: #fff;
    color: #087d69;
    font-weight: 900;
}
.hn-ios-note {
    margin: 0 0 17px;
    padding: 12px 14px;
    border-radius: 13px;
    background: #fff7e7;
    color: #695026;
    font-size: 11px;
    line-height: 1.45;
}
.hn-ios-note strong,
.hn-ios-note span {
    display: block;
}
.hn-ios-note strong {
    margin-bottom: 3px;
}
.hn-install-progress,
.hn-install-success {
    padding: 9px 0 3px;
    text-align: center;
}
.hn-progress-icon-wrap {
    position: relative;
    width: 110px;
    height: 110px;
    margin: 2px auto 21px;
}
.hn-progress-icon-wrap img {
    width: 110px;
    height: 110px;
    border-radius: 27px;
    box-shadow: 0 20px 45px rgba(8, 125, 105, .22);
}
.hn-progress-icon-wrap span {
    position: absolute;
    right: -8px;
    bottom: -8px;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #142623;
    color: #fff;
    font-size: 17px;
    font-weight: 900;
}
.hn-install-progress h2,
.hn-install-success h2 {
    margin-right: 0;
}
.hn-progress-track {
    height: 9px;
    overflow: hidden;
    margin: 20px 0 9px;
    border-radius: 999px;
    background: #e5eeeb;
}
.hn-progress-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0a8b75, #1bb89b);
    transition: width .45s ease;
}
.hn-install-progress small {
    color: #85918e;
    font-size: 10px;
}
.hn-success-check {
    display: grid;
    place-items: center;
    width: 94px;
    height: 94px;
    margin: 2px auto 22px;
    border-radius: 50%;
    background: #e1f7ef;
    color: #087d69;
    font-size: 52px;
    font-weight: 900;
    box-shadow: 0 14px 34px rgba(8, 125, 105, .12);
}
.hn-install-success .hn-install-primary {
    margin-top: 21px;
}
@media (min-width: 700px) {
    .hn-install-overlay {
        align-items: center;
    }
}
@media (max-width: 480px) {
    .hn-install-overlay {
        padding: 0;
    }
    .hn-install-card {
        width: 100%;
        border-radius: 26px 26px 0 0;
        padding: 21px 18px max(22px, env(safe-area-inset-bottom));
    }
}