/* ═══════════════════════════════════════════════════
   ANG LUXURY PROPERTIES — Premium Design System
   Dark + Light Mode | Ultra-Luxury Real Estate
   ═══════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Inter:wght@300;400;500;600&display=swap');

/* ── Theme Variables ─────────────────────────────── */

:root {
    /* Dark Mode (default) */
    --bg-primary: #0a0a0a;
    --bg-secondary: #141414;
    --bg-card: #1a1a1a;
    --bg-elevated: #222222;
    --bg-glass: rgba(20, 20, 20, 0.85);
    --text-primary: #f5f0eb;
    --text-secondary: #a09890;
    --text-muted: #6b6560;
    --gold: #c5a572;
    --gold-light: #d4b88a;
    --gold-dark: #a68b5b;
    --border: rgba(197, 165, 114, 0.15);
    --border-subtle: rgba(255, 255, 255, 0.06);
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.5);
    --overlay: rgba(0, 0, 0, 0.55);
    --gradient-gold: linear-gradient(135deg, #c5a572, #d4b88a);
    --hero-overlay: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);

    /* Typography */
    --font-display: 'Cormorant Garamond', Georgia, serif;
    --font-body: 'Inter', -apple-system, sans-serif;

    /* Spacing */
    --section-padding: 120px;
    --container-width: 1320px;
    --radius: 4px;
    --radius-lg: 8px;

    /* Transitions */
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-theme="light"] {
    --bg-primary: #faf8f5;
    --bg-secondary: #f0ece6;
    --bg-card: #ffffff;
    --bg-elevated: #f5f2ed;
    --bg-glass: rgba(250, 248, 245, 0.9);
    --text-primary: #1a1714;
    --text-secondary: #5c5650;
    --text-muted: #9a948e;
    --gold: #a68b5b;
    --gold-light: #c5a572;
    --gold-dark: #8a7248;
    --border: rgba(166, 139, 91, 0.2);
    --border-subtle: rgba(0, 0, 0, 0.06);
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.12);
    --overlay: rgba(0, 0, 0, 0.4);
    --hero-overlay: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.5) 100%);
}

/* ── Reset & Base ────────────────────────────────── */

*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
    font-size: 16px;
}

body {
    font-family: var(--font-body);
    background: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;
    transition: background var(--transition), color var(--transition);
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}

.container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 24px;
}

/* ── Typography ──────────────────────────────────── */

h1, h2, h3, h4 {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
h3 { font-size: clamp(1.5rem, 3vw, 2rem); }
h4 { font-size: clamp(1.2rem, 2vw, 1.5rem); }

.text-gold { color: var(--gold); }
.text-muted { color: var(--text-muted); }
.text-secondary { color: var(--text-secondary); }

.section-label {
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 16px;
    display: block;
}

.section-title {
    margin-bottom: 24px;
}

.section-subtitle {
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--text-secondary);
    max-width: 560px;
    line-height: 1.7;
}

/* ── Buttons ─────────────────────────────────────── */

.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 32px;
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border-radius: var(--radius);
    transition: all var(--transition);
    white-space: nowrap;
}

.btn-primary {
    background: var(--gold);
    color: #0a0a0a;
}

.btn-primary:hover {
    background: var(--gold-light);
    transform: translateY(-1px);
    box-shadow: 0 4px 20px rgba(197, 165, 114, 0.3);
}

.btn-outline {
    border: 1px solid var(--gold);
    color: var(--gold);
    background: transparent;
}

.btn-outline:hover {
    background: var(--gold);
    color: #0a0a0a;
}

.btn-ghost {
    color: var(--text-primary);
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
}

.btn-ghost:hover {
    color: var(--gold);
    border-color: var(--gold);
}

.btn-icon {
    width: 48px;
    height: 48px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 50%;
    color: var(--text-secondary);
    transition: all var(--transition);
}

.btn-icon:hover {
    border-color: var(--gold);
    color: var(--gold);
}

/* ── Navigation ──────────────────────────────────── */

.nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 20px 0;
    transition: all var(--transition);
}

.nav.scrolled {
    background: var(--bg-glass);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 12px 0;
    border-bottom: 1px solid var(--border-subtle);
}

.nav-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 24px;
}

.nav-logo {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 400;
    letter-spacing: 0.08em;
    color: var(--text-primary);
}

.nav-logo span {
    color: var(--gold);
    font-weight: 600;
}

.nav-logo-img {
    height: 40px;
    width: auto;
    display: block;
}

.footer-logo-img {
    height: 36px;
    width: auto;
    opacity: 0.9;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 15px;
    list-style: none;
}

.nav-links a {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-secondary);
    transition: color var(--transition);
    position: relative;
}

.nav-links a:hover,
.nav-links a.active {
    color: var(--gold);
}

.nav-links a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width var(--transition);
}

.nav-links a:hover::after,
.nav-links a.active::after {
    width: 100%;
}

/* Nav over hero (transparent / not scrolled) — text alb DOAR pe tema dark, ca sa fie lizibil pe imaginile inchise. Pe tema light revine la culoarea default a temei (lizibila pe page-header light). */
[data-theme="dark"] .nav:not(.scrolled) .nav-logo,
[data-theme="dark"] .nav:not(.scrolled) .nav-links > li > a {
    color: #fff;
}

[data-theme="dark"] .nav:not(.scrolled) .nav-links > li > a:hover,
[data-theme="dark"] .nav:not(.scrolled) .nav-links > li > a.active {
    color: var(--gold);
}

[data-theme="dark"] .nav:not(.scrolled) .theme-toggle,
[data-theme="dark"] .nav:not(.scrolled) .lang-toggle {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .nav:not(.scrolled) .theme-toggle:hover,
[data-theme="dark"] .nav:not(.scrolled) .lang-toggle:hover {
    color: var(--gold);
    border-color: var(--gold);
}

[data-theme="dark"] .nav:not(.scrolled) .nav-hamburger span {
    background: #fff;
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.theme-toggle {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 50%;
    color: var(--text-secondary);
    font-size: 16px;
    transition: all var(--transition);
    cursor: pointer;
    background: transparent;
}

.theme-toggle:hover {
    border-color: var(--gold);
    color: var(--gold);
}

.lang-toggle {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 50%;
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    transition: all var(--transition);
    cursor: pointer;
    background: transparent;
    font-family: var(--font-body);
}

.lang-toggle:hover {
    border-color: var(--gold);
    color: var(--gold);
}

.nav-phone {
    font-size: 13px;
    font-weight: 500;
    color: var(--gold);
    letter-spacing: 0.05em;
}

/* Mobile menu */
.nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 4px;
}

.nav-hamburger span {
    width: 24px;
    height: 1.5px;
    background: var(--text-primary);
    transition: all var(--transition);
}

/* ── Hero Section ────────────────────────────────── */

.hero {
    position: relative;
    height: 100vh;
    min-height: 700px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    overflow: hidden;
}

/* Virtual Tour Slideshow */
.vt-slideshow {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.vt-slide {
    position: absolute;
    inset: -30px;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transform: scale(1.08);
    transition: opacity 1.4s ease, transform 8s ease;
    will-change: opacity, transform;
}
.vt-slide.active {
    opacity: 1;
    transform: scale(1);
    animation: vtKenBurns 7s ease-in-out forwards;
}
@keyframes vtKenBurns {
    0%   { transform: scale(1) translate(0, 0); }
    100% { transform: scale(1.12) translate(-1.5%, -1%); }
}
.vt-slide.prev {
    opacity: 0;
    transform: scale(1.15);
    transition: opacity 1.4s ease;
}

/* Virtual Tour Badge */
.vt-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(201, 162, 39, 0.15);
    border: 1px solid rgba(201, 162, 39, 0.35);
    padding: 8px 18px;
    border-radius: 100px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--gold-light);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 20px;
    backdrop-filter: blur(8px);
}

/* Tour Controls */
.vt-controls {
    position: absolute;
    bottom: 100px;
    right: 80px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}
.vt-room-label {
    font-size: 0.82rem;
    font-weight: 600;
    color: rgba(255,255,255,0.85);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.vt-dots {
    display: flex;
    gap: 6px;
}
.vt-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,0.3);
    cursor: pointer;
    transition: all 0.3s;
    border: none;
    padding: 0;
}
.vt-dot.active {
    background: var(--gold);
    width: 24px;
    border-radius: 4px;
}
.vt-counter {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.5);
    font-weight: 500;
    letter-spacing: 1px;
}

/* Arrows */
.vt-arrows {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 3;
    display: flex;
    justify-content: space-between;
    padding: 0 24px;
    transform: translateY(-50%);
    pointer-events: none;
}
.vt-arrow {
    pointer-events: all;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.2);
    background: rgba(0,0,0,0.25);
    backdrop-filter: blur(12px);
    color: #fff;
    font-size: 1.6rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
    line-height: 1;
}
.vt-arrow:hover {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
    transform: scale(1.1);
}

/* Progress bar */
.vt-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 4;
    background: rgba(255,255,255,0.1);
}
.vt-progress-bar {
    height: 100%;
    background: var(--gold);
    width: 0;
    transition: width 0.3s linear;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: var(--hero-overlay);
}

.hero-content {
    position: relative;
    z-index: 2;
    padding: 80px;
    max-width: 720px;
}
.hero h1 {
    color: #fff;
    margin-bottom: 10px;
    font-weight: 300;
    font-size:1.5em !important;
}
.hero h2 {
    color: #fff;
    margin-bottom: 24px;
    font-weight: 300;
}

.hero h2 em {
    font-style: italic;
    color: var(--gold-light);
}

.hero-subtitle {
    font-size: 17px;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 40px;
    line-height: 1.7;
    max-width: 480px;
}

.hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.hero-scroll {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    z-index: 4;
    cursor: pointer;
    background: transparent;
    border: 0;
    padding: 8px 14px;
    font-family: inherit;
    transition: color 0.3s ease;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}
.hero-scroll:hover,
.hero-scroll:focus { color: var(--gold); outline: none; }
.hero-scroll:hover .hero-scroll-line,
.hero-scroll:focus .hero-scroll-line {
    background: linear-gradient(180deg, var(--gold), transparent);
}

.hero-scroll-line {
    width: 1px;
    height: 40px;
    background: linear-gradient(180deg, rgba(255,255,255,0.5), transparent);
    animation: scrollPulse 2s ease-in-out infinite;
}

@keyframes scrollPulse {
    0%, 100% { opacity: 0.3; transform: scaleY(0.5); }
    50% { opacity: 1; transform: scaleY(1); }
}

/* ── Stats Bar ───────────────────────────────────── */

.stats-bar {
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-subtle);
    padding: 48px 0;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    text-align: center;
}

.stat-item {
    position: relative;
}

.stat-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 40px;
    background: var(--border);
}

.stat-number {
    font-family: var(--font-display);
    font-size: 3rem;
    font-weight: 300;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 8px;
}

.stat-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* ── Section Spacing ─────────────────────────────── */

.section {
    padding: var(--section-padding) 0;
}

.section-header {
    margin-bottom: 60px;
}

.section-header-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

/* ── Branded Residences ──────────────────────────── */

.branded-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.branded-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    transition: all var(--transition);
}

.branded-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--gold);
}

.branded-card-img {
    position: relative;
    height: 280px;
    overflow: hidden;
}

.branded-card-img-link {
    display: block;
    width: 100%;
    height: 100%;
}

.branded-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.branded-card:hover .branded-card-img img {
    transform: scale(1.05);
}

.branded-status {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 6px 14px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-radius: var(--radius);
    z-index: 2;
    background: var(--gold);
    color: #0a0a0a;
}

.branded-status.development {
    background: rgba(255, 255, 255, 0.9);
    color: #0a0a0a;
}

.branded-card-body {
    padding: 24px;
}

.branded-name {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.branded-name a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition-fast);
}

.branded-name a:hover,
.branded-name a:focus {
    color: var(--gold);
    text-decoration: none;
}

.branded-developer {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 12px;
}

.branded-location {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 8px;
}

.branded-tagline {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 16px;
    min-height: 48px;
}

.branded-features {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 16px;
}

.branded-feature-tag {
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-muted);
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 100px;
}

.branded-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid var(--border-subtle);
}

.branded-price {
    font-family: var(--font-display);
    font-size: 1.1rem;
    color: var(--gold);
    font-weight: 500;
}

.branded-units {
    font-size: 12px;
    color: var(--text-muted);
}

.btn-brochure {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    background: transparent;
    border: 1px solid var(--gold);
    border-radius: var(--radius);
    cursor: pointer;
    transition: all var(--transition);
    text-decoration: none;
    margin-top: 16px;
    width: 100%;
    justify-content: center;
}

.btn-brochure:hover {
    background: var(--gold);
    color: #0a0a0a;
}

.btn-brochure svg {
    width: 14px;
    height: 14px;
}

@media (max-width: 1024px) {
    .branded-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .branded-grid { grid-template-columns: 1fr; }
    .branded-card-img { height: 220px; }
}

/* ── Featured Properties ─────────────────────────── */

.properties-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.property-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    transition: all var(--transition);
    cursor: pointer;
}

.property-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--border);
}

.property-card-img {
    position: relative;
    height: 320px;
    overflow: hidden;
}

.property-card-img-link {
    display: block;
    width: 100%;
    height: 100%;
}

.property-card .rent {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 6px 14px;
    background: rgba(10,10,10,0.78);
    backdrop-filter: blur(8px);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    border-radius: 100px;
    border: 1px solid rgba(197,165,114,0.3);
    z-index: 2;
    line-height: 1.2;
    max-width: calc(100% - 80px);
    white-space: normal;
}

.property-card .btnSaveIcon {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(8px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    z-index: 3;
    transition: all 0.3s;
    text-decoration: none;
    font-size: 0;
    line-height: 1;
}
.property-card .btnSaveIcon::before {
    content: "\2661";
    font-family: "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    font-size: 18px;
    line-height: 1;
    color: inherit;
    display: block;
}
.property-card .btnSaveIcon i { display: none; }
.property-card .btnSaveIcon:hover {
    background: var(--gold);
    color: #0a0a0a;
}
.property-card .btnSaveIcon.saved::before,
.property-card .btnSaveIcon.active::before { content: "\2665"; }

.property-card .property-title-link {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition-fast);
}
.property-card .property-title-link:hover,
.property-card .property-title-link:focus {
    color: var(--gold);
    text-decoration: none;
}

.property-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.property-card:hover .property-card-img img {
    transform: scale(1.05);
}

.property-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 6px 14px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-radius: var(--radius);
    z-index: 2;
}

.property-badge.exclusive {
    background: var(--gold);
    color: #0a0a0a;
}

.property-badge.new {
    background: #fff;
    color: #0a0a0a;
}

.property-badge.forbes {
    background: #1a1a2e;
    color: #fff;
}

.property-save {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    z-index: 2;
    border: none;
    cursor: pointer;
    transition: all var(--transition);
}

.property-save:hover {
    background: var(--gold);
    color: #0a0a0a;
}

.property-card-body {
    padding: 24px;
}

.property-price {
    font-family: var(--font-display);
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--gold);
    margin-bottom: 8px;
}

.property-title {
    font-family: var(--font-display);
    font-size: 1.3rem;
    margin-bottom: 8px;
    font-weight: 500;
}

.property-title a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition-fast);
}

.property-title a:hover,
.property-title a:focus {
    color: var(--gold);
    text-decoration: none;
}

.property-location {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.property-specs {
    display: flex;
    gap: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
}

.property-spec {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-secondary);
}

.property-spec strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* ── Neighborhoods Section ───────────────────────── */

.neighborhoods-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 240px);
    gap: 16px;
}

.neighborhood-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    cursor: pointer;
    display: block;
    color: inherit;
    text-decoration: none;
}

.neighborhood-card:first-child {
    grid-column: span 2;
    grid-row: span 2;
}

.neighborhood-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.neighborhood-card:hover img {
    transform: scale(1.08);
}

.neighborhood-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.75) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 24px;
    transition: background var(--transition);
}

.neighborhood-card:hover .neighborhood-overlay {
    background: linear-gradient(180deg, transparent 20%, rgba(0,0,0,0.85) 100%);
}

.neighborhood-name {
    font-family: var(--font-display);
    font-size: 1.5rem;
    color: #fff;
    margin-bottom: 4px;
}

.neighborhood-count {
    font-size: 12px;
    color: var(--gold-light);
    letter-spacing: 0.1em;
}

/* ── Concierge Section ───────────────────────────── */

.concierge {
    background: var(--bg-secondary);
    position: relative;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
}
#branded-section {
    padding-bottom: 0;
}

.concierge-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.concierge-content {
    padding: 0px 0;
}

.concierge-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.concierge-privacy {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.6;
}
.concierge-privacy input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
    cursor: pointer;
}
.concierge-privacy label {
    cursor: pointer;
    font-size: 12px;
    color: var(--text-muted);
}
.concierge-privacy a {
    color: var(--gold);
    text-decoration: underline;
}
.concierge-privacy a:hover { color: var(--gold-light); }

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.form-group input,
.form-group select,
.form-group textarea {
    padding: 14px 16px;
    background: var(--bg-primary);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 14px;
    transition: border-color var(--transition);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--gold);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.concierge-image {
    height: 100%;
    min-height: 600px;
    background: url('../img/concierge-office-2.jpg') center/contain no-repeat;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-lg);
}

/* ── Team Section ────────────────────────────────── */

.team-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.team-card {
    text-align: center;
    padding: 32px 20px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-subtle);
    background: var(--bg-card);
    transition: all var(--transition);
}

.team-card:hover {
    border-color: var(--gold);
    transform: translateY(-4px);
    box-shadow: var(--shadow);
}

.team-avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto 20px;
    border: 2px solid var(--border);
    transition: border-color var(--transition);
}

.team-card:hover .team-avatar {
    border-color: var(--gold);
}

.team-name {
    font-family: var(--font-display);
    font-size: 1.3rem;
    margin-bottom: 4px;
}

.team-role {
    font-size: 12px;
    color: var(--gold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.team-desc {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 12px;
    padding: 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.team-stats {
    font-size: 13px;
    color: var(--text-muted);
}

/* ── Testimonials ────────────────────────────────── */

.testimonials {
    background: var(--bg-secondary);
    padding-top: 0;
}

.testimonial-card {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    padding: 40px;
}

.testimonial-quote {
    font-family: var(--font-display);
    font-size: 1.8rem;
    font-style: italic;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 32px;
    color: var(--text-primary);
}

.testimonial-quote::before {
    content: '\201C';
    display: block;
    font-size: 4rem;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 16px;
}

.testimonial-author {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
}

.testimonial-detail {
    font-size: 13px;
    color: var(--text-muted);
}

/* ── Testimonials Grid (3-column) ────────────────── */

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 32px;
}

.testimonials-grid .testimonial-card {
    max-width: none;
    margin: 0;
    text-align: left;
    padding: 32px;
    background: var(--bg-elevated);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
}

/* When there is only one testimonial, span all columns and center the content */
.testimonials-grid .testimonial-card:only-child {
    grid-column: 1 / -1;
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
}
.testimonials-grid .testimonial-card:only-child .testimonial-quote {
    font-size: 1.1rem;
}

.testimonials-grid .testimonial-quote {
    font-size: 1rem;
    font-family: var(--font-body);
    font-weight: 400;
    font-style: italic;
    line-height: 1.7;
    margin-bottom: 20px;
}

.testimonials-grid .testimonial-quote::before {
    font-size: 2.5rem;
    margin-bottom: 8px;
}

@media (max-width: 768px) {
    .testimonials-grid {
        grid-template-columns: 1fr;
    }
}

/* ── FAQ Accordion ──────────────────────────────── */

.faq-list {
    max-width: 800px;
    margin: 32px auto 0;
}

.faq-item {
    border-bottom: 1px solid var(--border);
}

.faq-item:first-child {
    border-top: 1px solid var(--border);
}

.faq-question {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    color: var(--text-primary);
    font-size: 16px;
    font-weight: 500;
    font-family: var(--font-body);
    transition: color 0.3s;
}
#faq {
    padding-top: 0;
}

.faq-question:hover {
    color: var(--gold);
}

.faq-icon {
    font-size: 24px;
    color: var(--gold);
    font-weight: 300;
    transition: transform 0.3s;
    flex-shrink: 0;
    margin-left: 16px;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, padding 0.4s ease;
}

.faq-item.active .faq-answer {
    max-height: 300px;
    padding-bottom: 20px;
}

.faq-answer p {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.8;
}

/* ── Footer ──────────────────────────────────────── */

.footer {
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-subtle);
    padding: 80px 0 40px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 20px;
    margin-bottom: 60px;
}

.footer-brand p {
    color: var(--text-muted);
    font-size: 14px;
    line-height: 1.7;
    margin: 16px 0 24px;
    max-width: 320px;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social a {
    width: 40px;
    height: 40px;
    border: 1px solid var(--border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    font-size: 14px;
    transition: all var(--transition);
}

.footer-social a:hover {
    border-color: var(--gold);
    color: var(--gold);
}

.footer-col h4 {
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 24px;
}

.footer-col ul {
    list-style: none;
}

.footer-col li {
    margin-bottom: 12px;
}

.footer-col a {
    font-size: 14px;
    color: var(--text-secondary);
    transition: color var(--transition);
}

.footer-col a:hover {
    color: var(--gold);
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 40px;
    border-top: 1px solid var(--border-subtle);
    font-size: 13px;
    color: var(--text-muted);
}

.link-utile {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    margin-top: 20px;
}

.link-utile a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color var(--transition-fast);
    font-size: 13px;
}

.link-utile a:hover,
.link-utile a:focus {
    color: var(--gold);
    text-decoration: none;
}

.link-utile a + a {
    border-left: 1px solid var(--border-subtle);
    padding-left: 18px;
}

.footer-awards {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 12px;
    color: var(--gold);
    letter-spacing: 0.1em;
}

/* ── Properties Page ─────────────────────────────── */

.page-header {
    padding: 160px 0 60px;
    text-align: center;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-subtle);
}

.filters-bar {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border-subtle);
    padding: 20px 0;
    position: sticky;
    top: 60px;
    z-index: 100;
}

.filters-inner {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.filter-select {
    padding: 10px 16px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 13px;
    min-width: 140px;
    cursor: pointer;
    transition: border-color var(--transition);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239a948e' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
}

.filter-select:focus {
    outline: none;
    border-color: var(--gold);
}

.filter-separator {
    width: 1px;
    height: 32px;
    background: var(--border);
}

.results-count {
    margin-left: auto;
    font-size: 13px;
    color: var(--text-muted);
}

.view-toggles {
    display: flex;
    gap: 4px;
}

.view-toggle {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--text-muted);
    font-size: 14px;
    transition: all var(--transition);
    cursor: pointer;
    background: transparent;
}

.view-toggle.active {
    border-color: var(--gold);
    color: var(--gold);
}

.properties-list {
    padding: 40px 0 80px;
}

/* List View */
.property-card-list {
    display: grid;
    grid-template-columns: 400px 1fr;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-card);
    margin-bottom: 24px;
    transition: all var(--transition);
    cursor: pointer;
}

.property-card-list:hover {
    border-color: var(--border);
    box-shadow: var(--shadow);
}

.property-card-list .property-card-img {
    height: 100%;
    min-height: 280px;
}

.property-card-list .property-card-body {
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.property-card-list .property-description {
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.7;
    margin-bottom: 20px;
}

/* ── Property Detail Page ────────────────────────── */

.detail-gallery {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 500px;
    gap: 4px;
    margin-top: 72px;
}

.detail-gallery-main {
    overflow: hidden;
    cursor: pointer;
    position: relative;
}

.detail-gallery-main > a,
.detail-gallery-main > a:first-of-type {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.detail-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--transition-slow);
}

