/* ============================================================
   Creative Agency X — About Core Page
   Route: /about/
   Uses existing global theme width + typography tokens.
   No gradients. No glass. Square geometry.
   ============================================================ */

.cax-about-main{
    --about-red:#F30101;
    --about-black:#000;
    --about-white:#fff;
    --about-line:rgba(0,0,0,.25);
    --about-line-dark:rgba(255,255,255,.26);
    background:#fff;
    color:#000;
    overflow:hidden;
}

.cax-about-main,
.cax-about-main *,
.cax-about-main *::before,
.cax-about-main *::after{
    box-sizing:border-box;
}

.cax-about-shell{
    width:min(
        var(--site-width,1600px),
        calc(100% - (var(--site-gutter,24px) * 2))
    );
    margin-inline:auto;
}

.cax-about-main h1,
.cax-about-main h2,
.cax-about-main h3,
.cax-about-main strong{
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-weight:700;
}

.cax-about-main h1{
    margin:12px 0 0;
    font-size:var(--type-h2);
    line-height:.94;
    letter-spacing:-.035em;
    text-transform:uppercase;
}

.cax-about-main h2{
    margin:12px 0 0;
    font-size:var(--type-h3);
    line-height:.98;
    letter-spacing:-.025em;
    text-transform:uppercase;
}

.cax-about-main h3{
    margin:0;
    font-size:var(--type-h5);
    line-height:1;
    letter-spacing:-.018em;
    text-transform:uppercase;
}

.cax-about-main p,
.cax-about-main li{
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-p);
    line-height:1.5;
}

.cax-about-eyebrow{
    margin:0!important;
    color:var(--about-red);
    font-family:var(--font-impact,Arial,Helvetica,sans-serif)!important;
    font-size:var(--type-ui)!important;
    font-weight:700;
    line-height:1!important;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.cax-about-dark{
    background:#000;
    color:#fff;
}

.cax-about-red{
    background:#F30101;
    color:#fff;
}

.cax-about-breadcrumb{
    min-height:38px;
    padding:10px 0;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;
    border-bottom:1px solid #000;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    line-height:1;
    text-transform:uppercase;
}

.cax-about-breadcrumb a{
    color:#000;
    text-decoration:none;
}

.cax-about-breadcrumb a:hover{
    color:#F30101;
}

.cax-about-breadcrumb span[aria-current="page"]{
    color:#F30101;
}

/* Shared section heading */
.cax-about-section-head{
    padding:clamp(40px,4.5vw,72px) 0 clamp(22px,2.4vw,36px);
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
    gap:clamp(36px,5vw,88px);
    align-items:end;
    border-bottom:1px solid #000;
}

.cax-about-section-head>p{
    max-width:790px;
    margin:0;
}

.cax-about-section-head--dark{
    border-color:var(--about-line-dark);
}

.cax-about-section-head--dark h2,
.cax-about-section-head--dark>p{
    color:#fff;
}

.cax-about-section-head--red{
    border-color:rgba(255,255,255,.58);
}

.cax-about-section-head--red .cax-about-eyebrow,
.cax-about-section-head--red h2,
.cax-about-section-head--red>p{
    color:#fff;
}

/* Buttons */
.cax-about-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:14px;
    margin-top:28px;
}

.cax-about-action{
    min-height:48px;
    padding:12px 16px;
    display:inline-flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    font-weight:700;
    line-height:1;
    text-decoration:none;
    text-transform:uppercase;
}

.cax-about-action--primary{
    background:#000;
    color:#fff;
}

.cax-about-action--primary:hover{
    background:#F30101;
}

.cax-about-action--black{
    background:#000;
    color:#fff;
}

.cax-about-action--black:hover{
    background:#fff;
    color:#000;
}

.cax-about-action--text{
    padding-inline:0;
    color:#000;
    border-bottom:2px solid #F30101;
}

.cax-about-action--text-light{
    padding-inline:0;
    color:#fff;
    border-bottom:2px solid #fff;
}

/* Images */
.cax-about-image{
    margin:0;
    min-width:0;
}

.cax-about-image img{
    display:block;
    width:100%;
    object-fit:cover;
    filter:grayscale(100%);
    border:1px solid #000;
}

.cax-about-image figcaption{
    padding-top:8px;
    display:flex;
    justify-content:space-between;
    gap:16px;
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    line-height:1.3;
}

.cax-about-image figcaption a{
    color:inherit;
    text-decoration-color:#F30101;
}

/* Hero */
.cax-about-hero__grid{
    min-height:clamp(560px,72svh,760px);
    padding:clamp(38px,4.5vw,72px) 0;
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr);
    gap:clamp(40px,6vw,104px);
    align-items:stretch;
    border-bottom:1px solid #000;
}

