:root {
    --immoreklame-primary: #155d75;
    --immoreklame-primary-dark: #0c4052;
    --immoreklame-accent: #d59734;
    --immoreklame-ink: #18313b;
    --immoreklame-muted: #5e7078;
    --immoreklame-soft: #eef5f5;
}

body { color: var(--immoreklame-ink); background: #fbfcfc; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: var(--immoreklame-primary); }
a:hover { color: var(--immoreklame-primary-dark); }
.text-primary { color: var(--immoreklame-primary) !important; }
.text-secondary { color: var(--immoreklame-muted) !important; }
.btn { border-radius: .65rem; font-weight: 650; padding: .65rem 1.1rem; }
.btn-primary { --bs-btn-bg: var(--immoreklame-primary); --bs-btn-border-color: var(--immoreklame-primary); --bs-btn-hover-bg: var(--immoreklame-primary-dark); --bs-btn-hover-border-color: var(--immoreklame-primary-dark); --bs-btn-active-bg: var(--immoreklame-primary-dark); --bs-btn-active-border-color: var(--immoreklame-primary-dark); }
.btn-outline-primary { --bs-btn-color: var(--immoreklame-primary); --bs-btn-border-color: var(--immoreklame-primary); --bs-btn-hover-bg: var(--immoreklame-primary); --bs-btn-hover-border-color: var(--immoreklame-primary); }

.site-header { background: rgba(255, 255, 255, .96); border-bottom: 1px solid rgba(24, 49, 59, .09); backdrop-filter: blur(12px); }
.navbar-brand { color: var(--immoreklame-ink); font-size: 1.32rem; letter-spacing: -.035em; }
.navbar-brand:hover { color: var(--immoreklame-ink); }
.brand-accent { color: var(--immoreklame-primary); font-weight: 750; }
.brand-domain { color: #819097; font-weight: 500; }
.brand-mark { display: inline-grid; place-items: center; width: 2rem; height: 2rem; color: #fff; background: var(--immoreklame-primary); border-radius: .55rem; }
.brand-mark svg { width: 1.25rem; height: 1.25rem; fill: currentColor; }
.brand-mark .brand-mark-door { fill: var(--immoreklame-primary); }
.navbar .nav-link { color: #3f555e; font-weight: 550; }
.navbar .nav-link:hover { color: var(--immoreklame-primary); }

.hero-section { overflow: hidden; background: radial-gradient(circle at 85% 15%, rgba(21, 93, 117, .12), transparent 30%), linear-gradient(145deg, #f8fbfb 0%, #f1f7f6 100%); }
.eyebrow { color: var(--immoreklame-primary); font-size: .78rem; font-weight: 750; letter-spacing: .095em; text-transform: uppercase; }
.hero-section h1 { color: #102e39; letter-spacing: -.045em; line-height: 1.05; }
.hero-section .lead { line-height: 1.7; }
.hero-facts { display: flex; flex-wrap: wrap; gap: .7rem 1.25rem; color: #3f555e; font-size: .9rem; }
.hero-visual { position: relative; min-height: 390px; display: grid; place-items: center; }
.hero-visual::before { content: ""; position: absolute; width: 330px; height: 330px; border-radius: 50%; background: var(--immoreklame-primary); opacity: .09; }
.listing-card { position: relative; z-index: 1; width: min(100%, 360px); background: #fff; border: 1px solid rgba(24, 49, 59, .1); border-radius: 1.2rem; box-shadow: 0 24px 60px rgba(24, 49, 59, .15); overflow: hidden; transform: rotate(1.5deg); }
.listing-image { height: 190px; background: linear-gradient(150deg, #dbe8e9, #aac8c8); position: relative; overflow: hidden; }
.listing-image::before { content: ""; position: absolute; left: 20%; right: 20%; bottom: 0; height: 68%; background: #f7faf9; clip-path: polygon(50% 0, 100% 36%, 100% 100%, 0 100%, 0 36%); }
.listing-image::after { content: ""; position: absolute; width: 35px; height: 57px; background: #86acac; bottom: 0; left: calc(50% - 17px); }
.placeholder-line { height: 10px; border-radius: 9px; background: #dce4e6; margin-bottom: .65rem; }
.portal-pill { border-radius: 2rem; padding: .3rem .55rem; background: var(--immoreklame-soft); color: var(--immoreklame-primary); font-size: .68rem; font-weight: 700; }
.status-card { position: absolute; z-index: 2; right: -5px; bottom: 33px; padding: .75rem 1rem; background: #fff; border-radius: .8rem; box-shadow: 0 12px 35px rgba(24, 49, 59, .14); font-size: .8rem; font-weight: 700; }
.status-dot { display: inline-block; width: .55rem; height: .55rem; margin-right: .35rem; background: #49a96e; border-radius: 50%; }

.section-space { padding: 5.5rem 0; }
.section-heading { max-width: 680px; }
.section-heading h2, .soft-section h2 { letter-spacing: -.03em; }
.soft-section { background: var(--immoreklame-soft); }
.process-card { padding: 2rem; border: 1px solid #e0e9ea; border-radius: 1rem; background: #fff; box-shadow: 0 8px 28px rgba(24, 49, 59, .05); }
.process-card p { color: var(--immoreklame-muted); margin-bottom: 0; line-height: 1.65; }
.process-number { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; margin-bottom: 1.3rem; border-radius: .7rem; background: var(--immoreklame-soft); color: var(--immoreklame-primary); font-weight: 800; }
.audience-list { border-top: 1px solid #cbdcdd; }
.audience-list > div { display: flex; align-items: center; gap: 1rem; padding: 1.15rem 0; border-bottom: 1px solid #cbdcdd; }
.audience-list span { color: var(--immoreklame-primary); font-size: .75rem; font-weight: 800; }

.auth-section { padding: 4rem 0 5rem; background: linear-gradient(145deg, #f7faf9, var(--immoreklame-soft)); }
.auth-card, .content-card { background: #fff; border: 1px solid rgba(24, 49, 59, .1); border-radius: 1rem; box-shadow: 0 12px 38px rgba(24, 49, 59, .07); }
.auth-card { padding: 2rem; }
.form-control, .form-select { min-height: 47px; border-color: #cbd7da; border-radius: .6rem; }
.form-control:focus, .form-select:focus { border-color: var(--immoreklame-primary); box-shadow: 0 0 0 .22rem rgba(21, 93, 117, .13); }
.form-label { color: #314a54; font-weight: 650; }

.legal-section { padding: 3.5rem 0 5rem; }
.legal-content { max-width: 860px; padding: clamp(1.5rem, 4vw, 3.5rem); }
.legal-content h1 { letter-spacing: -.035em; }
.legal-content h2 { font-size: 1.25rem; margin: 2.2rem 0 .8rem; }
.legal-content h3 { font-size: 1.05rem; margin: 1.5rem 0 .6rem; }
.legal-content p, .legal-content li { color: #40565f; line-height: 1.7; }
.legal-note { border-left: 4px solid var(--immoreklame-accent); background: #fff8eb; padding: 1rem 1.2rem; border-radius: .4rem; }

.site-footer { background: #fff; border-top: 1px solid #dfe8e9; }
.footer-brand { color: var(--immoreklame-ink); font-weight: 800; font-size: 1.1rem; }
.footer-heading { font-size: .83rem; text-transform: uppercase; letter-spacing: .07em; color: #3e555e; }
.footer-links li + li { margin-top: .45rem; }
.footer-links a { color: var(--immoreklame-muted); text-decoration: none; }
.footer-links a:hover { color: var(--immoreklame-primary); }
.footer-bottom { border-top: 1px solid #edf1f2; }
.dost-credit { display: inline-flex; align-items: center; justify-content: flex-end; gap: .65rem; color: var(--immoreklame-ink); font-weight: 700; text-decoration: none; }
.dost-credit img { width: 108px; height: auto; object-fit: contain; }
.dost-credit span { font-size: .9rem; }
.account-stat { padding: 1.25rem; background: var(--immoreklame-soft); border-radius: .8rem; }
.empty-state { padding: 3rem 1rem; border: 1px dashed #bdced2; border-radius: .9rem; text-align: center; }
.test-access-banner { padding: .65rem 1rem; color: #4d3700; background: #fff1bd; border-bottom: 1px solid #e4cf7a; text-align: center; font-size: .9rem; }

.listing-overview-card { display: block; height: 100%; overflow: hidden; color: var(--immoreklame-ink); background: #fff; border: 1px solid #dce6e8; border-radius: .9rem; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }
.listing-overview-card:hover { color: var(--immoreklame-ink); transform: translateY(-2px); box-shadow: 0 12px 28px rgba(24, 49, 59, .1); }
.listing-overview-image { display: grid; place-items: center; height: 180px; color: var(--immoreklame-muted); background: #e8f0f1; }
.listing-overview-image img { width: 100%; height: 100%; object-fit: cover; }
.listing-status { color: var(--immoreklame-primary-dark); background: #dceff1; }
.listing-status.status-pending_review { color: #634b00; background: #fff0b8; }
.listing-status.status-changes_requested { color: #842029; background: #f8d7da; }
.listing-status.status-approved { color: #0f5132; background: #d1e7dd; }
.listing-status.status-published { color: #fff; background: #2f7d4c; }
.listing-price { min-width: 180px; color: var(--immoreklame-primary-dark); font-size: 1.45rem; font-weight: 800; text-align: right; }
.listing-price small { display: block; color: var(--immoreklame-muted); font-size: .75rem; font-weight: 500; }
.listing-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.listing-gallery a { overflow: hidden; aspect-ratio: 4 / 3; border-radius: .8rem; background: #e8f0f1; }
.listing-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
.listing-gallery a:hover img { transform: scale(1.025); }
.listing-details dt, .listing-details dd { padding-top: .7rem; padding-bottom: .7rem; border-bottom: 1px solid #edf1f2; }
.listing-details dt { color: var(--immoreklame-muted); font-weight: 600; }
.listing-description { color: #40565f; line-height: 1.75; }
.image-preview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.image-preview-item { position: relative; min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dce6e8; border-radius: .65rem; background: #fff; cursor: grab; transition: opacity .15s ease, outline-color .15s ease, transform .15s ease; user-select: none; }
.image-preview-item:active { cursor: grabbing; }
.image-preview-item.is-dragging { opacity: .42; }
.image-preview-item.is-drop-target { outline: 3px solid var(--immoreklame-primary); outline-offset: 2px; transform: translateY(-2px); }
.image-preview-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; pointer-events: none; }
.image-preview-item figcaption { overflow: hidden; padding: .45rem .55rem; color: var(--immoreklame-muted); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.image-remove-button { position: absolute; z-index: 2; top: .45rem; right: .45rem; display: grid; place-items: center; width: 1.85rem; height: 1.85rem; padding: 0 0 .13rem; color: #fff; background: #c62828; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 2px 8px rgba(24, 49, 59, .35); font-size: 1.35rem; font-weight: 700; line-height: 1; cursor: pointer; transition: background-color .15s ease, transform .15s ease; }
.image-remove-button:hover, .image-remove-button:focus-visible { color: #fff; background: #9f1f1f; transform: scale(1.08); }
.image-selection-message { min-height: 1.25rem; color: var(--immoreklame-muted); }
.image-selection-message.is-error { color: #b42318; }
.py-lg-6 { padding-top: 5.5rem; padding-bottom: 5.5rem; }

@media (max-width: 991.98px) {
    .navbar-collapse { padding-top: 1rem; }
    .hero-visual { min-height: 330px; }
    .status-card { right: 5%; }
    .section-space { padding: 4rem 0; }
    .listing-gallery, .image-preview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .hero-section h1 { font-size: 2.55rem; }
    .hero-visual { min-height: 300px; }
    .listing-card { width: 92%; }
    .listing-image { height: 150px; }
    .status-card { bottom: 0; }
    .auth-card { padding: 1.35rem; }
    .dost-credit { align-items: flex-end; flex-direction: column; gap: .3rem; }
    .listing-gallery, .image-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .listing-price { text-align: left; }
}