/* ═══════════════════════════════════════════════════════════════
   POC PREMIUM — Editorial Refinement
   PropertyOnClick · Luxury Investment Platform
   Philosophy: Luxury through restraint. Everything ~12% lighter.
   ═══════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ── */
:root {
    /* Palette — warm, never pure */
    --poc-gold:          #c9a96e;
    --poc-gold-dim:      rgba(201,169,110,0.55);
    --poc-gold-muted:    rgba(201,169,110,0.14);
    --poc-dark:          #100e0b;
    --poc-dark-nav:      rgba(14,12,8,0.97);
    --poc-dark-card:     #181410;
    --poc-dark-surface:  #1e1a14;
    --poc-cream:         #f8f5f0;
    --poc-cream-2:       #f0ebe2;
    --poc-text-primary:  rgba(255,255,255,0.92);
    --poc-text-secondary:rgba(255,255,255,0.56);
    --poc-text-dark:     #1c1812;
    --poc-text-muted:    #8c7d6a;

    /* Typography — two fonts only */
    --font-serif:   'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Scale — the 10-15% reduction lives here */
    --scale-logo:        26px;        /* was 36-40px */
    --scale-logo-sub:    8.5px;       /* was 11px */
    --scale-nav:         13px;        /* was 16px */
    --scale-body:        14px;        /* was 15-16px */
    --scale-meta:        12px;        /* was 13px */
    --scale-micro:       11px;

    /* Spacing — editorial breathing */
    --sp-xs:  4px;
    --sp-sm:  8px;
    --sp-md:  16px;
    --sp-lg:  28px;
    --sp-xl:  48px;
    --sp-2xl: 80px;

    /* Easing */
    --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in:   cubic-bezier(0.4, 0, 1, 1);

    /* Transitions */
    --t-fast:  160ms ease;
    --t-mid:   240ms ease;
    --t-slow:  340ms ease;

    /* Radius */
    --r-xs:   3px;
    --r-sm:   5px;
    --r-md:   8px;
    --r-pill: 999px;

    /* ── SEMANTIC TOKENS ──
       Canonical names every page/component should read from.
       Dark is the default; :root[data-theme="light"] below swaps
       only these values — geometry/layout never changes per theme. */
    --background:     var(--poc-dark);
    --surface:         var(--poc-dark-card);
    --text-primary:   var(--poc-text-primary);
    --text-secondary: var(--poc-text-secondary);
    --accent-gold:    var(--poc-gold);
    --border:         rgba(255,255,255,0.08);
    --header-bg:      var(--poc-dark-nav);
}

:root[data-theme="light"] {
    --background:     #f5f2ed;
    --surface:         #ffffff;
    --text-primary:   #1c1812;
    --text-secondary: rgba(36,27,14,0.62);
    --accent-gold:    var(--poc-gold);
    --border:         rgba(36,27,14,0.08);
    --header-bg:      rgba(248,245,240,0.92);
}

/* ═══════════════════════════════════════════════════════════════
   FOUNDATION — Font System
   Rule: Inter everywhere. Playfair only for headings + logo.
   i elements intentionally excluded so Font Awesome self-manages.
   ═══════════════════════════════════════════════════════════════ */

body,
p, a, li, td, th,
input, select, textarea, label,
button, .form-control, .nav-link, .dropdown-item,
span:not([class*="fa"]):not([data-icon]) {
    font-family: var(--font-sans) !important;
}

/* Playfair: headings only */
h1, h2, h3, h4, h5, h6,
.poc-hero-title,
.poc-logo-poc,
.poc-logo-name,
.poc-hd-card__title,
.poc-hotspot-card__name,
.poc-feat-card__title,
.poc-loc-card__name,
.poc-agent-card__name,
.poc-blog-card__title,
.poc-price-card__name,
.poc-agents-title-wrap .poc-agents-title,
[style*="Cormorant"], [class*="cormorant"] {
    font-family: var(--font-serif) !important;
}

/* CMS-authored legal/blog content (Terms, Privacy, blog posts) — the
   legacy theme hardcoded #111 headings for a light-only layout, which
   went unreadable once dark mode became the default background. */
.homec-blog-content strong,
.homec-blog-content h1,
.homec-blog-content h2,
.homec-blog-content h3,
.homec-blog-content h4,
.homec-blog-content h5,
.homec-blog-content h6 {
    color: var(--text-primary);
}

/* ═══════════════════════════════════════════════════════════════
   HEADER
   Role: Support. Should almost disappear against the hero.
   ═══════════════════════════════════════════════════════════════ */

.poc-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 9999;
    background: transparent;
    border-bottom: 1px solid var(--border);
    transition:
        background var(--t-slow),
        border-color var(--t-slow),
        backdrop-filter var(--t-slow);
}

.poc-header.scrolled {
    background: var(--header-bg) !important;
    border-bottom-color: rgba(201,169,110,0.1) !important;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

/* Inner — tighter than before */
.poc-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 0;        /* was 13-16px */
}

/* ── LOGO ──
   One master logo. Color only swaps per theme.
   All other properties (size, spacing, weight) are identical.
*/
.poc-logo-wrap {
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none !important;
    flex-shrink: 0;
}

.poc-logo-poc {
    font-family: var(--font-serif) !important;
    font-size: var(--scale-logo);       /* 26px — was 36-40px */
    font-weight: 500;
    letter-spacing: 1.5px;
    line-height: 1;
    transition: color var(--t-fast);
}

.poc-logo-name {
    font-family: var(--font-serif) !important;
    font-size: var(--scale-logo-sub);   /* 8.5px — was 11-23px */
    font-weight: 400;
    letter-spacing: 2.8px;
    text-transform: uppercase;
    line-height: 1;
    position: relative;
    top: 1px;
    transition: color var(--t-fast);
}

/* .brand-logo — single canonical logo container.
   Identical width/height/object-fit/position in both themes;
   only which image variant is visible changes. Render width
   target 160-200px, clear space = height of the wordmark. */
.brand-logo {
    display: flex;
    align-items: center;
}

.poc-logo-img {
    height: 40px;
    max-height: 40px;
    width: auto;
    max-width: 190px;
    object-fit: contain;
    object-position: left center;
    display: block;
}

/* Dark theme: gold POC, muted subtitle */
[data-theme="dark"] .poc-logo-poc,
.poc-header:not([data-theme="light"]) .poc-logo-poc {
    color: var(--poc-gold);
}
[data-theme="dark"] .poc-logo-name,
.poc-header:not([data-theme="light"]) .poc-logo-name {
    color: rgba(244,237,228,0.5);
}

/* Light theme: dark brown — same structure, only color swaps */
[data-theme="light"] .poc-logo-poc  { color: #241b0e; }
[data-theme="light"] .poc-logo-name { color: rgba(36,27,14,0.45); }

/* ── NAVIGATION ── */

/* Push entire nav to the right — sits between logo and right icons */
.poc-nav {
    display: flex;
    align-items: center;
    margin-left: auto;   /* takes all remaining space from logo */
    margin-right: 12px;  /* gap before right-side icons */
}

.poc-nav .nav-menu {
    display: flex;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0; padding: 0;
}

.poc-nav .nav-menu > li > a {
    font-family: var(--font-sans) !important;
    font-size: var(--scale-nav);        /* 13px — was 16-17px */
    font-weight: 300;                   /* lighter than before */
    letter-spacing: 0.25px;
    color: rgba(255,255,255,0.72);      /* softer than before */
    padding: 6px 14px;                  /* was 8px 18px */
    border-radius: var(--r-xs);
    display: flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color var(--t-fast),
        background var(--t-fast);
}

.poc-nav .nav-menu > li > a::after { display: none; }

.poc-nav .nav-menu > li > a:hover {
    color: rgba(255,255,255,0.95);
    background: rgba(255,255,255,0.04);
}

.poc-nav .nav-menu > li.active > a {
    color: var(--poc-gold);
}

/* Dropdown chevron */
.poc-nav-arrow {
    display: inline-flex;
    align-items: center;
    opacity: 0.4;
    flex-shrink: 0;
    transition: transform var(--t-fast), opacity var(--t-fast);
}
.poc-nav-arrow svg {
    display: block;
    width: 11px; height: 11px;     /* was 12-14px */
    stroke: currentColor;
    fill: none;
    stroke-width: 1.5;
}
.poc-nav .menu-item-has-children:hover .poc-nav-arrow {
    transform: rotate(180deg);
    opacity: 0.7;
}

/* Sub-menu */
.poc-nav .nav-menu li { position: relative; }

.poc-nav .nav-menu .sub-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 190px;           /* was 200-210px */
    background: var(--poc-dark-nav);
    border: 1px solid rgba(201,169,110,0.1);
    border-radius: var(--r-md);
    padding: 5px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition:
        opacity var(--t-mid),
        transform var(--t-mid),
        visibility var(--t-mid);
    z-index: 9999;
    list-style: none;
    margin: 0;
    box-shadow: 0 16px 48px rgba(0,0,0,0.6);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.poc-nav .nav-menu li:hover > .sub-menu,
.poc-nav .nav-menu li.poc-dropdown-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.poc-nav .nav-menu .sub-menu li a {
    font-family: var(--font-sans) !important;
    font-size: 12px;            /* was 13-14px */
    font-weight: 300;
    color: rgba(255,255,255,0.55);
    padding: 7px 16px;          /* was 8-9px 18-20px */
    display: block;
    text-decoration: none;
    letter-spacing: 0.1px;
    transition:
        color var(--t-fast),
        padding-left var(--t-fast);
}

.poc-nav .nav-menu .sub-menu li a:hover {
    color: var(--poc-gold);
    padding-left: 22px;
    background: rgba(201,169,110,0.03);
}

/* Right side of header */
.poc-header-right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Icon buttons — theme toggle + user */
.poc-theme-toggle,
.poc-user-btn {
    width: 32px;  height: 32px;    /* was 38px */
    border-radius: var(--r-pill);
    border: 1px solid rgba(255,255,255,0.13);
    background: transparent;
    color: rgba(255,255,255,0.62);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    text-decoration: none;
    transition:
        border-color var(--t-fast),
        background var(--t-fast),
        color var(--t-fast),
        transform var(--t-fast);
    padding: 0;
}

.poc-theme-toggle:hover,
.poc-user-btn:hover {
    border-color: var(--poc-gold-dim);
    color: var(--poc-gold);
    background: var(--poc-gold-muted);
}

.poc-theme-toggle svg,
.poc-user-btn svg {
    width: 15px; height: 15px;   /* was 17-18px */
    stroke: currentColor;
    fill: none;
    flex-shrink: 0;
}

/* Logged-in user avatar + account dropdown */
.poc-user-menu {
    position: relative;
    flex-shrink: 0;
}
.poc-user-btn--avatar {
    overflow: hidden;
    padding: 0;
}
.poc-user-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--r-pill);
    display: block;
}
.poc-user-dropdown {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    min-width: 230px;
    background: var(--poc-dark-nav);
    border: 1px solid rgba(201,169,110,0.14);
    border-radius: var(--r-md);
    padding: 8px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity var(--t-mid), transform var(--t-mid), visibility var(--t-mid);
    z-index: 9999;
    box-shadow: 0 16px 48px rgba(0,0,0,0.6);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}
