/* Compact Section 5 disclosures shared by the homepage and design preview. */
#implementation .fa-disclosures { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); max-width:82rem; align-items:start; gap:.9rem; margin:1.5rem auto 1.75rem; }
#implementation .fa-disclosure { --fa-accent:#d53450; --fa-tint:#fff1f4; grid-column:span 2; min-width:0; border:1px solid #c4d6eb; border-radius:1rem; background:#fffffff5; color:#061944; box-shadow:0 8px 24px #24467612; transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease; }
#implementation .fa-disclosure:nth-child(4) { grid-column:2 / span 2; }
#implementation .fa-disclosure--direction { --fa-accent:#0874d6; --fa-tint:#edf6ff; }
#implementation .fa-disclosure--capability { --fa-accent:#7043d5; --fa-tint:#f3edff; }
#implementation .fa-disclosure--practice { --fa-accent:#028297; --fa-tint:#e8fbff; }
#implementation .fa-disclosure--impact { --fa-accent:#7043d5; --fa-tint:#f3edff; }
#implementation .fa-disclosure summary { display:flex; align-items:center; padding:1rem 1.15rem; min-height:82px; border-radius:1rem; list-style:none; cursor:pointer; }
#implementation .fa-disclosure summary::-webkit-details-marker { display:none; }
#implementation .fa-disclosure summary::marker { content:""; }
#implementation .fa-disclosure summary h3 { display:grid; grid-template-columns:40px minmax(0,1fr) 10px; gap:.85rem; align-items:center; width:100%; min-height:40px; margin:0; color:#061944; font-family:var(--ars-font-sans); font-size:1.1rem; font-weight:650; line-height:1.18; letter-spacing:-.02em; }
#implementation .fa-icon { display:grid; place-items:center; width:40px; height:40px; padding:8px; margin:0; color:var(--fa-accent); background:var(--fa-tint); border:1px solid color-mix(in srgb,var(--fa-accent) 20%,white); border-radius:50%; }
#implementation .fa-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.5; }
#implementation .fa-disclosure--urgency .fa-icon svg { fill:currentColor; stroke:none; }
#implementation .fa-chevron { width:7px; height:7px; margin-bottom:4px; border:solid #335677; border-width:0 1.5px 1.5px 0; transform:rotate(45deg); transition:transform 180ms ease; }
#implementation .fa-disclosure[open] { border-color:var(--fa-accent); background:linear-gradient(145deg,var(--fa-tint),#fff 58%); box-shadow:0 12px 30px #2446761c; }
#implementation .fa-disclosure[open] .fa-chevron { transform:translateY(3px) rotate(225deg); }
#implementation .fa-answer { padding:0 1.25rem 1.15rem 4.55rem; }
#implementation .fa-answer p { margin:0; padding-top:.85rem; border-top:1px solid #dbe6f1; color:#263f66; font-size:1rem; line-height:1.5; }
#implementation .fa-disclosure summary:focus-visible { outline:3px solid #1957c4; outline-offset:4px; box-shadow:0 0 0 2px #fff; }
#implementation .fa-disclosure summary:active { background:#f0f7ff; }
@media(hover:hover) and (pointer:fine) {
  #implementation .fa-disclosure summary:hover { background:#f5faff; }
  #implementation .fa-disclosure:hover { border-color:#8faacb; transform:translateY(-2px); box-shadow:0 14px 30px #2446761b; }
  #implementation .fa-disclosure[open]:hover { border-color:var(--fa-accent); }
}
@media(prefers-reduced-motion:reduce) {
  #implementation .fa-disclosure,#implementation .fa-chevron { transition:none; transform:none !important; }
}
@media(forced-colors:active) {
  #implementation .fa-disclosure,#implementation .fa-icon { border-color:CanvasText; }
}

/* Keep the introduction on the white side and give the second sentence its own line. */
#implementation .ars-implementation-intro .ars-copy {
  max-width: 42ch;
  text-wrap: pretty;
}
#implementation .ars-implementation-intro .ars-copy > span { display: block; }
#implementation .ars-implementation-intro .ars-copy > span + span { margin-top: .35rem; }
@media (max-width: 76rem) {
  #implementation .fa-disclosures { grid-template-columns:repeat(4,minmax(0,1fr)); }
  #implementation .fa-disclosure:nth-child(4) { grid-column:span 2; }
  #implementation .fa-disclosure:nth-child(5) { grid-column:2 / span 2; }
}
@media (max-width: 42rem) {
  #implementation .ars-implementation-intro .ars-copy { padding: .375rem 0; }
  #implementation .fa-disclosures { grid-template-columns:minmax(0,1fr); gap:.4rem; margin:1.25rem 0; }
  #implementation .fa-disclosure,
  #implementation .fa-disclosure:nth-child(4),
  #implementation .fa-disclosure:nth-child(5) { grid-column:auto; border-radius:.8rem; }
  #implementation .fa-disclosure summary { min-height:54px; padding:.625rem .875rem; border-radius:.8rem; }
  #implementation .fa-disclosure summary h3 { grid-template-columns:32px minmax(0,1fr) 10px; gap:.65rem; min-height:32px; font-size:1.0625rem; }
  #implementation .fa-icon { width:32px; height:32px; padding:6px; }
  #implementation .fa-answer { padding-left: 1rem; }
}

@media (min-width: 64.0625rem) {
  #implementation.ars-section::before {
    background-image: linear-gradient(90deg, #fff 0%, #fff 32%, rgb(255 255 255 / .46) 52%, transparent 67%), linear-gradient(180deg, transparent 70%, rgb(236 248 255 / .7) 100%), url("/assets/section5-mountain-students-v2.webp");
  }
}
@media (max-width: 64rem) {
  #implementation .ars-implementation-intro .ars-copy { background: #fff; }
}