/* -- TOKENS -- */
:root {
  --bg: #f8f7ff;
  --surface: #ffffff;
  --ink: #0d0d1a;
  --ink2: #3d3d5c;
  --muted: #8888aa;
  --border: rgba(0,0,0,0.07);

  /* Gradient palette */
  --g1: #6c63ff; /* violet */
  --g2: #f7567c; /* coral */
  --g3: #00c9a7; /* mint */
  --g4: #ffbe0b; /* amber */
  --g5: #3a86ff; /* blue */

  --grad-main: linear-gradient(135deg, #6c63ff 0%, #f7567c 100%);
  --grad-cool: linear-gradient(135deg, #3a86ff 0%, #00c9a7 100%);
  --grad-warm: linear-gradient(135deg, #ffbe0b 0%, #f7567c 100%);
  --grad-soft: linear-gradient(135deg, #e8e6ff 0%, #ffe6ec 100%);

  --radius: 20px;
  --radius-sm: 12px;
  --cs-img-radius: 14px;
  --cs-img-radius-sm: 8px;
  --side: 64px;
  --page-side: 40px;
  --side-mobile: 24px;
  --max-w: 1100px;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: 'Outfit', sans-serif;
  font-weight: 400;
  overflow-x: hidden;
  cursor: none;
}
body.cursor-disabled {
  cursor: auto;
}
body.cursor-disabled #cur,
body.cursor-disabled #cur-aura {
  display: none;
}

/* -- CUSTOM CURSOR -- */
#cur {
  position: fixed; width: 10px; height: 10px;
  background: var(--g1); border-radius: 50%;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: width .2s, height .2s, background .3s;
}
#cur-aura {
  position: fixed; width: 40px; height: 40px;
  border: 1.5px solid rgba(108,99,255,.4);
  border-radius: 50%; pointer-events: none; z-index: 9998;
  transform: translate(-50%,-50%);
  transition: width .35s ease, height .35s ease, border-color .3s;
}
body.hovering #cur { width: 16px; height: 16px; background: var(--g2); }
body.hovering #cur-aura { width: 52px; height: 52px; border-color: rgba(247,86,124,.5); }

/* -- NAV -- */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 500;
  height: 68px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--side);
  background: rgba(248,247,255,.85);
  backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--border);
}
.nav-logo {
  display: inline-flex; align-items: center; gap: 10px;
  text-decoration: none; cursor: none;
}
.nav-logo-mark {
  width: 18px; height: 18px; object-fit: contain; flex-shrink: 0;
  display: block;
}
.nav-logo-text {
  font-family: 'Playfair Display', serif; font-weight: 800; font-size: 1.15rem;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  letter-spacing: -.01em;
}
.nav-links { display: flex; gap: 8px; list-style: none; }
.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(108,99,255,.14);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(246,242,255,.95));
  box-shadow: 0 8px 24px rgba(22, 16, 56, .08);
  cursor: none;
}
.nav-toggle span {
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: var(--g1);
  transition: transform .25s ease, opacity .2s ease;
}
.nav-links a {
  font-size: .8rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  text-decoration: none; color: var(--muted); cursor: none;
  padding: 7px 14px; border-radius: 100px;
  transition: color .2s, background .2s;
}
.nav-links a:hover, .nav-links a.active {
  color: var(--g1); background: rgba(108,99,255,.08);
}

/* -- PAGE SYSTEM -- */
.page { display: none; min-height: 100vh; padding-top: 68px; }
.page.active { display: block; animation: pageIn .5s cubic-bezier(.22,1,.36,1) both; }
.case-study { display: none; min-height: 100vh; padding-top: 68px; background: #fcfbff; }
.case-study.active { display: block; animation: pageIn .5s cubic-bezier(.22,1,.36,1) both; }
@keyframes pageIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* -- SCROLL REVEAL -- */
.reveal {
  opacity: 0; transform: translateY(36px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);
}
.reveal.visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }

/* --------------------------------------
   HOME
-------------------------------------- */
.home-hero-outer {
  position: relative; overflow: hidden;
  min-height: calc(100vh - 68px);
  display: flex; align-items: center;
  padding-bottom: 60px;
}
.home-hero {
  display: grid; grid-template-columns: minmax(0, 560px);
  align-items: center;
  padding: 80px var(--side) 60px var(--page-side);
  max-width: var(--max-w); margin: 0 auto; width: 100%;
  position: relative; z-index: 2;
}
.hero-text {
  position: relative; z-index: 2;
  min-width: 0;
}
.hero-graphic svg { width: 100%; height: auto; }

/* Scattered fact cards — float freely over right side of hero */
.fact-grid {
  position: absolute;
  top: 0; right: 0;
  width: 55%;
  height: 100%;
  pointer-events: none;
  z-index: 3;
}
/* Scattered fact wraps — own the position + float animation */
.fact-wrap {
  position: absolute;
  display: inline-block;
}
.fact-wrap-1 { top: 20%;  right: 48%;  animation: floatA 8s   ease-in-out infinite 0s; }
.fact-wrap-2 { top: 26%;  right: 10%;  animation: floatB 9.5s ease-in-out infinite 1.2s; }
.fact-wrap-3 { top: 44%;  right: 58%;  animation: floatC 7.8s ease-in-out infinite 2.1s; }
.fact-wrap-4 { top: 55%;  right: 18%;  animation: floatD 8.6s ease-in-out infinite 0.6s; }
.fact-wrap-5 { top: 68%;  right: 46%;  animation: floatE 9.1s ease-in-out infinite 1.8s; }

.fact-card {
  display: flex; align-items: center; gap: 11px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 13px 16px;
  box-shadow: 0 4px 20px rgba(0,0,0,.07);
  white-space: nowrap;
  cursor: default;
  will-change: transform;
  transition: box-shadow .3s, border-color .3s;
}
.fact-card.near {
  box-shadow: 0 16px 40px rgba(108,99,255,.2);
  border-color: rgba(108,99,255,.3);
}

.fact-icon {
  font-size: 1.2rem;
  width: 18px; height: 18px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 9px;
  background: rgba(108,99,255,.08);
}
.fact-title {
  font-size: .82rem; font-weight: 700; color: var(--ink);
  margin-bottom: 1px;
}
.fact-sub {
  font-size: .71rem; color: var(--muted); font-weight: 400;
}

@media(max-width:900px) {
  .home-hero { grid-template-columns: 1fr; }
  .hero-graphic { display: none; }
}

/* Mesh gradient blobs */
.blob {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: .55; pointer-events: none;
  animation: drift 12s ease-in-out infinite alternate;
}
.blob-1 { width: 520px; height: 520px; background: #c9c5ff; top: -140px; right: -80px; animation-delay: 0s; }
.blob-2 { width: 400px; height: 400px; background: #ffc5d0; bottom: -100px; left: -60px; animation-delay: -4s; }
.blob-3 { width: 300px; height: 300px; background: #b3f0e4; top: 30%; right: 20%; animation-delay: -8s; }
@keyframes drift {
  0%   { transform: translate(0,0) scale(1); }
  100% { transform: translate(30px, 40px) scale(1.07); }
}

.hero-tag {
  display: inline-flex; align-items: center; gap: 8px;
  background: white; border: 1px solid var(--border);
  padding: 7px 16px; border-radius: 100px;
  font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--ink2); margin-bottom: 32px; width: fit-content;
  box-shadow: 0 2px 12px rgba(108,99,255,.10);
}
.hero-tag::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: var(--g3); flex-shrink: 0;
  animation: pulse 2s infinite;
}
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(1.4)} }

.hero-headline {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: clamp(2rem, 4.2vw, 4rem);
  line-height: 1.22; letter-spacing: -.01em;
  margin-bottom: 28px; position: relative; z-index: 2;
  overflow: visible;
  padding-bottom: 0.08em;
}
.hero-headline .hl-line {
  display: block;
  white-space: nowrap;
  overflow: visible;
  line-height: 1.22;
}
.hero-headline .hl-line + .hl-line {
  margin-top: 0.08em;
}
.hero-headline .grad-word {
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
  min-width: 7.5ch;
  overflow: visible;
}
.hero-sub {
  font-size: clamp(1rem, 1.55vw, 1.2rem); color: var(--ink2);
  line-height: 1.7; max-width: 560px; margin-bottom: 44px;
  font-weight: 400; position: relative; z-index: 2;
}
.hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; position: relative; z-index: 2; }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; border-radius: 100px;
  font-family: 'Outfit', sans-serif; font-size: .9rem; font-weight: 600;
  letter-spacing: .02em; text-decoration: none; cursor: none; border: none;
  transition: transform .2s, box-shadow .2s;
}
.btn:hover { transform: translateY(-3px); }
.btn-grad {
  background: var(--grad-main); color: white;
  box-shadow: 0 8px 32px rgba(108,99,255,.18);
}
.btn-grad:hover { box-shadow: 0 14px 40px rgba(108,99,255,.28); }
.btn-ghost {
  background: white; color: var(--ink);
  border: 1.5px solid var(--border);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.btn-ghost:hover { box-shadow: 0 8px 24px rgba(0,0,0,.1); }

/* Stats strip */
.home-stats-wrap {
  max-width: var(--max-w); margin: -60px auto 0; padding: 0 var(--page-side);
  position: relative; z-index: 4;
}
.home-stats {
  display: flex; gap: 0;
  background: white; border-radius: var(--radius);
  border: 1px solid var(--border);
  overflow: hidden;
  box-shadow: 0 4px 32px rgba(0,0,0,.05);
}
.stat-item {
  flex: 1; padding: 28px 32px;
  border-right: 1px solid var(--border);
  position: relative; overflow: hidden;
  transition: background .25s;
}
.stat-item:last-child { border-right: none; }
.stat-item:hover { background: var(--grad-soft); }
.stat-item::before {
  content: ''; position: absolute; inset: 0;
  background: var(--grad-main); opacity: 0;
  transition: opacity .25s;
}
.stat-item:hover::before { opacity: .04; }
.stat-num {
  font-family: 'DM Serif Display', serif; font-size: 2.2rem; font-weight: 400;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: .96; margin-bottom: 5px;
  letter-spacing: -.015em;
}
.stat-label { font-size: .74rem; color: var(--muted); font-weight: 500; letter-spacing: .04em; }

/* --------------------------------------
   ABOUT
-------------------------------------- */
.about-wrap { max-width: var(--max-w); margin: 0 auto; padding: 80px var(--page-side); }
.about-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) 380px;
  gap: 48px; align-items: start;
}
.about-hero-copy { min-width: 0; }
.about-hero-line {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.1;
  letter-spacing: -.01em; margin-bottom: 28px;
}
.about-body { font-size: 1rem; color: var(--ink2); line-height: 1.85; margin-bottom: 18px; font-weight: 400; max-width: 720px; }
.about-body strong { color: var(--ink); font-weight: 600; }
.about-photo {
  max-width: 380px; width: 100%; justify-self: end;
  background: white; border-radius: 220px 220px 0 0 / 120px 120px 0 0; overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 2px 20px rgba(0,0,0,.05);
}
.about-photo img {
  width: 100%; display: block; aspect-ratio: 6 / 5;
  object-fit: cover; object-position: center 18%;
}
.about-section {
  margin-top: 44px; padding-top: 32px;
  border-top: 1px solid var(--border);
}
.about-section.about-section-no-divider { margin-top: 28px; padding-top: 0; border-top: 0; }
.about-section-label {
  font-size: .72rem; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--muted);
  margin-bottom: 20px;
}
.skill-group { margin-top: 0; }
.skill-group-label {
  font-size: .46rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 12px;
}
.skill-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.pill {
  padding: 7px 16px; border-radius: 100px;
  font-size: .8rem; font-weight: 600; cursor: default;
  border: 1.5px solid transparent;
  transition: all .2s;
}
.pill-violet { background: rgba(108,99,255,.1); color: var(--g1); border-color: rgba(108,99,255,.2); }
.pill-violet:hover { background: var(--g1); color: white; }
.pill-coral { background: rgba(247,86,124,.08); color: var(--g2); border-color: rgba(247,86,124,.2); }
.pill-coral:hover { background: var(--g2); color: white; }
.pill-mint { background: rgba(0,201,167,.08); color: var(--g3); border-color: rgba(0,201,167,.2); }
.pill-mint:hover { background: var(--g3); color: white; }
.about-card,
.honors-card {
  background: transparent; border: 0; border-radius: 0; padding: 0;
  box-shadow: none; color: var(--ink);
}
.about-card:hover { transform: none; box-shadow: none; }
.about-card-title,
.honors-card-title {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: 1.45rem; margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.about-card-title .icon {
  width: 32px; height: 32px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
}
.fact-row,
.honor-row {
  display: flex; gap: 12px; align-items: flex-start;
  margin-bottom: 13px; font-size: .95rem; color: var(--ink2); line-height: 1.65;
}
.fact-em { font-size: 1rem; flex-shrink: 0; }
.honor-row::before {
  content: '•';
  color: var(--g1); font-size: .95rem; flex-shrink: 0; line-height: 1.2;
}
.about-expertise-card {
  background: white;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 28px 30px;
  box-shadow: 0 6px 28px rgba(0,0,0,.05);
}
.about-expertise-title {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 1.55rem;
  margin-bottom: 18px;
}
.about-expertise-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(220px, .8fr);
  gap: 34px;
  align-items: start;
}
.about-expertise-lines {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.about-expertise-line {
  font-size: .88rem;
  color: var(--muted);
  line-height: 1.75;
}
.about-tools-title {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 12px;
}
.about-tools-list {
  font-size: .92rem;
  color: var(--ink2);
  line-height: 1.8;
}
.about-expertise-cta-copy {
  margin-top: 24px;
  margin-bottom: 12px;
  font-size: .92rem;
  color: var(--ink2);
}
.about-projects-btn {
  display: inline-flex;
  justify-content: center;
  min-width: 190px;
}
@media(max-width: 768px) {
  .about-expertise-card {
    padding: 24px 22px;
  }
  .about-expertise-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
/* --------------------------------------
   HOME WORK SECTION
-------------------------------------- */
.home-work-section {
  padding: 80px var(--page-side) 100px;
  max-width: var(--max-w); margin: 0 auto;
  content-visibility: auto;
  contain-intrinsic-size: 1600px;
}
.home-work-header { margin-bottom: 40px; }

/* How I Work */
.process-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  margin-bottom: 56px;
  content-visibility: auto;
  contain-intrinsic-size: 420px;
}
.process-card {
  background: white; border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 24px 20px;
  box-shadow: 0 2px 14px rgba(0,0,0,.04);
  position: relative; overflow: hidden;
  transition: transform .25s, box-shadow .25s;
  display: flex; flex-wrap: wrap; gap: 8px;
}
.process-card::after {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--grad-main); opacity: 0; transition: opacity .25s;
}
.process-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(108,99,255,.1); }
.process-card:hover::after { opacity: 1; }
.process-icon {
  font-size: 1.3rem; flex: 0 0 auto;
}
.process-step-num {
  font-family: 'DM Serif Display', serif; font-weight: 400; font-size: 1.8rem;
  background: var(--grad-soft); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: .96; flex: 0 0 auto;
  letter-spacing: -.015em;
}
.process-title {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: .95rem; color: var(--ink); margin-bottom: 10px; flex: 0 0 100%;
}
.process-desc { font-size: .78rem; color: var(--muted); line-height: 1.7; font-weight: 400; flex: 0 0 100%; }
@media(max-width: 768px) { .process-strip { grid-template-columns: 1fr 1fr; } }

