:root{
    --ink:#14181F; --muted:#5B6472; --faint:#8A93A2;
    --line:#E7E9EF; --line-2:#EEF0F4; --wash:#F5F6F8; --surface:#FFFFFF;
    --brand:#173CD4; --brand-ink:#0E2A9E; --brand-wash:#EEF1FE;
    --blue:#1D9BF0; --amber:#C97A16; --amber-wash:#FBF1E2; --star:#F2A73B;
    --green:#12885A; --green-wash:#E6F4EC; --red:#D24A4A; --red-wash:#FBECEC; --grey-wash:#EEF0F4;
    --radius:16px; --radius-sm:12px; --radius-lg:22px;
    --shadow:0 1px 2px rgba(20,24,31,.04), 0 8px 24px rgba(20,24,31,.06);
    --shadow-lift:0 2px 6px rgba(20,24,31,.06), 0 18px 40px rgba(20,24,31,.12);
    --maxw:1160px;
  }
  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{font-family:'Inter',system-ui,sans-serif; color:var(--ink); background:var(--surface); -webkit-font-smoothing:antialiased; line-height:1.5; font-size:15.5px}
  h1,h2,h3,h4,.display{font-family:'Bricolage Grotesque',system-ui,sans-serif; letter-spacing:-.02em; margin:0}
  a{color:inherit; text-decoration:none} button{font-family:inherit; cursor:pointer; border:none; background:none}
  input,select,textarea{font-family:inherit}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}
  :focus-visible{outline:2.5px solid var(--brand); outline-offset:2px; border-radius:6px}
  @media (prefers-reduced-motion:reduce){*{transition:none!important; animation:none!important}}
  .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:600; border-radius:11px; transition:.16s; font-size:14.5px}
  .btn-primary{background:var(--brand); color:#fff; padding:10px 17px; box-shadow:0 6px 16px rgba(23,60,212,.22)}
  .btn-primary:hover{background:var(--brand-ink)}
  .btn-ghost{border:1px solid var(--line); color:var(--ink); padding:9px 15px; background:#fff}
  .btn-ghost:hover{border-color:#cfd4de; background:var(--wash)}
  .btn-lg{padding:13px 22px; font-size:15.5px; border-radius:13px} .btn-block{width:100%}
  .vtick{display:inline-flex; vertical-align:middle}
  .badge{font-size:11.5px; font-weight:700; padding:5px 10px; border-radius:8px; display:inline-flex; align-items:center; gap:5px}
  .b-verified,.b-official{background:#E8F4FE; color:var(--blue)}
  .b-claimed{background:var(--grey-wash); color:var(--muted)} .b-unverified{background:#F1F2F5; color:var(--faint)}
  header.top{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.86); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line)}
  .top .wrap{display:flex; align-items:center; gap:18px; height:64px}
  .brand{display:flex; align-items:center; gap:9px; font-family:'Bricolage Grotesque'; font-weight:800; font-size:21px; letter-spacing:-.03em}
  .brand .mark{width:28px;height:28px;border-radius:9px;background:var(--brand);display:grid;place-items:center;color:#fff;box-shadow:0 4px 12px rgba(23,60,212,.35)}
  .brand .mark svg{width:17px;height:17px} .brand .co{color:var(--brand)}
  .nav{display:flex; align-items:center; gap:20px; margin-left:auto}
  .nav a{color:var(--muted); font-weight:500; font-size:14.5px} .nav a:hover{color:var(--ink)}
  .hide-sm{display:inline-flex} .hide-md{display:inline-flex}
  .pagesbtn{border:1px solid var(--line); background:#fff; color:var(--ink); padding:9px 13px; border-radius:11px; font-weight:600; font-size:13.5px; display:flex; align-items:center; gap:7px} .pagesbtn:hover{background:var(--wash)}
  .pagesmenu{position:absolute; top:60px; right:22px; width:min(560px,92vw); background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-lift); padding:14px; z-index:60; display:none} .pagesmenu.open{display:block}
  .pagesmenu .pg-h{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); margin:10px 8px 6px}
  .pagesmenu .pg-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:4px}
  .pagesmenu a{padding:8px 10px; border-radius:9px; font-size:13.5px; color:var(--ink)} .pagesmenu a:hover{background:var(--brand-wash); color:var(--brand)}
  @media(max-width:640px){.pagesmenu .pg-grid{grid-template-columns:repeat(2,1fr)}}
  .proto-tag{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--blue); background:#E8F4FE; padding:3px 8px; border-radius:6px}
  .hero{padding:72px 0 18px; text-align:center; position:relative; overflow:hidden}
  .hero:before{content:""; position:absolute; inset:-40% 0 auto 0; height:520px; z-index:-1; background:radial-gradient(60% 80% at 50% 0%, #F4F6FF 0%, rgba(244,246,255,0) 70%)}
  .eyebrow{display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--brand); background:var(--brand-wash); padding:6px 13px; border-radius:100px; margin-bottom:22px}
  .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--brand)}
  .hero h1{font-size:clamp(34px,6vw,60px); line-height:1.02; font-weight:800; max-width:14ch; margin:0 auto}
  .hero p.sub{color:var(--muted); font-size:clamp(15px,2.2vw,18.5px); max-width:52ch; margin:20px auto 0}
  .cmd{max-width:760px; margin:34px auto 0; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-lift); padding:8px; display:flex; align-items:stretch; gap:6px; position:relative}
  .cmd .seg{display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:15px; transition:.15s}
  .cmd .loc{min-width:220px; text-align:left; position:relative} .cmd .loc:hover{background:var(--wash)} .cmd .loc .ico{color:var(--brand); flex:none}
  .cmd .loc .lbl{font-size:11px; color:var(--faint); font-weight:600; letter-spacing:.02em; text-transform:uppercase}
  .cmd .loc .val{font-size:15px; font-weight:600; display:flex; align-items:center; gap:6px; white-space:nowrap}
  .cmd .divider{width:1px; background:var(--line); margin:8px 0}
  .cmd .search{flex:1; display:flex; align-items:center; gap:10px; padding-left:6px}
  .cmd .search input{border:none; outline:none; font-size:15.5px; width:100%; background:transparent; color:var(--ink)}
  .cmd .go{background:var(--brand); color:#fff; border-radius:15px; padding:0 22px; font-weight:600; display:flex; align-items:center; gap:8px} .cmd .go:hover{background:var(--brand-ink)}
  .loc-menu{position:absolute; top:calc(100% + 10px); left:0; width:300px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-lift); padding:8px; z-index:30; display:none; text-align:left} .loc-menu.open{display:block}
  .loc-menu .mh{font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--faint); padding:8px 10px 4px}
  .loc-opt{display:flex; align-items:center; gap:11px; width:100%; padding:10px; border-radius:11px; text-align:left} .loc-opt:hover{background:var(--wash)}
  .loc-opt .cty{font-weight:600} .loc-opt .meta{font-size:12.5px; color:var(--faint); margin-left:auto}
  .loc-opt .fl{width:34px;height:34px;border-radius:9px;background:var(--brand-wash);color:var(--brand);display:grid;place-items:center;flex:none}
  .chips{display:flex; gap:9px; justify-content:center; flex-wrap:wrap; margin:22px auto 0; max-width:640px}
  .chip{border:1px solid var(--line); background:#fff; color:var(--muted); font-size:13.5px; font-weight:500; padding:8px 15px; border-radius:100px; display:inline-flex; align-items:center; gap:7px} .chip:hover{border-color:var(--brand); color:var(--brand); background:var(--brand-wash)}
  .chip .k{width:15px;height:15px;display:inline-flex;color:var(--brand)}
  section.blk{padding:52px 0}
  .sec-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:24px}
  .sec-head h2{font-size:clamp(22px,3.4vw,30px); font-weight:700} .sec-head .lead{color:var(--muted); font-size:14.5px; margin-top:6px}
  .sec-head .more{color:var(--brand); font-weight:600; font-size:14px; white-space:nowrap} .sec-head .more:hover{text-decoration:underline}
  .cat-grid{display:grid; grid-template-columns:repeat(8,1fr); gap:12px}
  .cat{background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:18px 12px; display:flex; flex-direction:column; align-items:center; gap:11px; text-align:center; transition:.16s} .cat:hover{border-color:#cfd6ea; box-shadow:var(--shadow); transform:translateY(-2px)}
  .cat .ic{width:44px;height:44px;border-radius:12px; display:grid; place-items:center; background:var(--brand-wash); color:var(--brand)} .cat .ic svg{width:22px;height:22px}
  .cat .nm{font-size:13px; font-weight:600; line-height:1.25}
  .cat.selected{border-color:var(--brand); background:var(--brand-wash)} .cat.selected .ic{background:var(--brand); color:#fff}
  .city-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
  .city-card{position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:3/3.5; color:#fff; display:flex; flex-direction:column; justify-content:flex-end; padding:18px; transition:.2s; box-shadow:var(--shadow)} .city-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-lift)}
  .city-card:before{content:""; position:absolute; inset:0; z-index:0}
  .city-card:after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(10,14,25,0) 30%, rgba(10,14,25,.78) 100%)}
  .city-card>*{position:relative; z-index:2}
  .city-card .cn{font-family:'Bricolage Grotesque'; font-weight:700; font-size:20px} .city-card .cc{font-size:12.5px; opacity:.85; margin-top:2px}
  .c-agra:before{background:linear-gradient(150deg,#3B4CB8,#8A5A9E)} .c-luck:before{background:linear-gradient(150deg,#B5653A,#C98A3A)}
  .c-jaip:before{background:linear-gradient(150deg,#B0446A,#D98A55)} .c-vara:before{background:linear-gradient(150deg,#2E7D8C,#4EA88A)}
  .list-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px} .list-grid.g2{grid-template-columns:repeat(2,1fr)}
  .lcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:.16s; text-align:left; display:flex; flex-direction:column} .lcard:hover{box-shadow:var(--shadow-lift); transform:translateY(-2px); border-color:#dfe3ec}
  .lcard .ph{height:132px; position:relative; display:grid; place-items:center; color:#fff} .lcard .ph .cico svg{width:34px;height:34px;opacity:.9} .lcard .ph .tl{position:absolute; top:12px; left:12px}
  .lcard .open{position:absolute; top:12px; right:12px; font-size:11.5px; font-weight:700; color:var(--green); background:rgba(255,255,255,.92); padding:5px 10px; border-radius:8px; display:inline-flex; align-items:center; gap:5px} .lcard .open .d{width:6px;height:6px;border-radius:50%; background:var(--green)}
  .lcard .body{padding:15px 16px 16px; display:flex; flex-direction:column; gap:9px; flex:1}
  .lcard .row1{display:flex; align-items:flex-start; justify-content:space-between; gap:10px}
  .lcard .nm{font-family:'Bricolage Grotesque'; font-weight:600; font-size:17px; line-height:1.2; display:flex; align-items:center; gap:5px}
  .lcard .rt{display:flex; align-items:center; gap:4px; font-weight:700; font-size:13.5px; flex:none} .lcard .rt svg{width:14px;height:14px} .lcard .rt .cnt{color:var(--faint); font-weight:500; font-size:12px}
  .lcard .meta{display:flex; align-items:center; gap:6px; color:var(--muted); font-size:13px} .lcard .meta svg{width:14px;height:14px; color:var(--faint); flex:none}
  .lcard .catline{font-size:12.5px; color:var(--brand); font-weight:600}
  .lcard .acts{display:flex; gap:8px; margin-top:2px; padding-top:13px; border-top:1px solid var(--line-2)}
  .lcard .acts .a{flex:1; border:1px solid var(--line); border-radius:10px; padding:9px 0; font-size:12.5px; font-weight:600; display:flex; align-items:center; justify-content:center; gap:6px; background:#fff} .lcard .acts .a svg{width:15px;height:15px} .lcard .acts .a:hover{background:var(--wash); border-color:#cfd4de}
  .lcard .acts .a.call{color:var(--brand); border-color:#cfd8f6; background:var(--brand-wash)} .lcard .acts .a.wa{color:var(--green); border-color:#c7e6d5; background:var(--green-wash)}
  .crumb{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13.5px; color:var(--muted); padding:22px 0 0} .crumb a:hover{color:var(--brand)} .crumb .sep{color:var(--faint)} .crumb .cur{color:var(--ink); font-weight:600}
  .page-head{padding:26px 0 6px} .page-head h1{font-size:clamp(28px,4.5vw,42px); font-weight:800} .page-head p{color:var(--muted); font-size:16px; margin-top:10px; max-width:60ch}
  .kick{color:var(--brand); font-weight:600; font-size:14px; display:flex; align-items:center; gap:7px}
  .prose{max-width:720px} .prose h3{font-size:19px; margin:26px 0 8px} .prose p{color:var(--muted); margin:0 0 14px; line-height:1.7}
  .city-stats{display:flex; gap:26px; margin-top:20px; flex-wrap:wrap} .city-stats .st .n{font-family:'Bricolage Grotesque'; font-weight:700; font-size:22px} .city-stats .st .l{color:var(--muted); font-size:13px}
  .search-top{background:var(--wash); border-bottom:1px solid var(--line); padding:16px 0}
  .searchbar{display:flex; gap:10px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:14px; padding:6px; box-shadow:var(--shadow)}
  .searchbar .s-loc{display:flex; align-items:center; gap:8px; padding:10px 12px; border-right:1px solid var(--line); color:var(--muted); font-weight:600; font-size:14px; white-space:nowrap}
  .searchbar input{flex:1; border:none; outline:none; font-size:15px; padding:0 8px} .searchbar .go{background:var(--brand); color:#fff; padding:10px 18px; border-radius:10px; font-weight:600}
  .search-body{display:grid; grid-template-columns:270px 1fr; gap:26px; padding:26px 0}
  .filters{position:sticky; top:80px; align-self:start; background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px}
  .filters h4{font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--faint); margin:16px 0 9px} .filters h4:first-child{margin-top:0}
  .fchk{display:flex; align-items:center; gap:9px; padding:6px 0; font-size:14px; cursor:pointer} .fchk input{width:16px;height:16px; accent-color:var(--brand)}
  .fpill{display:inline-flex; gap:6px; flex-wrap:wrap} .fpill button{border:1px solid var(--line); border-radius:100px; padding:6px 12px; font-size:12.5px; color:var(--muted); font-weight:500} .fpill button.on{border-color:var(--brand); background:var(--brand-wash); color:var(--brand)}
  .results-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; gap:12px; flex-wrap:wrap}
  .viewtoggle{display:flex; border:1px solid var(--line); border-radius:10px; overflow:hidden} .viewtoggle button{padding:8px 12px; font-size:13px; font-weight:600; color:var(--muted); display:flex; align-items:center; gap:6px} .viewtoggle button.on{background:var(--brand); color:#fff} .viewtoggle button svg{width:15px;height:15px}
  .mapbox{border-radius:16px; overflow:hidden; border:1px solid var(--line); background:linear-gradient(135deg,#DCE6F2,#EAF0F7); min-height:520px; position:relative; display:grid; place-items:center}
  .mapbox .mpin{position:absolute; width:30px;height:30px;border-radius:50% 50% 50% 0; background:var(--brand); transform:rotate(-45deg); box-shadow:0 4px 12px rgba(23,60,212,.4); display:grid; place-items:center} .mapbox .mpin span{transform:rotate(45deg); color:#fff; font-size:11px; font-weight:800}
  .mapbox .mnote{background:rgba(255,255,255,.9); padding:10px 16px; border-radius:100px; font-size:13px; color:var(--muted); font-weight:600; z-index:2}
  .mapgrid{position:absolute; inset:0; background-image:linear-gradient(rgba(23,60,212,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(23,60,212,.06) 1px,transparent 1px); background-size:40px 40px}
  .cover{height:230px; background:linear-gradient(135deg,#3B4CB8,#8A5A9E); position:relative}
  .bp-head{display:flex; gap:20px; align-items:flex-end; margin-top:-56px; position:relative; flex-wrap:wrap}
  .bp-logo{width:112px;height:112px;border-radius:20px; background:#fff; border:4px solid #fff; box-shadow:var(--shadow); display:grid; place-items:center; color:#fff; flex:none}
  .bp-logo .inner{width:100%;height:100%;border-radius:16px; display:grid; place-items:center} .bp-logo svg{width:44px;height:44px}
  .bp-title{flex:1; min-width:240px; padding-bottom:4px} .bp-title h1{font-size:30px; font-weight:800; display:flex; align-items:center; gap:8px}
  .bp-title .sub{color:var(--muted); margin-top:6px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:14px}
  .bp-title .sub .rt{display:inline-flex; align-items:center; gap:4px; font-weight:700; color:var(--ink)} .bp-title .sub .rt svg{width:15px;height:15px}
  .bp-actions{display:flex; gap:9px; flex-wrap:wrap; padding-bottom:4px} .bp-actions .a{border:1px solid var(--line); border-radius:11px; padding:10px 15px; font-weight:600; font-size:13.5px; display:flex; align-items:center; gap:7px; background:#fff} .bp-actions .a svg{width:16px;height:16px}
  .bp-actions .a.call{background:var(--brand); color:#fff; border-color:var(--brand)} .bp-actions .a.wa{background:var(--green); color:#fff; border-color:var(--green)}
  .bp-body{display:grid; grid-template-columns:1fr 320px; gap:28px; margin-top:30px}
  .card{background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px} .card h3{font-size:18px; margin-bottom:12px}
  .gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:10px} .gallery div{aspect-ratio:4/3; border-radius:11px; background:linear-gradient(135deg,#E3E8F2,#F0F3F8); display:grid; place-items:center; color:var(--faint)}
  .amen{display:flex; flex-wrap:wrap; gap:8px} .amen span{font-size:13px; background:var(--wash); border:1px solid var(--line); padding:6px 12px; border-radius:9px; color:var(--muted)}
  .hours{width:100%; font-size:14px} .hours tr td{padding:7px 0; border-bottom:1px solid var(--line-2)} .hours tr td:last-child{text-align:right; color:var(--muted)} .hours tr.today td{font-weight:700; color:var(--ink)}
  .review{border-top:1px solid var(--line-2); padding:16px 0} .review:first-of-type{border-top:none} .review .rh{display:flex; align-items:center; gap:10px} .review .av{width:38px;height:38px;border-radius:50%; background:var(--brand-wash); color:var(--brand); display:grid; place-items:center; font-weight:700} .review .stars{color:var(--star); font-size:13px; letter-spacing:1px} .review p{color:var(--muted); margin:8px 0 0; font-size:14px}
  .side-contact div{display:flex; align-items:center; gap:11px; padding:9px 0; font-size:14px; border-bottom:1px solid var(--line-2)} .side-contact div:last-child{border:none} .side-contact svg{width:17px;height:17px;color:var(--brand); flex:none}
  .newcity{background:linear-gradient(135deg,#141A2E,#1E2A54); border-radius:var(--radius-lg); padding:30px; color:#fff; position:relative; overflow:hidden}
  .newcity:before{content:""; position:absolute; right:-60px; top:-60px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, rgba(90,120,255,.4), transparent 70%)}
  .newcity .nh{display:flex; align-items:center; gap:12px; position:relative} .newcity .nh .ni{width:44px;height:44px;border-radius:12px; background:rgba(255,255,255,.14); display:grid; place-items:center}
  .newcity h3{font-size:23px; font-weight:700} .newcity .np{color:#B9C2E0; font-size:14.5px; margin:6px 0 0}
  .ess-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:11px; margin-top:22px; position:relative}
  .ess{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:13px; padding:14px 10px; display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center; color:#fff} .ess:hover{background:rgba(255,255,255,.14)} .ess svg{width:22px;height:22px; color:#A9B7F0} .ess .el{font-size:12px; font-weight:500}
  .area-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
  .area{border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px; background:#fff; text-align:left} .area:hover{border-color:var(--brand); background:var(--brand-wash)} .area .an{font-weight:600; font-size:15px; display:flex; align-items:center; gap:8px} .area .an svg{width:16px;height:16px;color:var(--brand)} .area .am{color:var(--faint); font-size:12.5px; margin-top:4px}
  .auth-wrap{max-width:430px; margin:50px auto; padding:0 22px}
  .auth-card{background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); padding:32px} .auth-card h1{font-size:26px; font-weight:800; text-align:center} .auth-card .as{color:var(--muted); text-align:center; margin:8px 0 24px; font-size:14.5px}
  .field{margin-bottom:15px} .field label{display:block; font-size:13px; font-weight:600; margin-bottom:6px}
  .field input,.field select,.field textarea{width:100%; border:1px solid var(--line); border-radius:11px; padding:12px 13px; font-size:15px; outline:none} .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-wash)}
  .oauth{display:flex; gap:10px; margin-bottom:18px} .oauth button{flex:1; border:1px solid var(--line); border-radius:11px; padding:11px; font-weight:600; font-size:14px; background:#fff; display:flex; align-items:center; justify-content:center; gap:8px} .oauth button:hover{background:var(--wash)}
  .divider-or{text-align:center; color:var(--faint); font-size:13px; margin:14px 0; position:relative} .divider-or:before{content:""; position:absolute; top:50%; left:0; right:0; height:1px; background:var(--line); z-index:0} .divider-or span{background:#fff; padding:0 12px; position:relative}
  .stepper{display:flex; gap:6px; margin-bottom:26px; flex-wrap:wrap} .stepper .sd{flex:1; min-width:20px; height:5px; border-radius:100px; background:var(--line)} .stepper .sd.done{background:var(--brand)} .stepper .sd.cur{background:var(--brand); opacity:.5}
  .step-label{font-size:13px; color:var(--brand); font-weight:600; margin-bottom:6px}
  .dash{display:grid; grid-template-columns:250px 1fr; min-height:calc(100vh - 64px)}
  .dside{background:var(--wash); border-right:1px solid var(--line); padding:22px 16px}
  .dside .du{display:flex; align-items:center; gap:11px; padding:10px; margin-bottom:16px} .dside .du .av{width:42px;height:42px;border-radius:11px; color:#fff; display:grid; place-items:center; font-weight:700} .dside .du .nm{font-weight:700; font-size:14.5px} .dside .du .rl{font-size:12px; color:var(--muted)}
  .dnav a{display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:10px; font-size:14px; color:var(--muted); font-weight:500; margin-bottom:2px} .dnav a svg{width:18px;height:18px} .dnav a:hover{background:#fff; color:var(--ink)} .dnav a.on{background:#fff; color:var(--brand); box-shadow:var(--shadow); font-weight:600}
  .dmain{padding:28px 30px}
  .scope-banner{background:var(--brand-wash); border:1px solid #cfd8f6; border-radius:14px; padding:14px 18px; display:flex; align-items:center; gap:12px; margin-bottom:24px; font-size:14px} .scope-banner svg{width:20px;height:20px;color:var(--brand); flex:none} .scope-banner b{color:var(--brand)}
  .stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:26px}
  .stat{background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px} .stat .sl{color:var(--muted); font-size:13px; display:flex; align-items:center; gap:7px} .stat .sl svg{width:15px;height:15px} .stat .sv{font-family:'Bricolage Grotesque'; font-weight:700; font-size:28px; margin-top:8px} .stat .sd{font-size:12px; color:var(--green); font-weight:600; margin-top:3px}
  .qa{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:26px} .qa button{border:1px solid var(--line); background:#fff; border-radius:11px; padding:10px 15px; font-weight:600; font-size:13.5px; display:flex; align-items:center; gap:8px; color:var(--ink)} .qa button:hover{border-color:var(--brand); color:var(--brand); background:var(--brand-wash)} .qa button svg{width:15px;height:15px}
  .tbl{width:100%; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; border-collapse:collapse} .tbl th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--faint); padding:12px 16px; background:var(--wash); border-bottom:1px solid var(--line)} .tbl td{padding:13px 16px; border-bottom:1px solid var(--line-2); font-size:14px} .tbl tr:last-child td{border:none}
  .pill{font-size:11.5px; font-weight:700; padding:4px 9px; border-radius:7px} .p-pub{background:var(--green-wash); color:var(--green)} .p-pend{background:var(--amber-wash); color:var(--amber)} .p-susp{background:var(--red-wash); color:var(--red)}
  .chart{display:flex; align-items:flex-end; gap:10px; height:180px; padding-top:10px} .chart .bar{flex:1; background:linear-gradient(180deg,var(--brand),#5B78E8); border-radius:7px 7px 0 0; position:relative; min-height:4px} .chart .bar span{position:absolute; bottom:-22px; left:0; right:0; text-align:center; font-size:11px; color:var(--faint)}
  .card-2{display:grid; grid-template-columns:1fr 1fr; gap:20px}
  .price-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:10px}
  .price{background:#fff; border:1px solid var(--line); border-radius:20px; padding:26px; display:flex; flex-direction:column} .price.feat{border-color:var(--brand); box-shadow:0 12px 40px rgba(23,60,212,.14); position:relative}
  .price.feat:before{content:"Most popular"; position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--brand); color:#fff; font-size:11px; font-weight:700; padding:4px 12px; border-radius:100px}
  .price .pn{font-weight:700; font-size:17px} .price .pp{font-family:'Bricolage Grotesque'; font-weight:800; font-size:38px; margin:12px 0 4px} .price .pp small{font-size:15px; color:var(--muted); font-weight:500} .price .pdesc{color:var(--muted); font-size:13.5px; margin-bottom:18px}
  .price ul{list-style:none; padding:0; margin:0 0 22px; flex:1} .price li{display:flex; align-items:flex-start; gap:9px; padding:7px 0; font-size:14px} .price li svg{width:17px;height:17px; flex:none; margin-top:1px}
  .contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:30px}
  .info-row{display:flex; gap:13px; padding:14px 0; border-bottom:1px solid var(--line-2)} .info-row svg{width:20px;height:20px;color:var(--brand); flex:none} .info-row .l{font-size:12px; color:var(--faint); font-weight:600; text-transform:uppercase; letter-spacing:.04em} .info-row .v{font-weight:600; margin-top:2px}
  footer{border-top:1px solid var(--line); background:var(--wash); padding:44px 0 30px; margin-top:30px}
  .foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px}
  .foot-grid .fcol h5{font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--faint); margin:0 0 12px} .foot-grid .fcol a{display:block; color:var(--muted); font-size:13.5px; padding:4px 0} .foot-grid .fcol a:hover{color:var(--ink)}
  .foot-grid .fnote{color:var(--muted); font-size:13px; max-width:34ch; margin-top:10px}
  .foot-bot{border-top:1px solid var(--line); margin-top:30px; padding-top:18px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; color:var(--faint); font-size:12.5px}
  .mobnav{display:none; position:fixed; bottom:0; left:0; right:0; z-index:60; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); border-top:1px solid var(--line); padding:8px 0 calc(8px + env(safe-area-inset-bottom))}
  .mobnav .mn{display:flex; justify-content:space-around} .mobnav .mn a{display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--faint); font-size:10.5px; font-weight:600} .mobnav .mn a svg{width:21px;height:21px} .mobnav .mn a.on{color:var(--brand)}
  @media(max-width:960px){ .cat-grid{grid-template-columns:repeat(4,1fr)} .city-grid{grid-template-columns:repeat(2,1fr)} .list-grid,.list-grid.g2{grid-template-columns:repeat(2,1fr)} .ess-grid{grid-template-columns:repeat(4,1fr)} .area-grid{grid-template-columns:repeat(2,1fr)} .search-body{grid-template-columns:1fr} .filters{position:static} .bp-body{grid-template-columns:1fr} .dash{grid-template-columns:1fr} .dside{display:none} .stat-grid{grid-template-columns:repeat(2,1fr)} .price-grid{grid-template-columns:1fr} .card-2,.contact-grid,.foot-grid{grid-template-columns:1fr} }
  @media(max-width:640px){ body{padding-bottom:70px} .hide-sm{display:none} .cmd{flex-direction:column; padding:10px; gap:8px} .cmd .divider{display:none} .cmd .loc{min-width:0} .cmd .loc,.cmd .search{border:1px solid var(--line); border-radius:13px} .cmd .search{padding:12px 14px} .cmd .go{padding:13px 0; justify-content:center} .loc-menu{width:100%} .cat-grid{grid-template-columns:repeat(3,1fr)} .list-grid,.list-grid.g2{grid-template-columns:1fr} .ess-grid{grid-template-columns:repeat(3,1fr)} .area-grid{grid-template-columns:1fr} .city-grid{grid-template-columns:1fr 1fr} .mobnav{display:block} section.blk{padding:38px 0} .newcity{padding:22px} .stat-grid{grid-template-columns:1fr 1fr} .searchbar{flex-wrap:wrap} .searchbar .s-loc{border:none; width:100%} .bp-head{margin-top:-40px} .bp-actions{width:100%} }

/* ---- Real map (Leaflet) ---- */
.lmap{width:100%;border-radius:16px;overflow:hidden;border:1px solid var(--line);z-index:0}
.lmap-empty{width:100%;border-radius:16px;border:1px dashed var(--line);background:var(--wash);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px}
.leaflet-container{font:inherit}
/* ---- Category breakdown chips ("what's here") ---- */
.breakdown{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.bd{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:12px;padding:9px 13px;background:var(--surface);text-decoration:none;color:var(--ink);transition:.15s}
.bd:hover{border-color:var(--brand);box-shadow:0 3px 12px rgba(23,60,212,.08)}
.bd .k{width:26px;height:26px;border-radius:8px;background:var(--brand-wash);color:var(--brand);display:grid;place-items:center}
.bd .k svg{width:15px;height:15px}
.bd .bn{font-weight:600;font-size:14px}
.bd .bc{margin-left:2px;background:var(--ink);color:#fff;border-radius:20px;font-size:11.5px;font-weight:700;padding:2px 8px;min-width:20px;text-align:center}
.mapwrap{margin-top:6px}
.mapcap{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13px;margin-top:10px}
.mapcap svg{width:15px;height:15px}

/* ---- Homepage location picker ---- */
.locpick{margin-top:18px;max-width:640px}
.locpick label{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:7px}
.locpick label svg{width:15px;height:15px;color:var(--brand)}
.locpick select{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 13px;font:inherit;background:var(--surface);color:var(--ink)}
.locpick .lphint{display:block;font-size:12.5px;color:var(--faint);margin-top:8px}
.city-card.c-etah{background:linear-gradient(135deg,#2E7D5B,#49A47C)}
.city-card.c-up{background:linear-gradient(135deg,#6A4AB0,#8E6ED0)}
@media(max-width:720px){.searchmap{grid-template-columns:1fr !important}}

/* ---- Auth form states ---- */
.formerr{background:var(--red-wash);color:var(--red);border:1px solid #f0c9c9;border-radius:10px;padding:10px 13px;font-size:14px;margin-bottom:14px}
.formok{background:var(--green-wash);color:var(--green);border:1px solid #bfe6cf;border-radius:10px;padding:10px 13px;font-size:14px}
.devnote{background:#FFF7E6;color:#8A6D1B;border:1px dashed #E7C766;border-radius:10px;padding:10px 13px;font-size:14px;margin-bottom:14px}
.okcircle{width:56px;height:56px;border-radius:50%;background:var(--green-wash);color:var(--green);display:grid;place-items:center;margin:0 auto}
.btn-sm{padding:6px 12px;font-size:13px}
/* ---- Ad card (single tasteful sponsored slot) ---- */
.adcard{margin-top:18px;border:1px solid var(--line);border-radius:14px;padding:15px;background:linear-gradient(180deg,#fff, #FBFBFE);position:relative}
.adlabel{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);background:var(--wash);border:1px solid var(--line);border-radius:6px;padding:2px 7px;margin-bottom:9px}
.adimg{height:110px;border-radius:10px;background-size:cover;background-position:center;margin-bottom:10px}
.adtitle{font-weight:700;font-size:15px;line-height:1.3}
.adbody{color:var(--muted);font-size:13.5px;margin-top:5px;line-height:1.5}
.adcta{display:inline-block;margin-top:11px;font-weight:600;font-size:14px;color:var(--brand);text-decoration:none}
/* ---- Ad admin ---- */
.ad-admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.mini-h{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:10px}
.ad-row{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px;padding:10px 12px;margin-bottom:9px}
@media(max-width:820px){.ad-admin-grid{grid-template-columns:1fr}}