.poc-user-menu.is-open .poc-user-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.poc-user-dropdown__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 16px 12px;
    margin-bottom: 6px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.poc-user-dropdown__avatar {
    width: 38px;
    height: 38px;
    border-radius: var(--r-pill);
    object-fit: cover;
    flex-shrink: 0;
}
.poc-user-dropdown__id {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.poc-user-dropdown__id strong {
    font-size: 13px;
    font-weight: 600;
    color: var(--poc-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.poc-user-dropdown__id span {
    font-size: 11px;
    color: var(--poc-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.poc-user-dropdown a {
    font-family: var(--font-sans) !important;
    font-size: 12.5px;
    font-weight: 400;
    color: rgba(255,255,255,0.68);
    padding: 8px 16px;
    display: block;
    text-decoration: none;
    transition: color var(--t-fast), padding-left var(--t-fast), background var(--t-fast);
}
.poc-user-dropdown a:hover {
    color: var(--poc-gold);
    padding-left: 20px;
    background: rgba(201,169,110,0.05);
}
.poc-user-dropdown__sep {
    height: 1px;
    margin: 6px 0;
    background: rgba(255,255,255,0.08);
}
.poc-user-dropdown__logout {
    color: #e2867a !important;
}
.poc-user-dropdown__logout:hover {
    color: #f0a89e !important;
    background: rgba(226,134,122,0.08) !important;
}

/* "Create Property" CTA — restrained */
.poc-create-btn {
    font-family: var(--font-sans) !important;
    font-size: var(--scale-meta);
    font-weight: 500;
    letter-spacing: 0.2px;
    background: var(--poc-gold);
    color: #100e0b !important;
    padding: 7px 16px;          /* was 9px 18px */
    border-radius: var(--r-sm);
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--t-fast), opacity var(--t-fast);
    display: inline-flex;
    align-items: center;
}
.poc-create-btn:hover {
    background: #b8955a;
    color: #100e0b !important;
}

/* Hamburger */
.poc-toggler {
    display: none;
    flex-direction: column;
    gap: 4px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
}
.poc-toggler .line {
    display: block;
    width: 20px; height: 1.5px;    /* was 24px / 2px */
    background: rgba(255,255,255,0.7);
    border-radius: 2px;
    transition: background var(--t-fast);
}
.poc-toggler:hover .line { background: var(--poc-gold); }

/* Light theme header — transparent at the top just like dark theme,
   only turns opaque once scrolled. */
[data-theme="light"] .poc-header {
    background: transparent !important;
    border-bottom-color: var(--border) !important;
}
[data-theme="light"] .poc-header.scrolled {
    background: rgba(248,245,240,0.98) !important;
    box-shadow: 0 1px 16px rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .poc-nav .nav-menu > li > a {
    color: rgba(36,27,14,0.68);
}
[data-theme="light"] .poc-nav .nav-menu > li > a:hover {
    color: #241b0e;
    background: rgba(36,27,14,0.04);
}
[data-theme="light"] .poc-theme-toggle,
[data-theme="light"] .poc-user-btn {
    border-color: rgba(36,27,14,0.12);
    color: rgba(36,27,14,0.6);
}
[data-theme="light"] .poc-theme-toggle:hover,
[data-theme="light"] .poc-user-btn:hover {
    border-color: var(--poc-gold);
    color: #8a5c1a;
    background: rgba(201,169,110,0.07);
}
[data-theme="light"] .poc-toggler .line { background: rgba(36,27,14,0.7); }

[data-theme="light"] .poc-user-dropdown {
    background: #ffffff;
    border-color: rgba(36,27,14,0.1);
    box-shadow: 0 16px 48px rgba(0,0,0,0.14);
}
[data-theme="light"] .poc-user-dropdown__head {
    border-bottom-color: rgba(36,27,14,0.08);
}
[data-theme="light"] .poc-user-dropdown__id strong {
    color: #1c1812;
}
[data-theme="light"] .poc-user-dropdown__id span {
    color: rgba(36,27,14,0.5);
}
[data-theme="light"] .poc-user-dropdown a {
    color: rgba(36,27,14,0.72);
}
[data-theme="light"] .poc-user-dropdown a:hover {
    color: #8a5c1a;
    background: rgba(201,169,110,0.08);
}
[data-theme="light"] .poc-user-dropdown__sep {
    background: rgba(36,27,14,0.08);
}
[data-theme="light"] .poc-user-dropdown__logout {
    color: #c04b3a !important;
}
[data-theme="light"] .poc-user-dropdown__logout:hover {
    background: rgba(192,75,58,0.08) !important;
}

/* Dark/Light mode icon visibility */
[data-theme="dark"] .poc-icon-sun  { display: none; }
[data-theme="dark"] .poc-icon-moon { display: block; }
[data-theme="light"] .poc-icon-sun  { display: block; }
[data-theme="light"] .poc-icon-moon { display: none; }

/* ═══════════════════════════════════════════════════════════════
   HERO SECTION
   Role: Inspire. Everything else subordinates to this.
   ═══════════════════════════════════════════════════════════════ */

.poc-hero {
    position: relative;
    min-height: 96vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Background */
.poc-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center 30%;
    background-repeat: no-repeat;
    transform: scale(1.04);
    transition: transform 8s ease-out;
    will-change: transform;
}
.poc-hero:hover .poc-hero-bg {
    transform: scale(1.0);
}

/* Light theme uses a genuinely light interior photo, not the dark one with a wash. */
.poc-hero-bg--light { display: none; }
[data-theme="light"] .poc-hero-bg--dark { display: none; }
[data-theme="light"] .poc-hero-bg--light { display: block; }

/* Overlay — warm, cinematic, text always wins */
.poc-hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            to bottom,
            rgba(8,5,2,0.52) 0%,
            rgba(6,4,1,0.34) 35%,
            rgba(6,4,1,0.36) 65%,
            rgba(4,2,0,0.78) 100%
        ),
        linear-gradient(
            112deg,
            rgba(40,24,6,0.44) 0%,
            rgba(12,8,2,0.12) 60%,
            transparent 100%
        );
}

/* Light theme: the hero photo (hero-bgl.png) is already bright, so it only
   needs a light, warm-dark scrim for text contrast — not a cream wash that
   fogs the image. Same white hero text as dark theme; only the photo and
   scrim strength change between themes. */
[data-theme="light"] .poc-hero-overlay {
    background:
        linear-gradient(
            to bottom,
            rgba(20,14,6,0.22) 0%,
            rgba(20,14,6,0.08) 35%,
            rgba(20,14,6,0.10) 65%,
            rgba(15,10,4,0.42) 100%
        ),
        linear-gradient(
            112deg,
            rgba(20,14,6,0.34) 0%,
            rgba(20,14,6,0.08) 55%,
            transparent 100%
        );
}
[data-theme="light"] .poc-hero-metrics {
    background: rgba(36,27,14,0.08);
    border-color: rgba(36,27,14,0.1);
}
[data-theme="light"] .poc-metric-card {
    background: rgba(255,255,255,0.75);
}
[data-theme="light"] .poc-metric-copy strong {
    color: var(--text-primary);
}
[data-theme="light"] .poc-metric-copy span {
    color: var(--text-secondary);
}
[data-theme="light"] .poc-brands-label {
    color: rgba(36,27,14,0.55);
}

/* Top-right actions — must sit visually BELOW the fixed header */
.poc-hero-actions {
    position: absolute;
    top: 92px;          /* header ~44px + 48px breathing gap */
    right: 40px;
    display: flex;
    align-items: center;
    gap: 8px;
    z-index: 8;         /* below header (9999) so header stays on top */
}

.poc-advisor-btn,
.poc-track-btn {
    font-family: var(--font-sans) !important;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;           /* was 11px 28px */
    border-radius: var(--r-pill);
    text-decoration: none;
    white-space: nowrap;
    transition:
        background var(--t-fast),
        border-color var(--t-fast),
        color var(--t-fast);
}

.poc-advisor-btn {
    background: rgba(10,7,3,0.42);
    border: 1px solid rgba(255,255,255,0.18);
    color: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.poc-advisor-btn:hover {
    background: rgba(10,7,3,0.65);
    border-color: rgba(255,255,255,0.34);
    color: #fff !important;
}

.poc-track-btn {
    background: rgba(201,169,110,0.15);
    border: 1px solid rgba(201,169,110,0.32);
    color: rgba(253,233,178,0.9) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.poc-track-btn:hover {
    background: rgba(201,169,110,0.28);
    border-color: var(--poc-gold);
    color: #fde9a2 !important;
}

.poc-advisor-btn svg,
.poc-track-btn svg {
    width: 13px; height: 13px;   /* was 16px */
    stroke: currentColor;
    fill: none;
    stroke-width: 1.75;
    flex-shrink: 0;
}

/* Hero content — left-aligned, shifted right of edge */
.poc-hero-inner {
    position: relative;
    z-index: 20;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 172px 48px 28px 8%;  /* 8% left indent shifts content rightward */
}

/* Eyebrow badge — sits above the headline */
.poc-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-sans) !important;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.3px;
    color: rgba(253,233,178,0.92);
    background: rgba(10,7,3,0.4);
    border: 1px solid rgba(201,169,110,0.4);
    padding: 7px 16px;
    border-radius: var(--r-pill);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    margin: 0 0 18px;
}
.poc-hero-badge svg {
    width: 13px; height: 13px;
    stroke: var(--poc-gold);
    fill: none;
    flex-shrink: 0;
}

/* Hero heading — editorial, restrained */
.poc-hero-title {
    font-family: var(--font-serif) !important;
    font-size: 46px;             /* was 54px — 15% reduction */
    font-weight: 400;
    line-height: 1.26;           /* slightly more open */
    letter-spacing: -0.3px;
    color: rgba(255,255,255,0.97);
    text-shadow: 0 1px 24px rgba(0,0,0,0.35);
    max-width: 680px;
    margin: 0 0 14px;
    text-align: left;
}

.poc-hero-title-accent {
    color: var(--poc-gold);
}

/* Subtitle — whisper, not shout */
.poc-hero-subtitle {
    font-family: var(--font-sans) !important;
    font-size: 15px;             /* was 17px */
    font-weight: 300;
    color: rgba(255,255,255,0.6);
    letter-spacing: 0.2px;
    line-height: 1.7;
    max-width: 480px;
    margin: 0 0 36px;
    text-align: left;
}

/* ═══════════════════════════════════════════════════════════════
   SEARCH
   Role: Invite. Floating, soft, premium product feel.
   ═══════════════════════════════════════════════════════════════ */

/* Buy / Rent / Projects tabs — left-aligned with hero title */
.poc-search-tabs {
    display: flex;
    justify-content: flex-start;
    gap: 5px;
    margin: 0 0 12px;
}

.poc-search-tab {
    font-family: var(--font-sans) !important;
    font-size: 12px;             /* was 13px */
    font-weight: 400;
    letter-spacing: 0.35px;
    min-width: 72px;             /* was 88px */
    padding: 7px 18px;           /* was 9px 22px */
    border-radius: var(--r-pill);
    border: 1px solid rgba(255,255,255,0.2);
    background: rgba(10,7,3,0.22);
    color: rgba(255,255,255,0.72);
    cursor: pointer;
    line-height: 1;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition:
        background var(--t-mid),
        color var(--t-mid),
        border-color var(--t-mid),
        box-shadow var(--t-mid);
}

.poc-search-tab:hover {
    border-color: rgba(255,255,255,0.42);
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.9);
}

.poc-search-tab.active {
    background: linear-gradient(135deg, #d8b578, var(--poc-gold));
    color: #1c1206;
    border-color: transparent;
    box-shadow: 0 2px 16px rgba(201,169,110,0.4);
    font-weight: 600;
}

/* Search container — left-aligned to match hero title */
.poc-search-form {
    width: 100%;
    max-width: min(1180px, calc(100vw - 96px));
    margin: 0;
}

/* The bar itself — floating, elegant */
.poc-search-bar {
    display: flex;
    align-items: stretch;
    width: 100%;
    background: rgba(255,255,255,0.97);
    border: 1px solid rgba(255,255,255,0.28);
    border-radius: 5px 36px 36px 5px;
    min-height: 62px;            /* was 74px */
    margin: 0 auto 18px;
    box-shadow:
        0 6px 28px rgba(0,0,0,0.22),
        0 1px 6px rgba(0,0,0,0.1);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    overflow: visible;
    position: relative;
    transition: box-shadow var(--t-mid);
}

.poc-search-bar:focus-within {
    box-shadow:
        0 10px 36px rgba(0,0,0,0.28),
        0 0 0 2px rgba(201,169,110,0.15);
}

/* Dividers between items */
.poc-search-sep {
    width: 1px;
    background: rgba(201,169,110,0.16);
    margin: 14px 0;
    flex-shrink: 0;
}

/* Each field */
.poc-search-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;             /* was 0 22px */
    flex: 0 1 190px;
    min-width: 0;
    height: 62px;                /* was 74px */
    cursor: pointer;
    position: relative;
    border-radius: 4px;
    transition: background var(--t-fast);
}

.poc-search-item--wide {
    flex: 0.78 1 270px;
    min-width: 190px;
}

.poc-search-item:hover {
    background: rgba(201,169,110,0.03);
}

.poc-search-item:focus-within {
    background: rgba(201,169,110,0.05) !important;
}

.poc-search-item svg {
    flex-shrink: 0;
    opacity: 0.32;
    width: 16px; height: 16px;  /* was 18px */
    color: var(--poc-text-dark);
    stroke: currentColor;
    stroke-width: 1.75;
}

/* Input inside search */
.poc-search-input {
    font-family: var(--font-sans) !important;
    font-size: 14px;             /* was 15px */
    font-weight: 400;
    color: var(--poc-text-dark);
    height: auto;
    line-height: 1.4;
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    min-width: 0;
}

.poc-search-input::placeholder {
    color: #a89882;
    font-weight: 300;
    opacity: 1;
}

select.poc-search-select {
    font-family: var(--font-sans) !important;
    font-size: 14px;
    font-weight: 400;
    color: var(--poc-text-dark);
    height: auto;
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    min-width: 0;
    text-overflow: ellipsis;
    cursor: pointer;
}

/* Search button */
.poc-search-submit {
    font-family: var(--font-sans) !important;
    font-size: 14px;             /* was 16px */
    font-weight: 500;
    letter-spacing: 0.25px;
    background: var(--poc-dark);
    color: rgba(255,255,255,0.92);
    border: none;
    padding: 0 clamp(26px, 3vw, 44px);             /* was 0 52px */
    border-radius: 0 34px 34px 0;
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 62px;            /* was 74px */
    align-self: stretch;
    transition: background var(--t-fast);
}

.poc-search-submit svg {
    width: 14px; height: 14px;  /* was 17px */
    stroke: currentColor;
    fill: none;
    stroke-width: 1.75;
}

.poc-search-submit:hover {
    background: #1e1a12;
}

/* Light theme search */
[data-theme="light"] .poc-search-bar {
    background: rgba(255,252,248,0.98);
    border-color: rgba(201,169,110,0.2);
    box-shadow:
        0 6px 28px rgba(0,0,0,0.12),
        0 1px 6px rgba(0,0,0,0.06);
}
[data-theme="light"] .poc-search-sep {
    background: rgba(201,169,110,0.14);
}
[data-theme="light"] .poc-search-submit {
    background: #241b0e;
}
[data-theme="light"] .poc-search-submit:hover {
    background: #1a1208;
}
[data-theme="light"] .poc-search-tab {
    border-color: rgba(255,255,255,0.24);
}

/* ═══════════════════════════════════════════════════════════════
   METRICS / STATS BAR
   Role: Reassure. Light, factual, subordinate to hero.
   ═══════════════════════════════════════════════════════════════ */

.poc-hero-metrics {
    position: relative;
    z-index: 12;
    /* Left edge matches .poc-hero-inner's 8% left padding exactly, so this bar
       lines up with the badge/title/subtitle/search-bar above it instead of
       being independently centered. */
    max-width: 1400px;
    margin: 40px 48px 0 8%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: var(--r-md);
    overflow: hidden;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.poc-metric-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    background: rgba(10,7,3,0.5);
}

.poc-metric-card svg {
    width: 18px; height: 18px;
    stroke: var(--poc-gold);
    fill: none;
    flex-shrink: 0;
}

.poc-metric-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.poc-metric-copy strong {
    font-family: var(--font-sans) !important;
    font-size: 15px;
    font-weight: 600;
    color: rgba(253,233,162,0.92);
    letter-spacing: -0.2px;
    line-height: 1.2;
    white-space: nowrap;
}

.poc-metric-copy span {
    font-family: var(--font-sans) !important;
    font-size: 11px;
    font-weight: 300;
    color: rgba(247,234,208,0.55);
    letter-spacing: 0.2px;
    line-height: 1.2;
    white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════════════
   DEVELOPER LOGOS / BRANDS BAR
   Role: Trust signal. Equal weight, quiet, unified.
   ═══════════════════════════════════════════════════════════════ */

.poc-brands-label {
    font-family: var(--font-sans) !important;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.75); /* Increased opacity from 0.22 to 0.75 for maximum visibility */
    margin-bottom: 16px;
    text-align: center;
}

.poc-brands-bar {
    position: relative;
    z-index: 12;
    width: calc(100% - 96px);
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px 52px 24px;     /* was 24-28px 56px */
}

.poc-brands-footer { display: none; }

.poc-brands-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0;
}

/* Each brand: normalized 160×54px — was 200×72px */
.poc-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 160px;
    height: 54px;
    opacity: 0.5;                /* was 0.65 — more restrained */
    transition: opacity var(--t-mid);
    cursor: pointer;
    color: #f0e0c0;
    flex-shrink: 0;
    gap: 7px;
}

