/*
 * Crown & Compass Global — Public Sector
 * Page-specific stylesheet extracted from style.css.
 *
 * Shared/sitewide systems intentionally remain in style.css.
 */

/* =========================================================
   PUBLIC SECTOR SERVICES
   HERO
========================================================= */

.public-sector-page{
    background: #F4F1E8;
}


/* HERO */

.public-sector-hero{
    position: relative;
    overflow: hidden;

    min-height: 600px;

    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;

    color: #F4F1E8;
}


/* INNER WIDTH */

.public-sector-hero-inner{
    position: relative;
    z-index: 2;

    width: min(1280px, calc(100% - 100px));
    min-height: 600px;

    margin: 0 auto;

    display: flex;
    align-items: center;
}


/* COPY AREA */

.public-sector-hero-copy{
    width: min(660px, 55%);
    padding-top: 25px;
}

/* BREADCRUMB */

.public-sector-breadcrumb{
    display: flex;
    align-items: center;
    gap: 9px;

    margin-bottom: 24px;

    font-family: "Assistant", sans-serif;
    font-size: 12.5px;
    font-weight: 600;

    color: #D4A017;
}

.public-sector-breadcrumb a{
    color: inherit;
    text-decoration: none;
}

/* HOME BREADCRUMB — GOLD TEXT SWEEP */

.public-sector-breadcrumb a{
    position: relative;
    display: inline-block;

    color: #D4A017;
    text-decoration: none;

    background: linear-gradient(
        90deg,
        #D4A017 0%,
        #D4A017 35%,
        #F0DEAE 50%,
        #D4A017 65%,
        #D4A017 100%
    );

    background-size: 250% 100%;
    background-position: 100% 0;

    -webkit-background-clip: text;
    background-clip: text;

    -webkit-text-fill-color: transparent;
}


/* sweep ONLY when hovered */
.public-sector-breadcrumb a:hover{
    animation: publicSectorBreadcrumbSweep 0.75s ease-out forwards;
}


@keyframes publicSectorBreadcrumbSweep {

    from {
        background-position: 100% 0;
    }

    to {
        background-position: -100% 0;
    }

}


/* EYEBROW */

.public-sector-eyebrow{
    display: block;

    margin-bottom: 14px;

    font-family: "Assistant", sans-serif;
    font-size: 12px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.24em;

    color: #E0C77F;
}


/* HEADING */

.public-sector-hero h1{
    margin: 0;

    max-width: 720px;

    font-family: "Lora", serif;
    font-size: clamp(48px, 4.2vw, 68px);
    line-height: 1.02;
    font-weight: 700;

    letter-spacing: -0.035em;

    color: #F4F1E8;
}


/* BODY COPY */

.public-sector-hero-lede{
    max-width: 660px;

    margin: 24px 0 0;

    font-family: "Assistant", sans-serif;
    font-size: 16.5px;
    line-height: 1.65;
    font-weight: 400;

    color: rgba(244, 241, 232, 0.84);
}


/* BUTTON ROW */

.public-sector-hero-actions{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;

    margin-top: 28px;
}


/* BOTH BUTTONS */

.public-sector-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;

    min-height: 50px;
    padding: 0 22px;

    font-family: "Assistant", sans-serif;
    font-size: 12px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.08em;

    text-decoration: none;

    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease,
        box-shadow 0.25s ease;
}


/* PRIMARY */

.public-sector-btn-primary{
    color: #101A38;

    border: 1px solid #D4A017;

    background:
        linear-gradient(
            110deg,
            #BC8810 0%,
            #D4A017 45%,
            #F0DEAE 100%
        );

    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.18),
        0 0 25px rgba(212, 160, 23, 0.08);
}

.public-sector-btn-primary:hover{
    color: #101A38;

    box-shadow:
        0 13px 32px rgba(0, 0, 0, 0.23),
        0 0 30px rgba(212, 160, 23, 0.16);
}


/* SECONDARY */

.public-sector-btn-secondary{
    color: #F4F1E8;

    border: 1px solid rgba(224, 199, 127, 0.65);

    background: rgba(255, 255, 255, 0.025);
}

.public-sector-btn-secondary:hover{
    color: #F0DEAE;

    border-color: #D4A017;

    background: rgba(212, 160, 23, 0.07);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 900px){


    .public-sector-hero,
.public-sector-hero-inner{
        min-height: auto;
    }

    .public-sector-hero-inner{
        width: min(100% - 44px, 720px);
        padding: 130px 0 90px;
    }

    .public-sector-hero-copy{
        width: 100%;
        padding-top: 0;
    }

    .public-sector-hero h1{
        font-size: clamp(48px, 11vw, 68px);
    }

    .public-sector-hero-lede{
        font-size: 17px;
    }


}


@media (max-width: 560px){


    .public-sector-hero{
        background-position: 88% center;
    }

    .public-sector-hero-inner{
        width: calc(100% - 34px);
        padding: 115px 0 75px;
    }

    .public-sector-breadcrumb{
        margin-bottom: 25px;
    }

    .public-sector-hero-actions{
        align-items: stretch;
        flex-direction: column;
    }

    .public-sector-btn{
        width: 100%;
    }


}

/* =========================================================
   PUBLIC SECTOR HERO — COLOR GRADE + EDGE FADE
========================================================= */

