/* About/Services/Contact also load the dark template (custom.css), whose
   body background is near-black. Those pages wrap their content in <main>,
   which the dark homepage does NOT use, so scope the light base to <main>
   to avoid bleeding the light theme onto the homepage. */
main {
    background: #ffffff;
    color: #2a3342;
}

.content-hero {
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: 128px 0 90px;
    background:
        radial-gradient(circle at 85% 10%, rgba(196, 74, 28, .24), transparent 35%),
        linear-gradient(145deg, #0e1624 0%, #151f31 55%, #24160f 100%);
    color: #fff;
}

.content-hero h1 {
    color: #fff;
    font-size: clamp(2.7rem, 7vw, 5.7rem);
    line-height: .98;
    letter-spacing: -.045em;
    overflow-wrap: break-word;
}

.content-hero h1 span {
    color: #f1845a;
}

.content-hero p {
    max-width: 760px;
    margin-top: 24px;
    color: #ccd3df;
    font-size: clamp(1.05rem, 2vw, 1.25rem);
    line-height: 1.7;
}

.content-section-page {
    position: relative;
    z-index: 1;
    padding: 92px 0;
    background: #ffffff;
}

.content-section-page.alt {
    background: #f5f7fb;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: #c44a1c;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .78rem;
}

.content-section-page h2 {
    color: #152033;
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.1;
    letter-spacing: -.03em;
    overflow-wrap: break-word;
}

.lead-copy {
    color: #5e687a;
    font-size: 1.08rem;
    line-height: 1.8;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-top: 44px;
}

.feature-card {
    padding: 28px;
    border: 1px solid #e0e4ec;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 50px rgba(20, 30, 50, .06);
}

/* Equal-height only inside the auto grids, not when reused as standalone
   info boxes (e.g. the contact page columns, where height:100% stretched
   a single card to the full row height and overlapped the next section). */
.feature-grid .feature-card {
    height: 100%;
}

.feature-card .icon {
    display: grid;
    width: 52px;
    height: 52px;
    margin-bottom: 22px;
    place-items: center;
    border-radius: 15px;
    background: #fff0e9;
    color: #c44a1c;
    font-size: 1.25rem;
}

.feature-card h3 {
    margin-bottom: 12px;
    color: #172033;
    font-size: 1.25rem;
}

.feature-card p {
    margin: 0;
    color: #606a7c;
    line-height: 1.72;
}

.process-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    counter-reset: process;
    margin-top: 42px;
}

.process-item {
    counter-increment: process;
    position: relative;
    padding: 26px 22px;
    border-radius: 18px;
    background: #172033;
    color: #fff;
}

.process-item::before {
    content: "0" counter(process);
    display: block;
    margin-bottom: 28px;
    color: #f1845a;
    font-size: .85rem;
    font-weight: 800;
}

.process-item h3 {
    color: #fff;
    font-size: 1.12rem;
}

.process-item p {
    margin: 10px 0 0;
    color: #c8d0dd;
    font-size: .93rem;
    line-height: 1.65;
}

.trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    overflow: hidden;
    border: 1px solid #e2e5ec;
    border-radius: 18px;
    background: #e2e5ec;
}

.trust-item {
    padding: 25px;
    background: #fff;
    text-align: center;
}

.trust-item strong {
    display: block;
    color: #172033;
    font-size: 1.06rem;
}

.trust-item span {
    color: #657084;
    font-size: .88rem;
}