.detail-gallery-main:hover img {
    transform: scale(1.03);
}

.detail-gallery-side {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 4px;
}

.detail-gallery-side > div {
    overflow: hidden;
    cursor: pointer;
    position: relative;
}

.detail-gallery-side > div > a {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.detail-gallery-side img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--transition-slow);
}

.detail-gallery-side > div:hover img {
    transform: scale(1.05);
}

.gallery-count {
    position: absolute;
    bottom: 16px;
    right: 16px;
    padding: 8px 16px;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(8px);
    border-radius: var(--radius);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
}

.detail-content {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 60px;
    padding: 60px 0 100px;
}

.detail-main {}

.detail-title {
    font-size: 2.5rem;
    margin-bottom: 8px;
}

.detail-location {
    font-size: 15px;
    color: var(--text-muted);
    margin-bottom: 32px;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: .02em;
}
.detail-location .detail-location-icon {
    color: var(--gold);
    flex-shrink: 0;
}

.detail-specs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 40px;
}

.detail-spec {
    text-align: center;
    padding: 24px 16px;
    background: var(--bg-secondary);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-subtle);
}

.detail-spec-value {
    font-family: var(--font-display);
    font-size: 1.5rem;
    color: var(--gold);
    margin-bottom: 4px;
}

.detail-spec-label {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.detail-description {
    margin-bottom: 40px;
}

.detail-description h3 {
    margin-bottom: 16px;
}

.detail-description p {
    color: var(--text-secondary);
    line-height: 1.8;
    font-size: 15px;
}

.detail-features {
    margin-bottom: 40px;
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: var(--bg-secondary);
    border-radius: var(--radius);
    font-size: 14px;
    color: var(--text-secondary);
}

.feature-item::before {
    content: '\2713';
    color: var(--gold);
    font-weight: 700;
}

/* Detail Sidebar */
.detail-sidebar {
    position: sticky;
    top: 100px;
    align-self: start;
}

.sidebar-price-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 32px;
    margin-bottom: 24px;
}

.sidebar-price {
    font-family: var(--font-display);
    font-size: 2.2rem;
    color: var(--gold);
    margin-bottom: 4px;
}

.sidebar-price-detail {
    font-size: 13px;
    color: var(--text-muted);
    margin-bottom: 24px;
}

.sidebar-agent {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    border-top: 1px solid var(--border-subtle);
    border-bottom: 1px solid var(--border-subtle);
    margin-bottom: 24px;
}

.sidebar-agent-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
}

.sidebar-agent-name {
    font-weight: 600;
    margin-bottom: 2px;
}

.sidebar-agent-role {
    font-size: 12px;
    color: var(--text-muted);
}

.sidebar-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sidebar-actions .btn {
    justify-content: center;
    width: 100%;
}

/* ── List View (Properties) ──────────────────────── */

.properties-list-view {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.properties-list-view .property-card {
    display: grid;
    grid-template-columns: 400px 1fr;
    border-radius: var(--radius-lg);
}

.properties-list-view .property-card-img {
    height: 100%;
    min-height: 260px;
}

.properties-list-view .property-card-body {
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.properties-list-view .property-specs {
    gap: 32px;
}

@media (max-width: 768px) {
    .properties-list-view .property-card {
        grid-template-columns: 1fr;
    }
    .properties-list-view .property-card-img {
        min-height: 200px;
    }
}

/* ── Form Feedback ───────────────────────────────── */

.form-feedback {
    display: none;
    padding: 14px 20px;
    border-radius: var(--radius);
    font-size: 14px;
    line-height: 1.5;
    margin-top: 8px;
}

.form-feedback-success {
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.3);
    color: #22c55e;
}

.form-feedback-error {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #ef4444;
}
.banner-lista {
    margin-top: 72px;
}
[data-theme="light"] .form-feedback-success {
    background: rgba(34, 197, 94, 0.08);
    color: #16a34a;
}

[data-theme="light"] .form-feedback-error {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

[data-theme="light"] .residential-page h1,
[data-theme="light"] .contact-body h1,
[data-theme="light"] .careers-body h1,
[data-theme="light"] .blog-body h1 {
    color: #fff!important;
}


[data-theme="light"] .contact-body .theme-toggle,
[data-theme="light"] .careers-body .theme-toggle,
[data-theme="light"] .blog-body .theme-toggle,
[data-theme="light"] .home-body .theme-toggle {
    color: #fff;
    border: 1px solid #fff;
}

[data-theme="light"] .contact-body .lang-toggle,
[data-theme="light"] .careers-body .lang-toggle,
[data-theme="light"] .blog-body .lang-toggle,
[data-theme="light"] .home-body .lang-toggle  {
    color: #fff;
    border: 1px solid #fff;
}
[data-theme="light"] .residential-page .br-hero-content p,
[data-theme="light"] .contact-body .contact-hero-content p,
[data-theme="light"] .careers-body .careers-hero-content p,
[data-theme="light"] .blog-body .media-hero-content p  {
    color: #fff;
}

[data-theme="light"] .echipa-body .nav-logo-img,
[data-theme="light"] .residential-page .nav-logo-img,
[data-theme="light"] .lista-body .nav-logo-img
{
    content: url("../img/logo-black.png");
}

[data-theme="light"] .footer-logo-img {
  content: url("../img/logo-black.png");
}

[data-theme="light"] .contact-body .nav-links a,
[data-theme="light"] .careers-body .nav-links a,
[data-theme="light"] .blog-body .nav-links a,
[data-theme="light"] .home-body .nav-links a {
    color: #fff!important;
}

[data-theme="light"] .nav-links .has-submenu ul .has-submenu a {
    color: #000!important;
}


[data-theme="light"] .contact-body .nav-links a,
[data-theme="light"] .careers-body .nav-links a,
[data-theme="light"] .blog-body .nav-links a,
[data-theme="light"] .home-body .nav-links a {
    color: #fff !important;
}

[data-theme="light"] .echipa-body .nav.scrolled .nav-logo-img,
[data-theme="light"] .residential-page .nav.scrolled .nav-logo-img,
[data-theme="light"] .lista-body .nav.scrolled .nav-logo-img
{
    content: url("../img/logo.png");
}

[data-theme="light"] .echipa-body .nav.scrolled  .theme-toggle,
[data-theme="light"] .residential-page .nav.scrolled .theme-toggle,
[data-theme="light"] .contact-body .nav.scrolled .theme-toggle,
[data-theme="light"] .careers-body .nav.scrolled .theme-toggle,
[data-theme="light"] .blog-body .nav.scrolled .theme-toggle,
[data-theme="light"] .lista-body .nav.scrolled .theme-toggle {
    color: #fff;
    border: 1px solid #fff;
}
[data-theme="light"] .echipa-body .nav.scrolled .lang-toggle,
[data-theme="light"] .residential-page .nav.scrolled .lang-toggle,
[data-theme="light"] .contact-body .nav.scrolled .lang-toggle,
[data-theme="light"] .careers-body .nav.scrolled .lang-toggle,
[data-theme="light"] .blog-body .nav.scrolled .lang-toggle,
[data-theme="light"] .lista-body .nav.scrolled .lang-toggle {
    color: #fff;
    border: 1px solid #fff;
}

[data-theme="light"] .residential-page .nav.scrolled .nav-links a,
[data-theme="light"] .echipa-body .nav.scrolled .nav-links a,
[data-theme="light"] .lista-body .nav.scrolled .nav-links a {
    color: #fff;
}

[data-theme="light"] .nav.scrolled {
    background: #000;
}

/* ── Filter active state ─────────────────────────── */

.filter-select:not(:first-child):not([value=""]) {
    border-color: var(--gold);
}

/* No results message */
.no-results {
    grid-column: 1 / -1;
    text-align: center;
    padding: 80px 20px;
    color: var(--text-muted);
    font-size: 16px;
}

/* ── Animations ──────────────────────────────────── */

.fade-in {
    /* GSAP handles animation — elements visible by default for progressive enhancement */
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Property card filtered-out transition */
.property-card {
    transition: all var(--transition), opacity 0.3s ease, transform 0.3s ease;
}

/* ── Responsive ──────────────────────────────────── */

@media (max-width: 1024px) {
    .properties-grid { grid-template-columns: repeat(2, 1fr); }
    .team-grid { grid-template-columns: repeat(2, 1fr); }
    .neighborhoods-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
    .neighborhood-card:first-child { grid-column: span 2; }
    .concierge-inner { grid-template-columns: 1fr; }
    .concierge-image { min-height: 400px; }
    .detail-gallery { grid-template-rows: 400px; }
    .detail-content { grid-template-columns: 1fr; }
    .detail-sidebar { position: static; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .property-card-list { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    .stat-item:not(:last-child)::after { display: none; }
}

@media (max-width: 768px) {
    :root { --section-padding: 50px; }
    .nav-hamburger { display: flex; }
    .nav-phone { display: none; }
    .hero {
        height: 85vh;
        height: 85svh;
        min-height: 0;
        max-height: none;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .hero-content { max-width: 100%; }
    .hero h1 em { display: inline; }
    .hero-subtitle { margin-left: 30px; margin-right: 30px; }
    .hero-actions { justify-content: center; }
    /* Scroll indicator mai sus pe mobil ca sa nu fie ascuns de bara URL Safari */
    .hero-scroll { bottom: 16px; padding: 10px 16px; }
    .hero-scroll-line { height: 28px; }

    /* Section header (label + titlu + subtitlu + buton "Vezi Toate") — pe mobil se intinde pe rand */
    .section-header-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .section-header-row > div { width: 100%; }
    .section-header-row > .btn { text-align: center; }
    .hero-content { padding: 40px 24px; }
    .hero h1 { font-size: clamp(2rem, 8vw, 2.8rem); line-height: 1.1; }
    .hero-subtitle { font-size: 14px; line-height: 1.55; }
    .vt-arrows {
        padding: 0 12px;
    }
    .vt-arrow {
        width: 38px;
        height: 38px;
        font-size: 1.2rem;
    }

    /* ── Mobile menu drawer ─────────────────────────── */
    body.mobile-menu-open { overflow: hidden; }

    /* IMPORTANT: backdrop-filter creeaza un containing block pentru position:fixed,
       deci drawer-ul (fixat) ar fi constrans la dimensiunea nav-ului. Pe mobil
       inlocuim blur-ul cu un fundal opac ca drawer-ul sa se extinda corect. */
    .nav.scrolled {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: var(--bg-card);
    }

    .nav-links {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        position: fixed;
        top: 70px;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bg-card);
        border-top: 1px solid var(--border-subtle);
        padding: 12px 24px 80px;
        margin: 0;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 999;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-12px);
        transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
        list-style: none;
        max-width: 100vw;
    }

    /* Cand nav-ul e scrolled (mai compact), drawer-ul incepe mai sus */
    .nav.scrolled .nav-links { top: 54px; }

    .nav-links.mobile-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .nav-links > li {
        border-bottom: 1px solid var(--border-subtle);
    }

    .nav-links > li > a {
        display: block;
        padding: 16px 4px;
        font-size: 13px;
        letter-spacing: 0.18em;
        color: var(--text-primary);
    }

    /* Forteaza alb pentru tema dark indiferent de scrolled */
    [data-theme="dark"] .nav-links > li > a { color: var(--text-primary); }

    /* Submeniuri — colapsate default, expand pe tap (accordion) */
    .nav-links li ul {
        position: static;
        display: block;
        opacity: 1;
        visibility: visible;
        background: transparent;
        border: none;
        box-shadow: none;
        min-width: 0;
        margin: 0;
        padding: 0 0 0 16px;
        list-style: none;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s ease;
    }

    .nav-links li.submenu-open > ul {
        max-height: 2000px;
        padding-top: 4px;
        padding-bottom: 8px;
    }

    .nav-links li ul li { margin: 0; }

    .nav-links li ul li a {
        display: block;
        padding: 10px 8px;
        font-size: 14px;
        letter-spacing: 0.12em;
        color: var(--text-secondary);
        white-space: normal;
    }

    .nav-links li ul li ul {
        position: static;
        margin-left: 0;
        padding-left: 14px;
        border-left: 1px solid var(--border-subtle);
    }

    .nav-links li.submenu-open > ul li ul {
        padding-left: 14px;
    }

    .nav-links li ul li ul li a {
        font-size: 14px;
        letter-spacing: 0.08em;
        padding: 8px;
    }


    /* Hamburger animat in X cand e activ */
    .nav-hamburger {
        position: relative;
        z-index: 1001;
        width: 32px;
        height: 24px;
        justify-content: center;
    }
    .nav-hamburger span {
        position: absolute;
        left: 4px;
        right: 4px;
        transition: transform 0.28s ease, opacity 0.2s ease, top 0.28s ease;
    }
    .nav-hamburger span:nth-child(1) { top: 6px; }
    .nav-hamburger span:nth-child(2) { top: 12px; }
    .nav-hamburger span:nth-child(3) { top: 18px; }

    .nav-hamburger.active span:nth-child(1) {
        top: 12px;
        transform: rotate(45deg);
    }
    .nav-hamburger.active span:nth-child(2) { opacity: 0; }
    .nav-hamburger.active span:nth-child(3) {
        top: 12px;
        transform: rotate(-45deg);
    }

    /* End mobile menu */
    .properties-grid { grid-template-columns: 1fr; }
    .neighborhoods-grid { grid-template-columns: 1fr; }
    .neighborhood-card:first-child { grid-column: span 1; }
    .team-grid { grid-template-columns: 1fr; }
    .detail-gallery { grid-template-columns: 1fr; grid-template-rows: 300px auto; }
    .detail-specs-grid { grid-template-columns: repeat(2, 1fr); }
    .features-grid { grid-template-columns: 1fr; }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 24px;
        margin-bottom: 20px;
    }
    /* Brand si Contact pe rand intreg, Proprietati + Pagini pe acelasi rand */
    .footer-grid > .footer-brand,
    .footer-grid > .footer-col:last-child {
        grid-column: span 2;
    }
    .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
    .hero-actions {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 10px;
    }
    .hero-actions .btn {
        flex: 1 1 0;
        min-width: 0;
        padding-left: 12px;
        padding-right: 12px;
        font-size: 10px;
        text-align: center;
        white-space: nowrap;
    }
    .filters-inner { flex-wrap: wrap; }
    .form-row { grid-template-columns: 1fr; }
    .vt-controls { bottom: 80px; right: 24px; }
    .vt-arrows { padding: 0 12px; }
    .vt-arrow { width: 42px; height: 42px; font-size: 1.3rem; }
    .vt-badge { font-size: 0.7rem; padding: 6px 14px; }
    .lang-toggle { width: 36px; height: 36px; font-size: 10px; }
}

/* === Dropdown navigation desktop (Proprietati > Vanzari/Inchiriere) =====
   Scopate la min-width 769px ca pe mobil sa nu suprascrie regulile drawer. */
@media (min-width: 769px) {
    .nav-links li { position: relative; }
    .nav-links li ul {
        list-style: none;
        margin: 0;
        padding: 6px 0;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 220px;
        background: var(--bg-primary, #0a0a0a);
        border: 1px solid rgba(201, 169, 110, 0.15);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
        opacity: 0;
        visibility: hidden;
        z-index: 1100;
    }
    .nav-links li:hover > ul,
    .nav-links li:focus-within > ul {
        opacity: 1;
        visibility: visible;
    }
    .nav-links li ul li { display: block; }
    .nav-links li ul li a {
        display: block;
        padding: 8px 18px;
        white-space: nowrap;
    }
    .nav-links li ul li ul {
        top: 0;
        left: 100%;
        margin-left: 1px;
    }
}

/* === Echipa page (echipa.asp) ========================================= */
.page-header-tight { padding-bottom: 40px; }
.page-header-tight .section-subtitle { margin: 16px auto 0; }

/* Confirmation page (contact-conf.asp) */
.confirm-card {
    max-width: 580px;
    margin: 0 auto;
    text-align: center;
    padding: 56px 40px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    position: relative;
    overflow: hidden;
}
.confirm-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--gradient-gold, linear-gradient(135deg,#c5a572,#d4b88a));
}
.confirm-card-icon {
    display: inline-flex;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: rgba(197,165,114,0.08);
    color: var(--gold);
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}
.confirm-card-title {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 400;
    color: var(--gold);
    margin: 0 0 16px;
    letter-spacing: .01em;
}
.confirm-card-text {
    color: var(--text-secondary);
    font-size: 16px;
    line-height: 1.75;
    margin: 0 0 14px;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}
.confirm-card-text:last-of-type { margin-bottom: 32px; }
.confirm-card-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 8px;
}
@media (max-width: 600px) {
    .confirm-card { padding: 40px 24px; }
    .confirm-card-title { font-size: 1.5rem; }
    .confirm-card-text { font-size: 14px; }
    .confirm-card-actions { flex-direction: column; }
    .confirm-card-actions .btn { width: 100%; }
}

/* Legal pages (politica de confidentialitate / termeni) */
body.politica-body .legal-content {
    max-width: 860px;
    margin: 0 auto;
    color: var(--text-secondary);
    line-height: 1.85;
    font-size: 15px;
}
body.politica-body .legal-content p {
    margin-bottom: 18px;
}
body.politica-body .legal-content strong {
    color: var(--text-primary);
    font-weight: 600;
    font-family: var(--font-display);
    font-size: 1.15rem;
    display: inline-block;
    margin-top: 12px;
    letter-spacing: .01em;
}
body.politica-body .legal-content a {
    color: var(--gold);
    text-decoration: none;
    border-bottom: 1px solid var(--gold);
    transition: color .25s, border-color .25s;
}
body.politica-body .legal-content a:hover {
    color: var(--gold-light);
    border-color: var(--gold-light);
}
body.politica-body .legal-content ul,
body.politica-body .legal-content ol {
    margin: 0 0 18px 24px;
}
body.politica-body .legal-content li {
    margin-bottom: 8px;
}

.breadcrumbs-nav { margin-bottom: 16px; text-align: center; }
.breadcrumbs-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    opacity: .75;
}

.section-pad-top { padding-top: 60px; }

.concierge-mission { gap: 60px; }
.mission-text .section-subtitle { max-width: 100%; }
.mission-text .section-subtitle.mb-24 { margin-bottom: 24px; }
.mission-text .section-subtitle.mb-32 { margin-bottom: 32px; }

.mission-stats {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}
.mission-stats .stat-number { font-size: 2rem; }

.mission-image {
    min-height: 500px;
    background-position: center;
    background-size: cover;
}

.mission-social { margin-top: 32px; }

.section-bg-secondary { background: var(--bg-secondary); }

.section-header-center { text-align: center; }
.section-header-center .section-subtitle { margin: 8px auto 0; }

.section-subtitle-spaced { margin-bottom: 40px; }
.faq-trailing-note { margin-top: 8px; }

/* ── Calculator Taxe Notariale ─────────────────────── */

.calculator-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: stretch;
}

.calculator-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 36px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.calculator-card-title {
    font-family: var(--font-display);
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0 0 4px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-subtle);
}

.form-group-legend {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.calculator-radios {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.calculator-radio {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    padding: 12px 14px;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    background: var(--bg-primary);
    transition: border-color var(--transition);
    font-size: 14px;
    color: var(--text-primary);
}

.calculator-radio:hover {
    border-color: var(--gold);
}

.calculator-radio input[type="radio"] {
    width: 18px;
    height: 18px;
    accent-color: var(--gold);
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;
}

.calculator-result-group + .calculator-result-group {
    margin-top: 8px;
    padding-top: 24px;
    border-top: 1px solid var(--border-subtle);
}

.calculator-result-heading {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 16px;
}

.calculator-result-row {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 16px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px dashed var(--border-subtle);
}

.calculator-result-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.calculator-result-label {
    font-size: 13px;
    line-height: 1.5;
    color: var(--text-secondary);
}

.calculator-result-row input {
    padding: 12px 14px;
    background: var(--bg-primary);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--gold);
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 500;
    text-align: right;
}

.calculator-source {
    text-align: center;
    margin-top: 32px;
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.05em;
}

.calculator-source a {
    color: var(--gold);
    text-decoration: none;
    border-bottom: 1px dotted var(--gold);
}

.calculator-source a:hover {
    color: var(--gold-light);
}

@media (max-width: 900px) {
    .calculator-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .calculator-card { padding: 24px; }
    .calculator-result-row { grid-template-columns: 1fr; gap: 8px; }
    .calculator-result-row input { text-align: left; }
}

/* ── Adauga Cererea Ta (cererea-ta.asp) ─────────────── */

.cerere-form {
    max-width: 880px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.cerere-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 36px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cerere-step {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-subtle);
    margin-bottom: 4px;
}

.cerere-step-num {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(197,165,114,0.12);
    color: var(--gold);
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 600;
    flex-shrink: 0;
}

.cerere-step-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0;
}

.form-row-3 {
    grid-template-columns: 1fr 1fr 1fr;
}

.form-row-2-1 {
    grid-template-columns: 1fr 2fr;
}

.required {
    color: var(--gold);
    margin-left: 2px;
}

.cerere-captcha {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px;
    align-items: end;
}

.cerere-captcha-img img {
    border-radius: var(--radius);
    border: 1px solid var(--border-subtle);
    background: #fff;
    padding: 4px;
    display: block;
}

.cerere-privacy {
    margin-top: 12px;
}

.cerere-submit {
    margin-top: 8px;
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .form-row-3,
    .form-row-2-1 { grid-template-columns: 1fr; }
    .cerere-card { padding: 24px; }
    .cerere-captcha { grid-template-columns: 1fr; }
    .cerere-submit { justify-content: stretch; }
    .cerere-submit .btn { width: 100%; }
}

/* ── Agent contact modal (oferteagenti.asp) ─────────── */

.agent-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(0,0,0,0.75);
    backdrop-filter: blur(8px);
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.agent-modal.active { display: flex; }

.agent-modal-card {
    position: relative;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 40px;
    max-width: 560px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5);
    animation: agent-modal-in 0.3s ease-out;
}

@keyframes agent-modal-in {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.agent-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    transition: all var(--transition);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 2;
    -webkit-tap-highlight-color: rgba(197,165,114,0.2);
    touch-action: manipulation;
    user-select: none;
}

.agent-modal-close:hover,
.agent-modal-close:focus {
    border-color: var(--gold);
    color: var(--gold);
    outline: none;
}

@media (max-width: 600px) {
    .agent-modal-close {
        width: 40px;
        height: 40px;
        top: 10px;
        right: 10px;
        font-size: 24px;
    }
}

.agent-modal-head { margin-bottom: 24px; }

.agent-modal-head h3 {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 8px 0 0;
}

.agent-contact-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.agent-modal-submit {
    width: 100%;
    margin-top: 8px;
}

/* No properties placeholder */
.agent-no-properties {
    text-align: center;
    color: var(--text-muted);
    font-size: 14px;
    padding: 60px 20px;
    background: var(--bg-card);
    border: 1px dashed var(--border-subtle);
    border-radius: var(--radius-lg);
    margin: 0;
}

/* Pagination on agent page */
.agent-pagination {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 48px;
    flex-wrap: wrap;
}

.agent-pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 14px;
    transition: all var(--transition);
}

.agent-pagination .page-link:hover {
    border-color: var(--gold);
    color: var(--gold);
}

.agent-pagination .page-link.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #0a0a0a;
}

@media (max-width: 600px) {
    .agent-modal-card { padding: 28px 20px; }
    .agent-modal-head h3 { font-size: 1.2rem; }
}

/* ── Open House (openhouse.asp) ──────────────────────── */

.openhouse-details-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