.cax-about-hero__copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.cax-about-hero__intro{
    max-width:900px;
    margin:24px 0 0;
}

.cax-about-hero__image{
    display:grid;
    grid-template-rows:1fr auto;
}

.cax-about-hero__image img{
    height:100%;
    min-height:380px;
}

.cax-about-signal-grid{
    margin-top:auto;
    padding-top:24px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:1px solid #000;
}

.cax-about-signal-grid>div{
    min-width:0;
    padding:0 14px;
    border-right:1px solid var(--about-line);
}

.cax-about-signal-grid>div:first-child{
    padding-left:0;
}

.cax-about-signal-grid>div:last-child{
    border-right:0;
}

.cax-about-signal-grid span{
    display:block;
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}

.cax-about-signal-grid strong{
    display:block;
    margin-top:6px;
    font-size:var(--type-ui-lg);
    line-height:1.05;
    text-transform:uppercase;
}

/* Identity */
.cax-about-identity{
    padding-bottom:clamp(52px,5vw,90px);
}

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

.cax-about-row-list li{
    display:grid;
    grid-template-columns:78px minmax(260px,.72fr) minmax(0,1.28fr);
    gap:24px;
    padding:24px 0;
    border-bottom:1px solid var(--about-line-dark);
    align-items:start;
}

.cax-about-row-list__number{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    font-weight:700;
}

.cax-about-row-list p{
    margin:0;
    color:rgba(255,255,255,.78);
}

/* Primary disciplines */
.cax-about-disciplines{
    padding-bottom:clamp(54px,5.5vw,92px);
}

.cax-about-discipline-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0;
    border-left:1px solid #000;
    border-bottom:1px solid #000;
}

.cax-about-discipline{
    min-width:0;
    padding:clamp(22px,2.4vw,38px);
    border-top:1px solid #000;
    border-right:1px solid #000;
}

.cax-about-discipline__topline{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding-bottom:15px;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}

.cax-about-discipline__topline span:first-child{
    color:#F30101;
}

.cax-about-discipline__image{
    margin-bottom:26px;
}

.cax-about-discipline__image img{
    aspect-ratio:16/9;
}

.cax-about-discipline>h3{
    font-size:var(--type-h4);
}

.cax-about-discipline__body{
    margin:18px 0 0;
}

.cax-about-discipline__question{
    margin:20px 0 0;
    padding:16px 0;
    border-top:1px solid var(--about-line);
    border-bottom:1px solid var(--about-line);
    font-weight:700;
}

.cax-about-tick-list{
    margin:18px 0 0;
    padding:0;
    list-style:none;
}

.cax-about-tick-list li{
    padding:10px 0 10px 24px;
    position:relative;
    border-bottom:1px solid var(--about-line);
}

.cax-about-tick-list li::before{
    content:"→";
    position:absolute;
    left:0;
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-weight:700;
}

.cax-about-inline-cta{
    margin-top:22px;
    display:inline-flex;
    gap:24px;
    align-items:center;
    color:#000;
    border-bottom:2px solid #F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    font-weight:700;
    text-decoration:none;
    text-transform:uppercase;
}

/* Why together */
.cax-about-together{
    padding-bottom:clamp(50px,5vw,84px);
}

.cax-about-together-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid rgba(255,255,255,.58);
}

.cax-about-together-grid article{
    min-width:0;
    padding:clamp(20px,2vw,32px);
    border-right:1px solid rgba(255,255,255,.58);
    border-bottom:1px solid rgba(255,255,255,.58);
}

.cax-about-together-grid article:nth-child(-n+3){
    border-top:1px solid rgba(255,255,255,.58);
}

.cax-about-together-grid article>span{
    display:block;
    color:#fff;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
}

.cax-about-together-grid h3{
    margin-top:24px;
    color:#fff;
}

.cax-about-together-grid p{
    margin:14px 0 0;
    color:rgba(255,255,255,.88);
}

/* Distributed team */
.cax-about-distributed{
    padding-bottom:clamp(54px,5.5vw,94px);
}

.cax-about-distributed__grid{
    padding-top:clamp(26px,3vw,48px);
    display:grid;
    grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);
    gap:clamp(36px,5vw,84px);
    align-items:start;
}

.cax-about-distributed__image img{
    aspect-ratio:4/5;
}

.cax-about-region-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid #000;
    border-top:1px solid #000;
}

.cax-about-region{
    padding:20px;
    border-right:1px solid #000;
    border-bottom:1px solid #000;
}

.cax-about-region>span{
    display:block;
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}

.cax-about-region h3{
    margin-top:20px;
}