.page-cta {
    padding: 56px;
    border-radius: 26px;
    background: linear-gradient(130deg, #c44a1c, #f07d50);
    color: #fff;
}

.page-cta h2,
.page-cta p {
    color: #fff;
}

/* Branded "company" visual (replaces the old placeholder image) */
.company-visual {
    position: relative;
    overflow: hidden;
    padding: 42px 40px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 82% 4%, rgba(240, 125, 80, .30), transparent 46%),
        linear-gradient(158deg, #1b2742 0%, #111a2b 60%, #0e1624 100%);
    box-shadow: 0 26px 60px rgba(16, 24, 40, .22);
}

.company-visual-tag {
    display: inline-flex;
    align-items: center;
    margin-bottom: 30px;
    padding: 8px 15px;
    border-radius: 999px;
    background: rgba(241, 132, 90, .16);
    color: #f4a684;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.mini-timeline {
    position: relative;
    margin: 0;
    padding: 4px 0 4px 32px;
    list-style: none;
}

.mini-timeline::before {
    content: "";
    position: absolute;
    left: 9px;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: linear-gradient(#f07d50, rgba(240, 125, 80, .12));
}

.mini-timeline li {
    position: relative;
    padding-bottom: 24px;
}

.mini-timeline li:last-child {
    padding-bottom: 0;
}

.mt-dot {
    position: absolute;
    left: -32px;
    top: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #0e1624;
    border: 2px solid #f07d50;
    box-shadow: 0 0 0 4px rgba(240, 125, 80, .12);
}

.mini-timeline li.is-final .mt-dot {
    background: #f07d50;
}

.mt-label {
    display: block;
    color: #fff;
    font-size: 1.06rem;
    font-weight: 700;
}

.mt-sub {
    display: block;
    margin-top: 2px;
    color: #aab4c6;
    font-size: .9rem;
}

/* Branded "archive" visual on the Services page (replaces placeholder image) */
.archive-visual {
    padding: 36px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 12% 6%, rgba(240, 125, 80, .26), transparent 44%),
        linear-gradient(158deg, #1b2742 0%, #111a2b 60%, #0e1624 100%);
    box-shadow: 0 26px 60px rgba(16, 24, 40, .22);
}

.archive-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 24px;
}

.archive-tile {
    padding: 22px 20px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .08);
}

.archive-tile i {
    display: grid;
    width: 42px;
    height: 42px;
    margin-bottom: 14px;
    place-items: center;
    border-radius: 12px;
    background: rgba(241, 132, 90, .16);
    color: #f4a684;
    font-size: 1.05rem;
}

.archive-tile strong {
    display: block;
    color: #fff;
    font-size: 1rem;
}

.archive-tile em {
    display: block;
    margin-top: 3px;
    color: #aab4c6;
    font-size: .85rem;
    font-style: normal;
}

.site-footer-compact {
    padding: 52px 0 28px;
    background: #0d1420;
    color: #c4ccda;
}

.site-footer-compact h3 {
    color: #fff;
}

.site-footer-compact a {
    color: #c4ccda;
}

.site-footer-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr 1fr;
    gap: 38px;
}

.site-footer-links {
    display: grid;
    gap: 9px;
}

.footer-newsletter-inline {
    display: grid;
    gap: 10px;
}

.footer-newsletter-inline input[type="email"] {
    width: 100%;
    min-height: 46px;
    border: 1px solid #354055;
    border-radius: 12px;
    background: #141e2e;
    color: #fff;
    padding: 0 14px;
}

.footer-newsletter-inline button[type="submit"] {
    min-height: 44px;
    border: 0;
    border-radius: 12px;
    background: #c44a1c;
    color: #fff;
    font-weight: 800;
}

.site-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px;
    margin-top: 38px;
    padding-top: 22px;
    border-top: 1px solid #273247;
    font-size: .86rem;
}

@media (max-width: 991px) {
    .feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .process-list,
    .trust-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .content-hero {
        padding: 104px 0 64px;
    }

    .content-hero h1 {
        font-size: clamp(2.1rem, 8vw, 3rem);
    }

    .content-section-page h2 {
        font-size: clamp(1.6rem, 6.5vw, 2.2rem);
    }

    .content-section-page {
        padding: 64px 0;
    }

    .feature-grid,
    .process-list,
    .trust-strip,
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .page-cta {
        padding: 34px 24px;
    }
}