/* ============================================================
   LOCATION PAGE
   Built to visually align with TrustDeedInvestments.cshtml.
   Most typography comes from the existing TDI classes in main.css.
   This file should only handle location-page-specific layout,
   backgrounds, spacing, and small component differences.
   ============================================================ */


/* HERO */

#location-bg {
    background-color:#0C5D96;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    height:calc(58vh + 140px);
    min-height:690px;
    margin-top:-140px;

    background-image:
        linear-gradient(
            90deg,
            rgba(0, 83, 143, 0.92) 0%,
            rgba(0, 83, 143, 0.88) 35%,
            rgba(0, 83, 143, 0.72) 65%,
            rgba(0, 83, 143, 0.58) 100%
        ),
        url('/media/l2kecyfi/orange-country-header.png');
}

#location-bg .tdi-header-title {
    max-width:900px;
}

#location-bg .tdi-p {
    max-width:650px;
    line-height:26px;
}

#location-bg .tdi-header-img {
    width:100%;
    max-width:520px;
}

.loc-header-title {
    margin-top: 0px!important;
    width: 98%;
    color:#FFF!important;
    font-style: italic;
    letter-spacing: 3px;
}


/* SHARED SECTION SPACING */

.loc-section-white {
    padding:90px 0px 100px 0px;
    background-color:#FFF;
}

.loc-section-gray {
    padding:90px 0px 100px 0px;
    background-color:#FAFAFA;
}

.loc-section-white .tdi-section-p p,
.loc-section-gray .tdi-section-p p {
    line-height:28px;
}


/* TWO COLUMN TDI TABLE */

.loc-table-two-col > [class*="col-"] {
    flex:0 0 50%;
    width:50%;
    max-width:50%;
    float:none;
}

.loc-table-note {
    font-family:'Barlow';
    font-size:13px;
    color:#777;
    margin-top:12px;
    text-align:left;
}


/* LOAN USE CARDS */

.loc-use-box {
    min-height:220px;
}

.loc-use-icon,
.loc-property-icon {
    color:#F28D48;
    font-size:38px;
    margin-bottom:15px;
}

.loc-card-row-two {
    margin-top:30px;
}


/* PROPERTY TYPE CARDS */

.loc-property-box {
    min-height:165px;
    align-items:flex-start;
}

.loc-property-icon {
    min-width:50px;
    margin-right:20px;
    margin-bottom:0;
}


/* SUBMARKETS */

.loc-submarkets-section {
    padding:90px 0px 100px 0px;
    background-color:#0C5D96;
}

.loc-title-light {
    color:#FFF !important;
}

.loc-copy-light,
.loc-copy-light p {
    color:#FFF !important;
}

.loc-market-row {
    display:flex;
    align-items:flex-start;
    padding:24px 0px;
    border-top:1px solid rgba(255,255,255,0.25);
}

.loc-market-row:last-child {
    border-bottom:1px solid rgba(255,255,255,0.25);
}

.loc-market-name {
    width:28%;
    padding-right:30px;
    color:#F28D48;
    font-family:'Barlow Condensed';
    font-size:28px;
    line-height:30px;
    font-weight:500;
    text-transform:uppercase;
}

.loc-market-copy {
    width:72%;
    color:#FFF;
    font-family:'Barlow';
    font-size:17px;
    line-height:25px;
}


/* WHY SO-CAL */

.loc-why-box {
    min-height:230px;
}


/* PROCESS */

.loc-process-section {
    padding:90px 0px 100px 0px;
    background-color:#0C5D96;
}

.loc-process-box {
    min-height:275px;
}


/* FAQ */

.loc-faq-plus {
    display:block;
    color:#0C5D96;
    font-family:'Barlow';
    font-size:30px;
    line-height:22px;
    transition:transform .3s ease;
}

.tdi-faq-box.active .loc-faq-plus {
    transform:rotate(180deg);
}


/* FINAL CTA */

.loc-contact-bg {
    background-color:#0C5D96;
    background-image:
        linear-gradient(
            rgba(12, 93, 150, 0.92),
            rgba(12, 93, 150, 0.92)
        ),
        url('/media/REPLACE/orange-county-water.jpg');
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
}

.loc-contact-label-main {
    text-align:left;
}

.loc-contact-title {
    color:#FFF !important;
    text-align:left;
    margin-top:10px;
}

.loc-contact-copy,
.loc-contact-copy p {
    color:#FFF !important;
    text-align:left;
}

.loc-contact-list {
    margin-top:30px;
    color:#FFF;
    font-family:'Barlow';
    font-size:17px;
    line-height:1.6;
}

.loc-contact-list > div {
    position:relative;
    padding-left:22px;
    margin-bottom:8px;
}

.loc-contact-list > div:before {
    content:"";
    position:absolute;
    left:0;
    top:9px;
    width:8px;
    height:8px;
    border-radius:50%;
    background-color:#F28D48;
}

.loc-form-title {
    color:#0C5D96;
    font-family:'Barlow Condensed';
    font-size:32px;
    font-weight:500;
    margin-bottom:5px;
    letter-spacing:0;
}

.loc-form-intro {
    margin-bottom:25px;
}

.loc-submit-btn {
    margin-top:10px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width:991px) {

    #location-bg {
        height:auto;
        min-height:0;
        padding-bottom:70px;
    }

    #location-bg .tdi-header-img {
        max-width:460px;
    }

    .loc-use-box,
    .loc-why-box,
    .loc-process-box,
    .loc-property-box {
        min-height:0;
        margin-bottom:25px;
    }

    .loc-card-row-two {
        margin-top:0;
    }
}


@media (max-width:768px) {

    #location-bg {
        background-position:36% 0% !important;
        height:auto !important;
        min-height:0;
        margin-top:-70px !important;
        padding-top:100px !important;
        padding-bottom:60px;
    }

    #location-bg .tdi-header-label {
        margin-top:20px !important;
    }

    #location-bg .tdi-header-title {
        width:100%;
    }

    #location-bg .tdi-header-img {
        width:80%;
        display:block;
        margin:30px auto 0px auto;
    }

    .loc-section-white,
    .loc-section-gray,
    .loc-submarkets-section,
    .loc-process-section {
        padding:60px 0px 70px 0px;
    }

    .loc-market-row {
        display:block;
        padding:22px 0px;
    }

    .loc-market-name,
    .loc-market-copy {
        width:100%;
        padding-right:0;
    }

    .loc-market-name {
        margin-bottom:8px;
        font-size:24px;
        line-height:26px;
    }

    .loc-market-copy {
        font-size:16px;
        line-height:23px;
    }

    .loc-contact-label-main,
    .loc-contact-title,
    .loc-contact-copy,
    .loc-contact-copy p {
        text-align:center;
    }

    .loc-contact-list {
        margin-bottom:35px;
    }

    .loc-table-two-col > [class*="col-"] {
        flex:0 0 50%;
        width:50%;
        max-width:50%;
    }
}