/* ============================================================
   portfolio-redesign.css — Condeks Portfolio 2026 Redesign
   Loaded AFTER condeks-design-system.css, overrides Webflow
   Reference: docs/CONDEKS_STYLEGUIDE.md (v2.0, LOCKED)
   ============================================================ */

/* ── Base Reset ── */
html {
    font-size: 16px !important;
}
body {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    color: #1a1a1a !important;
    background: #ffffff !important;
    padding-top: 72px !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ── Charcoal Header (matches Landing Page) ── */
.navbar_component {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 72px !important;
    min-height: 72px !important;
    background-color: #474d52 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    inset: 0 0 auto 0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12) !important;
    z-index: 1000 !important;
    border: none !important;
}
.navbar_container {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
}
.navbar_logo-link {
    flex-shrink: 0 !important;
}
.navbar_logo-link img,
.navbar_logo {
    filter: brightness(0) invert(1) !important;
    max-height: 32px !important;
}
.navbar_menu {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex: 1 !important;
    justify-content: center !important;
}
.navbar_link,
.navbar_link.w--current {
    color: rgba(255,255,255,0.75) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    background: transparent !important;
}
.navbar_link:hover,
.navbar_link.w--current:hover {
    color: #ffffff !important;
    background: rgba(255,255,255,0.1) !important;
}
.navbar_link.w--current {
    color: #ffffff !important;
    font-weight: 600 !important;
}
.button.is-navbar-button,
.navbar-auth-btn {
    background-color: #238c95 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 8px 20px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}
.button.is-navbar-button:hover,
.navbar-auth-btn:hover {
    background-color: #1d7780 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(35, 140, 149, 0.3) !important;
}
.navbar_menu-button {
    color: #ffffff !important;
}

/* ── Hero / Search Section ── */
.section_portfolio13hero {
    background: linear-gradient(180deg, #f8fafb 0%, #ffffff 100%) !important;
    padding: 64px 0 48px !important;
}
.section_portfolio13hero h1,
.portfolio13_heading-style-h2 {
    font-family: Inter, sans-serif !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    color: #1a1a1a !important;
    line-height: 1.2 !important;
}
.section_portfolio13hero .text-size-medium,
.portfolio13_hero-subtitle {
    font-size: 18px !important;
    color: #6b7280 !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    max-width: 600px !important;
    margin: 0 auto !important;
}


/* ── Search Hero — Premium 2026 Design ── */
.search-hero {
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(135deg, #f0f9fa 0%, #ffffff 40%, #f8fafb 100%) !important;
    padding: 72px 0 56px !important;
    margin-top: 0 !important;
}
.search-hero-inner {
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Floating background shapes */
.search-hero-shapes {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    z-index: 1 !important;
}
.search-hero-shapes .shape {
    position: absolute !important;
    border-radius: 50% !important;
    opacity: 0.07 !important;
}
.search-hero-shapes .shape-1 {
    width: 400px !important;
    height: 400px !important;
    background: #238c95 !important;
    top: -120px !important;
    right: -80px !important;
    animation: float-shape 20s ease-in-out infinite !important;
}
.search-hero-shapes .shape-2 {
    width: 250px !important;
    height: 250px !important;
    background: #1d7780 !important;
    bottom: -60px !important;
    left: -40px !important;
    animation: float-shape 25s ease-in-out infinite reverse !important;
}
.search-hero-shapes .shape-3 {
    width: 150px !important;
    height: 150px !important;
    background: #238c95 !important;
    top: 40% !important;
    left: 60% !important;
    animation: float-shape 18s ease-in-out infinite 3s !important;
}
@keyframes float-shape {
    0%, 100% { transform: translate(0, 0) scale(1); }
    25% { transform: translate(20px, -15px) scale(1.05); }
    50% { transform: translate(-10px, 20px) scale(0.95); }
    75% { transform: translate(15px, 10px) scale(1.02); }
}

/* Hero Text */
.search-hero-text {
    text-align: center !important;
    margin-bottom: 40px !important;
}
.search-hero-title {
    font-family: Inter, -apple-system, sans-serif !important;
    font-size: 3rem !important;
    font-weight: 800 !important;
    color: #1a1a1a !important;
    margin: 0 0 14px 0 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.15 !important;
}
.search-hero-subtitle {
    font-family: Inter, -apple-system, sans-serif !important;
    font-size: 1.1rem !important;
    color: #6b7280 !important;
    margin: 0 auto !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    max-width: 560px !important;
}

/* ── Search Card ── */
.search-card {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.06) !important;
    padding: 8px !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.search-card:hover {
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 12px 32px rgba(0,0,0,0.09) !important;
}
.search-card:focus-within {
    border-color: #238c95 !important;
    box-shadow: 0 0 0 3px rgba(35, 140, 149, 0.12), 0 12px 32px rgba(0,0,0,0.08) !important;
}
.search-card-inner {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    background: #f8fafb !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Search input group */
.search-input-group {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    min-width: 200px !important;
    position: relative !important;
}
.search-input-icon {
    position: absolute !important;
    left: 16px !important;
    display: flex !important;
    align-items: center !important;
    pointer-events: none !important;
    opacity: 0.6 !important;
    transition: opacity 0.2s ease !important;
}
.search-input-group:focus-within .search-input-icon {
    opacity: 1 !important;
}
.search-main-input {
    width: 100% !important;
    padding: 16px 16px 16px 48px !important;
    border: none !important;
    background: transparent !important;
    font-family: Inter, -apple-system, sans-serif !important;
    font-size: 15px !important;
    color: #1a1a1a !important;
    outline: none !important;
    line-height: 1.5 !important;
}
.search-main-input::placeholder {
    color: #9ca3af !important;
    font-weight: 400 !important;
}

/* Divider between sections */
.search-divider {
    width: 1px !important;
    height: 28px !important;
    background: #e5e7eb !important;
    flex-shrink: 0 !important;
}

/* Dropdown triggers */
.search-dropdown-trigger {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 16px 18px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: background 0.15s ease !important;
    min-width: 140px !important;
    background: transparent !important;
    border: none !important;
}
.search-dropdown-trigger:hover {
    background: rgba(35, 140, 149, 0.04) !important;
}
.search-dropdown-trigger.is-disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}
.search-dropdown-label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
}
.search-dropdown-value {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
}
.search-dropdown-chevron {
    margin-left: auto !important;
    transition: transform 0.2s ease !important;
    flex-shrink: 0 !important;
}

/* Dropdown menu */
.search-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    min-width: 300px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 40px rgba(0,0,0,0.12) !important;
    z-index: 1001 !important;
    padding: 8px !important;
    animation: dropdown-in 0.18s ease-out !important;
}
@keyframes dropdown-in {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}
.search-dropdown-option {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 11px 14px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    transition: all 0.15s ease !important;
}
.search-dropdown-option:hover {
    background: #f0f9fa !important;
    transform: translateX(2px) !important;
}
.search-dropdown-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}
.search-dropdown-option .selected-check {
    margin-left: auto !important;
}

/* Search submit button */
.search-submit-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 14px 28px !important;
    background: #238c95 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    font-family: Inter, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    margin: 4px !important;
    flex-shrink: 0 !important;
    line-height: 1.5 !important;
}
.search-submit-btn:hover {
    background: #1d7780 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(35, 140, 149, 0.35) !important;
}
.search-submit-btn:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(35, 140, 149, 0.25) !important;
}
.search-submit-btn svg {
    flex-shrink: 0 !important;
}

