:root{
  --navy:#1A2B4A;
  --navy-dark:#0D1B2E;
  --orange:#F47920;
  --orange-light:#ffb277;
  --steel:#55606D;
  --fog:#EEF1F3;
  --off-white:#F7F8FA;
  --verified:#2F7D5B;
  --verified-bg:#EAF3DE;
  --r-sm:4px;
  --r-md:10px;
  --font-display:'Archivo', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--navy-dark);
  background:#fff;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none; color:inherit;}
img,svg{display:block; max-width:100%;}
img{height:auto;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
section[id]{scroll-margin-top:88px;}
main{display:block;}

/* ---------- Logo ---------- */
.logo{display:inline-flex; align-items:center; gap:10px; color:var(--navy);}
.logo.on-dark{color:#fff;}
.logo-mark{width:118px;}
.logo svg{width:100%; height:auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 22px; font-family:var(--font-body);
  font-weight:600; font-size:14.5px; cursor:pointer; border:2px solid var(--navy-dark);
  transition:transform .12s ease, box-shadow .12s ease; border-radius:var(--r-sm);
}
.btn:hover{transform:translate(-2px,-2px); box-shadow:4px 4px 0 var(--navy-dark);}
.btn-primary{background:var(--orange); color:#fff; border-color:var(--navy-dark);}
.btn-outline{background:#fff; color:var(--navy-dark);}
.btn-outline-white{background:transparent; color:#fff; border-color:rgba(255,255,255,0.55);}
.btn-outline-white:hover{box-shadow:4px 4px 0 rgba(255,255,255,0.3);}
.btn-lg{padding:17px 30px; font-size:16px;}
.btn svg{width:16px; height:16px; flex-shrink:0;}
.btn:disabled{opacity:0.6; cursor:not-allowed; transform:none; box-shadow:none;}

/* ---------- Header ---------- */
header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:3px solid var(--navy-dark);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:20px;}
.nav-links{display:flex; gap:26px; align-items:center;}
.nav-links a{font-size:14.5px; font-weight:600; color:var(--navy); opacity:0.85; transition:opacity .15s;}
.nav-links a:hover, .nav-links a[aria-current="page"]{opacity:1; color:var(--orange);}
.nav-links .soon{font-size:9px; background:var(--navy-dark); color:#fff; padding:2px 6px; border-radius:var(--r-sm); margin-left:6px; letter-spacing:0.5px; vertical-align:middle;}

/* ---------- Hero ---------- */
.hero{position:relative; color:#fff; overflow:hidden; padding:100px 0 90px; border-bottom:6px solid var(--orange);}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg img{width:100%; height:100%; object-fit:cover;}
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(13,27,46,0.96) 0%, rgba(13,27,46,0.9) 42%, rgba(13,27,46,0.55) 75%, rgba(13,27,46,0.35) 100%);
}
.hero-inner{position:relative; z-index:2; max-width:660px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; background:var(--orange); color:#fff;
  padding:7px 16px; font-size:12px; font-weight:700; font-family:var(--font-mono);
  letter-spacing:0.4px; margin-bottom:28px; border-radius:var(--r-sm);
}
h1{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(30px, 4.6vw, 48px); line-height:1.18; letter-spacing:-0.5px;
  margin-bottom:20px;
}
h1 .accent{color:var(--orange);}
.hero p.lead{font-size:17.5px; color:rgba(255,255,255,0.82); max-width:540px; margin-bottom:36px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:52px;}
.hero-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:2px solid rgba(255,255,255,0.2);}
.hero-stats > div{padding:20px 20px 0 0; border-right:1px solid rgba(255,255,255,0.16);}
.hero-stats > div:last-child{border-right:none;}
.hero-stats .stat-num{font-family:var(--font-mono); font-weight:600; font-size:20px; color:var(--orange-light);}
.hero-stats .stat-label{font-size:12px; color:rgba(255,255,255,0.62); margin-top:4px;}

/* ---------- Page header (non-home pages) ---------- */
.page-header{background:var(--navy-dark); color:#fff; padding:56px 0 46px; border-bottom:6px solid var(--orange);}
.breadcrumbs{font-family:var(--font-mono); font-size:12px; color:rgba(255,255,255,0.55); margin-bottom:16px;}
.breadcrumbs a{color:rgba(255,255,255,0.75);}
.breadcrumbs a:hover{color:var(--orange-light);}
.page-header h1{font-size:clamp(26px,3.6vw,38px); margin-bottom:10px;}
.page-header p{color:rgba(255,255,255,0.75); max-width:600px; font-size:15.5px;}

/* ---------- Section shell ---------- */
section{padding:88px 0;}
.section-tag{
  display:inline-block; color:#fff; background:var(--navy-dark); font-weight:700; font-size:11.5px;
  font-family:var(--font-mono); letter-spacing:0.6px; margin-bottom:18px; padding:5px 12px; border-radius:var(--r-sm);
}
h2{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(23px, 2.9vw, 33px); letter-spacing:-0.3px;
  color:var(--navy-dark); margin-bottom:16px; max-width:680px; line-height:1.28;
}
.section-lead{color:var(--steel); font-size:16px; max-width:600px; margin-bottom:52px;}
h3{font-family:var(--font-display); font-weight:800;}

/* ---------- How it works ---------- */
.howitworks-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.panel{border:2px solid var(--navy-dark); border-radius:var(--r-md); padding:36px; position:relative;}
.panel.owners{background:var(--navy-dark); color:#fff;}
.panel.renters{background:#fff;}
.panel-tag{display:inline-block; padding:5px 12px; border-radius:var(--r-sm); font-size:11.5px; font-weight:700; font-family:var(--font-mono); letter-spacing:0.3px; margin-bottom:18px;}
.panel.owners .panel-tag{background:var(--orange); color:#fff;}
.panel.renters .panel-tag{background:var(--navy-dark); color:#fff;}
.panel h3{font-family:var(--font-display); font-weight:800; font-size:19px; margin-bottom:12px;}
.panel.renters h3{color:var(--navy-dark);}
.panel > p{opacity:0.82; font-size:14.5px; margin-bottom:26px;}
.panel.renters > p{color:var(--steel);}
.steps{list-style:none; display:flex; flex-direction:column; gap:20px;}
.steps li{display:flex; gap:14px; align-items:flex-start;}
.step-num{flex-shrink:0; width:26px; height:26px; border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:13px; font-weight:600; background:var(--orange); color:#fff;}
.step-text b{display:block; font-size:15px; margin-bottom:2px; font-weight:600;}
.panel.renters .step-text b{color:var(--navy-dark);}
.step-text span{font-size:13.5px; opacity:0.75;}

/* ---------- Categories ---------- */
.categories{background:var(--off-white);}
.cat-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:18px;}
.cat-card{background:#fff; border:2px solid var(--navy-dark); border-radius:var(--r-md); padding:0; text-align:center; transition:transform .15s, box-shadow .15s; overflow:hidden;}
.cat-card:hover{transform:translate(-3px,-3px); box-shadow:5px 5px 0 var(--navy-dark);}
.cat-card .icon-box{padding:28px 18px 14px; display:flex; align-items:center; justify-content:center;}
.cat-card .icon-box svg{width:56px; height:35px; color:var(--navy);}
.cat-card .ground-line{height:4px; background:var(--orange);}
.cat-card .cat-text{padding:16px 14px 22px;}
.cat-card b{display:block; font-size:15px; color:var(--navy-dark); margin-bottom:4px; font-family:var(--font-display); font-weight:700;}
.cat-card span{font-size:12.5px; color:var(--steel); font-family:var(--font-mono);}

/* ---------- Trust band (photo) ---------- */
.trust-band{position:relative; padding:0; border-top:4px solid var(--orange); border-bottom:4px solid var(--orange);}
.trust-band .band-inner{position:relative; min-height:260px; display:flex; align-items:center;}
.trust-band img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;}
.trust-band::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(13,27,46,0.92) 0%, rgba(13,27,46,0.7) 55%, rgba(13,27,46,0.4) 100%); z-index:1;}
.trust-content{position:relative; z-index:2; color:#fff; padding:56px 0; max-width:600px;}
.trust-content p{font-family:var(--font-display); font-weight:800; font-size:clamp(19px,2.3vw,26px); line-height:1.35;}
.trust-content span{display:block; margin-top:14px; font-family:var(--font-mono); font-size:13px; color:var(--orange-light);}

/* ---------- USP flip grid ---------- */
.usp-section.renters{background:#fff;}
.usp-section.owners{background:var(--navy-dark); color:#fff;}
.usp-section.owners .section-lead{color:rgba(255,255,255,0.65);}
.usp-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:18px;}
.usp-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.flip-card{perspective:1200px; height:200px; cursor:pointer;}
.flip-inner{position:relative; width:100%; height:100%; transition:transform .5s cubic-bezier(.2,.9,.3,1); transform-style:preserve-3d;}
.flip-card:hover .flip-inner, .flip-card.flipped .flip-inner{transform:rotateY(180deg);}
.flip-front, .flip-back{position:absolute; inset:0; backface-visibility:hidden; border-radius:var(--r-md); padding:20px; display:flex; flex-direction:column; border:2px solid var(--navy-dark);}
.flip-front{background:var(--off-white); justify-content:space-between;}
.usp-section.owners .flip-front{background:#1f3357; border-color:#0a1830;}
.flip-front .num{font-family:var(--font-mono); font-size:12px; font-weight:600; color:var(--orange);}
.flip-front .icon{font-size:26px; color:var(--navy);}
.usp-section.owners .flip-front .icon{color:var(--orange-light);}
.flip-front b{font-size:14.5px; line-height:1.3; color:var(--navy-dark); font-family:var(--font-display); font-weight:700;}
.usp-section.owners .flip-front b{color:#fff;}
.flip-front .hint{font-size:10.5px; font-weight:600; color:var(--orange); text-transform:uppercase; letter-spacing:0.4px; font-family:var(--font-mono);}
.flip-back{background:var(--orange); color:#fff; transform:rotateY(180deg); justify-content:center; font-size:13px; line-height:1.5;}
.flip-back b{display:block; font-family:var(--font-display); font-weight:800; font-size:12.5px; margin-bottom:8px; text-transform:uppercase; letter-spacing:0.3px;}

/* ---------- Search widget & forms ---------- */
.search-overlap{position:relative; z-index:5; margin-top:-54px; margin-bottom:44px;}
.list-section, .form-section{background:var(--off-white);}
.form-card{background:#fff; border:2px solid var(--navy-dark); border-radius:var(--r-md); padding:26px 28px; box-shadow:6px 6px 0 rgba(13,27,46,0.14);}
.field{display:flex; flex-direction:column; gap:6px;}
.field label{
  font-family:var(--font-mono); font-size:13px; font-weight:700; color:var(--navy-dark);
  text-transform:uppercase; letter-spacing:0.4px;
}
select, input[type="text"], input[type="date"], input[type="tel"], input[type="email"], textarea{
  font-family:var(--font-body); font-size:14px; padding:10px 12px; width:100%;
  border:2px solid var(--navy-dark); border-radius:var(--r-sm); background:#fff; color:var(--navy-dark);
}
textarea{resize:vertical; min-height:90px;}
select:focus, input:focus, textarea:focus{outline:2px solid var(--orange); outline-offset:1px; border-color:var(--orange);}
.search-grid{display:grid; grid-template-columns:1.2fr 1fr 0.8fr 1fr; gap:14px;}
.search-row2{display:flex; gap:14px; align-items:end; margin-top:14px; flex-wrap:wrap;}
.search-row2 .field{flex:1; min-width:200px; max-width:280px;}
.other-field[hidden]{display:none;}
.other-field{margin-top:14px; max-width:360px;}
.listing-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.form-note{font-size:12.5px; color:var(--steel); margin-top:14px;}
.req{color:var(--orange); font-weight:700;}
.required-legend{margin-top:0; margin-bottom:18px;}
.form-success{display:none; margin-top:14px; padding:11px 14px; background:var(--verified-bg); border:2px solid var(--verified); border-radius:var(--r-sm); color:var(--verified); font-size:13px; font-weight:600;}
.form-success.show{display:block;}
.form-error{display:none; margin-top:14px; padding:11px 14px; background:#fdecea; border:2px solid #c0392b; border-radius:var(--r-sm); color:#c0392b; font-size:13px; font-weight:600;}
.form-error.show{display:block;}
.honeypot{position:absolute; left:-9999px; top:-9999px;}

/* ---------- Contact / CTA ---------- */
.cta{background:var(--orange); color:#fff; text-align:center; border-top:6px solid var(--navy-dark); border-bottom:6px solid var(--navy-dark);}
.cta h2{color:#fff; max-width:680px; margin:0 auto 14px;}
.cta > .wrap > p{color:rgba(255,255,255,0.92); max-width:560px; margin:0 auto 40px; font-size:16px;}
.cta-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:900px; margin:0 auto;}
.cta-card{background:var(--navy-dark); border:2px solid var(--navy-dark); border-radius:var(--r-md); padding:26px 22px; text-align:left;}
.cta-card .label{font-size:11px; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:0.5px; color:var(--orange-light); font-weight:600; margin-bottom:10px;}
.cta-card .value{font-family:var(--font-display); font-weight:800; font-size:18px; margin-bottom:4px; word-break:break-word;}
.cta-card .sub{font-size:12.5px; color:rgba(255,255,255,0.6);}
.cta-card a.value{color:#fff; display:inline-block;}
.cta-card a.value:hover{color:var(--orange-light);}

/* ---------- Simple content pages (legal, blog) ---------- */
.content-page{padding:64px 0 96px;}
.content-page .prose{max-width:760px;}
.prose h2{margin-top:40px; font-size:20px;}
.prose h3{font-family:var(--font-display); font-weight:800; font-size:16px; color:var(--navy-dark); margin-top:26px; margin-bottom:8px;}
.prose p, .prose li{color:var(--steel); font-size:15px; margin-bottom:14px;}
.prose ul, .prose ol{padding-left:22px; margin-bottom:14px;}
.prose strong{color:var(--navy-dark);}
.updated-note{font-family:var(--font-mono); font-size:12px; color:var(--steel); margin-bottom:36px; display:block;}
.legal-disclaimer{background:var(--fog); border:2px solid var(--navy-dark); border-radius:var(--r-md); padding:18px 20px; font-size:13.5px; color:var(--steel); margin-bottom:36px;}
.legal-disclaimer strong{color:var(--navy-dark);}

.blog-empty{border:2px dashed var(--navy-dark); border-radius:var(--r-md); padding:56px 30px; text-align:center; background:var(--off-white);}
.blog-empty .icon{font-size:34px; color:var(--orange); margin-bottom:14px;}
.blog-empty h3{font-family:var(--font-display); font-weight:800; font-size:18px; color:var(--navy-dark); margin-bottom:10px;}
.blog-empty p{color:var(--steel); font-size:14.5px; max-width:420px; margin:0 auto 20px;}
.post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.post-card{border:2px solid var(--navy-dark); border-radius:var(--r-md); overflow:hidden; background:#fff;}
.post-card img{width:100%; height:160px; object-fit:cover;}
.post-card .ground-line{height:4px; background:var(--orange);}
.post-card .post-body{padding:18px;}
.post-card .post-date{font-family:var(--font-mono); font-size:11px; color:var(--steel); text-transform:uppercase; letter-spacing:0.4px;}
.post-card h3{font-size:16px; margin-top:6px; margin-bottom:8px; color:var(--navy-dark);}
.post-card p{font-size:13.5px; color:var(--steel);}

/* ---------- Footer ---------- */
footer{background:var(--navy-dark); color:rgba(255,255,255,0.6); padding:52px 0 26px;}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:40px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,0.15);}
.footer-top p{max-width:280px; font-size:13.5px; margin-top:16px;}
.footer-cols{display:flex; gap:52px; flex-wrap:wrap;}
.footer-col h4{color:#fff; font-size:12px; font-family:var(--font-mono); margin-bottom:14px; letter-spacing:0.5px;}
.footer-col ul{list-style:none; display:flex; flex-direction:column; gap:10px;}
.footer-col a{font-size:13.5px; color:rgba(255,255,255,0.6); transition:color .15s;}
.footer-col a:hover{color:var(--orange);}
.footer-col p{font-size:13.5px; color:rgba(255,255,255,0.6); max-width:200px;}
.footer-bottom{display:flex; justify-content:space-between; padding-top:22px; font-size:12px; font-family:var(--font-mono); flex-wrap:wrap; gap:12px;}

@media (max-width: 860px){
  .howitworks-grid{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .usp-grid{grid-template-columns:repeat(2,1fr);}
  .usp-grid.cols-3{grid-template-columns:repeat(2,1fr);}
  .hero-stats{grid-template-columns:repeat(2,1fr); row-gap:20px;}
  .hero-stats > div{border-right:none;}
  .cta-grid{grid-template-columns:1fr;}
  .nav-links{display:none;}
  section{padding:60px 0;}
  .hero{padding:56px 0 64px;}
  .search-grid{grid-template-columns:1fr;}
  .search-overlap{margin-top:-30px;}
  .form-card{padding:20px;}
  .listing-grid{grid-template-columns:1fr;}
  .post-grid{grid-template-columns:1fr;}
}