.openhouse-details-title {
    font-family: var(--font-display);
    font-size: 1.8rem;
    font-weight: 400;
    color: var(--gold);
    margin: 0;
    letter-spacing: 0.04em;
}

.openhouse-details-list {
    list-style: none;
    padding: 0;
    margin: 8px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.openhouse-details-list li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    color: var(--text-secondary);
    line-height: 1.6;
}

.openhouse-details-list li svg {
    color: var(--gold);
    flex-shrink: 0;
    margin-top: 4px;
}

.openhouse-details-list li strong { color: var(--text-primary); }

.openhouse-details-list li a {
    color: var(--text-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.openhouse-details-list li a:hover { color: var(--gold); }

.openhouse-confirm-note {
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
    font-size: 13px;
    line-height: 1.7;
    color: var(--text-muted);
    letter-spacing: 0.05em;
}

.openhouse-confirm-note strong {
    color: var(--gold);
    letter-spacing: 0.15em;
}

@media (max-width: 600px) {
    .openhouse-details-card { padding: 28px 22px; }
    .openhouse-details-title { font-size: 1.5rem; }
}

/* ── Oferte Internationale (oferteinternationale.asp) ── */

.international-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.international-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: flex;
    flex-direction: column;
}

.international-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.35);
    border-color: var(--gold);
}

.international-card-img {
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
}

.international-card-img-link {
    display: block;
    width: 100%;
    height: 100%;
}

.international-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.international-card:hover .international-card-img img { transform: scale(1.05); }

.international-card-loc {
    position: absolute;
    bottom: 14px;
    left: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: rgba(10,10,10,0.78);
    backdrop-filter: blur(8px);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 100px;
    border: 1px solid rgba(197,165,114,0.3);
    z-index: 2;
}

.international-card-loc svg { color: var(--gold); flex-shrink: 0; }

.international-card-body {
    padding: 24px 28px 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1;
}

.international-card-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 500;
    margin: 0;
    line-height: 1.3;
}

.international-card-title a {
    color: var(--text-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.international-card-title a:hover,
.international-card-title a:focus {
    color: var(--gold);
}

.international-card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--gold);
    text-decoration: none;
    margin-top: auto;
    transition: gap var(--transition);
}

.international-card-link:hover { gap: 12px; }

@media (max-width: 992px) {
    .international-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .international-grid { grid-template-columns: 1fr; }
}

/* ── Adauga oferta (oferta-ta.asp) ──────────────────── */

.oferta-files-hint {
    font-size: 13px;
    color: var(--text-muted);
    margin: 0 0 4px;
}

.oferta-file-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px 16px;
    background: var(--bg-primary);
    border: 1px dashed var(--border);
    border-radius: var(--radius);
    cursor: pointer;
    transition: border-color var(--transition), background var(--transition);
    text-align: center;
    color: var(--text-secondary);
    min-height: 140px;
}

.oferta-file-label:hover {
    border-color: var(--gold);
    background: rgba(197,165,114,0.04);
}

.oferta-file-label svg {
    color: var(--gold);
    flex-shrink: 0;
}

.oferta-file-text {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-primary);
}

.oferta-file-name {
    font-size: 12px;
    color: var(--text-muted);
    word-break: break-all;
    line-height: 1.4;
    max-width: 100%;
}

.oferta-file-label input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ── Landing Page Dubai (landingpage.asp) ────────────── */

.dubai-hero {
    position: relative;
    height: 80vh;
    min-height: 560px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
}

.dubai-hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.dubai-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.75) 100%);
    z-index: 2;
}

.dubai-hero-content {
    position: relative;
    z-index: 3;
    max-width: 880px;
    padding: 24px;
}

.dubai-hero-content h1 {
    font-family: var(--font-display);
    font-size: clamp(2.4rem, 5vw, 4.2rem);
    font-weight: 300;
    line-height: 1.1;
    margin: 16px 0 20px;
    color: #fff;
}

.dubai-hero-content h1 em {
    color: var(--gold);
    font-style: italic;
}

.dubai-hero-content .hero-subtitle {
    font-size: 1.1rem;
    color: rgba(255,255,255,0.85);
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

.dubai-hero-event {
    margin-top: 48px;
    display: inline-flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 28px;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(197,165,114,0.4);
    border-radius: var(--radius-lg);
}

.dubai-event-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold);
}

.dubai-event-info {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #fff;
}

/* Form section */
.dubai-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: stretch;
}

.dubai-form-card {
    padding: 40px;
}

.dubai-locatii {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.dubai-locatie-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--bg-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    cursor: pointer;
    transition: border-color var(--transition);
    font-size: 14px;
    color: var(--text-primary);
}

.dubai-locatie-pill:hover { border-color: var(--gold); }

.dubai-locatie-pill input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--gold);
    flex-shrink: 0;
    margin: 0;
}

.dubai-submit {
    width: 100%;
    margin-top: 8px;
}

.dubai-form-side {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    min-height: 480px;
}

.dubai-form-side img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dubai-form-side-content {
    position: relative;
    z-index: 2;
    height: 100%;
    padding: 36px;
    background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,0.85) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: #fff;
    min-height: 480px;
}

.dubai-form-headline {
    font-family: var(--font-display);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 20px;
}

.dubai-form-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--gold);
    margin-bottom: 12px;
    letter-spacing: 0.05em;
}

.dubai-form-tagline {
    font-size: 14px;
    color: rgba(255,255,255,0.85);
    line-height: 1.6;
}

.dubai-form-tagline strong {
    color: var(--gold);
    font-weight: 500;
}

/* Investitii section */
.dubai-investitii-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

.dubai-video {
    position: sticky;
    top: 24px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    aspect-ratio: 16/10;
    background: #000;
}

.dubai-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dubai-features {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-top: 32px;
}

.dubai-feature {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.dubai-feature-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(72%) sepia(28%) saturate(478%) hue-rotate(7deg) brightness(91%) contrast(86%);
}

.dubai-feature h5 {
    font-family: var(--font-display);
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0 0 6px;
}

.dubai-feature p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-secondary);
    margin: 0;
}

/* Mutat section */
.dubai-mutat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.dubai-mutat-features {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 32px 0 32px;
}

.dubai-mutat-feature {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    transition: border-color var(--transition);
}

.dubai-mutat-feature:hover { border-color: var(--gold); }

.dubai-mutat-feature img {
    width: 36px;
    height: 36px;
    object-fit: contain;
    flex-shrink: 0;
    filter: brightness(0) saturate(100%) invert(72%) sepia(28%) saturate(478%) hue-rotate(7deg) brightness(91%) contrast(86%);
}

.dubai-mutat-feature h5 {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0;
}

.dubai-mutat-image {
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.dubai-mutat-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Gallery */
.dubai-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.dubai-gallery-item {
    display: block;
    aspect-ratio: 4/3;
    border-radius: var(--radius);
    overflow: hidden;
    cursor: pointer;
}

.dubai-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.dubai-gallery-item:hover img { transform: scale(1.05); }

/* ANG cards */
.dubai-ang-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.dubai-ang-card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 36px;
    text-align: center;
    transition: border-color var(--transition);
}

.dubai-ang-card:hover { border-color: var(--gold); }

.dubai-ang-card img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    margin-bottom: 20px;
    filter: brightness(0) saturate(100%) invert(72%) sepia(28%) saturate(478%) hue-rotate(7deg) brightness(91%) contrast(86%);
}

.dubai-ang-card h5 {
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--text-primary);
    margin: 0 0 14px;
}

.dubai-ang-card p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-secondary);
    margin: 0;
}

/* Testimonials */
.dubai-testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.dubai-testimonial {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dubai-testimonial-stars {
    display: flex;
    gap: 4px;
    color: var(--gold);
}

.dubai-testimonial p {
    font-size: 14px;
    line-height: 1.75;
    color: var(--text-secondary);
    font-style: italic;
    margin: 0;
    flex: 1;
}

.dubai-testimonial-author {
    font-family: var(--font-display);
    font-size: 0.95rem;
    color: var(--gold);
    letter-spacing: 0.1em;
    margin-top: 8px;
}

/* Footer gallery */
.dubai-footer-gallery {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}

.dubai-footer-gallery a {
    display: block;
    aspect-ratio: 1/1;
    border-radius: var(--radius);
    overflow: hidden;
}

.dubai-footer-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.dubai-footer-gallery a:hover img { transform: scale(1.05); }

/* Floating actions (mobile) */
.dubai-floating-actions {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-subtle);
    padding: 12px;
    gap: 8px;
}

.dubai-fab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px;
    color: var(--text-primary);
    text-decoration: none;
    font-size: 11px;
    border-radius: var(--radius);
    background: var(--bg-primary);
    border: 1px solid var(--border-subtle);
    transition: border-color var(--transition);
}

.dubai-fab:hover { border-color: var(--gold); color: var(--gold); }

@media (max-width: 992px) {
    .dubai-form-grid,
    .dubai-investitii-grid,
    .dubai-mutat-grid { grid-template-columns: 1fr; gap: 32px; }
    .dubai-video { position: static; }
    .dubai-ang-grid,
    .dubai-testimonials { grid-template-columns: 1fr; }
    .dubai-gallery { grid-template-columns: repeat(2, 1fr); }
    .dubai-footer-gallery { grid-template-columns: repeat(3, 1fr); }
    .dubai-form-side { min-height: 320px; }
    .dubai-form-side-content { min-height: 320px; }
}

@media (max-width: 600px) {
    .dubai-hero { height: auto; min-height: 480px; padding: 80px 0; }
    .dubai-form-card { padding: 24px; }
    .dubai-locatii { grid-template-columns: 1fr; }
    .dubai-gallery { grid-template-columns: 1fr; }
    .dubai-footer-gallery { grid-template-columns: repeat(2, 1fr); }
    .dubai-floating-actions { display: flex; }
    body.landingpage-body { padding-bottom: 80px; }
}

.team-card-link { cursor: pointer; }

/* Hero Concierge button — light outline on dark hero */
.btn-outline-light {
    border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
    background: transparent;
}
.btn-outline-light:hover,
.btn-outline-light:focus {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}

/* Hero Virtual Tour slide backgrounds */
.vt-slide-exterior  { background-image: url('../img/virtual-tour/01-exterior.jpg'); }
.vt-slide-facade    { background-image: url('../img/virtual-tour/15-facade.jpg'); }
.vt-slide-living    { background-image: url('../img/virtual-tour/03-living.jpg'); }
.vt-slide-dining    { background-image: url('../img/virtual-tour/04-dining.jpg'); }
.vt-slide-kitchen   { background-image: url('../img/virtual-tour/05-kitchen.jpg'); }
.vt-slide-lounge    { background-image: url('../img/virtual-tour/11-lounge.jpg'); }
.vt-slide-staircase { background-image: url('../img/virtual-tour/09-staircase.jpg'); }
.vt-slide-master    { background-image: url('../img/virtual-tour/13-master.jpg'); }
.vt-slide-bedroom   { background-image: url('../img/virtual-tour/06-bedroom.jpg'); }
.vt-slide-bathroom  { background-image: url('../img/virtual-tour/08-bathroom.jpg'); }
.vt-slide-detail    { background-image: url('../img/virtual-tour/12-detail.jpg'); }
.vt-slide-terrace   { background-image: url('../img/virtual-tour/14-terrace.jpg'); }
.vt-slide-garden    { background-image: url('../img/virtual-tour/10-garden.jpg'); }

.testimonial-ceo {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.cta-section { text-align: center; }
.cta-section .section-subtitle { margin: 0 auto 32px; }

/* === Leadership card (Conducerea ANG) ================================= */
.leadership-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin: 0 auto;
}
.leadership-card { padding: 40px 32px; }
.leadership-card .team-avatar {
    width: 140px;
    height: 140px;
}
.leadership-card .team-name { font-size: 1.5rem; }
.leadership-card .team-desc {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.7;
    margin-top: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.leadership-card .team-stats { margin-top: 16px; }
.leadership-actions {
    margin-top: 20px;
    display: flex;
    gap: 8px;
    justify-content: center;
}
.btn-sm { font-size: 11px; padding: 8px 14px; }

/* === Media / Blog page (blog.asp) ===================================== */
.media-hero {
    position: relative;
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    background: #0a0a0a;
}
.media-hero-bg {
    position: absolute;
    inset: 0;
    background: url('../img/concierge-office.jpg') center/cover no-repeat;
    opacity: 0.2;
}
.media-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,10,10,0.95) 0%, rgba(10,10,10,0.3) 50%, rgba(10,10,10,0.6) 100%);
}
.media-hero-content {
    position: relative;
    z-index: 2;
    max-width: 700px;
    padding: 140px 24px 70px;
}
.media-hero-content h1 {
    font-family: var(--font-display);
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    color: var(--text-primary);
    margin-bottom: 16px;
    font-weight: 300;
}
.media-hero-content h1 span { color: var(--gold); }
.media-hero-content p {
    color: var(--text-secondary);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 560px;
    margin: 0 auto;
}
.media-hero-count {
    display: inline-block;
    margin-top: 24px;
    font-size: 13px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.media-hero-count strong { color: var(--gold); font-weight: 600; }

/* Search bar (in place of theme filters) */
.media-filters {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 32px 24px;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border);
}
.media-search-form {
    display: flex;
    width: 100%;
    max-width: 480px;
    gap: 8px;
}
.media-search-form input {
    flex: 1;
    padding: 10px 18px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 100px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: var(--font-body);
}
.media-search-form input:focus {
    border-color: var(--gold);
    outline: none;
}
.media-search-form button {
    padding: 10px 22px;
    background: var(--gold);
    border: 1px solid var(--gold);
    border-radius: 100px;
    color: #0a0a0a;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0.05em;
}

a.media-filter-btn,
.media-filter-btn {
    padding: 10px 20px !important;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 100px;
    color: var(--text-secondary) !important;
    font-size: 13px;
    font-family: var(--font-body);
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none !important;
    display: inline-block;
    line-height: 1.2;
}
a.media-filter-btn:hover,
.media-filter-btn:hover {
    border-color: var(--gold);
    color: var(--text-primary) !important;
}
a.media-filter-btn.active,
.media-filter-btn.active {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: #0a0a0a !important;
    font-weight: 600;
}

.media-featured-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.media-articles-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.media-card {
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.media-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(0,0,0,0.3);
    border-color: var(--gold);
}
.media-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}
.media-card-image {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: var(--bg-elevated);
}
.media-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.media-card:hover .media-card-image img { transform: scale(1.05); }
.media-card-category {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 12px;
    background: rgba(10,10,10,0.75);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(197,165,114,0.3);
    border-radius: 100px;
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 500;
}
.media-card-body { padding: 24px; }
.media-card-featured .media-card-body { padding: 28px; }
.media-card-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}
.media-card-date {
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.05em;
}
.media-card-source {
    font-size: 11px;
    color: var(--gold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 500;
}
.media-card-title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.4;
    color: var(--text-primary);
    margin: 0 0 12px;
}
.media-card-featured .media-card-title { font-size: 1.5rem; }
.media-card-excerpt {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-secondary);
    margin: 0 0 16px;
}
.media-card-read {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--gold);
    font-weight: 500;
    letter-spacing: 0.05em;
    transition: gap 0.3s;
}
.media-card:hover .media-card-read { gap: 10px; }

.media-cta {
    text-align: center;
    padding: 80px 24px;
    background: var(--bg-secondary);
}
.media-cta p {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.7;
    max-width: 500px;
    margin: 0 auto 24px;
}
.media-empty {
    text-align: center;
    padding: 40px 20px;
    color: var(--text-muted);
    font-size: 14px;
}

/* === Agent profile page (oferteagenti.asp) ============================ */
.agent-hero {
    padding: 120px 0 60px;
    background: var(--bg-secondary);
}
.agent-profile {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 48px;
    align-items: start;
}
.agent-photo {
    width: 280px;
    height: 340px;
    object-fit: cover;
    border-radius: var(--radius-lg);
    border: 3px solid var(--gold);
}
.agent-info { padding-top: 8px; }
.agent-name {
    font-family: var(--font-display);
    font-size: 2.4rem;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.agent-role {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 20px;
}
.agent-bio {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 16px;
}
.agent-bio p {
    padding-bottom: 20px;
}
.agent-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 28px;
}
.agent-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: var(--bg-elevated);
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
}
.agent-contact-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gold-subtle);
    border-radius: 50%;
    color: var(--gold);
    font-size: 18px;
    flex-shrink: 0;
}
.agent-contact-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    margin-bottom: 2px;
}
.agent-contact-value {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 500;
}
.agent-contact-value a {
    color: var(--text-primary);
    text-decoration: none;
}
.agent-contact-value a:hover { color: var(--gold); }
.agent-stats-row {
    display: flex;
    gap: 32px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--border);
    flex-wrap: wrap;
}
.agent-stat { text-align: center; }
.agent-stat-value {
    font-family: var(--font-display);
    font-size: 1.8rem;
    color: var(--gold);
}
.agent-stat-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    margin-top: 2px;
}
.agent-actions {
    display: flex;
    gap: 12px;
    margin-top: 28px;
    flex-wrap: wrap;
}
.agent-actions .btn-whatsapp { border-color: #25D366; color: #25D366; }
.agent-actions .btn-whatsapp:hover { background: #25D366; color: #fff; }
.agent-areas { padding: 60px 0; }
.areas-list {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}
.area-tag {
    padding: 10px 24px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 100px;
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s;
    text-decoration: none;
    display: inline-block;
}
.area-tag:hover {
    border-color: var(--gold);
    color: var(--gold);
}
.back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--text-muted);
    text-decoration: none;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 24px;
    transition: color 0.3s;
}
.back-link:hover { color: var(--gold); }

@media (max-width: 768px) {
    .agent-profile { grid-template-columns: 1fr; text-align: center; }
    .agent-photo { margin: 0 auto; width: 200px; height: 250px; }
    .agent-contact-grid { grid-template-columns: 1fr; }
    .agent-stats-row { justify-content: center; }
    .agent-actions { justify-content: center; }
    .agent-name { font-size: 1.8rem; }
    .areas-list { justify-content: center; }
}