/* ── Stats Bar ── */
.search-hero-stats {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 32px !important;
    margin-top: 40px !important;
}
.search-stat {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
}
.search-stat-number {
    font-family: Inter, -apple-system, sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #238c95 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.3 !important;
}
.search-stat-label {
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    color: #9ca3af !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}
.search-stat-divider {
    width: 1px !important;
    height: 32px !important;
    background: #e5e7eb !important;
}

/* ── Search Mobile Responsive ── */
@media (max-width: 768px) {
    .search-hero {
        padding: 48px 0 36px !important;
    }
    .search-hero-title {
        font-size: 2rem !important;
    }
    .search-hero-subtitle {
        font-size: 0.95rem !important;
    }
    .search-card-inner {
        flex-direction: column !important;
    }
    .search-input-group {
        min-width: 100% !important;
    }
    .search-divider {
        width: 80% !important;
        height: 1px !important;
        margin: 0 auto !important;
    }
    .search-dropdown-trigger {
        width: 100% !important;
        justify-content: space-between !important;
    }
    .search-submit-btn {
        width: calc(100% - 8px) !important;
        justify-content: center !important;
        margin: 4px !important;
        padding: 16px !important;
    }
    .search-hero-stats {
        gap: 20px !important;
    }
    .search-stat-number {
        font-size: 1.2rem !important;
    }
    .search-dropdown-menu {
        left: 0 !important;
        right: 0 !important;
        min-width: unset !important;
    }
}


/* ── Filter Section ── */
.section_filters5 {
    background: #ffffff !important;
    padding: 24px 0 !important;
}
/* Filter tags */
.filter-tag {
    background: #e7f4f5 !important;
    color: #238c95 !important;
    border: 1px solid rgba(35, 140, 149, 0.2) !important;
    border-radius: 9999px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 4px 12px !important;
    transition: all 0.15s ease !important;
}
.filter-tag:hover {
    background: #d1ecef !important;
}
.filter-tag .remove-filter {
    color: #238c95 !important;
    margin-left: 6px !important;
}
.reset-all-filters {
    background: #238c95 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border: none !important;
    padding: 6px 14px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}
.reset-all-filters:hover {
    background: #1d7780 !important;
}
/* Sort/filter toggles */
.advanced-filter-toggle {
    color: #238c95 !important;
    font-weight: 500 !important;
    cursor: pointer !important;
}
.advanced-filter-toggle:hover {
    color: #1d7780 !important;
}

/* ── Property Cards — Modern 2026 ── */
.portfolio13_list {
    gap: 24px !important;
}
.portfolio13_item {
    transition: all 0.2s ease !important;
}
.portfolio13_item-link {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-decoration: none !important;
    display: block !important;
}
.portfolio13_item-link:hover {
    border-color: #238c95 !important;
    box-shadow: 0 8px 25px rgba(35, 140, 149, 0.12), 0 4px 10px rgba(0,0,0,0.06) !important;
    transform: translateY(-3px) !important;
}
/* Card image */
.portfolio13_image-wrapper {
    border-radius: 12px 12px 0 0 !important;
    overflow: hidden !important;
    position: relative !important;
}
.portfolio13_image-wrapper img {
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.portfolio13_item-link:hover .portfolio13_image-wrapper img {
    transform: scale(1.03) !important;
}
/* Badge stack */
.portfolio13_badge-stack {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    z-index: 2 !important;
}
.portfolio13_kategorie-tag {
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur(8px) !important;
    color: #1a1a1a !important;
    border-radius: 9999px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 4px 10px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
    border: none !important;
}
.portfolio13_top-tag {
    background: #238c95 !important;
    color: #ffffff !important;
    border-radius: 9999px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 4px 10px !important;
    box-shadow: 0 1px 4px rgba(35, 140, 149, 0.3) !important;
}
/* Card content */
.portfolio13_content {
    padding: 16px !important;
}
.portfolio13_content h3,
.portfolio13_heading-style-h6 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    margin-bottom: 4px !important;
}
.portfolio13_text-wrapper .text-size-small {
    color: #6b7280 !important;
    font-size: 13px !important;
}
/* Card price/size row */
.portfolio13_price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}
.portfolio13_details-button,
.portfolio13_button {
    background: transparent !important;
    color: #238c95 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    border: 1px solid #238c95 !important;
    border-radius: 8px !important;
    padding: 6px 16px !important;
    transition: all 0.15s ease !important;
}
.portfolio13_details-button:hover,
.portfolio13_button:hover {
    background: #238c95 !important;
    color: #ffffff !important;
}
/* Reserved overlay */
.reserved-overlay {
    background: rgba(0,0,0,0.55) !important;
    backdrop-filter: blur(2px) !important;
    border-radius: 12px !important;
}
.reserved-overlay span {
    background: rgba(255,255,255,0.95) !important;
    color: #1a1a1a !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    padding: 8px 20px !important;
}

