/* ============================================================
   Propertylly — Front-end stylesheet
   Consolidated from inline style="" attributes and per-view
   @section('extra_styles') blocks across resources/views/public/*
   ============================================================ */

/* ============================================================
   public/home.blade.php
   ============================================================ */

/* ── Hero ── */
.hero-wrap { min-height:560px; padding:76px 0 86px; position:relative; overflow:hidden; display:flex; align-items:center; background:#0F172A; }
.hero-slider { position:absolute; inset:0; z-index:0; }
.hero-slide { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.04); transition:opacity 1s ease, transform 7s ease; }
.hero-slide.active { opacity:1; transform:scale(1); }
.hero-slide-fallback-1 { background-image:url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1800&q=80'); }
.hero-slide-fallback-2 { background-image:url('https://images.unsplash.com/photo-1494526585095-c41746248156?auto=format&fit=crop&w=1800&q=80'); }
.hero-overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, rgba(3,7,18,.78) 0%, rgba(15,23,42,.55) 48%, rgba(15,23,42,.25) 100%); }
.hero-content { position:relative; z-index:2; }
.hero-title { font-size: clamp(2.35rem, 4.8vw, 4rem); font-weight: 800; color: #fff; line-height: 1.08; letter-spacing: 0; text-shadow:0 2px 18px rgba(0,0,0,.32); }
.hero-kicker { color:#fff; font-size:.82rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; display:inline-flex; align-items:center; gap:8px; }
.hero-kicker::before { content:''; width:34px; height:3px; background:#00B386; border-radius:20px; display:inline-block; }
.hero-badge { background: rgba(255,255,255,.14); color: #fff; border: 1px solid rgba(255,255,255,.26); border-radius: 30px; padding: 5px 14px; font-size: .78rem; font-weight: 700; backdrop-filter: blur(10px); display:inline-flex; align-items:center; gap:6px; }
.hero-lead { color:rgba(255,255,255,.82); font-size:1.05rem; margin:16px 0 0; line-height:1.7; }
.hero-feature-item { display:flex; align-items:center; gap:8px; color:rgba(255,255,255,.75); font-size:.82rem; }
.hero-feature-check { color:#10B981; }
.hero-search-shell { background:#fff; border-radius:8px; box-shadow:0 22px 60px rgba(0,0,0,.3); padding:16px; border:1px solid rgba(255,255,255,.45); }
.search-card { background:#fff; border-radius:0; box-shadow:none; padding:0; }
.search-label { font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#94A3B8; margin-bottom:8px; }
.type-tabs { display:flex; gap:4px; background:#F1F5F9; border-radius:10px; padding:4px; margin-bottom:12px; }
.type-tab { flex:1; padding:8px 8px; border:none; border-radius:7px; font-size:.8rem; font-weight:600; cursor:pointer; color:#64748B; background:transparent; transition:all .2s; white-space:nowrap; }
.type-tab.active { background:var(--primary); color:#fff; box-shadow:0 2px 8px rgba(27,79,202,.35); }
.search-wrap { position:relative; }
.search-icon { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:#94A3B8; }
.search-inp { width:100%; padding:13px 14px 13px 42px; border:1.5px solid var(--border); border-radius:10px; font-size:.95rem; font-weight:500; outline:none; transition:border-color .2s; }
.search-inp:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(27,79,202,.1); }
.search-btn-main { width:100%; padding:13px; background:#00B386; color:#fff; border:none; border-radius:10px; font-weight:800; font-size:.95rem; cursor:pointer; margin-top:8px; transition:all .2s; }
.search-btn-main:hover { transform:translateY(-1px); box-shadow:0 8px 24px rgba(0,179,134,.32); background:#059669; }
.popular-label { font-size:.72rem; color:#94A3B8; font-weight:600; }
.popular-city-link { font-size:.72rem; color:var(--primary); font-weight:600; text-decoration:none; }
.hero-dots { display:flex; gap:8px; margin-top:24px; }
.hero-dot { width:30px; height:3px; border-radius:20px; background:rgba(255,255,255,.35); border:none; padding:0; }
.hero-dot.active { background:#fff; }
@media(max-width: 992px) {
    .hero-wrap { min-height:auto; padding:54px 0 64px; }
    .hero-overlay { background:rgba(3,7,18,.7); }
    .hero-search-shell { margin-top:8px; }
}
.autocomplete-box { position:absolute; top:calc(100% + 4px); left:0; right:0; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-lg); z-index:300; display:none; overflow:hidden; }
.ac-item { padding:11px 16px; cursor:pointer; font-size:.875rem; display:flex; align-items:center; gap:10px; border-bottom:1px solid #F1F5F9; transition:background .12s; }
.ac-item:last-child { border-bottom:none; }
.ac-item:hover { background:#EFF6FF; }
.ac-item i { color:var(--primary); font-size:.75rem; width:14px; }

/* ── Stats Bar ── */
.stats-bar { background:#fff; border-bottom:1px solid var(--border); }
.stat-item { text-align:center; padding:20px 0; }
.stat-num { font-size:1.6rem; font-weight:800; color:var(--primary); line-height:1; }
.stat-lbl { font-size:.72rem; color:#64748B; font-weight:600; text-transform:uppercase; letter-spacing:.06em; margin-top:4px; }
.stat-divider { border-right:1px solid var(--border); }
.stat-ico-brokers { color:var(--primary); }
.stat-ico-builders { color:#EA580C; }
.stat-ico-countries { color:#0EA5E9; }
.stat-ico-cities { color:#2563EB; }
.stat-ico-listings { color:#7C3AED; }

/* ── Section ── */
.section-bg-light { background:#F8FAFC; }
.sec-head { margin-bottom:32px; }
.sec-title { font-size:1.55rem; font-weight:800; color:var(--dark); letter-spacing:-.5px; margin:0 0 6px; }
.sec-title-md { font-size:1.3rem; }
.sec-title-sm { font-size:1.2rem; }
.sec-sub { color:#64748B; font-size:.9rem; margin:0; }
.sec-sub-md { font-size:.85rem; }
.sec-link { color:var(--primary); font-size:.875rem; font-weight:600; text-decoration:none; white-space:nowrap; }
.sec-link:hover { text-decoration:underline; }

/* ── Category Cards ── */
.cat-card { border-radius:16px; padding:28px 24px; position:relative; overflow:hidden; transition:all .3s; cursor:pointer; text-decoration:none; display:block; }
.cat-card::after { content:''; position:absolute; right:-20px; bottom:-20px; width:100px; height:100px; border-radius:50%; background:rgba(255,255,255,.08); }
.cat-card:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(0,0,0,.15); }
.cat-card-broker { background:linear-gradient(135deg,#1B4FCA,#2563EB); }
.cat-card-builder { background:linear-gradient(135deg,#EA580C,#F97316); }
.cat-icon { width:52px; height:52px; border-radius:14px; background:rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:16px; }
.cat-title { font-size:1.15rem; font-weight:700; color:#fff; margin-bottom:4px; }
.cat-count { font-size:.8rem; color:rgba(255,255,255,.8); font-weight:500; margin-bottom:16px; }
.cat-arrow { color:rgba(255,255,255,.7); font-size:.85rem; font-weight:600; }

/* ── City Card Full (with body below image) ── */
.city-full-card { position:relative; border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--border); transition:all .3s; background:#fff; display:flex; flex-direction:column; }
.city-full-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.city-full-card-link { position:absolute; inset:0; z-index:1; }
.city-full-card-link:focus-visible { outline:2px solid var(--primary); outline-offset:-2px; }
.city-img-wrap { position:relative; height:200px; overflow:hidden; flex-shrink:0; }
.city-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.city-full-card:hover .city-img-wrap img { transform:scale(1.08); }
.city-img-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.1) 55%, transparent 100%); }
.city-state-tag { position:absolute; top:12px; left:12px; background:rgba(255,255,255,.9); color:var(--primary); font-size:.65rem; font-weight:700; padding:3px 10px; border-radius:20px; text-transform:uppercase; letter-spacing:.06em; }
.city-broker-badge { position:absolute; top:12px; right:12px; background:rgba(27,79,202,.9); color:#fff; font-size:.68rem; font-weight:700; padding:4px 10px; border-radius:20px; backdrop-filter:blur(6px); }
.city-img-bottom { position:absolute; bottom:0; left:0; right:0; padding:14px 16px 10px; }
.city-img-name { font-size:1.1rem; font-weight:800; color:#fff; margin:0 0 6px; text-shadow:0 2px 4px rgba(0,0,0,.3); }
.city-area-pills { position:relative; z-index:2; display:flex; gap:5px; flex-wrap:wrap; }
.city-area-pill { background:rgba(255,255,255,.18); color:#fff; font-size:.6rem; font-weight:600; padding:2px 9px; border-radius:20px; backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.2); text-decoration:none; transition:all .2s; }
.city-area-pill:hover { background:var(--primary); color:#fff; border-color:transparent; }
.city-card-body { padding:14px 16px 16px; flex:1; display:flex; flex-direction:column; }
.city-stats-row { display:flex; gap:14px; margin-bottom:12px; }
.city-stat { font-size:.75rem; color:#64748B; display:flex; align-items:center; gap:5px; }
.city-stat i { color:var(--primary); font-size:.7rem; }
.city-stat strong { color:var(--dark); font-weight:700; }
.city-explore-btn { position:relative; z-index:2; display:block; text-align:center; background:var(--primary-light); color:var(--primary); border-radius:8px; padding:8px; font-size:.8rem; font-weight:700; text-decoration:none; transition:all .2s; margin-top:auto; }
.city-explore-btn:hover { background:var(--primary); color:#fff; }

/* ── Compact City Card (Popular section) ── */
.city-mini-card { border-radius:12px; overflow:hidden; position:relative; height:150px; display:block; text-decoration:none; }
.city-mini-card img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.city-mini-card:hover img { transform:scale(1.1); }
.city-mini-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.72) 0%, transparent 60%); }
.city-mini-info { position:absolute; bottom:0; left:0; right:0; padding:10px 12px; }
.city-mini-name { font-size:.9rem; font-weight:700; color:#fff; margin:0; }
.city-mini-count { font-size:.68rem; color:rgba(255,255,255,.8); }
.city-mini-state { position:absolute; top:8px; left:8px; background:rgba(255,255,255,.85); color:var(--primary); font-size:.58rem; font-weight:700; padding:2px 7px; border-radius:20px; text-transform:uppercase; letter-spacing:.05em; }

/* ── Broker Expert Card ── */
.expert-card { background:#fff; border:1px solid var(--border); border-radius:14px; padding:20px; transition:all .25s; }
.expert-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); border-color:var(--primary-light); }
.expert-logo { width:56px; height:56px; border-radius:12px; object-fit:cover; border:2px solid var(--border); }
.expert-info { flex:1; min-width:0; }
.expert-name { font-weight:700; font-size:.9rem; color:var(--dark); text-decoration:none; line-height:1.3; }
.expert-name:hover { color:var(--primary); }
.expert-type { font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:2px 8px; border-radius:20px; }
.type-broker { background:#EFF6FF; color:#1B4FCA; }
.type-builder { background:#FFF7ED; color:#EA580C; }
.expert-location { font-size:.75rem; color:#64748B; margin-bottom:6px; }
.expert-location i { color:var(--primary); }
.star-filled { color:#F59E0B; }
.star-empty { color:#E2E8F0; }
.star-sm { font-size:.65rem; }
.expert-rating-count { font-size:.7rem; color:#64748B; }
.svc-pill { background:#F8FAFC; color:#475569; font-size:.65rem; font-weight:600; padding:2px 8px; border-radius:20px; border:1px solid var(--border); }
.btn-view-profile { background:var(--primary-light); color:var(--primary); border-radius:7px; font-weight:600; font-size:.75rem; flex:1; }
.btn-more-city { background:#F8FAFC; color:#475569; border:1px solid var(--border); border-radius:7px; font-weight:600; font-size:.75rem; }

/* ── Growth City Row ── */
.growth-scroll { display:flex; gap:12px; overflow-x:auto; padding-bottom:8px; scrollbar-width:none; }
.growth-scroll::-webkit-scrollbar { display:none; }
.growth-city { flex:0 0 160px; border-radius:12px; overflow:hidden; position:relative; height:120px; text-decoration:none; display:block; }
.growth-city img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.growth-city:hover img { transform:scale(1.08); }
.growth-city-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.75) 0%, transparent 50%); }
.growth-city-info { position:absolute; bottom:0; left:0; right:0; padding:10px; }
.growth-badge { position:absolute; top:8px; right:8px; background:#10B981; color:#fff; font-size:.58rem; font-weight:700; padding:2px 7px; border-radius:20px; }
.growth-city-name { font-size:.85rem; font-weight:700; color:#fff; margin:0; }
.growth-city-meta { font-size:.65rem; color:rgba(255,255,255,.8); }

/* ── State Tabs ── */
.state-tab-btn { background:none; border:1.5px solid var(--border); border-radius:30px; padding:6px 16px; font-size:.8rem; font-weight:600; color:#64748B; cursor:pointer; transition:all .2s; white-space:nowrap; }
.state-tab-btn.active,.state-tab-btn:hover { background:var(--primary); color:#fff; border-color:var(--primary); }
.state-count-badge { font-size:.7rem; opacity:.7; }
.state-city-chip { display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--border); border-radius:10px; padding:10px 14px; text-decoration:none; transition:all .2s; }
.state-city-chip:hover { border-color:var(--primary); background:var(--primary-light); }
.state-city-chip img { width:36px; height:36px; border-radius:6px; object-fit:cover; }
.state-city-name { font-size:.82rem; font-weight:700; color:var(--dark); }
.state-city-meta { font-size:.68rem; color:#64748B; }

/* ── Recently Viewed ── */
.recently-viewed-section { background:#EFF6FF; }
.recently-viewed-title { font-size:1.2rem; }
.recent-city-chip { display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--border); border-radius:10px; padding:8px 14px; text-decoration:none; font-size:.85rem; font-weight:600; color:var(--dark); transition:all .2s; }
.recent-city-chip i { color:var(--primary); font-size:.75rem; }

/* ── How It Works ── */
.step-card { text-align:center; padding:32px 20px; background:#fff; border-radius:16px; border:1px solid var(--border); position:relative; }
.step-num { position:absolute; top:-14px; left:50%; transform:translateX(-50%); width:28px; height:28px; background:var(--primary); color:#fff; border-radius:50%; font-size:.75rem; font-weight:800; display:flex; align-items:center; justify-content:center; }
.step-ico { width:64px; height:64px; border-radius:18px; background:var(--primary-light); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin:0 auto 16px; }
.step-ico-whatsapp { color:#25D366; }
.step-title { font-weight:700; font-size:1rem; margin-bottom:8px; }
.step-desc { font-size:.85rem; color:#64748B; margin:0; }

/* ── CTA Banner ── */
.cta-banner { background:linear-gradient(135deg, #0F2557 0%, #1B4FCA 100%); border-radius:24px; padding:48px 40px; position:relative; overflow:hidden; }
.cta-banner::after { content:''; position:absolute; right:-40px; top:-40px; width:250px; height:250px; border-radius:50%; background:rgba(255,255,255,.05); }
.cta-content { z-index:2; }
.cta-kicker { display:inline-block; background:rgba(255,255,255,.15); color:#fff; border-radius:30px; padding:4px 14px; font-size:.75rem; font-weight:700; margin-bottom:12px; }
.cta-title { font-size:1.8rem; font-weight:800; color:#fff; margin-bottom:8px; }
.cta-desc { color:rgba(255,255,255,.75); font-size:.95rem; margin:0; }
.cta-highlight { color:#F59E0B; }
.btn-cta-primary { background:#F59E0B; color:#000; font-weight:700; border-radius:10px; border:none; }
.btn-cta-secondary { background:rgba(255,255,255,.15); color:#fff; font-weight:600; border-radius:10px; border:1px solid rgba(255,255,255,.3); }

/* ============================================================
   public/broker/profile.blade.php
   ============================================================ */
.detail-shell { width: 100%; padding: 24px 0 48px; }
.detail-grid { width: 100%; margin: 0; }
.broker-hero { position: relative; min-height: 280px; overflow: hidden; background: linear-gradient(135deg, #0b1730 0%, #12346b 48%, #1f63d8 100%); color: #fff; }
.broker-hero-media, .broker-hero-overlay { position: absolute; inset: 0; }
.broker-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.broker-hero-overlay { background: linear-gradient(90deg, rgba(2,6,23,.84) 0%, rgba(15,23,42,.62) 55%, rgba(15,23,42,.3) 100%); }
.broker-hero-body { position: relative; z-index: 1; padding: 48px 0 56px; }
.broker-hero-title { font-size: clamp(2rem, 4vw, 3.15rem); line-height: 1.05; font-weight: 800; margin: 0 0 12px; }
.broker-hero-meta { display:flex; flex-wrap:wrap; gap:10px 16px; color: rgba(255,255,255,.85); font-size:.95rem; }
.broker-hero-meta span { display:inline-flex; align-items:center; gap:7px; }
.broker-hero-meta i { color:#93c5fd; }
.broker-overview-card { margin-top:-54px; position:relative; z-index:2; border-radius:28px; border:1px solid #e2e8f0; background:#fff; box-shadow:0 20px 50px rgba(15,23,42,.08); padding:28px; }
.broker-mark { width:104px; height:104px; border-radius:28px; object-fit:cover; border:4px solid #fff; box-shadow:0 12px 30px rgba(15,23,42,.12); background:#fff; }
.broker-title-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.broker-name-lg { margin:0; font-size: clamp(1.65rem, 3vw, 2.45rem); line-height:1.08; font-weight:800; color:#0f172a; }
.broker-sub-meta { display:flex; flex-wrap:wrap; gap:10px 18px; color:#475569; font-size:.95rem; margin-top:10px; }
.broker-sub-meta span { display:inline-flex; align-items:center; gap:7px; }
.broker-sub-meta i { color:#2563eb; }
.fact-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.fact-card { border:1px solid #dbeafe; background:linear-gradient(180deg, #f8fbff 0%, #eff6ff 100%); border-radius:22px; padding:18px; }
.fact-label { font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:#64748b; margin-bottom:8px; }
.fact-value { font-size:1.1rem; font-weight:800; color:#0f172a; }
.surface-panel { border:1px solid #e2e8f0; border-radius:26px; background:#fff; box-shadow:0 12px 34px rgba(15,23,42,.05); padding:24px; }
.panel-title { font-size:1.25rem; font-weight:800; color:#0f172a; margin:0 0 18px; }
.story-copy { color:#334155; line-height:1.85; font-size:1rem; }
.business-facts { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.business-fact { border:1px solid #e2e8f0; background:#f8fafc; border-radius:18px; padding:16px; color:#334155; line-height:1.6; }
.business-fact i { color:#16a34a; margin-right:8px; }
.map-wrap { border:1px solid #dbeafe; border-radius:24px; overflow:hidden; background:#f8fbff; }
.map-wrap iframe { width:100%; height:280px; border:0; display:block; }
.empty-broker-data { border:1px dashed #cbd5e1; border-radius:22px; padding:24px; text-align:center; color:#64748b; background:#f8fafc; }
.empty-broker-ico { font-size:1.5rem; }
.empty-broker-title { font-weight:800; color:#334155; }
.empty-broker-text { margin-top:8px; }
@media (max-width: 991px) { .fact-grid, .business-facts { grid-template-columns:1fr; } .broker-overview-card { margin-top:-40px; padding:22px; } }
@media (max-width: 768px) { .detail-shell { padding:16px 0 32px; } .broker-hero-body { padding:36px 0 44px; } .broker-mark { width:88px; height:88px; border-radius:24px; } }

/* ============================================================
   public/broker/claim.blade.php
   ============================================================ */
.claim-error-item { font-size:.875rem; }
.claim-submit-btn { max-width:260px; }

/* ============================================================
   public/property/show.blade.php
   ============================================================ */
.prop-hero { position: relative; min-height: 260px; color: #fff; background: linear-gradient(135deg, #0A1628 0%, #0F2557 48%, #1B4FCA 100%); overflow: hidden; }
.prop-hero-media, .prop-hero-overlay { position: absolute; inset: 0; }
.prop-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.prop-hero-overlay { background: linear-gradient(90deg, rgba(3,7,18,.82) 0%, rgba(15,23,42,.58) 52%, rgba(15,23,42,.38) 100%); }
.prop-hero-body { position: relative; z-index: 1; padding: 48px 0 56px; }
.prop-hero-title { font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.06; font-weight: 800; margin: 0 0 10px; }
.prop-hero-sub { color: rgba(255,255,255,.82); display: flex; flex-wrap: wrap; gap: 10px 16px; font-size: .92rem; }
.prop-hero-sub span { display: inline-flex; align-items: center; gap: 7px; }
.prop-hero-sub i { color: #93C5FD; }
.prop-spec-value-multiline { white-space:pre-line; }
.prop-map-wrap { border:1px solid #DBEAFE; border-radius:24px; overflow:hidden; background:#F8FBFF; box-shadow:0 10px 30px rgba(15,23,42,.05); }
.prop-map-wrap iframe { border:0; display:block; }
@media (max-width: 992px) { .prop-highlights-card { grid-template-columns: 1fr; } .prop-highlights-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .prop-hero-body { padding: 34px 0 42px; } }

/* ============================================================
   public/directory/city.blade.php + public/directory/area.blade.php
   (shared directory header, filter bar, broker card, pagination, SEO card)
   ============================================================ */
.dir-header { background: linear-gradient(135deg, #0A1628 0%, #0F2557 45%, #1B4FCA 100%); color: #fff; padding: 40px 0 52px; position: relative; overflow: hidden; }
.dir-header::before { content: ''; position: absolute; top: -80px; right: -80px; width: 320px; height: 320px; background: radial-gradient(circle, rgba(245,158,11,.12) 0%, transparent 70%); pointer-events: none; }
.dir-header::after { content: ''; position: absolute; bottom: -60px; left: 5%; width: 220px; height: 220px; background: radial-gradient(circle, rgba(37,99,235,.25) 0%, transparent 70%); pointer-events: none; }
.dir-header h1 { font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 800; margin: 0 0 6px; letter-spacing: -.5px; }
.dir-header-inner { z-index:2; }
.dir-page-desc { opacity:.7; font-size:.9rem; margin:0; }
.dir-breadcrumb { font-size: .8rem; opacity: .65; margin-bottom: 14px; }
.dir-breadcrumb a { color: rgba(255,255,255,.75); text-decoration: none; }
.dir-stat-chips { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.dir-stat-chip { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(8px); border-radius: 30px; padding: 5px 14px; font-size: .78rem; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.area-tag { background: rgba(255,255,255,.15); color: #fff; border: 1px solid rgba(255,255,255,.25); border-radius: 8px; padding: 4px 12px; font-size: .75rem; font-weight: 600; text-decoration: none; transition: all .2s; }
.area-tag:hover { background: rgba(255,255,255,.28); color: #fff; }
.area-tag.active { background: #fff; color: var(--primary); border-color: #fff; }

/* Layout */
.dir-layout { width: 100%; }
.dir-list { padding: 24px 0 32px; background: #F8FAFC; width: 100%; }
.broker-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
.broker-grid > * { min-width: 0; }
@media(max-width: 1400px) { .broker-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media(max-width: 1200px) { .broker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 768px) { .dir-list { padding: 20px 0 28px; } .broker-grid { grid-template-columns: 1fr; } }

/* Area page: slightly different spacing/breakpoint than city page */
.dir-list-area { padding: 28px 0 36px; }
.dir-list-area .broker-grid { gap: 16px; }
@media(max-width: 1100px) { .dir-list-area .broker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Filter bar */
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 20px; background: #fff; padding: 12px 16px; border-radius: 12px; border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
.result-count { font-size: .85rem; font-weight: 600; color: var(--dark); }
.result-count span { color: var(--primary); }
.filter-btn { border: 1.5px solid var(--border); border-radius: 20px; padding: 5px 16px; font-size: .8rem; font-weight: 600; color: var(--gray); background: #fff; cursor: pointer; transition: all .2s; text-decoration: none; }
.filter-btn:hover, .filter-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); box-shadow: 0 4px 12px rgba(27,79,202,.25); }
.intent-switch { display: inline-flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.intent-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; text-decoration: none; font-size: .78rem; font-weight: 700; border: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.86); background: rgba(255,255,255,.08); }
.intent-chip.active, .intent-chip:hover { background: #fff; color: var(--primary); border-color: #fff; }
.intent-fallback-alert { background:#FFF7ED; color:#9A3412; }
.empty-results { background:#fff; border-radius:14px; border:1px solid var(--border); grid-column: 1 / -1; }
.empty-results-ico { color:var(--border); }
.empty-results-title { color:var(--dark); }
.empty-results-text { font-size:.875rem; }

/* Broker card */
.bcard { position: relative; background: #fff; border-radius: 14px; border: 1px solid var(--border); box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: all .25s; overflow: hidden; }
.bcard:hover { box-shadow: 0 8px 32px rgba(0,0,0,.12); transform: translateY(-3px); border-color: rgba(27,79,202,.2); }
.bcard-link { position: absolute; inset: 0; z-index: 1; }
.bcard-link:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.bcard-strip { height: 4px; }
.bcard-body { padding: 18px 20px 16px; }
.bcard-head { display: flex; align-items: flex-start; gap: 14px; }
.bcard-logo-wrap { position: relative; flex-shrink: 0; }
.bcard-logo { width: 64px; height: 64px; border-radius: 12px; object-fit: cover; border: 2px solid var(--border); background: var(--primary-light); }
.bcard-verified-dot { position: absolute; bottom: -4px; right: -4px; background: #10B981; color: #fff; border-radius: 50%; width: 18px; height: 18px; font-size: .6rem; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; }
.bcard-title-col { flex: 1; min-width: 0; }
.bcard-name { font-size: .92rem; font-weight: 700; color: var(--dark); text-decoration: none; display: block; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.bcard-name:hover { color: var(--primary); }
.bcard-badges { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 5px; }
.bcard-badge-type { font-size: .68rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; }
.bcard-badge-check { font-size: .68rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; background: #ECFDF5; color: #059669; border: 1px solid #A7F3D0; }
.bcard-badge-exp { font-size: .68rem; font-weight: 600; padding: 2px 8px; border-radius: 20px; background: #FFF7ED; color: #C2410C; border: 1px solid #FED7AA; }
.bcard-strip-broker { background:#1B4FCA; }
.bcard-strip-builder { background:#7C3AED; }
.bcard-badge-type-broker { background:#EFF6FF; color:#1E40AF; }
.bcard-badge-type-builder { background:#F5F3FF; color:#5B21B6; }

/* ============================================================
   public/catalog/show.blade.php
   (standalone page, not extending layouts.public — defines its
   own --primary since it doesn't load resources/css/app.css)
   ============================================================ */
:root { --primary: #1B4FCA; }
.catalog-body { background: #F8FAFC; font-family: 'Inter', system-ui, sans-serif; }
.catalog-header { background: linear-gradient(135deg, #1B4FCA 0%, #1e3a8a 100%); color: #fff; padding: 48px 0 32px; }
.catalog-home-link { color:rgba(255,255,255,.7); text-decoration:none; font-size:.85rem; }
.catalog-title { font-size:1.75rem; font-weight:800; margin-bottom:8px; }
.catalog-subtitle { color:rgba(255,255,255,.75); margin-bottom:20px; }
.broker-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.15); border-radius: 30px; padding: 6px 16px; }
.broker-badge-logo { border-radius:50%; object-fit:cover; }
.broker-badge-name { font-weight:600; font-size:.875rem; }
.broker-badge-verified { color:#60A5FA; font-size:.9rem; }
.property-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.property-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.1); }
.property-img { width: 100%; height: 200px; object-fit: cover; }
.property-img-placeholder { background:#F1F5F9; }
.property-img-placeholder i { color:#CBD5E1; }
.property-card-title { font-weight:700; font-size:1rem; margin-bottom:8px; }
.property-card-location { font-size:.8rem; color:#64748B; margin-bottom:10px; }
.property-card-location i { color:var(--primary); }
.property-card-facts { font-size:.8rem; color:#475569; }
.property-card-facts .fa-tag { color:var(--primary); }
.property-card-desc { font-size:.8rem; color:#64748B; line-height:1.5; margin-bottom:12px; }
.property-thumb-sm { width:52px; height:40px; object-fit:cover; border-radius:4px; }
.property-thumb-more { width:52px; height:40px; border-radius:4px; background:#F1F5F9; display:flex; align-items:center; justify-content:center; font-size:.7rem; font-weight:700; color:#64748B; }
.catalog-contact-card { margin-top:60px; background:#fff; border-radius:16px; padding:40px; box-shadow:0 2px 8px rgba(0,0,0,.06); max-width:480px; margin-left:auto; margin-right:auto; text-align:center; }
.catalog-contact-title { font-weight:700; margin-bottom:8px; }
.catalog-contact-sub { color:#64748B; font-size:.875rem; margin-bottom:20px; }
.catalog-call-btn { border-radius:10px; font-weight:600; }
.catalog-whatsapp-btn { background:#25D366; color:#fff; border-radius:10px; font-weight:600; border:none; }
.footer-bar { background: #1E293B; color: #94A3B8; padding: 20px 0; text-align: center; font-size: .8rem; margin-top: 60px; }
.footer-bar-brand { color:#fff; }

/* ============================================================
   public/catalog/expired.blade.php
   (standalone page, not extending layouts.public)
   ============================================================ */
.expired-body { background:#F8FAFC; display:flex; align-items:center; justify-content:center; min-height:100vh; text-align:center; }
.expired-card { max-width:400px; padding:40px; }
.expired-ico { font-size:3rem; color:#CBD5E1; margin-bottom:20px; }
.expired-title { font-weight:700; color:#1E293B; margin-bottom:12px; }
.expired-text { color:#64748B; margin-bottom:24px; }
.expired-link { color:#1B4FCA; text-decoration:none; font-weight:600; }

/* ============================================================
   public/cms/show.blade.php
   ============================================================ */
.cms-page-hero { background: linear-gradient(135deg, #0A1628 0%, #0F2557 48%, #1B4FCA 100%); color: #fff; padding: 54px 0 60px; }
.cms-page-hero h1 { font-size: clamp(1.8rem, 3.6vw, 3rem); font-weight: 800; margin: 0; }
.cms-page-body { background: #F8FAFC; padding: 40px 0 72px; }
.cms-page-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 28px; box-shadow: var(--shadow-sm); }
.cms-page-card img { max-width: 100%; height: auto; border-radius: 12px; }
.dri-dflip-embed { border: 1px solid var(--border); border-radius: 14px; padding: 18px; margin: 20px 0; background: #F8FAFC; }
.dri-dflip-embed__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.dri-dflip-embed__title { font-size: 1.1rem; font-weight: 800; margin: 0; }
.dri-dflip-embed__caption { color: #64748B; margin: 0; font-size: .85rem; }
.dri-dflip-embed__actions { display: flex; gap: 8px; }
.dri-dflip-embed__btn { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 8px; background: var(--primary); color: #fff; text-decoration: none; font-size: .85rem; font-weight: 700; }
.dri-dflip-embed__btn.is-muted { background: #fff; color: var(--primary); border: 1px solid var(--border); }
.dri-dflip-embed--invalid .dri-dflip-embed__error { color: #DC2626; }

/* ============================================================
   public/pages/form.blade.php
   ============================================================ */
.form-hero { background: linear-gradient(135deg, #0A1628 0%, #0F2557 48%, #1B4FCA 100%); color: #fff; padding: 52px 0 68px; position: relative; overflow: hidden; }
.form-hero::after { content: ''; position: absolute; right: -40px; top: -40px; width: 240px; height: 240px; border-radius: 50%; background: rgba(255,255,255,.08); }
.form-hero-inner { position: relative; z-index: 1; max-width: 780px; }
.form-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.82); margin-bottom: 14px; }
.form-eyebrow::before { content: ''; width: 30px; height: 3px; border-radius: 999px; background: #00B386; }
.form-title { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.06; font-weight: 800; margin: 0 0 12px; }
.form-intro { color: rgba(255,255,255,.84); line-height: 1.8; margin: 0; }
.form-shell { background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 240px); padding: 34px 0 72px; }
.form-info-card, .form-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow-sm); }
.form-info-card { padding: 22px; height: 100%; }
.form-info-card i { width: 48px; height: 48px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-light); color: var(--primary); font-size: 1.1rem; margin-bottom: 14px; }
.form-info-card h3 { font-size: 1rem; font-weight: 800; color: var(--dark); margin-bottom: 8px; }
.form-info-card p { color: #64748B; margin: 0; line-height: 1.75; font-size: .92rem; }
.form-card { padding: 26px; }
.form-card h2 { font-size: 1.2rem; font-weight: 800; color: var(--dark); margin-bottom: 16px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid .full { grid-column: 1 / -1; }
.form-select, .form-input, .form-textarea { width: 100%; border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; font-size: .92rem; background: #fff; }
.form-textarea { min-height: 140px; resize: vertical; }
.form-select:focus, .form-input:focus, .form-textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(27,79,202,.1); }
.form-submit { border: none; border-radius: 10px; padding: 12px 18px; background: #00B386; color: #fff; font-weight: 800; }
.form-help { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--border); color: #64748B; font-size: .9rem; line-height: 1.75; }
.error-copy { color: #DC2626; font-size: .8rem; margin-top: 6px; }
@media (max-width: 767px) { .form-grid { grid-template-columns: 1fr; } }

/* ============================================================
   public/pages/sitemap.blade.php
   ============================================================ */
.sitemap-hero { background: linear-gradient(135deg, #0A1628 0%, #0F2557 48%, #1B4FCA 100%); color: #fff; padding: 52px 0 68px; }
.sitemap-title { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.06; font-weight: 800; margin: 0 0 12px; }
.sitemap-intro { color: rgba(255,255,255,.84); margin: 0; line-height: 1.8; max-width: 760px; }
.sitemap-shell { background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 240px); padding: 34px 0 72px; }
.sitemap-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 24px; box-shadow: var(--shadow-sm); height: 100%; }
.sitemap-card h2 { font-size: 1.08rem; font-weight: 800; color: var(--dark); margin-bottom: 14px; }
.sitemap-list { display: grid; gap: 10px; }
.sitemap-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-radius: 12px; background: #F8FAFC; border: 1px solid transparent; color: #334155; text-decoration: none; font-weight: 600; }
.sitemap-link:hover { border-color: var(--primary-light); background: #EFF6FF; color: var(--primary); }
.sitemap-city-meta { font-size: .78rem; color: #64748B; font-weight: 500; }

/* ============================================================
   public/pages/show.blade.php
   ============================================================ */
.page-hero { background: linear-gradient(135deg, #0A1628 0%, #0F2557 48%, #1B4FCA 100%); color: #fff; padding: 54px 0 72px; position: relative; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: auto -60px -120px auto; width: 320px; height: 320px; border-radius: 50%; background: rgba(255,255,255,.07); }
.page-hero::after { content: ''; position: absolute; inset: -120px auto auto -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(16,185,129,.12); }
.page-hero-inner { position: relative; z-index: 1; max-width: 880px; }
.page-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.82); margin-bottom: 16px; }
.page-eyebrow::before { content: ''; width: 30px; height: 3px; border-radius: 999px; background: #00B386; }
.page-title { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.06; font-weight: 800; margin: 0 0 14px; }
.page-intro { max-width: 760px; font-size: 1rem; line-height: 1.8; color: rgba(255,255,255,.84); margin: 0; }
.page-body { background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 220px); padding: 34px 0 72px; }
.page-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 24px; box-shadow: var(--shadow-sm); height: 100%; }
.page-card-icon { width: 52px; height: 52px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: var(--primary-light); color: var(--primary); font-size: 1.2rem; margin-bottom: 14px; }
.page-card h3 { font-size: 1.05rem; font-weight: 800; color: var(--dark); margin-bottom: 8px; }
.page-card p { margin: 0; color: #64748B; line-height: 1.75; font-size: .92rem; }
.page-section { background: #fff; border: 1px solid var(--border); border-radius: 20px; padding: 26px 28px; box-shadow: var(--shadow-sm); height: 100%; }
.page-section h2 { font-size: 1.2rem; font-weight: 800; color: var(--dark); margin-bottom: 12px; }
.page-section p { color: #475569; line-height: 1.82; margin-bottom: 12px; }
.page-section p:last-child { margin-bottom: 0; }
.page-cta { border-radius: 24px; padding: 34px; background: linear-gradient(135deg, #0F2557 0%, #1B4FCA 100%); color: #fff; position: relative; overflow: hidden; }
.page-cta::after { content: ''; position: absolute; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,.06); right: -60px; top: -90px; }
.page-cta h2 { font-size: 1.6rem; font-weight: 800; margin-bottom: 8px; position: relative; z-index: 1; }
.page-cta p { color: rgba(255,255,255,.82); margin: 0; position: relative; z-index: 1; }
.page-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; align-items: center; position: relative; z-index: 1; }
.page-btn-primary { display: inline-flex; align-items: center; justify-content: center; padding: 11px 18px; border-radius: 10px; background: #00B386; color: #fff; text-decoration: none; font-weight: 700; }
.page-btn-secondary { display: inline-flex; align-items: center; justify-content: center; padding: 11px 18px; border-radius: 10px; border: 1px solid rgba(255,255,255,.28); color: #fff; text-decoration: none; font-weight: 700; }
@media (max-width: 991px) { .page-cta-actions { justify-content: flex-start; margin-top: 18px; } }

/* ============================================================
   auth/choose-package.blade.php
   ============================================================ */
.choose-pkg-wrap { max-width: 960px; margin: 0 auto; padding: 56px 20px; }
.choose-pkg-head { text-align: center; margin-bottom: 36px; }
.choose-pkg-head h1 { font-size: 1.8rem; font-weight: 800; color: #0f172a; margin: 0 0 8px; }
.choose-pkg-head p { color: #64748b; margin: 0; }
.choose-pkg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.choose-pkg-card { border: 1px solid #e2e8f0; border-radius: 18px; padding: 24px; background: #fff; display: flex; flex-direction: column; }
.choose-pkg-card h5 { font-weight: 800; margin: 0; color: #0f172a; }
.choose-pkg-price { font-size: 1.4rem; font-weight: 800; color: #0f172a; margin-top: 8px; }
.choose-pkg-badge { display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: .72rem; font-weight: 700; margin-bottom: 8px; }
.choose-pkg-badge-free { background: #EFF6FF; color: #1D4ED8; }
.choose-pkg-badge-paid { background: #ECFDF5; color: #059669; }
.choose-pkg-summary { font-size: .85rem; }
.choose-pkg-features { font-size: .85rem; padding-left: 18px; color: #475569; }
.choose-pkg-btn-current { background: #F1F5F9; color: #64748B; border-radius: 10px; font-weight: 700; border: none; padding: 10px; }
.choose-pkg-btn-pending { background: #FFFBEB; color: #92400E; border-radius: 10px; font-weight: 700; border: none; padding: 10px; }
.choose-pkg-btn-select { background: var(--primary); color: #fff; border-radius: 10px; font-weight: 700; border: none; padding: 10px; }
.choose-pkg-skip { text-align: center; margin-top: 32px; }
.choose-pkg-skip a { color: #64748b; text-decoration: none; font-size: .9rem; }
.choose-pkg-skip a:hover { color: #1B4FCA; }
.bcard-rating { flex-shrink: 0; text-align: center; background: #FFFBEB; border: 1px solid #FDE68A; border-radius: 10px; padding: 6px 10px; min-width: 62px; }
.bcard-rating-num { font-size: 1.25rem; font-weight: 800; color: #92400E; line-height: 1; }
.bcard-stars { display: flex; gap: 1px; justify-content: center; margin: 3px 0 2px; }
.bcard-stars .fa-star { color: var(--border); font-size: .6rem; }
.bcard-stars .fa-star.filled { color: #F59E0B; }
.bcard-reviews { font-size: .6rem; color: #78350F; font-weight: 500; white-space: nowrap; }
.bcard-location { font-size: .8rem; color: var(--gray); margin-top: 10px; display: flex; align-items: center; gap: 6px; }
.bcard-location .fa-map-marker-alt { color: var(--primary); font-size: .75rem; }
.bcard-services { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 10px; }
.bcard-svc { background: #F1F5F9; color: #475569; border-radius: 6px; padding: 3px 10px; font-size: .72rem; font-weight: 500; }
.bcard-svc-more { background: var(--primary-light); color: var(--primary); font-weight: 700; }
.bcard-actions { position: relative; z-index: 2; display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid #F1F5F9; }
.bcard-btn-primary { background: var(--primary); color: #fff; border-radius: 8px; padding: 7px 16px; font-size: .8rem; font-weight: 600; text-decoration: none; transition: all .2s; display: inline-flex; align-items: center; }
.bcard-btn-primary:hover { background: var(--primary-dark); color: #fff; }
.bcard-btn-wa { background: #25D366; color: #fff; border-radius: 8px; padding: 7px 14px; font-size: .8rem; font-weight: 600; text-decoration: none; transition: all .2s; display: inline-flex; align-items: center; }
.bcard-btn-wa:hover { background: #1ebe5d; color: #fff; }
.bcard-btn-call { background: #F1F5F9; color: #334155; border-radius: 8px; padding: 7px 14px; font-size: .8rem; font-weight: 600; text-decoration: none; transition: all .2s; display: inline-flex; align-items: center; border: 1px solid var(--border); }
.bcard-btn-call:hover { background: var(--border); color: var(--dark); }

/* Pagination */
.pagination .page-link { border-radius: 8px !important; margin: 0 2px; font-weight: 600; font-size: .85rem; color: var(--primary); border: 1px solid var(--border); }
.pagination .page-item.active .page-link { background: var(--primary); border-color: var(--primary); color: #fff; }

/* SEO content card */
.dir-seo-section { background: #F8FAFC; padding: 0 0 36px; }
.dir-seo-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 28px 30px; box-shadow: var(--shadow-sm); }
.dir-seo-card h2 { font-size: 1.2rem; font-weight: 800; color: var(--dark); margin-bottom: 14px; }
.dir-seo-card :is(p, li) { color: #475569; line-height: 1.85; }
.dir-seo-card img { max-width: 100%; height: auto; border-radius: 10px; }