@media (max-width: 1024px) {
    .media-articles-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .media-featured-grid { grid-template-columns: 1fr; }
    .media-articles-grid { grid-template-columns: 1fr; }
    .media-hero-content { padding: 120px 20px 50px; }
    .media-filters { padding: 20px 16px; gap: 6px; }
    .media-search-form { flex-direction: column; }
}
    .media-detail-hero {
        position: relative;
        min-height: 50vh;
        display: flex;
        align-items: flex-end;
        overflow: hidden;
        background: #0a0a0a;
        padding-top: 100px;
    }
    .media-detail-hero-bg {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        opacity: 0.3;
        transition: opacity 0.5s;
    }
    .media-detail-hero-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(10,10,10,1) 0%, rgba(10,10,10,0.6) 40%, rgba(10,10,10,0.3) 100%);
    }
    .media-detail-hero-content {
        position: relative;
        z-index: 2;
        max-width: 800px;
        padding: 0 24px 60px;
        margin: 0 auto;
        width: 100%;
    }
    .media-detail-category {
        display: inline-block;
        padding: 4px 14px;
        background: rgba(197,165,114,0.15);
        border: 1px solid rgba(197,165,114,0.3);
        border-radius: 100px;
        font-size: 11px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--gold);
        font-weight: 600;
        margin-bottom: 16px;
    }
    .media-detail-hero h1 {
        font-family: var(--font-display);
        font-size: clamp(1.8rem, 4vw, 2.8rem);
        color: var(--text-primary);
        font-weight: 400;
        line-height: 1.3;
        margin-bottom: 16px;
    }
    .media-detail-meta {
        display: flex;
        align-items: center;
        gap: 20px;
        font-size: 13px;
        color: var(--text-muted);
        flex-wrap: wrap;
    }
    .media-detail-meta span {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    /* ── Article Body ────────────────────────────────── */
    .media-detail-article {
        max-width: 800px;
        margin: 0 auto;
        padding: 60px 24px 80px;
    }
    .media-detail-body {
        font-family: var(--font-body);
        font-size: 16px;
        line-height: 1.9;
        color: var(--text-secondary);
    }
    .media-detail-body p {
        margin-bottom: 20px;
    }
    .media-detail-body h2 {
        font-family: var(--font-display);
        font-size: 1.6rem;
        color: var(--text-primary);
        margin: 40px 0 16px;
        font-weight: 500;
    }
    .media-detail-body h3, .media-detail-body h4 {
        font-family: var(--font-display);
        font-size: 1.3rem;
        color: var(--text-primary);
        margin: 32px 0 12px;
        font-weight: 500;
    }
    .media-detail-body blockquote {
        border-left: 3px solid var(--gold);
        padding: 16px 24px;
        margin: 32px 0;
        background: rgba(197,165,114,0.05);
        border-radius: 0 8px 8px 0;
        font-style: italic;
        color: var(--text-primary);
        font-size: 17px;
        line-height: 1.8;
    }
    .media-detail-body ul, .media-detail-body ol {
        padding-left: 24px;
        margin-bottom: 20px;
    }
    .media-detail-body li {
        margin-bottom: 8px;
    }
    .media-detail-body figure {
        margin: 32px 0;
        border-radius: 8px;
        overflow: hidden;
    }
    .media-detail-body figure img {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 8px;
    }
    .media-detail-body img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
        margin: 16px 0;
    }
    .media-detail-body strong, .media-detail-body b {
        color: var(--text-primary);
        font-weight: 600;
    }
    .media-detail-body a {
        color: var(--gold);
        text-decoration: underline;
        text-underline-offset: 3px;
    }
    .media-detail-body iframe {
        max-width: 100%;
        border-radius: 8px;
    }

    /* ── Video Embed ─────────────────────────────────── */
    .media-detail-video {
        position: relative;
        width: 100%;
        padding-bottom: 56.25%;
        margin-bottom: 32px;
        border-radius: 8px;
        overflow: hidden;
        background: #000;
    }
    .media-detail-video iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: none;
    }

    /* ── Back + Share ────────────────────────────────── */
    .media-detail-nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 800px;
        margin: 0 auto;
        padding: 20px 24px;
        gap: 16px;
        flex-wrap: wrap;
    }
    .media-back {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: var(--text-secondary);
        text-decoration: none;
        letter-spacing: 0.05em;
        transition: color 0.3s;
    }
    .media-back:hover {
        color: var(--gold);
    }
    .media-detail-share {
        display: inline-flex;
        align-items: center;
        gap: 12px;
        font-size: 12px;
        color: var(--text-muted);
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }
    .media-detail-share a {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        border: 1px solid var(--border);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--text-secondary);
        text-decoration: none;
        transition: all 0.3s;
    }
    .media-detail-share a:hover {
        color: #0a0a0a;
        background: var(--gold);
        border-color: var(--gold);
    }

    /* ── Divider ─────────────────────────────────────── */
    .media-detail-divider {
        max-width: 800px;
        margin: 0 auto;
        padding: 0 24px;
    }
    .media-detail-divider hr {
        border: none;
        border-top: 1px solid var(--border);
    }

    /* ── Related Articles ────────────────────────────── */
    .media-related-section {
        background: var(--bg-secondary);
    }
    .media-related-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    /* ── Responsive ──────────────────────────────────── */
    @media (max-width: 1024px) {
        .media-related-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 768px) {
        .media-detail-hero {
            min-height: 50vh;
            padding-top: 90px;
        }
        .media-detail-hero-content { padding-bottom: 30px; }
        .media-detail-hero h1 { font-size: 1.4rem; line-height: 1.25; }
        .media-detail-article { padding: 40px 20px 60px; }
        .media-related-grid { grid-template-columns: 1fr; }
        .media-detail-body { font-size: 15px; }
    }

        .careers-hero {
        position: relative;
        min-height: 70vh;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        overflow: hidden;
        background: #0a0a0a;
    }
    .careers-hero-bg {
        position: absolute;
        inset: 0;
        background-image: url('../img/cariere/concierge-office-2.jpg');
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        opacity: 0.45;
    }
    .careers-hero-overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(10,10,10,0.95) 0%, rgba(10,10,10,0.4) 50%, rgba(10,10,10,0.6) 100%);
    }
    .careers-hero-content {
        position: relative;
        z-index: 2;
        max-width: 760px;
        padding: 120px 24px 80px;
    }
    .careers-hero-content h1 {
        font-family: var(--font-display);
        font-size: clamp(2.2rem, 5vw, 3.5rem);
        color: var(--text-primary);
        margin-bottom: 20px;
        font-weight: 300;
        line-height: 1.2;
    }
    .careers-hero-content h1 span { color: var(--gold); }
    .careers-hero-content p {
        color: var(--text-secondary);
        font-size: 1.1rem;
        line-height: 1.7;
        margin-bottom: 36px;
    }

    /* ── Stats Bar ────────────────────────────────────── */
    .careers-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0;
        background: var(--bg-secondary);
        border-top: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
    }
    .careers-stat {
        text-align: center;
        padding: 40px 16px;
        border-right: 1px solid var(--border);
    }
    .careers-stat:last-child { border-right: none; }
    .careers-stat-number {
        font-family: var(--font-display);
        font-size: 2.5rem;
        color: var(--gold);
        font-weight: 300;
        line-height: 1;
        margin-bottom: 8px;
    }
    .careers-stat-label {
        font-size: 12px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--text-secondary);
    }

    /* ── Why ANG ──────────────────────────────────────── */
    .benefits-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        margin-top: 48px;
    }
    .benefit-card {
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 36px 28px;
        transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .benefit-card:hover {
        border-color: var(--gold);
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(0,0,0,0.3);
    }
    .benefit-icon {
        width: 48px;
        height: 48px;
        border-radius: 10px;
        background: rgba(197, 165, 114, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
        color: var(--gold);
    }
    .benefit-icon svg { width: 24px; height: 24px; }
    .benefit-card h3 {
        font-family: var(--font-display);
        font-size: 1.25rem;
        color: var(--text-primary);
        margin-bottom: 10px;
        font-weight: 500;
    }
    .benefit-card p {
        color: var(--text-secondary);
        font-size: 14px;
        line-height: 1.7;
    }

    /* ── Who We Seek ──────────────────────────────────── */
    .seek-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 60px;
        align-items: center;
    }
    .seek-text h2 {
        font-family: var(--font-display);
        font-size: 2rem;
        color: var(--text-primary);
        margin-bottom: 16px;
        font-weight: 300;
    }
    .seek-text p {
        color: var(--text-secondary);
        font-size: 15px;
        line-height: 1.8;
        margin-bottom: 24px;
    }
    .seek-list { list-style: none; padding: 0; margin: 0; }
    .seek-list li {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 10px 0;
        color: var(--text-primary);
        font-size: 15px;
        line-height: 1.6;
    }
    .seek-check {
        color: var(--gold);
        font-size: 18px;
        flex-shrink: 0;
        margin-top: 2px;
    }

    /* ── Testimonial ──────────────────────────────────── */
    .careers-testimonial {
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 48px;
        max-width: 700px;
        margin: 0 auto;
        text-align: center;
    }
    .careers-testimonial blockquote {
        font-family: var(--font-display);
        font-size: 1.35rem;
        color: var(--text-primary);
        font-style: italic;
        line-height: 1.7;
        margin-bottom: 24px;
        font-weight: 300;
    }
    .careers-testimonial blockquote::before {
        content: "\201C";
        font-size: 3rem;
        color: var(--gold);
        display: block;
        margin-bottom: 8px;
        line-height: 1;
    }
    .careers-testimonial-author {
        font-size: 14px;
        font-weight: 600;
        color: var(--gold);
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }
    .careers-testimonial-role {
        font-size: 13px;
        color: var(--text-secondary);
        margin-top: 4px;
    }

    /* ── Application Form ─────────────────────────────── */
    .careers-form-section { background: var(--bg-secondary); }
    .careers-form { max-width: 720px; margin: 0 auto; }
    .careers-form .form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    .careers-form .form-group { margin-bottom: 20px; }
    .careers-form label {
        display: block;
        font-size: 12px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--text-secondary);
        margin-bottom: 8px;
    }
    .careers-form label .required { color: var(--gold); }
    .careers-form input[type="text"],
    .careers-form input[type="tel"],
    .careers-form input[type="email"],
    .careers-form select,
    .careers-form textarea {
        width: 100%;
        padding: 14px 16px;
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 8px;
        color: var(--text-primary);
        font-size: 14px;
        font-family: var(--font-body);
        transition: border-color 0.3s;
        box-sizing: border-box;
    }
    .careers-form input:focus,
    .careers-form select:focus,
    .careers-form textarea:focus {
        outline: none;
        border-color: var(--gold);
    }
    .careers-form select {
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a09890' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
        padding-right: 40px;
    }
    .careers-form textarea {
        min-height: 110px;
        resize: vertical;
        font-family: var(--font-body);
    }
    .careers-form textarea.error {
        border-color: #ef4444;
    }

    /* Job-specific question blocks */
    .job-questions {
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 28px;
        margin: 4px 0 24px;
    }
    .job-questions h5 {
        font-family: var(--font-display);
        font-size: 1.3rem;
        color: var(--gold);
        margin: 0 0 12px;
        font-weight: 500;
    }
    .job-questions > p {
        color: var(--text-secondary);
        font-size: 14px;
        line-height: 1.7;
        margin-bottom: 20px;
    }
    .job-questions .form-group:last-child { margin-bottom: 0; }

    /* CV Upload */
    .cv-upload {
        position: relative;
        border: 2px dashed var(--border);
        border-radius: 8px;
        padding: 32px;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s;
    }
    .cv-upload:hover {
        border-color: var(--gold);
        background: rgba(197, 165, 114, 0.03);
    }
    .cv-upload.has-file {
        border-color: var(--gold);
        background: rgba(197, 165, 114, 0.05);
    }
    .cv-upload input[type="file"] {
        position: absolute;
        inset: 0;
        opacity: 0;
        cursor: pointer;
    }
    .cv-upload-icon {
        font-size: 28px;
        color: var(--gold);
        margin-bottom: 8px;
    }
    .cv-upload-text { font-size: 14px; color: var(--text-secondary); }
    .cv-upload-text strong { color: var(--gold); }
    .cv-upload-hint { font-size: 12px; color: var(--text-muted); margin-top: 6px; }
    .cv-filename { font-size: 13px; color: var(--gold); margin-top: 8px; display: none; }
    .cv-upload.has-file .cv-filename { display: block; }

    /* GDPR Checkbox */
    .gdpr-check {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        margin: 24px 0;
    }
    .gdpr-check input[type="checkbox"] {
        width: 18px;
        height: 18px;
        margin-top: 2px;
        accent-color: var(--gold);
        flex-shrink: 0;
    }
    .gdpr-check label {
        font-size: 13px;
        color: var(--text-secondary);
        line-height: 1.5;
        text-transform: none;
        letter-spacing: 0;
        margin-bottom: 0;
        cursor: pointer;
    }
    .gdpr-check label a { color: var(--gold); }

    .careers-submit {
        width: 100%;
        justify-content: center;
        padding: 16px 28px;
        background: var(--gold);
        color: #0a0a0a;
        border: none;
        border-radius: 8px;
        font-family: var(--font-body);
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        cursor: pointer;
        transition: all 0.3s;
    }
    .careers-submit:hover {
        background: var(--gold-light);
        transform: translateY(-1px);
        box-shadow: 0 8px 24px rgba(197,165,114,0.25);
    }

    /* Agent card sidebar */
    .careers-agent-card {
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 28px;
        max-width: 360px;
        margin: 32px auto 0;
        text-align: center;
    }
    .careers-agent-card img {
        width: 96px;
        height: 96px;
        border-radius: 50%;
        object-fit: cover;
        margin-bottom: 16px;
        border: 2px solid var(--gold);
    }
    .careers-agent-card h4 {
        font-family: var(--font-display);
        font-size: 1.25rem;
        color: var(--text-primary);
        margin-bottom: 4px;
        font-weight: 500;
    }
    .careers-agent-card .agent-role {
        font-size: 12px;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 12px;
    }
    .careers-agent-card a {
        display: block;
        color: var(--text-secondary);
        font-size: 14px;
        text-decoration: none;
        padding: 4px 0;
        transition: color 0.3s;
    }
    .careers-agent-card a:hover { color: var(--gold); }

    /* ── Responsive ───────────────────────────────────── */
    @media (max-width: 1024px) {
        .benefits-grid { grid-template-columns: repeat(2, 1fr); }
        .seek-layout { grid-template-columns: 1fr; gap: 40px; }
    }
    @media (max-width: 640px) {
        .careers-stats { grid-template-columns: repeat(2, 1fr); }
        .careers-stat { border-bottom: 1px solid var(--border); }
        .careers-stat:nth-child(2) { border-right: none; }
        .benefits-grid { grid-template-columns: 1fr; }
        .careers-form .form-row { grid-template-columns: 1fr; }
        .careers-hero-content { padding: 100px 20px 60px; }
        .careers-testimonial { padding: 32px 24px; }
        .job-questions { padding: 20px; }
    }

    /* ── Open Positions Accordion ─────────────────────── */
    .careers-positions-section { background: var(--bg-secondary); }
    .positions-list {
        display: flex;
        flex-direction: column;
        gap: 18px;
        margin-top: 56px;
        max-width: 960px;
        margin-left: auto;
        margin-right: auto;
    }
    .position-card {
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-radius: 14px;
        overflow: hidden;
        transition: border-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    box-shadow 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .position-card:hover {
        border-color: rgba(197, 165, 114, 0.45);
        transform: translateY(-2px);
        box-shadow: 0 10px 30px rgba(0,0,0,0.25);
    }
    .position-card.is-open {
        border-color: var(--gold);
        box-shadow: 0 16px 48px rgba(0,0,0,0.35);
        transform: none;
    }
    .position-toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        padding: 28px 36px;
        background: transparent;
        border: none;
        text-align: left;
        cursor: pointer;
        color: inherit;
        font-family: inherit;
        transition: background 0.3s;
    }
    .position-toggle:hover { background: rgba(197, 165, 114, 0.04); }
    .position-toggle:focus { outline: none; }
    .position-toggle:focus-visible {
        outline: 2px solid var(--gold);
        outline-offset: -2px;
    }
    .position-toggle-main {
        display: flex;
        align-items: center;
        gap: 28px;
        flex: 1;
        min-width: 0;
    }
    .position-number {
        font-family: var(--font-display);
        font-size: 2rem;
        color: var(--gold);
        font-weight: 300;
        letter-spacing: 0.02em;
        line-height: 1;
        flex-shrink: 0;
        width: 44px;
        opacity: 0.85;
    }
    .position-heading {
        display: flex;
        flex-direction: column;
        gap: 6px;
        min-width: 0;
    }
    .position-title {
        font-family: var(--font-display);
        font-size: 1.5rem;
        color: var(--text-primary);
        font-weight: 400;
        line-height: 1.25;
    }
    .position-tagline {
        font-size: 14px;
        color: var(--text-secondary);
        line-height: 1.6;
    }
    .position-icon {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: rgba(197, 165, 114, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--gold);
        transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    background 0.3s,
                    color 0.3s;
    }
    .position-icon svg { width: 18px; height: 18px; }
    .position-card.is-open .position-icon {
        transform: rotate(180deg);
        background: var(--gold);
        color: #0a0a0a;
    }
    .position-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    .position-content-inner {
        padding: 0 36px 40px;
    }
    .position-intro {
        color: var(--text-secondary);
        font-size: 15px;
        line-height: 1.85;
        margin: 0 0 32px;
        padding: 28px 0 24px;
        border-top: 1px solid var(--border);
        border-bottom: 1px solid var(--border-subtle);
    }
    .position-blocks {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 36px;
        margin-bottom: 36px;
    }
    .position-block h4 {
        font-family: var(--font-display);
        font-size: 1.15rem;
        color: var(--gold);
        font-weight: 500;
        margin: 0 0 18px;
        letter-spacing: 0.02em;
        padding-bottom: 12px;
        border-bottom: 1px solid var(--border);
    }
    .position-block ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .position-block li {
        position: relative;
        padding-left: 20px;
        margin-bottom: 12px;
        color: var(--text-primary);
        font-size: 14px;
        line-height: 1.7;
    }
    .position-block li:last-child { margin-bottom: 0; }
    .position-block li::before {
        content: "";
        position: absolute;
        left: 2px;
        top: 9px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--gold);
        opacity: 0.85;
    }
    .position-cta {
        border-top: 1px solid var(--border-subtle);
        padding-top: 28px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
    }
    .position-cta p {
        color: var(--text-secondary);
        font-size: 14px;
        line-height: 1.7;
        margin: 0;
        flex: 1;
        min-width: 240px;
    }
    .position-cta p strong { color: var(--text-primary); font-weight: 500; }
    .position-cta p a {
        color: var(--gold);
        text-decoration: none;
        border-bottom: 1px solid rgba(197, 165, 114, 0.4);
        transition: border-color 0.3s, color 0.3s;
    }
    .position-cta p a:hover {
        color: var(--gold-light);
        border-bottom-color: var(--gold);
    }
    .position-apply-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 14px 26px;
        background: var(--gold);
        color: #0a0a0a;
        border: 1px solid var(--gold);
        border-radius: 8px;
        font-family: var(--font-body);
        font-size: 13px;
        font-weight: 600;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        flex-shrink: 0;
    }
    .position-apply-btn svg {
        width: 16px;
        height: 16px;
        transition: transform 0.3s;
    }
    .position-apply-btn:hover {
        background: var(--gold-light);
        border-color: var(--gold-light);
        transform: translateY(-1px);
        box-shadow: 0 10px 24px rgba(197,165,114,0.28);
    }
    .position-apply-btn:hover svg { transform: translateX(3px); }

    @media (max-width: 900px) {
        .position-blocks { grid-template-columns: 1fr; gap: 28px; }
        .position-toggle { padding: 24px 28px; }
        .position-content-inner { padding: 0 28px 32px; }
    }
    @media (max-width: 640px) {
        .positions-list { margin-top: 40px; gap: 14px; }
        .position-toggle { padding: 20px 20px; gap: 14px; }
        .position-toggle-main { gap: 16px; }
        .position-number { font-size: 1.4rem; width: 32px; }
        .position-title { font-size: 1.2rem; }
        .position-tagline { font-size: 13px; }
        .position-icon { width: 34px; height: 34px; }
        .position-icon svg { width: 16px; height: 16px; }
        .position-content-inner { padding: 0 20px 28px; }
        .position-intro { padding: 22px 0 20px; font-size: 14px; margin-bottom: 24px; }
        .position-block h4 { font-size: 1.05rem; margin-bottom: 14px; }
        .position-cta { flex-direction: column; align-items: stretch; padding-top: 22px; gap: 16px; }
        .position-cta p { min-width: 0; }
        .position-apply-btn { width: 100%; justify-content: center; }
    }

/* ── Contact Page ─────────────────────────────────── */
.contact-hero {
    position: relative;
    min-height: 55vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    background: transparent;
}
.contact-hero-bg {
    position: absolute;
    inset: 0;
    background-image: url('../img/bg-contact.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 1;
}
.contact-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0) 50%, rgba(10,10,10,0) 100%);
}
.contact-hero-content {
    position: relative;
    z-index: 2;
    max-width: 760px;
    padding: 120px 24px 80px;
}
.contact-hero-content h1 {
    font-family: var(--font-display);
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    color: var(--text-primary);
    margin-bottom: 20px;
    font-weight: 300;
    line-height: 1.2;
}
.contact-hero-content h1 span { color: var(--gold); }
.contact-hero-content p {
    color: var(--text-secondary);
    font-size: 1.05rem;
    line-height: 1.7;
}

.contact-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 40px;
}
.contact-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 36px 28px;
    text-align: center;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.contact-card:hover {
    border-color: var(--gold);
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.3);
}
.contact-icon {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: rgba(197, 165, 114, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    color: var(--gold);
}
.contact-icon svg { width: 26px; height: 26px; }
.contact-card-label {
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 600;
    margin-bottom: 10px;
}
.contact-card-value {
    font-family: var(--font-display);
    font-size: 1.35rem;
    color: var(--text-primary);
    font-weight: 500;
    line-height: 1.3;
    margin-bottom: 8px;
}
.contact-card-hint {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.6;
}

.contact-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: stretch;
}
.contact-info-col h2 {
    font-family: var(--font-display);
    font-size: 2rem;
    color: var(--text-primary);
    margin: 12px 0 16px;
    font-weight: 300;
}
.contact-info-col p {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 24px;
}
.contact-info-col p strong { color: var(--text-primary); }
.contact-features {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
}
.contact-features li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 8px 0;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.6;
}
.contact-check {
    color: var(--gold);
    font-size: 16px;
    flex-shrink: 0;
    margin-top: 2px;
}
.contact-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.contact-map {
    position: relative;
    min-height: 420px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    background: var(--bg-card);
}
.contact-map iframe { display: block; width: 100%; height: 100%; min-height: 420px; }

.contact-image-frame {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    line-height: 0;
}
.contact-image-frame img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .contact-grid { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; }
    .contact-layout { grid-template-columns: 1fr; }
    .contact-map { min-height: 320px; }
    .contact-map iframe { min-height: 320px; }
}
@media (max-width: 640px) {
    .contact-hero { min-height: 45vh; }
    .contact-hero-content { padding: 100px 20px 60px; }
}


/* ══════════════════════════════════════════════════════════
   Lista (lista.asp / properties listing) — theme integration
   Targets ORIGINAL ASP-emitted classes; ASP code is unchanged.
   ══════════════════════════════════════════════════════════ */

body.lista-body { background: var(--bg-primary); color: var(--text-primary); }

/* ── 1. Banner styled as theme page-header ──────────────── */
body.lista-body .banner {
    position: relative;
    min-height: 50vh;
    overflow: hidden;
    background: #0a0a0a;
    display: flex;
    align-items: center;
    justify-content: center;
}
body.lista-body .banner-item {
    position: absolute;
    inset: 0;
    z-index: 0;
    margin: 0;
    padding: 0;
}
body.lista-body .banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.5;
}
body.lista-body .banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,10,10,0.92) 0%, rgba(10,10,10,0.35) 55%, rgba(10,10,10,0.55) 100%);
    z-index: 1;
}
body.lista-body .text-banner {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 820px;
    padding: 110px 24px 0px;
}
body.lista-body .text-banner::before {
    content: "Portofoliu";
    display: block;
    font-size: 11px;
    letter-spacing: 0.25em;
    color: var(--gold);
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 16px;
}
body.lista-body .text-banner h1 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    color: #ffffff;
    font-weight: 300;
    line-height: 1.2;
    margin: 0 0 18px;
}
body.lista-body .text-banner p {
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* ── 2. Breadcrumbs centered ────────────────────────────── */
body.lista-body .breadcrumbs {
    padding: 16px 0;
    background: transparent;
    text-align: center;
}
body.lista-body .breadcrumbs .container-fluid,
body.lista-body .breadcrumbs .container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
body.lista-body .breadcrumb-item ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 13px;
}
body.lista-body .breadcrumb-item li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
body.lista-body .breadcrumb-item a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color 0.3s;
}
body.lista-body .breadcrumb-item a:hover { color: var(--gold); }
body.lista-body .breadcrumb-item span { color: var(--text-muted); }

/* ── 3. Content section ─────────────────────────────────── */
body.lista-body .content-lista {
    padding: 40px 0 80px;
    background: var(--bg-secondary);
}
body.lista-body .proprietati-recomandate .container-fluid {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ── 4. Filters bar — original .row containing title + form ── */
body.lista-body .proprietati-recomandate > .container-fluid > .row:first-of-type {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 28px 28px 24px;
    margin: 24px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: stretch;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}
body.lista-body .title-prop-recomandate {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0 0 20px;
    text-align: center;
}
body.lista-body .title-prop-recomandate h4 {
    font-family: var(--font-display);
    font-size: clamp(1.4rem, 2.5vw, 1.9rem);
    color: var(--text-primary);
    font-weight: 300;
    margin: 0 0 12px;
    letter-spacing: 0.02em;
    line-height: 1.25;
    text-transform: capitalize;
}
body.lista-body .title-prop-recomandate h4 br { display: none; }
body.lista-body .title-prop-recomandate h4 span {
    color: var(--gold);
    font-weight: 400;
}
body.lista-body .page-line-prop {
    width: 60px;
    height: 2px;
    background: var(--gold);
    margin: 0 auto;
}

body.lista-body .search-form {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    padding: 0;
    background: transparent;
    border: none;
}
body.lista-body .search-form .close-btn { display: none; }
body.lista-body .search-form h3 {
    font-family: var(--font-body);
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    margin: 0 0 14px;
    font-weight: 600;
}
body.lista-body .search-form > form > .row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px;
    align-items: flex-end;
}
body.lista-body .search-form .col-input,
body.lista-body .search-form .pret-section {
    flex: 1 1 160px;
    padding: 0;
    min-width: 0;
}
body.lista-body .search-form select,
body.lista-body .search-form input[type="text"] {
    width: 100%;
    padding: 10px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: var(--font-body);
    box-sizing: border-box;
    appearance: none;
}
body.lista-body .search-form select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239a948e' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
    cursor: pointer;
}
body.lista-body .search-form select:focus,
body.lista-body .search-form input[type="text"]:focus {
    outline: none;
    border-color: var(--gold);
}

/* Native select option styling — replaces the OS blue selection with theme colors */
body.lista-body .search-form select {
    accent-color: var(--gold);
}
body.lista-body .search-form select option {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    padding: 10px 14px;
}
/* Hover should NOT change colors (kill native blue overlay) */
body.lista-body .search-form select option:hover {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 10px 100px var(--bg-card) inset !important;
    -webkit-text-fill-color: var(--text-primary) !important;
}
/* Only the currently SELECTED option is highlighted gold */
body.lista-body .search-form select option:checked,
body.lista-body .search-form select option[selected] {
    background: var(--gold) !important;
    color: #0a0a0a !important;
    box-shadow: 0 0 10px 100px var(--gold) inset !important;
    -webkit-text-fill-color: #0a0a0a !important;
    font-weight: 600;
}
body.lista-body .search-form .pret-section label {
    display: block;
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 6px;
}
body.lista-body .search-form .pret-section .row {
    display: flex;
    gap: 6px;
    margin: 0;
}
body.lista-body .search-form .pret-section .minCol,
body.lista-body .search-form .pret-section .maxCol {
    flex: 1;
    padding: 0;
}
body.lista-body .input-group-id { width: 100%; }

/* Submit / save buttons */
body.lista-body .search-form > form > .row:last-of-type {
    display: flex;
    gap: 10px;
    margin: 8px 0 0;
}
body.lista-body .search-form .about-btn,
body.lista-body .search-form .about-btn22 {
    flex: 1 1 auto;
    text-align: center;
}
body.lista-body .about-btn input[type="submit"],
body.lista-body .about-btn22 input[type="button"] {
    width: 100%;
    padding: 12px 20px;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s;
    border: none;
}
body.lista-body .about-btn input[type="submit"] {
    background: var(--gold);
    color: #0a0a0a;
}
body.lista-body .about-btn input[type="submit"]:hover {
    background: var(--gold-light);
    transform: translateY(-1px);
}
body.lista-body .about-btn22 input[type="button"] {
    background: transparent;
    color: var(--gold);
    border: 1px solid var(--gold);
}
body.lista-body .about-btn22 input[type="button"]:hover {
    background: var(--gold);
    color: #0a0a0a;
}
body.lista-body .about-btn img { display: none; }
body.lista-body .col-sm-6.text-center.col-xs-6 {
    flex: 1 1 auto;
    width: auto;
    max-width: none;
    padding: 0;
}