/* ── Results Count ── */
.results-count {
    font-size: 14px !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
}
.results-count strong {
    color: #1a1a1a !important;
}

/* ── Empty State ── */
.empty-state-message {
    text-align: center !important;
    padding: 64px 24px !important;
    color: #6b7280 !important;
}

/* ── Skeleton Loader ── */
.skeleton-loader {
    background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%) !important;
    background-size: 200% 100% !important;
    animation: skeleton-shimmer 1.5s infinite ease-in-out !important;
    border-radius: 8px !important;
}
@keyframes skeleton-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── Charcoal Footer (matches Landing) ── */
.portfolio-footer {
    background: #474d52 !important;
    color: #ffffff !important;
    padding: 48px 0 32px !important;
}
.portfolio-footer a {
    color: rgba(255,255,255,0.7) !important;
    text-decoration: none !important;
    transition: color 0.15s ease !important;
}
.portfolio-footer a:hover {
    color: #ffffff !important;
}
.portfolio-footer h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
    color: #ffffff !important;
}
.portfolio-footer .footer-grid {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr 1fr !important;
    gap: 48px !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
}
.portfolio-footer .footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.15) !important;
    margin-top: 32px !important;
    padding-top: 24px !important;
    text-align: center !important;
    color: rgba(255,255,255,0.5) !important;
    font-size: 13px !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}