.hpc {
  display: grid; grid-template-columns: 380px 1fr;
  gap: 0; margin-bottom: 32px;
  background: white; border-radius: var(--radius);
  border: 1px solid var(--border);
  overflow: hidden; cursor: none;
  box-shadow: 0 4px 24px rgba(0,0,0,.05);
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s;
  position: relative;
  height: 300px;
  content-visibility: auto;
  contain-intrinsic-size: 300px;
  contain: layout paint;
}
.hpc:not(.hpc-locked):hover {
  box-shadow: 0 20px 60px rgba(0,0,0,.12);
}

.hpc-image {
  position: relative; overflow: hidden;
  height: 100%;
  display: flex; align-items: center; justify-content: center;
  transition: transform .45s cubic-bezier(.22,1,.36,1);
  flex-shrink: 0;
}
.hpc:not(.hpc-locked):hover .hpc-image { transform: scale(1.03); }
.hpc-emoji {
  font-size: 4.5rem; position: relative; z-index: 2;
  transition: transform .4s cubic-bezier(.22,1,.36,1);
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.12));
}
.hpc:not(.hpc-locked):hover .hpc-emoji { transform: scale(1.15) translateY(-6px); }
.hpc-img-glow {
  position: absolute; inset: -20%; z-index: 1;
  opacity: .7; transition: opacity .4s;
}
.hpc:not(.hpc-locked):hover .hpc-img-glow { opacity: 1; }
.hpc-img-photo {
  position: absolute; inset: 0; z-index: 2;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .45s cubic-bezier(.22,1,.36,1);
  will-change: transform;
}
.hpc:not(.hpc-locked):hover .hpc-img-photo { transform: scale(1.08); }

.hpc-body {
  padding: 32px 40px;
  display: flex; flex-direction: column; justify-content: center;
  overflow: hidden;
}
.hpc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.hpc-title {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: 1.35rem; line-height: 1.1; margin-bottom: 10px;
  letter-spacing: -.01em;
}
.hpc-desc {
  font-size: .88rem; color: var(--ink2); line-height: 1.75;
  margin-bottom: 14px; font-weight: 400;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.hpc-stats {
  display: flex; gap: 20px; margin-bottom: 16px;
  padding: 12px 16px; background: var(--bg);
  border-radius: var(--radius-sm); border: 1px solid var(--border);
  width: fit-content;
}
.hpc-stat { display: flex; flex-direction: column; gap: 2px; }
.hpc-stat-n {
  font-family: 'DM Serif Display', serif; font-weight: 400; font-size: 1.2rem;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: .96;
  letter-spacing: -.012em;
}
.hpc-stat-l { font-size: .64rem; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.hpc-cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--g1);
  transition: gap .2s;
}
.hpc:not(.hpc-locked):hover .hpc-cta { gap: 14px; }
.hpc-arrow { transition: transform .2s; }
.hpc:not(.hpc-locked):hover .hpc-arrow { transform: translateX(4px); }
.hpc-locked { cursor: default; opacity: .75; }

/* Scroll-in animation for project cards */
.hpc {
  opacity: 0;
  transform: translateY(40px);
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s, opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1);
}
.hpc.hpc-visible {
  opacity: 1;
  transform: translateY(0);
}
.hpc.hpc-visible:not(.hpc-locked):hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(0,0,0,.12);
}
.hpc-locked.hpc-visible { opacity: .75; }

@media(max-width:768px) {
  .home-work-section { padding: 60px 20px 80px; }
  .hpc { grid-template-columns: 1fr; height: auto; }
  .hpc-image { min-height: 160px; height: 160px; }
  .hpc-body { padding: 24px 22px; }
  .hpc-title { font-size: 1.4rem; }
  .hpc-desc { -webkit-line-clamp: unset; }
}
.portfolio-wrap { padding: 80px var(--page-side); max-width: var(--max-w); margin: 0 auto; }
.section-eyebrow {
  font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: var(--g1); margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
}
.section-eyebrow::before { content: ''; width: 24px; height: 1.5px; background: var(--grad-main); }
.section-title {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem); letter-spacing: -.01em;
  margin-bottom: 10px; line-height: 1.15;
}
.section-sub { font-size: 1rem; color: var(--muted); margin-bottom: 40px; font-weight: 400; }

.filter-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 40px; }
.filt {
  padding: 8px 20px; border-radius: 100px;
  font-family: 'Outfit', sans-serif; font-size: .78rem; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase; cursor: none;
  border: 1.5px solid var(--border); background: white; color: var(--muted);
  transition: all .2s;
}
.filt.active, .filt:hover {
  background: var(--grad-main); border-color: transparent; color: white;
  box-shadow: 0 4px 20px rgba(108,99,255,.3);
}

.work-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }

.work-card {
  background: white; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
  cursor: none; position: relative;
  transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s;
}
.work-card:hover { transform: translateY(-8px); box-shadow: 0 24px 56px rgba(0,0,0,.12); }

.work-thumb {
  height: 220px; display: flex; align-items: center; justify-content: center;
  font-size: 4rem; position: relative; overflow: hidden;
}
.work-thumb-inner {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 4rem;
  transition: transform .4s cubic-bezier(.22,1,.36,1);
}
.work-card:hover .work-thumb-inner { transform: scale(1.08); }

.work-thumb-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.15) 0%, transparent 60%);
}

.work-body { padding: 26px; }
.work-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.work-tag {
  font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 3px 10px; border-radius: 100px;
  background: var(--bg); color: var(--muted);
  border: 1px solid var(--border);
}
.work-title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.4rem; margin-bottom: 8px; }
.work-desc { font-size: .86rem; color: var(--ink2); line-height: 1.7; margin-bottom: 20px; font-weight: 400; }
.work-cta {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  background: none; border: none; cursor: none; font-family: 'Outfit', sans-serif;
  color: var(--g1); padding: 0; transition: gap .2s;
}
.work-cta:hover { gap: 12px; }
.work-cta-arrow { transition: transform .2s; }
.work-card:hover .work-cta-arrow { transform: translateX(4px); }

/* --------------------------------------
   CASE STUDY
-------------------------------------- */
.cs-back {
  display: inline-flex; align-items: center; gap: 8px; cursor: none;
  font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); background: none; border: none; font-family: 'Outfit', sans-serif;
  padding: 0; transition: color .2s;
}
.cs-back:hover { color: var(--g1); }

.cs-band {
  padding: 56px var(--page-side) 48px;
  width: 100%;
  max-width: none;
  margin: 0;
  position: relative; overflow: hidden;
}
.cs-band > * {
  max-width: var(--max-w);
  margin-left: auto;
  margin-right: auto;
}
.cs-band::before {
  content: ''; position: absolute; inset: 0;
  opacity: .05; pointer-events: none;
}

.cs-kicker {
  font-size: .7rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  margin-bottom: 14px; display: flex; align-items: center; gap: 8px;
}
.cs-kicker::before { content: ''; width: 20px; height: 1.5px; }

.cs-h1 {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  line-height: 1.05; letter-spacing: -.01em;
  margin-bottom: 16px;
}
.cs-sub { font-size: 1.05rem; color: var(--ink2); line-height: 1.7; max-width: 580px; font-weight: 400; }

.cs-meta-row {
  display: flex; gap: 16px; flex-wrap: wrap; margin-top: 36px;
}
.cs-meta-pill {
  background: white; border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 14px 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
}
.cs-meta-pill-label {
  font-size: .6rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  margin-bottom: 4px;
}
.cs-meta-pill-value { font-size: .86rem; font-weight: 400; color: var(--ink); }

/* Hero image */
.cs-hero-img {
  width: 100%; max-height: 520px; overflow: hidden;
  background: #eee;
}
.cs-hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cs-hero-placeholder {
  width: 100%; height: 340px; display: flex; align-items: center; justify-content: center;
  font-size: 5rem;
}

/* Case study body */
.cs-body {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 72px var(--page-side) 0;
  background: #fcfbff;
}

.cs-section { margin-bottom: 72px; }
.cs-body .cs-section:last-child { margin-bottom: 92px; }
.cs-section-num {
  font-family: 'DM Serif Display', serif; font-weight: 400; font-size: 4rem;
  line-height: .96; margin-bottom: -10px;
  background: var(--grad-soft); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  user-select: none;
  letter-spacing: -.02em;
}
.cs-section-title {
  font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.8rem;
  letter-spacing: -.01em; margin-bottom: 20px;
  padding-bottom: 16px; border-bottom: 1.5px solid var(--border);
}
.cs-p { font-size: .94rem; color: var(--ink2); line-height: 1.8; margin-bottom: 18px; font-weight: 400; }
.cs-p strong { color: var(--ink); font-weight: 600; }
.cs-p em { color: var(--g1); font-style: italic; }
.cs-h4 {
  font-family: 'Playfair Display', serif;
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ink);
  margin: 26px 0 10px;
}

.cs-ul { list-style: none; margin: 12px 0 20px; }
.cs-ul li {
  font-size: .92rem; color: var(--ink2); line-height: 1.75;
  padding-left: 22px; position: relative; margin-bottom: 8px; font-weight: 400;
}
.cs-ul li::before {
  content: '•'; position: absolute; left: 0;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  font-size: .8rem; top: 3px; font-weight: 700;
}

.cs-quote {
  border-left: 3px solid;
  border-image: var(--grad-main) 1;
  padding: 18px 24px; margin: 28px 0;
  background: linear-gradient(to right, rgba(108,99,255,.05), transparent);
  border-radius: 0 12px 12px 0;
  font-size: 1rem; color: var(--ink2); line-height: 1.75; font-style: italic;
}