.cax-about-region p{
    margin:14px 0 0;
}

.cax-about-working-rules{
    margin:28px 0 0;
    padding:0;
    list-style:none;
    border-top:1px solid #000;
}

.cax-about-working-rules li{
    padding:15px 0 15px 28px;
    position:relative;
    border-bottom:1px solid var(--about-line);
}

.cax-about-working-rules li::before{
    content:"■";
    position:absolute;
    left:0;
    color:#F30101;
}

/* Delivery */
.cax-about-delivery{
    padding-bottom:clamp(54px,5vw,90px);
}

.cax-about-step-grid{
    margin:0;
    padding:0;
    list-style:none;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid var(--about-line-dark);
}

.cax-about-step-grid li{
    padding:clamp(22px,2.4vw,38px);
    border-right:1px solid var(--about-line-dark);
    border-bottom:1px solid var(--about-line-dark);
}

.cax-about-step-grid li:nth-child(-n+3){
    border-top:1px solid var(--about-line-dark);
}

.cax-about-step-grid li>span{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    font-weight:700;
}

.cax-about-step-grid h3{
    margin-top:28px;
    color:#fff;
}

.cax-about-step-grid p{
    margin:15px 0 0;
    color:rgba(255,255,255,.76);
}

/* Standards */
.cax-about-standards{
    padding-bottom:clamp(54px,5vw,90px);
}

.cax-about-standard-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    border:1px solid #000;
    border-top:0;
}

.cax-about-standard-column{
    padding:clamp(24px,3vw,46px);
}

.cax-about-standard-column+ .cax-about-standard-column{
    border-left:1px solid #000;
}

.cax-about-standard-column--dark{
    background:#000;
    color:#fff;
}

.cax-about-standard-label{
    display:block;
    margin-bottom:22px;
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}

.cax-about-standard-column article{
    padding:20px 0;
    border-top:1px solid var(--about-line);
}

.cax-about-standard-column--dark article{
    border-color:var(--about-line-dark);
}

.cax-about-standard-column p{
    margin:12px 0 0;
}

.cax-about-standard-column--dark p{
    color:rgba(255,255,255,.78);
}

/* Fit */
.cax-about-fit{
    padding-bottom:clamp(54px,5vw,92px);
}

.cax-about-fit-list{
    border-top:1px solid #000;
}

.cax-about-fit-list article{
    display:grid;
    grid-template-columns:72px minmax(0,1fr) 52px;
    gap:22px;
    align-items:center;
    padding:22px 0;
    border-bottom:1px solid #000;
}

.cax-about-fit-list article>span{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    font-weight:700;
}

.cax-about-fit-list article p{
    margin:8px 0 0;
    max-width:980px;
}

.cax-about-fit-list article>a{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    background:#000;
    color:#fff;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h6);
    text-decoration:none;
}

.cax-about-fit-list article>a:hover{
    background:#F30101;
}

/* Service bridge */
.cax-about-services{
    padding-bottom:clamp(54px,5vw,92px);
}

.cax-about-service-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid var(--about-line-dark);
}

.cax-about-service-grid article{
    min-width:0;
    padding:clamp(22px,2.4vw,36px);
    border-right:1px solid var(--about-line-dark);
    border-bottom:1px solid var(--about-line-dark);
}

.cax-about-service-grid article:nth-child(-n+3){
    border-top:1px solid var(--about-line-dark);
}

.cax-about-service-grid article>span{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}

.cax-about-service-grid h3{
    margin-top:20px;
    color:#fff;
}

.cax-about-service-grid p{
    margin:14px 0 0;
    color:rgba(255,255,255,.76);
}

.cax-about-service-grid a{
    margin-top:24px;
    display:inline-flex;
    gap:24px;
    color:#fff;
    border-bottom:2px solid #F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    font-weight:700;
    text-decoration:none;
}

/* Work bridge */
.cax-about-work{
    padding-bottom:clamp(54px,5vw,92px);
}

.cax-about-work-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid #000;
}

.cax-about-work-grid article{
    min-width:0;
    min-height:260px;
    padding:clamp(22px,2.4vw,36px);
    display:flex;
    flex-direction:column;
    border-top:1px solid #000;
    border-right:1px solid #000;
    border-bottom:1px solid #000;
}

.cax-about-work-grid p{
    margin:16px 0 0;
}

.cax-about-work-grid a{
    margin-top:auto;
    padding-top:26px;
    display:inline-flex;
    justify-content:space-between;
    gap:24px;
    color:#000;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    font-weight:700;
    text-decoration:none;
    text-transform:uppercase;
}

.cax-about-work-grid a:hover{
    color:#F30101;
}