.public-sector-hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;

    /* blue-purple CCG grading */
    background:
        linear-gradient(
            90deg,
            rgba(13, 22, 49, 0.94) 0%,
            rgba(22, 31, 67, 0.88) 30%,
            rgba(37, 47, 85, 0.58) 56%,
            rgba(37, 47, 85, 0.24) 76%,
            rgba(37, 47, 85, 0.10) 100%
        );
}


/* Soft edge vignette around ALL sides */

.public-sector-hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;

    background:
        radial-gradient(
            ellipse at center,
            rgba(29, 41, 82, 0) 42%,
            rgba(29, 41, 82, 0.10) 62%,
            rgba(17, 27, 58, 0.34) 82%,
            rgba(9, 17, 39, 0.58) 100%
        );
}


/* keep actual hero content above overlays */

.public-sector-hero-inner{
    position:relative;
    z-index:2;
}

.public-sector-hero{
    position:relative;
}

.public-sector-hero::marker{
    display:none;
}

.public-sector-hero::before,
.public-sector-hero::after{
    z-index:1;
}

.public-sector-hero-inner{
    z-index:2;
}

/* =========================================================
   PUBLIC SECTOR HERO — SUBTLE BACKGROUND DRIFT
   ========================================================= */

.public-sector-hero{
    animation:
        publicSectorHeroDrift
        5s
        ease-in-out
        infinite
        alternate;
}

@keyframes publicSectorHeroDrift {

    0% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 97% 48%;
    }

}


/* Accessibility */
@media (prefers-reduced-motion: reduce){


    .public-sector-hero{
        animation: none !important;
    }


}

/* =========================================================
   PUBLIC SECTOR
   WHAT EFFECTIVE GOVERNMENT OPERATIONS REQUIRE
   ========================================================= */

.public-sector-requirements{
    position:relative;
    overflow:hidden;

    background:#F4F1E8;

    padding:
        92px
        40px
        105px;

    color:#1B1B1F;
}


/* =========================================================
   INNER CONTAINER
   ========================================================= */

.public-sector-requirements-inner{
    width:min(1320px, 100%);
    margin:0 auto;
}


/* =========================================================
   INTRO
   ========================================================= */

.public-sector-requirements-intro{
    max-width:980px;

    margin-bottom:72px;
}


.public-sector-section-eyebrow{
    display:block;

    margin-bottom:16px;

    font-family:"Assistant", sans-serif;

    font-size:13px;
    font-weight:700;

    line-height:1;

    letter-spacing:.20em;

    text-transform:uppercase;

    color:#BC8810;
}


.public-sector-requirements-intro h2{
    max-width:900px;

    margin:0 0 24px;

    font-family:"Lora", serif;

    font-size:clamp(38px, 4.2vw, 56px);
    font-weight:600;

    line-height:1.13;

    letter-spacing:-.02em;

    color:#1D2952;
}


.public-sector-requirements-intro p{
    max-width:820px;

    margin:0;

    font-family:"Assistant", sans-serif;

    font-size:18px;

    line-height:1.65;

    color:#343F68;
}


/* =========================================================
   REQUIREMENTS LIST
   ========================================================= */

.public-sector-requirements-list{
    width:100%;

    border-top:
        1px solid
        rgba(29,41,82,.14);
}


/* =========================================================
   EACH REQUIREMENT ROW
   ========================================================= */

.public-sector-requirement{
    position:relative;

    display:grid;

    grid-template-columns:
        150px
        1px
        minmax(0, 1fr);

    column-gap:38px;

    align-items:center;

    min-height:190px;

    padding:
        34px
        28px;

    border-bottom:
        1px solid
        rgba(29,41,82,.14);

    overflow:hidden;

    transition:
        background .35s ease,
        box-shadow .35s ease;
}


/* =========================================================
   GIANT NUMBER
   ========================================================= */

.public-sector-requirement-number{
    position:relative;

    z-index:2;

    display:block;

    font-family:"Lora", serif;

    font-size:72px;
    font-weight:500;

    line-height:1;

    letter-spacing:-.045em;

    color:rgba(29,41,82,.14);

    transition:
        color .35s ease,
        transform .35s ease,
        text-shadow .35s ease;
}


/* =========================================================
   VERTICAL GOLD DIVIDER
   ========================================================= */

.public-sector-requirement-rule{
    width:1px;
    height:104px;

    align-self:center;

    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(212,160,23,.35) 15%,
            #D4A017 50%,
            rgba(212,160,23,.35) 85%,
            transparent 100%
        );

    transition:
        height .35s ease,
        box-shadow .35s ease;
}


/* =========================================================
   COPY
   ========================================================= */

.public-sector-requirement-copy{
    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
        minmax(240px, .72fr)
        minmax(0, 1.28fr);

    gap:56px;

    align-items:center;
}


.public-sector-requirement-copy h3{
    margin:0;

    font-family:"Lora", serif;

    font-size:28px;
    font-weight:600;

    line-height:1.25;

    color:#1D2952;
}


.public-sector-requirement-copy p{
    margin:0;

    font-family:"Assistant", sans-serif;

    font-size:17px;

    line-height:1.65;

    color:#34343A;
}


/* =========================================================
   VERY FAINT "DOCUMENT / BLUEPRINT" DETAIL
   ========================================================= */

