/* =============================================
   RJ Executive Search - Modern Base Vanilla CSS
   ============================================= */



/* Raleway (Latin) - Regular (400) */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/raleway-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Raleway (Latin) - Medium (500) */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/raleway-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Raleway (Latin) - SemiBold (600) */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(../fonts/raleway-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* Icon Font */
@font-face {
    font-family: "mjdps";
    src: url(../fonts/mjdps.eot);
    src: url(../fonts/mjdps.eot) format("embedded-opentype"),
        url(../fonts/mjdps.woff2) format("woff2"),
        url(../fonts/mjdps.woff) format("woff"),
        url(../fonts/mjdps.ttf) format("truetype"),
        url(../fonts/mjdps.svg) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: block;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
    font-family: "mjdps";
    font-style: normal;
    font-weight: 400;
    display: inline-block;
    text-decoration: inherit;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-phone-squared:before {
    content: "\f098";
}

.icon-mail-squared:before {
    content: "\f199";
}

.icon-facebook-squared:before {
    content: "\f308";
}

.icon-linkedin-squared:before {
    content: "\f30c";
}

:root {
    /* Brand Colors */
    --color-primary: #426fc4;
    --color-secondary: #f55b63;
    --color-green: #bce13b;
    --color-blue-light: #42a3ee;
    --color-yellow: #e6e837;
    --color-gold: #e8c537;

    /* Neutral Colors */
    --color-text: #777;
    --color-text-light: #999;
    --color-text-dark: #333;
    --color-gray: #686868;
    --color-gray-dark: #525252;
    --color-white: #ffffff;
    --color-off-white: #fdfdfd;
    --color-bg-gray: #f6f6f6;
    --color-border: #eee;
    --color-border-light: #ddd;
    --color-footer-bg: #181a1f;

    /* Overlays */
    --overlay-dark: rgba(0, 0, 0, 0.75);
    --overlay-dark-medium: rgba(0, 0, 0, 0.5);
    --overlay-dark-light: rgba(0, 0, 0, 0.2);
    --overlay-dark-lighter: var(--overlay-dark-lighter);
    --overlay-dark-subtle: rgba(0, 0, 0, 0.07);
    --overlay-white-low: rgba(255, 255, 255, 0.2);
    --overlay-white-medium: var(--overlay-white-medium);
    --overlay-white-very-low: rgba(255, 255, 255, 0.1);
    --overlay-primary-low: rgba(66, 111, 196, 0.1);

    /* Typography */
    --font-main: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-heading: "Raleway", sans-serif;
    --font-icon: "mjdps";

    /* Layout */
    --container-width: 1140px;
    --grid-gutter: 30px;

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;

    /* Shadows */
    --shadow-base: var(--shadow-base);
    --shadow-card: 0 2px 16px rgba(0, 0, 0, 0.07);
    --shadow-large: 0 5px 20px rgba(0, 0, 0, 0.1);
    --shadow-table: 0 4px 7px -3px rgba(0, 0, 0, 0.5);
}

/* --- Basic Reset --- */
html {
    scrollbar-gutter: stable;
    overflow-y: scroll;
    /* Force scrollbar to prevent jumps */
}

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

body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin: 0;
}

ul,
ol {
    list-style: none;
    padding: 0;
}

ul.circle {
    list-style: circle;
    padding: 10px 2px 40px 60px;
}

.circle li {
    margin-bottom: 13px;
}

.list-none {
    list-style: none;
    padding: 0;
    margin: 0;
}

img {
    max-width: 100%;
    display: block;
}

h5 {
    font-size: 14px;
}

/* Mobile Image Styling for Who We Are page */
@media (max-width: 767px) {
    .who-we-are-img {
        width: 75% !important;
        margin: 0 auto 20px !important;
        float: none !important;
    }
}

a {
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}

body {
    font-family: var(--font-main);
    color: var(--color-text);
    background-color: var(--color-off-white);
    line-height: 1.6;
}

main {
    display: block;
}

/* Screen reader only - hides content visually but keeps it for accessibility/SEO */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* --- Grid Emulation (Bootstrap-compatible) --- */
.container {
    width: 100%;
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 15px;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

[class*="col-"] {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

@media (min-width: 768px) {

    /* Semantic percentage-based column classes */
    .col-25 {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-33 {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-42 {
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }

    .col-50 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-58 {
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-67 {
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }

    .col-75 {
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-100 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    /* Legacy Bootstrap-style aliases (for backward compatibility during migration) */
    .col-sm-3 {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-sm-4 {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-sm-5 {
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }

    .col-sm-6 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-sm-7 {
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-sm-8 {
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }

    .col-sm-9 {
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-sm-12 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-sm-offset-1 {
        margin-left: 8.333333%;
    }

    .col-sm-offset-2 {
        margin-left: 16.666667%;
    }
}

/* Parallax Backgrounds */
.parallax-bg {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    background-position: 50% 50% !important;
    position: relative;
}

.parallax-bg:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--overlay-dark);
}

.parallax-bg .container {
    position: relative;
    z-index: 2;
}

@media (max-width: 767px) {
    .parallax-bg {
        background-attachment: scroll !important;
        /* Better performance on mobile */
    }
}

/* Page header parallax with handshake background */
.parallax-bg.stories {
    background-image: url(/assets/images/shake-small.jpg);
}

/* Utility Classes */
.text-center {
    text-align: center;
}

.white-color {
    color: var(--color-white);
}

.pd-t-33 {
    padding-top: 33px;
}

.pd-t-80 {
    padding-top: 80px;
}

.pd-b-50 {
    padding-bottom: 50px;
}

.pd-b-30 {
    padding-bottom: 30px;
}

.space-30 {
    height: 30px;
}

.space-80 {
    height: 80px;
}

.hero-slider {
    min-height: 400px;
    /* Prevent jump before JS/Images load */
    background: var(--color-bg-gray);
}

.margin-b-30 {
    margin-bottom: 30px;
}

.center-title h2 {
    text-transform: uppercase;
    padding: 45px 0 15px 0;
    color: var(--color-primary);
    position: relative;
    font-size: 33px;
    font-weight: 600;
    font-family: var(--font-heading);
}

.center-title h2:after {
    content: "";
    width: 120px;
    height: 3px;
    background: var(--color-primary);
    position: absolute;
    left: 50%;
    bottom: 10px;
    margin-left: -60px;
}

.center-title h3 {
    text-transform: uppercase;
    padding-bottom: 15px;
    color: var(--color-primary);
    position: relative;
    font-size: 49px;
    font-weight: 600;
    font-family: var(--font-heading);
}

.center-title h3:after {
    content: "";
    width: 120px;
    height: 3px;
    background: var(--color-primary);
    position: absolute;
    left: 50%;
    bottom: 10px;
    margin-left: -60px;
}

/* --- Header & Navigation --- */
.site-header {
    background: var(--color-white);
    border-bottom: 1px solid var(--color-off-white);
    position: relative;
    z-index: 1001;
}

.container-logo {
    display: flex;
    justify-content: center;
    /* Center logo on desktop */
    padding-bottom: 10px;
}

.header-logo {
    /* Matched to live site */
    width: auto;
    max-width: 100%;
}

.site-nav {
    background: var(--color-white);
    border-top: 0;
    border-bottom: 0;
}

.nav-mobile-header {
    display: none;
    justify-content: center;
    /* Center logo on mobile header */
    align-items: center;
    padding: 10px 15px;
    position: relative;
}

.navbar-nav {
    display: flex;
    justify-content: center;
    /* Center links on desktop */
    flex-wrap: nowrap;
    /* Prevent wrapping to multiple lines */
    list-style: none;
    margin: 0;
    padding: 0;
}

.navbar-nav li a {
    display: block;
    padding: 15px 10px;
    /* Refined padding for single-line fit */
    white-space: nowrap;
    /* Keep text on one line */
    color: var(--color-gray);
    /* Matched "lighter" gray from live site */
    text-decoration: none;
    font-family: 'Raleway', sans-serif;
    /* Matched to live site */
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    transition: color 0.3s;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.navbar-nav li a:hover {
    color: var(--color-primary);
}

nav ul li a::after {
    content: '';
    position: relative;
    display: block;
    height: 1px;
    background: var(--color-primary);
    bottom: 0;
    left: 0;
    width: 100%;
    transform: scaleX(0);
    transform-origin: bottom center;
    transition: transform 0.3s ease-out;
}

.navbar-nav li a:hover::after {
    transform: scaleX(1);
}

/* Mobile Nav */
.nav-mobile-header {
    display: none;
    justify-content: center;
    /* Center logo on mobile header */
    align-items: center;
    padding: 10px 15px;
    position: relative;
}

.mobile-brand img {
    height: 65px;
    /* User requested 65px on mobile */
    width: auto;
}

.navbar-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    /* User requested no background */
    border: none;
    padding: 9px 10px;
}

.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    background-color: var(--color-primary);
    /* User requested blue lines (var(--color-primary)) */
    border-radius: 1px;
}

.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 4px;
}

/* --- Footer --- */
.site-footer {
    background: var(--color-footer-bg);
    color: var(--color-bg-gray);
    padding: 50px 0 0;
    font-family: var(--font-main);
    font-size: 15px;
}

.site-footer a {
    color: var(--color-bg-gray);
    text-decoration: none;
    transition: color 0.3s;
    font-size: 17px
}

.site-footer a:hover {
    color: var(--color-primary);
}

.site-footer h4 {
    position: relative;
    text-transform: uppercase;
    font-size: 20px;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--overlay-white-low);
    font-family: var(--font-heading);
    font-weight: 600;
    color: var(--color-white);
}

.site-footer h4:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 3px;
    margin-bottom: -1.5px;
    background: var(--color-white);
}

.site-footer h4 a {
    color: var(--color-white);
    text-decoration: none;
    font-size: 20px;
}

.footer-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 60px;
}

.footer-section {
    flex: 1 1 300px;
    margin-bottom: 40px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-social {
    display: flex;
    gap: 15px;
}

.footer-social a {
    font-size: 50px;
}

.footer-social a:hover {
    color: var(--color-primary);
}

/* Testimonials / Story Boxes */
.footer-story {
    margin-bottom: 30px;
}

.footer-story-box {
    background: var(--color-white);
    padding: 25px 30px;
    border-radius: 4px;
    position: relative;
    margin-bottom: 20px;
}

.footer-story-box:after {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 40px;
    border-width: 15px 25px 0 0;
    border-style: solid;
    border-color: var(--color-white) transparent transparent transparent;
}

/* Restore bubble for main testimonials (Home & Success Stories) */
.story-box .story-text:after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 40px;
    border-width: 25px 45px 0 0;
    border-style: solid;
    border-color: var(--color-white) transparent transparent transparent;
}

.footer-story-box p {
    color: var(--color-gray-dark);
    font-style: italic;
    margin: 0;
    line-height: 1.6;
}

.footer-story cite {
    display: block;
    color: var(--color-primary);
    font-weight: 600;
    font-size: 14px;
    padding-left: 10px;
    font-style: normal;
}

.footer-section p {
    margin-bottom: 12px;
}

/* Footer Contact */
.footer-contact p {
    margin-bottom: 12px;
}

.footer-contact a {
    color: var(--color-primary);
    font-size: 22px;
    font-weight: 300;
}

.footer-contact a:hover {
    color: var(--color-white);
}

.footer-contact i {
    margin-right: 8px;
    font-size: 24px;
}

/* Footer Bottom / Copyright */
.footer-bottom {
    background: var(--color-footer-bg);
    padding: 20px 0;
    border-top: 1px solid var(--overlay-white-very-low);
}

.footer-bottom p {
    font-size: 12px;
    color: var(--overlay-white-medium);
    margin: 0;
}

/* Icon Fonts Restoration */
[class^="icon-"]:before,
[class*=" icon-"]:before {
    font-family: var(--font-icon);
    font-style: normal;
    font-weight: 400;
    display: inline-block;
    text-decoration: inherit;
}

/* Mobile Specific Styles */
@media (max-width: 767px) {
    .container-logo {
        display: none;
    }

    .nav-mobile-header {
        display: flex;
    }

    .mobile-brand img {
        height: 65px;
    }

    .navbar-collapse {
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background-color: var(--color-white);
        z-index: 1000;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-in-out;
        box-shadow: 0 4px 6px var(--overlay-dark-lighter);
    }

    .navbar-collapse.in {
        max-height: 100vh;
        overflow-y: auto;
        scrollbar-width: none;
    }

    .navbar-nav {
        flex-direction: column;
        gap: 0;
    }

    .navbar-nav li {
        border-bottom: 1px solid var(--color-border);
        text-align: center;
    }

    .navbar-nav a {
        padding: 12px 15px;
    }

    .navbar-toggle {
        background: transparent;
        border: 0px;
        padding: 9px 10px;
        border-radius: 4px;
        cursor: pointer;
    }

    .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        background-color: var(--color-text-dark);
        border-radius: 1px;
    }

    .icon-bar+.icon-bar {
        margin-top: 4px;
    }
}

/* ===== Migrated Critical Styles from style.min.css ===== */

/* Utility Classes */
.white-color {
    color: var(--color-off-white) !important;
}

.center-title {
    padding-bottom: 50px;
    text-align: center;
}

.text-capitalize {
    text-transform: capitalize;
}

.img-responsive {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Heading Styles */
.heading-title h1 {
    text-transform: uppercase;
    padding-bottom: 15px;
    color: var(--color-primary);
    position: relative;
    font-weight: 600;
    font-family: var(--font-heading);
    font-size: 4vmax;
}

.heading-title h1:after {
    content: "";
    width: 120px;
    height: 3px;
    background: var(--color-primary);
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -60px;
}

/* Button Styles */
.btn {
    font-weight: 500;
    color: white;
    font-size: 20px;
    text-transform: capitalize;
    border: 0;
    border-radius: 2px;
    padding: 12px 18px;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    background-color: var(--color-primary);
}

.btn-lg {
    padding: 14px 30px;
}

.btn-yg {
    padding: 15px 40px;
    font-size: 20px;
    margin: 0 20px;
}

.btn-theme-bg {
    background: var(--color-primary);
    color: var(--color-white);
    box-shadow: var(--shadow-base);
}

.btn-theme-bg:hover {
    background: var(--color-text-dark);
    color: var(--color-white);
}

.btn-theme-bg:focus {
    background: var(--color-primary);
    color: var(--color-white);
}

/* Testimonial / Story Styles */

.stories {
    padding: 90px 0 60px;
}

/* Masonry Layout for Stories */
.stories-masonry {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
}

@media (max-width: 768px) {
    .stories-masonry {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}

.story-box {
    margin-bottom: 40px;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
    display: inline-block;
    /* Fixes some column rendering quirks */
    width: 100%;
}

div.story-text {
    font-style: italic;
    font-size: 16px;
    padding: 30px;
    background: var(--color-white);
    position: relative;
    border: 4px solid var(--color-white);
    margin-bottom: 20px;
    box-shadow: var(--shadow-large);
    border-radius: 3px;
}

.story-info {
    font-size: 18px;
    display: inline-block;
    color: var(--color-primary);
    vertical-align: middle;
    position: relative;
    /* Fix visibility over parallax overlay */
    z-index: 1;
}

/* Ensure story info is white on dark parallax backgrounds */
.parallax-bg .story-info,
.parallax-bg .story-info em {
    color: var(--color-white);
}

.story-info img {
    display: inline-block;
    margin-right: 10px;
}


.story-info em {
    font-size: 18px;
    color: var(--color-text-light);
}

/* Team Masonry Layout */
.team-masonry {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 30px;
    -moz-column-gap: 30px;
    column-gap: 30px;
}

@media (max-width: 768px) {
    .team-masonry {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}

.team-card {
    margin-bottom: 30px;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
    display: inline-block;
    width: 100%;

    background: var(--color-white);
    padding: 20px;
    border-radius: 3px;
    box-shadow: var(--shadow-card);
}

.team-card img.who-we-are-img {
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 3px;
}

/* Traditional Layout Util */
.team-member-row {
    margin-bottom: 30px;
    background: var(--color-white);
    padding: 30px 20px;
    border-radius: 3px;
    box-shadow: var(--shadow-card);
}

.team-member-row h3 {
    font-size: 27px;
}

.team-member-row h4 {
    color: var(--color-primary);
    margin: 7px 0;
    font-size: 15px;
}

@media (max-width: 768px) {
    .team-member-row {
        margin: 20px;
    }
}

/*Contact Sidebar */
.contact-info a {
    font-size: 24px;
}

.contact-block h3 {
    font-size: 33px;
}

.contact-info p {
    padding-top: 16px;
}

.f-socials-large a {
    font-size: 32px;
}

/* Contact Form Styles */
#formblock {
    background: var(--color-white);
    border-radius: 2px;
    box-shadow: var(--shadow-card);
    padding: 2rem 1.5rem;
    max-width: 100%;
    margin: 2rem auto;
}

#contactForm .fields {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

#contactForm .field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

#contactForm label {
    font-weight: 600;
    color: var(--color-text-dark);
    font-size: 14px;
}

#contactForm input,
#contactForm textarea {
    padding: 12px 15px;
    border: 1px solid var(--color-border-light);
    border-radius: 4px;
    font-size: 15px;
    font-family: inherit;
    transition: border-color 0.2s ease;
}

#contactForm input:focus,
#contactForm textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--overlay-primary-low);
}

#contactForm .submit {
    margin-top: 1rem;
}

#contactForm .hidden {
    display: none;
}

