/* Rent Browse v2.2 — "Authority" visual layer.
 * Midnight navy + champagne gold + emerald action colour. Loaded after all other theme styles.
 * Adds: dark glass navigation with Cities menu, restructured hero + progressive search panel, interactive section backgrounds,
 * balanced city grid, 4-up "how it works" cards. No content or data is changed by this file. */
:root{
  --navy-950:#050d18;--navy-900:#081525;--navy-800:#0d2038;--navy-700:#14304f;--navy-600:#1d4a78;
  --gold-soft:#e8c978;--gold:#d3ad5b;--gold-deep:#8f6a1c;--gold-ink:#f6e7bd;
  --ink:#0a1626;--muted:#4f5b6b;--cream:#f4f6fa;--line:#e1e6ee;--mint:#eef3f9;
  --midnight:#050d18;--dark:#050d18;--black:#050d18;
  --lux-shadow:0 18px 50px rgba(5,13,24,.16);--lux-shadow-lg:0 30px 80px rgba(5,13,24,.34);
}
body{color:var(--ink);background:#fff}
.eyebrow{color:var(--gold-deep)}.eyebrow.light,.section-dark .eyebrow{color:var(--gold-soft)}
.text-link{color:var(--navy-700);border-bottom:1px solid rgba(211,173,91,.6);padding-bottom:1px;transition:color .2s,border-color .2s}
.text-link:hover{color:var(--gold-deep);border-color:var(--gold-deep)}
.section-head h2,.faq-wrap h2,.answer-block h2{color:var(--navy-900)}
a:hover{color:var(--gold-deep)}

/* ---------- Header / navigation ---------- */
.site-header{background:rgba(5,13,24,.96);-webkit-backdrop-filter:saturate(1.5) blur(18px);backdrop-filter:saturate(1.5) blur(18px);border-bottom:1px solid rgba(232,201,120,.22);color:#fff;transition:background .3s,box-shadow .3s}
.site-header.is-scrolled{background:rgba(5,13,24,.98);box-shadow:0 14px 40px rgba(0,0,0,.35)}
.site-header:after{background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);opacity:.55}
.header-inner{min-height:76px;gap:20px}
.site-header .brand{color:#fff;flex-shrink:0;white-space:nowrap}
.site-header .brand small{color:var(--gold-soft);white-space:nowrap}
.site-header .brand-mark{background:linear-gradient(145deg,#0d2038,#1d4a78);box-shadow:inset 0 0 0 1px rgba(232,201,120,.7),0 6px 18px rgba(0,0,0,.35);color:var(--gold-ink)}
.nav{gap:4px;margin-left:auto}
.nav>a:not(.button),.nav-drop-toggle{position:relative;font-size:13px;font-weight:650;color:rgba(255,255,255,.86);padding:10px 12px;border-radius:10px;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-family:inherit;transition:color .2s,background .2s}
.nav>a:not(.button):hover,.nav-drop-toggle:hover,.nav-drop:focus-within .nav-drop-toggle,.nav-drop.is-open .nav-drop-toggle{color:var(--gold-soft);background:rgba(232,201,120,.10)}
.nav>a:not(.button)[aria-current="page"],.nav-drop.is-current .nav-drop-toggle{color:var(--gold-soft)}
.nav>a:not(.button):after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;background:linear-gradient(90deg,var(--gold),var(--gold-soft));transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav>a:not(.button):hover:after,.nav>a:not(.button)[aria-current="page"]:after{transform:scaleX(1)}
.nav-drop{position:relative}
.nav-drop-toggle svg{transition:transform .25s}
.nav-drop.is-open .nav-drop-toggle svg,.nav-drop:hover .nav-drop-toggle svg{transform:rotate(180deg)}
.nav-drop-panel{position:absolute;top:calc(100% + 6px);left:50%;min-width:230px;padding:8px;border-radius:16px;background:#081525;border:1px solid rgba(232,201,120,.3);box-shadow:0 24px 60px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .22s,transform .22s,visibility .22s;z-index:5}
.nav-drop-panel:before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel,.nav-drop.is-open .nav-drop-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-drop-panel a{display:block;padding:11px 14px;border-radius:10px;color:rgba(255,255,255,.88);font-size:13.5px;font-weight:650;transition:background .2s,color .2s,padding .2s}
.nav-drop-panel a:hover{background:rgba(232,201,120,.14);color:var(--gold-soft);padding-left:19px}
.nav-drop-panel a[aria-current="page"]{color:var(--gold-soft)}
.nav-cta{white-space:nowrap;flex-shrink:0;margin-left:10px;padding:12px 20px;background:linear-gradient(135deg,var(--gold-soft),var(--gold))!important;color:var(--navy-950)!important;font-weight:800;box-shadow:0 8px 24px rgba(211,173,91,.32),inset 0 1px 0 rgba(255,255,255,.5)!important}
.nav-cta:hover{color:var(--navy-950)!important;box-shadow:0 14px 34px rgba(211,173,91,.5),inset 0 1px 0 rgba(255,255,255,.6)!important}
.menu-toggle{background:rgba(255,255,255,.06);border:1px solid rgba(232,201,120,.45);color:#fff;border-radius:12px;align-items:center;gap:10px}
.menu-toggle .menu-bars i{background:var(--gold-soft)}
.scroll-progress{background:linear-gradient(90deg,var(--gold),var(--gold-soft),#fff)}
@media(max-width:1240px){.nav>a:not(.button),.nav-drop-toggle{font-size:12.5px;padding:10px 8px}.nav-cta{padding:11px 16px}}
@media(max-width:1100px){.nav,.nav.is-open{background:transparent;box-shadow:none;border:0}.nav>a:not(.button){color:rgba(255,255,255,.9)!important;background:none}.nav>a:not(.button):hover{background:rgba(232,201,120,.1)}.header-inner{flex-wrap:wrap}.menu-toggle{display:flex;margin-left:auto}.nav{display:none;order:3;width:100%;margin:0;padding:6px 0 18px;flex-direction:column;align-items:stretch;gap:0}.nav.is-open{display:flex}
 .nav>a:not(.button),.nav-drop-toggle{padding:14px 8px;border-radius:0;border-top:1px solid rgba(255,255,255,.09);font-size:15px;width:100%;justify-content:space-between}
 .nav>a:not(.button):after{display:none}
 .nav-drop-panel{position:static;transform:none;min-width:0;opacity:1;visibility:visible;display:none;box-shadow:none;border:0;background:rgba(255,255,255,.04);margin:0 0 6px;border-radius:12px}
 .nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{transform:none}
 .nav-drop.is-open .nav-drop-panel{display:block;transform:none}.nav-drop-panel:before{display:none}
 .nav-cta{margin:14px 0 0;width:100%;justify-content:center}}

/* ---------- Hero ---------- */
.hero-city{background:var(--navy-950);min-height:0}
.hero-city .hero-shade{background:linear-gradient(100deg,rgba(5,13,24,.94),rgba(5,13,24,.66) 55%,rgba(5,13,24,.3))}
.hero-city .hero-image-placeholder{background:radial-gradient(ellipse 55% 55% at 80% 22%,rgba(232,201,120,.26),transparent 60%),radial-gradient(ellipse 60% 60% at 8% 100%,rgba(29,74,120,.55),transparent 65%),linear-gradient(160deg,#050d18,#0a1c33 70%,#0d2038)}
.hero-orbs{position:absolute;inset:-10% 0 0;z-index:1;pointer-events:none;will-change:transform}
.hero-orbs i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;animation:rbOrb 18s ease-in-out infinite}
.hero-orbs i:nth-child(1){width:420px;height:420px;left:-6%;top:10%;background:rgba(29,74,120,.8)}
.hero-orbs i:nth-child(2){width:340px;height:340px;right:22%;top:-8%;background:rgba(232,201,120,.35);animation-duration:23s;animation-delay:-6s}
.hero-orbs i:nth-child(3){width:380px;height:380px;right:-6%;bottom:6%;background:rgba(20,184,94,.28);animation-duration:27s;animation-delay:-11s}
@keyframes rbOrb{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(40px,-30px,0) scale(1.12)}66%{transform:translate3d(-30px,36px,0) scale(.92)}}
.hero-city .hero-inner{padding-top:64px;padding-bottom:230px;gap:60px;align-items:start}
.hero-copy{will-change:transform,opacity}
.hero h1{letter-spacing:-3.5px}
.hero-city-name{background:linear-gradient(180deg,#fff 20%,var(--gold-soft) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero h1 em,.hero .hero-sub em{color:var(--gold-soft)}
.hero-copy>p{max-width:560px;font-size:17px;line-height:1.7}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.hero-actions .button{padding:16px 28px;font-size:14px;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background .25s}
.button-green{background:linear-gradient(135deg,#17c065,#0d7d41)}
.hero-areas{margin-top:26px;gap:8px}
.hero-areas a{padding:8px 15px;font-size:13.5px;font-weight:700;background:rgba(5,13,24,.55);border-color:rgba(232,201,120,.4)}
.hero-areas a:hover{color:var(--navy-950);background:var(--gold-soft);border-color:var(--gold-soft)}
.hero-perks{margin-top:20px;gap:8px}
.hero-perks span{border-color:rgba(232,201,120,.22);background:rgba(255,255,255,.05)}
.button-ghost{border-color:rgba(232,201,120,.6)}.button-ghost:hover{background:rgba(232,201,120,.2);color:#fff}

.search-panel{position:relative;transform-style:preserve-3d;transition:transform .25s ease-out,box-shadow .3s;background:rgba(255,255,255,.96);border:1px solid rgba(232,201,120,.6);border-top:4px solid var(--gold-soft);padding:24px;overflow:hidden}
.search-panel:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(380px circle at var(--sx,80%) var(--sy,0%),rgba(232,201,120,.18),transparent 60%);opacity:.9}
.search-panel>*{position:relative}
.search-title strong{color:var(--navy-900);font-size:21px}
.search-primary{display:grid;gap:2px}
.search-panel label{margin-bottom:12px}
.search-panel select,.search-panel input[type=date]{border-color:#d3dbe6;transition:border-color .2s,box-shadow .2s}
.search-panel select:focus,.search-panel input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(211,173,91,.25);outline:0}
.seg-radio{margin-bottom:14px}
.seg-radio input:checked+span{background:var(--navy-800);color:var(--gold-ink)}
.search-more{margin:2px 0 8px;border:1px solid var(--line);border-radius:12px;background:#f7f9fc;transition:background .2s,border-color .2s}
.search-more[open]{background:#fff;border-color:rgba(211,173,91,.7)}
.search-more summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;font-weight:750;font-size:13px;color:var(--navy-800)}
.search-more summary::-webkit-details-marker{display:none}
.search-more summary small{margin:0;color:var(--muted);font-weight:500}
.search-more summary:after{content:"+";font-size:20px;line-height:1;color:var(--gold-deep);transition:transform .3s;margin-left:auto}
.search-more[open] summary:after{transform:rotate(45deg)}
.search-more[open]{padding-bottom:2px}.search-more .search-dates{padding:0 14px;margin-top:0}
.search-more[open] summary{margin-bottom:12px}
.search-panel .button-green{padding:15px 22px}

/* geo bar + plain-text explainer */
.rb-geo-bar{background:linear-gradient(90deg,var(--navy-950),var(--navy-800));border-bottom:1px solid rgba(232,201,120,.3)}
.rb-geo-picks button[aria-pressed="true"]{background:linear-gradient(135deg,var(--gold-ink),var(--gold-soft));color:var(--navy-950)}
.geo-context-wrap{background:linear-gradient(180deg,#fff,var(--cream))}
.geo-context{font-size:.8rem;padding:.75rem 0}

/* marquee + trust strip */
.area-marquee{background:var(--navy-950);border-top:1px solid rgba(232,201,120,.3);border-bottom:1px solid rgba(232,201,120,.12)}
.marquee-group span{color:#dfe7f2}
.marquee-group span:after{background:var(--gold-soft)}
.trust-strip{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--navy-950),var(--navy-900));border-bottom:1px solid rgba(232,201,120,.25)}
.trust-strip .rentbrowse-motion-bg{opacity:1}
.trust-items{position:relative;z-index:2;padding:30px 0}
.trust-items span{color:#e8eef7;transition:transform .3s}
.trust-items span:hover{transform:translateY(-3px)}
.trust-items b{color:var(--gold-soft);font-size:22px}

/* ---------- Sections with interactive backgrounds ---------- */
.has-motion{position:relative;overflow:hidden;isolation:isolate}
.has-motion>.wrap{position:relative;z-index:2}
.has-motion .rentbrowse-motion-bg{opacity:1;z-index:0}
.section-cities{background:linear-gradient(180deg,#fff,#f4f7fb)}
.section-soft{background:linear-gradient(180deg,#f4f7fb,#eaf0f7)}
.section-soft.has-motion{background:linear-gradient(180deg,#f4f7fb,#eaf0f7)}

/* balanced 3 + 2 city grid */
.location-grid{grid-template-columns:repeat(6,1fr);gap:20px}
.location-card{grid-column:span 2;min-height:360px}
.location-card:nth-child(n+4){grid-column:span 3;min-height:300px}
.location-card:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(232,201,120,.22),transparent 60%);opacity:0;transition:opacity .35s}
.location-card:hover:after{opacity:1}
.location-card:hover{box-shadow:0 30px 70px rgba(5,13,24,.4),0 0 0 1px rgba(232,201,120,.7)}
.location-card .location-overlay{background:linear-gradient(0deg,rgba(5,13,24,.94),rgba(5,13,24,0))}
.location-num{background:rgba(5,13,24,.6);border-color:rgba(232,201,120,.6);right:auto;width:auto;height:auto;display:inline-block}
#visitor-guides .tourist-grid{grid-template-columns:repeat(6,1fr)}#visitor-guides .tourist-card{grid-column:span 2}#visitor-guides .tourist-card:nth-child(n+4){grid-column:span 3}

/* property cards */
.property-card{border-color:#dde4ee;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.property-card:hover{transform:translateY(-8px);border-color:rgba(211,173,91,.8);box-shadow:0 26px 60px rgba(5,13,24,.18)}
.property-location{color:var(--gold-deep)}
.property-bottom a{color:var(--navy-700);font-weight:800}
.property-bottom a:hover{color:var(--gold-deep)}
.split-card{background:linear-gradient(135deg,var(--navy-900),var(--navy-700));border:1px solid rgba(232,201,120,.35)}
.split-card strong{color:var(--gold-ink)}

/* visitor guides */
.visitor-guides{background:linear-gradient(160deg,var(--navy-950),var(--navy-900) 60%,var(--navy-800))}

/* ---------- How it works: dark lattice + 4-up cards ---------- */
.how-it-works{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--navy-950),var(--navy-800));color:#fff;padding:96px 0}
.how-it-works .rentbrowse-motion-bg{opacity:1}
.how-it-works>.wrap{position:relative;z-index:2}
.how-it-works .section-head h2{color:#fff}.how-it-works .section-head p{color:#b9c6d8}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:f}
.feature-card{position:relative;padding:28px 24px 26px;border-radius:20px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(232,201,120,.28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden;transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.feature-card:hover{transform:translateY(-8px);border-color:var(--gold-soft);box-shadow:0 24px 60px rgba(0,0,0,.4)}
.feature-card:after{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg,var(--gold),transparent);transform:scaleX(.25);transform-origin:left;transition:transform .5s}
.feature-card:hover:after{transform:scaleX(1)}
.feature-num{display:block;font-size:40px;font-weight:800;letter-spacing:-1.5px;line-height:1;margin-bottom:16px;background:linear-gradient(180deg,var(--gold-ink),var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.feature-card h3{margin:0 0 10px;font-size:19px;letter-spacing:-.3px;color:#fff}
.feature-card p{margin:0;font-size:14px;line-height:1.65;color:#c3cfe0}

/* answer + FAQ */
.answer-block .lead{color:var(--navy-900)}
.link-list a{color:var(--navy-700)}
.faq-list details{transition:background .25s,padding .25s}
.faq-list details[open]{background:linear-gradient(90deg,rgba(232,201,120,.12),transparent);padding-left:14px}
.faq-list summary:after{color:var(--gold-deep)}
.faq-list summary:hover,.faq-list details[open] summary{color:var(--navy-700)}

/* final CTA + footer */
.final-cta{background:radial-gradient(ellipse 60% 120% at 50% 130%,rgba(232,201,120,.22),transparent 65%),linear-gradient(160deg,var(--navy-950),var(--navy-800))}
.final-cta .button-light{background:linear-gradient(135deg,var(--gold-ink),var(--gold-soft));color:var(--navy-950);font-weight:800}
.site-footer{background:linear-gradient(180deg,var(--navy-900),var(--navy-950));border-top:1px solid rgba(232,201,120,.4)}
.footer-heading,.footer-note{color:var(--gold-soft)!important}
.site-footer a:hover{color:var(--gold-soft)}

/* ---------- Responsive ---------- */
@media(max-width:1020px){#visitor-guides .tourist-grid{grid-template-columns:repeat(2,1fr)}#visitor-guides .tourist-card,#visitor-guides .tourist-card:nth-child(n+4){grid-column:span 1}#visitor-guides .tourist-card:nth-child(5){grid-column:1 / -1}.feature-grid{grid-template-columns:repeat(2,1fr)}.location-grid{grid-template-columns:repeat(2,1fr)}.location-card,.location-card:nth-child(n+4){grid-column:span 1;min-height:300px}.location-card:nth-child(5){grid-column:1 / -1}}
@media(max-width:860px){.hero-city .hero-inner{padding-bottom:120px;gap:34px}}
@media(max-width:620px){#visitor-guides .tourist-grid{grid-template-columns:1fr}#visitor-guides .tourist-card:nth-child(5){grid-column:auto}.feature-grid,.location-grid{grid-template-columns:1fr}.location-card:nth-child(5){grid-column:auto}.hero-actions .button{width:100%}.hero h1{letter-spacing:-2px}.how-it-works{padding:70px 0}.hero-orbs i{opacity:.4}}
@media(prefers-reduced-motion:reduce){.hero-orbs i{animation:none}.hero-copy,.hero-orbs{transform:none!important;opacity:1!important}.search-panel{transition:none}}