.public-sector-requirement::after{
    content:"";

    position:absolute;

    right:-70px;
    top:50%;

    width:340px;
    height:140px;

    transform:
        translateY(-50%)
        rotate(-4deg);

    opacity:0;

    pointer-events:none;

    background:
        repeating-linear-gradient(
            0deg,
            transparent 0px,
            transparent 19px,
            rgba(29,41,82,.05) 20px,
            rgba(29,41,82,.05) 21px
        );

    transition:
        opacity .35s ease,
        right .5s ease;
}


/* =========================================================
   HOVER
   ========================================================= */

.public-sector-requirement:hover{
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.22) 0%,
            rgba(240,222,174,.12) 48%,
            rgba(224,199,127,.05) 100%
        );

    box-shadow:
        inset 4px 0 0 #D4A017;
}


.public-sector-requirement:hover
.public-sector-requirement-number{
    color:rgba(188,136,16,.68);

    transform:translateX(5px);

    text-shadow:
        0 0 18px rgba(212,160,23,.12);
}


.public-sector-requirement:hover
.public-sector-requirement-rule{
    height:125px;

    box-shadow:
        0 0 8px rgba(212,160,23,.24);
}


.public-sector-requirement:hover::after{
    opacity:1;
    right:-35px;
}


/* =========================================================
   LITTLE TOP ARCHITECTURAL ACCENT
   Gives the section a Public Sector identity
   ========================================================= */

.public-sector-requirements::before{
    content:"";

    position:absolute;

    top:0;
    right:5%;

    width:430px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(212,160,23,.32),
            transparent
        );

    pointer-events:none;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1000px){


    .public-sector-requirement{
        grid-template-columns:
            100px
            1px
            minmax(0, 1fr);

        column-gap:28px;
    }


    .public-sector-requirement-number{
        font-size:58px;
    }


    .public-sector-requirement-copy{
        grid-template-columns:1fr;

        gap:14px;
    }


}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:700px){


    .public-sector-requirements{
        padding:
            70px
            24px
            78px;
    }


    .public-sector-requirements-intro{
        margin-bottom:50px;
    }


    .public-sector-requirements-intro h2{
        font-size:36px;
    }


    .public-sector-requirements-intro p{
        font-size:17px;
    }


    .public-sector-requirement{
        grid-template-columns:
            72px
            1px
            minmax(0, 1fr);

        column-gap:20px;

        min-height:0;

        padding:
            30px
            8px;
    }


    .public-sector-requirement-number{
        font-size:44px;
    }


    .public-sector-requirement-rule{
        height:100%;
        min-height:105px;
    }


    .public-sector-requirement-copy h3{
        font-size:23px;
    }


    .public-sector-requirement-copy p{
        font-size:16px;
    }


}

/* =========================================================
   PUBLIC SECTOR — BUSINESS OPERATIONS FOR GOVERNMENT
========================================================= */

.public-sector-capabilities{
    position:relative;
    overflow:hidden;

    padding:100px 40px 115px;

    background:
        linear-gradient(
            180deg,
            #18264d 0%,
            #1d2952 52%,
            #172446 100%
        );

    color:#F4F1E8;
}


/* subtle background structure */

.public-sector-capabilities::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    opacity:.20;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(224,199,127,.12) 50%,
            transparent 100%
        );
}


.public-sector-capabilities-inner{
    position:relative;
    z-index:2;

    width:min(1320px,100%);
    margin:0 auto;
}


/* =========================================================
   INTRO
========================================================= */

.public-sector-capabilities-intro{
    max-width:1000px;

    margin:0 auto 85px;

    text-align:center;
}


.public-sector-capabilities-eyebrow{
    display:block;

    margin-bottom:18px;

    font-family:"Assistant",sans-serif;
    font-size:13px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.22em;

    color:#E0C77F;
}


.public-sector-capabilities-intro h2{
    margin:0 auto;

    max-width:970px;

    font-family:"Lora",serif;
    font-size:clamp(40px,4.2vw,58px);
    font-weight:600;

    line-height:1.16;

    color:#F4F1E8;
}


/* GOLD TEXT — BASE STATE */

.public-sector-capabilities-intro h2 em{
    display:block;
    margin-top:8px;

    font-weight:500;
    font-style:italic;

    /* wide gradient so we can sweep it through the text */
    background-image:linear-gradient(
        105deg,
        #BC8810 0%,
        #D4A017 24%,
        #E0C77F 38%,
        #FFF4C7 48%,
        #F0DEAE 53%,
        #D4A017 68%,
        #BC8810 100%
    );

    background-size:250% 100%;
    background-position:100% 50%;

    -webkit-background-clip:text;
    background-clip:text;

    -webkit-text-fill-color:transparent;
    color:transparent;
}


/* Run the shine when JS adds this class */

.public-sector-capabilities-intro h2 em.gold-sweep{
    animation:ccgGoldSweep 1.6s ease-out forwards;
}


@keyframes ccgGoldSweep{

    0%{
        background-position:100% 50%;
    }

    100%{
        background-position:0% 50%;
    }

}


.public-sector-capabilities-intro > p{
    max-width:820px;

    margin:28px auto 0;

    font-family:"Assistant",sans-serif;
    font-size:18px;
    line-height:1.7;

    color:rgba(244,241,232,.82);
}


/* =========================================================
   CAPABILITY STACK
========================================================= */