/* Stats in case study */
.cs-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin: 28px 0; }
.cs-stat-box {
  background: white; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 20px; text-align: center;
  box-shadow: 0 2px 14px rgba(0,0,0,.05);
  transition: transform .2s, box-shadow .2s;
}
.cs-stat-box:hover { transform: translateY(-3px); box-shadow: 0 8px 28px rgba(0,0,0,.1); }
.cs-stat-box .n {
  font-family: 'DM Serif Display', serif; font-weight: 400; font-size: 2rem;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: .96;
  letter-spacing: -.015em;
}
.cs-stat-box .l { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; margin-top: 4px; }

/* Two col cards */
.cs-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 20px 0; }
.cs-card {
  background: white; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 20px 22px; box-shadow: 0 2px 12px rgba(0,0,0,.04);
  transition: transform .2s, box-shadow .2s;
}
.cs-card:hover { transform: translateY(-3px); box-shadow: 0 8px 28px rgba(0,0,0,.09); }
.cs-card-label {
  font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  margin-bottom: 12px;
}
.cs-card p { font-size: .9rem; color: var(--ink2); line-height: 1.75; font-weight: 400; }
.cs-card ul { list-style: none; }
.cs-card ul li { font-size: .84rem; color: var(--ink2); padding-left: 14px; position: relative; margin-bottom: 5px; }
.cs-card ul li::before { content: '·'; position: absolute; left: 2px; font-size: 1.2rem; line-height: 1; }

/* Process step */
.cs-step { display: flex; gap: 18px; margin-bottom: 28px; }
.cs-step-num {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0; margin-top: 0;
  display: grid; place-items: center;
  font-family: 'Outfit', sans-serif; font-weight: 700; font-size: .92rem; line-height: 1; color: white;
  background: var(--grad-main);
  padding-top: 0;
  padding-bottom: 2px;
}
.cs-step-content h4 {
  font-family: 'Playfair Display', serif;
  font-size: 1.06rem;
  line-height: 1.28;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 10px;
}
.cs-step-content p { font-size: .9rem; color: var(--ink2); line-height: 1.75; font-weight: 400; }

/* Images */
.cs-img-full { width: 100%; border-radius: var(--cs-img-radius); overflow: hidden; margin: 28px 0; border: 1px solid var(--border); background: var(--bg); }
.cs-img-full img { width: 100%; height: auto; display: block; }
.cs-2img { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 24px 0; }
.cs-2img img { width: 100%; height: auto; display: block; border-radius: var(--cs-img-radius-sm); border: 1px solid var(--border); background: var(--bg); }
.cs-caption { font-size: .8rem; color: var(--muted); text-align: center; font-style: italic; line-height: 1.6; margin-top: -10px; margin-bottom: 20px; }
.cs-img-label { text-align: center; font-size: .8rem; color: var(--muted); font-style: italic; line-height: 1.6; margin-top: 8px; }

/* Tag chips */
.cs-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.cs-chip {
  padding: 6px 14px; border-radius: 100px; font-size: .76rem; font-weight: 600;
  background: rgba(108,99,255,.08); color: var(--g1); border: 1px solid rgba(108,99,255,.2);
}

/* Other work footer */
.cs-other {
  padding: 32px var(--page-side) 112px;
  border-top: 1px solid var(--border);
  max-width: var(--max-w);
  margin: 0 auto;
  background: #fcfbff;
}
.cs-other h3 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.3rem; margin-bottom: 36px; }
.cs-other-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.cs-other-card {
  background: white; border-radius: var(--radius-sm); overflow: hidden;
  border: 1px solid var(--border); cursor: none;
  transition: transform .25s, box-shadow .25s;
}
.cs-other-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.1); }
.cs-other-thumb { height: 138px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #f3f1ff; }
.cs-other-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cs-other-info { padding: 12px 16px; }
.cs-other-info strong { font-size: .86rem; font-family: 'Playfair Display', serif; font-weight: 700; display: block; }
.cs-other-info span { font-size: .72rem; color: var(--muted); }

.cs-nav-bar {
  display: none;
  justify-content: space-between; align-items: center;
  padding: 28px var(--page-side); border-top: 1px solid var(--border);
  background: #fcfbff; max-width: var(--max-w); margin: 0 auto;
}
.cs-nav-btn { background: none; border: none; cursor: none; font-family: 'Outfit', sans-serif; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.cs-nav-btn span:first-child { font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.cs-nav-btn span:last-child { font-size: .96rem; font-weight: 600; color: var(--g1); }
.cs-nav-btn:hover span:last-child { text-decoration: underline; }

/* --------------------------------------
   GALLERY
-------------------------------------- */
.gallery-wrap { max-width: var(--max-w); margin: 0 auto; padding: 80px var(--page-side) 96px; }
.gallery-hero { max-width: 760px; margin-bottom: 52px; }
.gallery-title {
  font-family: 'Playfair Display', serif;
  font-weight: 700; font-size: clamp(2rem, 4vw, 3.1rem);
  letter-spacing: -.02em; line-height: 1.08; margin-bottom: 18px;
}
.gallery-sub {
  font-size: 1rem; color: var(--ink2); line-height: 1.85; margin-bottom: 12px;
}
.gallery-section { margin-top: 42px; }
.gallery-section-title {
  font-family: 'Playfair Display', serif;
  font-weight: 700; font-size: 1.7rem; margin-bottom: 14px;
}
.gallery-section-sub {
  font-size: .96rem; color: var(--muted); line-height: 1.8; max-width: 760px; margin-bottom: 24px;
}
.gallery-artwork-shell {
  position: relative;
}
.gallery-artwork-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(240px, 280px);
  gap: 18px;
  overflow-x: auto;
  padding: 6px 4px 18px;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.gallery-artwork-row::-webkit-scrollbar {
  display: none;
}
.gallery-art-card {
  margin: 0;
  border-radius: var(--radius);
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
  perspective: 1200px;
  position: relative;
}
.gallery-art-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
  transform-style: preserve-3d;
  transition: transform .7s cubic-bezier(.22,1,.36,1);
}
.gallery-art-face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: stretch;
  justify-content: center;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
  border: 1px solid var(--border);
  background: white;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
}
.gallery-art-card-front {
  z-index: 2;
  transform: rotateY(0deg) translateZ(1px);
}
.gallery-art-card-back {
  transform: rotateY(180deg) translateZ(1px);
  background: linear-gradient(160deg, rgba(30, 31, 36, .96), rgba(64, 67, 74, .95));
  padding: 24px 22px;
  text-align: left;
  align-items: center;
  border-color: rgba(255,255,255,.06);
}
.gallery-art-card-back p {
  margin: 0;
  color: white;
  font-size: .84rem;
  line-height: 1.65;
  font-weight: 300;
}
@media (hover: hover) and (pointer: fine) {
  .gallery-art-card:hover .gallery-art-card-inner {
    transform: rotateY(180deg);
  }
}
.gallery-art-img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  display: block;
  object-fit: cover;
}
.gallery-scroll-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border: 1px solid rgba(108,99,255,.2);
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  color: var(--g1);
  font-size: 1.1rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
  z-index: 2;
}
.gallery-scroll-btn-left {
  left: -12px;
}
.gallery-scroll-btn-right {
  right: -12px;
}
.gallery-scroll-btn.is-hidden {
  display: none;
}
.gallery-placeholder-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
.gallery-placeholder-card {
  min-height: 220px; border-radius: var(--radius); border: 1.5px dashed rgba(108,99,255,.28);
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(246,242,255,.92));
  display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 20px; font-size: .88rem; font-weight: 600; color: var(--muted);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
@media(max-width: 768px) {
  .gallery-wrap { padding: 60px var(--page-side) 80px; }
  .gallery-placeholder-grid { grid-template-columns: 1fr; }
  .gallery-placeholder-card { min-height: 180px; }
}

