@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700;900&display=swap");

:root {
    --design-width: 1440px;
    --desktop-max-width: 100vw;
    --color-primary: #ff4040;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-text: #000000;
    --color-text-muted: #646464;
    --color-text-secondary: #616161;
    --color-text-soft: #707070;
    --color-text-light: #a3a3a3;
    --color-surface: #f7f7f7;
    --color-surface-warm: #fff8f0;
    --color-border: #b1aaaa;
    --color-border-light: #d9d9d9;
    --color-charcoal: #414141;
    --font-primary: "Roboto", Arial, sans-serif;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    background: var(--color-white);
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    margin: 0;
    background: var(--color-white);
    color: var(--color-text);
    font-family: var(--font-primary);
    overflow-x: hidden;
}

a {
    color: inherit;
}

.scale-wrap {
    position: relative;
    width: 100vw;
    max-width: none;
    margin: 0 auto;
    overflow: hidden;
    background: var(--color-white);
}

.figma-page {
    position: relative;
    width: var(--design-width);
    margin: 0;
    background: var(--color-white);
    transform-origin: top left;
}

.layer,
.text-layer,
.real-control,
.real-submit,
.map-frame,
.section-anchor {
    position: absolute;
}

.text-layer {
    z-index: 10;
    margin: 0;
    padding: 0;
    overflow: visible;
    color: inherit;
    font-family: var(--font-primary);
    font-style: normal;
    text-decoration: none;
    white-space: pre-wrap;
}

.link-layer {
    cursor: pointer;
    text-decoration: none;
    transition: filter 160ms ease;
}

    .link-layer:hover {
        filter: brightness(1.12);
    }

.image-layer {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.img-contain {
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}

.real-control {
    z-index: 5000;
    padding: 0 20px;
    border: 0;
    outline: 0;
    background: var(--color-white);
    color: var(--color-text-muted);
    font: 400 20px/28px var(--font-primary);
}

    .real-control:focus {
        box-shadow: inset 0 0 0 2px rgba(255, 64, 64, 0.5);
    }

    .real-control::placeholder {
        color: var(--color-text-muted);
        opacity: 0.68;
    }

.real-select {
    appearance: auto;
}

.real-textarea {
    padding-top: 20px;
    resize: none;
}

.real-submit {
    z-index: 6000;
    border: 1px solid var(--color-primary);
    background: var(--color-primary);
    color: var(--color-white);
    cursor: pointer;
    font: 400 18px/21px var(--font-primary);
    transition: filter 160ms ease;
}

    .real-submit:hover {
        filter: brightness(0.95);
    }

.map-frame {
    z-index: 4000;
    border: 0;
}

.section-anchor {
    display: block;
    width: 1px;
    height: 1px;
}

.form-alert {
    position: fixed;
    z-index: 99999;
    top: 18px;
    left: 50%;
    max-width: calc(100vw - 32px);
    padding: 14px 20px;
    transform: translateX(-50%);
    background: #8b1e1e;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
    color: var(--color-white);
    font: 400 15px/1.4 Arial, sans-serif;
}

@media (max-width: 1440px) {
    .scale-wrap {
        width: 100vw;
        margin: 0;
    }
}

/* SOR index screenshot matching fixes */
.sor-main-heading {
    font-family: "Roboto", Arial, sans-serif !important;
    color: #000 !important;
    font-weight: 300 !important;
    letter-spacing: 0 !important;
}

    .sor-main-heading .sor-red-word {
        color: #ff4040 !important;
        font-weight: 800 !important;
    }

.sor-two-line-heading {
    line-height: 54px !important;
}

.sor-ready-heading .sor-red-word {
    color: #ff4040 !important;
    font-weight: 800 !important;
}
/* Hide exported vector-star blocks and draw real stars so they match the screenshot. */
.home-page [class*="home-star-"] {
    display: none !important;
}

.sor-stars {
    z-index: 2500 !important;
    font-family: Arial, sans-serif !important;
    font-size: 30px !important;
    line-height: 30px !important;
    letter-spacing: 5px !important;
    color: #000 !important;
    white-space: nowrap !important;
}
/* Clean testimonial CTA pill */
.home-rectangle-66,
.home-ellipse-3,
.home-vector-2,
.home-view-all-testimonials {
    display: none !important;
}

.sor-testimonial-btn {
    z-index: 2600 !important;
    display: flex !important;
    align-items: center !important;
    height: 70px !important;
    background: #3d3d3d !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-family: "Roboto", Arial, sans-serif !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.sor-testimonial-btn-circle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    margin-left: 9px !important;
    border-radius: 50% !important;
    background: #ff4040 !important;
    color: #fff !important;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
}

.sor-testimonial-btn-label {
    display: block !important;
    margin-left: 17px !important;
    font-size: 22px !important;
    line-height: 27px !important;
    font-weight: 400 !important;
    color: #fff !important;
    white-space: nowrap !important;
}
/* Keep red line + dots above testimonial cards sharp. */
.home-vector-3 {
    background: #ff4040 !important;
    height: 8px !important;
    border-radius: 8px !important;
}

.home-ellipse-4,
.home-ellipse-5,
.home-ellipse-6 {
    border-radius: 50% !important;
}
/* Stats icons: crisp, same red accent, and consistent visual size. */
.home-80-rental-units-icon,
.home-hands-on-experience-icon,
.home-proven-support-model-icon,
.home-growing-every-month-icon {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    image-rendering: auto !important;
    filter: none !important;
}

/* Shared SOR footer — matched to the approved desktop design. */
.sor-footer {
    position: absolute;
    left: 0;
    width: 1440px;
    height: 531px;
    overflow: hidden;
    z-index: 3000;
    color: #fff;
    font-family: "Roboto", Arial, sans-serif;
}

    .sor-footer * {
        box-sizing: border-box;
    }

.sor-footer__background {
    position: absolute;
    left: 0;
    top: -273px;
    width: 1501px;
    height: 845px;
    background: url("/assets/images/Footer%20Image.png") center/cover no-repeat;
    transform: scaleX(-1);
}

.sor-footer__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
}