/* FAQ */
.cax-about-faq{
    padding-bottom:clamp(54px,5vw,92px);
}

.cax-about-faq-list{
    border-top:1px solid #000;
}

.cax-about-faq-list details{
    border-bottom:1px solid #000;
}

.cax-about-faq-list summary{
    padding:20px 0;
    display:grid;
    grid-template-columns:64px minmax(0,1fr) 36px;
    gap:18px;
    align-items:center;
    cursor:pointer;
    list-style:none;
}

.cax-about-faq-list summary::-webkit-details-marker{
    display:none;
}

.cax-about-faq-list summary>span:first-child{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    font-weight:700;
}

.cax-about-faq-list summary strong{
    font-size:var(--type-h6);
    line-height:1.15;
    text-transform:uppercase;
}

.cax-about-faq-list summary>span:last-child{
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    text-align:right;
}

.cax-about-faq-list details[open] summary>span:last-child{
    transform:rotate(45deg);
}

.cax-about-faq-list details>p{
    max-width:980px;
    margin:0 0 22px 82px;
}

/* Final CTA */
.cax-about-final__grid{
    padding:clamp(52px,6vw,100px) 0;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
    gap:clamp(40px,6vw,100px);
    align-items:end;
}

.cax-about-final .cax-about-eyebrow,
.cax-about-final h2{
    color:#fff;
}

.cax-about-final__grid>div:last-child>p{
    max-width:780px;
    margin:0;
    color:rgba(255,255,255,.9);
}

/* Responsive */
@media (max-width:1180px){
    .cax-about-signal-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:0;
    }

    .cax-about-signal-grid>div{
        padding:12px;
        border-bottom:1px solid var(--about-line);
    }

    .cax-about-signal-grid>div:nth-child(2){
        border-right:0;
    }

    .cax-about-together-grid,
    .cax-about-step-grid,
    .cax-about-service-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .cax-about-together-grid article:nth-child(-n+3),
    .cax-about-step-grid li:nth-child(-n+3),
    .cax-about-service-grid article:nth-child(-n+3){
        border-top:0;
    }

    .cax-about-together-grid article:nth-child(-n+2),
    .cax-about-step-grid li:nth-child(-n+2),
    .cax-about-service-grid article:nth-child(-n+2){
        border-top:1px solid;
    }

    .cax-about-region-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width:980px){
    .cax-about-main h1{
        font-size:var(--type-h3);
    }

    .cax-about-main h2{
        font-size:var(--type-h4);
    }

    .cax-about-main h3{
        font-size:var(--type-h6);
    }

    .cax-about-hero__grid,
    .cax-about-section-head,
    .cax-about-distributed__grid,
    .cax-about-final__grid{
        grid-template-columns:1fr;
    }

    .cax-about-hero__grid{
        min-height:0;
    }

    .cax-about-hero__image img{
        min-height:0;
        aspect-ratio:16/10;
    }

    .cax-about-section-head{
        gap:24px;
        align-items:start;
    }

    .cax-about-row-list li{
        grid-template-columns:60px 1fr;
    }

    .cax-about-row-list li p{
        grid-column:2;
    }

    .cax-about-discipline-grid,
    .cax-about-standard-grid,
    .cax-about-work-grid{
        grid-template-columns:1fr;
    }

    .cax-about-standard-column+ .cax-about-standard-column{
        border-left:0;
        border-top:1px solid #000;
    }

    .cax-about-distributed__image img{
        aspect-ratio:16/10;
    }

    .cax-about-work-grid article{
        min-height:220px;
    }
}

@media (max-width:720px){
    .cax-about-signal-grid,
    .cax-about-together-grid,
    .cax-about-step-grid,
    .cax-about-service-grid{
        grid-template-columns:1fr;
    }

    .cax-about-signal-grid>div{
        border-right:0;
    }

    .cax-about-row-list li{
        grid-template-columns:1fr;
        gap:10px;
    }

    .cax-about-row-list li p{
        grid-column:auto;
    }

    .cax-about-fit-list article{
        grid-template-columns:48px minmax(0,1fr);
    }

    .cax-about-fit-list article>a{
        grid-column:2;
    }

    .cax-about-faq-list summary{
        grid-template-columns:44px minmax(0,1fr) 28px;
    }

    .cax-about-faq-list details>p{
        margin-left:0;
    }

    .cax-about-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .cax-about-action{
        width:100%;
    }

    .cax-about-image figcaption{
        flex-direction:column;
        gap:6px;
    }
}

@media (prefers-reduced-motion:reduce){
    .cax-about-main *,
    .cax-about-main *::before,
    .cax-about-main *::after{
        scroll-behavior:auto!important;
        transition:none!important;
        animation:none!important;
    }
}