/* ── Custom select boxes (zona, dormitor) — themed dropdowns ── */
body.lista-body .selectBox {
    position: relative;
    cursor: pointer;
}
body.lista-body .selectBox > select {
    pointer-events: none;
}

/* Hide the dropdown panels by default; show only when overSelect/parent has an open state */
body.lista-body .propCheckbox1,
body.lista-body .propDormitor {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 50;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text-primary);
    box-shadow: 0 16px 48px rgba(0,0,0,0.4);
    padding: 12px;
    min-width: 280px;
    max-width: 360px;
}
/* When the inline JS opens them, original code typically toggles inline style.display = "block".
   Make sure when display is set inline-block/block they stay visible. */
body.lista-body .propCheckbox1[style*="display: block"],
body.lista-body .propCheckbox1[style*="display:block"],
body.lista-body .propDormitor[style*="display: block"],
body.lista-body .propDormitor[style*="display:block"] {
    display: block !important;
}

/* Group header bars (Localitati Ilfov, Nord, Vest, etc.) — override inline styles */
body.lista-body .propCheckbox1 .zona-first > label[style*="background-color"],
body.lista-body .propCheckbox1 label[style*="dab186"] {
    background: rgba(197, 165, 114, 0.15) !important;
    color: var(--gold) !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    margin: 8px 0 6px !important;
    font-size: 11px !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    text-align: left !important;
    border: 1px solid rgba(197, 165, 114, 0.25);
}

/* Region toggle labels (Nord, Aviatiei, Baneasa, etc.) */
body.lista-body .propCheckbox1 label[for^="region"] {
    background: transparent !important;
    color: var(--text-primary) !important;
    padding: 8px 6px !important;
    border-top: 1px solid var(--border-subtle);
    margin: 4px 0 2px !important;
    font-size: 12.5px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    gap: 8px;
}
body.lista-body .propCheckbox1 label[for^="region"] strong {
    color: var(--gold);
    font-weight: 600;
}

/* Individual city/Ilfov checkboxes */
body.lista-body .propCheckbox1 label[for^="herastrau_nord"],
body.lista-body .propCheckbox1 label[for^="ilfov"] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px 6px 24px !important;
    color: var(--text-secondary);
    font-size: 13px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.2s, color 0.2s;
    margin: 1px 0;
}
body.lista-body .propCheckbox1 label[for^="herastrau_nord"]:hover,
body.lista-body .propCheckbox1 label[for^="ilfov"]:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
}

body.lista-body .propCheckbox1 input[type="checkbox"],
body.lista-body .propDormitor input[type="checkbox"] {
    accent-color: var(--gold);
    width: 14px;
    height: 14px;
    cursor: pointer;
    flex-shrink: 0;
}

/* Zona scroll area */
body.lista-body .zona-scroll-section {
    max-height: 280px !important;
    overflow-y: auto !important;
    height: auto !important;
    padding-right: 6px;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) var(--bg-elevated);
}
body.lista-body .zona-scroll-section::-webkit-scrollbar { width: 6px; }
body.lista-body .zona-scroll-section::-webkit-scrollbar-track { background: var(--bg-elevated); border-radius: 3px; }
body.lista-body .zona-scroll-section::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; }

body.lista-body .zona-first {
    margin: 0 0 6px;
}

/* "X Inchide" link */
body.lista-body .propCheckbox1 #clpop {
    color: var(--gold) !important;
    font-size: 11px !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 4px 8px;
    display: inline-block;
}
body.lista-body .propCheckbox1 #clpop:hover {
    color: var(--gold-light) !important;
}

/* Search-zone bottom bar */
body.lista-body .zona-third {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 12px 0 0;
    margin-top: 8px;
    border-top: 1px solid var(--border-subtle);
}
body.lista-body .zona-third input[type="text"] {
    flex: 1;
    background: var(--bg-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 13px;
    font-family: var(--font-body);
}
body.lista-body .zona-third input[type="text"]:focus {
    outline: none;
    border-color: var(--gold);
}
body.lista-body .zona-third input[type="submit"],
body.lista-body .zona-third input[type="button"],
body.lista-body .zona-third input[name="salveaza"] {
    background: var(--gold);
    color: #0a0a0a;
    border: none;
    border-radius: 6px;
    padding: 10px 18px;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.3s, transform 0.2s, box-shadow 0.3s;
    font-family: var(--font-body);
    white-space: nowrap;
    -webkit-appearance: none;
    appearance: none;
}
body.lista-body .zona-third input[type="submit"]:hover,
body.lista-body .zona-third input[type="button"]:hover,
body.lista-body .zona-third input[name="salveaza"]:hover {
    background: var(--gold-light);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(197, 165, 114, 0.3);
}
body.lista-body .zona-third input[type="submit"]:active,
body.lista-body .zona-third input[type="button"]:active,
body.lista-body .zona-third input[name="salveaza"]:active {
    transform: translateY(0);
    box-shadow: none;
}

/* Dormitor (camere) dropdown */
body.lista-body .propDormitor {
    padding: 8px;
    min-width: 180px;
}
body.lista-body .propDormitor label {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: var(--text-primary);
    font-size: 13px;
    cursor: pointer;
    border-radius: 6px;
    margin: 1px 0;
    transition: background 0.2s;
}
body.lista-body .propDormitor label:hover {
    background: var(--bg-elevated);
}

/* Hide overSelect (used for click outside handling, no visual) */
body.lista-body .overSelect { display: none; }

body.lista-body .prop-link.btn-lista-mobile { display: none; }

/* ── Search button stack improvements ──────────────── */
body.lista-body .search-form .pret-section.col-sm-3 {
    flex: 1 1 200px;
}
body.lista-body .search-form .input-group {
    width: 100%;
}
body.lista-body .search-form .input-group input.col-input22 {
    width: 100%;
    padding: 10px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-primary);
    font-size: 13px;
    box-sizing: border-box;
    font-family: var(--font-body);
}
body.lista-body .search-form .input-group input.col-input22:focus {
    outline: none;
    border-color: var(--gold);
}
body.lista-body .search-form .input-group-id input {
    width: 100%;
    padding: 10px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-primary);
    font-size: 13px;
    box-sizing: border-box;
    font-family: var(--font-body);
}
body.lista-body .search-form .input-group-id input:focus {
    outline: none;
    border-color: var(--gold);
}

/* ── 5. Toolbar (results count + view toggles) ──────────── */
body.lista-body .lista-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 24px 0 16px;
    padding: 12px 4px;
    flex-wrap: wrap;
    gap: 12px;
}
body.lista-body .lista-toolbar .results-count {
    font-size: 13px;
    color: var(--text-muted);
}
body.lista-body .lista-toolbar .results-count strong {
    color: var(--text-primary);
    font-weight: 600;
}
body.lista-body .lista-toolbar .view-toggles {
    display: flex;
    gap: 4px;
}
body.lista-body .lista-toolbar .view-toggle {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--text-muted);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
}
body.lista-body .lista-toolbar .view-toggle:hover {
    color: var(--gold);
    border-color: var(--gold);
}
body.lista-body .lista-toolbar .view-toggle.active {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}

/* ── 6. Properties grid (3 columns, ignores cnt mod 2 row-break) ── */
/* The container-fluid becomes a 3-col CSS grid; first .row (form) and the
   toolbar/pagination span full width; card .row elements become invisible
   (display:contents) so each .col-sm-6 card is a direct grid item. */
body.lista-body .proprietati-recomandate > .container-fluid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-content: start;
}
body.lista-body .proprietati-recomandate > .container-fluid > .row:first-of-type,
body.lista-body .proprietati-recomandate > .container-fluid > .lista-toolbar,
body.lista-body .proprietati-recomandate > .container-fluid > .pagination,
body.lista-body .proprietati-recomandate > .container-fluid > .prop-link {
    grid-column: 1 / -1;
    width: 100%;
    margin: 0;
}
body.lista-body .proprietati-recomandate > .container-fluid > .row.properties-grid,
body.lista-body .proprietati-recomandate > .container-fluid > .row.properties-grid ~ .row {
    display: contents;
}
body.lista-body .proprietati-recomandate > .container-fluid > .row.properties-grid > .col-sm-6,
body.lista-body .proprietati-recomandate > .container-fluid > .row.properties-grid ~ .row > .col-sm-6 {
    width: auto;
    max-width: none;
    flex: none;
    padding: 0;
    margin: 0;
}

/* Card itself — looks exactly like .property-card */
body.lista-body .col-prop-recomandate {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
    height: 100%;
    display: flex;
    flex-direction: column;
}
body.lista-body .col-prop-recomandate:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.35);
    border-color: var(--gold);
}
body.lista-body .col-prop-recomandate > a:first-of-type {
    display: block;
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
    margin: 0;
}
body.lista-body .col-prop-recomandate > a:first-of-type img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: block;
}
body.lista-body .col-prop-recomandate:hover > a:first-of-type img { transform: scale(1.05); }

/* Status badge (.rent) → property-badge */
body.lista-body .col-prop-recomandate .rent {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 6px 14px;
    background: rgba(10,10,10,0.78);
    backdrop-filter: blur(8px);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    border-radius: 100px;
    border: 1px solid rgba(197,165,114,0.3);
    z-index: 2;
    line-height: 1.2;
    max-width: calc(100% - 80px);
    white-space: normal;
}

/* Save heart — Font Awesome may not be loaded; use Unicode glyph fallback */
body.lista-body .col-prop-recomandate .btnSaveIcon {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(8px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    z-index: 3;
    transition: all 0.3s;
    text-decoration: none;
    font-size: 0;
    line-height: 1;
}
body.lista-body .col-prop-recomandate .btnSaveIcon::before {
    content: "\2661";
    font-family: "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    font-size: 18px;
    line-height: 1;
    color: inherit;
    display: block;
}
body.lista-body .col-prop-recomandate .btnSaveIcon i { display: none; }
body.lista-body .col-prop-recomandate .btnSaveIcon:hover {
    background: var(--gold);
    color: #0a0a0a;
}
body.lista-body .col-prop-recomandate .btnSaveIcon.saved::before,
body.lista-body .col-prop-recomandate .btnSaveIcon.active::before { content: "\2665"; }

/* Card body */
/* Card body — mimic theme order: price, title, location/specs */
body.lista-body .col-prop-recomandate .prop-info {
    padding: 22px 24px 26px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
body.lista-body .col-prop-recomandate .prop-price { margin: 0 0 4px; order: 1; }
body.lista-body .col-prop-recomandate .prop-price p {
    font-family: var(--font-display);
    font-size: 1.55rem;
    font-weight: 500;
    color: var(--gold);
    margin: 0;
    line-height: 1.2;
}
/* TVA styled exactly like theme: <small style="opacity:.6">(...)</small> */
body.lista-body .col-prop-recomandate .prop-price p .tva {
    font-size: 0.55em !important;
    font-weight: 400 !important;
    color: var(--text-secondary) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    display: inline !important;
    margin-left: 6px !important;
    opacity: 0.6 !important;
    vertical-align: baseline;
    line-height: 1;
}
body.lista-body .col-prop-recomandate .prop-price p br,
body.lista-body .col-prop-recomandate .prop-price br { display: none !important; }
body.lista-body .col-prop-recomandate .prop-price [itemprop="priceCurrency"] {
    font-family: var(--font-display);
    font-size: inherit;
    color: inherit;
    margin-left: 4px;
}

/* Themed card body — JS-rebuilt structure (.property-title / .property-location / .property-specs) */
body.lista-body .col-prop-recomandate .prop-info.property-card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px 24px 26px;
}
body.lista-body .col-prop-recomandate .property-price {
    font-family: var(--font-display);
    font-size: 1.55rem;
    font-weight: 500;
    color: var(--gold);
    line-height: 1.2;
    margin: 0;
}
body.lista-body .col-prop-recomandate .property-price small {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 400;
    color: var(--text-gold);
    margin-left: 6px;
    letter-spacing: 0;
    text-transform: none;
    vertical-align: baseline;
}
body.lista-body .col-prop-recomandate .property-title {
    font-family: var(--font-display);
    font-size: 1.2rem;
    color: var(--text-primary);
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
body.lista-body .col-prop-recomandate .property-title .property-title-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: color .2s ease;
}
body.lista-body .col-prop-recomandate .property-title .property-title-link:hover,
body.lista-body .col-prop-recomandate .property-title .property-title-link:focus {
    color: var(--gold);
    text-decoration: none;
}
body.lista-body .col-prop-recomandate .property-location {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.5;
    margin: 0;
}
body.lista-body .col-prop-recomandate .property-location::first-letter {
    color: var(--gold);
    font-size: 0.85em;
    margin-right: 4px;
}
body.lista-body .col-prop-recomandate .property-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    padding-top: 16px;
    margin-top: auto;
    border-top: 1px solid var(--border-subtle);
}
body.lista-body .col-prop-recomandate .property-spec {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.4;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
}
body.lista-body .col-prop-recomandate .property-spec strong {
    color: var(--text-primary);
    font-weight: 600;
    font-size: 14px;
}

/* Hide raw .prop-description / [itemprop=name] only AFTER the card is themed (rebuild replaces innerHTML).
   Keep them rendered (but visually-hidden via clip) before transform so JS can still read textContent and
   the parsed-and-rebuilt theme card body shows the data. */
body.lista-body .col-prop-recomandate .prop-info:not(.property-card-body) .prop-description,
body.lista-body .col-prop-recomandate .prop-info:not(.property-card-body) [itemprop="name"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

/* (Legacy stylings kept for cards that didn't get JS-transformed) */
body.lista-body .col-prop-recomandate .prop-info:not(.property-card-body) {
    padding: 22px 24px 26px;
}
body.lista-body .col-prop-recomandate .prop-info:not(.property-card-body) .prop-price p {
    font-family: var(--font-display);
    font-size: 1.55rem;
    font-weight: 500;
    color: var(--gold);
    margin: 0;
    line-height: 1.2;
}
body.lista-body .col-prop-recomandate .prop-info:not(.property-card-body) .prop-price br { display: none; }

/* (placeholder selectors below remain unused — left for safety) */
body.lista-body .col-prop-recomandate .__unused__ {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
}

/* ── 7. List view (toggled) ─────────────────────────────── */
body.lista-body .proprietati-recomandate.view-list > .container-fluid {
    grid-template-columns: 1fr;
}
body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate {
    display: grid;
    grid-template-columns: 360px 1fr;
}
body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate > a:first-of-type {
    aspect-ratio: auto;
    height: 100%;
    min-height: 240px;
}
body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .prop-info {
    padding: 28px 32px;
    justify-content: center;
}
@media (max-width: 768px) {
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate {
        grid-template-columns: 110px minmax(0, 1fr);
        overflow: hidden;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate > a:first-of-type {
        /* aspect-ratio: 1 / 1; */
        min-height: 0;
        height: 100%;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .prop-info {
        padding: 12px 14px;
        min-width: 0;
        overflow: hidden;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-title {
        font-size: 0.85rem;
        line-height: 1.3;
        word-break: break-word;
        overflow-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-price {
        font-size: 0.9rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-price-tva {
        display: none;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-location {
        font-size: 11px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-specs {
        gap: 8px;
        flex-wrap: wrap;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .property-spec {
        font-size: 10px;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .rent {
        font-size: 8px;
        padding: 3px 7px;
        top: 6px;
        left: 6px;
        letter-spacing: 0.1em;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .btnSaveIcon {
        width: 26px;
        height: 26px;
        top: 6px;
        right: 6px;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .btnSaveIcon::before {
        font-size: 14px;
    }
}

@media (max-width: 420px) {
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate {
        grid-template-columns: 90px minmax(0, 1fr);
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .prop-info {
        padding: 10px 12px;
    }
    body.lista-body .proprietati-recomandate.view-list .col-prop-recomandate .rent {
        display: none;
    }
}

/* ── 8. Pagination ──────────────────────────────────────── */
body.lista-body .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 48px 0 24px;
}
body.lista-body .pagination ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
    margin: 0;
}
body.lista-body .pagination li a,
body.lista-body .pagination li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border-radius: 8px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s;
}
body.lista-body .pagination li a:hover {
    border-color: var(--gold);
    color: var(--gold);
}
body.lista-body .pagination li span,
body.lista-body .pagination li a.active {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
    font-weight: 700;
}
body.lista-body .pagination li img { width: 14px; height: auto; opacity: 0.85; filter: invert(0.85); }
body.lista-body .pagination li a:hover img { filter: none; opacity: 1; }
body.lista-body .page-line-left,
body.lista-body .page-line-right { display: none; }

/* Empty results */
body.lista-body h3.col-xs-12.text-center {
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 20px;
    color: var(--text-secondary);
    font-family: var(--font-display);
    font-size: 1.4rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-card);
    margin: 24px 0;
    width: 100%;
}

/* ── 9. Responsive ──────────────────────────────────────── */
@media (max-width: 1024px) {
    body.lista-body .text-banner h1 { font-size: 2rem; }
    body.lista-body .search-form .col-input,
    body.lista-body .search-form .pret-section { flex: 1 1 calc(50% - 5px); }
    body.lista-body .proprietati-recomandate > .container-fluid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 640px) {
    body.lista-body .banner { min-height: 40vh; }
    body.lista-body .text-banner { padding: 90px 20px 50px; }
    body.lista-body .proprietati-recomandate > .container-fluid {
        grid-template-columns: 1fr;
    }
    body.lista-body .search-form .col-input,
    body.lista-body .search-form .pret-section { flex: 1 1 100%; }
    body.lista-body .col-prop-recomandate > a:first-of-type { aspect-ratio: 16/11; }
}

/* ── Zona dropdown — mobile fix ─────────────────────────────────────────────
   Pe mobil dropdown-ul devine un modal fixed centrat în viewport.
   Rezolvă: scroll invizibil (browser-ele mobile ascund scrollbar-ul nativ),
   touch-scroll rigid pe iOS (lipsă -webkit-overflow-scrolling), și panel
   trunchiat de margine viewport când form-ul este stivuit vertical.
   ──────────────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Overlay de fundal — apare când dropdown-ul este deschis */
    body.lista-body .zona-modal-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.55);
        z-index: 49;
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
    }
    body.lista-body .zona-modal-overlay.active {
        display: block;
    }

    /* Panel devine modal centrat. bottom: 90px lasa loc pentru butonul AI chat
       (care e fixed la bottom: 24px + ~56px inaltime = 80px ocupati). */
    body.lista-body .propCheckbox1 {
        position: fixed !important;
        top: 5vh !important;
        bottom: 90px !important;
        left: 16px !important;
        right: 16px !important;
        height: auto !important;
        max-width: 400px !important;
        margin: 0 auto !important;
        width: auto !important;
        transform: none !important;
        overflow-y: scroll !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: pan-y !important;
        z-index: 9999 !important;
    }

    /* Lista de zone — fara scroll propriu, panel-ul intreg scrolleaza.
       Padding mic intre ultima zona si search bar sticky. */
    body.lista-body .zona-scroll-section-wrap {
        position: relative;
        padding-bottom: 16px;
    }
    body.lista-body .zona-scroll-section {
        max-height: none !important;
        overflow: visible !important;
    }

    /* Search bar lipit la baza panel-ului (sticky in interiorul panel-ului) */
    body.lista-body .propCheckbox1 .zona-third {
        position: sticky !important;
        bottom: 0 !important;
        background: var(--bg-card, #141414) !important;
        padding-top: 12px !important;
        padding-bottom: 8px !important;
        margin-top: 8px !important;
        z-index: 2 !important;
        border-top: 1px solid var(--border-subtle, #2a2a2a) !important;
    }
    /* body.lista-body .zona-scroll-section-wrap::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 32px;
        background: linear-gradient(to bottom, transparent, var(--bg-card));
        pointer-events: none;
        border-radius: 0 0 6px 6px;
    } */
}

@media (max-width: 768px) {
    /* Cand panel-ul e deschis: body trebuie sa nu se mai poata scrolla.
       `touch-action: none` IZOLEAZA panel-ul de body pe iOS real — fara
       el, body si panel-ul concureaza pentru gesture si pe iPhone real
       body castiga (panel-ul nu mai capteaza touch-ul). Panel-ul are
       propriul touch-action: pan-y care permite scroll-ul intern. */
    body.lista-body:has(.propCheckbox1[style*="display: block"]),
    body.lista-body:has(.propCheckbox1[style*="display:block"]) {
        overflow: hidden !important;
        touch-action: none !important;
    }
}


/* ── Custom Select dropdown (replaces native select for full theme control) ── */
body.lista-body .custom-select {
    position: relative;
    width: 100%;
    user-select: none;
}
body.lista-body .custom-select-toggle {
    width: 100%;
    text-align: left;
    padding: 10px 36px 10px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: var(--font-body);
    cursor: pointer;
    box-sizing: border-box;
    line-height: 1.4;
    transition: border-color 0.2s, background 0.2s;
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239a948e' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}
body.lista-body .custom-select-toggle:hover,
body.lista-body .custom-select-toggle:focus {
    border-color: var(--gold);
    outline: none;
}
body.lista-body .custom-select.open .custom-select-toggle {
    border-color: var(--gold);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23c5a572' d='M6 4l5 5H1z'/%3E%3C/svg%3E");
}
body.lista-body .custom-select-options {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 60;
    list-style: none;
    margin: 0;
    padding: 6px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.4);
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) var(--bg-elevated);
}
body.lista-body .custom-select-options::-webkit-scrollbar { width: 6px; }
body.lista-body .custom-select-options::-webkit-scrollbar-track { background: var(--bg-elevated); }
body.lista-body .custom-select-options::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; }
body.lista-body .custom-select.open .custom-select-options {
    display: block;
}
body.lista-body .custom-select-option {
    padding: 9px 14px;
    color: var(--text-secondary);
    font-size: 13px;
    cursor: pointer;
    border-radius: 6px;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s;
}
body.lista-body .custom-select-option:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
}
body.lista-body .custom-select-option.active {
    background: var(--gold);
    color: #0a0a0a;
    font-weight: 600;
}
body.lista-body .custom-select-option.active:hover {
    background: var(--gold-light);
    color: #0a0a0a;
}


/* ══════════════════════════════════════════════════════════
   Property Detail (detaliioferta.asp) — theme integration
   Targets the original ASP-emitted classes; ASP code unchanged.
   ══════════════════════════════════════════════════════════ */

body:has(.detalii-prop-section) {
    background: var(--bg-primary);
    color: var(--text-primary);
}
body:has(.detalii-prop-section) > section.content {
    background: var(--bg-primary);
    padding-bottom: 80px;
}

/* ── Hero gallery: main slider + side thumbs ────────────── */
body:has(.detalii-prop-section) .property-images-sections {
    position: relative;
    max-width: 1280px;
    margin: 24px auto 32px;
    padding: 0 24px;
}
body:has(.detalii-prop-section) .property-slider-detalii {
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-card);
    aspect-ratio: 16/9;
    max-height: 600px;
}
body:has(.detalii-prop-section) .property-slider-detalii .propert-detalii-item {
    aspect-ratio: 16/9;
    max-height: 600px;
}
body:has(.detalii-prop-section) .property-slider-detalii .propert-detalii-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}
body:has(.detalii-prop-section) .banner-sign-plus {
    position: absolute;
    bottom: 24px;
    right: 40px;
    z-index: 10;
    width: 56px;
    height: 56px;
    background: rgba(10, 10, 10, 0.78);
    backdrop-filter: blur(8px);
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: var(--gold);
    font-size: 22px;
    font-weight: 300;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}
body:has(.detalii-prop-section) .banner-sign-plus:hover {
    background: var(--gold);
    color: #0a0a0a;
}

/* Slick arrows + dots themed */
body:has(.detalii-prop-section) .property-slider-detalii .slick-prev,
body:has(.detalii-prop-section) .property-slider-detalii .slick-next {
    width: 44px;
    height: 44px;
    background: rgba(10,10,10,0.6);
    backdrop-filter: blur(8px);
    border-radius: 50%;
    z-index: 5;
}
body:has(.detalii-prop-section) .property-slider-detalii .slick-prev { left: 24px; }
body:has(.detalii-prop-section) .property-slider-detalii .slick-next { right: 24px; }
body:has(.detalii-prop-section) .property-slider-detalii .slick-prev:before,
body:has(.detalii-prop-section) .property-slider-detalii .slick-next:before {
    color: var(--gold);
    font-size: 22px;
}
body:has(.detalii-prop-section) .property-slider-detalii .slick-dots li button:before {
    color: var(--gold);
}

/* Gallery grid below (lightbox thumbs) */
body:has(.detalii-prop-section) .gallery-image {
    max-width: 1280px;
    margin: 0 auto 40px;
    padding: 0 24px;
}
body:has(.detalii-prop-section) .gallery-image .container-fluid { max-width: 100%; padding: 0; }
body:has(.detalii-prop-section) .gallery-image .row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0;
}
body:has(.detalii-prop-section) .gallery-image .gallery-item {
    width: 100%;
    max-width: none;
    flex: none;
    padding: 0;
}
body:has(.detalii-prop-section) .gallery-image .gallery-item a {
    display: block;
    border-radius: 8px;
    overflow: hidden;
    aspect-ratio: 4/3;
}
body:has(.detalii-prop-section) .gallery-image .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s;
}
body:has(.detalii-prop-section) .gallery-image .gallery-item:hover img {
    transform: scale(1.05);
}
body:has(.detalii-prop-section) .gallery-image .close-btn {
    display: none;
}

/* ── Main detail layout: left content + right sidebar ──── */
body:has(.detalii-prop-section) .detalii-prop-section {
    background: var(--bg-primary);
}
body:has(.detalii-prop-section) .detalii-prop-section > .container-fluid {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}
body:has(.detalii-prop-section) .detalii-prop-section > .container-fluid > .row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    margin: 0;
}
body:has(.detalii-prop-section) .detalii-prop-left,
body:has(.detalii-prop-section) .detalii-prop-right {
    width: 100%;
    max-width: none;
    flex: none;
    padding: 0;
}