.processing {
    font-size: 33px;
    color: var(--color-primary);
    font-weight: 600;
}

.required {
    color: var(--color-secondary);
}

/* Contact Method Buttons */
.contact-method-group {
    display: flex;
    gap: 10px;
    margin-top: 5px;
}

.btn-method {
    flex: 1;
    padding: 12px;
    background: var(--color-light);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    color: var(--color-text);
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
}

.btn-method:hover {
    background: #e9e9e9;
    border-color: #ccc;
}

.btn-method.active {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

#contactForm input:disabled {
    background-color: #f5f5f5;
    cursor: not-allowed;
    opacity: 0.7;
}

/* Contact Success */

.success-icon {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
}

.success-icon svg {
    width: 48px;
    height: 48px;
    color: var(--color-primary);
}

.success-heading {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 1rem;
}

.success-body {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.success-divider {
    border: none;
    height: 1px;
    background: var(--color-border-light);
    margin: 1.5rem 0;
}

.success-subtitle {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 1rem;
}

.success-btn-group {
    display: flex;
    gap: 1rem;
}

.btn-ghost {
    background: transparent;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    padding: 0.5rem 1rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-ghost:hover {
    background: var(--color-primary);
    color: var(--color-white);
}

/* Table Styles */
.table {
    width: 100%;
    margin-bottom: 20px;
    box-shadow: var(--shadow-table);
    background: var(--color-white);
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    padding: 20px 25px 10px 25px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid var(--color-border-light);
}

.table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid var(--color-border-light);
}

/* Checklist Styles */
ul.check {
    list-style: none;
    padding-left: 0;
}

ul.check li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 18px;
}

ul.check li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: -5px;
    font-weight: bold;
    font-size: 20px;
}

/* Advantage Cards (Refactored from Tables) */
.advantage-card {
    padding: 30px 20px;
    height: 100%;
    color: #fff;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.advantage-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15);
}

.advantage-card h3 {
    text-align: center;
    margin-top: 0;
    margin-bottom: 25px;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 700;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding-bottom: 15px;
    color: #fff;
    /* Ensure white text */
}

.advantage-card-content {
    flex-grow: 1;
}



.bg-red-brick {
    background-color: #a52e2b;
}

.bg-blue-slate {
    background-color: #375f80;
}

.bg-grey-steel {
    background-color: #5d5d5e;
}