.public-sector-capability-list{
    display:flex;
    flex-direction:column;

    gap:38px;
}


/* =========================================================
   EACH FEATURE BLOCK
========================================================= */

.public-sector-capability{
    position:relative;

    display:grid;

    grid-template-columns:
        minmax(320px,.85fr)
        minmax(0,1.15fr);

    gap:70px;

    align-items:center;

    min-height:390px;

    padding:64px 70px;

    border:
        1px solid
        rgba(224,199,127,.22);

    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,.035),
            rgba(255,255,255,.012)
        );

    overflow:hidden;

    transition:
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease;
}


/* alternate direction */

.public-sector-capability.capability-right
.public-sector-capability-heading{
    grid-column:2;
    grid-row:1;
}

.public-sector-capability.capability-right
.public-sector-capability-body{
    grid-column:1;
    grid-row:1;
}


/* =========================================================
   OVERSIZED NUMBER
========================================================= */

.public-sector-capability-number{
    position:absolute;

    top:-30px;
    right:30px;

    z-index:0;

    font-family:"Lora",serif;
    font-size:170px;
    font-weight:600;

    line-height:1;

    color:rgba(224,199,127,.055);

    pointer-events:none;
}


.public-sector-capability.capability-right
.public-sector-capability-number{
    right:auto;
    left:30px;
}


/* =========================================================
   HEADING SIDE
========================================================= */

.public-sector-capability-heading{
    position:relative;
    z-index:2;
}


.public-sector-capability-label{
    display:block;

    margin-bottom:17px;

    font-family:"Assistant",sans-serif;
    font-size:12px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.20em;

    color:#D4A017;
}


.public-sector-capability-heading h3{
    margin:0;

    font-family:"Lora",serif;
    font-size:clamp(31px,3vw,44px);
    font-weight:600;

    line-height:1.2;

    color:#F4F1E8;
}


/* small signature line */

.public-sector-capability-heading::after{
    content:"";

    display:block;

    width:70px;
    height:1px;

    margin-top:28px;

    background:
        linear-gradient(
            90deg,
            #D4A017,
            #F0DEAE
        );
}


/* =========================================================
   BODY SIDE
========================================================= */

.public-sector-capability-body{
    position:relative;
    z-index:2;
}


.public-sector-capability-body > p{
    margin:0;

    font-family:"Assistant",sans-serif;
    font-size:17px;
    line-height:1.7;

    color:rgba(244,241,232,.82);
}


/* =========================================================
   CAPABILITY LIST
========================================================= */

.public-sector-capability-services{
    margin-top:28px;
    padding-top:24px;

    border-top:
        1px solid
        rgba(224,199,127,.18);
}


.capability-services-label{
    display:block;

    margin-bottom:12px;

    font-family:"Assistant",sans-serif;
    font-size:12px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.15em;

    color:#E0C77F;
}


.public-sector-capability-services p{
    margin:0;

    font-family:"Assistant",sans-serif;
    font-size:15.5px;
    line-height:1.9;

    color:rgba(244,241,232,.72);
}


.public-sector-capability-services p span{
    display:inline-block;

    margin:0 7px;

    color:#D4A017;
}


/* =========================================================
   CTA
========================================================= */

.public-sector-capability-link{
    display:inline-flex;

    align-items:center;
    gap:14px;

    margin-top:28px;

    padding-bottom:6px;

    border-bottom:
        1px solid
        rgba(224,199,127,.55);

    font-family:"Assistant",sans-serif;
    font-size:12px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.10em;

    text-decoration:none;

    color:#F4F1E8;

    transition:
        color .3s ease,
        border-color .3s ease,
        gap .3s ease;
}


.public-sector-capability-link:hover{
    gap:20px;

    color:#F0DEAE;

    border-color:#D4A017;
}


/* =========================================================
   HOVER — VERY SUBTLE
========================================================= */

.public-sector-capability:hover{
    border-color:
        rgba(224,199,127,.48);

    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,.055),
            rgba(212,160,23,.025)
        );

    box-shadow:
        0 20px 55px
        rgba(4,10,28,.20);
}


/* =========================================================
   THIN GOLD THREAD THROUGH SECTION
========================================================= */

.public-sector-capability-list::before{
    content:"";

    position:absolute;
    left:50%;

    width:1px;
    height:100%;

    transform:translateX(-50%);

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(212,160,23,.18) 12%,
            rgba(212,160,23,.18) 88%,
            transparent
        );

    pointer-events:none;
}


.public-sector-capability-list{
    position:relative;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width:1000px){


    .public-sector-capability{
        grid-template-columns:1fr;

        gap:34px;

        min-height:0;

        padding:52px 46px;
    }


    .public-sector-capability.capability-right
    .public-sector-capability-heading,
.public-sector-capability.capability-right
    .public-sector-capability-body{
        grid-column:auto;
        grid-row:auto;
    }


    .public-sector-capability-number{
        font-size:130px;
    }


}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width:700px){


    .public-sector-capabilities{
        padding:
            76px
            22px
            85px;
    }


    .public-sector-capabilities-intro{
        margin-bottom:58px;
    }


    .public-sector-capabilities-intro h2{
        font-size:36px;
    }


    .public-sector-capabilities-intro > p{
        font-size:17px;
    }


    .public-sector-capability{
        padding:
            42px
            28px;

        gap:26px;
    }


    .public-sector-capability-heading h3{
        font-size:29px;
    }


    .public-sector-capability-body > p{
        font-size:16px;
    }


    .public-sector-capability-number{
        top:-15px;
        right:15px;

        font-size:100px;
    }


    .public-sector-capability.capability-right
    .public-sector-capability-number{
        left:15px;
    }


}

