/* Nest Properties BD - additions: notices, forms, pagination, client area, invoices, media, dashboard helpers. */

.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:200;border-radius:0 0 10px 0}
.skip:focus{left:0}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.stack-f{display:flex;flex-direction:column;gap:14px;min-width:0}
.inl{display:inline-flex;margin:0}
.hint{color:var(--muted);font-size:12.5px;line-height:1.4}
.fld input[readonly]{background:var(--surface2);color:var(--muted);cursor:not-allowed}
.tsel{display:flex;gap:8px;flex-wrap:wrap}
.tsel select{flex:1;min-width:180px}
.tsel input{flex:1;min-width:180px}

/* notices */
.flash-wrap{display:flex;flex-direction:column;gap:8px;padding-top:14px}
.dbody .flash,.dmain>.flash-wrap{margin:0}
.dmain>.flash-wrap{padding:14px 24px 0;max-width:none;width:100%}
.flash{padding:12px 16px;border-radius:12px;font-weight:600;font-size:14.5px;border:1px solid transparent;overflow-wrap:anywhere}
.okmsg{background:var(--good-bg);color:var(--good);border-color:color-mix(in srgb,var(--good) 30%,transparent)}
.infomsg{background:var(--info-bg);color:var(--info);border-color:color-mix(in srgb,var(--info) 25%,transparent)}
.flash.err{background:var(--bad-bg);color:var(--bad);border-color:color-mix(in srgb,var(--bad) 30%,transparent)}
.flash .btn{margin-left:8px}

/* pagination */
.pager{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:22px}
.pg{min-width:40px;height:40px;padding:0 12px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface);text-decoration:none;font-weight:600;font-variant-numeric:tabular-nums}
a.pg:hover{border-color:var(--orange)}
.pg.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.pg.gap{border:0;background:none}

/* auth pages */
.auth,.admin-login{display:grid;place-items:start center;padding-block:40px 64px}
.admin-login{min-height:100dvh;padding-inline:16px;align-items:center}
.auth-card{width:100%;max-width:560px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px}
.admin-login .auth-card{max-width:440px}
.auth-card h1{font-size:clamp(24px,4vw,30px)}
.auth-foot{padding-top:6px;border-top:1px solid var(--line)}
.auth-card .logo{align-self:flex-start}