.poc-brand:hover { opacity: 0.85; }

/* SVG and Image brand logos */
.poc-brand-svg,
.poc-brand-img {
    width: 100%;
    max-width: 140px;
    height: 36px;
    color: #f0e0c0;        /* currentColor inherited by SVG fill/stroke */
    overflow: visible;
    object-fit: contain;
}

.poc-brand-img {
    max-width: 120px;
    max-height: 32px;
    filter: brightness(0) invert(1); /* Converts black logo text on light bg into solid white logos */
    transition: transform 0.25s ease;
}

.poc-brand:hover .poc-brand-img {
    transform: scale(1.05);
}

/* ═══════════════════════════════════════════════════════════════
   WHITESPACE — The invisible luxury
   Measured breathing between every section.
   ═══════════════════════════════════════════════════════════════ */

/* Spacing chain — top to bottom */
.poc-hero-title     { margin-bottom: 14px; }
.poc-hero-subtitle  { margin-bottom: 36px; }
.poc-search-tabs    { margin-bottom: 12px; }
.poc-search-bar     { margin-bottom: 18px; }
.poc-hero-metrics   { margin-top: 40px; }
.poc-brands-bar     { padding-top: 20px; padding-bottom: 24px; }

/* ═══════════════════════════════════════════════════════════════
   ANIMATIONS
   150-250ms. Opacity, subtle elevation. Never bounce.
   ═══════════════════════════════════════════════════════════════ */