/* =========================================================
   PUBLIC SECTOR — WHO WE SUPPORT
   DISTINCT 2x2 ECOSYSTEM MATRIX
========================================================= */

.public-sector-support{
    position:relative;
    overflow:hidden;

    padding:96px 40px 108px;

    background:#F4F1E8;
    color:#1D2952;
}


/* INNER */

.public-sector-support-inner{
    width:min(1320px,100%);
    margin:0 auto;
}


/* =========================================================
   TOP INTRO — FULL WIDTH
========================================================= */

.public-sector-support-intro{
    max-width:900px;
    margin:0 0 66px;
}


.public-sector-support-eyebrow{
    display:block;

    margin-bottom:16px;

    font-family:"Assistant",sans-serif;
    font-size:13px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.22em;

    color:#BC8810;
}


.public-sector-support-intro h2{
    margin:0;

    max-width:900px;

    font-family:"Lora",serif;
    font-size:clamp(42px,4.3vw,60px);
    font-weight:600;

    line-height:1.12;

    letter-spacing:-.025em;

    color:#1D2952;
}


.public-sector-support-intro h2 em{
    display:inline;

    font-weight:500;
    font-style:italic;

    background:
        linear-gradient(
            105deg,
            #BC8810 0%,
            #D4A017 45%,
            #F0DEAE 100%
        );

    -webkit-background-clip:text;
    background-clip:text;

    -webkit-text-fill-color:transparent;
    color:transparent;
}


.public-sector-support-intro > p{
    max-width:720px;

    margin:24px 0 0;

    font-family:"Assistant",sans-serif;
    font-size:18px;
    line-height:1.7;

    color:#343F68;
}


/* =========================================================
   2x2 MATRIX
========================================================= */

.public-sector-support-list{
    position:relative;

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    border-top:1px solid rgba(29,41,82,.20);
    border-bottom:1px solid rgba(29,41,82,.20);
}


/* CENTER VERTICAL DIVIDER */

.public-sector-support-list::before{
    content:"";

    position:absolute;

    top:0;
    bottom:0;
    left:50%;

    width:1px;

    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(212,160,23,.30) 8%,
            rgba(29,41,82,.18) 50%,
            rgba(212,160,23,.30) 92%,
            transparent 100%
        );

    transform:translateX(-50%);

    pointer-events:none;
}


/* CENTRAL COMPASS POINT */

.public-sector-support-list::after{
    content:"";

    position:absolute;

    left:50%;
    top:50%;

    width:12px;
    height:12px;

    transform:
        translate(-50%,-50%)
        rotate(45deg);

    background:
        linear-gradient(
            135deg,
            #BC8810,
            #F0DEAE
        );

    box-shadow:
        0 0 0 7px #F4F1E8,
        0 0 0 8px rgba(212,160,23,.26);

    pointer-events:none;
}


/* =========================================================
   EACH QUADRANT
========================================================= */

.public-sector-support-item{
    position:relative;

    min-height:285px;

    padding:
        48px
        58px
        52px;

    display:block;

    overflow:hidden;

    transition:
        background .35s ease;
}


/* horizontal divider between rows */

.public-sector-support-item:nth-child(-n/**/+2){
    border-bottom:
        1px solid
        rgba(29,41,82,.18);
}


/* =========================================================
   NUMBERS
========================================================= */

.public-sector-support-number{
    display:block;

    margin-bottom:28px;

    font-family:"Lora",serif;
    font-size:58px;
    font-weight:500;

    line-height:1;

    letter-spacing:-.04em;

    color:rgba(29,41,82,.12);

    transition:
        color .35s ease,
        transform .35s ease;
}


/* =========================================================
   COPY
========================================================= */

.public-sector-support-copy h3{
    max-width:470px;

    margin:0;

    font-family:"Lora",serif;
    font-size:29px;
    font-weight:600;

    line-height:1.23;

    color:#1D2952;
}


.public-sector-support-copy p{
    max-width:520px;

    margin:17px 0 0;

    font-family:"Assistant",sans-serif;
    font-size:16.5px;
    line-height:1.65;

    color:#464A55;
}


/* =========================================================
   ARROW
========================================================= */

.public-sector-support-arrow{
    position:absolute;

    right:34px;
    top:32px;

    font-family:"Assistant",sans-serif;
    font-size:22px;

    color:#D4A017;

    opacity:.20;

    transform:translate(-7px,7px);

    transition:
        opacity .3s ease,
        transform .3s ease;
}


/* =========================================================
   SUBTLE INTERNAL ACCENT
========================================================= */

.public-sector-support-item::before{
    content:"";

    position:absolute;

    left:0;
    bottom:0;

    width:0;
    height:3px;

    background:
        linear-gradient(
            90deg,
            #BC8810,
            #D4A017,
            #F0DEAE
        );

    transition:
        width .45s ease;
}


/* very faint document-line texture */

