/* =============================================================================
   HOME — page-specific sections
   =============================================================================
   Requires ax-system.css (loaded first): tokens, type scale, buttons, section
   shell, header/footer, motion, hero (.ax-hero*), trust (.ax-trust*), CTA
   (.ax-cta*), and .ax-platforms. This file styles ONLY home's own sections.

   Sections: shift · capabilities · products · outcomes · why
   Treatments deliberately mirror the AI Solutions page so the site reads as one
   system — numbered statement lists, definition-list rows, big-number outcomes.
   ============================================================================= */


/* =============================================================================
   THE SHIFT — numbered statements + the pivot remark (mirrors .ax-problems)
   ============================================================================= */
.home-shift {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 880px;
}

.home-shift__item {
    display: grid;
    grid-template-columns: 52px 1fr;
    gap: 0 28px;
    align-items: baseline;
    padding: clamp(20px, 2.8vw, 30px) 0;
    border-top: 1px solid var(--ax-border);
}
.home-shift__item:last-child { border-bottom: 1px solid var(--ax-border); }

.home-shift__no {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: 13px;
    color: var(--ax-text-3);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.home-shift__text {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: clamp(19px, 2.1vw, 29px);
    line-height: 1.32;
    letter-spacing: -0.022em;
    color: var(--ax-text);
    margin: 0;
    text-wrap: balance;
}

/* Pivot remark — read like a closing line (mirrors .ax-aside) */
.home-aside {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: clamp(20px, 2.2vw, 30px);
    line-height: 1.32;
    letter-spacing: -0.022em;
    color: var(--ax-text);
    max-width: 24ch;
    margin: clamp(52px, 6vw, 80px) 0 0;
    text-wrap: balance;
}


/* =============================================================================
   CAPABILITIES — definition-list rows, each a link (mirrors .ax-cap + a cue)
   ============================================================================= */
.home-cap__lead { margin-top: 20px; }

.home-cap { margin: 0; padding: 0; }

.home-cap__row {
    display: grid;
    grid-template-columns: 48px minmax(220px, 280px) 1fr auto;
    gap: 0 40px;
    align-items: baseline;
    padding: clamp(24px, 3vw, 36px) 0;
    border-top: 1px solid var(--ax-border-2);
    text-decoration: none;
    transition: background-color 0.2s var(--ax-ease);
}
.home-cap__row:last-child { border-bottom: 1px solid var(--ax-border-2); }

/* A faint surface lift on hover — discovered, not loud */
.home-cap__row:hover {
    background-color: rgba(33, 49, 100, 0.025);
}

.home-cap__no {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: 13px;
    color: var(--ax-accent-soft);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

.home-cap__name {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(18px, 1.7vw, 23px);
    letter-spacing: -0.02em;
    color: var(--ax-text);
    margin: 0;
    line-height: 1.2;
}

.home-cap__desc {
    font-family: var(--ax-font-body);
    font-size: clamp(15px, 1.25vw, 16.5px);
    line-height: 1.58;
    color: var(--ax-text-2);
    margin: 0;
    max-width: 52ch;
}

.home-cap__cue {
    font-family: var(--ax-font-body);
    font-size: 18px;
    color: var(--ax-text-3);
    transition: transform 0.2s var(--ax-ease), color 0.2s var(--ax-ease);
    align-self: center;
}
.home-cap__row:hover .home-cap__cue {
    transform: translateX(4px);
    color: var(--ax-accent);
}

/* Explore Services — the deliberate hand-off to the page that holds the depth. */
.home-cap__foot { margin: clamp(36px, 4vw, 52px) 0 0; }


/* =============================================================================
   PRODUCTS — three editorial rows, each a link. No dashboard mockups.
   ============================================================================= */
.home-prod {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--ax-border);
}

.home-prod__item { border-bottom: 1px solid var(--ax-border); }

.home-prod__link {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: 0 36px;
    align-items: center;
    padding: clamp(28px, 3.5vw, 44px) 0;
    text-decoration: none;
    transition: padding-left 0.25s var(--ax-ease);
}
.home-prod__link:hover { padding-left: 12px; }

.home-prod__no {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--ax-text);
    opacity: 0.12;
    font-variant-numeric: tabular-nums;
    transition: opacity 0.25s var(--ax-ease), color 0.25s var(--ax-ease);
}
.home-prod__link:hover .home-prod__no { opacity: 1; color: var(--ax-accent); }

