/* about — "Twenty years of voice innovation" (Claude Design revision, July 2026).
   Static page styles for about.cfm. Uses the site design system from
   lexy-new-design.css: var(--font-sans) DM Sans, var(--font-display)
   Libre Baskerville, lexy purple #8D75E6, lexy-blue #231E41. */
.ab{font-family:var(--font-sans);color:#231E41;}
.ab *{box-sizing:border-box;}
.ab a{color:#7458CC;text-decoration:none;}
.ab a:hover{color:#5B3FD6;}
.ab-wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.ab-eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8D75E6;margin-bottom:16px;}

/* ---------- hero (text + custom brief player) ---------- */
.ab-hero{padding-top:64px;}
.ab-hero .ab-eyebrow{margin-bottom:24px;}
.ab-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,460px);gap:56px;align-items:center;}
.ab-hero-player{min-width:0;}
@media (max-width:1000px){
  .ab-hero-grid{grid-template-columns:1fr;gap:40px;}
  .ab-hero-player lexy-widget{margin:0 !important;max-width:520px !important;}
}
.ab-h1{font-family:var(--font-display);font-weight:400;font-size:clamp(38px,5.2vw,62px);line-height:1.08;letter-spacing:-.01em;max-width:760px;margin:0;text-wrap:balance;}
.ab-hero-lead{font-size:clamp(16px,1.5vw,19px);line-height:1.72;color:#4B4670;max-width:680px;margin:34px 0 0;text-wrap:pretty;}
.ab-dropcap{float:left;font-family:var(--font-display);font-size:74px;line-height:.82;color:#8D75E6;padding:6px 12px 0 0;}

/* ---------- full-bleed photo ---------- */
.ab-photo{margin:64px 0 0;}
.ab-photo img{display:block;width:100%;height:min(64vh,620px);object-fit:cover;}
.ab-photo figcaption{max-width:1180px;margin:0 auto;padding:14px 24px 0;font-size:13px;color:#8A84A6;}

/* ---------- section shells ---------- */
.ab-sec{padding-top:88px;}
.ab-sec-last{padding-bottom:104px;}
.ab-h2{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,3.4vw,40px);line-height:1.14;letter-spacing:-.01em;margin:0;text-wrap:balance;}
.ab-intro{font-size:17px;line-height:1.7;color:#4B4670;max-width:720px;margin:18px 0 0;text-wrap:pretty;}

/* ---------- newsroom callout cards (five orgs, logo strip + tinted body) ---------- */
.ab-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:42px;}
.ab-card{display:flex;flex-direction:column;background:#fff;border-radius:18px;padding:0;overflow:hidden;box-shadow:0 2px 12px rgba(35,30,65,.06);}
.ab-card-logo{display:flex;align-items:center;justify-content:center;height:120px;padding:26px 30px;background:#fff;flex:none;}
.ab-card-logo img{max-height:64px;max-width:72%;object-fit:contain;}
.ab-card-body{background:#F6F4FA;padding:26px 30px 30px;flex:1;}
.ab-card-org{font-family:var(--font-display);font-size:21px;}
.ab-card-where{font-size:12.5px;letter-spacing:.05em;color:#8A84A6;text-transform:uppercase;margin:6px 0 16px;}
.ab-card p{font-size:15px;line-height:1.68;color:#4B4670;margin:0;}

/* ---------- voice eras ---------- */
.ab-eras{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:38px;}
.ab-era{background:#fff;border-radius:16px;padding:22px 24px 26px;}
/* the three era cards that link to blog posts */
a.ab-era{display:block;color:#231E41;text-decoration:none;transition:transform .15s ease;}
a.ab-era:hover{color:#231E41;transform:translateY(-3px);}
.ab-era-img{display:block;width:100%;height:auto;border-radius:10px;margin-bottom:16px;}
.ab-era-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.ab-era-tag{font-size:11.5px;letter-spacing:.08em;font-weight:700;color:#8D75E6;text-transform:uppercase;}
.ab-era-pill{font-size:11px;font-weight:700;letter-spacing:.04em;color:#7458CC;background:rgba(141,117,230,.14);padding:4px 11px;border-radius:999px;white-space:nowrap;}
.ab-era-name{font-family:var(--font-display);font-size:18px;line-height:1.3;min-height:2.6em;margin:12px 0 10px;}
.ab-era p{font-size:13.5px;line-height:1.6;color:#6B6582;margin:0;}
.ab-era-now{background:#231E41;}
.ab-era-now .ab-era-tag{color:#B7A6F2;}
.ab-era-now .ab-era-pill{color:#D9CFFB;background:rgba(184,166,242,.22);}
.ab-era-now .ab-era-name{color:#fff;}
.ab-era-now p{color:#B6AEDD;}

/* ---------- full-bleed pull quote (sits between eras and timeline) ---------- */
.ab-quote{background:#231E41;color:#fff;margin-top:88px;}
.ab-quote-in{max-width:1180px;margin:0 auto;padding:clamp(72px,10vw,116px) 24px;text-align:center;}
.ab-quote-mark{font-family:var(--font-display);font-size:110px;line-height:.6;color:#8D75E6;height:52px;}
.ab-quote blockquote{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,4.6vw,54px);line-height:1.22;max-width:1000px;margin:0 auto;letter-spacing:-.01em;text-wrap:balance;}
.ab-quote-who{font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;color:#B7A6F2;margin-top:34px;}

/* ---------- timeline ---------- */
.ab-tl{margin-top:42px;max-width:660px;padding-left:34px;}
.ab-tl-row{position:relative;padding-bottom:30px;}
/* connector segments live on each row so the line stops at the last dot */
.ab-tl-row::before{content:"";position:absolute;left:-29.5px;top:10px;bottom:-11px;width:2px;background:#D5C9F3;}
.ab-tl-row:last-child::before{display:none;}
.ab-tl-row:last-child{padding-bottom:6px;}
.ab-tl-dot{position:absolute;left:-34px;top:5px;width:11px;height:11px;border-radius:50%;background:#8D75E6;box-shadow:0 0 0 4px #F3ECF7;}
.ab-tl-year{font-size:13px;font-weight:700;letter-spacing:.05em;color:#7458CC;margin-bottom:6px;}
.ab-tl-row p{font-size:16px;line-height:1.66;color:#4B4670;max-width:560px;margin:0;}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .ab-eras{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .ab-hero{padding-top:44px;}
  .ab-sec{padding-top:64px;}
  .ab-photo img{height:48vh;}
  .ab-dropcap{font-size:56px;padding-right:10px;}
  .ab-quote{margin-top:64px;}
  /* both card rows become the standard full-bleed swipeable carousel (matches marketing.css) */
  .ab-cards,.ab-eras{display:flex;grid-template-columns:none;gap:14px;margin:28px -24px 0;padding:4px 24px;
    overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-padding-left:24px;
    scrollbar-width:none;-ms-overflow-style:none;}
  .ab-cards::-webkit-scrollbar,.ab-eras::-webkit-scrollbar{display:none;}
  .ab-card,.ab-era{flex:0 0 78vw;max-width:300px;scroll-snap-align:start;}
}

/* ---------- dark mode (follows the app data-theme toggle) ---------- */
[data-theme="dark"] .ab{color:#fff;}
[data-theme="dark"] .ab-hero-lead,[data-theme="dark"] .ab-intro,[data-theme="dark"] .ab-tl-row p{color:rgba(232,228,240,.8);}
[data-theme="dark"] .ab-card p,[data-theme="dark"] .ab-era p{color:rgba(232,228,240,.7);}
[data-theme="dark"] .ab-era-pill{color:#B9A8F5;background:rgba(168,148,240,.18);}
[data-theme="dark"] .ab-card,[data-theme="dark"] .ab-era{background:#1A2240;box-shadow:none;border:1px solid rgba(255,255,255,.09);}
[data-theme="dark"] .ab-card-logo{background:#fff;}
[data-theme="dark"] a.ab-era,[data-theme="dark"] a.ab-era:hover{color:#fff;}
[data-theme="dark"] .ab-card-body{background:#1A2240;}
[data-theme="dark"] .ab-era-now{background:#231E41;border-color:rgba(255,255,255,.14);}
[data-theme="dark"] .ab-dropcap,[data-theme="dark"] .ab-tl-year{color:#B9A8F5;}
[data-theme="dark"] .ab-tl-dot{box-shadow:0 0 0 4px #0F1629;}
[data-theme="dark"] .ab-tl-row::before{background:rgba(185,168,245,.28);}
[data-theme="dark"] .ab-photo figcaption{color:rgba(232,228,240,.5);}
