/**
 * SCCB-PR-UI-015 — CLEAN DENSITY NORMALIZATION
 * SCCB-005: Scroll hijacking removed
 * SCCB-006: Hero viewport group removed
 * Target: Propertism Home Premium
 */

:root {
    --nav-height-desktop: 92px;
    --nav-height-mobile: 64px;
    --density-space: 1rem;
}

/* ============================================
   NATURAL DOCUMENT FLOW (SCCB-005)
   No scroll hijacking. No artificial containers.
   ============================================ */
body {
    margin: 0;
}

/* ============================================
   THE 1-LINE RHYTHM (16px)
   ID-level authority to override legacy styles
   ============================================ */
#services-section,
#about-section,
#management-section,
#reviews-section,
#properties-section,
#blog-section,
#contact-section,
section.custom-cards-section {
    padding-top: var(--density-space) !important;
    padding-bottom: var(--density-space) !important;
    min-height: auto !important;
    scroll-margin-top: var(--nav-height-desktop);
}

/* Internal Margin Purge */
#services-section .section-intro-center,
#management-section .management-preview-intro,
#reviews-section .customer-reviews-intro,
#properties-section .featured-properties-intro,
#blog-section .journal-preview-intro {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ============================================
   HERO — SHARES VIEWPORT WITH TRUST STRIP
   Hero takes remaining space after trust strip
   Both fit in exactly 1 viewport.
   ============================================ */

/* 1. Hero fills viewport MINUS trust strip space */
#home-section.hero-hybrid,
#home-section.hero-hybrid.hero-hybrid-has-image {
    position: relative;
    height: var(--hero-height) !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    display: flex;
    align-items: center;
    background: var(--brand-navy, #0A1628);
}

/* 2. Background media — absolute, fills entire hero */
#home-section .hero-hybrid-media {
    position: absolute !important;
    inset: 0;
    display: block !important;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: transparent !important;
}

/* 3. Rotator fills media */
#home-section .hero-hybrid-rotator {
    position: relative;
    width: 100%;
    height: 100%;
}

/* 4. Images fill full hero — NO height cap */
#home-section .hero-hybrid-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-height: none !important;
    object-fit: cover;
    object-position: center;
}

/* 5. Content — LEFT ALIGNED, starts from viewport edge */
#home-section .container {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 24px !important;
}

#home-section .hero-hybrid-content {
    position: relative;
    z-index: 2;
    width: 100%;
    text-align: left;
}

/* ============================================
   TRUST STRIP — FIXED HEIGHT, TEXT WRAPPING
   ============================================ */
.trust-strip-section {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
}

/* Force the small description text to wrap to 2 lines */
.trust-strip-item small {
    max-width: 90%;
    display: block;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ============================================
   CONTACT SECTION — SHARP EDGES (NO ROUNDED CORNERS)
   ============================================ */
.nri-contact-section {
    border-radius: 0 !important;
}

/* ============================================
   ABOUT SECTION — LEFT ALIGNMENT (SCCB-027)
   ============================================ */
#about-section .credibility-story-card,
#about-section .credibility-proof-card {
    padding: 2rem !important;
}

#about-section .credibility-grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr) !important;
}

#about-section .credibility-title {
    max-width: none !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#about-section .credibility-copy {
    max-width: 85ch !important;
    -webkit-line-clamp: unset !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#about-section .section-kicker {
    display: block;
    text-align: left !important;
    margin-bottom: 12px;
}

#about-section .credibility-actions {
    justify-content: flex-start !important;
}

#about-section .credibility-proof-title {
    max-width: 35ch !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    color: #FFFFFF !important;
}

#about-section .credibility-proof-copy {
    max-width: 60ch !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-bottom: 24px !important;
}

#about-section .credibility-proof-list {
    text-align: left;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* ============================================
   GLOBAL SECTION INTRO — LEFT ALIGNMENT (SCCB-027)
   ============================================ */
.management-preview-intro,
.journal-preview-intro,
.featured-properties-intro,
.section-intro-centered {
    text-align: left !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 48px !important;
}

.section-title-centered {
    font-size: clamp(1.75rem, 3vw, 2.5rem) !important;
    line-height: 1.2 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    text-align: left !important;
    color: var(--gray-900) !important;
    margin-bottom: 16px !important;
}

.section-desc-centered {
    font-size: 1.1rem !important;
    line-height: 1.6 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 85ch !important;
    text-align: left !important;
    color: var(--gray-600) !important;
}

#management-section .section-kicker,
#blog-section .section-kicker {
    display: block;
    text-align: left !important;
    margin-bottom: 12px;
}