.home-prod__body { display: flex; flex-direction: column; gap: 7px; }

.home-prod__tag {
    font-family: var(--ax-font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ax-accent-soft);
}

.home-prod__name {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(22px, 2.6vw, 34px);
    letter-spacing: -0.028em;
    color: var(--ax-text);
    line-height: 1.08;
}

.home-prod__desc {
    font-family: var(--ax-font-body);
    font-size: clamp(15px, 1.25vw, 16.5px);
    line-height: 1.55;
    color: var(--ax-text-2);
    max-width: 56ch;
}

.home-prod__cue {
    font-family: var(--ax-font-body);
    font-size: 20px;
    color: var(--ax-text-3);
    transition: transform 0.2s var(--ax-ease), color 0.2s var(--ax-ease);
}
.home-prod__link:hover .home-prod__cue { transform: translateX(5px); color: var(--ax-accent); }

.home-prod__foot { margin: clamp(36px, 4vw, 52px) 0 0; }


/* =============================================================================
   OUTCOMES — three big numbers (mirrors the AI Solutions metric register)
   ============================================================================= */
.home-out {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--ax-border);
    border-bottom: 1px solid var(--ax-border);
}

.home-out__item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: clamp(36px, 4.5vw, 60px) clamp(24px, 2.5vw, 44px) clamp(36px, 4.5vw, 60px) 0;
    border-right: 1px solid var(--ax-border);
}
.home-out__item:last-child { border-right: none; padding-right: 0; }

.home-out__v {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(56px, 7vw, 96px);
    line-height: 0.9;
    letter-spacing: -0.05em;
    color: var(--ax-text);
    font-variant-numeric: tabular-nums;
}

.home-out__label {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(15px, 1.3vw, 18px);
    letter-spacing: -0.015em;
    color: var(--ax-text);
}

.home-out__ctx {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--ax-border-2);
}
.home-out__ctx-name {
    font-family: var(--ax-font-body);
    font-size: 13.5px;
    color: var(--ax-text-2);
    line-height: 1.4;
}
.home-out__ind {
    font-family: var(--ax-font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ax-text-3);
}


/* =============================================================================
   WHY — four differentiators (mirrors the proof-pillar register)
   ============================================================================= */
.home-why {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(28px, 3.5vw, 56px);
}

.home-why__item {
    display: flex;
    flex-direction: column;
    padding-top: 22px;
    border-top: 2px solid var(--ax-accent);   /* navy rule */
}

.home-why__no {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: 13px;
    color: var(--ax-text-3);
    font-variant-numeric: tabular-nums;
    margin-bottom: 16px;
}

.home-why__name {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(18px, 1.7vw, 22px);
    letter-spacing: -0.02em;
    color: var(--ax-text);
    margin: 0 0 10px;
    line-height: 1.2;
}

.home-why__desc {
    font-family: var(--ax-font-body);
    font-size: clamp(14px, 1.15vw, 15.5px);
    line-height: 1.58;
    color: var(--ax-text-2);
    margin: 0;
}


/* =============================================================================
   OPERATING MODEL — four principles as editorial statement rows.
   number | name | statement. Same register as capabilities, no link/cue.
   ============================================================================= */
.home-model__lead { margin-top: 20px; }

.home-model { margin: 0; padding: 0; }