.sor-footer a {
    color: inherit;
    text-decoration: none;
}

    .sor-footer a:hover {
        color: #ff4040;
    }

.sor-footer__logo {
    position: absolute;
    left: 78px;
    top: 62px;
    width: 215px;
    height: 72px;
    z-index: 2;
    background: url("/assets/images/Logo.jpeg") center/cover no-repeat;
}

.sor-footer__summary {
    position: absolute;
    left: 81px;
    top: 179px;
    width: 290px;
    margin: 0;
    z-index: 2;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    line-height: 27px;
}

.sor-footer__column {
    position: absolute;
    top: 62px;
    z-index: 2;
}

    .sor-footer__column h2 {
        height: 27px;
        margin: 0 0 30px;
        color: #ff4040;
        font-size: 20px;
        font-weight: 700;
        line-height: 27px;
    }

.sor-footer__quick-links {
    left: 429px;
    width: 180px;
}

.sor-footer__services {
    left: 667px;
    width: 310px;
}

.sor-footer__contact {
    left: 1014px;
    width: 360px;
}

.sor-footer__links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

    .sor-footer__links a {
        display: block;
        min-height: 43px;
        color: #fff;
        font-size: 18px;
        font-weight: 300;
        line-height: 43px;
        white-space: nowrap;
    }

.sor-footer__contact h2 {
    margin-bottom: 39px;
}

.sor-footer__contact-row {
    position: absolute;
    left: 8px;
    display: flex;
    align-items: flex-start;
    width: 352px;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    line-height: 31px;
}

.sor-footer__contact-row--email {
    top: 66px;
}

.sor-footer__contact-row--phone {
    top: 117px;
}

.sor-footer__contact-row--location {
    top: 172px;
}

.sor-footer__contact-icon {
    display: block;
    flex: 0 0 auto;
    margin-right: 31px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.sor-footer__contact-icon--email {
    width: 25px;
    height: 18px;
    margin-top: 7px;
    background-image: url("/assets/icons/Email%20Icon.png");
}

.sor-footer__contact-icon--phone {
    width: 24px;
    height: 24px;
    margin-top: 7px;
    margin-right: 32px;
    background-image: url("/assets/icons/Phone%20Icon.png");
}

.sor-footer__contact-icon--location {
    width: 22px;
    height: 26px;
    margin-top: 7px;
    margin-right: 34px;
    background-image: url("/assets/icons/Location%20Icon.png");
}

.sor-footer__socials {
    position: absolute;
    left: 81px;
    top: 329px;
    z-index: 2;
    display: flex;
    gap: 37px;
}

.sor-footer__social {
    width: 28px;
    height: 28px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.sor-footer__social--facebook {
    background-image: url("/assets/icons/facebook.png");
}

.sor-footer__social--google {
    background-image: url("/assets/icons/google.png");
}

.sor-footer__social--linkedin {
    background-image: url("/assets/icons/linkedin.png");
}

/*.sor-footer__divider {
    position: absolute;
    left: 379px;
    top: 454px;
    width: 981px;
    height: 1px;
    z-index: 2;
    background: rgba(255, 255, 255, 0.24);
}*/

.sor-footer__copyright {
    position: absolute;
    left: 84px;
    top: 469px;
    width: 1272px;
    margin: 0;
    z-index: 2;
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    line-height: 31px;
    text-align: center;
    white-space: nowrap;
}

/* Final home-page visual corrections — approved screenshot alignment. */

/* The exported apartment image was designed to sit inside the 868px mask.
   Clip the source image to that exact mask so no image slivers appear above
   or below the Trusted by Landlords section. */
.home-page .home-trust-image {
    clip-path: inset(27.12px 0 27.45px 0) !important;
}

/* Testimonial carousel indicator — visible and sized exactly like the reference. */
.home-page .home-vector-3 {
    display: block !important;
    width: 42px !important;
    height: 7px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #ff4040 !important;
}

.home-page .home-ellipse-4,
.home-page .home-ellipse-5,
.home-page .home-ellipse-6 {
    display: block !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
}

/* Exact 66px circular testimonial portraits from the reference design. */
.home-page .home-testimonial-avatar {
    width: 66px !important;
    height: 66px !important;
    transform: translateX(17px) !important;
    border-radius: 50% !important;
    clip-path: circle(33px at 33px 33px) !important;
    background-size: cover !important;
    background-position: center 18% !important;
    background-repeat: no-repeat !important;
}

/* Force the image caption into the same two-line composition as the reference. */
.home-page .sor-results-caption {
    text-align: center !important;
    white-space: normal !important;
}

/* Keep the enquiry area completely white up to the exact footer boundary.
   Real form controls and the submit button have higher z-index values, so
   they remain fully interactive while any exported background leakage is
   covered. */
.home-page .figma-page::after {
    content: "";
    position: absolute;
    left: 0;
    top: 4488px;
    width: 1440px;
    height: 406px;
    background: #fff;
    z-index: 2000;
    pointer-events: none;
}

/* Page-specific footer placement. The footer component itself is shared. */
.home-page .sor-footer {
    top: 4894px;
}

.services-page .sor-footer {
    top: 7769px;
}

.team-page .sor-footer {
    top: 7108px;
}

.facilitator-page .sor-footer {
    top: 2554px;
}

.faq-page .sor-footer {
    top: 3266px;
}

.contact-page .sor-footer {
    top: 2932px;
}