/* client area */
.acct{display:grid;grid-template-columns:250px minmax(0,1fr);gap:24px;padding-block:28px 56px;align-items:start}
.anav{position:sticky;top:calc(84px + env(safe-area-inset-top,0px));background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:8px}
.anav-h{display:flex;gap:10px;align-items:center;padding:6px 6px 12px;border-bottom:1px solid var(--line);min-width:0}
.anav-h div{min-width:0}
.anav-h b,.anav-h small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anav nav{display:flex;flex-direction:column;gap:2px}
.anav-i{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;text-decoration:none;font-weight:600;color:var(--ink);font-size:14.5px}
.anav-i:hover{background:var(--surface2)}
.anav-i.on{background:var(--navy);color:#fff}
.acct-main{display:flex;flex-direction:column;gap:18px;min-width:0}
.acct-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.acct-h h1{font-size:clamp(24px,3.4vw,32px)}
.acct-h .btn{margin-left:auto}
@media (max-width:900px){
  .acct{grid-template-columns:minmax(0,1fr);gap:16px;padding-block:16px 40px}
  .anav{position:static;padding:10px;min-width:0}
  .anav-h{display:none}
  .anav nav{flex-direction:row;overflow-x:auto;gap:4px;padding-bottom:2px}
  .anav-i{white-space:nowrap;flex:none}
  .anav>form{display:none}
}
.is-account .dt-tabs{display:none}

/* invoice */
.inv{padding-block:28px 56px}
.inv-card{max-width:820px;margin-inline:auto;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:22px}
.inv-top{display:flex;gap:20px;justify-content:space-between;flex-wrap:wrap}
.inv-top h1{font-size:34px}
.inv-st{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:999px;border:2px solid var(--bad);color:var(--bad);font-weight:800;letter-spacing:.1em;font-size:13px}
.inv-st.paid{border-color:var(--good);color:var(--good)}
.inv-to{display:flex;flex-direction:column;gap:2px}
.inv-t{min-width:0}
.inv-t td,.inv-t th{padding:14px 12px}
@media print{
  .sh,.sf,.ann,.noprint,#toast,.skip{display:none!important}
  body{background:#fff!important;color:#000!important}
  .inv{padding:0}.inv-card{border:0;box-shadow:none;padding:0}
}

/* dashboard helpers */
.admin-login{background:var(--bg)}
.tags-l form.inl{display:inline-flex}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.mtile{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.mtile img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--surface2)}
.mmeta{padding:10px;display:flex;flex-direction:column;gap:8px}
.inq{gap:10px}
.dbody .empty{background:var(--surface);border:1px dashed var(--line);border-radius:14px;padding:36px 16px}
.dtop .btn,.dtop form{flex:none}
.dbody>.tbl-wrap+.pager,.dbody>.pager{margin-top:6px}
.grow{flex:1;min-width:0}
.dlg .row{gap:10px}
.ov[hidden]{display:none}
.dside .foot .btn-ghost{color:#fff;border-color:rgba(255,255,255,.3)}
.dside .foot .btn-ghost:hover{background:rgba(255,255,255,.1)}
.pe-title,.pe .pe-title{width:100%}
.ed.article{max-width:none}
.ed img{max-width:100%;height:auto;border-radius:10px}
.bcard .bf .fld textarea{min-height:90px}
.bcard .bf .row.two-c{display:grid;grid-template-columns:1fr 1fr;gap:10px}
[data-bulk]:not([hidden]){display:flex}
.dt-tabs{display:flex;gap:4px}
@media (max-width:900px){.dmain>.flash-wrap{padding-inline:16px}.pe{grid-template-columns:1fr}.editor{grid-template-columns:1fr}.pv{position:static;max-height:none}}
.dnav,.dnav:hover{text-decoration:none}

/* Home hero photos */
.hero-grid{gap:56px}
.hero{padding-block:56px 72px}
.hero-art{isolation:isolate;padding-block:10px 22px}
.hero-art .ha-main{margin:0;position:relative;aspect-ratio:6/7;border-radius:28px;background:#1d1866;box-shadow:0 30px 70px -28px rgba(0,0,0,.65)}
.hero-art .ha-main::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--orange);transform:translate(14px,14px);z-index:-1}
.hero-art .ha-main::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(17,12,76,0) 55%,rgba(17,12,76,.55));pointer-events:none}
.hero-art .ha-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;border-radius:inherit;border:0;display:block}
.hero-art .ha-sub{margin:0;position:absolute;left:-9%;bottom:-2%;width:38%;aspect-ratio:1;border-radius:20px;border:5px solid var(--navy);box-shadow:0 18px 40px -14px rgba(0,0,0,.6);overflow:hidden;background:#1d1866}
.hero-art .ha-sub img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;border:0;border-radius:0}
.hero-art .stat{right:-4%;top:9%;padding:12px 16px;border-radius:14px;z-index:2}
.hero-art .stat b{font-size:26px;line-height:1.1;color:var(--ink)}
@media (max-width:1100px){.hero-grid{gap:36px}.hero-art .ha-sub{left:-6%}.hero-art .stat{right:-2%}}
@media (max-width:900px){
  .hero{padding-block:36px 44px}
  .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .hero-grid>div:first-child{display:contents}
  .hero-grid .search{order:3}
  .hero-art{display:block;padding:0;order:2;margin-block:22px 26px}
  .hero-art .ha-main{aspect-ratio:1/1;border-radius:22px}
  .hero-art .ha-main::before{transform:translate(8px,8px)}
  .hero-art .ha-main img{object-position:50% 12%}
  .hero-art .ha-sub{display:none}
  .hero-art .stat{right:12px;top:12px;padding:9px 13px}
  .hero-art .stat b{font-size:22px}
}

/* Links: plain in navigation and cards, underlined inside running text */
a{text-decoration:none}
p a:not(.btn),li a:not(.btn),.prose a,.article a,.note a,.hint a,.flash a,label a,.err a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.sf a,.nav a,.anav-i,.dnav,.pc a,.bc a,.pc h3 a,.bc h3 a,.ann a{text-decoration:none}

/* Card and blog photos keep a fixed shape whatever the photo's own proportions */
.pc .ph{overflow:hidden}
.pc .ph>a{position:absolute;inset:0;display:block}
.pc .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 28%}
.bc-i>a{display:block}

