/* KSCoolDesign – About page (loads after style.css, reuses its tokens) */

.page-about { overflow-x: hidden; }
.page-about .site-header {
  background: linear-gradient(to bottom, rgba(11, 9, 8, 0.85), rgba(11, 9, 8, 0));
}

.ab-section { position: relative; padding: clamp(64px, 11vh, 130px) 0; }
.ab-head { display: grid; gap: 10px; margin-bottom: clamp(28px, 5vh, 56px); }

/* ---------- 1. Hero ---------- */
.ab-hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: clamp(520px, 78vh, 860px);
  display: grid; align-items: center;
  padding: calc(var(--header-h) + clamp(24px, 5vh, 60px)) 0 clamp(48px, 8vh, 96px);
}
.ab-hero__bg {
  position: absolute; inset: 0; z-index: -2;
  background: url("../assets/img/background-wide.webp") center / cover no-repeat, var(--bg);
  opacity: 0.85;
}
.ab-hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(11, 9, 8, 0.35) 0%, rgba(11, 9, 8, 0.2) 55%, var(--bg) 100%);
}
.ab-hero__glow {
  position: absolute; z-index: -1; left: 8%; top: 30%;
  width: min(560px, 70vw); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(210, 64, 42, 0.28), transparent 65%);
  filter: blur(20px); pointer-events: none;
}
.ab-hero__inner {
  display: grid; grid-template-columns: auto 1fr; align-items: center;
  gap: clamp(28px, 5vw, 96px);
}

/* Face that follows the cursor */
.ab-face {
  --rx: 0deg; --ry: 0deg; --sx: 50%; --sy: 50%;
  position: relative;
  width: clamp(220px, 24vw, 380px); aspect-ratio: 1;
  perspective: 900px;
}
.ab-face__tilt {
  position: relative; width: 100%; height: 100%;
  border-radius: 50%; overflow: hidden;
  border: 1px solid var(--glass-line);
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5), 0 0 0 8px rgba(255, 236, 226, 0.04);
  transform: rotateX(var(--rx)) rotateY(var(--ry));
  transform-style: preserve-3d;
  transition: transform 0.25s var(--ease);
  will-change: transform;
}
.ab-face__img {
  width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.12) translate(var(--px, 0px), var(--py, 0px));
  transition: transform 0.25s var(--ease);
}
.ab-face.is-grid .ab-face__img { transform: none; transition: none; }
.ab-face.is-grid .ab-face__tilt { transform: none; }
.ab-face__shine {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at var(--sx) var(--sy), rgba(255, 236, 226, 0.18), transparent 55%);
  mix-blend-mode: soft-light;
}
.ab-face__ring {
  position: absolute; inset: -14px; z-index: -1; border-radius: 50%;
  border: 1px dashed rgba(239, 106, 44, 0.45);
  animation: ab-spin 40s linear infinite;
}
@keyframes ab-spin { to { transform: rotate(360deg); } }

.ab-hero__text { display: grid; gap: clamp(12px, 2vh, 20px); max-width: 640px; }
.ab-hero__title {
  font-size: clamp(2.6rem, min(7vw, 12vh), 7rem);
  font-weight: 900; line-height: 0.95; letter-spacing: -0.035em; text-transform: uppercase;
}
.ab-hero__title span { color: var(--orange); }
.ab-hero__sub { color: var(--muted); max-width: 52ch; }

.ab-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: var(--fs-small); font-weight: 600; }
.ab-crumbs li { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); }
.ab-crumbs li + li::before { content: "/"; color: var(--orange); }
.ab-crumbs a { color: var(--text); text-decoration: none; padding: 4px 12px; border-radius: 999px; background: var(--glass); border: 1px solid var(--glass-line); }
.ab-crumbs a:hover { border-color: var(--orange); }
.ab-crumbs [aria-current] { color: var(--orange); }