/* --------------------------------------
   RESUME
-------------------------------------- */
.resume-wrap { max-width: var(--max-w); margin: 0 auto; padding: 72px var(--page-side) 80px; }
.resume-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 40px; padding-bottom: 18px; border-bottom: 2px solid var(--border);
}
.resume-name {
  font-family: 'Playfair Display', serif; font-weight: 700; font-size: 2.4rem;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: 1.05; margin-bottom: 6px;
}
.resume-role { font-size: .96rem; font-weight: 600; color: var(--muted); letter-spacing: .04em; }
.resume-contact { text-align: right; font-size: .82rem; color: var(--muted); line-height: 2; }
.resume-contact a { color: var(--g1); text-decoration: none; cursor: none; }
.resume-sec { margin-bottom: 40px; }
.resume-main .resume-sec:first-child { margin-bottom: 52px; }
.resume-sec-title {
  font-size: .7rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  margin-bottom: 20px; padding-bottom: 8px; border-bottom: 1.5px solid var(--border);
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.exp { margin-bottom: 26px; }
.exp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 4px; }
.exp-role { font-weight: 700; font-size: .96rem; }
.exp-co { font-size: .86rem; color: var(--g1); font-weight: 600; margin-bottom: 8px; }
.exp-date { font-size: .72rem; color: var(--muted); padding: 3px 11px; background: var(--bg); border-radius: 100px; border: 1px solid var(--border); white-space: nowrap; }
.exp-list { list-style: none; }
.exp-list li { font-size: .86rem; color: var(--ink2); line-height: 1.7; padding-left: 16px; position: relative; margin-bottom: 5px; font-weight: 400; }
.exp-list li::before {
  content: '\2022'; position: absolute; left: 0; font-size: .9rem; top: 1px;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  font-weight: 700;
}
.resume-pane { margin-bottom: 0; }
.resume-pane:last-child { margin-bottom: 0; }
.skills-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.skill-box {
  background: white; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 16px; transition: transform .2s, box-shadow .2s;
}
.skill-box:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.08); }
.skill-box h4 {
  font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  margin-bottom: 8px;
  background: var(--grad-main); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.skill-box p { font-size: .78rem; color: var(--ink2); line-height: 1.65; font-weight: 400; }
.resume-skill-group.ai-tools h4 {
  background: linear-gradient(90deg, #ff7aa8 0%, #ff8f6b 38%, #ffb347 72%, #ff8a00 100%);
  display: inline-block;
  background-size: 100% 100%;
  background-position: 50% 50%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 10px 24px rgba(247,86,124,.14);
}
.resume-skill-group.ai-tools p {
  color: var(--ink);
}
.resume-pane {
  margin-bottom: 24px;
}
.resume-awards-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.resume-award-item {
  font-size: .84rem;
  color: var(--ink2);
  line-height: 1.6;
  padding-left: 16px;
  position: relative;
}
.resume-award-item::before {
  content: '-';
  position: absolute;
  left: 0;
  color: var(--g2);
  font-weight: 700;
}

/* --------------------------------------
   CONTACT
-------------------------------------- */
.contact-wrap {
  max-width: var(--max-w); margin: 0 auto;
  padding: 56px var(--page-side) 48px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 72px;
  align-items: center;
  min-height: calc(100vh - 68px);
}
.contact-heading {
  font-family: 'Playfair Display', serif; font-weight: 700;
  font-size: clamp(1.9rem, 3.2vw, 2.6rem); letter-spacing: -.02em; line-height: 1.1; margin-bottom: 14px;
}
.contact-heading .grad { background: var(--grad-warm); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.contact-sub { font-size: .92rem; color: var(--muted); line-height: 1.75; margin-bottom: 28px; font-weight: 400; max-width: 400px; }
.contact-links { display: flex; flex-direction: column; gap: 10px; }
.c-link {
  display: flex; align-items: center; gap: 16px; padding: 15px 20px;
  background: white; border-radius: var(--radius); border: 1px solid var(--border);
  text-decoration: none; color: var(--ink); cursor: none;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
  transition: transform .2s, box-shadow .2s;
}
.c-link:hover { transform: translateX(5px); box-shadow: 0 6px 24px rgba(108,99,255,.12); }
.c-link-icon { font-size: 1.1rem; flex-shrink: 0; }
.c-link-text { font-size: .88rem; font-weight: 600; color: var(--ink2); }

.home-connect {
  content-visibility: auto;
  contain-intrinsic-size: 360px;
  margin-top: 52px;
  padding: 44px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: linear-gradient(135deg, rgba(255,255,255,.985), rgba(250,248,255,.965));
  border: 1px solid var(--border);
  border-radius: 28px;
  box-shadow: 0 18px 48px rgba(22, 16, 56, .08);
}

.home-connect-title { margin-bottom: 14px; max-width: 640px; }
.home-connect-sub { max-width: 620px; margin-bottom: 8px; }
.home-connect-note {
  max-width: 620px;
  margin: 0 0 26px;
  font-size: .92rem;
  line-height: 1.7;
  color: var(--ink2);
}
.home-connect-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.btn-sm {
  padding: 11px 22px;
  font-size: .84rem;
  box-shadow: 0 6px 18px rgba(22, 16, 56, .08);
}
.btn-sm:hover { box-shadow: 0 10px 24px rgba(22, 16, 56, .12); }
.btn-about {
  background: linear-gradient(135deg, #5f86d9, #4b73c7);
  color: white;
  box-shadow: 0 8px 24px rgba(75, 115, 199, .22);
}
.btn-about:hover { box-shadow: 0 12px 30px rgba(75, 115, 199, .28); }

/* Form — clean bare fields, no card wrapper */
.cf { display: flex; flex-direction: column; gap: 16px; }
.cf-group { display: flex; flex-direction: column; gap: 6px; }
.cf-label { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.cf-error {
  color: var(--g2); letter-spacing: normal; text-transform: none; font-size: .78rem;
  margin-left: 6px;
}
.cf-error:not(:empty) {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.cf-error:not(:empty)::before {
  content: '!';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 10px;
  height: 10px;
  border: 1.75px solid var(--g2);
  border-radius: 50%;
  font-size: .46rem;
  font-weight: 700;
  line-height: 1;
}
.cf-input, .cf-textarea {
  background: white; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  padding: 13px 18px; font-family: 'Outfit', sans-serif; font-size: .92rem;
  color: var(--ink); outline: none; resize: none; width: 100%;
  box-shadow: 0 1px 8px rgba(0,0,0,.04);
  transition: border-color .2s, box-shadow .2s;
}
.cf-input:focus, .cf-textarea:focus {
  border-color: var(--g1); box-shadow: 0 0 0 3px rgba(108,99,255,.1);
}
.cf-textarea { min-height: 110px; }
.cf-submit {
  width: 100%; padding: 15px 28px; border-radius: 100px; border: none; cursor: none;
  font-family: 'Outfit', sans-serif; font-size: .95rem; font-weight: 700; letter-spacing: .02em;
  background: var(--grad-main); color: white;
  box-shadow: 0 8px 28px rgba(108,99,255,.25);
  transition: transform .2s, box-shadow .2s;
}
.cf-submit:hover { transform: translateY(-2px); box-shadow: 0 14px 36px rgba(108,99,255,.35); }
.cf-success {
  display: none; background: rgba(0,201,167,.1); border: 1px solid rgba(0,201,167,.3);
  border-radius: var(--radius-sm); padding: 14px 18px;
  font-size: .86rem; color: var(--g3); font-weight: 600; text-align: center;
}

footer {
  text-align: center; padding: 24px; font-size: .73rem; color: var(--muted);
  border-top: 1px solid var(--border); background: white;
}

/* -- RESPONSIVE -- */
@media(max-width: 768px) {
  nav { padding: 0 var(--side-mobile); }
  .nav-logo { gap: 8px; }
  .nav-logo-mark { width: 16px; height: 16px; }
  .nav-logo-text { font-size: 1rem; }
  .home-hero { padding: 60px var(--side-mobile) 40px; grid-template-columns: 1fr; }
  .home-stats-wrap { padding: 0 var(--side-mobile); }
  .home-stats { flex-wrap: wrap; }
  .home-work-section { padding: 60px var(--page-side) 80px; }
  .about-wrap, .portfolio-wrap { padding: 60px var(--page-side); }
  .about-grid { grid-template-columns: 1fr; }
  .work-grid { grid-template-columns: 1fr; }
  .cs-band { padding: 40px var(--page-side) 32px; }
  .cs-meta-row { gap: 10px; }
  .cs-body { padding: 40px var(--page-side); }
  .cs-stats, .cs-2col, .cs-2img { grid-template-columns: 1fr; }
  .cs-other-grid { grid-template-columns: 1fr 1fr; }
  .cs-other { padding: 40px var(--page-side); }
  .cs-nav-bar { padding: 20px var(--page-side); }
  .resume-wrap { padding: 40px var(--page-side); }
  .resume-top { flex-direction: column; gap: 14px; }
  .resume-contact { text-align: left; }
  .skills-grid { grid-template-columns: 1fr 1fr; }
  .home-connect { padding: 32px 22px; }
  .contact-wrap { grid-template-columns: 1fr; padding: 60px var(--page-side); gap: 40px; }
  .hpc { grid-template-columns: 1fr; height: auto; }
  .hpc-image { min-height: 160px; height: 160px; }
  .hpc-body { padding: 24px 22px; }
  .hpc-title { font-size: 1.4rem; }
  .hpc-desc { -webkit-line-clamp: unset; }
}
.process-desc {
  display: block;
  overflow: visible;
  min-height: 0;
}
.stat-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 126px;
}
.stat-label {
  line-height: 1.45;
  max-width: 17ch;
}
.process-step-num {
  background: none;
  -webkit-text-fill-color: initial;
  color: var(--g1);
}
.earlier-case-studies-cta {
  display: flex;
  justify-content: center;
  margin: 52px 0 0;
}
.earlier-case-studies-btn.btn {
  min-width: 280px;
  justify-content: center;
  font-weight: 500;
}
.earlier-case-studies-wrap {
  padding-top: 72px;
  padding-bottom: 100px;
}
.earlier-case-studies-head {
  max-width: 720px;
  margin-bottom: 40px;
}
.home-connect-sub,
.home-connect-note {
  color: var(--muted);
}
.home-connect-sub {
  margin-bottom: 4px;
}
.home-connect-note {
  margin: 0 0 26px;
}
@media(max-width: 768px) {
  .stat-item {
    min-height: 0;
  }
  .stat-label {
    max-width: none;
  }
  .earlier-case-studies-btn {
    width: 100%;
    min-width: 0;
  }
  .earlier-case-studies-cta {
    margin: 40px 0 0;
  }
  .earlier-case-studies-wrap {
    padding-top: 40px;
    padding-bottom: 80px;
  }
}
.earlier-case-studies-wrap .cs-back {
  margin-bottom: 28px;
  color: var(--g1);
}
.earlier-case-studies-wrap .cs-back:hover {
  color: var(--g2);
}
.process-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 56px;
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(247,243,255,.94));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 8px 30px rgba(22,16,56,.05);
}
.process-card {
  background: transparent;
  border: 0;
  border-right: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
  padding: 26px 24px 24px;
  min-height: 196px;
  align-content: start;
}
.process-card:last-child {
  border-right: 0;
}
.process-card::after {
  content: '→';
  position: absolute;
  top: 30px;
  right: -12px;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border: 1px solid rgba(108,99,255,.18);
  color: var(--g1);
  font-size: .82rem;
  opacity: 1;
  box-shadow: 0 4px 12px rgba(108,99,255,.08);
  z-index: 2;
}
.process-card:last-child::after {
  display: none;
}
.process-card:hover {
  transform: none;
  box-shadow: inset 0 0 0 1px rgba(108,99,255,.08);
  background: rgba(255,255,255,.38);
}
.process-icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(108,99,255,.08);
  margin-bottom: 12px;
}
.process-step-num {
  display: block;
  margin-bottom: 12px;
  font-size: 2rem;
}
.process-title {
  margin-bottom: 10px;
}
.process-desc {
  max-width: 22ch;
}
@media(max-width: 768px) {
  .process-strip {
    grid-template-columns: 1fr;
  }
  .process-card {
    border-right: 0;
    border-bottom: 1px solid var(--border);
    min-height: 0;
  }
  .process-card:last-child {
    border-bottom: 0;
  }
  .process-card::after {
    top: auto;
    right: 24px;
    bottom: -12px;
    content: '↓';
  }
}
.process-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
  margin-bottom: 56px;
  padding: 10px 0 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
  position: relative;
}
.process-strip::before {
  content: '';
  position: absolute;
  left: 18px;
  right: 18px;
  top: 28px;
  height: 1px;
  background: linear-gradient(90deg, rgba(108,99,255,.22), rgba(247,86,124,.16));
}
.process-card {
  position: relative;
  background: none;
  border: 0;
  border-right: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0 16px 0 0;
  min-height: 0;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 8px 12px;
}
.process-card::before {
  content: '';
  position: absolute;
  top: 20px;
  left: 14px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: white;
  border: 1px solid rgba(108,99,255,.28);
  box-shadow: 0 0 0 6px rgba(255,255,255,.96);
}
.process-card::after {
  content: '→';
  position: absolute;
  top: 14px;
  right: -10px;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: none;
  color: rgba(108,99,255,.72);
  font-size: 1rem;
  box-shadow: none;
  z-index: 2;
}
.process-card:last-child::after {
  display: none;
}
.process-card:hover {
  transform: none;
  background: none;
  box-shadow: none;
}
.process-icon {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(108,99,255,.12), rgba(247,86,124,.08));
  border: 1px solid rgba(108,99,255,.14);
  margin: 0 0 14px;
  position: relative;
  z-index: 1;
}
.process-step-num {
  display: inline-flex;
  align-items: center;
  margin: 4px 0 0;
  font-size: 2rem;
}
.process-title {
  flex: 0 0 100%;
  margin: 2px 0 6px;
}
.process-desc {
  flex: 0 0 100%;
  max-width: 18ch;
  min-height: 0;
}
@media(max-width: 768px) {
  .process-strip {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 0;
  }
  .process-strip::before {
    left: 19px;
    right: auto;
    top: 18px;
    bottom: 18px;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, rgba(108,99,255,.22), rgba(247,86,124,.16));
  }
  .process-card {
    padding: 0 0 0 64px;
  }
  .process-card::before {
    top: 12px;
    left: 11px;
  }
  .process-card::after {
    top: auto;
    right: auto;
    left: 16px;
    bottom: -18px;
    content: '↓';
  }
}
/* Process section reset to spacing-only version */
#home-work > .section-eyebrow.reveal {
  margin: 0 0 42px !important;
}
.process-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  max-width: none;
  margin: 0 0 56px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
  position: relative;
  align-items: start;
}
.process-strip::before {
  display: none;
}
.process-card {
  position: relative;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0 8px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
}
.process-card::before,
.process-card::after {
  content: none;
}
.process-card:hover {
  transform: none;
  background: none;
  box-shadow: none;
}
.process-icon {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(108,99,255,.12), rgba(247,86,124,.08));
  border: 1px solid rgba(108,99,255,.14);
  box-shadow: 0 10px 24px rgba(22, 26, 29, .06);
  font-size: 1.35rem;
  line-height: 1;
  margin: 0 0 16px;
  position: relative;
  z-index: 1;
}
.process-step-num {
  display: none;
}
.process-title {
  flex: 0 0 auto;
  margin: 0;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
  color: #2f2f2f;
}
.process-desc {
  flex: 0 0 auto;
  max-width: 19ch;
  min-height: 0;
  margin: 0;
  font-size: .88rem;
  line-height: 1.5;
  color: #6a6a6a;
}
@media(max-width: 768px) {
  .process-strip {
    grid-template-columns: 1fr;
    gap: 28px;
    max-width: none;
    padding-top: 0;
  }
  .process-card {
    padding: 0 24px;
  }
}



.resume-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 36px;
  align-items: start;
}
.resume-side {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.resume-pane {
  background: white;
  border-radius: var(--radius);
  padding: 28px;
  border: 1px solid var(--border);
  box-shadow: 0 2px 20px rgba(0,0,0,.05);
}
.resume-pane .resume-sec-title {
  margin-bottom: 18px;
}
.resume-pane .exp {
  margin-bottom: 0;
}
.resume-pane .skills-grid {
  grid-template-columns: 1fr;
}
.resume-main .resume-sec {
  margin-bottom: 0;
}
.resume-side .skill-box {
  box-shadow: none;
}
.resume-side .skill-box:hover {
  transform: none;
  box-shadow: none;
}
@media(max-width: 900px) {
  .resume-layout {
    grid-template-columns: 1fr;
  }
  .resume-side {
    order: 2;
  }
  .resume-main {
    order: 1;
  }
}


.resume-skill-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.resume-skill-group h4 {
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  margin-bottom: 10px;
  background: var(--grad-main);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.resume-skill-group p {
  font-size: .82rem;
  color: var(--ink2);
  line-height: 1.7;
  font-weight: 400;
}




.about-legacy {
  margin: 0;
}
.about-legacy-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
.about-legacy-card {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}
.about-legacy-card-wide {
  grid-column: auto;
}
.about-legacy-card h3 {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}
.about-legacy-card p {
  font-size: .96rem;
  color: var(--ink2);
  line-height: 1.8;
}
.about-legacy-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.about-legacy-list li {
  position: relative;
  padding-left: 18px;
  font-size: .96rem;
  color: var(--ink2);
  line-height: 1.8;
}
.about-legacy-list li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--g2);
}
@media(max-width: 768px) {
  .about-hero { grid-template-columns: 1fr; gap: 28px; }
  .about-wrap, .portfolio-wrap { padding: 60px var(--page-side); }
  .about-photo { justify-self: stretch; max-width: none; }
}






