/* Fractional Chief AI Officer page additions.
 * Shared structure and tokens come from ai-programs-v2.css and architect-v2.css.
 */

.caio-v2 .apv2-hero__layout { grid-template-columns: minmax(0, 1fr) minmax(500px, .95fr); }
.caio-v2 .apv2-panel__rows > div { min-height: 64px; }

/* Deliverables ----------------------------------------------------------- */

.caio-deliverables { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--ap-line); border-left: 1px solid var(--ap-line); background: #fff; }
.caio-deliverables article { position: relative; display: grid; grid-template-columns: 120px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 28px; min-height: 210px; padding: 26px; border-right: 1px solid var(--ap-line); border-bottom: 1px solid var(--ap-line); }
.caio-deliverables__meta { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: flex-start; gap: 46px; }
.caio-deliverables__meta span { color: var(--ap-green); font-size: 10px; font-weight: 700; letter-spacing: .1em; }
.caio-deliverables__meta b { color: #777b75; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.caio-deliverables h3 { grid-column: 2; grid-row: 1; max-width: 440px; margin: 0 0 12px; font-size: 21px; line-height: 1.2; font-weight: 600; letter-spacing: 0; }
.caio-deliverables p { grid-column: 2; grid-row: 2; max-width: 440px; margin: 0; color: var(--ap-muted); font-size: 13px; line-height: 1.65; }
.caio-deliverables article > i { position: absolute; right: 20px; bottom: 20px; width: 8px; height: 8px; border-radius: 50%; background: var(--ap-lime); box-shadow: 0 0 0 4px rgba(101,125,0,.1); }

/* Operating cadence ------------------------------------------------------ */

.caio-cadence { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ap-line-light); border-left: 1px solid var(--ap-line-light); }
.caio-cadence article { display: flex; flex-direction: column; min-height: 330px; padding: 26px; border-right: 1px solid var(--ap-line-light); border-bottom: 1px solid var(--ap-line-light); }
.caio-cadence__top { display: flex; justify-content: space-between; align-items: center; }
.caio-cadence__top span { color: var(--ap-lime); font-size: 9px; font-weight: 700; letter-spacing: .1em; }
.caio-cadence__top b { padding: 6px 9px; border: 1px solid rgba(229,254,150,.3); color: var(--ap-lime); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.caio-cadence h3 { margin: 68px 0 14px; color: #fff; font-size: 24px; line-height: 1.15; font-weight: 600; letter-spacing: 0; }
.caio-cadence > article > p { margin: 0; color: rgba(255,255,255,.58); font-size: 13px; line-height: 1.65; }
.caio-cadence__output { margin-top: auto; padding-top: 20px; border-top: 1px solid var(--ap-line-light); }
.caio-cadence__output span { display: block; margin-bottom: 6px; color: rgba(255,255,255,.42); font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.caio-cadence__output strong { color: #fff; font-size: 13px; font-weight: 600; }

/* Decision boundaries ---------------------------------------------------- */

.caio-boundaries { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ap-line); border-left: 1px solid var(--ap-line); }
.caio-boundaries article { min-height: 330px; padding: 26px; border-right: 1px solid var(--ap-line); border-bottom: 1px solid var(--ap-line); background: #fff; }
.caio-boundaries article.is-primary { background: var(--ap-olive); color: #fff; }
.caio-boundaries > article > span { color: var(--ap-green); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.caio-boundaries article.is-primary > span { color: var(--ap-lime); }
.caio-boundaries h3 { margin: 52px 0 24px; font-size: 23px; line-height: 1.18; font-weight: 600; letter-spacing: 0; }
.caio-boundaries ul { margin: 0; padding: 0; border-top: 1px solid var(--ap-line); list-style: none; }
.caio-boundaries article.is-primary ul { border-color: rgba(255,255,255,.18); }
.caio-boundaries li { position: relative; padding: 12px 0 12px 18px; border-bottom: 1px solid var(--ap-line); color: var(--ap-muted); font-size: 13px; line-height: 1.5; }
.caio-boundaries li:before { position: absolute; left: 0; color: var(--ap-green); content: "\21b3"; }
.caio-boundaries article.is-primary li { border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.72); }
.caio-boundaries article.is-primary li:before { color: var(--ap-lime); }

@media (max-width: 1100px) {
    .caio-v2 .apv2-hero__layout { grid-template-columns: 1fr; }
    .caio-cadence,
    .caio-boundaries { grid-template-columns: 1fr; }
    .caio-cadence article,
    .caio-boundaries article { min-height: 280px; }
}

@media (max-width: 800px) {
    .caio-deliverables { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .caio-deliverables article { display: flex; flex-direction: column; min-height: 230px; }
    .caio-deliverables__meta { flex-direction: row; justify-content: space-between; width: 100%; gap: 20px; margin-bottom: 42px; }
    .caio-deliverables h3,
    .caio-deliverables p { max-width: none; }
    .caio-cadence h3 { margin-top: 48px; }
}