/* ---------- 2. Intro ---------- */
.ab-intro__grid {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 80px); align-items: start;
}
.ab-intro__copy { display: grid; gap: 16px; }
.ab-intro__copy > p:not(.eyebrow):not(.ab-lead) { color: var(--muted); max-width: 62ch; }
.ab-lead { font-size: clamp(1.15rem, 1rem + 0.6vw, 1.5rem); font-weight: 600; line-height: 1.35; }
.ab-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.ab-actions .btn--ghost { min-height: 56px; padding-inline: 1.8em; }

.ab-facts { display: grid; gap: 0; padding: 8px clamp(18px, 2vw, 28px); }
.ab-facts > div { display: grid; gap: 2px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.ab-facts > div:last-child { border-bottom: 0; }
.ab-facts dt { font-size: var(--fs-small); font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); }
.ab-facts dd { font-weight: 600; }

/* ---------- 3. Tabs ---------- */
.ab-tabs__list {
  position: relative; display: inline-flex; gap: 4px; padding: 5px;
  border-radius: 999px; background: var(--glass); border: 1px solid var(--glass-line);
  margin-bottom: clamp(24px, 4vh, 40px);
}
.ab-tabs__tab {
  position: relative; z-index: 1;
  min-height: 46px; padding: 0 clamp(18px, 2vw, 30px);
  border: 0; border-radius: 999px; background: transparent; cursor: pointer;
  font-weight: 700; color: var(--muted);
  transition: color 0.25s var(--ease);
}
.ab-tabs__tab[aria-selected="true"] { color: var(--text); }
.ab-tabs__ink {
  position: absolute; z-index: 0; top: 5px; bottom: 5px; left: 0; width: 0;
  border-radius: 999px; background: linear-gradient(135deg, var(--red), var(--orange));
  box-shadow: 0 8px 24px rgba(210, 64, 42, 0.4);
  transition: transform 0.35s var(--ease), width 0.35s var(--ease);
}
.ab-tabs__panel:focus-visible { outline-offset: 8px; }
.ab-tabs__panel:not([hidden]) { animation: ab-fade 0.4s var(--ease); }
@keyframes ab-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

.ab-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.ab-item {
  display: grid; grid-template-columns: 88px 1fr; gap: clamp(14px, 1.6vw, 22px); align-items: start;
  padding: clamp(16px, 2vw, 24px); border-radius: 20px;
  background: linear-gradient(160deg, rgba(255, 236, 226, 0.08), rgba(255, 236, 226, 0.02));
  border: 1px solid var(--line);
  transition: transform 0.3s var(--ease), border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.ab-item:hover { transform: translateY(-3px); border-color: rgba(239, 106, 44, 0.5); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35); }
.ab-item__logo {
  width: 88px; height: 64px; object-fit: contain; padding: 8px;
  border-radius: 12px; background: #000; border: 1px solid rgba(255, 236, 226, 0.14);
}
.ab-item__icon {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 16px;
  color: var(--orange); background: rgba(239, 106, 44, 0.1); border: 1px solid rgba(239, 106, 44, 0.35);
}
.ab-list--edu .ab-item { grid-template-columns: 64px 1fr; }
.ab-item__body { display: grid; gap: 4px; min-width: 0; }
.ab-item__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ab-item__years {
  padding: 3px 10px; border-radius: 999px; font-size: var(--fs-small); font-weight: 700;
  color: var(--orange); background: rgba(239, 106, 44, 0.12); font-variant-numeric: tabular-nums;
}
.ab-item__badge {
  padding: 3px 10px; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
  background: var(--red); color: var(--text);
}
.ab-item__role { font-size: clamp(1.02rem, 0.96rem + 0.3vw, 1.2rem); font-weight: 800; line-height: 1.25; }
.ab-item__org { font-weight: 600; }
.ab-item__desc { color: var(--muted); font-size: var(--fs-small); line-height: 1.5; margin-top: 4px; }

