/* ===== air_split — text/media split atom (toggle-composed) =====
   Grid columns come from --split-cols (text-col fraction first in DOM terms);
   reverse flips both the template and the visual order, DOM stays text->media.
   Precedence: base -> layout -> reverse -> option classes -> dark (colors only). */

.air-split{
  display:grid;
  grid-template-columns:var(--split-cols,1fr 1fr);
  gap:var(--split-gap,60px);
  align-items:var(--split-valign,center);
  max-width:var(--inner-container-width,1024px);
  margin-inline:auto;
}

/* layout (text / media fractions) */
.air-split--50-50{--split-cols:1fr 1fr;}
.air-split--40-60{--split-cols:2fr 3fr;}
.air-split--60-40{--split-cols:3fr 2fr;}
/* reverse: media takes the first track — flip fractions so widths still mean text/media */
.air-split--rev .air-split__media{order:-1;}
.air-split--rev.air-split--40-60{--split-cols:3fr 2fr;}
.air-split--rev.air-split--60-40{--split-cols:2fr 3fr;}

/* vertical alignment + gap options */
.air-split--v-top{--split-valign:start;}
.air-split--v-bottom{--split-valign:end;}
.air-split--gap-sm{--split-gap:32px;}
.air-split--gap-lg{--split-gap:100px;}

/* text column — typography mirrors air_section_head exactly: flex column,
   20px stack gap, margin:0 elements, sechead color tokens (navy / white+#ECECFB on dark) */
.air-split__text{display:flex;flex-direction:column;gap:20px;align-items:flex-start;min-width:0;}
.air-split__eyebrow{margin:0;}
.air-split__title{margin:0;color:var(--split-heading,var(--air-navy,#151858));}
.air-split__copy{color:var(--split-lede,var(--air-copy,#575755));}
.air-split__copy p{font:inherit;margin:0 0 1em;}
.air-split__copy p:last-child{margin-bottom:0;}
.air-split__copy ul,.air-split__copy ol{margin:0 0 1em;padding-left:1.2em;}
.air-split--copy-lg .air-split__copy{font-size:20px;line-height:35px;}
.air-split--copy-md .air-split__copy{font-size:18px;line-height:1.7;}
.air-split--copy-sm .air-split__copy{font-size:14.5px;line-height:1.6;}
.air-split__cta{margin-top:8px;} /* 20px gap + 8 = sechead's 28px CTA offset */

/* media column */
.air-split__media{margin:0;min-width:0;}
.air-split__frame{overflow:hidden;border-radius:var(--split-radius,10px);}
.air-split--frame-framed .air-split__frame{background:#fff;box-shadow:0 12px 34px rgba(21,23,86,.08);}
.air-split--frame-bare .air-split__frame{background:none;box-shadow:none;}
.air-split__frame img{display:block;width:100%;height:auto;}
.air-split__frame--video{position:relative;aspect-ratio:16/9;background:#0e103d;}
.air-split__frame--video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.air-split__frame--placeholder{position:relative;aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));}
.air-split__play{width:72px;height:72px;border-radius:50%;background:rgba(255,255,255,.14);position:relative;}
.air-split__play::before{content:"";position:absolute;left:55%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:14px 0 14px 22px;border-color:transparent transparent transparent #fff;}
.air-split__ph-label{color:#fff;font-size:14px;font-weight:500;letter-spacing:.08em;}
.air-split__caption{margin-top:12px;text-align:center;color:var(--air-navy-soft,#3C3F7E);opacity:.7;}

/* dark capability — sechead token values, per element (boilerplate main.css beats inheritance) */
.air--dark .air-split{--split-heading:#fff;--split-lede:#ECECFB;}
.air--dark .air-split__title{color:var(--split-heading,#fff);}
.air--dark .air-split__copy{color:var(--split-lede,#ECECFB);}
.air--dark .air-split__caption{color:#fff;}
.air--dark .air-split--frame-framed .air-split__frame{background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));box-shadow:none;}

/* mobile: single column, text first (DOM order) */
@media(max-width:767px){
  .air-split{grid-template-columns:1fr !important;gap:32px;}
  .air-split--rev .air-split__media{order:0;}
}

/* BUG FIX 2026-09-01: same specificity bug as air_media_block — the
   `.air-split--frame-framed/bare .air-split__frame` surface rules (0,2,0) beat
   `.air-split__frame--placeholder` (0,1,0), so an unfilled split rendered as a
   blank box. Placeholders are launch blockers and must be VISIBLE.
   Append-only, higher specificity; only affects instances with no media set. */
.air-split .air-split__frame--placeholder{background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));box-shadow:none;}
.air--dark .air-split .air-split__frame--placeholder{background:var(--air-gradient-panel,linear-gradient(186deg,#1C207E 4.74%,#151858 95.23%));box-shadow:none;}