/* ── Title section override — kill inline brown styles ── */
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs {
    background: transparent;
    padding: 0;
    max-width: none;
    margin: 0 0 24px;
}
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row {
    display: block;
    margin: 0;
}
body:has(.detalii-prop-section) .detalii-prop-left h1[style] {
    color: var(--text-primary) !important;
    font-family: var(--font-display) !important;
    font-size: clamp(1.6rem, 3.2vw, 2.4rem) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    line-height: 1.25 !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
    letter-spacing: 0.01em !important;
}
body:has(.detalii-prop-section) .detalii-prop-left .icons-detalii {
    color: var(--text-muted) !important;
    font-size: 12px !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 600;
    margin: 0 !important;
    line-height: 1 !important;
}
body:has(.detalii-prop-section) .detalii-prop-left .icons-detalii .text_primary {
    color: var(--gold);
    margin-left: 4px;
}

/* Price line */
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row:nth-of-type(2) {
    margin: 12px 0 0;
    padding: 16px 0 24px;
    border-bottom: 1px solid var(--border-subtle);
}
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row:nth-of-type(2) > .col-sm-4 {
    color: var(--gold) !important;
    font-family: var(--font-display);
    font-size: 1.8rem !important;
    font-weight: 500;
    line-height: 1.2;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
}
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row:nth-of-type(2) > .col-sm-4 .tva {
    font-size: 0.45em;
    color: var(--text-muted);
    margin-left: 8px;
    font-weight: 400;
    letter-spacing: 0;
}
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row:nth-of-type(2) > .col-sm-8 {
    color: var(--text-secondary) !important;
    font-size: 14px !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    text-align: right !important;
}
body:has(.detalii-prop-section) .detalii-prop-left .container.hidden-xs > .row:nth-of-type(2) > .col-sm-8 p {
    color: var(--text-secondary) !important;
    margin: 0;
    line-height: 1.6;
}

/* Reset Bootstrap col-sm widths inside left column */
body:has(.detalii-prop-section) .detalii-prop-left > .row {
    margin: 24px 0 0;
}
body:has(.detalii-prop-section) .detalii-prop-left > .row > div {
    padding: 0;
    width: 100%;
    max-width: none;
    flex: none;
}

/* Description text */
body:has(.detalii-prop-section) .detalii-prop-left > .row > .col-sm-12 > p {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.85;
    margin: 0 0 32px;
}

/* Specs list */
body:has(.detalii-prop-section) .detaliiList {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px 24px;
    margin: 0 0 32px;
}
body:has(.detalii-prop-section) .detaliiList ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 24px;
    list-style: none;
    padding: 0 !important;
    margin: 0;
}
body:has(.detalii-prop-section) .detaliiList ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-muted);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 500;
}
body:has(.detalii-prop-section) .detaliiList ul li span {
    color: var(--text-primary);
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    font-size: 14px;
}

/* Map */
body:has(.detalii-prop-section) .map-agent {
    margin-top: 32px;
}
body:has(.detalii-prop-section) #contact-map {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
}

/* Share container (mobile) */
body:has(.detalii-prop-section) .share-container .channel {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--bg-card);
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    margin: 0 auto 6px;
    transition: all 0.3s;
}
body:has(.detalii-prop-section) .share-container .copy-link:hover .channel {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}
body:has(.detalii-prop-section) .share-container .copy-link {
    color: var(--text-muted);
    font-size: 11px;
    letter-spacing: 0.05em;
    text-decoration: none;
    text-align: center;
    display: block;
    text-transform: uppercase;
}

/* ── Right sidebar (.detalii-prop-right) ──────────────── */
body:has(.detalii-prop-section) .detalii-prop-right {
    position: sticky;
    top: 90px;
    align-self: start;
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-link.prop-detalii-btn {
    margin: 0 0 16px;
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-link.prop-detalii-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 20px;
    background: var(--gold);
    color: #0a0a0a !important;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s;
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-link.prop-detalii-btn a:hover {
    background: var(--gold-light);
    transform: translateY(-1px);
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-link.prop-detalii-btn img {
    width: 14px;
    height: auto;
    filter: brightness(0);
}

body:has(.detalii-prop-section) .prop-detalii-agent {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 16px;
}
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info h4 {
    font-family: var(--font-display);
    font-size: 1.15rem;
    color: var(--text-primary);
    font-weight: 500;
    margin: 0 0 6px;
}
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info-email,
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info-phone {
    display: block;
    font-size: 13px;
    color: var(--text-secondary);
    text-decoration: none;
    margin: 4px 0;
    transition: color 0.2s;
}
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info-phone {
    color: var(--gold);
    font-weight: 600;
}
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info-email:hover,
body:has(.detalii-prop-section) .prop-detalii-agent .agent-info-phone:hover {
    color: var(--gold-light);
}
body:has(.detalii-prop-section) .prop-detalii-agent img {
    border-radius: 12px;
    width: 100%;
    height: auto;
    display: block;
}

/* Contact form in sidebar */
body:has(.detalii-prop-section) .contact-form {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 16px;
}
body:has(.detalii-prop-section) .contact-form h4 {
    font-family: var(--font-display);
    font-size: 1.1rem;
    color: var(--text-primary);
    font-weight: 500;
    margin: 0 0 16px;
}
body:has(.detalii-prop-section) .contact-form input[type="text"],
body:has(.detalii-prop-section) .contact-form input[type="email"],
body:has(.detalii-prop-section) .contact-form input[type="tel"],
body:has(.detalii-prop-section) .contact-form textarea {
    width: 100%;
    padding: 11px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: var(--font-body);
    margin-bottom: 10px;
    box-sizing: border-box;
}
body:has(.detalii-prop-section) .contact-form input:focus,
body:has(.detalii-prop-section) .contact-form textarea:focus {
    outline: none;
    border-color: var(--gold);
}
body:has(.detalii-prop-section) .contact-form textarea {
    resize: vertical;
    min-height: 100px;
}
body:has(.detalii-prop-section) .contact-form .checkbox {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.5;
}
body:has(.detalii-prop-section) .contact-form .checkbox a {
    color: var(--gold);
}
body:has(.detalii-prop-section) .contact-form button[type="submit"],
body:has(.detalii-prop-section) .contact-form .btn-submit-prop {
    width: 100%;
    padding: 12px 18px;
    background: var(--gold);
    color: #0a0a0a;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    margin-top: 8px;
    transition: all 0.3s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
body:has(.detalii-prop-section) .contact-form button[type="submit"]:hover {
    background: var(--gold-light);
    transform: translateY(-1px);
}
body:has(.detalii-prop-section) .contact-form button img {
    filter: brightness(0);
    width: 14px;
    height: auto;
}

/* Sidebar prop-info card (similar properties) */
body:has(.detalii-prop-section) .detalii-prop-right .prop-info {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-info .prop-price {
    font-family: var(--font-display);
    color: var(--gold);
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 8px;
}
body:has(.detalii-prop-section) .detalii-prop-right .prop-info .prop-price .tva {
    font-size: 0.55em;
    color: var(--text-muted);
    opacity: 0.7;
    font-weight: 400;
    letter-spacing: 0;
    margin-left: 4px;
}

/* Mobile property-title (shown on small screens) */
body:has(.detalii-prop-section) .property-title.visible-xs {
    max-width: 1280px;
    margin: 0 auto 16px;
    padding: 0 24px;
}
body:has(.detalii-prop-section) .property-title.visible-xs h1 {
    font-family: var(--font-display);
    font-size: 1.6rem;
    color: var(--text-primary);
    font-weight: 400;
    margin: 8px 0;
}
body:has(.detalii-prop-section) .property-title.visible-xs p span[style] {
    color: var(--gold) !important;
    font-family: var(--font-display);
}

/* Breadcrumbs */
body:has(.detalii-prop-section) .breadcrumbs.detalii-oferta-icons {
    max-width: 1280px;
    margin: 16px auto;
    padding: 0 24px;
    background: transparent;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1024px) {
    body:has(.detalii-prop-section) .detalii-prop-section > .container-fluid > .row {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    body:has(.detalii-prop-section) .detalii-prop-right {
        position: static;
    }
}
@media (max-width: 768px) {
    body:has(.detalii-prop-section) .detaliiList ul {
        grid-template-columns: 1fr;
    }
    body:has(.detalii-prop-section) .gallery-image .row {
        grid-template-columns: repeat(2, 1fr);
    }
    body:has(.detalii-prop-section) .property-slider-detalii {
        aspect-ratio: 4/3;
    }
}

/* ========================================================================
   THEMED DETAIL PAGE (detaliioferta.asp)
   The new theme hero block is inserted at the top of <body>, and the legacy
   slider + .detalii-prop-section block is hidden — only the .oferte-similare
   section, footer, and ASP form-handler block remain visible from the legacy
   markup. The contact form lives in the new themed wrap.
   ======================================================================== */
/* Legacy duplicate markup removed from detaliioferta.asp — no display:none rule needed anymore. */

/* System message modal (used by adaugaPortofoliu2 / Alerta de pret) — same look as confirmare3 */
#sysmsg-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: var(--overlay, rgba(0,0,0,.6));
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: cmFade .25s ease-out;
}
#sysmsg-modal.cm-show { display: flex; }
#sysmsg-modal .cm-dialog {
    background: var(--bg-card, #1a1a1a);
    color: var(--text-primary, #f5f0eb);
    max-width: 560px;
    width: 100%;
    border: 1px solid var(--border, rgba(197,165,114,0.25));
    border-radius: var(--radius-lg, 8px);
    box-shadow: var(--shadow-lg, 0 20px 60px rgba(0,0,0,.5));
    overflow: hidden;
    font-family: var(--font-body, 'Inter', sans-serif);
    position: relative;
    animation: cmRise .35s cubic-bezier(0.4,0,0.2,1);
}
#sysmsg-modal .cm-dialog::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--gradient-gold, linear-gradient(135deg,#c5a572,#d4b88a));
}
#sysmsg-modal .cm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 28px 16px;
    border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
}
#sysmsg-modal .cm-title {
    margin: 0;
    font-family: var(--font-display, 'Cormorant Garamond', serif);
    font-weight: 500;
    font-size: 26px;
    letter-spacing: .5px;
    color: var(--gold, #c5a572);
}
#sysmsg-modal .cm-close {
    background: transparent;
    border: 1px solid var(--border, rgba(197,165,114,0.25));
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: var(--text-secondary, #a09890);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
    padding: 0;
}
#sysmsg-modal .cm-close:hover {
    color: var(--bg-primary, #0a0a0a);
    background: var(--gold, #c5a572);
    border-color: var(--gold, #c5a572);
    transform: rotate(90deg);
}
#sysmsg-modal .cm-body {
    padding: 24px 28px 30px;
    color: var(--text-primary, #f5f0eb);
    font-size: 15px;
    line-height: 1.7;
}
#sysmsg-modal .cm-body a {
    color: var(--gold, #c5a572);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid var(--gold, #c5a572);
    padding-bottom: 1px;
    transition: color .25s ease, border-color .25s ease;
}
#sysmsg-modal .cm-body a:hover {
    color: var(--gold-light, #d4b88a);
    border-color: var(--gold-light, #d4b88a);
}
@media (max-width: 560px) {
    #sysmsg-modal .cm-header { padding: 18px 20px 14px; }
    #sysmsg-modal .cm-body { padding: 20px 20px 24px; }
    #sysmsg-modal .cm-title { font-size: 22px; }
}

body.theme-detail-body .theme-detail-wrap {
    padding-top: 80px; /* space below fixed nav */
    background: var(--bg-primary);
}

/* Detail gallery: full-bleed to match the theme look */
body.theme-detail-body .theme-detail-wrap .detail-gallery {
    margin-top: 0;
    width: 100%;
    max-width: none;
    padding: 0;
}

/* Container max width inside themed wrap */
body.theme-detail-body .theme-detail-wrap .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Specs grid: auto-fit to property's actual spec count (no empty columns) */
body.theme-detail-body .theme-detail-wrap .detail-specs-grid {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    max-width: 600px;
}

/* Section spacing inside main column */
body.theme-detail-body .theme-detail-wrap .detail-description h3,
body.theme-detail-body .theme-detail-wrap .detail-features h3 {
    font-family: var(--font-display);
    font-size: 1.5rem;
    color: var(--text-primary);
    font-weight: 400;
    margin-bottom: 16px;
}

/* Tur Virtual button overlay on gallery main image */
body.theme-detail-body .theme-tour-btn {
    position: absolute;
    bottom: 16px;
    left: 16px;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: rgba(0,0,0,.7);
    backdrop-filter: blur(8px);
    border: 1px solid var(--gold);
    border-radius: 100px;
    color: var(--gold);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s;
}
body.theme-detail-body .theme-tour-btn:hover {
    background: var(--gold);
    color: #000;
}
body.theme-detail-body .theme-tour-btn svg { flex-shrink: 0; }

/* ================================================================
   Detail page utility classes (extracted from inline styles)
   ================================================================ */
body.theme-detail-body .detail-gallery-main { position: relative; }
body.theme-detail-body .detail-gallery-side-thumb { position: relative; }
body.theme-detail-body .gallery-count { cursor: pointer; }
body.theme-detail-body .detail-features-title { margin-bottom: 20px; }

/* Caracteristici — labels in .feature-item */
body.theme-detail-body .feature-item .feature-label {
    color: var(--text-muted);
    margin-right: 4px;
    font-weight: 500;
}

/* Media frames (Video / Tur Virtual) */
body.theme-detail-body .detail-media-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-secondary);
    border: 1px solid var(--border-subtle);
}
body.theme-detail-body .detail-media-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Despre Proprietate — collapsible content with toggle */
body.theme-detail-body .detail-description-collapsible { position: relative; }
body.theme-detail-body .detail-description-content {
    overflow: hidden;
    transition: max-height .35s ease;
    max-height: 6000px;
}
body.theme-detail-body .detail-description-content.collapsed {
    max-height: 220px;
    position: relative;
}
body.theme-detail-body .detail-description-content.collapsed::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 80px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(8,8,10,0) 0%, var(--bg-primary, #08080a) 100%);
}
body.theme-detail-body .detail-toggle-btn {
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: transparent;
    border: 1px solid var(--border-subtle);
    border-radius: 100px;
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .25s ease;
}
body.theme-detail-body .detail-toggle-btn:hover {
    border-color: var(--gold);
    color: var(--gold);
}
body.theme-detail-body .detail-toggle-btn svg {
    transition: transform .3s ease;
}
body.theme-detail-body .detail-toggle-btn.expanded svg {
    transform: rotate(180deg);
}
body.theme-detail-body .detail-map-canvas {
    width: 100%;
    height: 380px;
    border-radius: 12px;
    overflow: hidden;
}
body.theme-detail-body .sidebar-price-period {
    font-size: .55em;
    color: var(--text-muted);
}
body.theme-detail-body .sidebar-agent-link {
    text-decoration: none;
    color: inherit;
}
body.theme-detail-body .btn-whatsapp {
    border-color: #25D366;
    color: #25D366;
}

/* Calculator card */
body.theme-detail-body .calculator-title {
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 16px;
}
body.theme-detail-body .calculator-fields {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
body.theme-detail-body .calculator-slider { display: flex; flex-direction: column; gap: 6px; }
body.theme-detail-body .calculator-slider-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 12px;
    color: var(--text-muted);
}
body.theme-detail-body .calculator-slider-head strong,
body.theme-detail-body .calculator-slider-head span:last-child {
    color: var(--text-primary);
    font-weight: 600;
}
body.theme-detail-body .calculator-slider-head .calc-amount {
    color: var(--text-muted);
    font-weight: 400;
    margin-left: 4px;
}
body.theme-detail-body .calculator-slider input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    background: var(--bg-elevated);
    border-radius: 100px;
    outline: none;
    cursor: pointer;
    padding: 0;
    border: 0;
}
body.theme-detail-body .calculator-slider input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    background: var(--gold);
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid var(--bg-secondary, #14141a);
    box-shadow: 0 0 0 1px var(--gold);
}
body.theme-detail-body .calculator-slider input[type="range"]::-moz-range-thumb {
    width: 16px;
    height: 16px;
    background: var(--gold);
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid var(--bg-secondary, #14141a);
    box-shadow: 0 0 0 1px var(--gold);
}
body.theme-detail-body .calculator-slider-range {
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
    font-size: 10px;
    color: var(--text-muted);
    letter-spacing: .04em;
}
body.theme-detail-body .calculator-summary {
    margin-top: 4px;
    padding: 12px 14px;
    background: var(--bg-elevated);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
body.theme-detail-body .calculator-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 12px;
    color: var(--text-muted);
}
body.theme-detail-body .calculator-summary-row strong {
    color: var(--text-primary);
    font-weight: 600;
}
body.theme-detail-body .calculator-result {
    text-align: center;
    padding: 16px;
    background: var(--bg-elevated);
    border-radius: var(--radius-lg);
}
body.theme-detail-body .calculator-result-label {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 4px;
}
body.theme-detail-body .calculator-result-value {
    font-family: var(--font-display);
    font-size: 1.8rem;
    color: var(--gold);
}

/* Leaflet popup + share container (moved from inline <style>) */
.leaflet-popup-content,
.map-popup-content { height: auto; }
@media (max-width: 767.98px) {
    .share-container .copy-link .channel { box-shadow: 0 0 2px 0 rgb(0 0 0 / 60%); }
    .share-container .channel {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 10px;
        position: relative;
        width: 45px;
        height: 45px;
        text-align: center;
        color: #fff;
        border: 0;
        border-radius: 8px;
    }
    .share-container a {
        color: #000;
        display: block;
        font-size: 11px;
        font-weight: 400;
        line-height: 10px;
        letter-spacing: 0;
        margin: 0 5px;
        text-align: center;
    }
    .share-container .btnSaveIcon { background: #ffffff !important; }
    .share-container i { color: gray !important; font-size: 28px !important; }
}

/* ================================================================
   Themed breadcrumbs + action icons (above the gallery)
   ================================================================ */
body.theme-detail-body .theme-detail-breadcrumbs {
    padding: 10px 0 10px;
    margin: 0 0 18px;
    border-bottom: 1px solid var(--border-subtle);
}
body.theme-detail-body .theme-detail-breadcrumbs .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}
body.theme-detail-body .theme-bc-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
body.theme-detail-body .theme-bc-trail {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 13px;
    color: var(--text-muted);
    letter-spacing: .02em;
}
body.theme-detail-body .theme-bc-trail li { display: inline-flex; align-items: center; }
body.theme-detail-body .theme-bc-trail li + li::before {
    content: "/";
    margin: 0 10px;
    color: var(--text-muted);
    opacity: .55;
}
body.theme-detail-body .theme-bc-trail a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color .25s ease;
}
body.theme-detail-body .theme-bc-trail a:hover { color: var(--gold); }
body.theme-detail-body .theme-bc-trail li.active span { color: var(--text-primary); }
body.theme-detail-body .theme-bc-actions { display: flex; gap: 8px; }
body.theme-detail-body .theme-bc-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    color: #ffffff;
    background: transparent;
    text-decoration: none;
    transition: all .25s ease;
}
body.theme-detail-body .theme-bc-icon i { color: #ffffff; }
body.theme-detail-body .theme-bc-icon:hover {
    border-color: var(--gold);
    color: var(--gold);
}
body.theme-detail-body .theme-bc-icon i { font-size: 14px; }
body.theme-detail-body .theme-bc-icon svg { display: block; color: #ffffff; transition: color .25s ease; }
body.theme-detail-body .theme-bc-icon:hover svg { color: var(--gold); }
@media (max-width: 767px) {
    body.theme-detail-body .theme-bc-trail { font-size: 11px; }
    body.theme-detail-body .theme-bc-trail li + li::before { margin: 0 6px; }
    body.theme-detail-body .theme-bc-actions { gap: 6px; }
    body.theme-detail-body .theme-bc-icon { width: 32px; height: 32px; }
    .footer {
        padding: 40px 0 40px;
    }
}

/* ================================================================
   Themed contact popup (TRIMITE EMAIL)
   ================================================================ */
.theme-contact-modal {
    position: fixed;
    inset: 0;
    background: rgba(8, 8, 10, 0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 6500;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: themeContactFadeIn .25s ease-out;
}
.theme-contact-modal.active { display: flex; }
@keyframes themeContactFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.theme-contact-card {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: 92vh;
    overflow-y: auto;
    background: var(--bg-secondary, #14141a);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg, 14px);
    padding: 32px 28px 24px;
    box-shadow: 0 24px 80px rgba(0,0,0,.55);
    color: var(--text-primary);
}
.theme-contact-close {
    position: absolute;
    top: 12px;
    right: 14px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: var(--text-muted);
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    transition: color .25s;
}
.theme-contact-close:hover { color: var(--gold); }
.theme-contact-head { margin-bottom: 18px; }
.theme-contact-title {
    font-family: var(--font-display);
    font-size: 1.4rem;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.theme-contact-sub {
    font-size: 12px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .1em;
}
.theme-contact-form .theme-form-row { margin-bottom: 14px; }
.theme-contact-form .theme-form-row label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--text-muted);
    margin-bottom: 6px;
}
.theme-contact-form .theme-form-row input,
.theme-contact-form .theme-form-row textarea {
    width: 100%;
    background: var(--bg-elevated, #1c1c24);
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--text-primary);
    font-family: inherit;
    font-size: 14px;
    transition: border-color .25s;
}
.theme-contact-form .theme-form-row input:focus,
.theme-contact-form .theme-form-row textarea:focus {
    outline: none;
    border-color: var(--gold);
}
.theme-contact-form .theme-form-row textarea { resize: vertical; min-height: 100px; }
.theme-contact-form .theme-form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 14px 0 18px;
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.5;
}
.theme-contact-form .theme-form-check input { margin-top: 3px; flex-shrink: 0; }
.theme-contact-form .theme-form-check a { color: var(--gold); text-decoration: underline; }
.theme-contact-form .theme-contact-submit {
    width: 100%;
    padding: 14px 20px;
    background: var(--gold);
    color: #000;
    border: 1px solid var(--gold);
    border-radius: 100px;
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .25s;
}
.theme-contact-form .theme-contact-submit:hover {
    background: transparent;
    color: var(--gold);
}
@media (max-width: 480px) {
    .theme-contact-card { padding: 28px 20px 20px; }
    .theme-contact-title { font-size: 1.2rem; }
}

/* ================================================================
   Custom themed lightbox (matches _tema/property-detail.html)
   ================================================================ */
.theme-lightbox {
    position: fixed;
    inset: 0;
    background: rgba(8, 8, 10, 0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 6000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 64px 24px 96px;
    animation: themeLbFadeIn .25s ease-out;
}
.theme-lightbox.active {
    display: flex;
}
@keyframes themeLbFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.theme-lightbox-stage {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.theme-lightbox-stage img {
    max-width: 92vw;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 20px 60px rgba(0,0,0,.6);
    animation: themeLbZoom .35s cubic-bezier(.2,.7,.3,1);
    cursor: default;
}
@keyframes themeLbZoom {
    from { transform: scale(.92); opacity: 0; }
    to   { transform: scale(1);    opacity: 1; }
}

/* Close button */
.theme-lightbox-close {
    position: absolute;
    top: 20px;
    right: 24px;
    width: 48px;
    height: 48px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    color: #fff;
    font-size: 28px;
    line-height: 1;
    font-weight: 300;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
    z-index: 10;
    padding: 0;
}
.theme-lightbox-close:hover {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
    transform: rotate(90deg);
}

/* Prev / Next nav arrows */
.theme-lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    color: #fff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
    z-index: 10;
    padding: 0;
    font-family: inherit;
}
.theme-lightbox-nav:hover {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}
.theme-lightbox-prev {
    left: 24px;
    padding-right: 4px;
}
.theme-lightbox-next {
    right: 24px;
    padding-left: 4px;
}

/* Bottom caption + counter */
.theme-lightbox-bottom {
    position: absolute;
    bottom: 24px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 32px;
    color: rgba(255,255,255,.7);
    font-size: 13px;
    pointer-events: none;
    z-index: 10;
}
.theme-lightbox-caption {
    font-family: var(--font-display);
    font-size: 15px;
    color: rgba(255,255,255,.85);
    max-width: 70%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.theme-lightbox-counter {
    font-family: var(--font-body);
    letter-spacing: .12em;
    color: var(--gold);
}

/* Mobile adjustments */
@media (max-width: 640px) {
    .theme-lightbox-stage img {
        max-width: 96vw;
        max-height: 70vh;
    }
    .theme-lightbox-close {
        top: 12px;
        right: 12px;
        width: 40px;
        height: 40px;
        font-size: 22px;
    }
    .theme-lightbox-nav {
        width: 44px;
        height: 44px;
        font-size: 24px;
    }
    .theme-lightbox-prev { left: 8px; }
    .theme-lightbox-next { right: 8px; }
    .theme-lightbox-bottom {
        padding: 0 16px;
        bottom: 16px;
        font-size: 12px;
    }
    .theme-lightbox-caption {
        font-size: 13px;
        max-width: 60%;
    }
}

/* Oferte similare: force 3-column grid layout (override Bootstrap col-sm-4 behavior) */
body.theme-detail-body .oferte-similare-section {
    background: var(--bg-secondary);
    padding: 60px 0;
}
body.theme-detail-body .oferte-similare-section .container-fluid {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}
body.theme-detail-body .oferte-similare-section h4 {
    text-align: center;
    font-family: var(--font-display);
    font-size: 2rem;
    color: var(--text-primary);
    margin-bottom: 32px;
    font-weight: 400;
}
body.theme-detail-body .oferte-similare-section h4 span {
    color: var(--gold);
}
body.theme-detail-body .oferte-similare-section > .container-fluid > .row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin: 0;
}
body.theme-detail-body .oferte-similare-section > .container-fluid > .row > .col-sm-12 {
    grid-column: 1 / -1;
}
body.theme-detail-body .oferte-similare-section > .container-fluid > .row > .col-sm-4 {
    width: auto;
    max-width: none;
    flex: none;
    padding: 0;
    float: none;
}
@media (max-width: 900px) {
    body.theme-detail-body .oferte-similare-section > .container-fluid > .row {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 600px) {
    body.theme-detail-body .oferte-similare-section > .container-fluid > .row {
        grid-template-columns: 1fr;
    }
}

/* Badges row */
body.theme-detail-body .theme-badges-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
body.theme-detail-body .theme-id-tag {
    margin-left: auto;
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
body.theme-detail-body .property-badge {
    position: static;
    display: inline-block;
}

/* Themed contact form section */
body.theme-detail-body #theme-form-section {
    padding-bottom: 60px;
}
body.theme-detail-body .theme-contact-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 40px;
    max-width: 760px;
    margin: 0 auto 40px;
}
body.theme-detail-body .theme-contact-card h3 {
    font-family: var(--font-display);
    font-size: 1.6rem;
    color: var(--text-primary);
    margin-bottom: 8px;
}
body.theme-detail-body .theme-form-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
body.theme-detail-body .theme-form-row label {
    display: block;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    margin-bottom: 6px;
}
body.theme-detail-body .theme-form-row input,
body.theme-detail-body .theme-form-row textarea {
    width: 100%;
    padding: 12px 14px;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 14px;
    transition: border-color .2s ease;
}
body.theme-detail-body .theme-form-row input:focus,
body.theme-detail-body .theme-form-row textarea:focus {
    outline: none;
    border-color: var(--gold);
}
body.theme-detail-body .theme-form-row textarea {
    resize: vertical;
    min-height: 110px;
}

/* Sidebar action buttons stack tight */
body.theme-detail-body .sidebar-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
body.theme-detail-body .sidebar-actions .btn {
    width: 100%;
    text-align: center;
}

/* Tweak: make .oferte-similare-section visible (it stays under .detalii-prop-section in the
   legacy markup; we re-show its parent <section.content> wrapper because we hid only the inner
   blocks above). Section.content is not hidden; only its inner .property-images-sections and
   .detalii-prop-section are hidden. .oferte-similare-section + similar grid remain visible. */

/* Responsive */
@media (max-width: 1024px) {
    body.theme-detail-body .theme-detail-wrap .detail-gallery {
        grid-template-columns: 1fr;
        grid-template-rows: 320px 160px;
    }
    body.theme-detail-body .theme-detail-wrap .detail-gallery-side {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr;
    }
    body.theme-detail-body .theme-detail-wrap .detail-content {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 32px 0 60px;
    }
    body.theme-detail-body .theme-detail-wrap .detail-sidebar {
        position: static;
    }
    body.theme-detail-body .theme-form-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 640px) {
    body.theme-detail-body .theme-detail-wrap .detail-gallery {
        grid-template-rows: 240px 120px;
    }
    body.theme-detail-body .theme-detail-wrap .detail-content {
        padding: 20px 0 40px;
        gap: 24px;
    }
    body.theme-detail-body .theme-detail-wrap .container {
        padding: 0 12px;
    }
    body.theme-detail-body .theme-detail-wrap .detail-specs-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    body.theme-detail-body .theme-contact-card {
        padding: 24px;
    }
    body.theme-detail-body .theme-id-tag {
        margin-left: 0;
        width: 100%;
    }
}

/* ==========================================================================
   BRANDED RESIDENCES — design from _tema/branded-residences.html
   Applied to lista-proiecte.asp / lista-proiecte-promovate.asp via
   body.branded-residences-body scope.
   ========================================================================== */

/* Hide legacy banner / breadcrumbs / search-ansambluri so they don't double-render */
body.branded-residences-body .banner,
body.branded-residences-body > .breadcrumbs,
body.branded-residences-body .text-banner,
body.branded-residences-body .title-prop-recomandate,
body.branded-residences-body .search-ansambluri {
    display: none !important;
}

/* ── Page Hero Banner ───────────────────── */
body.branded-residences-body .br-hero {
    position: relative;
    height: 400px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    background: #0a0a0a;
    margin-top: 72px;
}
body.branded-residences-body .br-hero-bg {
    position: absolute;
    inset: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.35;
}
body.branded-residences-body .br-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,10,10,0.95) 0%, rgba(10,10,10,0.3) 100%);
}
body.branded-residences-body .br-hero-content {
    position: relative;
    z-index: 2;
    padding: 60px 0 48px;
    width: 100%;
}
body.branded-residences-body .br-hero-content .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}
body.branded-residences-body .br-hero-content .section-label {
    color: var(--gold);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 600;
}
body.branded-residences-body .br-hero-content h1 {
    font-family: var(--font-display);
    font-size: 3rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 8px 0 16px;
    line-height: 1.15;
}
body.branded-residences-body .br-hero-content p {
    font-size: 16px;
    color: var(--text-secondary);
    max-width: 680px;
    line-height: 1.7;
}

/* ── Breadcrumbs ────────────────────────── */
body.branded-residences-body .br-breadcrumbs {
    padding: 16px 0;
    font-size: 13px;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-subtle);
    margin-bottom: 48px;
}
body.branded-residences-body .br-breadcrumbs a {
    color: var(--text-muted);
    transition: color 0.3s;
    text-decoration: none;
}
body.branded-residences-body .br-breadcrumbs a:hover { color: var(--gold); }
body.branded-residences-body .br-breadcrumbs span { margin: 0 8px; opacity: 0.5; }

/* ── Section wrapper ─────────────────────── */
body.branded-residences-body .br-section .container,
body.branded-residences-body .br-cta .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ── Toolbar (search/filter kept above grid) ─────────────── */
body.branded-residences-body .br-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-bottom: 32px;
}
body.branded-residences-body .br-toolbar select,
body.branded-residences-body .br-toolbar input[type="text"] {
    padding: 12px 16px;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    color: var(--text-primary);
    font-size: 14px;
    min-width: 220px;
}
body.branded-residences-body .br-toolbar input[type="button"],
body.branded-residences-body .br-toolbar .br-toolbar-btn {
    padding: 12px 24px;
    background: var(--gold);
    color: #0a0a0a;
    border: 1px solid var(--gold);
    border-radius: var(--radius);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: all .3s;
}
body.branded-residences-body .br-toolbar input[type="button"]:hover,
body.branded-residences-body .br-toolbar .br-toolbar-btn:hover {
    background: transparent;
    color: var(--gold);
}