.gallery-travel-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.gallery-travel-grid .gallery-art-img {
  min-height: 180px;
}
@media(max-width: 900px) {
  .gallery-travel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


.gallery-artwork-row {
  grid-auto-columns: minmax(280px, 340px);
}
.gallery-artwork-row .gallery-art-card,
.gallery-travel-grid .gallery-art-card {
  aspect-ratio: 1.45 / 1;
}
.gallery-artwork-row .gallery-art-img,
.gallery-travel-grid .gallery-art-img {
  min-height: 0;
}
.gallery-travel-grid {
  gap: 14px;
}


.gallery-art-card {
  border-radius: 12px;
}
.gallery-art-card,
.gallery-art-card-inner,
.gallery-art-face {
  border-radius: 12px;
}
.gallery-travel-grid .gallery-art-card {
  aspect-ratio: 1.38 / 1;
}
.gallery-travel-grid .gallery-art-img {
  min-height: 196px;
}


.gallery-artwork-shell::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 18px;
  width: 88px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(248,247,255,0), rgba(248,247,255,.92) 72%, rgba(248,247,255,1));
  z-index: 1;
}
.gallery-art-card {
  background: transparent;
}


.gallery-artwork-shell-static::after {
  display: none;
}
.gallery-artwork-row-static {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1.5fr;
  gap: 20px;
  overflow: visible;
  padding: 6px 0 0;
  align-items: center;
}
.gallery-artwork-row-static .gallery-art-card-wide {
  aspect-ratio: 1.45 / 1;
}
.gallery-artwork-row-static .gallery-art-card-tall {
  aspect-ratio: .82 / 1;
}
.gallery-artwork-row-static .gallery-art-img {
  min-height: 0;
}
.gallery-artwork-shell-static .gallery-scroll-btn {
  display: none;
}
@media(max-width: 1100px) {
  .gallery-artwork-row-static {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media(max-width: 768px) {
  .gallery-artwork-row-static {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


.about-hero {
  align-items: stretch;
}
.about-photo {
  height: 100%;
  min-height: 0;
}
.about-photo img {
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 22%;
}
.about-projects-btn {
  min-width: 168px;
  padding: 10px 18px;
  font-size: .84rem;
  box-shadow: 0 10px 26px rgba(108,99,255,.22);
}
.about-design-practice {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}
.about-design-practice .about-section-label {
  margin-bottom: 18px;
}
.about-section-sub {
  font-size: .95rem;
  color: var(--muted);
  line-height: 1.7;
  margin: -4px 0 24px;
}
.about-life-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 22px;
}
.about-life-item {
  background: white;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 16px 18px;
  font-size: .9rem;
  color: var(--ink2);
  line-height: 1.6;
  box-shadow: 0 2px 14px rgba(0,0,0,.04);
}
@media(max-width: 768px) {
  .about-photo {
    height: auto;
  }
  .about-photo img {
    height: auto;
    aspect-ratio: 6 / 5;
  }
  .about-life-grid {
    grid-template-columns: 1fr;
  }
}


.about-section-no-divider {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}
.about-projects-btn {
  box-shadow: 0 4px 14px rgba(108,99,255,.12);
  padding: 9px 16px;
}
.about-projects-btn:hover {
  box-shadow: 0 8px 18px rgba(108,99,255,.16);
}
.about-design-practice {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}
.about-design-practice .skill-group {
  display: block;
}
.about-design-practice .skill-group-label {
  margin-bottom: 12px;
  white-space: normal;
}
.about-design-practice .skill-pills {
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.about-section-sub {
  margin: 0 0 24px;
}


.about-design-practice .pill {
  padding: 6px 13px;
  font-size: .76rem;
}
.about-life-head {
  text-align: center;
  margin-bottom: 24px;
}
.about-life-head .about-expertise-title {
  margin-bottom: 10px;
}


.about-life-photos {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
.about-life-photo {
  margin: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 4px 16px rgba(0,0,0,.05);
}
.about-life-photo img {
  width: 100%;
  display: block;
  aspect-ratio: 1.35 / 1;
  object-fit: cover;
}
@media(max-width: 768px) {
  .about-life-photos {
    grid-template-columns: 1fr;
  }
}


.about-section.about-section-no-divider.reveal.reveal-delay-3 {
  margin-top: 20px;
}
.about-life-head .about-expertise-title {
  margin-bottom: 10px;
  font-size: 1.08rem;
}
.about-life-photos {
  gap: 18px;
  max-width: none;
}
.about-life-photo img {
  aspect-ratio: 1.5 / 1;
}


.about-life-head .about-expertise-title {
  font-size: 1.18rem;
}


.about-life-head .about-expertise-title {
  font-size: 1rem;
}
.about-life-photo img {
  aspect-ratio: 1.42 / 1;
}


.about-life-head .about-expertise-title {
  font-size: 1.32rem;
  line-height: 1.2;
}


.about-life-head .about-expertise-title {
  font-size: 1.42rem !important;
  line-height: 1.15;
}


.about-section.about-section-no-divider.reveal.reveal-delay-3 {
  margin-top: 34px;
}
.about-life-head .about-expertise-title {
  font-size: 1rem !important;
  line-height: 1.1;
}


.about-life-head .about-expertise-title {
  font-size: 1.6rem !important;
  line-height: 1.08;
}


.gallery-hero {
  text-align: center;
}
.gallery-hero .gallery-sub {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
#page-gallery .gallery-art-img {
  cursor: zoom-in;
}
body.gallery-lightbox-open {
  overflow: hidden;
}
.gallery-lightbox[hidden] {
  display: none;
}
.gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  background: rgba(14, 18, 33, 0.74);
  backdrop-filter: blur(10px);
}
.gallery-lightbox-backdrop {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gallery-lightbox-img {
  display: block;
  width: auto;
  max-width: min(92vw, 1180px);
  max-height: 86vh;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
}
.gallery-lightbox-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #1b1f3b;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}
.gallery-lightbox-close:hover {
  background: white;
}
@media(max-width: 768px) {
  .gallery-lightbox {
    padding: 18px;
  }
  .gallery-lightbox-close {
    top: 12px;
    right: 12px;
  }
  .gallery-lightbox-img {
    max-width: 100%;
    max-height: 82vh;
  }
}


.gallery-hero {
  max-width: 760px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}
.gallery-hero .gallery-title,
.gallery-hero .gallery-sub {
  margin-left: auto;
  margin-right: auto;
}

/* --------------------------------------
   RESPONSIVE ADDITIONS
   Tablet: 768px - 1023px
   Mobile: below 768px
-------------------------------------- */

@media (min-width: 768px) and (max-width: 1023px) {
  nav {
    padding: 0 28px;
  }

  .nav-links {
    gap: 4px;
  }

  .nav-links a {
    padding: 7px 10px;
    font-size: .74rem;
  }

  .home-hero-outer {
    min-height: auto;
    padding-bottom: 40px;
  }

  .home-hero {
    padding: 72px 28px 28px;
  }

  .hero-headline .hl-line {
    white-space: normal;
  }

  .hero-sub {
    max-width: 42ch;
    text-wrap: balance;
    margin-bottom: 32px;
  }

  .fact-grid {
    position: absolute;
    inset: 0;
    display: block;
    width: auto;
    margin: 0;
    padding: 0;
    z-index: 2;
    pointer-events: none;
  }

  .fact-wrap {
    position: absolute;
  }

  .fact-card {
    max-width: 172px;
    white-space: normal;
    transform: scale(.82);
    transform-origin: center;
    padding: 11px 13px;
    gap: 9px;
  }

  .fact-title,
  .fact-sub {
    line-height: 1.35;
  }

  .fact-wrap-1 { top: 16%; right: 34%; }
  .fact-wrap-2 { top: 21%; right: 0; }
  .fact-wrap-3 { top: 40%; right: 38%; }
  .fact-wrap-4 { top: 56%; right: 4%; }
  .fact-wrap-5 { top: 72%; right: 28%; }

  .fact-wrap-4 .fact-card {
    max-width: 196px;
  }

  .home-stats-wrap,
  .home-work-section,
  .about-wrap,
  .portfolio-wrap,
  .gallery-wrap,
  .resume-wrap,
  .contact-wrap,
  .cs-body,
  .cs-other,
  .cs-nav-bar {
    padding-left: 28px;
    padding-right: 28px;
  }

  .home-stats-wrap {
    margin-top: -24px;
  }

  .home-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .stat-item {
    min-width: 0;
    padding: 24px 14px;
  }

  .stat-item:nth-child(1),
  .stat-item:nth-child(2),
  .stat-item:nth-child(3),
  .stat-item:nth-child(4) {
    border-right: 1px solid var(--border);
  }

  .process-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  .hpc {
    grid-template-columns: minmax(280px, 42%) minmax(0, 1fr);
    height: auto;
    min-height: 280px;
  }

  .hpc-image {
    min-height: 100%;
  }

  .hpc-body {
    padding: 28px;
  }

  .process-card {
    padding: 0 6px;
  }

  .process-title {
    font-size: .94rem;
    white-space: nowrap;
  }

  .process-desc {
    max-width: none;
    font-size: .74rem;
    line-height: 1.55;
  }

  .about-hero,
  .about-expertise-grid,
  .contact-wrap {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .about-photo {
    justify-self: center;
    max-width: 420px;
  }

  .resume-layout,
  .cs-stats,
  .cs-2col,
  .cs-other-grid,
  #cs-genemod .genemod-approach-layout,
  #cs-genemod .genemod-barcode-compare,
  #cs-genemod .genemod-analytics-grid,
  #cs-inflerra .inflerra-experience-grid,
  #cs-aroundtown .aroundtown-stat-row,
  #cs-aroundtown .aroundtown-hero-gallery,
  #cs-aroundtown .aroundtown-gallery-lowfi,
  #cs-aroundtown .aroundtown-gallery-hifi,
  #cs-aroundtown .aroundtown-gallery-hifi-group,
  #cs-aroundtown .aroundtown-gallery-hifi-2up,
  #cs-alumnify .alumnify-stat-row,
  #cs-alumnify .alumnify-stage-grid,
  #cs-alumnify .alumnify-stakeholder-grid,
  #cs-alumnify .alumnify-ideation-grid,
  #cs-alumnify .alumnify-feature-grid,
  #cs-alumnify .alumnify-annotation-grid {
    grid-template-columns: 1fr;
  }

  .resume-side {
    order: 2;
  }

  .resume-main {
    order: 1;
  }

  .exp-head {
    flex-direction: column;
    gap: 8px;
  }

  .gallery-travel-grid,
  .about-life-photos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-scroll-btn {
    display: none;
  }

  .cs-band {
    padding: 48px 28px 36px;
  }

  .cs-meta-row,
  #cs-genemod .genemod-meta-row,
  #cs-inflerra .inflerra-meta-row,
  #cs-aroundtown .aroundtown-meta-row,
  #cs-alumnify .alumnify-meta-row {
    gap: 12px;
  }

  .cs-meta-pill {
    width: calc(50% - 6px);
    min-width: 0;
  }
}

@media (max-width: 767px) {
  nav {
    min-height: 68px;
    padding: 12px 20px;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
  }

  .page,
  .case-study {
    padding-top: 92px;
  }

  .nav-logo {
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
  }

  .nav-toggle {
    display: inline-flex;
    flex: 0 0 auto;
  }

  .nav-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .nav-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .nav-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .nav-links {
    width: 100%;
    display: none;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(108,99,255,.14);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255,255,255,.985), rgba(250,248,255,.965));
    box-shadow: 0 16px 40px rgba(22, 16, 56, .1);
  }

  body.mobile-nav-open .nav-links {
    display: flex;
  }

  .nav-links a {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 12px 14px;
    font-size: .72rem;
  }

  .home-hero-outer {
    min-height: auto;
    margin-top: -68px;
    padding-top: 68px;
    padding-bottom: 28px;
  }

  .home-hero {
    padding: 36px 16px 16px;
  }

  .hero-tag {
    margin-bottom: 20px;
  }

  .hero-headline {
    font-size: clamp(2.5rem, 10vw, 3.6rem);
    line-height: 1.14;
    margin-bottom: 20px;
  }

  .hero-headline .hl-line {
    white-space: normal;
  }

  .hero-headline .grad-word {
    min-width: 0;
  }

  .hero-sub {
    max-width: 100%;
    font-size: 1rem;
    line-height: 1.65;
    margin-bottom: 22px;
  }

  .hero-ctas {
    flex-direction: column;
    margin-top: 22px;
  }

  .hero-ctas .btn,
  .home-connect-actions .btn {
    justify-content: center;
    width: 100%;
  }

  .fact-grid {
    display: none;
  }

  .blob-1 {
    width: 340px;
    height: 340px;
    top: -110px;
    right: -120px;
  }

  .blob-2 {
    width: 240px;
    height: 240px;
    left: -90px;
    bottom: -80px;
  }

  .blob-3 {
    width: 180px;
    height: 180px;
    right: -10px;
  }

  .home-stats-wrap,
  .home-work-section,
  .about-wrap,
  .portfolio-wrap,
  .gallery-wrap,
  .resume-wrap,
  .contact-wrap,
  .cs-body,
  .cs-other,
  .cs-nav-bar {
    padding-left: 20px;
    padding-right: 20px;
  }

  .home-stats-wrap {
    margin: 34px auto 0;
  }

  .home-stats {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    align-items: stretch;
  }

  .stat-item {
    grid-column: span 2;
    min-height: 0;
    padding: 20px;
    border-right: 1px solid var(--border);
    border-top: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 168px;
  }

  .stat-item:nth-child(4) {
    grid-column: 1 / span 3;
    border-top: 1px solid var(--border);
  }

  .stat-item:nth-child(5) {
    grid-column: 4 / span 3;
    border-top: 1px solid var(--border);
    border-right: none;
  }

  .stat-label {
    max-width: none;
  }

  .process-strip {
    grid-template-columns: 1fr;
    gap: 16px;
    justify-items: center;
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }

  .process-card {
    padding: 0 20px;
    width: 100%;
    max-width: none;
    text-align: center;
    justify-content: center;
    align-items: center;
  }

  .process-icon,
  .process-step-num {
    justify-self: center;
  }

  .process-title,
  .process-desc {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .process-desc {
    max-width: 24ch;
  }

  .hpc {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 0;
  }

  .hpc-image {
    height: 200px;
    min-height: 200px;
  }

  .hpc-body {
    padding: 22px 18px;
  }

  .hpc-title {
    font-size: 1.25rem;
  }

  .hpc-stats {
    width: 100%;
    flex-wrap: wrap;
    gap: 14px;
  }

  .earlier-case-studies-btn.btn {
    min-width: 0;
    width: 100%;
  }

  .earlier-case-studies-cta {
    margin-bottom: 26px;
  }

  .about-hero,
  .about-expertise-grid,
  .contact-wrap,
  .resume-layout,
  .cs-stats,
  .cs-2col,
  .cs-2img,
  .cs-other-grid,
  .gallery-artwork-row-static,
  .gallery-travel-grid,
  .about-life-grid,
  .about-life-photos,
  #cs-genemod .genemod-approach-layout,
  #cs-genemod .genemod-research-2img,
  #cs-genemod .genemod-analytics-grid,
  #cs-genemod .genemod-barcode-compare,
  #cs-genemod .genemod-barcode-grid,
  #cs-genemod .genemod-move-grid,
  #cs-genemod .genemod-workflow-images,
  #cs-inflerra .inflerra-experience-grid,
  #cs-aroundtown .aroundtown-stat-row,
  #cs-aroundtown .aroundtown-hero-gallery,
  #cs-aroundtown .aroundtown-gallery-lowfi,
  #cs-aroundtown .aroundtown-gallery-hifi,
  #cs-aroundtown .aroundtown-gallery-hifi-group,
  #cs-aroundtown .aroundtown-gallery-hifi-2up,
  #cs-alumnify .alumnify-stat-row,
  #cs-alumnify .alumnify-stage-grid,
  #cs-alumnify .alumnify-stakeholder-grid,
  #cs-alumnify .alumnify-ideation-grid,
  #cs-alumnify .alumnify-feature-grid,
  #cs-alumnify .alumnify-annotation-grid {
    grid-template-columns: 1fr;
  }

  #cs-genemod .genemod-move-arrow {
    transform: rotate(90deg);
    margin: 6px auto;
  }

  .about-hero,
  .about-expertise-grid,
  .contact-wrap {
    gap: 24px;
  }

  .about-photo {
    justify-self: stretch;
    max-width: none;
  }

  .pill {
    font-size: .76rem;
  }

  .gallery-title,
  .resume-name,
  .contact-heading,
  .cs-h1 {
    word-break: break-word;
  }

  .gallery-scroll-btn {
    display: none;
  }

  .gallery-artwork-row-static,
  .gallery-travel-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(74vw, 1fr);
    grid-template-columns: none;
    overflow-x: auto;
    gap: 14px;
    padding: 6px 2px 12px;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .gallery-artwork-row-static::-webkit-scrollbar,
  .gallery-travel-grid::-webkit-scrollbar {
    display: none;
  }

  .gallery-artwork-row {
    grid-auto-columns: minmax(74vw, 1fr);
    padding-bottom: 12px;
  }

  .gallery-art-card,
  .gallery-travel-grid .gallery-art-card {
    aspect-ratio: 1.18 / 1;
  }

  .exp-head {
    flex-direction: column;
    gap: 8px;
  }

  .exp-date {
    white-space: normal;
  }

  .resume-pane {
    padding: 22px 18px;
  }

  .contact-wrap {
    min-height: auto;
    padding-top: 40px;
    padding-bottom: 56px;
  }

  .c-link {
    padding: 14px 16px;
  }

  .cf-input,
  .cf-textarea {
    padding: 12px 14px;
  }

  .home-connect {
    margin-top: 40px;
    padding: 30px 20px;
  }

  .home-connect-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .home-connect-actions .btn-about {
    grid-column: 1 / -1;
    width: min(100%, 220px);
    justify-self: center;
  }

  .cs-band {
    padding: 36px 20px 28px;
  }

  .cs-section {
    margin-bottom: 52px;
  }

  .cs-section-title {
    font-size: 1.45rem;
  }

  .cs-step {
    gap: 14px;
  }

  .cs-meta-row,
  #cs-genemod .genemod-meta-row,
  #cs-inflerra .inflerra-meta-row,
  #cs-aroundtown .aroundtown-meta-row,
  #cs-alumnify .alumnify-meta-row {
    flex-direction: column;
    gap: 10px;
  }

  .cs-meta-pill {
    width: 100%;
  }

  .cs-other {
    padding-bottom: 72px;
  }
}