.poc-search-submit,
.poc-advisor-btn,
.poc-track-btn,
.poc-search-tab,
.poc-create-btn {
    transition-duration: 180ms;
    transition-timing-function: ease;
}

/* ═══════════════════════════════════════════════════════════════
   LIGHT THEME — Global
   Warm ivory. Dark charcoal text. No harsh contrast.
   ═══════════════════════════════════════════════════════════════ */

[data-theme="light"] body {
    background-color: #f5f2ed !important;
    color: #1c1812 !important;
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — Maintain hierarchy at every viewport
   ═══════════════════════════════════════════════════════════════ */

/* 1440px desktop */
@media (max-width: 1440px) {
    .poc-hero-title  { font-size: 44px; }
    .poc-brands-bar  { width: calc(100% - 72px); }
    .poc-brand       { width: 150px; }
}

/* 1280px */
@media (max-width: 1280px) {
    .poc-hero-title  { font-size: 40px; }
    .poc-search-form { max-width: min(1040px, calc(100vw - 72px)); }
    .poc-search-item { flex-basis: 160px; padding: 0 14px; }
    .poc-search-item--wide { flex-basis: 245px; min-width: 185px; }
    .poc-search-submit { padding: 0 30px; }
    .poc-brand       { width: 130px; }
    .poc-brand-svg   { max-width: 120px; }
}

/* 1024px laptop */
@media (max-width: 1024px) {
    :root { --scale-nav: 12.5px; }
    .poc-hero-title    { font-size: 36px; max-width: 580px; }
    .poc-hero-subtitle { font-size: 14px; }
    .poc-search-form   { max-width: min(940px, calc(100vw - 48px)); }
    .poc-search-item   { height: 54px; padding: 0 12px; flex-basis: 145px; gap: 8px; }
    .poc-search-item--wide { flex-basis: 220px; min-width: 170px; }
    .poc-search-submit { min-height: 54px; padding: 0 24px; }
    .poc-search-bar    { min-height: 54px; }
    .poc-brands-bar    { width: calc(100% - 40px); padding-left: 28px; padding-right: 28px; }
    .poc-brand         { width: 130px; height: 50px; }
}

/* Tablet 768-991 */
@media (max-width: 991px) {
    .poc-hero              { min-height: 76vh; }
    .poc-hero-inner        { padding: 130px 24px 24px; }
    .poc-hero-title        { font-size: 32px; max-width: 100%; }
    .poc-hero-subtitle     { font-size: 14px; max-width: 100%; }
    .poc-search-form       { max-width: 100%; }
    .poc-hero-metrics      { margin: 28px 24px 0 24px; grid-template-columns: repeat(2, 1fr); }
    .poc-brand             { width: auto; height: auto; padding: 0 10px; }
    .poc-nav               { display: none; }
    .poc-toggler           { display: flex; }
    .poc-logo-poc          { font-size: 22px; }
    .poc-hero-actions      { top: 78px; right: 20px; }
}

/* Mobile */
@media (max-width: 767px) {
    .poc-hero              { min-height: 68vh; }
    .poc-hero-inner        { padding: 115px 16px 22px; }
    .poc-hero-title        { font-size: 26px; letter-spacing: 0; }
    .poc-hero-subtitle     { font-size: 13px; margin-bottom: 24px; }
    .poc-search-bar        {
        flex-direction: column;
        border-radius: 10px;
        min-height: auto;
        overflow: visible;
    }
    .poc-search-sep        { width: calc(100% - 28px); height: 1px; margin: 0 14px; background: rgba(201,169,110,0.12); }
    .poc-search-item       { height: 50px; flex: none; width: 100%; padding: 0 16px; border-radius: 0; }
    .poc-search-submit     {
        width: 100%;
        min-height: 50px;
        padding: 12px 20px;
        border-radius: 0 0 10px 10px;
        justify-content: center;
        font-size: 13px;
    }
    .poc-search-tabs       { gap: 5px; }
    .poc-search-tab        { min-width: 68px; padding: 6px 14px; font-size: 11px; }
    .poc-hero-metrics      { margin: 18px 16px 0 16px; grid-template-columns: repeat(2, 1fr); }
    .poc-metric-card       { padding: 12px 14px; }
    .poc-metric-card svg   { width: 15px; height: 15px; }
    .poc-metric-copy strong{ font-size: 13px; }
    .poc-metric-copy span  { font-size: 10px; }
    .poc-brands-bar        { width: 100%; padding: 16px 18px 20px; }
    .poc-brands-row        { justify-content: center; flex-wrap: wrap; gap: 4px; }
    .poc-brand             { width: auto; height: 44px; padding: 0 8px; }
    .poc-brand-svg         { max-width: 100px; height: 30px; }
    .poc-hero-actions      { gap: 6px; right: 14px; }
    .poc-advisor-btn,
    .poc-track-btn         { padding: 6px 11px; font-size: 11px; }
}

/* Small mobile */
@media (max-width: 480px) {
    .poc-hero-title        { font-size: 22px; }
    .poc-hero-subtitle     { font-size: 12px; }
    .poc-hero-inner        { padding-top: 105px; }
}

/* Short viewport (laptop with toolbar) */
@media (min-width: 992px) and (max-height: 740px) {
    .poc-hero              { min-height: 100vh; }
    .poc-hero-inner        { padding-top: clamp(120px, 16vh, 155px); padding-bottom: 16px; }
    .poc-hero-title        { font-size: clamp(32px, 2.8vw, 42px); margin-bottom: 12px; }
    .poc-hero-subtitle     { font-size: 14px; margin-bottom: 24px; }
    .poc-search-item,
    .poc-search-submit     { height: 56px; min-height: 56px; }
    .poc-search-bar        { min-height: 56px; }
    .poc-hero-metrics      { margin-top: 24px; }
    .poc-brands-bar        { padding: 14px 36px 18px; }
    .poc-brand             { height: 48px; }
}

/* ═══════════════════════════════════════════════════════════════
   UTILITIES
   ═══════════════════════════════════════════════════════════════ */

.poc-text-serif  { font-family: var(--font-serif) !important; }
.poc-text-sans   { font-family: var(--font-sans) !important; }
.poc-text-gold   { color: var(--poc-gold) !important; }
.poc-text-muted  { color: var(--poc-text-muted) !important; }

/* Reusable button — outline gold */
.poc-btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: transparent;
    border: 1px solid rgba(201,169,110,0.3);
    color: var(--poc-gold) !important;
    padding: 9px 22px;           /* was 11px 28px */
    border-radius: var(--r-pill);
    font-family: var(--font-sans) !important;
    font-size: 13px;             /* was 14px */
    font-weight: 400;
    text-decoration: none;
    letter-spacing: 0.2px;
    transition:
        background var(--t-mid),
        color var(--t-mid),
        border-color var(--t-mid);
}
.poc-btn-outline:hover {
    background: var(--poc-gold);
    color: #100e0b !important;
    border-color: var(--poc-gold);
}

/* Reusable button — solid dark */
.poc-btn-solid {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--poc-dark);
    color: rgba(255,255,255,0.9) !important;
    border: none;
    padding: 10px 26px;          /* was 13px 32px */
    border-radius: var(--r-pill);
    font-family: var(--font-sans) !important;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: background var(--t-fast);
}
.poc-btn-solid:hover { background: var(--poc-dark-surface); }

/* Section "explore all" links */
.poc-hd-explore a,
.poc-hotspot-explore a,
.poc-tools-explore a,
.poc-agents-explore a,
.poc-blog-explore a,
.poc-price-explore a,
.poc-feat-explore a {
    font-family: var(--font-sans) !important;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.15px;
}

/* Image fallback */
.poc-hd-card__img img,
.poc-blog-card__img img,
.poc-agent-card__img img,
.poc-loc-card__img img,
.homec-property__head img,
.poc-feat-card__img img {
    background-color: var(--poc-dark-card);
}