/* ── Projects Grid ──────────────────────── */
body.branded-residences-body .br-projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    padding-bottom: 80px;
}

body.branded-residences-body .br-no-results {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--text-secondary);
    padding: 60px 0;
}

body.branded-residences-body .br-section-tight {
    padding-top: 0;
}

/* Intro paragraph (lista-proiecte-promovate.asp) */
body.branded-residences-body .br-intro {
    padding-top: 30px;
}
body.branded-residences-body .br-intro-text {
    max-width: 860px;
    margin: 0 auto;
    text-align: center;
    color: var(--text-secondary);
    font-size: 16px;
    line-height: 1.85;
}
body.branded-residences-body .br-intro-text p {
    margin-bottom: 16px;
}
body.branded-residences-body .br-intro-text p:last-child { margin-bottom: 0; }

/* Concept cards (Locatie / Concept) */
body.branded-residences-body .br-concept-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin: 40px 0 60px;
}
body.branded-residences-body .br-concept-card {
    background: var(--bg-secondary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 32px 28px;
    transition: border-color .25s, transform .25s;
}
body.branded-residences-body .br-concept-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
}
body.branded-residences-body .br-concept-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: var(--gold);
    margin-bottom: 18px;
    background: rgba(197,165,114,0.06);
}
body.branded-residences-body .br-concept-card h3 {
    font-family: var(--font-display);
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--text-primary);
    margin: 0 0 12px;
    letter-spacing: .01em;
}
body.branded-residences-body .br-concept-card p {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.75;
    margin: 0;
}
@media (max-width: 768px) {
    body.branded-residences-body .br-concept-grid { grid-template-columns: 1fr; gap: 16px; }
    body.branded-residences-body .br-concept-card { padding: 24px 22px; }
    body.branded-residences-body .br-intro-text { font-size: 14px; }
}

/* Themed contact section (lista-proiecte-promovate.asp) */
body.branded-residences-body .br-contact-section {
    padding: 80px 0;
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-subtle);
}
body.branded-residences-body .br-contact-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 40px;
}
body.branded-residences-body .br-contact-head .section-label {
    color: var(--gold);
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 12px;
}
body.branded-residences-body .br-contact-head h2 {
    font-family: var(--font-display);
    font-size: 2rem;
    color: var(--text-primary);
    font-weight: 400;
    margin-bottom: 16px;
}
body.branded-residences-body .br-contact-head p {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.7;
}
body.branded-residences-body .br-contact-form {
    max-width: 880px;
    margin: 0 auto;
}
body.branded-residences-body .br-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}
body.branded-residences-body .br-form-row-full {
    grid-column: 1 / -1;
}
body.branded-residences-body .br-form-row { display: flex; flex-direction: column; }
body.branded-residences-body .br-form-row label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--text-muted);
    margin-bottom: 6px;
    font-weight: 500;
}
body.branded-residences-body .br-form-row label .req {
    color: var(--gold);
    margin-left: 2px;
}
body.branded-residences-body .br-form-row input,
body.branded-residences-body .br-form-row select,
body.branded-residences-body .br-form-row textarea {
    width: 100%;
    background: var(--bg-elevated, #1c1c24);
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    padding: 12px 14px;
    color: var(--text-primary);
    font-family: inherit;
    font-size: 14px;
    transition: border-color .25s;
}
body.branded-residences-body .br-form-row input:focus,
body.branded-residences-body .br-form-row select:focus,
body.branded-residences-body .br-form-row textarea:focus {
    outline: none;
    border-color: var(--gold);
}
body.branded-residences-body .br-form-row select option {
    background: var(--bg-card, #1a1a1a);
    color: var(--text-primary);
}
body.branded-residences-body .br-form-row textarea {
    resize: vertical;
    min-height: 120px;
}
body.branded-residences-body .br-form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.6;
    padding: 8px 0;
}
body.branded-residences-body .br-form-check input { margin-top: 3px; flex-shrink: 0; }
body.branded-residences-body .br-form-check a { color: var(--gold); text-decoration: underline; }
body.branded-residences-body .br-form-actions {
    text-align: center;
    margin-top: 8px;
}
body.branded-residences-body .br-form-submit {
    padding: 14px 40px;
    font-size: 13px;
    letter-spacing: .15em;
    cursor: pointer;
}
@media (max-width: 640px) {
    body.branded-residences-body .br-form-grid { grid-template-columns: 1fr; }
    body.branded-residences-body .br-contact-section { padding: 50px 0; }
    body.branded-residences-body .br-contact-head h2 { font-size: 1.6rem; }
}

/* Themed confirmation popup (after contact form submit) */
.theme-confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(8, 8, 10, 0.85);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    animation: themeConfirmFade .25s ease-out;
}
.theme-confirm-modal.active { display: flex; }
@keyframes themeConfirmFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.theme-confirm-card {
    position: relative;
    background: var(--bg-card, #1a1a1a);
    color: var(--text-primary, #f5f0eb);
    max-width: 480px;
    width: 100%;
    padding: 48px 36px 36px;
    border: 1px solid var(--border, rgba(197,165,114,0.25));
    border-radius: var(--radius-lg, 14px);
    box-shadow: 0 24px 80px rgba(0,0,0,.55);
    text-align: center;
    animation: themeConfirmRise .35s cubic-bezier(0.4,0,0.2,1);
}
@keyframes themeConfirmRise {
    from { opacity: 0; transform: translateY(20px) scale(.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.theme-confirm-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--gradient-gold, linear-gradient(135deg,#c5a572,#d4b88a));
    border-radius: var(--radius-lg, 14px) var(--radius-lg, 14px) 0 0;
}
.theme-confirm-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid var(--border-subtle, rgba(255,255,255,0.08));
    border-radius: 50%;
    color: var(--text-muted);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    transition: all .25s;
}
.theme-confirm-close:hover {
    color: var(--bg-primary, #0a0a0a);
    background: var(--gold);
    border-color: var(--gold);
    transform: rotate(90deg);
}
.theme-confirm-icon {
    color: var(--gold);
    margin-bottom: 18px;
    display: inline-flex;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(197,165,114,0.08);
    align-items: center;
    justify-content: center;
}
.theme-confirm-title {
    font-family: var(--font-display, 'Cormorant Garamond', serif);
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--gold);
    margin: 0 0 12px;
    letter-spacing: .02em;
}
.theme-confirm-text {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.7;
    margin: 0 0 24px;
}
.theme-confirm-btn {
    padding: 12px 36px;
    font-size: 12px;
    letter-spacing: .15em;
    cursor: pointer;
}

/* ── Project Card (full version) ────────── */
body.branded-residences-body .br-card {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    cursor: pointer;
}
body.branded-residences-body .br-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    border-color: var(--gold);
}
body.branded-residences-body .br-card-img {
    position: relative;
    height: 300px;
    overflow: hidden;
}
body.branded-residences-body .br-card-img a {
    display: block;
    width: 100%;
    height: 100%;
}
body.branded-residences-body .br-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body.branded-residences-body .br-card:hover .br-card-img img {
    transform: scale(1.08);
}
body.branded-residences-body .br-card-img::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to top, rgba(10,10,10,0.7), transparent);
    pointer-events: none;
}
body.branded-residences-body .br-status {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 8px 16px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-radius: var(--radius);
    z-index: 2;
    background: var(--gold);
    color: #0a0a0a;
}
body.branded-residences-body .br-status.development {
    background: rgba(255, 255, 255, 0.92);
    color: #0a0a0a;
}
body.branded-residences-body .br-status.available {
    background: #2ecc71;
    color: #fff;
}
body.branded-residences-body .br-card-body {
    padding: 28px;
}
body.branded-residences-body .br-card-name {
    font-family: var(--font-display);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 4px;
    line-height: 1.2;
}
body.branded-residences-body .br-card-name a {
    color: inherit;
    text-decoration: none;
    transition: color .25s;
}
body.branded-residences-body .br-card-name a:hover { color: var(--gold); }
body.branded-residences-body .br-card-developer {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 12px;
}
body.branded-residences-body .br-card-location {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--text-muted);
    margin: 0 0 12px;
}
body.branded-residences-body .br-card-location svg {
    width: 14px;
    height: 14px;
    color: var(--gold);
    flex-shrink: 0;
}
body.branded-residences-body .br-card-tagline {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 20px;
    min-height: 48px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* Features chips */
body.branded-residences-body .br-card-features {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 20px;
    min-height: 28px;
}
body.branded-residences-body .br-card-tag {
    padding: 5px 12px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-muted);
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 100px;
    transition: all 0.3s;
}
body.branded-residences-body .br-card:hover .br-card-tag {
    border-color: var(--border);
}
/* Footer with price + specs */
body.branded-residences-body .br-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
    gap: 12px;
}
body.branded-residences-body .br-card-price {
    font-family: var(--font-display);
    font-size: 1.05rem;
    color: var(--gold);
    font-weight: 500;
    line-height: 1.2;
}
body.branded-residences-body .br-card-units {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 4px;
}
body.branded-residences-body .br-card-specs {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
}
body.branded-residences-body .br-card-spec {
    text-align: center;
}
body.branded-residences-body .br-card-spec-val {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2;
}
body.branded-residences-body .br-card-spec-label {
    font-size: 9px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-top: 2px;
}

/* ── CTA Section ─────────────────────────── */
body.branded-residences-body .br-cta {
    padding: 80px 0;
    background: var(--bg-secondary);
    text-align: center;
}
body.branded-residences-body .br-cta h2 {
    font-family: var(--font-display);
    font-size: 2rem;
    color: var(--text-primary);
    margin-bottom: 12px;
}
body.branded-residences-body .br-cta p {
    font-size: 15px;
    color: var(--text-secondary);
    max-width: 540px;
    margin: 0 auto 32px;
    line-height: 1.7;
}
body.branded-residences-body .br-cta .btn {
    padding: 16px 40px;
    font-size: 13px;
}

/* ── Pagination (themed) ─────────────────── */
body.branded-residences-body .pagination {
    display: flex;
    justify-content: center;
    margin: 0 0 60px;
}
body.branded-residences-body .pagination ul {
    display: flex;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
}
body.branded-residences-body .pagination li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius);
    background: var(--bg-card);
    color: var(--text-secondary);
    font-size: 13px;
    text-decoration: none;
    transition: all .25s;
}
body.branded-residences-body .pagination li a:hover {
    border-color: var(--gold);
    color: var(--gold);
}
body.branded-residences-body .pagination li a.active {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}
body.branded-residences-body .pagination .page-line { display: none; }

/* ── Responsive ──────────────────────────── */
@media (max-width: 1024px) {
    body.branded-residences-body .br-projects-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    body.branded-residences-body .br-hero { height: 320px; }
    body.branded-residences-body .br-hero-content h1 { font-size: 2.2rem; }
}
@media (max-width: 640px) {
    body.branded-residences-body .br-projects-grid { grid-template-columns: 1fr; }
    body.branded-residences-body .br-hero { height: 280px; }
    body.branded-residences-body .br-hero-content h1 { font-size: 1.8rem; }
    body.branded-residences-body .br-card-img { height: 240px; }
    body.branded-residences-body .br-card-specs { display: none; }
}

/* ═══════════════════════════════════════════════════
   Pagina anunturi-salvate (anunturi.asp)
   - CTA full-width in grid-ul .lista-body
   - Buton sterge oferta (cerc cu icon SVG)
   - State gol stilizat
   ═══════════════════════════════════════════════════ */
body.lista-body .proprietati-recomandate > .container-fluid > .prop-link.prop-detalii-btn,
body.lista-body .proprietati-recomandate > .container-fluid > .anunturi-cta {
    grid-column: 1 / -1;
    text-align: center;
    margin: 0 0 8px;
}

body.lista-body .col-prop-recomandate .sterge-oferta {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: all 0.25s ease;
    border: 1px solid rgba(255, 255, 255, 0.15);
    text-decoration: none;
}
body.lista-body .col-prop-recomandate .sterge-oferta:hover {
    background: var(--gold);
    color: #0a0a0a !important;
    border-color: var(--gold);
    transform: scale(1.05);
}
body.lista-body .col-prop-recomandate .sterge-oferta svg {
    width: 16px;
    height: 16px;
    display: block;
    stroke: currentColor;
}