/* ===== Home hero: navy, photo fades in from the right, search card sits inside ===== */
.hero3{position:relative;background:var(--navy);color:#fff;overflow:hidden;isolation:isolate}
.hero3::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(46% 70% at 0 0,rgba(120,110,255,.28),transparent 62%),radial-gradient(38% 55% at 55% 100%,rgba(244,123,32,.16),transparent 66%)}
.h3-photo{position:absolute;z-index:-1;top:0;right:0;width:62%;height:100%;object-fit:cover;object-position:50% 34%;opacity:.95;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 48%);mask-image:linear-gradient(90deg,transparent 0,#000 48%)}
.h3-in{padding-block:64px 44px}
.hero3 h1{max-width:15ch;font-size:clamp(38px,5.2vw,66px);line-height:1.04;font-weight:800;letter-spacing:-.035em;color:#fff}
.hero3 h1 em{font-style:normal;color:var(--orange)}
.hero3 .sub{margin-top:18px;font-size:clamp(16px,1.5vw,18.5px);color:rgba(255,255,255,.82);max-width:46ch;line-height:1.6}
.hs2{margin-top:34px;padding:16px 20px 18px;border-radius:22px;border:1px solid var(--line);box-shadow:0 30px 60px -26px rgba(0,0,0,.6)}
.hs2 .seg{margin-bottom:12px}
.hs2 .srow{grid-template-columns:1.3fr 1.1fr .8fr .85fr .85fr auto;gap:12px}
.hs2 .srow .btn{height:46px;padding-inline:28px}
.hs-pop{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-size:13px;color:var(--muted)}
.hs-pop span{font-weight:700;margin-right:2px}
.hs-pop a{padding:5px 13px;border-radius:999px;background:var(--surface2);color:var(--ink);font-weight:600}
.hs-pop a:hover{background:var(--navy);color:#fff}
.h3-trust{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px;font-size:14px;color:rgba(255,255,255,.75)}
.h3-trust b{font-family:var(--f-display);font-size:18px;color:#fff;margin-right:2px}
.hero3 a,.hs-pop a,.hs2 a{text-decoration:none!important}
@media (max-width:1080px){.hs2 .srow{grid-template-columns:repeat(3,minmax(0,1fr))}.hs2 .srow .btn{grid-column:1/-1}}
@media (max-width:900px){
  .h3-photo{width:100%;height:60%;opacity:.5;-webkit-mask-image:linear-gradient(180deg,#000 0,transparent 100%);mask-image:linear-gradient(180deg,#000 0,transparent 100%)}
  .h3-in{padding-block:36px 32px}
  .hero3 h1{max-width:none}
  .hs2{margin-top:26px;padding:14px}
  .hs2 .srow{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){.hs2 .srow{grid-template-columns:minmax(0,1fr)}.h3-trust{gap:6px 18px;font-size:13px}}

/* Post-property banner uses the second hero photo */
.cta-card.navy{position:relative;overflow:hidden;isolation:isolate}
.cta-card .cta-bg{position:absolute;z-index:-1;right:0;top:0;height:100%;width:55%;object-fit:cover;opacity:.5;-webkit-mask-image:linear-gradient(90deg,transparent,#000 75%);mask-image:linear-gradient(90deg,transparent,#000 75%)}
.cta-card.navy>*:not(.cta-bg){max-width:34em}

/* ===== Explore by property type: compact photo cards ===== */
.tcs{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.tc{display:flex;flex-direction:column;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;color:var(--ink);transition:transform .2s,box-shadow .2s,border-color .2s}
.tc:hover,.tc:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--orange)}
.tc-img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--surface2)}
.tc-img img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .5s}
.tc:hover .tc-img img{transform:scale(1.06)}
.tc-b{display:flex;align-items:center;gap:10px;padding:11px 12px}
.tc-ic{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;background:var(--surface2);color:var(--navy)}
:root[data-theme="dark"] .tc-ic{color:var(--orange)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tc-ic{color:var(--orange)}}
.tc-t{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25}
.tc-t b{font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-t small{font-size:12.5px;color:var(--muted)}
.tc-go{width:28px;height:28px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:var(--on-orange);transition:transform .2s}
.tc:hover .tc-go{transform:translateX(2px)}
.tc,.tc:hover,.tc:focus,.tc:visited,.tc *{text-decoration:none!important}
@media (max-width:560px){.tcs{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tc-go{display:none}.tc-b{padding:10px}}

/* ===== Loan calculator card ===== */
.emic{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);border-radius:28px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}
.emic-form{padding:clamp(22px,4vw,44px);display:flex;flex-direction:column;gap:12px;min-width:0}
.emic-tag{align-self:flex-start;display:inline-flex;gap:8px;align-items:center;padding:6px 13px;border-radius:999px;background:var(--surface2);font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.emic-form h2{font-size:clamp(24px,3.2vw,36px);font-weight:800;letter-spacing:-.02em}
.emic-rows{display:grid;gap:24px;margin-top:12px}
.emr{min-width:0}
.emr-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.emr-h label{font-weight:700;font-size:14.5px}
.emr-v{display:inline-flex;align-items:center;gap:6px;background:var(--surface2);border:1px solid var(--line);border-radius:12px;padding:0 14px;height:44px;flex:none}
.emr-v:focus-within{border-color:var(--orange);box-shadow:0 0 0 3px rgba(244,123,32,.22)}
.emr-v input[type=number]{width:9ch;min-width:0;height:100%;border:0;background:transparent;text-align:right;padding:0;font-family:var(--f-display);font-weight:800;font-size:18px;color:var(--ink);outline:0;border-radius:0;-moz-appearance:textfield;appearance:textfield}
.emr-v input[type=number]::-webkit-inner-spin-button,.emr-v input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.emr-v i{font-style:normal;color:var(--muted);font-weight:700;font-size:14px}
.emic .emr-r{-webkit-appearance:none;appearance:none;display:block;width:100%;height:8px;padding:0;border:0;border-radius:99px;cursor:pointer;background:linear-gradient(90deg,var(--orange) var(--p,0%),var(--surface2) var(--p,0%));outline-offset:6px}
.emic .emr-r::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:6px solid var(--orange);box-shadow:0 3px 10px rgba(17,12,76,.35);cursor:grab}
.emic .emr-r::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:6px solid var(--orange);box-shadow:0 3px 10px rgba(17,12,76,.35);cursor:grab}
.emic .emr-r::-moz-range-track{background:transparent;height:8px}
.emr-s{display:flex;justify-content:space-between;gap:8px;margin-top:9px;font-size:12px;color:var(--muted)}
.emr-s span:nth-child(2):not(:last-child){color:var(--ink);font-weight:700}
.emic-res{position:relative;isolation:isolate;background:var(--navy);color:#fff;padding:clamp(22px,4vw,40px);display:flex;flex-direction:column;gap:22px;min-width:0}
.emic-res::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 50% at 100% 0,rgba(244,123,32,.28),transparent 65%)}
.dn{position:relative;width:min(250px,100%);aspect-ratio:1;margin-inline:auto}
.dn svg{width:100%;height:100%;transform:rotate(-90deg)}
.dn circle{fill:none;stroke-width:13}
.dn-bg{stroke:rgba(255,255,255,.1)}
.dn-p{stroke:var(--orange);stroke-dasharray:0 302;transition:stroke-dasharray .35s}
.dn-i{stroke:#8F8BFF;stroke-dasharray:0 302;transition:stroke-dasharray .35s,stroke-dashoffset .35s}
.dn-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 26px;gap:2px}
.dn-c small{font-size:12px;color:rgba(255,255,255,.72)}
.dn-c b{font-family:var(--f-display);font-size:clamp(21px,2.4vw,28px);font-weight:800;line-height:1.1;color:#fff}
.dn-l{list-style:none;padding:0;margin:0;display:grid;gap:11px}
.dn-l li{display:flex;align-items:center;gap:10px;font-size:14px}
.dn-l li span{flex:1;color:rgba(255,255,255,.76)}
.dn-l li b{color:#fff;font-weight:700}
.dn-l i{width:12px;height:12px;border-radius:4px;flex:none}
.dn-l .k1{background:var(--orange)}.dn-l .k2{background:#8F8BFF}.dn-l .k3{background:rgba(255,255,255,.4)}
.dn-t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-top:16px;border-top:1px solid rgba(255,255,255,.18);flex-wrap:wrap}
.dn-t span{font-size:13.5px;color:rgba(255,255,255,.76)}
.dn-t b{font-family:var(--f-display);font-size:24px;font-weight:800;color:#fff}
.emic-res .btn{justify-content:center}
.dn-n{font-size:12px;color:rgba(255,255,255,.62);line-height:1.45}
.emic-res a{text-decoration:none!important}
@media (max-width:900px){.emic{grid-template-columns:minmax(0,1fr)}}
@media (max-width:420px){.emr-h{flex-wrap:wrap}.emr-v{padding:0 10px}.emr-v input[type=number]{width:8ch}}
