/* ============================================================
   Creative Agency X — Pricing Core Page
   Uses existing global width + typography tokens.
   ============================================================ */

.cax-pricing-main{
    --price-black:#000;
    --price-white:#fff;
    --price-red:#F30101;
    --price-light:#f5f5f5;
    color:#000;
    background:#fff;
    overflow:hidden;
}
.cax-pricing-main,
.cax-pricing-main *,
.cax-pricing-main *::before,
.cax-pricing-main *::after{box-sizing:border-box}

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

.cax-pricing-main h1{
    margin:12px 0 0;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h2);
    font-weight:700;
    line-height:.94;
    letter-spacing:-.035em;
    text-transform:uppercase;
}
.cax-pricing-main h2{
    margin:12px 0 0;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h3);
    font-weight:700;
    line-height:.98;
    letter-spacing:-.025em;
    text-transform:uppercase;
}
.cax-pricing-main h3,
.cax-pricing-main strong{
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h6);
    font-weight:700;
}
.cax-pricing-main p{
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-p);
    line-height:1.48;
}
.cax-pricing-eyebrow{
    margin:0!important;
    color:var(--price-red);
    font-family:var(--font-impact,Arial,Helvetica,sans-serif)!important;
    font-size:var(--type-ui)!important;
    font-weight:700;
    line-height:1.05!important;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.cax-pricing-dark{background:#000;color:#fff}
.cax-pricing-red{background:#F30101;color:#fff}

.cax-pricing-breadcrumb{
    min-height:38px;
    padding:10px 0;
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    align-items:center;
    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-pricing-breadcrumb a{color:#000;text-decoration:none}
.cax-pricing-breadcrumb a:hover{color:var(--price-red)}
.cax-pricing-breadcrumb span[aria-current=page]{color:var(--price-red)}

/* Hero */
.cax-pricing-hero__grid{
    min-height:clamp(480px,62svh,640px);
    padding:clamp(54px,6vw,90px) 0;
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr);
    gap:clamp(54px,7vw,112px);
    align-items:center;
}
.cax-pricing-hero h1{max-width:1050px;color:#fff}
.cax-pricing-hero__intro{max-width:900px;margin:22px 0 0;color:rgba(255,255,255,.79)}
.cax-pricing-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:28px}
.cax-pricing-action{
    min-height:48px;
    padding:12px 16px;
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    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-pricing-action--primary{background:#F30101;color:#fff}
.cax-pricing-action--primary:hover{background:#fff;color:#000}
.cax-pricing-action--text{padding-inline:0;color:#fff;border-bottom:2px solid #F30101}
.cax-pricing-action--text-dark{color:#fff}
.cax-pricing-signals{border-top:1px solid rgba(255,255,255,.28)}
.cax-pricing-signals>div{
    min-height:96px;
    padding:14px 0;
    display:grid;
    grid-template-columns:54px minmax(150px,.65fr) minmax(0,1fr);
    gap:16px;
    align-items:center;
    border-bottom:1px solid rgba(255,255,255,.28);
}
.cax-pricing-signals span{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    font-weight:700;
}
.cax-pricing-signals strong{
    color:#fff;
    font-size:var(--type-ui)!important;
    text-transform:uppercase;
}
.cax-pricing-signals p{margin:0;color:rgba(255,255,255,.76);font-size:var(--type-ui-lg)!important;line-height:1.25!important}

/* Common heading */
.cax-pricing-section-head{
    padding:clamp(36px,4vw,60px) 0 clamp(20px,2vw,30px);
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
    gap:clamp(40px,5vw,84px);
    align-items:end;
    border-bottom:1px solid #000;
}
.cax-pricing-section-head>p{max-width:700px;margin:0}
.cax-pricing-section-head--red{border-color:rgba(255,255,255,.6)}
.cax-pricing-section-head--red .cax-pricing-eyebrow,
.cax-pricing-section-head--red h2,
.cax-pricing-section-head--red>p{color:#fff}
.cax-pricing-section-head--dark{border-color:rgba(255,255,255,.28)}
.cax-pricing-section-head--dark h2,
.cax-pricing-section-head--dark>p{color:#fff}

/* Formula */
.cax-pricing-formula{padding-bottom:clamp(48px,5vw,78px)}
.cax-pricing-equation{
    padding:clamp(28px,3vw,44px) 0;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
    gap:24px;
    align-items:center;
    border-bottom:1px solid rgba(255,255,255,.58);
}
.cax-pricing-equation strong{
    color:#fff;
    font-size:var(--type-h3)!important;
    line-height:.98!important;
    text-transform:uppercase;
}
.cax-pricing-equation span{
    color:#000;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h4);
    font-weight:700;
}
.cax-pricing-formula__example{
    display:grid;
    grid-template-columns:110px minmax(180px,.6fr) minmax(180px,.6fr) minmax(0,1.4fr);
    gap:22px;
    align-items:center;
    padding:18px 0;
    border-bottom:1px solid rgba(255,255,255,.58);
}
.cax-pricing-formula__example>span{
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
}
.cax-pricing-formula__example small{
    display:block;
    color:#000;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
}
.cax-pricing-formula__example strong{color:#fff;text-transform:uppercase}
.cax-pricing-formula__example p{margin:0}
.cax-pricing-formula__notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-left:1px solid rgba(255,255,255,.58)}
.cax-pricing-formula__notes p{
    margin:0;
    min-height:125px;
    padding:16px;
    border-right:1px solid rgba(255,255,255,.58);
    border-bottom:1px solid rgba(255,255,255,.58);
}

/* Detail pricing cards */
.cax-pricing-path-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid #000;
    margin-bottom:clamp(50px,6vw,92px);
}
.cax-pricing-path-card{
    min-width:0;
    display:grid;
    grid-template-rows:auto 1fr;
    border-right:1px solid #000;
    border-bottom:1px solid #000;
}
.cax-pricing-path-card__image{margin:0;border-bottom:1px solid #000}
.cax-pricing-path-card__image img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(100%)}
.cax-pricing-path-card__image figcaption{
    min-height:54px;
    padding:8px 10px;
    display:grid;
    gap:4px;
    border-top:1px solid #000;
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    line-height:1.25;
}
.cax-pricing-path-card__image figcaption a{color:#000;text-decoration-color:#F30101}
.cax-pricing-path-card__body{padding:18px;display:flex;flex-direction:column}
.cax-pricing-path-card__meta{display:flex;justify-content:space-between;gap:18px;padding-bottom:12px;border-bottom:1px solid #000}
.cax-pricing-path-card__meta span{color:#F30101;font-family:var(--font-impact,Arial,Helvetica,sans-serif);font-size:var(--type-h5);font-weight:700}
.cax-pricing-path-card__meta strong{font-size:var(--type-ui)!important;text-transform:uppercase}
.cax-pricing-path-card__question{margin:14px 0 0!important;color:#F30101;font-family:var(--font-impact,Arial,Helvetica,sans-serif)!important;font-size:var(--type-ui)!important;font-weight:700;line-height:1.2!important}
.cax-pricing-path-card h3{margin:10px 0 0;text-transform:uppercase}
.cax-pricing-path-card__body>p:not(.cax-pricing-path-card__question){margin:10px 0 0}
.cax-pricing-path-card__ranges{margin-top:18px;border-top:1px solid #000}
.cax-pricing-path-card__ranges>div{
    padding:10px 0;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:4px 18px;
    border-bottom:1px solid rgba(0,0,0,.25);
}
.cax-pricing-path-card__ranges strong{font-size:var(--type-ui)!important;text-transform:uppercase}
.cax-pricing-path-card__ranges span{font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);font-size:var(--type-ui-lg)}
.cax-pricing-path-card__ranges b{
    grid-column:2;
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
}
.cax-pricing-path-card__link{
    margin-top:auto;
    padding-top:18px;
    display:flex;
    justify-content:space-between;
    gap:16px;
    color:#000;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-decoration:none;
    text-transform:uppercase;
}
.cax-pricing-path-card__link span{color:#F30101}
.cax-pricing-path-card__link:hover{color:#F30101}

/* All services */
.cax-pricing-services{padding-bottom:clamp(54px,6vw,94px)}
.cax-pricing-services__meta{
    padding:12px 0;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:10px 24px;
    border-bottom:1px solid rgba(255,255,255,.28);
    color:#fff;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
    text-transform:uppercase;
}
.cax-pricing-services__meta strong{color:#F30101;font-size:var(--type-ui)!important}
.cax-pricing-service-group{padding-top:34px}
.cax-pricing-service-group__head{
    display:grid;
    grid-template-columns:minmax(280px,.5fr) minmax(0,1.5fr);
    gap:28px;
    padding-bottom:14px;
}
.cax-pricing-service-group__head h3{margin:0;color:#F30101;text-transform:uppercase}
.cax-pricing-service-group__head p{margin:0;color:rgba(255,255,255,.76);max-width:900px}
.cax-pricing-table-wrap{overflow-x:auto;border-bottom:1px solid rgba(255,255,255,.28)}
.cax-pricing-table{
    width:100%;
    min-width:1380px;
    border-collapse:collapse;
    color:#fff;
}
.cax-pricing-table th,
.cax-pricing-table td{
    padding:13px;
    border-right:1px solid rgba(255,255,255,.2);
    border-bottom:1px solid rgba(255,255,255,.2);
    vertical-align:top;
    text-align:left;
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    line-height:1.35;
}
.cax-pricing-table thead th{
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    text-transform:uppercase;
}
.cax-pricing-table tbody th{
    width:250px;
    color:#fff;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui-lg);
    text-transform:uppercase;
}
.cax-pricing-table tbody th small,
.cax-pricing-table td small{
    display:block;
    margin-top:6px;
    color:rgba(255,255,255,.58);
    font-family:var(--font-ui,"Epic Pro",Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:400;
    line-height:1.3;
    text-transform:none;
}
.cax-pricing-table td>strong{color:#fff;font-size:var(--type-ui)!important;text-transform:uppercase}
.cax-pricing-table__cax strong{color:#F30101!important;font-size:var(--type-ui-lg)!important}
.cax-pricing-table a{color:#F30101;font-family:var(--font-impact,Arial,Helvetica,sans-serif);font-size:var(--type-ui);font-weight:700;text-decoration:none}
.cax-pricing-table a:hover{text-decoration:underline}
.cax-pricing-services__footnote{max-width:1050px;margin:24px 0 0;color:rgba(255,255,255,.66);font-size:var(--type-ui-lg)!important}

/* Cost layers */
.cax-pricing-cost-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-left:1px solid #000;
    margin-bottom:clamp(50px,6vw,90px);
}
.cax-pricing-cost-grid article{
    min-height:240px;
    padding:18px;
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    gap:10px 16px;
    align-content:start;
    border-right:1px solid #000;
    border-bottom:1px solid #000;
}
.cax-pricing-cost-grid article>span{color:#F30101;font-family:var(--font-impact,Arial,Helvetica,sans-serif);font-size:var(--type-h5);font-weight:700}
.cax-pricing-cost-grid strong{text-transform:uppercase}
.cax-pricing-cost-grid p{grid-column:2;margin:0}
.cax-pricing-cost-grid small{
    grid-column:2;
    margin-top:12px;
    padding-top:10px;
    border-top:1px solid rgba(0,0,0,.25);
    color:#F30101;
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-ui);
    font-weight:700;
}

/* Scope / buying */
.cax-pricing-scope{padding-bottom:clamp(46px,5vw,80px)}
.cax-pricing-scope__list,
.cax-pricing-buying__list{
    margin:0;
    padding:0;
    list-style:none;
    border-top:1px solid currentColor;
}
.cax-pricing-scope__list li,
.cax-pricing-buying__list li{
    display:grid;
    grid-template-columns:70px minmax(260px,.7fr) minmax(0,1.3fr);
    gap:22px;
    padding:16px 0;
    border-bottom:1px solid currentColor;
    align-items:start;
}
.cax-pricing-scope__list span,
.cax-pricing-buying__list span{
    font-family:var(--font-impact,Arial,Helvetica,sans-serif);
    font-size:var(--type-h5);
    font-weight:700;
}
.cax-pricing-scope__list strong,
.cax-pricing-buying__list strong{text-transform:uppercase}
.cax-pricing-scope__list p,
.cax-pricing-buying__list p{margin:0}
.cax-pricing-scope__list li{border-color:rgba(255,255,255,.58)}
.cax-pricing-scope__list{border-color:rgba(255,255,255,.58)}
.cax-pricing-buying{padding-bottom:clamp(50px,6vw,90px)}
.cax-pricing-buying__list span{color:#F30101}

/* FAQ */
.cax-pricing-faq__grid{
    padding:clamp(54px,6vw,90px) 0;
    display:grid;
    grid-template-columns:minmax(300px,.65fr) minmax(0,1.35fr);
    gap:clamp(54px,7vw,110px);
    align-items:start;
}
.cax-pricing-faq__grid h2{margin-top:12px}
.cax-pricing-faq__items{border-top:1px solid #000}
.cax-pricing-faq details{border-bottom:1px solid #000}
.cax-pricing-faq summary{
    min-height:64px;
    padding:10px 0;
    display:grid;
    grid-template-columns:52px minmax(0,1fr) 26px;
    gap:10px;
    align-items:center;
    cursor:pointer;
    list-style:none;
}
.cax-pricing-faq summary::-webkit-details-marker{display:none}
.cax-pricing-faq summary span{color:#F30101;font-family:var(--font-impact,Arial,Helvetica,sans-serif);font-size:var(--type-h6);font-weight:700}
.cax-pricing-faq summary strong{text-transform:uppercase}
.cax-pricing-faq summary i{position:relative;width:18px;height:18px}
.cax-pricing-faq summary i:before,
.cax-pricing-faq summary i:after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    background:#F30101;
    transform:translate(-50%,-50%);
}
.cax-pricing-faq summary i:before{width:18px;height:2px}
.cax-pricing-faq summary i:after{width:2px;height:18px}
.cax-pricing-faq details[open] summary i:after{display:none}
.cax-pricing-faq details>div{padding:0 0 18px 62px}
.cax-pricing-faq details p{margin:0;max-width:900px}

/* Final */
.cax-pricing-final__grid{
    min-height:clamp(360px,48svh,500px);
    padding:clamp(50px,6vw,90px) 0;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
    gap:clamp(52px,7vw,110px);
    align-items:center;
}
.cax-pricing-final h2{color:#fff}
.cax-pricing-final__grid>div:last-child>p{margin:0;color:rgba(255,255,255,.8)}

@media(max-width:1180px){
    .cax-pricing-hero__grid,
    .cax-pricing-faq__grid,
    .cax-pricing-final__grid{grid-template-columns:1fr}
    .cax-pricing-section-head{grid-template-columns:1fr;gap:18px}
    .cax-pricing-path-grid{grid-template-columns:1fr}
    .cax-pricing-path-card{grid-template-columns:minmax(300px,.42fr) minmax(0,.58fr);grid-template-rows:1fr}
    .cax-pricing-path-card__image{border-right:1px solid #000;border-bottom:0}
    .cax-pricing-path-card__image img{height:100%;aspect-ratio:auto}
    .cax-pricing-formula__notes{grid-template-columns:1fr}
    .cax-pricing-cost-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:860px){
    .cax-pricing-main h1{font-size:var(--type-h3);line-height:.96}
    .cax-pricing-main h2{font-size:var(--type-h4);line-height:1}
    .cax-pricing-equation{grid-template-columns:1fr}
    .cax-pricing-equation span{font-size:var(--type-h5)}
    .cax-pricing-formula__example{grid-template-columns:1fr 1fr}
    .cax-pricing-formula__example>span,
    .cax-pricing-formula__example>p{grid-column:1/-1}
    .cax-pricing-path-card{grid-template-columns:1fr}
    .cax-pricing-path-card__image{border-right:0;border-bottom:1px solid #000}
    .cax-pricing-path-card__image img{aspect-ratio:16/8}
    .cax-pricing-cost-grid{grid-template-columns:1fr}
    .cax-pricing-scope__list li,
    .cax-pricing-buying__list li{grid-template-columns:54px 1fr}
    .cax-pricing-scope__list p,
    .cax-pricing-buying__list p{grid-column:2}
    .cax-pricing-service-group__head{grid-template-columns:1fr}

    /* Convert the large all-services table into readable cards on mobile. */
    .cax-pricing-table-wrap{overflow:visible;border:0}
    .cax-pricing-table{min-width:0;display:block}
    .cax-pricing-table thead{display:none}
    .cax-pricing-table tbody{display:grid;gap:14px}
    .cax-pricing-table tr{
        display:block;
        border:1px solid rgba(255,255,255,.28);
    }
    .cax-pricing-table th,
    .cax-pricing-table td{
        display:block;
        width:100%;
        border-right:0;
        padding:11px 12px;
    }
    .cax-pricing-table td:before{
        content:attr(data-label);
        display:block;
        margin-bottom:4px;
        color:#F30101;
        font-family:var(--font-impact,Arial,Helvetica,sans-serif);
        font-size:var(--type-ui);
        font-weight:700;
        text-transform:uppercase;
    }
}

@media(max-width:560px){
    .cax-pricing-shell{
        width:min(var(--site-width,1600px),calc(100% - 32px));
    }
    .cax-pricing-signals>div{grid-template-columns:44px 1fr}
    .cax-pricing-signals p{grid-column:2}
    .cax-pricing-actions{align-items:stretch}
    .cax-pricing-action{width:100%}
    .cax-pricing-action--text{width:max-content}
    .cax-pricing-faq details>div{padding-left:0}
    .cax-pricing-faq summary{grid-template-columns:42px minmax(0,1fr) 24px}
}

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