#cs-genemod .cs-band {
  text-align: center;
}
#cs-genemod .cs-kicker,
#cs-genemod .cs-meta-row {
  justify-content: center;
}
#cs-genemod .cs-band > div:not(.genemod-meta-row) {
  margin-top: 0 !important;
}


#cs-genemod .genemod-band {
  background:
    radial-gradient(circle at 50% 0%, rgba(47, 102, 214, .08), rgba(47, 102, 214, 0) 58%),
    linear-gradient(180deg, rgba(246, 250, 255, .88) 0%, rgba(251, 253, 255, .28) 42%, rgba(255, 255, 255, 0) 82%);
  padding-bottom: 30px;
}
#cs-genemod .genemod-band-inner {
  margin-top: 12px !important;
}
#cs-genemod .cs-sub {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
#cs-genemod .genemod-hero-devices {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 10px var(--page-side) 34px;
  display: grid;
  grid-template-columns: .72fr 2.08fr .6fr;
  align-items: end;
  justify-items: center;
  gap: 28px;
}
#cs-genemod .genemod-device {
  margin: 0;
}
#cs-genemod .genemod-device img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-genemod .genemod-device-ipad {
  max-width: 196px;
}
#cs-genemod .genemod-device-laptop {
  max-width: 720px;
}
#cs-genemod .genemod-device-mobile {
  max-width: 138px;
}
@media(max-width: 900px) {
  #cs-genemod .genemod-hero-devices {
    grid-template-columns: 1fr;
    gap: 18px;
    padding-top: 0;
  }
  #cs-genemod .genemod-device-ipad,
  #cs-genemod .genemod-device-laptop,
  #cs-genemod .genemod-device-mobile {
    max-width: min(100%, 520px);
  }
}


#cs-genemod .cs-h1 {
  color: #2f66d6;
}
#cs-genemod .cs-meta-pill-label {
  color: #2f66d6 !important;
}
#cs-genemod .cs-section-title {
  color: #2f66d6;
}
#cs-genemod .cs-meta-pill-value {
  font-weight: 400;
}


#cs-genemod .genemod-band-inner {
  margin-top: 12px !important;
}
#cs-genemod .cs-h1 {
  color: #2f66d6 !important;
}
#cs-genemod .cs-meta-pill-label {
  color: #2f66d6 !important;
}
#cs-genemod .genemod-hero-devices {
  grid-template-columns: .72fr 2.08fr .6fr;
}
#cs-genemod .genemod-device-ipad {
  max-width: 196px;
}
#cs-genemod .genemod-device-mobile {
  max-width: 138px;
}


#cs-genemod .genemod-meta-row {
  max-width: var(--max-w);
  margin: 36px auto 0;
  padding: 0;
  justify-content: center;
}
#cs-genemod .genemod-device-laptop {
  max-width: 664px;
}
#cs-genemod .genemod-device-mobile {
  max-width: 124px;
}
#cs-genemod .genemod-key-contrib {
  margin-top: 26px;
}
#cs-genemod .genemod-key-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  line-height: 1.2;
  margin: 0 0 18px;
}
#cs-genemod .genemod-key-list {
  list-style: disc;
  padding-left: 22px;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 28px;
}
#cs-genemod .genemod-key-list li {
  color: var(--ink2);
  line-height: 1.7;
  padding-left: 2px;
}
@media(max-width: 768px) {
  #cs-genemod .genemod-key-list {
    grid-template-columns: 1fr;
  }
}


#cs-genemod .cs-band {
  padding-top: 78px;
}
#cs-genemod .genemod-meta-row {
  margin: 18px auto 6px;
  padding-bottom: 8px;
}
#cs-genemod .genemod-device-laptop {
  max-width: 628px;
}


#cs-genemod .cs-stats {
  margin: 40px 0 38px;
}
#cs-genemod .genemod-key-contrib {
  margin-top: 34px;
}
#cs-genemod .genemod-meta-row {
  margin: 10px auto 22px;
  padding-bottom: 0;
}


#cs-genemod .genemod-meta-row {
  margin: 4px auto 34px;
}


#cs-genemod .genemod-meta-row {
  margin: 0 auto 52px;
}
#cs-genemod .genemod-challenge-subhead {
  font-family: 'Playfair Display', serif;
  font-size: 1.24rem;
  line-height: 1.25;
  margin-top: 20px;
  margin-bottom: 8px;
}


#cs-genemod .genemod-meta-row {
  margin: 28px auto 24px !important;
  padding: 0;
  justify-content: center;
}
#cs-genemod .cs-step-content p + p {
  margin-top: 20px;
}
#cs-genemod .cs-step-content p + .genemod-step-subhead {
  margin-top: 34px;
}
#cs-genemod .genemod-step-subhead {
  font-family: 'Playfair Display', serif;
  font-size: 1.08rem;
  line-height: 1.3;
  margin: 24px 0 10px;
}
#cs-genemod .genemod-step-list {
  margin: 0 0 24px 20px;
  padding: 0;
}
#cs-genemod .cs-step-content .genemod-step-list + p {
  margin-top: 18px;
}
#cs-genemod .cs-step-content .genemod-step-list + .cs-2img,
#cs-genemod .cs-step-content .genemod-step-list + .genemod-inline-image {
  margin-top: 30px;
}
#cs-genemod .genemod-step-list li + li {
  margin-top: 10px;
}
#cs-genemod .genemod-inline-image {
  margin: 24px 0 0;
  border-radius: var(--cs-img-radius);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
}
#cs-genemod .genemod-inline-image img {
  width: 100%;
  display: block;
}


#cs-genemod .genemod-inline-image {
  max-width: 50%;
  margin: 24px auto 0;
}
#cs-genemod .genemod-inline-image-large {
  max-width: 68%;
}
@media(max-width: 768px) {
  #cs-genemod .genemod-inline-image {
    max-width: 100%;
  }
}