.poc-hd-card__img img[src=""],
.poc-hd-card__img img:not([src]) {
    opacity: 0;
}

/* Hero overflow */
.poc-hero { overflow: hidden; }

/* ═══════════════════════════════════════════════════════════════
   PROPERTY PRICE INSIGHTS - GLOBLYS STYLE
   ═══════════════════════════════════════════════════════════════ */

.poc-price-insights {
    background:
        radial-gradient(circle at 12% 8%, rgba(201,169,110,.18), transparent 28%),
        radial-gradient(circle at 92% 92%, rgba(201,169,110,.12), transparent 32%),
        #f3f1ec;
    padding: 36px 18px;
}

.poc-price-shell {
    max-width: 90%;
    margin: 0 auto;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(18,18,18,.08);
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 30px 80px rgba(15,12,8,.12);
    overflow: hidden;
}

.poc-price-head {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.poc-price-eyebrow {
    display: inline-flex;
    color: #b8934a;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.poc-price-head h2 {
    font-family: var(--font-sans) !important;
    color: #242424;
    font-size: clamp(24px, 2vw, 36px);
    font-weight: 800;
    margin: 0 0 8px;
    letter-spacing: 0;
}

.poc-price-head p {
    color: #666;
    max-width: 1120px;
    font-size: 15px;
    line-height: 1.65;
    margin: 0;
}

.poc-ai-brief-btn {
    min-width: 168px;
    border: 1px solid rgba(201,169,110,.42);
    background: #14110d;
    color: #fff;
    border-radius: 16px;
    padding: 11px 15px;
    text-align: left;
    box-shadow: 0 16px 32px rgba(20,17,13,.18);
}

.poc-ai-brief-btn span,
.poc-ai-brief-btn small {
    display: block;
}

.poc-ai-brief-btn span {
    font-weight: 800;
}

.poc-ai-brief-btn small {
    color: #c9a96e;
    margin-top: 2px;
}

.poc-price-tabs {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 14px;
    scrollbar-width: thin;
}

.poc-price-tab {
    border: 1px solid rgba(0,0,0,.12);
    background: #fff;
    color: #2b2b2b;
    border-radius: 12px;
    min-height: 46px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
    box-shadow: 0 5px 14px rgba(0,0,0,.04);
}

.poc-price-tab.active {
    background: #262626;
    color: #fff;
    border-color: #262626;
}

.poc-ai-brief {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    background: linear-gradient(135deg, #16120e, #2a2117);
    border: 1px solid rgba(201,169,110,.35);
    color: #fff;
    border-radius: 14px;
    padding: 14px 16px;
    margin: 2px 0 16px;
}

.poc-ai-brief span {
    color: #c9a96e;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.poc-ai-brief p {
    margin: 0;
    color: rgba(255,255,255,.82);
    line-height: 1.6;
    font-size: 14px;
}

.poc-price-carousel-wrap {
    position: relative;
    margin: 0 -4px;
}

.poc-price-card-grid {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 2px 4px 12px;
    scrollbar-width: none;
}

.poc-price-card-grid::-webkit-scrollbar {
    display: none;
}

.poc-price-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    background: rgba(42,42,42,.82);
    color: #fff;
    font-size: 36px;
    line-height: 1;
    display: grid;
    place-items: center;
    box-shadow: 0 10px 30px rgba(0,0,0,.22);
}

.poc-price-arrow:hover {
    background: #c9a96e;
    color: #17120d;
}

.poc-price-arrow-prev {
    left: -22px;
}

.poc-price-arrow-next {
    right: -22px;
}

.poc-insight-card {
    flex: 0 0 clamp(280px, 20vw, 320px);
    min-height: 318px;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 14px;
    background: #fff;
    /* was overflow:hidden — that clipped chart hover tooltips that need to
       pop outside the card. ::before below now clips itself instead. */
    overflow: visible;
    padding: 15px;
    position: relative;
    box-shadow: 0 12px 30px rgba(0,0,0,.06);
    scroll-snap-align: start;
}

.poc-insight-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 104px;
    border-radius: 14px 14px 0 0;
    opacity: .78;
    pointer-events: none;
}

.poc-insight-card > * {
    position: relative;
    z-index: 1;
}