.public-sector-support-item::after{
    content:"";

    position:absolute;

    right:-60px;
    bottom:-40px;

    width:230px;
    height:150px;

    opacity:0;

    background:
        repeating-linear-gradient(
            0deg,
            transparent 0,
            transparent 18px,
            rgba(29,41,82,.045) 19px,
            rgba(29,41,82,.045) 20px
        );

    transform:rotate(-6deg);

    transition:
        opacity .35s ease,
        right .45s ease;

    pointer-events:none;
}


/* =========================================================
   HOVER
========================================================= */

.public-sector-support-item:hover{
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.28),
            rgba(224,199,127,.07)
        );
}


.public-sector-support-item:hover::before{
    width:100%;
}


.public-sector-support-item:hover::after{
    opacity:1;
    right:-20px;
}


.public-sector-support-item:hover
.public-sector-support-number{
    color:rgba(188,136,16,.68);

    transform:translateY(-4px);
}


.public-sector-support-item:hover
.public-sector-support-arrow{
    opacity:1;

    transform:translate(0,0);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width:900px){


    .public-sector-support-list{
        grid-template-columns:1fr;
    }


    .public-sector-support-list::before,
.public-sector-support-list::after{
        display:none;
    }


    .public-sector-support-item{
        min-height:0;
    }


    .public-sector-support-item:nth-child(-n/**/+2){
        border-bottom:none;
    }


    .public-sector-support-item:not(:last-child){
        border-bottom:
            1px solid
            rgba(29,41,82,.18);
    }


}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width:700px){


    .public-sector-support{
        padding:
            72px
            22px
            82px;
    }


    .public-sector-support-intro{
        margin-bottom:48px;
    }


    .public-sector-support-intro h2{
        font-size:38px;
    }


    .public-sector-support-intro > p{
        font-size:17px;
    }


    .public-sector-support-item{
        padding:
            35px
            18px
            40px;
    }


    .public-sector-support-number{
        margin-bottom:20px;

        font-size:45px;
    }


    .public-sector-support-copy h3{
        padding-right:30px;

        font-size:24px;
    }


    .public-sector-support-copy p{
        font-size:16px;
    }


    .public-sector-support-arrow{
        right:16px;
        top:23px;
    }


}

.public-sector-support-arrow{
    position:absolute;

    font-family:"Assistant",sans-serif;
    font-size:22px;

    color:#D4A017;

    opacity:.34;

    transition:
        opacity .3s ease,
        transform .3s ease,
        color .3s ease;
}


/* 01 — top left */
.public-sector-support-item:nth-child(1)
.public-sector-support-arrow{
    right:28px;
    bottom:24px;
    top:auto;

    transform:translate(-5px,-5px);
}


/* 02 — top right */
.public-sector-support-item:nth-child(2)
.public-sector-support-arrow{
    left:28px;
    bottom:24px;
    right:auto;
    top:auto;

    transform:translate(5px,-5px);
}


/* 03 — bottom left */
.public-sector-support-item:nth-child(3)
.public-sector-support-arrow{
    right:28px;
    top:24px;
    bottom:auto;

    transform:translate(-5px,5px);
}


/* 04 — bottom right */
.public-sector-support-item:nth-child(4)
.public-sector-support-arrow{
    left:28px;
    top:24px;
    right:auto;
    bottom:auto;

    transform:translate(5px,5px);
}

/* =========================================================
   PUBLIC SECTOR SUPPORT MATRIX — TRUE CENTER CROSS
========================================================= */

/* Remove the old per-card horizontal borders */
.public-sector-support-item:nth-child(-n/**/+2){
    border-bottom:none !important;
}


/* Create ONE true horizontal center divider */
.public-sector-support-list{
    position:relative;
}

/* CENTER HORIZONTAL DIVIDER — does not consume a pseudo-element */
.public-sector-support-list{
    position: relative;

    background-image:
        linear-gradient(
            to bottom,
            transparent calc(50% - 0.5px),
            rgba(29, 41, 82, 0.16) calc(50% - 0.5px),
            rgba(29, 41, 82, 0.16) calc(50% + 0.5px),
            transparent calc(50% + 0.5px)
        );
}

/* =========================================================
   WHO WE SUPPORT — FINAL CENTER ALIGNMENT
========================================================= */

/* Make the upper + lower halves exactly equal */
.public-sector-support-list{
    grid-template-rows: repeat(2, minmax(0, 1fr));
}


/* Put the hover accent directly on the quadrant edge */
.public-sector-support-item::before{
    bottom: -1px;
}


/* Move TOP arrows slightly closer to the center line */

/* 01 */
.public-sector-support-item:nth-child(1)
.public-sector-support-arrow{
    bottom: 14px;
}


/* 02 */
.public-sector-support-item:nth-child(2)
.public-sector-support-arrow{
    bottom: 14px;
}

/* =========================================================
   PUBLIC SECTOR — DESIGNED TO WORK WITHIN YOUR ENVIRONMENT
========================================================= */

.public-sector-environment{
    position:relative;
    overflow:hidden;

    padding:100px 40px 0;

    background:
        linear-gradient(
            180deg,
            #1D2952 0%,
            #19254A 55%,
            #15213F 100%
        );

    color:#F4F1E8;
}


/* INNER */

.public-sector-environment-inner{
    position:relative;
    z-index:2;

    width:min(1320px,100%);
    margin:0 auto;
}