.home-model__row {
    display: grid;
    grid-template-columns: 48px minmax(220px, 300px) 1fr;
    gap: 0 40px;
    align-items: baseline;
    padding: clamp(26px, 3.2vw, 40px) 0;
    border-top: 1px solid var(--ax-border-2);
}
.home-model__row:last-child { border-bottom: 1px solid var(--ax-border-2); }

.home-model__no {
    font-family: var(--ax-font-head);
    font-weight: 500;
    font-size: 13px;
    color: var(--ax-accent-soft);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

.home-model__name {
    font-family: var(--ax-font-head);
    font-weight: 600;
    font-size: clamp(19px, 1.9vw, 26px);
    letter-spacing: -0.022em;
    color: var(--ax-text);
    margin: 0;
    line-height: 1.14;
}

.home-model__desc {
    font-family: var(--ax-font-body);
    font-size: clamp(15px, 1.3vw, 17px);
    line-height: 1.62;
    color: var(--ax-text-2);
    margin: 0;
    max-width: 56ch;
}


/* =============================================================================
   RESPONSIVE — TABLET  ≤ 980px
   ============================================================================= */
@media (max-width: 980px) {

    /* Capabilities: name stacks above description; cue moves under */
    .home-cap__row {
        grid-template-columns: 40px 1fr auto;
        gap: 4px 24px;
    }
    .home-cap__name { grid-column: 2; }
    .home-cap__desc { grid-column: 2; margin-top: 4px; }
    .home-cap__cue  { grid-row: 1; grid-column: 3; align-self: start; }

    /* Outcomes: 3 → stacked pairs is awkward; keep 3 but tighten */
    .home-out { grid-template-columns: 1fr 1fr; }
    .home-out__item:nth-child(2) { border-right: none; padding-right: 0; }
    .home-out__item:nth-child(3) {
        border-top: 1px solid var(--ax-border);
        grid-column: 1 / -1;
    }

    /* Why: 4 → 2 × 2 */
    .home-why { grid-template-columns: 1fr 1fr; gap: 40px 32px; }

    /* Operating model: name stacks above statement */
    .home-model__row { grid-template-columns: 48px 1fr; gap: 6px 24px; }
    .home-model__name { grid-column: 2; }
    .home-model__desc { grid-column: 2; margin-top: 4px; }
}


/* =============================================================================
   RESPONSIVE — MOBILE  ≤ 640px
   ============================================================================= */
@media (max-width: 640px) {

    /* Shift rows */
    .home-shift__item { grid-template-columns: 32px 1fr; gap: 0 14px; padding: 20px 0; }
    .home-shift__text { font-size: 20px; }
    .home-aside { font-size: 22px; max-width: 100%; }

    /* Capabilities: drop the number, single column body */
    .home-cap__row { grid-template-columns: 1fr auto; gap: 6px 16px; }
    .home-cap__no { display: none; }
    .home-cap__name { grid-column: 1; }
    .home-cap__desc { grid-column: 1; }
    .home-cap__cue { grid-column: 2; grid-row: 1; }

    /* Products: number inline-small, stack body */
    .home-prod__link { grid-template-columns: 1fr auto; gap: 0 16px; padding: 26px 0; }
    .home-prod__no { display: none; }
    .home-prod__name { font-size: 23px; }

    /* Outcomes: single column */
    .home-out { grid-template-columns: 1fr; }
    .home-out__item {
        border-right: none;
        border-top: 1px solid var(--ax-border);
        padding: 30px 0;
    }
    .home-out__item:first-child { border-top: none; }
    .home-out__item:nth-child(3) { border-top: 1px solid var(--ax-border); }
    .home-out__v { font-size: clamp(48px, 16vw, 72px); }

    /* Why: single column */
    .home-why { grid-template-columns: 1fr; gap: 28px; }

    /* Operating model: drop the number, single column */
    .home-model__row { grid-template-columns: 1fr; gap: 6px; }
    .home-model__no { display: none; }
}