body.lista-body .title-prop-recomandate h4 { color: var(--text-primary); }
body.lista-body .title-prop-recomandate h4 span { color: var(--gold); }

body.lista-body .proprietati-recomandate > .container-fluid > .row:first-of-type:has(> .empty-anunturi) {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    display: block;
}
.empty-anunturi {
    padding: 80px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    width: 100%;
    float: none;
}
.empty-anunturi-inner {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    text-align: center;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 56px 40px;
    position: relative;
    overflow: hidden;
}
.empty-anunturi-inner::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: var(--gradient-gold);
}
.empty-anunturi-icon {
    font-size: 56px;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 20px;
}
.empty-anunturi-inner h3 {
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 30px;
    color: var(--text-primary);
    margin: 0 0 12px;
    letter-spacing: 0.5px;
}
.empty-anunturi-inner p {
    color: var(--text-secondary);
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 28px;
}
.empty-anunturi-inner .btn-submit-prop {
    display: inline-block;
    padding: 12px 28px;
    background: var(--gold);
    color: #0a0a0a;
    border-radius: 4px;
    font-weight: 500;
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: all 0.25s ease;
}
.empty-anunturi-inner .btn-submit-prop:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(197, 165, 114, 0.25);
}

/* Microdata schema.org ascunse vizual dar disponibile pentru crawlers */
.visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0);
    white-space: nowrap; border: 0;
}
.property-price-tva {
    opacity: .6;
    margin-left: 6px;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════
   Modal "Solicita informatii pe e-mail" (anunturi-salvate)
   - design ANG Luxury (gold + dark/light)
   - clase BEM-like, fara dependente Bootstrap
   ═══════════════════════════════════════════════════ */
body.solicita-modal-open { overflow: hidden; }

.solicita-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: var(--overlay, rgba(0, 0, 0, 0.6));
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    overflow-y: auto;
    animation: solicitaFade 0.25s ease-out;
}
.solicita-modal.is-show { display: flex; }
@keyframes solicitaFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes solicitaRise {
    from { opacity: 0; transform: translateY(20px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes solicitaSpin { to { transform: rotate(360deg); } }

.solicita-modal-dialog {
    position: relative;
    background: var(--bg-card);
    color: var(--text-primary);
    max-width: 580px;
    width: 100%;
    margin: auto;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    font-family: var(--font-body);
    animation: solicitaRise 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.solicita-modal-dialog::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--gradient-gold);
}

.solicita-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 28px 16px;
    border-bottom: 1px solid var(--border-subtle);
}
.solicita-modal-title {
    margin: 0;
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 26px;
    letter-spacing: 0.5px;
    color: var(--gold);
}
.solicita-modal-close {
    background: transparent;
    border: 1px solid var(--border);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease;
    padding: 0;
}
.solicita-modal-close:hover {
    color: #0a0a0a;
    background: var(--gold);
    border-color: var(--gold);
    transform: rotate(90deg);
}

.solicita-modal-body { padding: 22px 28px 28px; }
.solicita-modal-intro {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-secondary);
}
.solicita-modal-row { margin-bottom: 14px; }
.solicita-modal-row label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--text-secondary);
    font-weight: 500;
}
.solicita-modal-req { color: var(--gold); }
.solicita-modal input[type="text"],
.solicita-modal input[type="tel"],
.solicita-modal input[type="email"],
.solicita-modal textarea {
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    color: var(--text-primary);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 11px 14px;
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.4;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.solicita-modal input:focus,
.solicita-modal textarea:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(197, 165, 114, 0.15);
}
.solicita-modal textarea { resize: vertical; min-height: 96px; }
.solicita-modal input.is-error,
.solicita-modal textarea.is-error {
    border-color: #c0392b;
    box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.15);
}

.solicita-modal-feedback {
    min-height: 0;
    margin: 0 0 4px;
    font-size: 13px;
    line-height: 1.5;
}
.solicita-modal-feedback.is-error { color: #e07b6a; padding: 8px 0; }
.solicita-modal-feedback.is-success {
    color: var(--gold-light);
    background: rgba(197, 165, 114, 0.08);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 12px 14px;
    margin-top: 8px;
}

.solicita-modal-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 18px;
    flex-wrap: wrap;
}
.solicita-modal-btn {
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    padding: 11px 22px;
    border-radius: var(--radius);
    cursor: pointer;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
}
.solicita-modal-btn-ghost {
    background: transparent;
    border-color: var(--border);
    color: var(--text-secondary);
}
.solicita-modal-btn-ghost:hover {
    color: var(--text-primary);
    border-color: var(--gold);
}
.solicita-modal-btn-primary {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}
.solicita-modal-btn-primary:hover {
    background: var(--gold-light);
    border-color: var(--gold-light);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(197, 165, 114, 0.25);
}
.solicita-modal-btn[disabled] {
    opacity: 0.65;
    cursor: progress;
    pointer-events: none;
}
.solicita-modal-spinner {
    display: none;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(0, 0, 0, 0.25);
    border-top-color: #0a0a0a;
    border-radius: 50%;
    animation: solicitaSpin 0.8s linear infinite;
}
.solicita-modal.is-loading .solicita-modal-spinner { display: inline-block; }
.solicita-modal.is-success form { display: none; }

@media (max-width: 560px) {
    .solicita-modal-header { padding: 18px 20px 14px; }
    .solicita-modal-body { padding: 18px 20px 22px; }
    .solicita-modal-title { font-size: 22px; }
    .solicita-modal-actions { flex-direction: column-reverse; }
    .solicita-modal-btn { width: 100%; }
}

/* ═══════════════════════════════════════════════════
   Pagina 404 - design ANG Luxury
   ═══════════════════════════════════════════════════ */
body.not-found-body { background: var(--bg-primary); }
body.not-found-body .not-found {
    position: relative;
    min-height: calc(100vh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    overflow: hidden;
}
body.not-found-body .not-found-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 20% 30%, rgba(197, 165, 114, 0.10) 0%, transparent 55%),
        radial-gradient(ellipse at 80% 70%, rgba(197, 165, 114, 0.08) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
}
body.not-found-body .not-found-container {
    position: relative;
    z-index: 1;
    max-width: 760px;
    width: 100%;
    text-align: center;
}
body.not-found-body .not-found-eyebrow {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--gold);
    padding: 8px 18px;
    border: 1px solid var(--border);
    border-radius: 999px;
    margin-bottom: 32px;
    background: rgba(197, 165, 114, 0.05);
}
body.not-found-body .not-found-code {
    font-family: var(--font-display);
    font-size: clamp(110px, 22vw, 220px);
    font-weight: 300;
    line-height: 1;
    letter-spacing: -4px;
    color: var(--text-primary);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(8px, 2vw, 24px);
    margin-bottom: 24px;
}
body.not-found-body .not-found-code span {
    display: inline-block;
    line-height: 1;
}
body.not-found-body .not-found-code .not-found-zero {
    background: var(--gradient-gold);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-style: italic;
    animation: notFoundFloat 4s ease-in-out infinite;
}
@keyframes notFoundFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}
body.not-found-body .not-found-title {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: clamp(28px, 4vw, 42px);
    color: var(--text-primary);
    margin: 0 0 18px;
    letter-spacing: 0.5px;
}
body.not-found-body .not-found-subtitle {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-secondary);
    max-width: 540px;
    margin: 0 auto 40px;
}
body.not-found-body .not-found-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 48px;
}
body.not-found-body .not-found-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 26px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: var(--radius);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid transparent;
}
body.not-found-body .not-found-btn-primary {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
}
body.not-found-body .not-found-btn-primary:hover {
    background: var(--gold-light);
    border-color: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(197, 165, 114, 0.28);
}
body.not-found-body .not-found-btn-primary svg {
    transition: transform 0.3s ease;
}
body.not-found-body .not-found-btn-primary:hover svg { transform: translateX(4px); }
body.not-found-body .not-found-btn-ghost {
    background: transparent;
    color: var(--text-primary);
    border-color: var(--border);
}
body.not-found-body .not-found-btn-ghost:hover {
    color: var(--gold);
    border-color: var(--gold);
    background: rgba(197, 165, 114, 0.05);
    transform: translateY(-2px);
}
body.not-found-body .not-found-quick {
    padding-top: 28px;
    border-top: 1px solid var(--border-subtle);
    font-size: 13px;
    color: var(--text-muted);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
body.not-found-body .not-found-quick-label {
    color: var(--text-secondary);
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 11px;
    margin-right: 4px;
}
body.not-found-body .not-found-quick a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: color 0.25s ease;
    position: relative;
}
body.not-found-body .not-found-quick a:hover { color: var(--gold); }
body.not-found-body .not-found-divider { color: var(--gold); opacity: 0.5; }

@media (max-width: 600px) {
    body.not-found-body .not-found { padding: 60px 16px; min-height: auto; }
    body.not-found-body .not-found-eyebrow { margin-bottom: 20px; }
    body.not-found-body .not-found-code { margin-bottom: 16px; letter-spacing: -2px; }
    body.not-found-body .not-found-actions { flex-direction: column; gap: 10px; margin-bottom: 36px; }
    body.not-found-body .not-found-btn { width: 100%; justify-content: center; }
    body.not-found-body .not-found-quick { gap: 8px; font-size: 12px; }
}

/* ── "Salveaza cautarea" popup — tema dark + gold ─────────────── */
#popup {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    font-family: var(--font-body);
}
#popup-bg {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    cursor: pointer;
}
#popup-content-wrapper {
    position: relative;
    background: var(--bg-card);
    color: var(--text-primary);
    width: 100%;
    max-width: 560px;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    animation: popupRise 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
#popup-content-wrapper::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: var(--gradient-gold);
}
@keyframes popupRise {
    from { opacity: 0; transform: translateY(20px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
#popup-content {
    padding: 28px 32px 30px;
}
#popup-close-wrap {
    position: absolute;
    top: 16px;
    right: 18px;
    margin: 0;
    padding: 0;
    text-align: right;
}
#popup-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: transparent;
    color: var(--text-secondary, #a09890);
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    transition: all 0.25s ease;
}
#popup-close:hover {
    background: var(--gold);
    color: #0a0a0a;
    border-color: var(--gold);
    transform: rotate(90deg);
}
#popup-content > img {
    display: block;
    max-width: 140px;
    height: auto;
    margin: 0 auto 18px;
}
#popup-cms {
    height: auto !important;
    text-align: center;
    margin-bottom: 22px;
}
#popup-cms h2 {
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 22px;
    letter-spacing: 0.5px;
    color: var(--gold);
    background: transparent !important;
    margin: 0 0 14px;
    padding: 0;
    line-height: 1.3;
}
#popup-cms h2 center { display: inline; }
#popup-cms p {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-primary);
    margin: 0;
}
#popup-cms p strong:first-child {
    color: var(--gold);
    font-weight: 600;
}
#popup form[name="frmPopup"] fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}
#popup #txtPopupEmail {
    width: 100%;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border);
    border-radius: 4px;
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 14px;
    margin-bottom: 14px;
    box-sizing: border-box;
}
#popup #txtPopupEmail:focus {
    outline: none;
    border-color: var(--gold);
}
#popup form label,
#popup form input[type="checkbox"] + span,
#popup fieldset > br + input[type="checkbox"] {
    font-size: 13px;
    color: var(--text-secondary, #a09890);
}
#popup fieldset > br + input[type="checkbox"] {
    accent-color: var(--gold);
    margin-right: 6px;
    transform: translateY(2px);
}
#popup fieldset a {
    color: var(--gold);
    text-decoration: none;
    border-bottom: 1px solid var(--gold);
    transition: color 0.2s ease;
}
#popup fieldset a:hover {
    color: var(--gold-light);
    border-color: var(--gold-light);
}
#popup #btnPopupSend {
    display: inline-block;
    padding: 12px 28px;
    background: var(--gold);
    color: #0a0a0a;
    border: 0;
    border-radius: 4px;
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.25s ease;
    margin-top: 6px;
}
#popup #btnPopupSend:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(197, 165, 114, 0.25);
}
#popup #popup-content > a[href="login"] {
    color: var(--gold) !important;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid var(--gold);
}
#popup #popup-content > a[href="login"]:hover {
    color: var(--gold-light) !important;
}
@media (max-width: 560px) {
    #popup-content { padding: 22px 22px 24px; }
    #popup-cms h2 { font-size: 19px; }
    #popup-content > img { max-width: 110px; }
}

/* Butonul "SALVEAZA CAUTAREA" — sub forma de filtre */
input#submit2[name="btnSave"] {
    background: transparent;
    color: var(--gold);
    border: 1px solid var(--gold);
    padding: 10px 22px;
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.25s ease;
}
input#submit2[name="btnSave"]:hover {
    background: var(--gold);
    color: #0a0a0a;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(197, 165, 114, 0.2);
}

/* ── LOGIN PAGE — tema dark + gold ─────────────────────── */
body.login-body { background: var(--bg-primary); color: var(--text-primary); }

/* Banner (oglinda lista-body) */
body.login-body .banner {
    position: relative;
    min-height: 50vh;
    overflow: hidden;
    background: #0a0a0a;
    display: flex;
    align-items: center;
    justify-content: center;
}
body.login-body .banner-item {
    position: absolute;
    inset: 0;
    z-index: 0;
    margin: 0;
    padding: 0;
}
body.login-body .banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.5;
}
body.login-body .banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,10,10,0.92) 0%, rgba(10,10,10,0.35) 55%, rgba(10,10,10,0.55) 100%);
    z-index: 1;
}
body.login-body .text-banner {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 820px;
    padding: 110px 24px 0;
    margin: 0 auto;
}
body.login-body .text-banner::before {
    content: "Cont";
    display: block;
    font-size: 11px;
    letter-spacing: 0.25em;
    color: var(--gold);
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 16px;
}
body.login-body .text-banner h1 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    color: var(--text-primary);
    font-weight: 300;
    line-height: 1.2;
    margin: 0 0 18px;
}
body.login-body .text-banner p {
    color: var(--text-secondary);
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 640px;
    margin: 0 auto;
}

/* Breadcrumbs */
body.login-body .breadcrumbs {
    padding: 16px 0;
    background: transparent;
    text-align: center;
}
body.login-body .breadcrumbs .container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
body.login-body .breadcrumb-item ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 13px;
}
body.login-body .breadcrumb-item li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
body.login-body .breadcrumb-item a {
    color: var(--text-muted, #888);
    text-decoration: none;
    transition: color 0.3s;
}
body.login-body .breadcrumb-item a:hover { color: var(--gold); }
body.login-body .breadcrumb-item span { color: var(--text-muted, #888); }

/* Section container */
body.login-body .login-container {
    padding: 48px 0 96px;
}
body.login-body .login-container .container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px;
}
body.login-body .login-item .row {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    margin: 0;
}
body.login-body .login-item .col-sm-5,
body.login-body .login-item .col-sm-6 {
    flex: 1 1 380px;
    max-width: 100%;
    padding: 0;
}
body.login-body .login-item .col-sm-1 { display: none; }

/* Cards */
body.login-body .login-section,
body.login-body .account-section {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 40px 36px;
    position: relative;
    overflow: hidden;
    height: 100%;
}
body.login-body .login-section::before,
body.login-body .account-section::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: var(--gradient-gold);
}
body.login-body .login-section h5,
body.login-body .account-section h5 {
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 26px;
    letter-spacing: 0.5px;
    color: var(--gold);
    margin: 0 0 22px;
    line-height: 1.25;
}
body.login-body .account-section > p {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.75;
    margin: 0 0 22px;
}

/* Mesaje (errmsg / errmsg1) */
body.login-body .login-msg {
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.03);
    border-left: 3px solid var(--gold);
    color: var(--text-primary);
    font-size: 14px;
    line-height: 1.5;
    margin: 0 0 18px;
    border-radius: 0 4px 4px 0;
    text-align: left;
}

/* Inputs */
body.login-body .form-control {
    width: 100%;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border);
    border-radius: 4px;
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: 14px;
    margin-bottom: 14px;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}
body.login-body .form-control:focus {
    outline: none;
    border-color: var(--gold);
}
body.login-body .form-control::placeholder { color: var(--text-muted, #6e6660); }
body.login-body input[type="checkbox"] {
    accent-color: var(--gold);
    margin-right: 6px;
}

/* Buttons */
body.login-body .btn-login,
body.login-body .btn-account {
    display: inline-block;
    padding: 12px 28px;
    background: var(--gold);
    color: #0a0a0a;
    border: 0;
    border-radius: 4px;
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.25s ease;
    margin-top: 8px;
}
body.login-body .btn-login:hover,
body.login-body .btn-account:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(197, 165, 114, 0.25);
}
body.login-body .btn-login span,
body.login-body .btn-account span { color: inherit; }

/* Forgot password */
body.login-body .remember-password {
    text-align: center;
    margin: 18px 0 0;
}
body.login-body .recuperareparola {
    color: var(--gold);
    font-size: 13px;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: all 0.2s ease;
    display: inline-block;
    padding-bottom: 1px;
}
body.login-body .recuperareparola:hover {
    color: var(--gold-light);
    border-bottom-color: var(--gold-light);
}

/* Account form — checkbox + termeni */
body.login-body .account-form > p {
    margin: 4px 0 16px;
}
body.login-body .account-form .checkbox {
    display: block;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.6;
    cursor: pointer;
    font-weight: normal;
}
body.login-body .account-form .checkbox input[type="checkbox"] {
    transform: translateY(2px);
}
body.login-body .account-form a {
    color: var(--gold);
    text-decoration: none;
    border-bottom: 1px solid var(--gold);
    transition: color 0.2s ease;
}
body.login-body .account-form a:hover {
    color: var(--gold-light);
    border-color: var(--gold-light);
}

/* Captcha row */
body.login-body .account-form .form-group {
    margin: 18px 0 0;
}
body.login-body .account-form .form-group .row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0;
}
body.login-body .account-form .contact-block-inner {
    padding: 0;
    flex: 0 0 auto;
}
body.login-body .account-form .contact-block-inner:first-child {
    color: var(--gold);
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.05em;
    min-width: 64px;
}
body.login-body .account-form input[name="txtCod"] {
    flex: 1 1 120px;
    margin: 0;
    min-width: 100px;
}
body.login-body .account-form .contact-block-inner:last-child {
    flex: 1 1 auto;
}

/* hr */
body.login-body hr {
    border: 0;
    border-top: 1px solid var(--border);
    margin: 28px 0 0;
    height: 0;
}

@media (max-width: 768px) {
    body.login-body .login-container { padding: 28px 0 60px; }
    body.login-body .login-section,
    body.login-body .account-section { padding: 28px 22px; }
    body.login-body .login-section h5,
    body.login-body .account-section h5 { font-size: 22px; }
    body.login-body .account-form .contact-block-inner:last-child { width: 100%; }
    body.login-body .btn-account { width: 100%; text-align: center; }
}

/* ── Modal "Confirmare oferta in portofoliu" (#confirmare3) ── */
#confirmare3 {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: var(--overlay, rgba(0,0,0,.6));
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: cmFade .25s ease-out;
}
#confirmare3.cm-show { display: flex; }
@keyframes cmFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes cmRise {
    from { opacity: 0; transform: translateY(20px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
#confirmare3 .cm-dialog {
    background: var(--bg-card, #1a1a1a);
    color: var(--text-primary, #f5f0eb);
    max-width: 560px;
    width: 100%;
    border: 1px solid var(--border, rgba(197,165,114,0.25));
    border-radius: var(--radius-lg, 8px);
    box-shadow: var(--shadow-lg, 0 20px 60px rgba(0,0,0,.5));
    overflow: hidden;
    font-family: var(--font-body, 'Inter', sans-serif);
    position: relative;
    animation: cmRise .35s cubic-bezier(0.4,0,0.2,1);
}
#confirmare3 .cm-dialog::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--gradient-gold, linear-gradient(135deg,#c5a572,#d4b88a));
}
#confirmare3 .cm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 28px 16px;
    border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
}
#confirmare3 .cm-title {
    margin: 0;
    font-family: var(--font-display, 'Cormorant Garamond', serif);
    font-weight: 500;
    font-size: 26px;
    letter-spacing: .5px;
    color: var(--gold, #c5a572);
}
#confirmare3 .cm-close {
    background: transparent;
    border: 1px solid var(--border, rgba(197,165,114,0.25));
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: var(--text-secondary, #a09890);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
    padding: 0;
}
#confirmare3 .cm-close:hover {
    color: var(--bg-primary, #0a0a0a);
    background: var(--gold, #c5a572);
    border-color: var(--gold, #c5a572);
    transform: rotate(90deg);
}
#confirmare3 .cm-body {
    padding: 24px 28px 30px;
    color: var(--text-primary, #f5f0eb);
    font-size: 15px;
    line-height: 1.7;
}
#confirmare3 .cm-body p { margin: 0; }
#confirmare3 .cm-body a {
    color: var(--gold, #c5a572);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid var(--gold, #c5a572);
    padding-bottom: 1px;
    transition: color .25s ease, border-color .25s ease;
    display: inline-block;
    margin-top: 4px;
}
#confirmare3 .cm-body a:hover {
    color: var(--gold-light, #d4b88a);
    border-color: var(--gold-light, #d4b88a);
}
@media (max-width: 560px) {
    #confirmare3 .cm-header { padding: 18px 20px 14px; }
    #confirmare3 .cm-body { padding: 20px 20px 24px; }
    #confirmare3 .cm-title { font-size: 22px; }
}
@media (max-width: 767px) {
    .link-utile a + a {
        padding-left: 5px;
    }
    .detail-title {
        font-size: 2.0rem;
    }

}


/* ── Mission Social Icons (theme-matched, modern) ─────────────────────── */
.mission-social-row{
    display:flex;
    align-items:center;
    gap:16px;
    margin-top:32px;
    padding-top:24px;
    border-top:1px solid rgba(201,169,110,0.18);
}
.mission-social-label{
    font-size:13px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--text-muted,#888);
    font-weight:500;
}
.mission-social-links{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.mission-social-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid rgba(201,169,110,0.4);
    color:#c9a96e;
    background:transparent;
    transition:all .25s ease;
    text-decoration:none;
}
.mission-social-link:hover,
.mission-social-link:focus-visible{
    background:#c9a96e;
    color:#0f0f0f;
    border-color:#c9a96e;
    transform:translateY(-2px);
    box-shadow:0 6px 18px rgba(201,169,110,0.25);
}
.mission-social-link svg{display:block}
@media (max-width:600px){
    .mission-social-row{flex-direction:column;align-items:flex-start;gap:12px}
    .mission-social-link{width:38px;height:38px}
}
#button.show {
    opacity: 1;
    visibility: visible;
    display: block;
}
#button {
    position: fixed;
    bottom: 100px;
    right: 30px;
    transform: translateX(-50%);
    z-index: 1000;
    width: 50px;
    height: 50px;
    border: 1px solid #fff;
    border-radius: 50%;
    position: fixed;
    display: none;
    text-align: center;
    line-height: 1;
    visibility: hidden;
    opacity: 0;
    transition: all 0.4s ease;
    transform: translateY(60px);
    -ms-transform: translateY(60px);
    cursor: pointer;
    background: url(../img/prev-home.png) no-repeat;
    background-size: 100%;
    transform: rotate(90deg);
    background-color: #B28250;
}


body.lista-body .zona-scroll-section {
    max-height: 280px;
    overflow-y: auto;
}

@media (max-width: 768px) {
    body.lista-body .zona-scroll-section {
        max-height: none;
        overflow: visible;
    }
    body.lista-body .zona-third input[type="text"] {
        font-size: 16px!important;
    }
    body.lista-body .propCheckbox1 #clpop {
        padding: 20px 0;
    }
}