/* CCI Outsourcing & Payroll page styles. Same base as /market-research (from /mystery-shopping), Raleway/Open Sans, navy #112363. */

        :root {
            --navy: #112363;
            --navy-2: #123b62;
            --red: #ff6f05;
            --red-dark: #ff6f05;
            --red-soft: #fff4ec;
            --ink: #172033;
            --muted: #687386;
            --light: #f5f7fa;
            --line: #e4e9ef;
            --white: #ffffff;
            --shadow-sm: 0 8px 24px rgba(8, 27, 51, 0.06);
            --shadow-md: 0 18px 45px rgba(8, 27, 51, 0.10);
            --shadow-lg: 0 28px 70px rgba(8, 27, 51, 0.13);
            --radius-sm: 12px;
            --radius-md: 18px;
            --radius-lg: 24px;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: 'Open Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            color: var(--ink);
            line-height: 1.65;
            background: var(--white);
        }

        .main-page {
            overflow: hidden;
        }

        .text-navy {
            color: var(--navy) !important;
        }

        /* Buttons & Actions */
        .btn-group-wrap {
            display: flex;
            flex-wrap: wrap;
            gap: 16px;
            align-items: center;
        }

        .btn {
            border-radius: 10px;
            font-weight: 700;
            padding: 13px 26px;
            font-size: 0.95rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            transition: all .25s ease;
        }

        .btn:hover {
            transform: translateY(-2px);
        }

        .btn-primary {
            background-color: var(--red);
            border-color: var(--red);
            color: #fff;
            box-shadow: 0 8px 20px rgba(255, 111, 5, .25);
        }

        .btn-primary:hover,
        .btn-primary:focus,
        .btn-primary:active {
            background-color: var(--red-dark) !important;
            border-color: var(--red-dark) !important;
            color: #fff !important;
            box-shadow: 0 12px 25px rgba(255, 111, 5, .35);
        }

        .btn-outline-light {
            border-width: 2px;
            border-color: rgba(255, 255, 255, 0.7);
            color: #fff;
        }

        .btn-outline-light:hover {
            background-color: #fff;
            color: var(--navy);
            border-color: #fff;
        }

        .eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            font-size: .75rem;
            font-weight: 800;
            letter-spacing: .14em;
            color: var(--red);
            margin-bottom: 16px;
            text-transform: uppercase;
        }

        .eyebrow::before {
            content: "";
            width: 24px;
            height: 2px;
            background: currentColor;
            border-radius: 99px;
        }

        /* Hero Section */
        .hero-section {
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(circle at 82% 22%, rgba(255,255,255,.08), transparent 28%),
                linear-gradient(125deg, var(--navy) 0%, var(--navy-2) 100%);
            color: #fff;
            padding: 120px 0 95px;
        }

        .hero-section h1 {
            font-size: clamp(2.6rem, 5vw, 4.4rem);
            line-height: 1.08;
            letter-spacing: -.03em;
            font-weight: 850;
            margin: 0 0 16px;
        }

        .hero-section h1 span {
            color: #ff6f05;
        }

        .hero-lead {
            font-size: 1.35rem;
            line-height: 1.4;
            font-weight: 600;
            color: #f1f5f9;
            margin-bottom: 14px;
        }

        .hero-copy {
            font-size: 1.02rem;
            line-height: 1.7;
            color: #cbd6e3;
            max-width: 620px;
            margin-bottom: 28px;
        }

        .hero-proof {
            display: flex;
            gap: 24px;
            flex-wrap: wrap;
            margin-top: 38px;
        }

        .hero-proof div {
            border-left: 3px solid var(--red);
            padding-left: 14px;
            display: flex;
            flex-direction: column;
            min-width: 130px;
        }

        .hero-proof strong {
            font-size: 1rem;
            color: #fff;
        }

        .hero-proof span {
            font-size: .82rem;
            color: #aebdcd;
        }

        .hero-visual {
            height: 460px;
            position: relative;
        }

        .phone-card {
            position: absolute;
            right: 30px;
            top: 15px;
            width: 230px;
            height: 410px;
            border-radius: 32px;
            background: #101c2b;
            border: 8px solid #24364b;
            box-shadow: 0 35px 80px rgba(0, 0, 0, .35);
            transform: rotate(3deg);
            z-index: 3;
        }

        .phone-top {
            height: 24px;
            text-align: center;
            padding-top: 8px;
        }

        .phone-top span {
            display: inline-block;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #718096;
            margin: 0 2px;
        }

        .phone-screen {
            margin: 10px;
            background: #f5f7fa;
            color: #172033;
            height: 345px;
            border-radius: 20px;
            padding: 20px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .mock-person {
            width: 100%;
            height: 130px;
            border-radius: 14px;
            background: linear-gradient(135deg, #cbd5df, #eef2f6);
            display: grid;
            place-items: center;
            color: #7d8b9b;
            font-size: 2.125rem;
            margin-bottom: 16px;
        }

        .mock-line {
            height: 7px;
            border-radius: 10px;
            background: #d4dbe4;
            margin: 6px 0;
            width: 100%;
        }

        .mock-score {
            font-size: 2.38rem;
            font-weight: 850;
            color: var(--red);
            margin-top: 18px;
            line-height: 1;
        }

        .dashboard-mini {
            position: absolute;
            left: 10px;
            bottom: 25px;
            width: 290px;
            background: #fff;
            color: var(--ink);
            border-radius: 16px;
            padding: 22px;
            box-shadow: 0 30px 60px rgba(0, 0, 0, .28);
            z-index: 4;
        }

        .dashboard-mini small {
            color: var(--red);
            font-weight: 800;
            letter-spacing: .08em;
            font-size: 0.7rem;
        }

        .mini-title {
            font-weight: 800;
            font-size: 0.99rem;
            margin: 4px 0 16px;
            color: var(--navy);
        }

        .mini-bar {
            height: 8px;
            background: #edf0f4;
            border-radius: 10px;
            margin: 10px 0;
            overflow: hidden;
        }

        .mini-bar span {
            display: block;
            height: 100%;
            background: var(--red);
        }

        .floating-tag {
            position: absolute;
            background: #fff;
            color: var(--navy);
            font-weight: 700;
            padding: 9px 16px;
            border-radius: 30px;
            box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
            z-index: 5;
            font-size: .8rem;
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .floating-tag i {
            color: var(--red);
        }

        .tag-one { left: -10px; top: 60px; }
        .tag-two { right: -5px; bottom: 95px; }

        /* General Section Layout */
        .section {
            padding: 90px 0;
        }

        .section-light {
            background: #f7f9fc;
        }

        .section-heading {
            max-width: 760px;
            margin-bottom: 48px;
        }

        .section-heading h2 {
            font-size: clamp(1.7rem, 3.23vw, 2.72rem);
            line-height: 1.15;
            letter-spacing: -.03em;
            font-weight: 800;
            color: var(--navy);
            margin: 0 0 14px;
        }

        .section-heading p {
            color: var(--muted);
            font-size: 0.988rem;
            margin-bottom: 0;
        }

        /* Feature & Difference Cards */
        .feature-card,
        .difference-card {
            border: 1px solid var(--line);
            border-radius: var(--radius-md);
            padding: 28px;
            background: #fff;
            transition: transform .25s ease, box-shadow .25s ease;
            box-shadow: var(--shadow-sm);
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .feature-card:hover,
        .difference-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow-md);
        }

        .feature-card {
            position: relative;
            overflow: hidden;
        }

        .feature-card::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            width: 4px;
            height: 100%;
            background: var(--red);
        }

        .card-number {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 36px;
            height: 28px;
            padding: 0 8px;
            border-radius: 6px;
            background: var(--red-soft);
            color: var(--red);
            font-weight: 800;
            font-size: .75rem;
            align-self: flex-start;
        }

        .feature-card h3,
        .difference-card h3 {
            font-size: 1.035rem;
            line-height: 1.35;
            font-weight: 750;
            margin: 16px 0 10px;
            color: var(--navy);
        }

        .feature-card p,
        .difference-card p {
            font-size: .92rem;
            line-height: 1.6;
            color: var(--muted);
            margin: 0;
        }

        .difference-card .check {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            display: grid;
            place-items: center;
            background: var(--red-soft);
            color: var(--red);
            font-size: 0.99rem;
        }

        /* Methodology Cards */
        .method-card {
            background: linear-gradient(145deg, #0a1e36, #123b62);
            border: 1px solid rgba(255, 255, 255, .08);
            border-radius: var(--radius-md);
            padding: 26px;
            color: #fff;
            transition: transform .25s ease, box-shadow .25s ease;
            box-shadow: var(--shadow-sm);
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .method-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 45px rgba(8, 27, 51, 0.25);
        }

        .method-card h3 {
            font-size: 1.035rem;
            font-weight: 750;
            margin: 16px 0 10px;
            color: #fff;
        }

        .method-card p {
            font-size: .9rem;
            line-height: 1.6;
            color: #c1cfdd;
            margin: 0;
        }

        .method-icon {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            display: grid;
            place-items: center;
            background: rgba(255, 255, 255, .10);
            border: 1px solid rgba(255, 255, 255, .15);
            color: #fff;
            font-size: 0.99rem;
        }

        /* Process Steps */
        .process-section {
            background:
                radial-gradient(circle at 15% 20%, rgba(201,37,50,.18), transparent 25%),
                linear-gradient(120deg, #07182c, #123b62);
            color: #fff;
        }

        .process-section .eyebrow {
            color: #ff6f05;
        }

        .process-grid {
            display: grid;
            grid-template-columns: repeat(7, 1fr);
            gap: 14px;
            align-items: stretch;
        }

        .process-step {
            position: relative;
            text-align: center;
            color: #fff;
            padding: 22px 10px;
            border: 1px solid rgba(255, 255, 255, .12);
            border-radius: 14px;
            background: rgba(255, 255, 255, .04);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .process-step span {
            display: inline-flex;
            width: 32px;
            height: 32px;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: #fff0f1;
            color: #ff6f05;
            font-size: .75rem;
            font-weight: 800;
            margin-bottom: 10px;
        }

        .process-step strong {
            display: block;
            font-size: .78rem;
            letter-spacing: .06em;
            color: #ffffff;
        }

        .process-step .step-arrow {
            position: absolute;
            right: -14px;
            top: 50%;
            transform: translateY(-50%);
            color: #637d97;
            font-size: 0.85rem;
            z-index: 2;
        }

        /* Dashboard Section */
        .dashboard-shell {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: var(--radius-lg);
            padding: 36px;
            box-shadow: var(--shadow-lg);
        }

        .dashboard-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 16px;
            border-bottom: 1px solid var(--line);
            padding-bottom: 20px;
            margin-bottom: 28px;
        }

        .dashboard-head small {
            color: var(--red);
            font-weight: 800;
            font-size: 0.72rem;
            letter-spacing: .1em;
        }

        .dashboard-head h3 {
            margin: 4px 0 0;
            font-weight: 800;
            color: var(--navy);
            font-size: 1.26rem;
        }

        .badge-soft {
            background: var(--red-soft);
            color: var(--red);
            padding: 6px 14px;
            border-radius: 20px;
            font-size: .75rem;
            font-weight: 700;
        }

        .overall-score {
            background: linear-gradient(145deg, var(--navy), #123b62);
            color: #fff;
            border-radius: 16px;
            padding: 26px;
            box-shadow: 0 12px 30px rgba(8,27,51,.15);
        }

        .overall-score small {
            color: #9fb1c5;
            font-weight: 700;
            font-size: .72rem;
            letter-spacing: .08em;
        }

        .overall-score div {
            font-size: 3.57rem;
            font-weight: 850;
            line-height: 1.1;
            margin: 10px 0 5px;
        }

        .overall-score div span {
            font-size: 1.7rem;
        }

        .overall-score p {
            margin: 0;
            color: #cbd7e4;
            font-size: .88rem;
        }

        .kpi-mini-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 12px;
            margin-top: 16px;
        }

        .kpi-mini-grid div {
            border: 1px solid var(--line);
            border-radius: 12px;
            padding: 16px;
            background: #fff;
        }

        .kpi-mini-grid strong {
            display: block;
            color: var(--red);
            font-size: 1.215rem;
            line-height: 1.2;
            margin-bottom: 4px;
        }

        .kpi-mini-grid span {
            font-size: .75rem;
            line-height: 1.4;
            color: var(--muted);
            display: block;
        }

        .score-row {
            margin-bottom: 20px;
        }

        .score-row span {
            font-weight: 700;
            font-size: .9rem;
            color: var(--navy);
        }

        .score-row strong {
            color: var(--red);
            font-size: .9rem;
        }

        .score-track {
            height: 9px;
            background: #edf0f4;
            border-radius: 10px;
            overflow: hidden;
            margin-top: 8px;
        }

        .score-track span {
            display: block;
            height: 100%;
            background: linear-gradient(90deg, var(--red), #ff6f05);
            border-radius: 10px;
        }

        .locations h4 {
            font-size: 0.938rem;
            font-weight: 800;
            color: var(--navy);
            margin-bottom: 14px;
        }

        .location-bars {
            height: 170px;
            display: flex;
            align-items: flex-end;
            justify-content: space-around;
            border-bottom: 1px solid var(--line);
            padding: 15px 15px 0;
        }

        .location {
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
        }

        .loc-bar {
            width: 44px;
            background: linear-gradient(to top, var(--navy), #2f648e);
            border-radius: 6px 6px 0 0;
        }

        .location strong {
            font-size: .8rem;
            margin-top: 6px;
        }

        .location small {
            color: var(--muted);
            font-size: .75rem;
        }

        /* Industry Grid */
        .industry-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
        }

        .industry-card {
            border-radius: var(--radius-md);
            background: #fff;
            border: 1px solid var(--line);
            display: flex;
            align-items: center;
            gap: 16px;
            padding: 22px;
            box-shadow: var(--shadow-sm);
            transition: transform .25s ease, box-shadow .25s ease;
        }

        .industry-card:hover {
            transform: translateY(-4px);
            box-shadow: var(--shadow-md);
        }

        .industry-icon {
            width: 44px;
            height: 44px;
            min-width: 44px;
            border-radius: 12px;
            background: var(--navy);
            display: grid;
            place-items: center;
            color: #fff;
            font-size: 0.99rem;
            transition: background .2s ease;
        }

        .industry-card:hover .industry-icon {
            background: var(--red);
        }

        .industry-card strong {
            color: var(--navy);
            font-size: .95rem;
            line-height: 1.35;
            font-weight: 700;
        }

        /* Journey Timeline */
        .journey-grid {
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            border: 1px solid var(--line);
            border-radius: var(--radius-md);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            background: #fff;
        }

        .journey-item {
            padding: 28px 20px;
            background: #fff;
            border-right: 1px solid var(--line);
            display: flex;
            flex-direction: column;
        }

        .journey-item:last-child {
            border-right: 0;
        }

        .journey-item span {
            display: inline-flex;
            align-self: flex-start;
            color: var(--red);
            background: var(--red-soft);
            padding: 4px 10px;
            border-radius: 6px;
            font-size: .72rem;
            font-weight: 800;
        }

        .journey-item h3 {
            font-size: 0.938rem;
            font-weight: 800;
            color: var(--navy);
            margin: 14px 0 8px;
        }

        .journey-item p {
            font-size: .82rem;
            line-height: 1.55;
            color: var(--muted);
            margin: 0;
        }

        /* CTA Section */

        /* Responsive Breakpoints */
        @media (max-width: 1199px) {
            .industry-grid {
                grid-template-columns: repeat(3, 1fr);
            }
            .journey-grid {
                grid-template-columns: repeat(3, 1fr);
            }
            .journey-item:nth-child(3) {
                border-right: 0;
            }
            .journey-item:nth-child(-n+3) {
                border-bottom: 1px solid var(--line);
            }
        }

        @media (max-width: 991px) {
            .hero-section {
                padding: 60px 0 75px;
            }
            .hero-visual {
                height: 410px;
                max-width: 520px;
                margin: 40px auto 0;
            }
            .process-grid {
                grid-template-columns: repeat(4, 1fr);
            }
            .process-step .step-arrow {
                display: none;
            }
            .dashboard-shell {
                padding: 24px;
            }
        }

        @media (max-width: 767px) {
            .section {
                padding: 65px 0;
            }
            .industry-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            .journey-grid {
                grid-template-columns: 1fr;
            }
            .journey-item {
                border-right: 0 !important;
                border-bottom: 1px solid var(--line);
            }
            .journey-item:last-child {
                border-bottom: 0;
            }
            .process-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            .dashboard-head {
                flex-direction: column;
                align-items: flex-start;
            }
        }

        @media (max-width: 575px) {
            .industry-grid {
                grid-template-columns: 1fr;
            }
            .hero-proof {
                gap: 16px;
            }
            .btn-group-wrap {
                flex-direction: column;
                width: 100%;
            }
            .btn-group-wrap .btn {
                width: 100%;
            }
        }
        
        /* --- FIX VERTICAL & HORIZONTAL CARD COLLAPSING --- */

/* --- UNIVERSAL FIX FOR COLLAPSING CARDS (Feature, Method, Difference) --- */

/* 1. Reset negative row margins for standard grid gutter */
#measure .row,
#methodologies .row,
#difference .row {
    margin-left: -12px;
    margin-right: -12px;
}

/* 2. Enforce vertical spacing & equal-height flex wrapping on all card columns */
#measure .row > [class*="col-"],
#methodologies .row > [class*="col-"],
#difference .row > [class*="col-"] {
    padding-left: 12px;
    padding-right: 12px;
    margin-bottom: 24px; /* <--- Prevents top & bottom cards from collapsing */
    display: flex;       /* <--- Keeps all cards in a row equal height */
}

/* 3. Ensure cards stretch to fill 100% of their column container */
.feature-card,
.method-card,
.difference-card {
    width: 100%;
    height: 100%;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
}

/* 4. Push text neatly down for balanced card layouts */
.feature-card p,
.method-card p,
.difference-card p {
    margin-top: 6px;
    margin-bottom: 0;
}
    
h1,h2,h3,h4,.eyebrow,.btn{font-family:'Raleway',sans-serif}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);margin-bottom:12px;padding:0 20px;box-shadow:var(--shadow-sm)}
.faq-item summary{cursor:pointer;font-weight:700;color:var(--navy);padding:18px 0;list-style:none;font-family:'Raleway',sans-serif}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:'+';float:right;color:var(--red);font-size:1.3rem;line-height:1}
.faq-item[open] summary:after{content:'\2212'}
.faq-item p{color:var(--muted);padding-bottom:18px;margin:0}
.breadcrumb-mr{font-size:.85rem;color:rgba(255,255,255,.75);margin-bottom:14px}
.breadcrumb-mr a{color:#fff}

.hero-dashboard{display:block;max-width:560px;margin:0 auto}
.hero-dashboard img{display:block;width:100%;height:auto;filter:drop-shadow(0 24px 40px rgba(8,27,51,.35))}
@media(max-width:991px){.hero-dashboard{margin-top:28px}}

/* Comparison / model cards */
.svc-compare{background:#fff;border:1px solid #e6eaf5;border-radius:20px;padding:28px;height:100%;box-shadow:0 12px 30px rgba(17,35,99,.07);margin-bottom:24px}
.svc-compare-head{display:flex;gap:16px;align-items:center;margin-bottom:18px}
.svc-compare-head .method-icon{flex:none;margin:0;width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#ff9a4d,#ff6f05);color:#fff;display:grid;place-items:center;font-size:21.6px;box-shadow:0 10px 22px rgba(255,111,5,.3)}
.svc-compare h3{font-family:Raleway,sans-serif;font-weight:800;color:#112363;margin:0 0 2px;font-size:1.215rem}
.svc-compare-head p{margin:0;color:#ff6f05;font-weight:700;text-align:left!important}
.svc-compare ul{list-style:none;margin:0;padding:0}
.svc-compare li{padding:9px 0;border-top:1px dashed #e6eaf5;color:#3d4766;text-align:left}
.svc-compare li i{color:#ff6f05;margin-right:8px}
#covered .row>[class*="col-"],#fit .row>[class*="col-"]{margin-bottom:24px}
#covered .method-card,#fit .method-card{height:100%}
#covered .method-card p,#fit .method-card p{text-align:left}
.fit-card{display:flex;flex-direction:column}
.fit-card .fit-link{margin-top:auto;padding-top:12px;font-family:Raleway,sans-serif;font-weight:800;color:#ff6f05;text-decoration:none}
.fit-card.is-current{border:2px solid #ff6f05}
.fit-card.is-current .fit-link{color:#ffb37a}
#model .svc-compare,#models .svc-compare{width:100%}
@media(min-width:1200px){#main .process-grid{grid-template-columns:repeat(6,1fr)}}

/* ===== PHOTO HERO v1 (realistic photo, premium system shared by all service pages) ===== */
.ph-hero{--o:#ff6f05;--n:#112363;--n2:#0a1540;position:relative;isolation:isolate;overflow:hidden;color:#fff;background:var(--n2);min-height:620px;display:flex;flex-direction:column;justify-content:center}
.ph-media{position:absolute;inset:0;z-index:-1;margin:0;overflow:hidden}
.ph-media picture,.ph-media img{display:block;width:100%;height:100%}
.ph-media img{object-fit:cover;object-position:var(--ph-pos,right center);transform-origin:70% 40%;animation:phzoom 22s ease-out both}
.ph-media:after{content:"";position:absolute;inset:0;background:
  radial-gradient(700px 420px at 0% 100%,rgba(255,111,5,.22),transparent 60%),
  linear-gradient(90deg,rgba(10,21,64,.97) 0%,rgba(12,25,74,.93) 30%,rgba(17,35,99,.6) 52%,rgba(17,35,99,.12) 74%,rgba(17,35,99,0) 100%),
  linear-gradient(0deg,rgba(10,21,64,.55) 0%,rgba(10,21,64,0) 32%)}
.ph-inner{width:100%;flex:1;display:flex;align-items:center}
.ph-copy{max-width:600px;padding:84px 0 56px}
.ph-crumb{font-size:.8rem;color:rgba(255,255,255,.7);margin-bottom:22px;letter-spacing:.02em}
.ph-crumb a{color:rgba(255,255,255,.92);text-decoration:none}.ph-crumb a:hover{color:#ffb37a}
.ph-eyebrow{display:flex;align-items:center;gap:12px;font-family:'Raleway',sans-serif;font-size:.78rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#ffb37a}
.ph-eyebrow:before{content:"";width:34px;height:2px;background:var(--o);border-radius:2px}
.ph-hero h1{font-family:'Raleway',sans-serif;font-size:clamp(2.3rem,4.6vw,3.75rem);line-height:1.07;font-weight:800;letter-spacing:-.02em;margin:16px 0 18px;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.ph-hero h1 span{color:var(--o)}
.ph-lead{font-family:'Raleway',sans-serif;font-weight:700;font-size:1.22rem;line-height:1.45;color:#fff;margin-bottom:10px;text-align:left}
.ph-text{font-size:1rem;line-height:1.7;color:rgba(255,255,255,.84);max-width:560px;margin-bottom:30px;text-align:left}
.ph-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.ph-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:'Raleway',sans-serif;font-weight:800;font-size:.97rem;padding:15px 30px;border-radius:10px;text-decoration:none!important;transition:transform .25s,background .25s,box-shadow .25s}
.ph-btn-primary{background:var(--o);color:#fff!important;box-shadow:0 16px 32px -14px rgba(255,111,5,.85)}
.ph-btn-primary:hover{background:#e86200;transform:translateY(-2px)}
.ph-btn-ghost{color:#fff!important;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ph-btn-ghost:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.ph-btn .fa{transition:transform .25s}.ph-btn:hover .fa-arrow-right{transform:translateX(3px)}
.ph-btn:focus-visible,.ph-crumb a:focus-visible,.ph-trust a:focus-visible{outline:3px solid #ffb37a;outline-offset:3px}
.ph-trust{position:relative;border-top:1px solid rgba(255,255,255,.14);background:rgba(10,21,64,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ph-trust ul{display:grid;grid-template-columns:repeat(4,1fr);margin:0;padding:0;list-style:none}
.ph-trust li{display:flex;align-items:center;gap:12px;padding:18px 18px 18px 0;font-size:.88rem;line-height:1.35;color:rgba(255,255,255,.9)}
.ph-trust li+li{padding-left:18px;border-left:1px solid rgba(255,255,255,.12)}
.ph-trust .fa{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:rgba(255,111,5,.16);color:var(--o);font-size:1rem}
.ph-trust strong{display:block;font-family:'Raleway',sans-serif;font-weight:800;color:#fff;font-size:.92rem}
@keyframes phzoom{from{transform:scale(1.08)}to{transform:scale(1)}}
@media (max-width:991.98px){
  .ph-hero{display:block;min-height:0;background:var(--n)}
  .ph-media{position:relative;inset:auto;height:320px}
  .ph-media img{object-position:var(--ph-pos-m,80% 30%)}
  .ph-media:after{background:linear-gradient(180deg,rgba(17,35,99,0) 45%,rgba(17,35,99,.8) 85%,#112363 100%)}
  .ph-copy{max-width:none;padding:4px 0 40px}
  .ph-trust{background:#0d1c55}
  .ph-trust ul{grid-template-columns:1fr 1fr}
  .ph-trust li,.ph-trust li+li{padding:14px 10px 14px 0;border-left:0}
}
@media (max-width:575.98px){.ph-media{height:280px}.ph-hero h1{font-size:2.15rem}.ph-cta .ph-btn{width:100%}.ph-trust ul{grid-template-columns:1fr}.ph-trust li{border-top:1px solid rgba(255,255,255,.08)}}
@media (prefers-reduced-motion:reduce){.ph-media img{animation:none}.ph-btn,.ph-btn .fa{transition:none}}

/* "Speak to one of our Experts" strip: mobile fix (desktop unchanged) */
@media (max-width:767px){
  .cci-expert-strip{height:auto !important;padding:16px 12px}
  .cci-expert-strip p{margin:0 !important}
  .cci-expert-strip .btn{display:block;width:max-content;margin:8px auto 0}
}

/* ===== TYPE NOTCH v1 (Oct 2026): one size step down below the hero, matched to the live site (body 15px Open Sans). Hero, FAQ, eyebrows, process steps and the experts strip keep their sizes. ===== */
.main-page > section{font-size:15px}
.main-page > section .faq-item summary,.main-page > section .faq-item p,#faq p.text-center{font-size:1rem}
@media (min-width:992px){.main-page > section.section{padding-top:78px;padding-bottom:78px}}
.main-page > section .method-card p,.main-page > section .feature-card p,.main-page > section .difference-card p,.main-page > section .journey-item p{text-align:left} /* card-left-align */