/* Aimbition - Cards. Every rule is scoped under .acd; sizes are in px because the
   theme sets html{font-size:62.5%}. Fonts and colours come from the Aimbition theme. */
.acd{
  --acd-gold:#dabf5a;
  --acd-bg:var(--body-bg-color,#0f3848); --acd-dark:var(--dark-color,#031723);
  --acd-ink:var(--body-color,#fff); --acd-accent:var(--accent-color,#51807c);
  --acd-mist:color-mix(in srgb, var(--acd-ink) 76%, transparent);
  --acd-line:color-mix(in srgb, var(--acd-ink) 14%, transparent);
  width:100%; padding:clamp(70px,10vh,130px) 0; color:var(--acd-ink); background:var(--acd-bg);
}
.acd *, .acd *::before, .acd *::after{box-sizing:border-box}
/* same container as the theme's own modules, so left edges line up */
.acd-wrap{max-width:var(--full-width,1440px); margin:0 auto; padding:0 var(--padding,24px)}
.acd .acd-eyebrow{
  display:flex; align-items:center; gap:12px; margin:0 0 18px;
  font-size:12px; font-weight:500; letter-spacing:.22em; line-height:1.4; text-transform:uppercase; color:var(--acd-gold);
}
.acd .acd-eyebrow::before{content:""; width:26px; height:2px; background:var(--acd-gold); flex:none}
.acd .acd-heading{margin:0 0 18px; color:var(--acd-ink); font-size:clamp(30px,4.2vw,50px); line-height:1.02; text-transform:uppercase; text-wrap:balance}
.acd .acd-lead{margin:0; max-width:62ch; font-size:clamp(16px,1.4vw,19px); line-height:1.65; color:var(--acd-mist)}
.acd-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:46px}
.acd-card{
  position:relative; overflow:hidden; padding:32px 30px 34px; border-radius:12px;
  background:color-mix(in srgb, var(--acd-dark) 70%, var(--acd-bg)); border:1px solid var(--acd-line);
}
.acd .acd-label{display:block; margin-bottom:14px; font-size:12px; font-weight:500; letter-spacing:.16em; line-height:1.4; text-transform:uppercase; color:color-mix(in srgb, var(--acd-accent) 55%, var(--acd-ink))}
.acd .acd-title{margin:0 0 12px; font-family:inherit; font-size:23px; font-weight:700; line-height:1.3; letter-spacing:0; text-transform:none; color:var(--acd-ink)}
.acd .acd-text{margin:0; font-size:17px; line-height:1.6; color:var(--acd-mist)}
.acd .acd-closing{margin-top:52px; max-width:36ch; font-size:clamp(19px,2.2vw,25px); font-weight:300; line-height:1.45; color:var(--acd-ink)}
.acd .acd-closing p{margin:0; font-size:inherit; line-height:inherit; color:inherit}
.acd .acd-closing em, .acd .acd-closing strong{font-style:normal; font-weight:500; color:var(--acd-gold)}
/* columns follow the number of cards (six or more keep the default three) */
.acd-grid.acd-count-1{grid-template-columns:minmax(0,1fr)}
.acd-grid.acd-count-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.acd-grid.acd-count-4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* five cards: one row, slightly tighter so the larger text still fits */
.acd-grid.acd-count-5{grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px}
.acd-grid.acd-count-5 > .acd-card{padding:26px 22px 28px}
.acd-grid.acd-count-5 .acd-title{font-size:21px}
.acd-grid.acd-count-5 .acd-text{font-size:16px}
.acd .acd-actions{margin-top:40px; display:flex; justify-content:flex-end}
.acd .acd-actions .button{width:auto; margin:0}
.acd.acd--tight{padding:26px 0}
/* optional line icon on a card */
.acd .acd-ic{display:flex; align-items:center; justify-content:center; width:46px; height:46px; margin-bottom:22px; border-radius:50%;
  color:color-mix(in srgb, var(--acd-accent) 45%, var(--acd-ink)); background:color-mix(in srgb, var(--acd-accent) 34%, transparent)}
.acd .acd-ic svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
/* style "statements": a few large, light sentences (mission, who we serve) */
.acd--statements .acd-card{padding:30px 28px 36px}
.acd--statements .acd-label{letter-spacing:.2em; color:var(--acd-gold)}
.acd--statements .acd-text{font-size:clamp(18px,1.6vw,22px); font-weight:300; line-height:1.5; color:var(--acd-ink)}
/* style "tiles": solid accent tiles (values) */
.acd--tiles .acd-card{padding:22px 22px 26px; border-color:transparent; background:var(--acd-accent)}
.acd--tiles .acd-title{font-size:16.5px}
.acd--tiles .acd-text{font-size:13.5px; color:color-mix(in srgb, var(--acd-ink) 92%, transparent)}
/* style "split": the problem in the dark upper part, the answer in a teal lower half */
.acd--split .acd-card{display:flex; flex-direction:column; padding:30px 28px 0}
.acd--split .acd-text{margin-bottom:26px}
.acd--split .acd-answer{margin:auto -28px 0; padding:20px 28px 24px; background:var(--secondary-color,#185366); border-top:1px solid var(--acd-line)}
.acd .acd-answer-label{display:block; margin-bottom:6px; font-size:12px; font-weight:500; letter-spacing:.16em; line-height:1.4; text-transform:uppercase; color:var(--acd-gold)}
.acd .acd-answer-text{margin:0; font-size:17px; line-height:1.55; color:var(--acd-ink)}
/* line up title, text and answer across the cards in a row, so the teal halves start at the same height */
@supports (grid-template-rows:subgrid){.acd--split .acd-card{display:grid; grid-row:span 3; grid-template-rows:subgrid; row-gap:0} .acd--split .acd-answer{margin:0 -28px}}
/* style "band": a slim strip of bold one-liners with a gold dot (megatrends) */
.acd.acd--band{padding:34px 0 38px; border-top:1px solid var(--acd-line); border-bottom:1px solid var(--acd-line)}
.acd--band .acd-eyebrow{margin-bottom:6px}
.acd--band .acd-grid{gap:20px 46px; margin-top:16px}
.acd--band .acd-card{padding:0 0 0 22px; overflow:visible; border:0; border-radius:0; background:none}
.acd--band .acd-card::before{content:""; position:absolute; left:0; top:7px; width:9px; height:9px; border-radius:50%; background:var(--acd-gold)}
.acd--band .acd-title{margin:0; font-size:15px; font-weight:700; letter-spacing:.1em; line-height:1.5; text-transform:uppercase}
@media (max-width:1200px){.acd-grid.acd-count-5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:980px){.acd-grid, .acd-grid[class*="acd-count-"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.acd-grid, .acd-grid[class*="acd-count-"]{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.acd *, .acd *::before, .acd *::after{animation:none!important; transition:none!important}}
/* Titles break between words only (no mid-word breaks or hyphens), and in a row of five plain cards titles and
   texts start on the same line across the row (from the GitHub repo aimbition-website-2026, 2026-10-29). */
.acd .acd-title{word-break:normal; overflow-wrap:normal; hyphens:none}
.acd--cards .acd-grid.acd-count-5>.acd-card{display:grid; grid-row:span 2; grid-template-rows:subgrid; row-gap:0; align-content:start}