#cs-genemod .genemod-band {
  padding-bottom: 24px;
}
#cs-genemod .genemod-meta-row {
  margin: 0 auto 68px;
}
#cs-genemod .genemod-approach-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 24px;
  align-items: start;
  margin-bottom: 8px;
}
#cs-genemod .genemod-approach-main {
  min-width: 0;
}
#cs-genemod .genemod-step-list {
  margin: 0 0 24px 20px;
  padding: 0;
}
#cs-genemod .genemod-step-list li {
  font-size: .9rem;
  color: var(--ink2);
  line-height: 1.75;
  font-weight: 400;
}
#cs-genemod .genemod-step-list-plain li strong {
  color: var(--ink);
  font-weight: 600;
}
#cs-genemod .genemod-impact-callout {
  background: linear-gradient(180deg, rgba(61, 124, 255, .08), rgba(61, 124, 255, .03));
  border: 1px solid rgba(61, 124, 255, .18);
  border-radius: var(--radius-sm);
  padding: 18px 18px 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
  align-self: center;
}
#cs-genemod .genemod-impact-callout h5 {
  font-size: .94rem;
  line-height: 1.45;
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 10px;
}
#cs-genemod .genemod-impact-callout p {
  font-size: .9rem;
  line-height: 1.7;
  color: var(--ink2);
  margin: 0;
}
#cs-genemod .genemod-research-2img {
  max-width: 860px;
  margin: 28px auto 0;
  align-items: stretch;
}
#cs-genemod .genemod-research-2img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#cs-genemod .genemod-analytics-grid {
  max-width: 1080px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#cs-genemod .genemod-analytics-grid img,
#cs-genemod .genemod-barcode-grid img,
#cs-genemod .genemod-move-grid img,
#cs-genemod .genemod-barcode-group .genemod-inline-image img {
  object-fit: contain;
  background: #fff;
}
#cs-genemod .genemod-move-grid {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  column-gap: 18px;
}
#cs-genemod .genemod-move-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  line-height: 1;
  color: var(--g1);
  opacity: .85;
}
#cs-genemod .genemod-barcode-grid img,
#cs-genemod .genemod-move-grid img,
#cs-genemod .genemod-barcode-group .genemod-inline-image img {
  border: 0;
  border-radius: 0;
  background: transparent;
}
#cs-genemod .genemod-analytics-grid {
  align-items: center;
}
#cs-genemod .genemod-analytics-grid figure {
  width: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: var(--cs-img-radius-sm);
  border: 1px solid var(--border);
  background: #fff;
}
#cs-genemod .genemod-analytics-grid figure img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-genemod .genemod-analytics-grid figure:first-child,
#cs-genemod .genemod-analytics-grid figure:last-child {
  align-self: center;
}
#cs-genemod .genemod-analytics-grid figure:first-child img,
#cs-genemod .genemod-analytics-grid figure:last-child img {
  width: 100%;
  height: auto;
  margin-top: 0;
  margin-bottom: 0;
}
#cs-genemod .genemod-move-grid {
  max-width: 920px;
}
#cs-genemod .genemod-image-caption {
  max-width: 860px;
  margin: 16px auto 42px;
  text-align: center;
  font-size: .8rem;
  line-height: 1.6;
  color: var(--muted);
  font-style: italic;
}
#cs-genemod .genemod-barcode-compare {
  max-width: 980px;
  margin: 26px auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 1.15fr);
  gap: 18px;
  align-items: start;
  justify-items: center;
}
#cs-genemod .genemod-barcode-group {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
}
#cs-genemod .genemod-barcode-grid {
  margin: 0;
  width: min(100%, 620px);
  align-items: center;
}
#cs-genemod .genemod-barcode-group .genemod-inline-image {
  max-width: 430px;
  width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
#cs-genemod .genemod-barcode-group:last-child .genemod-inline-image {
  margin-top: 34px;
}
#cs-genemod .genemod-compare-label {
  margin-top: auto;
  padding-top: 10px;
  text-align: center;
  font-size: .8rem;
  line-height: 1.6;
  color: var(--muted);
}
#cs-genemod .genemod-barcode-group:last-child .genemod-compare-label {
  transform: none;
}
#cs-genemod .genemod-workflow-images {
  grid-template-columns: 1fr;
  max-width: 1400px;
  gap: 28px;
}
#cs-genemod .genemod-workflow-images img {
  min-height: 0;
  aspect-ratio: 16 / 4.2;
  object-fit: contain;
  background: #fff;
}
@media(max-width: 900px) {
  #cs-genemod .genemod-approach-layout {
    grid-template-columns: 1fr;
  }
  #cs-genemod .genemod-barcode-compare,
  #cs-genemod .genemod-analytics-grid {
    grid-template-columns: 1fr;
  }
}

#cs-inflerra .cs-band {
  text-align: center;
}
#cs-inflerra .inflerra-band {
  background:
    radial-gradient(circle at 50% 0%, rgba(139, 76, 199, .07), rgba(139, 76, 199, 0) 68%),
    linear-gradient(180deg, rgba(249, 246, 255, .82) 0%, rgba(252, 250, 255, .24) 44%, rgba(255, 255, 255, 0) 82%);
  padding-top: 78px;
  padding-bottom: 30px;
}
#cs-inflerra .inflerra-band-inner {
  margin-top: 12px !important;
}
#cs-inflerra .cs-sub,
#cs-inflerra .cs-meta-row {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  justify-content: center;
}
#cs-inflerra .cs-h1 {
  color: #8b4cc7 !important;
}
#cs-inflerra .cs-section-title {
  color: #8b4cc7;
}
#cs-inflerra .cs-meta-pill-label {
  color: #8b4cc7 !important;
}
#cs-inflerra .cs-meta-pill-value {
  font-weight: 400;
}
#cs-inflerra .inflerra-meta-row {
  max-width: var(--max-w);
  margin: 28px auto 24px;
  padding: 0;
}
#cs-inflerra .inflerra-hero-devices {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 10px var(--page-side) 34px;
  display: grid;
  grid-template-columns: .86fr 1.92fr .78fr;
  align-items: end;
  justify-items: center;
  gap: 28px;
}
#cs-inflerra .inflerra-device {
  margin: 0;
}
#cs-inflerra .inflerra-device img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-inflerra .inflerra-device-ipad {
  max-width: 286px;
}
#cs-inflerra .inflerra-device-desktop {
  max-width: 620px;
}
#cs-inflerra .inflerra-device-mobile {
  max-width: 196px;
}
#cs-inflerra .inflerra-key-contrib {
  margin-top: 34px;
  padding: 28px 30px;
  border-radius: var(--radius);
  border: 1px solid rgba(139, 76, 199, .12);
  background: linear-gradient(180deg, rgba(139, 76, 199, .07), rgba(180, 120, 255, .03));
}
#cs-inflerra .inflerra-key-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.08rem;
  line-height: 1.3;
  margin: 0 0 14px;
  color: var(--ink);
}
#cs-inflerra .inflerra-key-list {
  list-style: disc;
  padding-left: 22px;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 28px;
}
#cs-inflerra .inflerra-key-list li {
  font-size: .92rem;
  color: var(--ink2);
  line-height: 1.75;
  padding-left: 2px;
}
#cs-inflerra .inflerra-experience-grid {
  margin-top: 28px;
}
#cs-inflerra .inflerra-experience-card {
  border-color: rgba(200, 79, 114, .12);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-inflerra .inflerra-experience-card .cs-card-label {
  font-size: .68rem;
  letter-spacing: .16em;
  margin-bottom: 14px;
}
#cs-inflerra .inflerra-experience-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#cs-inflerra .inflerra-experience-card ul li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 8px;
  font-size: .86rem;
  color: var(--ink2);
  line-height: 1.7;
  font-weight: 400;
}
#cs-inflerra .inflerra-experience-card ul li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  color: #c84f72;
  font-size: .9rem;
  line-height: 1.7;
}
@media(max-width: 900px) {
  #cs-inflerra .inflerra-hero-devices {
    grid-template-columns: 1fr;
    gap: 18px;
    padding-top: 0;
  }
  #cs-inflerra .inflerra-device-ipad,
  #cs-inflerra .inflerra-device-desktop,
  #cs-inflerra .inflerra-device-mobile {
    max-width: min(100%, 520px);
  }
}
@media(max-width: 768px) {
  #cs-inflerra .inflerra-key-list {
    grid-template-columns: 1fr;
  }
}