.portfolio-footer .footer-tagline {
    color: rgba(255,255,255,0.5) !important;
    font-size: 14px !important;
    margin-top: 12px !important;
    line-height: 1.5 !important;
}
.portfolio-footer .footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.portfolio-footer .footer-links li {
    margin-bottom: 8px !important;
}
.portfolio-footer .footer-links li a {
    font-size: 14px !important;
}
.portfolio-footer .social-icons {
    display: flex !important;
    gap: 10px !important;
    margin-top: 16px !important;
}
.portfolio-footer .social-icons a {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.15s ease !important;
}
.portfolio-footer .social-icons a:hover {
    background: #238c95 !important;
}

/* ── Mobile Responsive ── */
@media (max-width: 767px) {
    body { padding-top: 64px !important; }
    .navbar_component { height: 64px !important; min-height: 64px !important; }
    .section_portfolio13hero { padding: 40px 0 32px !important; }
    .section_portfolio13hero h1,
    .portfolio13_heading-style-h2 { font-size: 28px !important; }
    .section_portfolio13hero .text-size-medium { font-size: 15px !important; }
    .portfolio-footer .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }
    .top-search-container,
    [style*="background: black"] {
        flex-direction: column !important;
        border-radius: 12px !important;
        padding: 12px !important;
    }
}
@media (min-width: 768px) and (max-width: 1023px) {
    .portfolio-footer .footer-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 32px !important;
    }
}

/* ── Dropdown Menus in Search ── */
.category-options-container,
.subcategory-grid {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08) !important;
    padding: 8px !important;
}
.category-option,
.subcategory-option {
    padding: 8px 14px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.1s ease !important;
    font-size: 14px !important;
    color: #1a1a1a !important;
}
.category-option:hover,
.subcategory-option:hover {
    background: #e7f4f5 !important;
    color: #238c95 !important;
}
.category-option.selected,
.subcategory-option.selected {
    background: #238c95 !important;
    color: #ffffff !important;
}

/* ── Utility: Hide Webflow Badge ── */


/* ============================================================
   PORTFOLIO CARDS — 2026 Premium Redesign
   Fixes card content, typography, spacing per CONDEKS_STYLEGUIDE
   ============================================================ */