/* =========================================================
   INTRO
========================================================= */

.public-sector-environment-intro{
    max-width:980px;
    margin:0 auto 72px;

    text-align:center;
}


.public-sector-environment-eyebrow{
    display:block;

    margin-bottom:18px;

    font-family:"Assistant",sans-serif;
    font-size:13px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.22em;

    color:#E0C77F;
}


.public-sector-environment-intro h2{
    max-width:980px;
    margin:0 auto;

    font-family:"Lora",serif;
    font-size:clamp(42px,4.4vw,60px);
    font-weight:600;

    line-height:1.15;
    letter-spacing:-.025em;

    color:#F4F1E8;
}


.public-sector-environment-intro > p{
    max-width:720px;
    margin:26px auto 0;

    font-family:"Assistant",sans-serif;
    font-size:18px;
    line-height:1.7;

    color:rgba(244,241,232,.78);
}


/* =========================================================
   FOUR PRINCIPLES
========================================================= */

.public-sector-environment-principles{
    display:grid;

    grid-template-columns:repeat(4,minmax(0,1fr));

    gap:0;

    margin-top:10px;

    border-top:
        1px solid
        rgba(224,199,127,.22);
}


/* EACH PRINCIPLE */

.public-sector-environment-principle{
    position:relative;

    min-height:285px;

    padding:
        38px
        34px
        44px;

    border-right:
        1px solid
        rgba(224,199,127,.16);

    transition:
        background .35s ease;
}


.public-sector-environment-principle:last-child{
    border-right:none;
}


/* NUMBER */

.public-sector-environment-number{
    display:block;

    margin-bottom:34px;

    font-family:"Assistant",sans-serif;
    font-size:12px;
    font-weight:700;

    letter-spacing:.18em;

    color:#D4A017;
}


/* HEADING */

.public-sector-environment-principle h3{
    margin:0;

    font-family:"Lora",serif;
    font-size:27px;
    font-weight:600;

    line-height:1.25;

    color:#F4F1E8;
}


/* BODY */

.public-sector-environment-principle p{
    margin:17px 0 0;

    font-family:"Assistant",sans-serif;
    font-size:16px;
    line-height:1.65;

    color:rgba(244,241,232,.72);
}


/* =========================================================
   GOLD TOP ACCENT
========================================================= */

.public-sector-environment-principle::before{
    content:"";

    position:absolute;

    top:-1px;
    left:0;

    width:0;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #BC8810,
            #D4A017,
            #F0DEAE
        );

    transition:
        width .4s ease;
}


/* =========================================================
   HOVER
========================================================= */

.public-sector-environment-principle:hover{
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.035),
            rgba(212,160,23,.025)
        );
}


.public-sector-environment-principle:hover::before{
    width:100%;
}


/* =========================================================
   SUBTLE BACKGROUND LINEWORK
========================================================= */

.public-sector-environment::before{
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    opacity:.18;

    background:
        repeating-linear-gradient(
            90deg,
            transparent 0,
            transparent 119px,
            rgba(224,199,127,.035) 120px
        );
}


.public-sector-environment::after{
    content:"";

    position:absolute;

    right:-230px;
    top:-180px;

    width:520px;
    height:520px;

    border:
        1px solid
        rgba(224,199,127,.09);

    border-radius:50%;

    pointer-events:none;
}


/* =========================================================
   FINAL CTA
========================================================= */

.public-sector-environment-cta{
    position:relative;

    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:50px;

    margin-top:10px;

    padding:
        52px
        0
        58px;

    border-top:
        1px solid
        rgba(224,199,127,.26);
}


.public-sector-environment-cta-copy{
    max-width:760px;
}


.public-sector-environment-cta-eyebrow{
    display:block;

    margin-bottom:14px;

    font-family:"Assistant",sans-serif;
    font-size:12px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.20em;

    color:#D4A017;
}


.public-sector-environment-cta-copy h3{
    margin:0;

    font-family:"Lora",serif;
    font-size:clamp(30px,3vw,42px);
    font-weight:600;

    line-height:1.2;

    color:#F4F1E8;
}


/* CTA BUTTON */

.public-sector-environment-cta-link{
    flex:0 0 auto;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:14px;

    min-height:56px;

    padding:0 27px;

    border:1px solid #D4A017;

    background:
        linear-gradient(
            110deg,
            #BC8810 0%,
            #D4A017 45%,
            #F0DEAE 100%
        );

    font-family:"Assistant",sans-serif;
    font-size:13px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.09em;

    text-decoration:none;

    color:#101A38;

    transition:
        box-shadow .3s ease,
        transform .3s ease,
        gap .3s ease;
}