#cs-aroundtown .cs-band {
  text-align: center;
}
#cs-aroundtown .aroundtown-band {
  background:
    radial-gradient(circle at 50% 0%, rgba(74, 117, 228, .08), rgba(74, 117, 228, 0) 58%),
    linear-gradient(180deg, rgba(246, 249, 255, .88) 0%, rgba(251, 253, 255, .28) 42%, rgba(255, 255, 255, 0) 82%);
  padding-top: 78px;
  padding-bottom: 30px;
}
#cs-aroundtown .aroundtown-band-inner {
  margin-top: 12px !important;
}
#cs-aroundtown .cs-sub,
#cs-aroundtown .cs-meta-row {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  justify-content: center;
}
#cs-aroundtown .cs-h1,
#cs-aroundtown .cs-meta-pill-label {
  color: #2365ca !important;
}
#cs-aroundtown .cs-section-title {
  color: #2365ca;
}
#cs-aroundtown .cs-meta-pill-value {
  font-weight: 400;
}
#cs-aroundtown .aroundtown-meta-row {
  max-width: var(--max-w);
  margin: 28px auto 24px;
  padding: 0;
}
#cs-aroundtown .aroundtown-hero-gallery {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 780px;
  margin: 0 auto 0;
  align-items: end;
  gap: 0;
  padding: 0;
  overflow: visible;
  transform: scale(.89);
  transform-origin: center top;
}
#cs-aroundtown .cs-body {
  padding-top: 12px;
}
#cs-aroundtown .aroundtown-hero-gallery .aroundtown-gallery-item {
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
#cs-aroundtown .aroundtown-device {
  margin: 0;
}
#cs-aroundtown .aroundtown-hero-gallery img,
#cs-aroundtown .aroundtown-device img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
  box-shadow: 0 18px 44px rgba(35, 101, 202, .12);
}
#cs-aroundtown .aroundtown-hero-card {
  position: relative;
  transition: transform .25s ease;
}
#cs-aroundtown .aroundtown-hero-card-left,
#cs-aroundtown .aroundtown-hero-card-right {
  transform: scale(.75);
  z-index: 1;
}
#cs-aroundtown .aroundtown-hero-card-left {
  transform-origin: right center;
  margin-right: -108px;
}
#cs-aroundtown .aroundtown-hero-card-center {
  z-index: 3;
  transform: scale(.9);
  margin-left: -48px;
  margin-right: -48px;
}
#cs-aroundtown .aroundtown-hero-card-right {
  transform-origin: left center;
  margin-left: -108px;
}
#cs-aroundtown .aroundtown-device-left {
  max-width: 196px;
}
#cs-aroundtown .aroundtown-device-center {
  max-width: 664px;
}
#cs-aroundtown .aroundtown-device-right {
  max-width: 124px;
}
#cs-aroundtown .aroundtown-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
#cs-aroundtown .aroundtown-stat-card {
  background: white;
  border: 1px solid rgba(35, 101, 202, .12);
  border-radius: var(--radius-sm);
  padding: 20px;
  text-align: center;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
}
#cs-aroundtown .aroundtown-stat-card .n {
  font-family: 'Playfair Display', serif;
  font-size: 1.8rem;
  font-weight: 800;
  color: #2365ca;
}
#cs-aroundtown .aroundtown-stat-card .l {
  font-size: .72rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 4px;
}
#cs-aroundtown .aroundtown-goal-card,
#cs-aroundtown .aroundtown-feature-card {
  border-color: rgba(35, 101, 202, .12);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-aroundtown .aroundtown-goal-card {
  margin-top: 24px;
  padding: 22px 24px;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(35, 101, 202, .05), rgba(165, 201, 255, .06));
  border: 1px solid rgba(35, 101, 202, .12);
}
#cs-aroundtown .aroundtown-goal-card .cs-card-label,
#cs-aroundtown .aroundtown-feature-card .cs-card-label {
  font-size: .68rem;
  letter-spacing: .16em;
  margin-bottom: 12px;
}
#cs-aroundtown .aroundtown-goal-card p {
  margin: 0;
  font-size: .9rem;
  color: var(--ink2);
  line-height: 1.75;
}
#cs-aroundtown .aroundtown-font-card {
  margin-top: 18px;
  padding: 20px 22px;
  border-radius: var(--radius);
  border: 1px solid rgba(35, 101, 202, .12);
  background: linear-gradient(180deg, rgba(35, 101, 202, .04), rgba(165, 201, 255, .05));
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-aroundtown .aroundtown-font-card .cs-card-label {
  font-size: .68rem;
  letter-spacing: .16em;
  margin-bottom: 14px;
}
#cs-aroundtown .aroundtown-font-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
#cs-aroundtown .aroundtown-font-list span {
  padding: 8px 12px;
  border-radius: 999px;
  background: white;
  border: 1px solid rgba(35, 101, 202, .12);
  color: var(--ink2);
  font-size: .9rem;
  line-height: 1.6;
  font-family: 'Open Sans', sans-serif;
}
#cs-aroundtown .aroundtown-font-list span:nth-child(1) {
  font-weight: 300;
}
#cs-aroundtown .aroundtown-font-list span:nth-child(2) {
  font-weight: 400;
}
#cs-aroundtown .aroundtown-font-list span:nth-child(3) {
  font-weight: 600;
}
#cs-aroundtown .aroundtown-font-list span:nth-child(4) {
  font-weight: 700;
}
#cs-aroundtown .aroundtown-gallery {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}
#cs-aroundtown .aroundtown-gallery-lowfi {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 100%;
  justify-content: start;
}
#cs-aroundtown .aroundtown-gallery-hifi {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 820px;
  margin-left: 0;
  margin-right: 0;
}
#cs-aroundtown .aroundtown-gallery-hifi-group {
  grid-template-columns: repeat(auto-fit, minmax(148px, 148px));
  max-width: 640px;
  margin-top: 16px;
  margin-bottom: 26px;
  margin-left: 0;
  margin-right: 0;
  justify-content: start;
}
#cs-aroundtown .aroundtown-gallery-hifi-2up {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 340px;
}
#cs-aroundtown .aroundtown-hifi-row {
  display: grid;
  grid-template-columns: minmax(0, 312px) minmax(0, 476px);
  gap: 28px;
  align-items: start;
  justify-content: start;
}
#cs-aroundtown .aroundtown-hifi-col {
  min-width: 0;
}
#cs-aroundtown .aroundtown-hifi-col-onboard .aroundtown-gallery-hifi-group {
  grid-template-columns: repeat(2, minmax(0, 148px));
  max-width: 310px;
}
#cs-aroundtown .aroundtown-hifi-row-paired {
  grid-template-columns: repeat(2, minmax(0, 476px));
}
#cs-aroundtown .aroundtown-gallery-item {
  margin: 0;
  border-radius: var(--cs-img-radius);
  overflow: hidden;
  border: 1px solid rgba(35, 101, 202, .1);
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-aroundtown .aroundtown-gallery-item img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-aroundtown .aroundtown-gallery-hifi .aroundtown-gallery-item {
  border: 0;
  background: transparent;
  box-shadow: none;
}
#cs-aroundtown .aroundtown-video-wrap {
  width: min(100%, 700px);
  margin: 44px auto 0;
  border-radius: var(--cs-img-radius);
  overflow: hidden;
  display: block;
  background: #000;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .08);
}
#cs-aroundtown .aroundtown-video-section {
  padding-top: 24px;
}
#cs-aroundtown .aroundtown-video-wrap img {
  width: 100%;
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: cover;
}
#cs-aroundtown .aroundtown-video-note {
  max-width: 820px;
  margin: 14px auto 0;
  text-align: center;
  font-size: .9rem;
  line-height: 1.7;
  color: var(--muted);
}
#cs-aroundtown .aroundtown-video-note a {
  color: #2365ca;
  text-decoration: none;
  font-weight: 500;
}
#cs-aroundtown .aroundtown-video-note a:hover {
  text-decoration: underline;
}
@media(max-width: 900px) {
  #cs-aroundtown .aroundtown-hero-gallery {
    max-width: 560px;
    padding: 0;
    transform: scale(.96);
  }
  #cs-aroundtown .aroundtown-hifi-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  #cs-aroundtown .aroundtown-hifi-col-onboard .aroundtown-gallery-hifi-group {
    grid-template-columns: repeat(2, minmax(0, 148px));
    max-width: 310px;
  }
  #cs-aroundtown .aroundtown-hifi-row-paired {
    grid-template-columns: 1fr;
  }
  #cs-aroundtown .aroundtown-hero-gallery,
  #cs-aroundtown .aroundtown-gallery-hifi,
  #cs-aroundtown .aroundtown-gallery-hifi-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #cs-aroundtown .aroundtown-hifi-col-onboard .aroundtown-gallery-hifi-group {
    grid-template-columns: repeat(2, minmax(0, 148px));
  }
}
@media(max-width: 768px) {
  #cs-aroundtown .aroundtown-hero-gallery {
    gap: 10px;
    padding: 0;
    transform: none;
  }
  #cs-aroundtown .aroundtown-hero-card-left,
  #cs-aroundtown .aroundtown-hero-card-right {
    transform: none;
    margin: 0;
  }
  #cs-aroundtown .aroundtown-hero-card-center {
    transform: none;
    margin: 0;
  }
  #cs-aroundtown .aroundtown-stat-row,
  #cs-aroundtown .aroundtown-hero-gallery,
  #cs-aroundtown .aroundtown-gallery-lowfi,
  #cs-aroundtown .aroundtown-gallery-hifi,
  #cs-aroundtown .aroundtown-gallery-hifi-group,
  #cs-aroundtown .aroundtown-gallery-hifi-2up {
    grid-template-columns: 1fr;
  }
}

#cs-alumnify .cs-band {
  background:
    radial-gradient(circle at 50% 0%, rgba(230, 126, 34, .08), rgba(230, 126, 34, 0) 58%),
    linear-gradient(180deg, rgba(255, 248, 242, .88) 0%, rgba(255, 252, 248, .28) 42%, rgba(255, 255, 255, 0) 82%) !important;
}
#cs-alumnify .cs-band {
  text-align: center;
}
#cs-alumnify .alumnify-band {
  padding-top: 78px;
  padding-bottom: 30px;
}
#cs-alumnify .alumnify-band-inner {
  margin-top: 12px !important;
}
#cs-alumnify .cs-sub,
#cs-alumnify .cs-meta-row {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  justify-content: center;
}
#cs-alumnify .cs-h1,
#cs-alumnify .cs-meta-pill-label {
  color: #e67e22 !important;
}
#cs-alumnify .cs-section-title {
  color: #e67e22;
}
#cs-alumnify .cs-meta-pill-value {
  font-weight: 400;
}
#cs-alumnify .alumnify-meta-row {
  max-width: var(--max-w);
  margin: 28px auto 24px;
  padding: 0;
}

#cs-genemod .cs-meta-pill,
#cs-inflerra .cs-meta-pill,
#cs-aroundtown .cs-meta-pill,
#cs-alumnify .cs-meta-pill {
  text-align: left;
}

#cs-genemod .cs-meta-pill-label,
#cs-inflerra .cs-meta-pill-label,
#cs-aroundtown .cs-meta-pill-label,
#cs-alumnify .cs-meta-pill-label,
#cs-genemod .cs-meta-pill-value,
#cs-inflerra .cs-meta-pill-value,
#cs-aroundtown .cs-meta-pill-value,
#cs-alumnify .cs-meta-pill-value {
  text-align: left;
}
#cs-alumnify .alumnify-hero-media {
  max-width: 760px;
  margin: 0 auto;
  padding: 8px var(--page-side) 34px;
  display: flex;
  justify-content: center;
}
#cs-alumnify .alumnify-hero-panel {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 0;
  background: transparent;
  box-shadow: none;
}
#cs-alumnify .alumnify-hero-panel img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-alumnify .alumnify-hero-panel-center {
  max-width: 620px;
}
#cs-alumnify .alumnify-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
#cs-alumnify .alumnify-stat-card {
  background: #fff;
  border: 1px solid rgba(123, 63, 201, .12);
  border-radius: var(--radius-sm);
  padding: 20px;
  text-align: center;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
}
#cs-alumnify .alumnify-stat-card .n {
  font-family: 'Playfair Display', serif;
  font-size: 1.8rem;
  font-weight: 800;
  color: #e67e22;
}
#cs-alumnify .alumnify-stat-card .l {
  font-size: .72rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 4px;
}
#cs-alumnify .alumnify-goal-card,
#cs-alumnify .alumnify-stage-card,
#cs-alumnify .alumnify-stakeholder-card,
#cs-alumnify .alumnify-feature-card,
#cs-alumnify .alumnify-highlight-card {
  border-color: rgba(123, 63, 201, .12);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-alumnify .alumnify-goal-card {
  margin-top: 24px;
  padding: 22px 24px;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(123, 63, 201, .06), rgba(205, 188, 255, .08));
  border: 1px solid rgba(123, 63, 201, .12);
}
#cs-alumnify .alumnify-goal-card .cs-card-label,
#cs-alumnify .alumnify-stage-card .cs-card-label,
#cs-alumnify .alumnify-stakeholder-card .cs-card-label,
#cs-alumnify .alumnify-feature-card .cs-card-label,
#cs-alumnify .alumnify-highlight-card .cs-card-label {
  color: #7b3fc9;
  font-size: .68rem;
  letter-spacing: .16em;
  margin-bottom: 12px;
}
#cs-alumnify .alumnify-goal-card p {
  margin: 0;
  font-size: .9rem;
  color: var(--ink2);
  line-height: 1.75;
}
#cs-alumnify .alumnify-stage-grid,
#cs-alumnify .alumnify-stakeholder-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
}
#cs-alumnify .alumnify-ideation-grid,
#cs-alumnify .alumnify-feature-grid {
  margin-top: 24px;
  align-items: stretch;
}
#cs-alumnify .alumnify-highlight-card {
  padding: 22px 24px;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(123, 63, 201, .04), rgba(205, 188, 255, .05));
}
#cs-alumnify .alumnify-tight-list {
  margin: 0;
}
#cs-alumnify .alumnify-inline-image {
  margin: 0;
  border-radius: var(--cs-img-radius);
  overflow: hidden;
  border: 1px solid rgba(123, 63, 201, .1);
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
#cs-alumnify .alumnify-inline-image img {
  width: 100%;
  height: auto;
  display: block;
}
#cs-alumnify .alumnify-inline-image-wide {
  max-width: 1040px;
  margin: 24px auto 0;
}
#cs-alumnify .alumnify-inline-image-feature {
  max-width: 760px;
}
#cs-alumnify .alumnify-inline-image-desktop {
  max-width: 720px;
  margin: 26px auto 0;
}
#cs-alumnify .alumnify-annotation-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 24px;
}
#cs-alumnify .alumnify-annotation-image {
  margin: 0;
  border-radius: 8px;
}
#cs-alumnify .alumnify-workflow-carousel {
  position: relative;
  margin-top: 24px;
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}
#cs-alumnify .alumnify-carousel-stage {
  position: relative;
  min-height: 460px;
  padding: 0 56px;
}
#cs-alumnify .alumnify-workflow-slide {
  position: absolute;
  inset: 0 56px;
  margin: 0;
  border-radius: var(--cs-img-radius);
  overflow: hidden;
  border: 1px solid rgba(230, 126, 34, .1);
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease;
}
#cs-alumnify .alumnify-workflow-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}
#cs-alumnify .alumnify-workflow-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: #fff;
}
#cs-alumnify .alumnify-carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(230, 126, 34, .1);
  background: rgba(255, 255, 255, .76);
  color: rgba(230, 126, 34, .72);
  font-size: .92rem;
  line-height: 1;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .04);
  backdrop-filter: blur(8px);
}
#cs-alumnify .alumnify-carousel-btn-prev {
  left: 0;
}
#cs-alumnify .alumnify-carousel-btn-next {
  right: 0;
}
#cs-alumnify .alumnify-carousel-btn:hover {
  background: rgba(255, 247, 239, .9);
  color: #e67e22;
}
@media(max-width: 960px) {
  #cs-alumnify .alumnify-stage-grid,
  #cs-alumnify .alumnify-stakeholder-grid,
  #cs-alumnify .alumnify-annotation-grid {
    grid-template-columns: 1fr;
  }
  #cs-alumnify .alumnify-hero-panel-center {
    max-width: min(100%, 620px);
  }
  #cs-alumnify .alumnify-carousel-stage {
    min-height: 360px;
  }
}
@media(max-width: 768px) {
  #cs-alumnify .alumnify-stat-row,
  #cs-alumnify .alumnify-ideation-grid,
  #cs-alumnify .alumnify-feature-grid {
    grid-template-columns: 1fr;
  }
  #cs-alumnify .alumnify-carousel-stage {
    min-height: 250px;
    padding: 0 44px;
  }
  #cs-alumnify .alumnify-workflow-slide {
    inset: 0 44px;
  }
  #cs-alumnify .alumnify-carousel-btn {
    width: 32px;
    height: 32px;
    font-size: .82rem;
  }
}