/* ── Card Wrapper — Enhanced ── */
.portfolio13_item-link {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
}
.portfolio13_item-link:hover {
    border-color: rgba(35, 140, 149, 0.3) !important;
    box-shadow: 0 8px 30px rgba(35, 140, 149, 0.1), 0 4px 12px rgba(0,0,0,0.06) !important;
    transform: translateY(-4px) !important;
}

/* ── Card Content Area ── */
.portfolio13_title-wrapper {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
}

.portfolio13_item-content-top {
    flex: 1 !important;
}

/* Property ID — Muted Label */
.portfolio13_item-content-top .heading-style-h6.text-color-gray {
    color: #9ca3af !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
}

/* Property Title — Location */
.portfolio13_item-content-top .heading-style-h6:not(.text-color-gray) {
    color: #1a1a1a !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.4 !important;
    letter-spacing: -0.01em !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* ── Price/Size Tag List ── */
.portfolio13_tag-list {
    display: flex !important;
    gap: 0 !important;
    margin-top: 16px !important;
    padding-top: 14px !important;
    border-top: 1px solid #f3f4f6 !important;
}

.portfolio13_tag-item {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.portfolio13_tag-item > div:first-child {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #9ca3af !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

.portfolio13_tag-item > div:first-child strong {
    font-weight: 500 !important;
    color: #9ca3af !important;
}

.portfolio13_tag-item-value {
    display: flex !important;
    align-items: baseline !important;
    gap: 3px !important;
}

.portfolio13_tag-item-value .text-size-regular {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.3 !important;
}

.portfolio13_tag-item-value .text-size-regular:last-child {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
}

/* Hide filter fields in card */
.portfolio13_tag-item-filter {
    display: none !important;
}

/* ── Card Footer / CTA ── */
.portfolio13_button-wrapper {
    padding: 14px 20px !important;
    border-top: 1px solid #f3f4f6 !important;
    background: #fafbfc !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-top: auto !important;
}

.portfolio13_button-wrapper .button.is-text.is-icon {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #238c95 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.portfolio13_button-wrapper .button.is-text.is-icon:hover {
    color: #1d7780 !important;
    gap: 10px !important;
}

/* ── Reserved Overlay — Premium ── */
.reserviert {
    position: absolute !important;
    inset: 0 !important;
    z-index: 5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(3px) !important;
    border-radius: 12px !important;
}

.reserviert-block {
    background: rgba(255, 255, 255, 0.95) !important;
    padding: 10px 28px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

.reserviert-block .heading-style-h4 {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin: 0 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
}

/* ── Badge Refinement ── */
.portfolio13_kategorie-tag {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(10px) !important;
    color: #1a1a1a !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 5px 10px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
    border: 1px solid rgba(255,255,255,0.6) !important;
}

.portfolio13_kategorie-tag .text-size-small {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: inherit !important;
}

.portfolio13_top-tag {
    background: #238c95 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 5px 10px !important;
    box-shadow: 0 2px 8px rgba(35, 140, 149, 0.25) !important;
    border: none !important;
}

.portfolio13_top-tag .text-size-small {
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* ── Card Image ── */
.portfolio13_image-wrapper {
    position: relative !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
    background: #f3f4f6 !important;
}

.portfolio13_image-wrapper img,
.portfolio13_image-wrapper .mapbox-image-container {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.portfolio13_image-wrapper .mapbox-image-container img {
    position: absolute !important;
    inset: 0 !important;
}

/* ── Portfolio Grid ── */
.portfolio13_list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
    gap: 24px !important;
}

.portfolio13_item {
    position: relative !important;
}

@media (max-width: 767px) {
    .portfolio13_list {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .portfolio13_title-wrapper {
        padding: 16px !important;
    }

    .portfolio13_tag-item-value .text-size-regular {
        font-size: 15px !important;
    }

    .portfolio13_button-wrapper {
        padding: 12px 16px !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .portfolio13_list {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}


/* ============================================================
   EXPOSE PAGE — 2026 Premium Redesign
   Property detail page styling per CONDEKS_STYLEGUIDE
   ============================================================ */

/* ── Breadcrumb ── */
.breadcrumb_component {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-bottom: 24px !important;
    font-size: 13px !important;
}

.breadcrumb-link {
    color: #6b7280 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.15s ease !important;
}

.breadcrumb-link:hover {
    color: #238c95 !important;
}

.breadcrumb-link.is-active {
    color: #1a1a1a !important;
    font-weight: 600 !important;
}

.breadcrumb-divider {
    color: #d1d5db !important;
}

/* ── Back Button ── */
.button-back {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
    background: #f3f4f6 !important;
    color: #6b7280 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.button-back:hover {
    background: #e7f4f5 !important;
    color: #238c95 !important;
}

/* ── Gallery Section ── */
.section_portfolio-header {
    background: #ffffff !important;
}

.portfolio-header_component {
    margin-top: 8px !important;
}

/* ── Expose Content — Text Area ── */
.expose-text-info-wrapper {
    flex: 1 !important;
}

.expose-text-info-wrapper .heading-style-h3 {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.3 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
}

.expose-text-info-wrapper .heading-style-h4 {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    margin: 0 !important;
}

/* ── Property Heading (section titles in rich text) ── */
.property-heading {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin: 1.8em 0 0.8em 0 !important;
    border-left: 3px solid #238c95 !important;
    padding-left: 14px !important;
    line-height: 1.4 !important;
}

/* ── Property Text ── */
.property-paragraph {
    margin: 0.8em 0 !important;
    line-height: 1.7 !important;
    color: #374151 !important;
    font-size: 15px !important;
}

.property-paragraph strong {
    color: #1a1a1a !important;
    font-weight: 600 !important;
}

.property-paragraph em {
    color: #238c95 !important;
}

/* ── Expose Sidebar — Property Details Card ── */
.portfolio-header_portfolio-details {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 28px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    position: sticky !important;
    top: 96px !important;
}

/* ── Sidebar Detail Rows ── */
.portfolio-line-flex-horizontal {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #f3f4f6 !important;
    gap: 12px !important;
}

.portfolio-line-flex-horizontal:last-of-type {
    border-bottom: none !important;
}

.portfolio-line-flex-horizontal .heading-style-h4 {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    margin: 0 !important;
}

.portfolio-line-flex-horizontal .text-size-regular.text-weight-bold,
.portfolio-line-flex-horizontal .text-weight-bold {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
}

.portfolio-line-flex-horizontal .text-size-regular:not(.text-weight-bold) {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
}

.portfolio-line-flex-horizontal .wert-mit-einheit {
    display: flex !important;
    align-items: baseline !important;
    gap: 3px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
}

/* ── Sidebar Vertical Rows ── */
.portfolio-line-flex-vertical {
    padding: 12px 0 !important;
    border-bottom: 1px solid #f3f4f6 !important;
}

.portfolio-line-flex-vertical .text-weight-bold {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
    margin-bottom: 6px !important;
}

.portfolio-line-flex-vertical .text-size-tiny {
    font-size: 11px !important;
    color: #9ca3af !important;
    margin-top: 4px !important;
}

/* ── Usage Type Tags ── */
.nutzungsart-tag {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin: 4px 4px 4px 0 !important;
}

/* ── Feature Tags in Expose ── */
.portfolio-header_portfolio-details [style*="flex-wrap: wrap"] span {
    background-color: #e7f4f5 !important;
    color: #238c95 !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
}

/* ── Print / PDF Button ── */
.print-button-wrapper {
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid #f3f4f6 !important;
}

.print-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 12px 24px !important;
    background: #238c95 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.print-button:hover {
    background: #1d7780 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(35, 140, 149, 0.3) !important;
    color: #ffffff !important;
}

/* ── Inquiry Form — Guest ── */
.guest-inquiry-form {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 28px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

.guest-inquiry-form h1 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 20px !important;
}

.guest-inquiry-form .form-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
    margin-bottom: 16px !important;
}

.guest-inquiry-form .form-field {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.guest-inquiry-form label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #374151 !important;
}

.guest-inquiry-form .pflichtfeld {
    color: #991b1b !important;
    margin-left: 2px !important;
}

.guest-inquiry-form input,
.guest-inquiry-form textarea {
    padding: 10px 14px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: Inter, -apple-system, sans-serif !important;
    color: #1a1a1a !important;
    background: #ffffff !important;
    transition: all 0.2s ease !important;
    width: 100% !important;
}

.guest-inquiry-form input:focus,
.guest-inquiry-form textarea:focus {
    border-color: #238c95 !important;
    box-shadow: 0 0 0 3px rgba(35, 140, 149, 0.1) !important;
    outline: none !important;
}

.guest-inquiry-form textarea {
    min-height: 100px !important;
    resize: vertical !important;
}

.guest-inquiry-form .submit-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 12px 24px !important;
    background: #238c95 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    margin-top: 8px !important;
}

.guest-inquiry-form .submit-btn:hover {
    background: #1d7780 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(35, 140, 149, 0.3) !important;
}

.guest-inquiry-form .required-note {
    font-size: 12px !important;
    color: #9ca3af !important;
    margin-top: 12px !important;
    text-align: center !important;
}

@media (max-width: 768px) {
    .guest-inquiry-form .form-row {
        grid-template-columns: 1fr !important;
    }

    .guest-inquiry-form {
        padding: 20px !important;
    }
}

/* ── Contact Provider Button (logged in) ── */
.portfolio-header_anfrage .contact-provider-btn {
    background: #238c95 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 12px 28px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.portfolio-header_anfrage .contact-provider-btn:hover {
    background: #1d7780 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(35, 140, 149, 0.3) !important;
}

/* ── Expose Content Bottom Layout ── */
.portfolio-header_content-bottom {
    gap: 32px !important;
    margin-top: 24px !important;
    align-items: start !important;
}

@media (max-width: 1024px) {
    .portfolio-header_content-bottom {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .portfolio-header_portfolio-details {
        position: static !important;
    }
}

/* ── Kontakt Modal Refinements ── */
.kontakt-modal-content {
    border-radius: 16px !important;
    border: none !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}

.kontakt-modal-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}

.kontakt-form-label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #374151 !important;
}

.kontakt-form-input {
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    transition: all 0.2s ease !important;
}

.kontakt-form-input:focus {
    border-color: #238c95 !important;
    box-shadow: 0 0 0 3px rgba(35, 140, 149, 0.1) !important;
}

/* ── Spacer Overrides ── */
.spacer-small {
    height: 8px !important;
}
.spacer-xsmall {
    height: 4px !important;
}
.spacer-xlarge {
    height: 32px !important;
}

/* ── Expose — Section Headings ── */
.section_portfolio-header .heading-style-h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    letter-spacing: -0.02em !important;
}

.section_portfolio-header .heading-style-h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
}

/* ── Expose — Rich Text ── */
.section_portfolio-header .w-richtext {
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: #374151 !important;
}

.section_portfolio-header .w-richtext p {
    margin-bottom: 12px !important;
}

/* ── Expose — Status Indicator ── */
.property-status-indicator {
    flex-shrink: 0 !important;
}

/* ── Print Styles — Hide ── */
@media print {
    .portfolio-footer,
    .navbar_component,
    .portfolio-header_anfrage {
        display: none !important;
    }
}

/* ── Expose Feature Tags — Premium ── */
.expose-feature-section {
    margin-top: 16px !important;
    padding-top: 12px !important;
    border-top: 1px solid #f3f4f6 !important;
}

.expose-feature-label {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
    margin-bottom: 10px !important;
}

.expose-feature-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.expose-feature-tag {
    display: inline-block !important;
    background-color: #e7f4f5 !important;
    color: #238c95 !important;
    padding: 4px 12px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    transition: all 0.15s ease !important;
}

.expose-feature-tag:hover {
    background-color: #d1ecef !important;
}

/* ── Expose Contact Section ── */
.expose-contact-section {
    padding: 32px !important;
    text-align: center !important;
    background: #f8fafb !important;
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
}

.expose-contact-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 20px !important;
}