.public-sector-environment-cta-link:hover{
    gap:20px;

    transform:translateY(-2px);

    box-shadow:
        0 12px 30px rgba(0,0,0,.20),
        0 0 26px rgba(212,160,23,.15);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width:1000px){


    .public-sector-environment-principles{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }


    .public-sector-environment-principle{
        border-bottom:
            1px solid
            rgba(224,199,127,.16);
    }


    .public-sector-environment-principle:nth-child(2){
        border-right:none;
    }


    .public-sector-environment-principle:nth-child(3),
.public-sector-environment-principle:nth-child(4){
        border-bottom:none;
    }


    .public-sector-environment-cta{
        align-items:flex-start;
        flex-direction:column;
    }


}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width:700px){


    .public-sector-environment{
        padding:
            75px
            22px
            0;
    }


    .public-sector-environment-intro{
        margin-bottom:52px;
    }


    .public-sector-environment-intro h2{
        font-size:37px;
    }


    .public-sector-environment-intro > p{
        font-size:17px;
    }


    .public-sector-environment-principles{
        grid-template-columns:1fr;
    }


    .public-sector-environment-principle{
        min-height:0;

        padding:
            33px
            8px
            38px;

        border-right:none;

        border-bottom:
            1px solid
            rgba(224,199,127,.16);
    }


    .public-sector-environment-principle:last-child{
        border-bottom:none;
    }


    .public-sector-environment-number{
        margin-bottom:20px;
    }


    .public-sector-environment-principle h3{
        font-size:24px;
    }


    .public-sector-environment-cta{
        padding:
            42px
            0
            50px;
    }


    .public-sector-environment-cta-link{
        width:100%;
    }


}

/* =========================================================
   PUBLIC SECTOR FINAL CTA — GOLD HOVER GLEAM
========================================================= */

.public-sector-environment-cta-link{
    position:relative !important;
    overflow:hidden !important;
    isolation:isolate;
}


/* actual gleam strip */
.public-sector-environment-cta-link::before{
    content:"";

    position:absolute;

    top:-50%;
    left:-75%;

    width:45%;
    height:200%;

    opacity:0;

    background:linear-gradient(
        90deg,
        transparent 0%,
        rgba(240,222,174,.08) 20%,
        rgba(240,222,174,.85) 45%,
        rgba(255,244,195,1) 52%,
        rgba(240,222,174,.42) 68%,
        transparent 100%
    );

    transform:skewX(-20deg);

    pointer-events:none;

    z-index:1;
}


/* keep text + arrow above shine */
.public-sector-environment-cta-link > *{
    position:relative;
    z-index:2;
}


/* hover */
.public-sector-environment-cta-link:hover::before{
    animation:
        publicSectorFinalGleam
        .75s
        ease-out
        1;
}


@keyframes publicSectorFinalGleam{

    0%{
        left:-75%;
        opacity:0;
    }

    10%{
        opacity:1;
    }

    90%{
        opacity:1;
    }

    100%{
        left:135%;
        opacity:0;
    }

}

/* =========================================================
   PUBLIC SECTOR HERO PRIMARY BUTTON — GOLD HOVER GLEAM
========================================================= */

.public-sector-btn-primary{
    position:relative !important;
    overflow:hidden !important;
    isolation:isolate;

    transform: translateY(0);
transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease;
}

.public-sector-btn-primary::before{
    content:"";

    position:absolute;

    top:-50%;
    left:-75%;

    width:45%;
    height:200%;

    opacity:0;

    background:linear-gradient(
        90deg,
        transparent 0%,
        rgba(240,222,174,.08) 20%,
        rgba(240,222,174,.85) 45%,
        rgba(255,244,195,1) 52%,
        rgba(240,222,174,.42) 68%,
        transparent 100%
    );

    transform:skewX(-20deg);

    pointer-events:none;

    z-index:1;
}

.public-sector-btn-primary > *{
    position:relative;
    z-index:2;
}

.public-sector-btn-primary:hover{
    transform: translateY(-4px);

    box-shadow:
        0 16px 34px rgba(0, 0, 0, 0.28),
        0 0 32px rgba(212, 160, 23, 0.20);
}

.public-sector-btn-primary:hover::before{
    animation:publicSectorHeroGleam .75s ease-out 1;
}

@keyframes publicSectorHeroGleam{
    0%{
        left:-75%;
        opacity:0;
    }

    10%{
        opacity:1;
    }

    90%{
        opacity:1;
    }

    100%{
        left:135%;
        opacity:0;
    }
}

/* =========================================================
   PUBLIC SECTOR HERO — LOWER CONTENT SLIGHTLY
   ========================================================= */

.public-sector-hero-inner{
    transform:translateY(25px);
}
/* =========================================================
   PUBLIC SECTOR HERO — MOBILE IMAGE POSITION + DRIFT
   ========================================================= */

@media (max-width:560px){


    .public-sector-hero{
        animation:
            publicSectorHeroDriftMobile
            5s
            ease-in-out
            infinite
            alternate !important;
    }


}

@keyframes publicSectorHeroDriftMobile{

    0%{
        background-position:88% 50%;
    }

    100%{
        background-position:74% 48%
    }

}
/* =========================================================
   PUBLIC SECTOR — MOBILE
   Hide support arrows
   ========================================================= */

@media (max-width:700px){


    .public-sector-support-arrow{
        display:none !important;
    }


}

/* =========================================================
   PUBLIC SECTOR — MOBILE
   Restore dividers between stacked support items
   ========================================================= */

@media (max-width:700px){


    .public-sector-support-item:nth-child(1),
.public-sector-support-item:nth-child(2),
.public-sector-support-item:nth-child(3){
        border-bottom:
            1px solid
            rgba(29,41,82,.18) !important;
    }

    .public-sector-support-item:nth-child(4){
        border-bottom:none !important;
    }

    .public-sector-support-list{
        background-image:none !important;
        grid-template-rows:auto !important;
    }


}