/* ---------- 4. Skills ---------- */
.ab-logos {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: clamp(10px, 1.2vw, 16px);
}
.ab-logos li {
  display: grid; justify-items: center; align-content: center; gap: 12px;
  min-height: 132px; padding: 18px 12px; border-radius: 18px; text-align: center;
  background: linear-gradient(160deg, rgba(255, 236, 226, 0.07), rgba(255, 236, 226, 0.02));
  border: 1px solid var(--line);
  font-size: var(--fs-small); font-weight: 700;
  transition: transform 0.3s var(--ease), border-color 0.3s var(--ease), background-color 0.3s var(--ease);
}
.ab-logos li:hover { transform: translateY(-4px); border-color: rgba(239, 106, 44, 0.55); background-color: rgba(255, 236, 226, 0.05); }
.ab-logos img { width: 40px; height: 40px; transition: transform 0.3s var(--ease); }
.ab-logos li:hover img, .ab-logos li:hover .ab-mono { transform: scale(1.12); }
.ab-mono {
  display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px;
  background: linear-gradient(145deg, #f0573a, var(--red-2)); color: var(--text);
  font-size: 0.9rem; font-weight: 900; letter-spacing: -0.02em;
  transition: transform 0.3s var(--ease);
}

/* ---------- Reveal ---------- */


/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .ab-list { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .ab-hero { min-height: 0; }
  .ab-hero__inner { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .ab-hero__text { justify-items: center; }
  .ab-crumbs ol { justify-content: center; }
  .ab-face { width: clamp(200px, 56vw, 280px); }
  .ab-intro__grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .ab-item { grid-template-columns: 1fr; }
  .ab-list--edu .ab-item { grid-template-columns: 56px 1fr; }
  .ab-item__logo { width: 104px; height: 56px; }
  .ab-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ab-logos li { min-height: 104px; padding: 14px 6px; font-size: 0.72rem; }
  .ab-logos img, .ab-mono { width: 32px; height: 32px; }
  .ab-tabs__list { width: 100%; }
  .ab-tabs__tab { flex: 1; padding-inline: 12px; }
  .ab-actions > * { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .ab-face__ring, .ab-tabs__panel:not([hidden]) { animation: none; }
  .ab-face__tilt, .ab-face__img, .ab-tabs__ink, .ab-item, .ab-logos li { transition: none; }
}
.ab-logos img.ab-logo--wide { width: 64px; transform-origin: center; transform: scale(1.6); }
.ab-logos li:hover img.ab-logo--wide { transform: scale(1.75); }

/* ---------- Face frames (canvas sits on top of the photo once frames load) ---------- */
.ab-face__canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; transition: opacity 0.3s var(--ease);
}
.ab-face.is-frames .ab-face__canvas { opacity: 1; }
.ab-face.is-frames .ab-face__img { transform: none; }

/* ---------- Tabs: 30% bigger, centred ---------- */
.ab-tabs { display: grid; }
.ab-resume .ab-head { justify-items: center; text-align: center; }
.ab-tabs__list { justify-self: center; padding: 7px; gap: 6px; }
.ab-tabs__tab {
  min-height: 60px; padding: 0 clamp(24px, 2.6vw, 40px);
  font-size: clamp(1.1rem, 1rem + 0.45vw, 1.4rem);
}
.ab-tabs__ink { top: 7px; bottom: 7px; }

/* ---------- 5. Counters: orange band that slides over the footer ---------- */
.ab-stats-track {
  position: relative; z-index: 10;
  background: #fa6536;
  box-shadow: 0 32px 72px -12px rgba(0, 0, 0, 0.75);
}
.ab-stats {
  position: relative; overflow: hidden;
  padding: clamp(70px, 12vh, 140px) 0;
  color: #fff; text-align: center;
  background-color: #f75c2e;
  background-image:
    radial-gradient(circle at 20% 35%, #ff784a 0%, rgba(247, 92, 46, 0) 55%),
    radial-gradient(circle at 80% 65%, #e04719 0%, rgba(224, 71, 25, 0) 65%),
    linear-gradient(145deg, #fa6536 0%, #ee5120 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.ab-stats__eyebrow { font-size: var(--fs-small); font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255, 255, 255, 0.85); }
.ab-stats__title { font-size: var(--fs-h2); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; margin: 10px auto clamp(36px, 6vh, 64px); max-width: 22ch; }
.ab-stats__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ab-stat { display: grid; gap: 8px; padding: clamp(16px, 2.4vw, 32px) clamp(10px, 1.6vw, 24px); }
.ab-stat__num {
  font-size: clamp(2.4rem, 1.6rem + 2.8vw, 4.4rem); font-weight: 900; letter-spacing: -0.04em; line-height: 1;
  color: #fff; font-variant-numeric: tabular-nums;
}
.ab-stat__label { color: rgba(255, 255, 255, 0.88); font-weight: 600; }
@media (max-width: 1024px) {
  .ab-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Skill groups */
.ab-skillgroup + .ab-skillgroup { margin-top: clamp(28px, 4.5vh, 48px); }
.ab-skillgroup__title {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: clamp(12px, 2vh, 18px);
  font-size: var(--fs-small); font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: var(--orange);
}
.ab-skillgroup__title::after { content: ""; flex: 1; height: 1px; background: var(--line); }


/* =========================================================
   MOTION (scroll-driven). Everything below is switched off
   for prefers-reduced-motion and when JS is unavailable.
   ========================================================= */
:root { --ease-out: cubic-bezier(0.16, 1, 0.3, 1); }

/* Scroll progress bar */
.ab-progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 80; pointer-events: none; }
.ab-progress span {
  display: block; height: 100%; transform-origin: 0 50%; transform: scaleX(var(--p, 0));
  background: linear-gradient(90deg, var(--red), var(--orange));
  box-shadow: 0 0 12px rgba(239, 106, 44, 0.7);
}

/* Generic reveal */
.motion [data-reveal] {
  opacity: 0; transform: translate3d(0, 40px, 0);
  transition: opacity 0.9s var(--ease-out), transform 1.1s var(--ease-out), filter 0.9s var(--ease-out);
  transition-delay: calc(var(--d, 0) * 1ms);
}
.motion [data-reveal="left"] { transform: translate3d(-60px, 0, 0); }
.motion [data-reveal="right"] { transform: translate3d(60px, 0, 0); }
.motion [data-reveal="scale"] { transform: scale(0.9); filter: blur(8px); }
.motion [data-reveal].is-in { opacity: 1; transform: none; filter: none; }

/* Staggered children */
.motion [data-stagger] > * {
  opacity: 0; transform: translate3d(0, 32px, 0);
  transition: opacity 0.8s var(--ease-out), transform 1s var(--ease-out);
  transition-delay: calc(var(--i, 0) * 90ms + 80ms);
}
.motion [data-stagger].is-in > * { opacity: 1; transform: none; }

/* Word-by-word masked headings */
.w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.w__i { display: inline-block; will-change: transform; }
.motion [data-split] .w__i {
  transform: translate3d(0, 110%, 0) rotate(4deg); transform-origin: 0 100%;
  transition: transform 1.05s var(--ease-out);
  transition-delay: calc(var(--wi, 0) * 70ms);
}
.motion [data-split].is-in .w__i { transform: none; }

/* Hero entrance (on load) */
.motion .ab-face { opacity: 0; transform: scale(0.82) rotate(-6deg); transition: opacity 1.1s var(--ease-out), transform 1.4s var(--ease-out); }
.motion .ab-crumbs, .motion .ab-hero__sub { opacity: 0; transform: translate3d(0, 24px, 0); transition: opacity 0.9s var(--ease-out), transform 1s var(--ease-out); }
.motion .is-loaded .ab-face { opacity: 1; transform: none; }
.motion .is-loaded .ab-crumbs { opacity: 1; transform: none; transition-delay: 0.25s; }
.motion .is-loaded .ab-hero__sub { opacity: 1; transform: none; transition-delay: 0.65s; }
.ab-hero__inner[data-hero-out] { will-change: transform, opacity; }
[data-parallax] { will-change: transform; }

/* Experience / education cards: alternate sides */
.motion .ab-item.is-anim { opacity: 0; transform: translate3d(var(--fx, 0), 48px, 0) rotate(var(--fr, 0deg)); }
.motion .ab-item.is-anim.is-in {
  opacity: 1; transform: none;
  transition: opacity 0.8s var(--ease-out), transform 1s var(--ease-out), border-color 0.3s var(--ease), box-shadow 0.3s var(--ease);
  transition-delay: calc(var(--d, 0) * 1ms);
}
.motion .ab-item.is-anim.is-in:hover { transform: translateY(-3px); transition-delay: 0s; }
.ab-item__logo, .ab-item__icon { transition: transform 0.5s var(--ease-out); }
.ab-item:hover .ab-item__logo, .ab-item:hover .ab-item__icon { transform: scale(1.06) rotate(-2deg); }

/* Skill groups: line draws, tiles pop in */
.motion .ab-skillgroup__title::after { transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.2s var(--ease-out) 0.2s; }
.motion .ab-skillgroup.is-in .ab-skillgroup__title::after { transform: scaleX(1); }
.motion .ab-skillgroup .ab-logos li {
  opacity: 0; transform: translate3d(0, 30px, 0) scale(0.86);
  transition: opacity 0.6s var(--ease-out), transform 0.8s var(--ease-out), border-color 0.3s var(--ease), background-color 0.3s var(--ease);
  transition-delay: calc(var(--i, 0) * 45ms + 150ms);
}
.motion .ab-skillgroup.is-in .ab-logos li { opacity: 1; transform: none; }
.motion .ab-skillgroup.is-in .ab-logos li:hover { transform: translateY(-6px) rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)); transition-delay: 0s; }
.ab-logos { perspective: 800px; }
.ab-logos li { transform-style: preserve-3d; }
.ab-logos li::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(239, 106, 44, 0.22), transparent 60%);
  transition: opacity 0.3s var(--ease);
}
.ab-logos li { position: relative; }
.ab-logos li:hover::before { opacity: 1; }

/* Scroll-driven text band */
.ab-marquee { position: relative; overflow: hidden; padding: clamp(18px, 3vh, 36px) 0; pointer-events: none; user-select: none; }
.ab-marquee__row {
  display: flex; width: max-content; white-space: nowrap;
  font-size: clamp(2.6rem, 7vw, 7.5rem); font-weight: 900; line-height: 1.05; letter-spacing: -0.03em; text-transform: uppercase;
  color: rgba(247, 241, 236, 0.08); will-change: transform;
}
.ab-marquee__row span { padding-right: 0.3em; }
.ab-marquee__row--outline { color: transparent; -webkit-text-stroke: 1px rgba(239, 106, 44, 0.45); }

/* Orange stats band opens up as it enters */
.motion .ab-stats[data-clip] {
  clip-path: inset(calc(var(--c, 1) * 10%) calc(var(--c, 1) * 7%) round calc(var(--c, 1) * 48px));
}
.ab-stat__num { display: inline-block; transition: transform 0.6s var(--ease-out); }
.ab-stat:hover .ab-stat__num { transform: scale(1.06); }

/* Contact: keep the footer-reveal layout, just stagger the content */
.page-about .contact .wrap[data-stagger] > * { transition-delay: calc(var(--i, 0) * 80ms); }

@media (hover: none) {
  .ab-logos li::before { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ab-progress, .ab-marquee__row { transform: none !important; }
  .ab-marquee__row { will-change: auto; }
}

/* ---------- 3D avatar (canvas fades in over the photo once the model loads) ---------- */
.ab-face__avatar {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; transition: opacity 0.6s var(--ease);
}
.ab-face.is-avatar .ab-face__tilt {
  background: radial-gradient(circle at 50% 30%, #2b3437 0%, #1a1515 55%, #120c0b 100%);
}
.ab-face.is-avatar .ab-face__avatar { opacity: 1; }
.ab-face.is-avatar .ab-face__img { opacity: 0; transition: opacity 0.6s var(--ease); }

/* Avatar page: don't show the photo while the 3D model loads (photo only appears if the avatar fails) */
.js .ab-face[data-avatar]:not(.is-fallback) .ab-face__tilt {
  background: radial-gradient(circle at 50% 30%, #2b3437 0%, #1a1515 55%, #120c0b 100%);
}
.js .ab-face[data-avatar]:not(.is-fallback) .ab-face__img { opacity: 0; }
.js .ab-face[data-avatar]:not(.is-avatar):not(.is-fallback) .ab-face__tilt::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 236, 226, 0.06) 50%, transparent 70%) 0 0 / 250% 100%;
  animation: ab-loading 1.4s linear infinite;
}
@keyframes ab-loading { to { background-position: -250% 0; } }
@media (prefers-reduced-motion: reduce) { .js .ab-face[data-avatar] .ab-face__tilt::after { animation: none; } }

/* ==========================================================================
   MOBILE READABILITY + LAYOUT FIX (About Page - Screens up to 767px)
   ========================================================================== */
@media (max-width: 767px) {
  html, body, .page-about {
    overflow-x: clip !important;
  }

  /* 2. Hero on mobile: let hero grow naturally, no cutoff */
  .ab-hero {
    min-height: 100svh !important;
    height: auto !important;
    overflow: visible !important;
    padding-top: calc(var(--header-h, 72px) + 20px) !important;
    padding-bottom: 40px !important;
  }

  .ab-hero__inner {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    text-align: center;
    justify-items: center;
  }

  .ab-hero__text {
    justify-items: center;
    max-width: 100% !important;
  }

  .ab-hero__title {
    font-size: clamp(2rem, 9vw, 3.2rem) !important;
    line-height: 1.05 !important;
    word-break: break-word;
    overflow: visible;
  }

  /* Hero subtitle: 16px, sentence case, line-height 1.5 */
  .ab-hero__sub {
    font-size: 16px !important;
    text-transform: none !important;
    line-height: 1.5 !important;
    max-width: none !important;
  }

  .ab-lead {
    font-size: 18px !important;
    line-height: 1.5 !important;
  }

  .ab-intro__copy > p:not(.eyebrow):not(.ab-lead) {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  /* Breadcrumbs */
  .ab-crumbs ol {
    justify-content: center;
    font-size: 14px !important;
    gap: 6px;
  }
  .ab-crumbs a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    font-size: 14px !important;
  }
  .ab-crumbs li {
    font-size: 14px !important;
  }

  /* Fix horizontal overflow from data-reveal="right" / "left" */
  .motion [data-reveal="right"],
  .motion [data-reveal="left"] {
    transform: translate3d(0, 24px, 0) !important;
  }

  .ab-facts {
    overflow-x: clip;
    max-width: 100%;
  }
  .ab-facts dt {
    font-size: 14px !important;
  }
  .ab-facts dd {
    font-size: 16px !important;
  }

  /* Action buttons: min 44x44px */
  .ab-actions {
    justify-content: center;
  }
  .ab-actions .btn,
  .ab-actions .btn--ghost {
    min-height: 44px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Tabs buttons: min 44px tap target */
  .ab-tabs__list {
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
  }
  .ab-tabs__btn {
    min-height: 44px !important;
    padding: 10px 18px !important;
    font-size: 14px !important;
    display: inline-flex;
    align-items: center;
  }

  /* Timeline & items */
  .ab-item__role {
    font-size: 18px !important;
  }
  .ab-item__company {
    font-size: 16px !important;
  }
  .ab-item__years {
    font-size: 14px !important;
  }
  .ab-item__badge {
    font-size: 13px !important;
  }
  .ab-item__desc {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  /* Skills & tags */
  .ab-logos li {
    font-size: 13px !important;
  }
  .ab-skills-tags li,
  .ab-tag {
    font-size: 13px !important;
    padding: 6px 12px !important;
  }

  /* Marquee */
  .ab-marquee {
    overflow: hidden !important;
    overflow-x: clip !important;
  }

  /* Stats band */
  .ab-stats__eyebrow {
    font-size: 14px !important;
  }
}