/* Starkwood Properties Inc. — 2026 UI polish layer
   Keeps the original visual direction while improving typography,
   spacing, accessibility, responsiveness, and visual consistency. */

:root {
    --primary: #0b2e1d;
    --primary-light: #17492f;
    --primary-dark: #061a10;
    --accent: #c99a5a;
    --accent-dark: #a97739;
    --accent-light: #efd7b6;
    --bg: #fbfaf7;
    --bg-light: #f5f2ec;
    --text: #17211b;
    --text-light: #3f4943;
    --text-muted: #6d776f;
    --border: #e6e0d7;
    --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-sans: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --shadow-sm: 0 4px 14px rgba(6, 26, 16, .07);
    --shadow-md: 0 12px 34px rgba(6, 26, 16, .10);
    --shadow-lg: 0 24px 58px rgba(6, 26, 16, .14);
}

html { scroll-padding-top: 92px; }
body {
    font-size: 16px;
    line-height: 1.65;
    letter-spacing: 0;
    background: var(--bg);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { font-family: var(--font-sans); }
h1, h2, h3, h4, h5, h6, .logo-text {
    font-family: var(--font-serif);
    font-weight: 650;
    letter-spacing: -.025em;
}
p { line-height: 1.75; }
a, button, input, select, textarea { outline-offset: 3px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(201, 154, 90, .55);
}
::selection { color: #fff; background: var(--primary); }

.skip-link {
    position: fixed;
    left: 16px;
    top: 12px;
    z-index: 99999;
    transform: translateY(-180%);
    padding: 10px 16px;
    border-radius: 8px;
    background: #fff;
    color: var(--primary);
    box-shadow: var(--shadow-md);
    font-weight: 700;
}
.skip-link:focus { transform: translateY(0); }

.container { max-width: 1240px; padding-inline: clamp(20px, 3vw, 36px); }
.section { padding: clamp(72px, 8vw, 108px) 0; }
.section-header-center { max-width: 780px; margin-inline: auto; margin-bottom: clamp(42px, 5vw, 64px); }
.section-label { font-size: .72rem; letter-spacing: .22em; }
.section-title { font-size: clamp(2.35rem, 4vw, 3.7rem); line-height: 1.02; margin-bottom: 22px; }
.section-desc { max-width: 690px; font-size: 1rem; }

.header { padding: 14px 0; }
.header::before { background: linear-gradient(to bottom, rgba(4, 14, 9, .68), rgba(4, 14, 9, .20), transparent); }
.header.scrolled {
    padding: 10px 0;
    background: rgba(6, 26, 16, .94);
    border-bottom: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(14px) saturate(135%);
}
.header-inner { min-height: 58px; }
.logo img { height: 54px; max-width: 170px; object-fit: contain; }
.nav-list { gap: 4px; }
.nav-item a { padding: 10px 13px; font-size: .86rem; font-weight: 650; }
.header-actions .btn { min-height: 44px; padding: 10px 20px; }
.header.scrolled .hamburger span { background: #fff; }

.btn {
    min-height: 48px;
    padding: 12px 26px;
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: .01em;
}
.btn::before { pointer-events: none; }
.btn-lg { min-height: 54px; padding: 14px 32px; }
.btn-primary:hover, .btn-accent:hover, .btn-outline-dark:hover { transform: translateY(-1px); }

.hero { min-height: 720px; }
.hero-bg { background-position: center 54%; animation-duration: 22s; }
.hero-overlay {
    background:
        linear-gradient(90deg, rgba(4, 18, 11, .88) 0%, rgba(4, 18, 11, .62) 47%, rgba(4, 18, 11, .24) 100%),
        linear-gradient(0deg, rgba(4, 18, 11, .55), transparent 45%);
}
.hero-content { max-width: 820px; padding-top: 76px; }
.hero-label {
    border: 1px solid rgba(239, 215, 182, .35);
    background: rgba(6, 26, 16, .28);
    backdrop-filter: blur(8px);
}
.hero-title { font-size: clamp(3rem, 6.1vw, 5.35rem); line-height: .98; letter-spacing: -.045em; text-wrap: balance; }
.hero-subtitle { max-width: 690px; font-size: clamp(1rem, 1.5vw, 1.14rem); color: rgba(255,255,255,.86); }
.hero-actions { gap: 12px; }
.hero-trust { margin-top: 30px; }
.hero-scroll { opacity: .72; }

.stats-bar { box-shadow: 0 10px 32px rgba(6, 26, 16, .11); }
.stat-item { min-height: 126px; }
.stat-number { font-size: clamp(2rem, 3vw, 2.8rem); }

.about-image-wrap, .featured-image, .location-visual, .project-image-wrap { border-radius: var(--radius-lg); }
.about-img-main, .featured-image img, .project-image-wrap img { border-radius: inherit; }
.about-img-main { box-shadow: var(--shadow-lg); }
.about-badge, .image-badge { border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(12px); }

.why-card, .journey-card, .contact-card, .project-card, .feature-card, .quick-info-item {
    border-color: var(--border);
}
.why-card, .journey-card, .contact-card, .project-card, .contact-form-card, .contact-message-panel {
    box-shadow: var(--shadow-sm);
}
.why-card:hover, .journey-card:hover, .contact-card:hover, .project-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.amenities-section { background: linear-gradient(155deg, var(--primary-dark), var(--primary)); }
.amenity-card { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.055); }
.amenity-card:hover { background: rgba(255,255,255,.10); }

.gallery-item, .gallery-full-item { border-radius: 18px; overflow: hidden; background: #e9e6df; }
.gallery-item img, .gallery-full-item img { object-position: center; }
.gallery-overlay { opacity: .78; }
.gallery-item:hover .gallery-overlay { opacity: 1; }

.page-hero { height: clamp(390px, 44vw, 520px); padding-bottom: 62px; }
.page-hero::before {
    background: linear-gradient(90deg, rgba(4,18,11,.88), rgba(4,18,11,.42) 65%, rgba(4,18,11,.20));
}
.page-title { font-size: clamp(2.8rem, 5.2vw, 4.5rem); line-height: 1; }
.page-subtitle { font-size: 1.05rem; max-width: 660px; }

.form-group { margin-bottom: 20px; }
.form-group label { font-size: .82rem; font-weight: 750; }
.form-control {
    min-height: 52px;
    padding: 13px 15px;
    border-radius: 10px;
    background: #fff;
    border-color: #ded8ce;
}
textarea.form-control { min-height: 145px; }
.form-control:hover { border-color: #c9c0b4; }
.form-control:focus { border-color: var(--accent-dark); box-shadow: 0 0 0 4px rgba(201,154,90,.13); }
.form-control.error { border-color: var(--error); }
.error-message { display: block; margin-top: 7px; color: #b42318; font-size: .78rem; font-weight: 650; }
.form-success, .form-error-summary { border-radius: 10px; }
.form-status {
    display: none;
    margin-bottom: 18px;
    padding: 13px 15px;
    border-radius: 10px;
    font-size: .88rem;
    font-weight: 650;
}
.form-status.show { display: block; }
.form-status.success { color: #05603a; background: #e8f7ef; border: 1px solid #a7dec2; }
.form-status.error { color: #8f1d18; background: #fff0ef; border: 1px solid #f0b7b4; }

.quick-info-bar { border-bottom: 1px solid var(--border); }
.quick-info-item { min-width: 0; }
.qi-text p { overflow-wrap: anywhere; }

.final-cta::before {
    background-image: url('../images/estelle-woods-wesidence-phase-2.webp');
    opacity: .075;
}
.cta-inner { gap: 32px; }

.footer { background: #070b08; }
.footer-main { padding-top: 78px; }
.footer-logo img { height: 84px; width: auto; object-fit: contain; }
.footer-col h4 { color: #fff; }
.footer-links a, .footer-contact-list span { line-height: 1.65; }
.footer-bottom { border-top-color: rgba(255,255,255,.09); }

.floating-main-btn { width: 56px; height: 56px; background: var(--primary); border: 1px solid rgba(255,255,255,.22); }
.scroll-top { width: 46px; height: 46px; }

img { content-visibility: auto; }
iframe { border-radius: 16px; }

@media (max-width: 1080px) {
    .nav-list { display: none; }
    .hamburger { display: flex; }
    .header-actions > .btn { display: none; }
    .hero-title { font-size: clamp(3rem, 7vw, 4.7rem); }
}

@media (max-width: 768px) {
    body { font-size: 15px; padding-bottom: 70px; }
    .container { padding-inline: 20px; }
    .header { padding: 9px 0; background: rgba(6,26,16,.88); backdrop-filter: blur(12px); }
    .header-inner { min-height: 54px; }
    .logo img { height: 45px; max-width: 145px; }
    .hero { min-height: 680px; height: 88svh; align-items: flex-end; padding-bottom: 76px; }
    .hero-bg { background-position: 60% center; }
    .hero-overlay {
        background: linear-gradient(0deg, rgba(4,18,11,.94) 0%, rgba(4,18,11,.68) 58%, rgba(4,18,11,.30) 100%);
    }
    .hero-content { padding-top: 80px; }
    .hero-title { font-size: clamp(2.7rem, 12vw, 4rem); line-height: .98; }
    .hero-subtitle { font-size: .98rem; line-height: 1.7; }
    .hero-actions { flex-direction: column; align-items: stretch; }
    .hero-actions .btn { width: 100%; }
    .hero-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .hero-scroll { display: none; }
    .section-title { font-size: clamp(2.1rem, 10vw, 3rem); }
    .section-desc { font-size: .94rem; }
    .section-label::before, .section-label::after { width: 20px; }
    .page-hero { height: 430px; padding-bottom: 44px; margin-top: 0; }
    .page-title { font-size: clamp(2.6rem, 12vw, 3.7rem); }
    .quick-info-inner { grid-template-columns: 1fr 1fr; }
    .quick-info-item { padding: 20px 16px; }
    .cta-inner { grid-template-columns: 1fr; }
    .cta-actions { width: 100%; }
    .cta-actions .btn { flex: 1 1 100%; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 24px; }
    .footer-brand { grid-column: 1 / -1; }
    .footer-bottom { padding-bottom: 90px; }
    .mobile-menu { width: min(92vw, 390px); }
}

@media (max-width: 576px) {
    .hero { min-height: 640px; }
    .hero-title { font-size: clamp(2.35rem, 12vw, 3.25rem); }
    .stats-bar-inner { grid-template-columns: 1fr 1fr; }
    .stat-item { min-height: 106px; padding: 18px 10px; }
    .stat-number { font-size: 1.8rem; }
    .quick-info-inner { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-brand { grid-column: auto; }
    .footer-main { padding-top: 60px; }
    .footer-logo img { height: 72px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    [data-aos] { opacity: 1 !important; transform: none !important; }
}

/* ===== v1.3 CONSISTENT SITE NAVIGATION ===== */
.header .container {
    max-width: 1440px;
}
.header-inner {
    gap: clamp(12px, 1.5vw, 24px);
}
.header nav {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: center;
}
.nav-list {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: center;
}
.nav-item {
    flex: 0 0 auto;
}
.nav-item a {
    white-space: nowrap;
    padding-inline: clamp(8px, .82vw, 13px);
}
.header-actions .btn {
    white-space: nowrap;
}

@media (max-width: 1240px) and (min-width: 1181px) {
    .header .logo img { height: 48px; max-width: 148px; }
    .nav-item a { padding-inline: 8px; font-size: .82rem; }
    .header-actions .btn { padding-inline: 16px; font-size: .82rem; }
}

/* Switch to the complete mobile menu before desktop links can collide. */
@media (max-width: 1180px) {
    .header nav { display: none; }
    .hamburger { display: flex; }
    .header-actions .btn { display: none; }
    .header-actions { gap: 8px; }
}