.poc-insight-card.card-blue::before { background: #d9f4ff; }
.poc-insight-card.card-peach::before { background: #ffead5; }
.poc-insight-card.card-pink::before { background: #ffe5f4; }
.poc-insight-card.card-lilac::before { background: #eee5ff; }
.poc-insight-card.card-mint::before { background: #dffbf4; }
.poc-insight-card.card-coral::before { background: #ffe0dd; }

.poc-card-top {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.poc-card-top h3 {
    font-family: var(--font-sans) !important;
    font-size: 15px;
    font-weight: 900;
    color: #303030;
    margin: 0 0 4px;
}

.poc-card-top p {
    color: #666;
    margin: 0;
    font-size: 13px;
}

.poc-card-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(255,255,255,.46);
    color: #606060;
    font-size: 24px;
    font-weight: 900;
    flex: 0 0 auto;
}

.poc-card-tip {
    min-height: 54px;
    display: flex;
    align-items: center;
    color: #666;
    background: rgba(255,255,255,.48);
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 10px;
    padding: 9px 11px;
    font-size: 12px;
    line-height: 1.55;
    margin-bottom: 14px;
}

.poc-heatmap-box {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    min-height: 118px;
    border-radius: 12px;
    background: #f8f8f8;
    overflow: hidden;
    border: 1px solid #ededed;
}

.poc-map-panel {
    padding: 12px;
    background: rgba(255,255,255,.9);
    display: grid;
    align-content: center;
    gap: 4px;
}

.poc-map-panel strong {
    color: #2b2b2b;
    font-size: 14px;
}

.poc-map-panel span {
    color: #777;
    font-size: 12px;
    margin-bottom: 8px;
}

.poc-faux-map {
    position: relative;
    background:
        linear-gradient(35deg, rgba(201,169,110,.35), transparent 40%),
        linear-gradient(135deg, rgba(88,165,198,.28), transparent 42%),
        #e9eee8;
}

.poc-faux-map i {
    position: absolute;
    border-radius: 45% 55% 48% 52%;
    background: rgba(201,169,110,.45);
    border: 1px solid rgba(110,83,34,.2);
}

.poc-faux-map i:nth-child(1){ inset: 18px auto auto 28px; width: 74px; height: 58px; }
.poc-faux-map i:nth-child(2){ inset: 82px auto auto 78px; width: 94px; height: 68px; }
.poc-faux-map i:nth-child(3){ inset: 36px 22px auto auto; width: 62px; height: 82px; }
.poc-faux-map i:nth-child(4){ inset: auto auto 18px 18px; width: 82px; height: 46px; }
.poc-faux-map i:nth-child(5){ inset: auto 42px 24px auto; width: 56px; height: 54px; }

.poc-card-bottom {
    display: block;
    margin: 14px -15px -15px;
    padding: 13px;
    text-align: center;
    color: #242424;
    background: #f5f5f5;
    font-weight: 900;
    font-size: 14px;
}

.poc-line-chart {
    height: 160px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    gap: 10px;
    border-bottom: 2px solid #e4e4e4;
    background: repeating-linear-gradient(to top, transparent 0 54px, #ededed 55px 56px);
    padding: 0 16px 12px;
}

.poc-trend-point {
    height: 140px;
    position: relative;
}

.poc-trend-point i {
    position: absolute;
    left: 50%;
    top: var(--y);
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%);
    background: #e98b37;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(233,139,55,.16);
}

.poc-trend-point span {
    position: absolute;
    left: 50%;
    bottom: -38px;
    transform: translateX(-50%) rotate(-45deg);
    color: #6b6b6b;
    font-size: 13px;
    white-space: nowrap;
}

.poc-chart-legend {
    margin-top: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: #333;
}

.poc-chart-legend span {
    width: 28px;
    height: 3px;
    background: #e98b37;
    border-radius: 999px;
}

.poc-bar-chart {
    height: 168px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 18px;
    align-items: end;
    border-bottom: 2px solid #e4e4e4;
    background: repeating-linear-gradient(to top, transparent 0 54px, #ededed 55px 56px);
    padding: 0 18px 10px;
}

.poc-bar-chart div {
    height: 132px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.poc-bar-chart span {
    width: 22px;
    background: linear-gradient(#f2a150, #c76213);
    border-radius: 8px 8px 0 0;
}

.poc-bar-chart small {
    min-height: 42px;
    color: #666;
    font-size: 12px;
    transform: rotate(-42deg);
    white-space: nowrap;
}

.poc-stat-list {
    display: grid;
    gap: 12px;
    margin-top: 12px;
}

.poc-stat-list div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e8e8e8;
}

.poc-stat-list span {
    color: #444;
    font-size: 14px;
    line-height: 1.25;
}

.poc-stat-list strong {
    background: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    color: #303030;
    padding: 10px 12px;
    min-width: 112px;
    text-align: center;
    font-size: 14px;
}

.poc-insight-card small {
    display: block;
    margin-top: 14px;
    text-align: right;
    color: #999;
}

.poc-market-bars,
.poc-rental-table,
.poc-rank-list {
    display: grid;
    gap: 10px;
}

.poc-market-bars div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    position: relative;
}

.poc-market-bars strong {
    background: #f1f1f1;
    color: #303030;
    padding: 8px 10px;
    font-size: 15px;
}

.poc-market-bars span {
    color: #3d3d3d;
    font-size: 13px;
}

.poc-market-bars i {
    grid-column: 2;
    height: 5px;
    border-radius: 999px;
    background: #d4b8ff;
}

.poc-rental-table {
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    overflow: hidden;
    gap: 0;
}

.poc-rental-table div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 10px 13px;
    background: #fff;
    border-bottom: 1px solid #e9e9e9;
}

.poc-rental-table div:last-child {
    border-bottom: 0;
}

.poc-rental-table .head {
    background: #f5f5f5;
    color: #666;
    font-weight: 700;
}

.poc-rental-table strong {
    text-align: right;
    color: #2f2f2f;
}

.poc-rank-list div,
.poc-rank-list a {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #e8e8e8;
    color: #333;
}

.poc-rank-list span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #fff;
    border: 1px solid #e4e4e4;
    color: #c9a96e;
    font-weight: 900;
}

.poc-rank-list p {
    margin: 0;
}

.poc-rank-list strong,
.poc-rank-list b {
    color: #2e2e2e;
    font-size: 13px;
}

.poc-rank-list small {
    margin: 2px 0 0;
    text-align: left;
    color: #777;
    font-size: 12px;
}

.poc-card-mini-link,
.poc-price-footer-link {
    display: inline-flex;
    align-items: center;
    color: #242424;
    font-weight: 900;
    text-decoration: underline;
}

.poc-card-mini-link {
    float: right;
    margin-top: 12px;
    background: #fff;
    border-radius: 999px;
    padding: 8px 18px;
    box-shadow: 0 8px 22px rgba(0,0,0,.12);
}

.poc-price-footer-link {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e1ded8;
    width: 100%;
    font-size: 17px;
}

[data-theme="dark"] .poc-price-insights {
    background:
        radial-gradient(circle at 12% 8%, rgba(201,169,110,.18), transparent 28%),
        radial-gradient(circle at 92% 92%, rgba(201,169,110,.1), transparent 32%),
        #080706;
}

[data-theme="dark"] .poc-price-shell {
    background: rgba(14,12,9,.94);
    border-color: rgba(201,169,110,.18);
    box-shadow: 0 34px 90px rgba(0,0,0,.45);
}

[data-theme="dark"] .poc-price-head h2,
[data-theme="dark"] .poc-card-top h3,
[data-theme="dark"] .poc-rank-list strong,
[data-theme="dark"] .poc-rank-list b,
[data-theme="dark"] .poc-stat-list strong,
[data-theme="dark"] .poc-card-mini-link,
[data-theme="dark"] .poc-price-footer-link {
    color: #f5efe6;
}

[data-theme="dark"] .poc-price-head p,
[data-theme="dark"] .poc-card-top p,
[data-theme="dark"] .poc-card-tip,
[data-theme="dark"] .poc-stat-list span,
[data-theme="dark"] .poc-market-bars span,
[data-theme="dark"] .poc-rank-list small,
[data-theme="dark"] .poc-rental-table .head,
[data-theme="dark"] .poc-rental-table div span {
    color: rgba(255,255,255,.68);
}

[data-theme="dark"] .poc-price-tab {
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.82);
    border-color: rgba(201,169,110,.18);
}

[data-theme="dark"] .poc-price-tab.active {
    background: #c9a96e;
    color: #17120d;
    border-color: #c9a96e;
}

[data-theme="dark"] .poc-insight-card {
    background: #15120e;
    border-color: rgba(201,169,110,.16);
}

[data-theme="dark"] .poc-card-tip,
[data-theme="dark"] .poc-rental-table,
[data-theme="dark"] .poc-stat-list strong,
[data-theme="dark"] .poc-market-bars strong,
[data-theme="dark"] .poc-rank-list span,
[data-theme="dark"] .poc-card-mini-link {
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.1);
}

[data-theme="dark"] .poc-rental-table div,
[data-theme="dark"] .poc-map-panel,
[data-theme="dark"] .poc-card-bottom {
    background: rgba(255,255,255,.045);
}

[data-theme="dark"] .poc-rental-table strong,
[data-theme="dark"] .poc-market-bars strong,
[data-theme="dark"] .poc-map-panel strong,
[data-theme="dark"] .poc-chart-legend {
    color: #f5efe6;
}

[data-theme="dark"] .poc-rental-table div,
[data-theme="dark"] .poc-rank-list div,
[data-theme="dark"] .poc-rank-list a,
[data-theme="dark"] .poc-stat-list div {
    border-color: rgba(255,255,255,.1);
}

@media (max-width: 767px) {
    .poc-price-insights { padding: 34px 12px; }
    .poc-price-shell { padding: 18px; border-radius: 16px; }
    .poc-price-head { display: grid; }
    .poc-price-tab { min-height: 48px; padding: 0 18px; font-size: 14px; }
    .poc-price-card-grid { gap: 14px; }
    .poc-price-arrow { width: 44px; height: 44px; font-size: 34px; }
    .poc-price-arrow-prev { left: -8px; }
    .poc-price-arrow-next { right: -8px; }
    .poc-insight-card { flex-basis: min(82vw, 330px); min-height: auto; padding: 18px; }
    .poc-heatmap-box { grid-template-columns: 1fr; }
    .poc-map-panel { grid-template-columns: 1fr 1fr; }
    .poc-rank-list div,
    .poc-rank-list a,
    .poc-stat-list div {
        grid-template-columns: 1fr;
    }
    .poc-stat-list strong,
    .poc-rental-table strong {
        text-align: left;
    }
}

/* Compact final pass for the homepage price insight carousel */
.poc-price-insights {
    padding: 24px 18px;
}

.poc-price-shell {
    padding: 18px;
    border-radius: 22px;
}

.poc-price-head {
    margin-bottom: 12px;
}

.poc-price-eyebrow {
    margin-bottom: 5px;
    font-size: 11px;
}

.poc-price-head h2 {
    font-size: clamp(24px, 1.8vw, 32px);
    margin-bottom: 5px;
}

.poc-price-head p {
    font-size: 14px;
    line-height: 1.45;
}

.poc-ai-brief-btn {
    min-width: 155px;
    border-radius: 14px;
    padding: 9px 13px;
}

.poc-price-tabs {
    gap: 8px;
    padding-bottom: 10px;
}

.poc-price-tab {
    min-height: 40px;
    padding: 0 17px;
    font-size: 13px;
    border-radius: 11px;
}

.poc-ai-brief {
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 10px;
    padding: 10px 13px;
    margin: 0 0 12px;
    border-radius: 12px;
}

.poc-ai-brief span {
    font-size: 11px;
}

.poc-ai-brief p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 13px;
    line-height: 1.45;
}

.poc-price-card-grid {
    gap: 12px;
    padding-bottom: 8px;
}

.poc-insight-card {
    flex-basis: clamp(250px, 17vw, 290px);
    height: 286px;
    min-height: 0;
    padding: 13px;
    border-radius: 13px;
}

.poc-insight-card::before {
    height: 88px;
    opacity: .9;
}

.poc-card-top {
    gap: 10px;
    margin-bottom: 8px;
}

.poc-card-top h3 {
    font-size: 14px;
    line-height: 1.15;
}

.poc-card-top p,
.poc-card-tip {
    font-size: 12px;
}

.poc-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 20px;
}

.poc-card-tip {
    min-height: 48px;
    max-height: 48px;
    padding: 8px 10px;
    margin-bottom: 10px;
    overflow: hidden;
}

.poc-heatmap-box {
    grid-template-columns: 112px minmax(0, 1fr);
    min-height: 104px;
    max-height: 104px;
}

.poc-map-panel {
    padding: 10px;
}

.poc-map-panel strong {
    font-size: 13px;
}

.poc-map-panel span {
    font-size: 11px;
    margin-bottom: 4px;
}

.poc-card-bottom {
    margin: 10px -13px -13px;
    padding: 10px;
    font-size: 13px;
}

.poc-line-chart,
.poc-bar-chart {
    height: 126px;
}

.poc-line-chart {
    padding: 0 10px 8px;
    gap: 6px;
    background: repeating-linear-gradient(to top, transparent 0 40px, #e9e9e9 41px 42px);
}

.poc-trend-point {
    height: 110px;
}

.poc-trend-point span {
    bottom: -31px;
    font-size: 11px;
}

.poc-chart-legend {
    margin-top: 20px;
    font-size: 13px;
}

.poc-bar-chart {
    gap: 10px;
    padding: 0 10px 8px;
    background: repeating-linear-gradient(to top, transparent 0 40px, #e9e9e9 41px 42px);
}

.poc-bar-chart div {
    height: 102px;
}

.poc-bar-chart span {
    width: 18px;
}

.poc-bar-chart small {
    min-height: 34px;
    font-size: 10px;
}

.poc-stat-list {
    gap: 8px;
    margin-top: 8px;
}

.poc-stat-list div {
    gap: 8px;
    padding-bottom: 8px;
}

.poc-stat-list span,
.poc-stat-list strong {
    font-size: 12px;
}

.poc-stat-list strong {
    min-width: 96px;
    padding: 8px 9px;
}

.poc-insight-card small {
    margin-top: 8px;
    font-size: 11px;
}

.poc-market-bars,
.poc-rental-table,
.poc-rank-list {
    gap: 7px;
}

.poc-market-bars div {
    grid-template-columns: 98px minmax(0, 1fr);
    gap: 8px;
}

.poc-market-bars strong {
    padding: 7px 8px;
    font-size: 13px;
}

.poc-market-bars span,
.poc-rental-table div,
.poc-rank-list small {
    font-size: 12px;
}

.poc-rental-table div {
    padding: 8px 10px;
}

.poc-rank-list div,
.poc-rank-list a {
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: 8px;
    padding-bottom: 7px;
}

.poc-rank-list span {
    width: 32px;
    height: 32px;
    border-radius: 9px;
}

.poc-rank-list strong,
.poc-rank-list b {
    font-size: 12px;
}

.poc-rank-list div:nth-child(n+5),
.poc-rank-list a:nth-child(n+5),
.poc-rental-table div:nth-child(n+6),
.poc-market-bars div:nth-child(n+5) {
    display: none;
}

.poc-card-mini-link {
    margin-top: 7px;
    padding: 6px 14px;
    font-size: 12px;
}

.poc-price-footer-link {
    margin-top: 8px;
    padding-top: 10px;
    font-size: 14px;
}

[data-theme="dark"] .poc-price-insights {
    background:
        radial-gradient(circle at 8% 0%, rgba(201,169,110,.16), transparent 28%),
        radial-gradient(circle at 96% 96%, rgba(116,92,51,.18), transparent 30%),
        #090807;
}

[data-theme="dark"] .poc-price-shell {
    background: linear-gradient(180deg, rgba(15,13,10,.98), rgba(9,8,7,.98));
}

[data-theme="dark"] .poc-insight-card {
    background: #12100d;
    border-color: rgba(201,169,110,.22);
    box-shadow: 0 16px 35px rgba(0,0,0,.35);
}

[data-theme="dark"] .poc-insight-card.card-blue::before { background: linear-gradient(135deg, rgba(65,98,112,.92), rgba(18,16,13,.15)); }
[data-theme="dark"] .poc-insight-card.card-peach::before { background: linear-gradient(135deg, rgba(117,88,58,.95), rgba(18,16,13,.15)); }
[data-theme="dark"] .poc-insight-card.card-pink::before { background: linear-gradient(135deg, rgba(105,75,94,.92), rgba(18,16,13,.15)); }
[data-theme="dark"] .poc-insight-card.card-lilac::before { background: linear-gradient(135deg, rgba(81,72,111,.92), rgba(18,16,13,.15)); }
[data-theme="dark"] .poc-insight-card.card-mint::before { background: linear-gradient(135deg, rgba(52,104,93,.9), rgba(18,16,13,.15)); }
[data-theme="dark"] .poc-insight-card.card-coral::before { background: linear-gradient(135deg, rgba(120,72,65,.92), rgba(18,16,13,.15)); }

[data-theme="dark"] .poc-card-top h3,
[data-theme="dark"] .poc-card-top p {
    color: #fff8ec;
}

[data-theme="dark"] .poc-card-tip {
    background: rgba(255,255,255,.08);
    color: rgba(255,255,255,.84);
    border-color: rgba(255,255,255,.12);
}

[data-theme="dark"] .poc-line-chart,
[data-theme="dark"] .poc-bar-chart {
    border-bottom-color: rgba(255,255,255,.42);
    background: repeating-linear-gradient(to top, transparent 0 40px, rgba(255,255,255,.18) 41px 42px);
}

[data-theme="dark"] .poc-trend-point span,
[data-theme="dark"] .poc-bar-chart small {
    color: rgba(255,255,255,.68);
}

[data-theme="dark"] .poc-heatmap-box {
    background: rgba(255,255,255,.055);
    border-color: rgba(255,255,255,.1);
}

[data-theme="dark"] .poc-faux-map {
    background:
        linear-gradient(35deg, rgba(201,169,110,.28), transparent 42%),
        linear-gradient(135deg, rgba(92,158,180,.2), transparent 44%),
        #211d17;
}

@media (max-width: 767px) {
    .poc-price-insights { padding: 20px 10px; }
    .poc-price-head { gap: 12px; }
    .poc-ai-brief { grid-template-columns: 1fr; }
    .poc-insight-card {
        flex-basis: min(78vw, 284px);
        height: 286px;
        padding: 13px;
    }
    .poc-card-bottom { margin: 10px -13px -13px; }
}

/* Equal card sizing and overflow guard */
.poc-price-card-grid {
    align-items: stretch;
}

.poc-insight-card {
    flex: 0 0 300px;
    width: 300px;
    height: 304px;
    display: flex;
    flex-direction: column;
}

.poc-card-top {
    min-height: 45px;
    flex: 0 0 auto;
}

.poc-card-top > div:first-child {
    min-width: 0;
}

.poc-card-top h3 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.poc-card-tip {
    display: -webkit-box;
    min-height: 44px;
    max-height: 44px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.poc-heatmap-box {
    min-height: 118px;
    max-height: 118px;
    flex: 0 0 118px;
}

.poc-map-panel {
    overflow: hidden;
}

.poc-map-panel strong,
.poc-map-panel span,
.poc-market-bars strong,
.poc-market-bars span,
.poc-rank-list strong,
.poc-rank-list small,
.poc-rank-list b,
.poc-stat-list span,
.poc-stat-list strong {
    overflow: hidden;
    text-overflow: ellipsis;
}

.poc-map-panel strong,
.poc-map-panel span,
.poc-market-bars strong,
.poc-market-bars span,
.poc-rank-list strong,
.poc-rank-list small {
    white-space: nowrap;
}

.poc-card-bottom {
    margin-top: auto;
    margin-bottom: -13px;
    flex: 0 0 auto;
}

.poc-line-chart,
.poc-bar-chart {
    height: 135px;
    max-height: 135px;
    overflow: hidden;
    flex: 0 0 135px;
}

.poc-line-chart {
    padding-bottom: 30px;
}

.poc-trend-point {
    height: 96px;
}

.poc-trend-point span {
    bottom: -29px;
}

.poc-chart-legend {
    margin-top: 6px;
    flex: 0 0 auto;
}

.poc-bar-chart {
    padding-bottom: 31px;
}

.poc-bar-chart div {
    height: 98px;
    min-width: 0;
}

.poc-bar-chart small {
    max-width: 58px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.poc-stat-list {
    overflow: hidden;
}

.poc-stat-list div {
    grid-template-columns: minmax(0, 1fr) minmax(94px, auto);
}

.poc-stat-list strong {
    white-space: nowrap;
}

.poc-insight-card > small {
    margin-top: auto;
}

.poc-market-bars {
    overflow: hidden;
}

.poc-market-bars div {
    grid-template-columns: 94px minmax(0, 1fr);
    grid-template-rows: auto 5px;
    row-gap: 5px;
}

.poc-market-bars strong {
    min-width: 0;
}

.poc-market-bars span {
    min-width: 0;
}

.poc-market-bars div:nth-child(n+4),
.poc-rental-table div:nth-child(n+5),
.poc-rank-list div:nth-child(n+4),
.poc-rank-list a:nth-child(n+4) {
    display: none;
}

.poc-rental-table {
    max-height: auto;
}

.poc-rental-table div {
    min-height: 38px;
}

.poc-rank-list {
    overflow: hidden;
}

.poc-rank-list div,
.poc-rank-list a {
    grid-template-columns: 30px minmax(0, 1fr);
    min-height: 48px;
}

.poc-rank-list b {
    grid-column: 2;
    font-size: 11px;
    white-space: nowrap;
}

.poc-card-mini-link {
    align-self: flex-end;
    margin-top: auto;
    flex: 0 0 auto;
}

[data-theme="dark"] .poc-card-bottom {
    background: rgba(255,255,255,.065);
    color: #f5efe6;
}

@media (max-width: 767px) {
    .poc-insight-card {
        flex-basis: 286px;
        width: 286px;
        height: 304px;
    }
}

/* Card UI cleanup: equal cards, no internal text collisions */
.poc-insight-card {
    flex-basis: 330px;
    width: 330px;
    height: 400px;
    padding: 14px;
}

.poc-card-top {
    min-height: 48px;
}

.poc-card-tip {
    min-height: 48px;
    max-height: 48px;
    line-height: 1.35;
    margin-top: 30px;
}

.poc-heatmap-box {
    grid-template-columns: 138px minmax(0, 1fr);
    min-height: 140px;
    max-height: 140px;
    flex-basis: 140px;
}

.poc-card-bottom {
    margin-left: -14px;
    margin-right: -14px;
    margin-bottom: -14px;
    min-height: 46px;
    display: grid;
    place-items: center;
}

.poc-line-chart,
.poc-bar-chart {
    height: 155px;
    max-height: 155px;
    flex-basis: 155px;
}

.poc-line-chart {
    padding-bottom: 34px;
}

.poc-trend-point {
    height: 116px;
}

.poc-bar-chart {
    padding-bottom: 36px;
}

.poc-bar-chart div {
    height: 112px;
}

.poc-bar-chart small {
    max-width: 64px;
}

.poc-stat-list {
    gap: 10px;
    margin-top: 10px;
}

.poc-stat-list div {
    min-height: 48px;
    padding-bottom: 9px;
}

.poc-insight-card > small {
    font-size: 12px;
    white-space: nowrap;
}

.poc-market-bars div {
    grid-template-columns: 112px minmax(0, 1fr);
}

.poc-rank-list {
    gap: 8px;
    margin-top: 35px;
}

.poc-rank-list div,
.poc-rank-list a {
    grid-template-columns: 34px minmax(0, 1fr);
    min-height: 62px;
    padding-bottom: 8px;
    align-items: center;
}

.poc-rank-list span {
    width: 34px;
    height: 34px;
}

.poc-rank-list p {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.poc-rank-list strong,
.poc-rank-list small,
.poc-rank-list em {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.2;
}

.poc-rank-list strong {
    font-size: 13px;
}

.poc-rank-list small {
    font-size: 12px;
}

.poc-rank-list em {
    color: #c9a96e;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.poc-rank-list .poc-rank-empty {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 92px;
    padding: 16px;
    border: 1px dashed rgba(201, 169, 110, .34);
    border-radius: 10px;
    background: rgba(255, 255, 255, .04);
    align-content: center;
}

.poc-rank-list .poc-rank-empty strong,
.poc-rank-list .poc-rank-empty small {
    white-space: normal;
}

.poc-rank-list b {
    display: none;
}

.poc-card-mini-link {
    margin-top: auto;
    max-width: 100%;
    white-space: nowrap;
}

[data-theme="dark"] .poc-rank-list em {
    color: #d7b874;
}

@media (max-width: 767px) {
    .poc-insight-card {
        flex-basis: 304px;
        width: 304px;
        height: 330px;
    }
}

/* Hero search: resilient sizing for browser zoom and laptop widths */
.poc-search-field {
    min-width: 0;
    width: 100%;
}

.poc-search-item:first-child {
    flex: 0 1 168px;
}

.poc-search-item:not(.poc-search-item--wide):not(:first-child) {
    flex: 0 1 176px;
}

.poc-search-submit span,
.poc-search-select,
.poc-search-input {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 992px) and (max-width: 1180px) {
    .poc-search-form {
        max-width: min(980px, calc(100vw - 42px));
    }

    .poc-search-item {
        padding: 0 10px;
        gap: 7px;
    }

    .poc-search-item:first-child {
        flex-basis: 148px;
    }

    .poc-search-item--wide {
        flex-basis: 210px;
        min-width: 165px;
    }

    .poc-search-item:not(.poc-search-item--wide):not(:first-child) {
        flex-basis: 148px;
    }

    .poc-search-input,
    select.poc-search-select,
    .poc-search-submit {
        font-size: 13px;
    }

    .poc-search-submit {
        padding: 0 20px;
        gap: 6px;
    }
}

/* Final hero search sizing fix */
@media (min-width: 768px) {
    .poc-search-form,
    .poc-hero-metrics {
        max-width: min(1040px, calc(100vw - 84px));
    }

    .poc-search-bar {
        display: grid;
        grid-template-columns: 175px 1px 305px 1px 170px 1px 170px 170px;
        width: 100%;
        max-width: 100%;
        overflow: visible;
        border-radius: 36px 36px 36px 36px;
    }

    .poc-search-item,
    .poc-search-item:first-child,
    .poc-search-item:not(.poc-search-item--wide):not(:first-child),
    .poc-search-item--wide {
        flex: none;
        min-width: 0;
        width: 100%;
        padding: 0 16px;
    }

    .poc-search-item--wide {
        padding-right: 18px;
    }

    .poc-search-sep {
        width: 1px;
        margin: 14px 0;
    }

    .poc-search-submit {
        width: 100%;
        min-width: 0;
        justify-content: center;
        padding: 0 24px;
        border-radius: 0 34px 34px 0;
    }
}

@media (min-width: 768px) and (max-width: 1180px) {
    .poc-search-form,
    .poc-hero-metrics {
        max-width: min(930px, calc(100vw - 48px));
    }

    .poc-search-bar {
        grid-template-columns: 150px 1px 235px 1px 152px 1px 152px 145px;
    }

    .poc-search-item,
    .poc-search-item:first-child,
    .poc-search-item:not(.poc-search-item--wide):not(:first-child),
    .poc-search-item--wide {
        padding: 0 12px;
        gap: 8px;
    }

    .poc-search-submit {
        padding: 0 18px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   INNER-PAGE BREADCRUMB — global default
   Covers every page that doesn't already have its own scoped
   breadcrumb treatment (about-us, properties). Dark scrim over the
   photo + gold nav, matching the rest of the site.
   ═══════════════════════════════════════════════════════════════ */
.breadcrumbs__content {
    position: relative;
    background-size: cover;
    background-position: center;
}
.breadcrumbs__content::before {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(10,8,6,.82), rgba(10,8,6,.82)),
                linear-gradient(0deg, rgba(10,8,6,.55), rgba(10,8,6,.35));
    z-index: 0;
}
.breadcrumbs__content > .container { position: relative; z-index: 1; }
.breadcrumbs__content .breadcrumb__title {
    font-family: var(--font-serif); font-weight: 500; color: #fff !important;
    /* Extra definition so the title stays readable even over bright
       spots in the photo — the scrim alone isn't always enough. */
    text-shadow: 0 2px 16px rgba(0,0,0,.65), 0 1px 3px rgba(0,0,0,.8);
}
.breadcrumbs__content .breadcrumb__menu li a {
    font-family: var(--font-sans); color: rgba(255,255,255,.65);
}
.breadcrumbs__content .breadcrumb__menu li a:hover,
.breadcrumbs__content .breadcrumb__menu li.active a {
    color: var(--accent-gold);
}

/* Light theme — the banner should actually read as "light", not the
   dark cinematic scrim used for dark mode. Lighten the overlay and
   flip the title/nav text to dark so it stays readable on the photo. */
[data-theme="light"] .breadcrumbs__content::before {
    background: linear-gradient(135deg, rgba(245,242,237,.90), rgba(245,242,237,.90)),
                linear-gradient(0deg, rgba(245,242,237,.55), rgba(245,242,237,.35));
}
[data-theme="light"] .breadcrumbs__content .breadcrumb__title {
    color: var(--text-primary) !important;
    text-shadow: none;
}
[data-theme="light"] .breadcrumbs__content .breadcrumb__menu li a {
    color: var(--text-secondary);
}
[data-theme="light"] .breadcrumbs__content .breadcrumb__menu li a:hover,
[data-theme="light"] .breadcrumbs__content .breadcrumb__menu li.active a {
    color: var(--accent-gold);
}

/* ═══════════════════════════════════════════════════════════════
   USER DASHBOARD / PANEL — align legacy homec-* markup to tokens
   ═══════════════════════════════════════════════════════════════ */
.homec-dashboard.homec-bg-third-color { background: var(--background) !important; }
.homec-dashboard__inner,
.homec-dashboard__single { border-radius: var(--r-md); }
.homec-dashboard__heading { font-family: var(--font-serif); }

/* Kill Bootstrap's default blue .active/.focus border+ring on the sidebar nav */
.homec-list-tabs.homec-list-tabs--v3 .list-group-item {
    background-color: transparent !important;
    border-color: var(--border) !important;
    border-bottom-color: var(--border) !important;
    box-shadow: none !important;
}
.homec-list-tabs.homec-list-tabs--v3 .list-group-item.active,
.homec-list-tabs.homec-list-tabs--v3 .list-group-item:hover,
.homec-list-tabs.homec-list-tabs--v3 .list-group-item:focus {
    background-color: transparent !important;
    border-bottom-color: var(--accent-gold) !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Download-app band — dark scrim so white headline/body text always has
   real contrast, instead of sitting straight on the raw gold fallback. */
.download-app.homec-bg-primary-color {
    background-color: var(--poc-dark) !important;
    position: relative;
}
.download-app.homec-bg-primary-color::before {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(16,14,11,.92), rgba(16,14,11,.8));
    z-index: 0;
}
.download-app.homec-bg-primary-color > .container,
.download-app.homec-bg-primary-color .homec-shape { position: relative; z-index: 1; }
.download-app.homec-bg-primary-color .homec-section__title {
    font-family: var(--font-serif); color: #fff !important;
}
.download-app.homec-bg-primary-color .sec-head__text {
    color: rgba(255,255,255,.68) !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRICE-INSIGHT CHARTS — real value tooltip on hover
   The cards live inside .poc-price-card-grid, which needs
   overflow:auto for the horizontal carousel scroll — but per the CSS
   spec, mixing overflow:auto on one axis forces the other axis to
   clip too, so a plain absolutely-positioned tooltip (even with
   overflow:visible on the card itself) gets cut off above the row
   instead of floating over it. Fixed by rendering ONE shared tooltip
   as position:fixed (see .poc-float-tip), positioned via JS on
   hover/focus in home-price-insights.blade.php — fixed positioning
   escapes the scroll container entirely. These per-element tooltip
   nodes now only carry the text for JS to read; they never render.
   ═══════════════════════════════════════════════════════════════ */
.poc-trend-point { cursor: pointer; }
.poc-trend-point .poc-trend-tooltip,
.poc-bar-tooltip {
    display: none;
}
.poc-bar-chart span { position: relative; cursor: pointer; }

.poc-float-tip {
    position: fixed;
    left: 0;
    top: 0;
    transform: translate(-50%, calc(-100% - 12px));
    background: var(--poc-dark);
    color: #fff;
    font-family: var(--font-sans);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: var(--r-sm);
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--t-fast);
    z-index: 9999;
}
.poc-float-tip::after {
    content: '';
    position: absolute;
    top: 100%; left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: var(--poc-dark);
}
.poc-float-tip.is-visible {
    opacity: 1;
}

/* ═══════════════════════════════════════════════════════════════
   SEARCH BAR — typed text invisible while focused
   style.css has `.homec-form__form input:focus { color:#101010
   !important }`, clearly written for a light background with no
   dark-theme counterpart. It only fires ON FOCUS — the exact moment
   someone is actively typing — so text was genuinely being entered
   (confirmed via input.value) but rendered black-on-near-black,
   reading as "I can't type here" even though the field worked fine.
   Higher specificity than the losing rule so it wins regardless of
   CSS file load order.
   ═══════════════════════════════════════════════════════════════ */
.homec-form__form.homec-form__form--bar input:focus,
.homec-form__form.homec-form__form--bar input {
    color: #e4e4e4 !important;
}
[data-theme="light"] .homec-form__form.homec-form__form--bar input:focus,
[data-theme="light"] .homec-form__form.homec-form__form--bar input {
    color: #1a1a1a !important;
}