/* ===================================================
   WarpDrive — Design System v2
   Brand: WarpDrive Tech (warpdrivetech.in)
   Style: productive.io-inspired, clean & spacious
   Font: Rubik · Colors: #00B050 green palette
   =================================================== */


/* --- Reset & Base --------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
/* Clip any decorative overflow without creating a scroll container (preserves position:sticky) */
body { overflow-x: clip; }
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }

/* --- CSS Custom Properties ------------------------ */
:root {
  /* Brand — WarpDrive green palette */
  --wd-green:        #00B050;
  --wd-green-dark:   #008040;
  --wd-green-mid:    #20B864;
  --wd-green-light:  #5CDBA0;
  --wd-green-tint:   #F0F7F3;
  --wd-tint:         #F0F7F3;

  /* Neutrals — cool near-black for premium feel */
  --wd-dark:         #0E1117;
  --wd-body:         #22272E;
  --wd-mid:          #52596A;
  --wd-muted:        #8B93A6;
  --wd-border:       #E4E7EF;
  --wd-off-white:    #F7F8FC;
  --wd-white:        #FFFFFF;

  /* Accents */
  --wd-accent-blue:  #5A6FFF;
  --wd-accent-purple:#8B5CF6;
  --wd-sky:          #0EA5E9;
  --wd-amber:        #F59E0B;

  /* Gradients */
  --wd-gradient:       linear-gradient(135deg, #008040 0%, #00B050 100%);
  --wd-gradient-dark:  linear-gradient(160deg, #05060D 0%, #0D0F1A 60%, #080C14 100%);
  --wd-gradient-hero:  linear-gradient(160deg, #03040A 0%, #07091A 45%, #0A0B16 100%);

  /* Shape */
  --wd-radius-sm:  6px;
  --wd-radius:     12px;
  --wd-radius-lg:  20px;
  --wd-radius-xl:  32px;
  --wd-radius-full: 999px;

  /* Shadow */
  --wd-shadow-xs:  0 1px 2px rgba(0,0,0,.06);
  --wd-shadow-sm:  0 2px 8px rgba(0,0,0,.08);
  --wd-shadow:     0 4px 24px rgba(0,0,0,.10);
  --wd-shadow-lg:  0 12px 48px rgba(0,0,0,.14);
  --wd-shadow-xl:  0 24px 80px rgba(0,0,0,.20);
  --wd-shadow-green: 0 8px 36px rgba(0,176,80,.22);
  --wd-shadow-card: 0 2px 12px rgba(14,17,23,.07), 0 12px 40px rgba(14,17,23,.07);

  /* Layout */
  --wd-container: 1200px;
  --wd-content:   760px;
  --wd-gap:       clamp(1.5rem, 4vw, 3rem);
}

/* --- Typography ----------------------------------- */
body {
  font-family: 'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--wd-body);
  line-height: 1.65;
  background: #FFFFFF;
  font-size: 16px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Rubik', sans-serif;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--wd-dark);
  text-wrap: balance;
}

h1 { font-size: clamp(2.6rem, 5.8vw, 4.2rem); font-weight: 800; }
h2 { font-size: clamp(1.9rem, 3.2vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.1rem, 1.8vw, 1.4rem); font-weight: 600; }

p { line-height: 1.75; color: var(--wd-mid); }

.eyebrow,
.wd-eyebrow,
.wd-eyebrow-purple {
  display: none !important;
}

/* --- Layout helpers ------------------------------- */
.wd-container {
  width: 100%;
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.wd-content { max-width: var(--wd-content); margin-inline: auto; }

section { padding-block: 0; }

/* ============================================================
   HEADER
   ============================================================ */
/* Sticky header — applied to both the WP template-part wrapper and our element
   so the header sticks regardless of which ancestor becomes the scroll context */
.wp-site-blocks > .wp-block-template-part:first-child {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 100;
}
.wd-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(245,251,247,0.90);
  backdrop-filter: saturate(180%) blur(22px);
  -webkit-backdrop-filter: saturate(180%) blur(22px);
  border-bottom: 1px solid rgba(0,0,0,0.055);
  transition: box-shadow 0.3s, background 0.3s;
}

/* Opkey-style gradient accent line at the very top of the header */
.wd-header::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #00C853 0%, #00A847 35%, #38ECA0 65%, #00B050 100%);
  background-size: 200% auto;
  animation: wd-topbar-shimmer 5s linear infinite;
  z-index: 1;
}

@keyframes wd-topbar-shimmer {
  0%   { background-position: 0% center; }
  100% { background-position: 200% center; }
}

.wd-header.scrolled {
  background: rgba(245,251,247,0.97);
  box-shadow: 0 4px 28px rgba(0,0,0,0.07);
  border-bottom-color: rgba(0,0,0,0.06);
}

.wd-header-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  height: 72px;
  gap: 1.5rem;
}

/* Logo */
.wd-logo {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 800;
  font-size: 1.18rem;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  flex-shrink: 0;
  align-self: center;
}
.wd-logo-mark {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wd-logo-mark img { width: 30px; height: auto; display: block; }
.wd-logo-text { color: var(--wd-dark); }
.wd-logo-text span { color: var(--wd-green); }

/* Animated tab nav */
.wd-nav-wrap {
  display: flex;
  align-items: stretch;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  height: 100%;
}
.wd-nav {
  display: flex;
  list-style: none;
  gap: 0;
  align-items: stretch;
  position: relative;
  height: 100%;
}
/* Sliding underline indicator — injected by JS */
.wd-nav-indicator {
  position: absolute;
  bottom: 0;
  height: 2px;
  background: var(--wd-green);
  border-radius: 2px 2px 0 0;
  pointer-events: none;
  left: 0;
  width: 0;
  opacity: 0;
  transition: left 0.28s cubic-bezier(0.4,0,0.2,1),
              width 0.28s cubic-bezier(0.4,0,0.2,1),
              opacity 0.18s;
}
/* Sliding hover background — injected by JS */
.wd-nav-hover-bg {
  position: absolute;
  background: rgba(0,194,90,0.09);
  border-radius: 8px;
  pointer-events: none;
  opacity: 0;
  z-index: 0;
  transition: left 0.28s cubic-bezier(0.4,0,0.2,1),
              width 0.28s cubic-bezier(0.4,0,0.2,1),
              top 0.28s cubic-bezier(0.4,0,0.2,1),
              height 0.28s cubic-bezier(0.4,0,0.2,1),
              opacity 0.18s;
}
.wd-nav > li {
  position: relative;
  display: flex;
  align-items: center;
}
.wd-nav > li > a {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 1rem;
  height: 100%;
  font-size: 0.845rem;
  font-weight: 500;
  color: var(--wd-muted);
  border-radius: 0;
  transition: color 0.2s;
  white-space: nowrap;
  letter-spacing: -0.005em;
  text-decoration: none;
  position: relative;
  z-index: 1;
}
.wd-nav > li > a:hover { color: var(--wd-dark); background: transparent; }
.wd-nav > li > a.wd-nav-active { color: var(--wd-green); font-weight: 600; }
.wd-nav > li.menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 6px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='currentColor' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='currentColor' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform 0.2s;
  opacity: 0.5;
}
.wd-nav > li:hover > a::after { transform: rotate(180deg); opacity: 1; }

/* Premium dropdown */
.sub-menu {
  position: absolute;
  top: calc(100% + 10px);
  left: -8px;
  background: #fff;
  border: none;
  border-radius: 18px;
  padding: 8px;
  min-width: 290px;
  box-shadow: 0 24px 64px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.06);
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px) scale(0.98);
  transform-origin: top left;
  transition: opacity 0.2s, visibility 0.2s, transform 0.2s;
}
.wd-nav > li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.sub-menu-link {
  display: flex !important;
  align-items: center;
  gap: 0.75rem;
  padding: 0.6rem 0.65rem !important;
  border-radius: 12px !important;
  transition: background 0.15s !important;
}
.sub-menu-link:hover { background: var(--wd-off-white) !important; color: var(--wd-dark) !important; }
.sub-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.25);
}
.sub-text { display: flex; flex-direction: column; gap: 1px; }
.sub-text strong { display: block; font-size: 0.82rem; font-weight: 600; color: var(--wd-dark); line-height: 1.3; }
.sub-text em { display: block; font-size: 0.72rem; color: var(--wd-muted); font-style: normal; line-height: 1.3; }
.sub-menu li a:not(.sub-menu-link) {
  display: block;
  padding: 0.55rem 0.85rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--wd-body);
  border-radius: 8px;
  transition: background 0.15s, color 0.15s;
}
.sub-menu li a:not(.sub-menu-link):hover { background: var(--wd-green-tint); color: var(--wd-green); }

/* Header CTA */
.wd-header-cta {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-shrink: 0;
  align-self: center;
}
.wd-btn-nav-ghost {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1.2rem;
  font-family: 'Rubik', sans-serif;
  font-size: 0.845rem;
  font-weight: 600;
  color: var(--wd-dark);
  border-radius: 999px;
  border: 1.5px solid rgba(14,17,23,0.18);
  background: #fff;
  transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
  letter-spacing: -0.01em;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.wd-btn-nav-ghost:hover {
  background: var(--wd-dark);
  color: #fff;
  border-color: var(--wd-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,0.14);
}

/* Always Hiring nav item — pill with pulsing dot */
.wd-nav > li.wd-nav-hiring { margin-left: 0.5rem; }
.wd-nav > li.wd-nav-hiring > a {
  height: auto !important;
  align-self: center;
  display: inline-flex !important;
  align-items: center;
  gap: 0.4rem;
  padding: 0.38rem 0.9rem 0.38rem 0.7rem !important;
  border-radius: 999px;
  border: none;
  background: rgba(0,176,80,0.08);
  color: #006830 !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  transition: background 0.18s, border-color 0.18s, color 0.18s;
}
.wd-nav > li.wd-nav-hiring > a:hover {
  background: rgba(0,176,80,0.16) !important;
  color: #004d22 !important;
}
.wd-hiring-dot {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #00B050;
  flex-shrink: 0;
  animation: wd-hiring-pulse 2s ease-in-out infinite;
}
@keyframes wd-hiring-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,176,80,0.7); }
  60%       { box-shadow: 0 0 0 5px rgba(0,176,80,0); }
}

/* Mobile menu toggle */
.wd-menu-toggle {
  display: none;
  background: none;
  border: 1px solid rgba(0,0,0,0.1);
  cursor: pointer;
  padding: 0.45rem;
  color: var(--wd-dark);
  border-radius: 10px;
  transition: background 0.15s;
}
.wd-menu-toggle:hover { background: var(--wd-off-white); }

/* ============================================================
   BUTTONS
   ============================================================ */
.wd-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.72rem 1.55rem;
  font-family: 'Rubik', sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 999px;
  border: 2px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.18s ease;
  white-space: nowrap;
  line-height: 1;
  letter-spacing: -0.01em;
}
.wd-btn svg { width: 16px; height: 16px; flex-shrink: 0; }

/* Primary — solid flat green, Opkey-style */
.wd-btn-primary {
  background: #00A847;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 12px rgba(0,168,71,.28);
}
.wd-btn-primary:hover {
  background: #009140;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(0,168,71,.38);
  color: #fff;
}

/* Secondary — outline green */
.wd-btn-secondary {
  background: transparent;
  color: #007A38;
  border-color: rgba(0,168,71,0.38);
}
.wd-btn-secondary:hover {
  background: #00A847;
  color: #fff;
  border-color: #00A847;
}

/* White card button */
.wd-btn-white {
  background: #fff;
  color: var(--wd-dark);
  border-color: var(--wd-border);
  box-shadow: var(--wd-shadow-card);
}
.wd-btn-white:hover {
  background: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(0,0,0,0.10);
  border-color: rgba(14,17,23,0.12);
}

/* Ghost white */
.wd-btn-ghost-white {
  background: transparent;
  color: var(--wd-dark);
  border-color: rgba(14,17,23,0.18);
}
.wd-btn-ghost-white:hover {
  background: rgba(14,17,23,0.05);
  color: var(--wd-dark);
  border-color: rgba(14,17,23,0.30);
  transform: translateY(-1px);
}

/* Outline dark — Opkey "Explore Platform" style */
.wd-btn-outline-dark {
  background: #fff;
  color: var(--wd-dark);
  border-color: rgba(14,17,23,0.18);
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.wd-btn-outline-dark:hover {
  background: var(--wd-dark);
  color: #fff;
  border-color: var(--wd-dark);
  transform: translateY(-1px);
}

.wd-btn-lg { padding: 0.82rem 1.9rem; font-size: 0.94rem; }
.wd-btn-sm { padding: 0.5rem 1.1rem; font-size: 0.8rem; }

/* ============================================================
   HERO SECTION
   ============================================================ */
.wd-hero {
  background: #F1FFF6;
  position: relative;
  overflow: hidden;
  padding-block: clamp(5rem, 10vw, 8rem);
}

.wd-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.wd-hero::after {
  display: none;
}

.wd-hero-inner {
  position: relative;
  z-index: 1;
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3rem;
  align-items: center;
}

/* ── Salesforce Summit Partner badge ────────────── */
.wd-sf-partner-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 1.25rem;
  padding: 0.4rem 1.1rem 0.4rem 0.65rem;
  border: 1px solid rgba(0,112,210,0.2);
  border-radius: 999px;
  background: rgba(0,112,210,0.04);
  backdrop-filter: blur(4px);
}

.wd-sf-badge-logo {
  height: 24px;
  width: auto;
  display: block;
}

.wd-sf-badge-divider {
  display: block;
  width: 1px;
  height: 16px;
  background: rgba(0,112,210,0.25);
  flex-shrink: 0;
}

.wd-sf-badge-tier {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: #0070D2;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(0.85); }
}

.wd-hero h1 {
  color: var(--wd-dark);
  font-size: clamp(2.6rem, 5.5vw, 4.2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.08;
  margin-bottom: 1.5rem;
}
.wd-hero h1 em {
  font-style: normal;
  color: var(--wd-green);
}
.wd-hero h1 .highlight {
  background: linear-gradient(90deg, #00B050 0%, #5CDBA0 30%, #38ECA0 60%, #00B050 100%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: wd-h1-shimmer 4s linear infinite;
  display: inline-block;
}
@keyframes wd-h1-shimmer {
  0%   { background-position: 0% center; }
  100% { background-position: 300% center; }
}
.wd-num-accent {
  background: linear-gradient(120deg, #008040 0%, #00B050 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-size: 1.12em;
  letter-spacing: -0.04em;
}

.wd-hero-sub {
  font-size: 0.95rem;
  color: var(--wd-mid);
  max-width: 560px;
  line-height: 1.55;
  margin-bottom: 1.25rem;
}
.wd-hero-sub strong {
  color: #00A847;
  font-weight: 700;
}

/* Green accent utility — highlights key words in section headings */
.wd-text-green {
  color: #00A847;
}

.wd-hero-ctas {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.wd-hero-stats {
  display: flex;
  gap: 2.5rem;
  flex-wrap: wrap;
  margin-top: 3.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--wd-border);
}
.wd-hero-stat-num {
  font-size: 2rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 0.3rem;
}
.wd-hero-stat-label {
  font-size: 0.78rem;
  color: var(--wd-muted);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* Hero card */
.wd-hero-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--wd-radius-lg);
  padding: 1.75rem;
  min-width: 300px;
  max-width: 340px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.wd-hero-card-title {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(255,255,255,0.4);
  margin-bottom: 1.25rem;
}
.wd-hero-persona {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  padding: 0.75rem;
  border-radius: 10px;
  transition: background 0.2s;
  cursor: default;
}
.wd-hero-persona:hover, .wd-hero-persona.active {
  background: rgba(0,176,80,0.12);
}
.wd-hero-persona-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.wd-hero-persona-name {
  font-size: 0.8rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.2rem;
}
.wd-hero-persona-desc {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
}
.wd-hero-divider {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.07);
  margin: 0.5rem 0;
}

/* ============================================================
   HERO — CENTERED LAYOUT
   ============================================================ */
.wd-hero-center {
  position: relative;
  padding-block: 2.5rem 3rem;
  display: flex;
  align-items: flex-start;
  overflow: hidden;
}

/* ── Grid + glow background — hero ─────────────── */
.wd-aurora-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

/* Static grid lines */
.wd-aurora-layer {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right,  rgba(71,85,105,0.09) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(71,85,105,0.09) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Animated green radial glow — separate layer so it pulses without touching the grid */
.wd-aurora-layer::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 50% 44%,
    rgba(0,176,80,0.18)  0%,
    rgba(0,168,71,0.09) 42%,
    transparent         72%
  );
  animation: wd-glow-pulse 7s ease-in-out infinite;
  will-change: opacity, transform;
}

@keyframes wd-glow-pulse {
  0%,  100% { opacity: 0.65; transform: scale(1);    }
  50%        { opacity: 1;    transform: scale(1.10); }
}

.wd-hero-center-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.wd-hero-center .wd-sf-partner-badge {
  margin-inline: auto;
}

.wd-hero-sf-badge {
  display: flex;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.wd-hero-sf-badge img {
  width: 88px;
  height: auto;
  border-radius: 12px;
  display: block;
}

/* ── Summit Partner sticky badge ─────────────────────────── */
.wd-sf-sticky-badge {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 90;
  width: 80px;
  opacity: 0;
  pointer-events: none;
}
/* is-visible used on non-homepage pages (no GSAP scrub) */
.wd-sf-sticky-badge.is-visible {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.4s ease;
}
.wd-sf-sticky-badge img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  filter: drop-shadow(0 6px 20px rgba(0, 43, 92, 0.22));
  transition: transform 0.2s ease, filter 0.2s ease;
}
.wd-sf-sticky-badge:hover img {
  transform: scale(1.06);
  filter: drop-shadow(0 8px 28px rgba(0, 43, 92, 0.32));
}

/* Spring drag SVG overlay */
.wd-spring-svg {
  display: none;
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 89;
}

.wd-hero-center h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  text-align: center;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 1rem;
  max-width: 100%;
}
.wd-hero-center h1 em {
  font-style: normal;
  background: linear-gradient(90deg, #00B050 0%, #5CDBA0 30%, #38ECA0 60%, #00B050 100%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: wd-h1-shimmer 4s linear infinite;
  display: inline;
  will-change: background-position;
}

.wd-hero-center .wd-hero-sub {
  font-size: 0.97rem;
  max-width: 640px;
  text-align: center;
  margin-inline: auto;
  margin-bottom: 1.5rem;
}

.wd-hero-center .wd-hero-ctas {
  justify-content: center;
  margin-bottom: 2rem;
}

.wd-hero-center .wd-hero-photo-metrics {
  margin-inline: auto;
  max-width: 900px;
}


/* ── Variable-weight breathing animation ────── */
.wd-anm-char {
  display: inline;
}
@keyframes wd-breath {
  from { font-variation-settings: "wght" 300; }
  to   { font-variation-settings: "wght" 900; }
}


/* Responsive */
@media (max-width: 768px) {
  .wd-hero-center { padding-block: 2rem 1.5rem; }
  .wd-hero-center h1 { font-size: clamp(0.9rem, 3.5vw, 1.1rem); line-height: 1.6; }
  .wd-hero-center .wd-hero-sub { font-size: 0.88rem; }
  .wd-hero-center .wd-hero-ctas { margin-bottom: 1.5rem; }
}

/* --- legacy/unused (kept for CSS class completeness) --- */
.wd-ui-glow {
  position: absolute;
  inset: -15%;
  background: radial-gradient(ellipse 80% 60% at 50% 55%, rgba(0,176,80,0.12) 0%, rgba(90,111,255,0.07) 50%, transparent 70%);
  filter: blur(40px);
  pointer-events: none;
  z-index: 0;
}

/* ── Dashboard Browser Mockup ─────────────── */
.wd-dash-browser {
  position: relative;
  z-index: 1;
  background: rgba(6,8,18,0.97);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  overflow: hidden;
  box-shadow:
    0 0 0 1px rgba(0,176,80,0.08),
    0 30px 80px rgba(0,0,0,0.65),
    0 0 100px rgba(90,111,255,0.08);
}
.wd-dash-tilted {
  transform: perspective(1100px) rotateY(-10deg) rotateX(4deg);
  transform-origin: left center;
  transition: transform 0.55s cubic-bezier(0.22,1,0.36,1);
}
.wd-dash-tilted:hover {
  transform: perspective(1100px) rotateY(-4deg) rotateX(1.5deg);
}

/* Chrome bar */
.wd-dash-chrome {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.55rem 0.9rem;
  background: rgba(0,0,0,0.35);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.wd-dash-dots { display: flex; gap: 5px; }
.wd-dash-dots span { width: 9px; height: 9px; border-radius: 50%; }
.wd-dash-dots span:nth-child(1) { background: #ff5f57; }
.wd-dash-dots span:nth-child(2) { background: #ffbd2e; }
.wd-dash-dots span:nth-child(3) { background: #28c840; }
.wd-dash-urlbar {
  flex: 1;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 5px;
  padding: 0.2rem 0.65rem;
  font-size: 0.68rem;
  color: rgba(255,255,255,0.4);
  display: flex; align-items: center; gap: 0.35rem;
}
.wd-dash-live-badge {
  display: flex; align-items: center; gap: 4px;
  font-size: 0.64rem; font-weight: 600; color: #5CDBA0;
  background: rgba(0,176,80,0.15);
  border: 1px solid rgba(0,176,80,0.3);
  padding: 0.18rem 0.55rem; border-radius: 999px;
}
.wd-dash-live-badge .dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: #5CDBA0; animation: pulse 1.5s infinite;
}

/* App layout */
.wd-dash-app   { display: flex; height: 370px; }
.wd-dash-sidebar {
  width: 50px;
  background: rgba(0,0,0,0.22);
  border-right: 1px solid rgba(255,255,255,0.05);
  display: flex; flex-direction: column;
  align-items: center; padding: 0.8rem 0; gap: 0.4rem;
  flex-shrink: 0;
}
.wd-dash-sf-icon { color: #00B050; margin-bottom: 0.4rem; }
.wd-dash-sidenav { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.wd-dash-sn-item {
  width: 34px; height: 32px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.25);
}
.wd-dash-sn-item.wd-active {
  background: rgba(0,176,80,0.18); color: #5CDBA0;
}
.wd-dash-user-dot {
  width: 24px; height: 24px; border-radius: 50%;
  background: linear-gradient(135deg,#00B050,#5CDBA0);
  margin-top: auto; flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(0,176,80,0.3);
}

/* Main panel */
.wd-dash-main-panel {
  flex: 1; padding: 0.85rem 0.9rem;
  display: flex; flex-direction: column; gap: 0.65rem; overflow: hidden;
}
.wd-dash-page-hdr {
  display: flex; align-items: center; justify-content: space-between;
}
.wd-dash-page-title { font-size: 0.82rem; font-weight: 700; color: #fff; }
.wd-dash-page-sub   { font-size: 0.6rem; color: rgba(255,255,255,0.35); margin-top: 0.08rem; }
.wd-dash-ai-chip {
  display: flex; align-items: center; gap: 0.28rem;
  font-size: 0.62rem; font-weight: 600; color: #5CDBA0;
  background: rgba(0,176,80,0.14);
  border: 1px solid rgba(0,176,80,0.28);
  padding: 0.18rem 0.55rem; border-radius: 999px;
}

/* KPIs */
.wd-dash-kpis {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 0.45rem;
}
.wd-dash-kpi {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 9px; padding: 0.55rem 0.6rem;
  display: flex; align-items: center; gap: 0.45rem;
}
.wd-dash-kpi-icon {
  width: 26px; height: 26px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.wd-dash-kpi-val   { font-size: 0.84rem; font-weight: 800; color: #fff; line-height: 1.2; }
.wd-dash-kpi-label { font-size: 0.58rem; color: rgba(255,255,255,0.38); }
.wd-kpi-up    { color: #5CDBA0; font-weight: 600; }
.wd-kpi-stars { color: #f59e0b; }

/* Viz row */
.wd-dash-viz-row {
  display: grid; grid-template-columns: 2fr 1fr; gap: 0.45rem; flex: 1;
}
.wd-dash-chart-box,
.wd-dash-mini-bars {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 9px; padding: 0.55rem 0.65rem; overflow: hidden;
}
.wd-dash-chart-lbl { font-size: 0.58rem; color: rgba(255,255,255,0.35); margin-bottom: 0.3rem; }
.wd-dash-line-svg  { width: 100%; height: 52px; display: block; }
.wd-dash-bar-group { display: flex; align-items: flex-end; gap: 3px; height: 52px; }
.wd-dash-bar-item  { flex: 1; height: 100%; display: flex; align-items: flex-end; }
.wd-dash-bar-fill  { width: 100%; border-radius: 2px 2px 0 0; }

/* Pipeline */
.wd-dash-pipeline   { display: flex; flex-direction: column; gap: 0.38rem; }
.wd-dash-pipe-row   {
  display: grid; grid-template-columns: 65px 1fr 22px;
  align-items: center; gap: 0.45rem;
}
.wd-dash-pipe-label { font-size: 0.6rem; color: rgba(255,255,255,0.42); }
.wd-dash-pipe-track {
  height: 5px; background: rgba(255,255,255,0.07);
  border-radius: 999px; overflow: hidden;
}
.wd-dash-pipe-fill  { height: 100%; border-radius: 999px; background: #00B050; }
.wd-pipe-blue  { background: #0070D2; }
.wd-pipe-teal  { background: #5CDBA0; }
.wd-dash-pipe-num { font-size: 0.58rem; color: rgba(255,255,255,0.3); text-align: right; }

/* Floating pills */
.wd-dash-pill {
  position: absolute;
  display: flex; align-items: center; gap: 0.45rem;
  background: rgba(8,18,12,0.96);
  border: 1px solid rgba(255,255,255,0.11);
  border-radius: 999px; padding: 0.4rem 0.85rem;
  font-size: 0.66rem; color: rgba(255,255,255,0.82); font-weight: 500;
  backdrop-filter: blur(16px);
  box-shadow: 0 6px 22px rgba(0,0,0,0.4);
  white-space: nowrap;
  animation: wd-pill-float 4s ease-in-out infinite;
  z-index: 10;
}
.wd-dash-pill--1 { bottom: -4%; left: -3%; animation-delay: 0s; border-color: rgba(52,211,153,0.28); }
.wd-dash-pill--2 { top: 8%;  right: -3%; animation-delay: 2.2s; border-color: rgba(56,189,248,0.28); }

@keyframes wd-pill-float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-7px); }
}

/* hero sub — light theme (colour set in the rule above) */

/* ============================================================
   HERO TECH PILLS
   ============================================================ */
.wd-hero-tech-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.85rem;
}
.wd-tech-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.3rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(0,176,80,0.3);
  background: rgba(0,176,80,0.06);
  color: var(--wd-green-dark);
  transition: background 0.2s ease, transform 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-tech-pill:hover {
  background: rgba(0,176,80,0.14);
  transform: translateY(-2px);
}
.wd-tech-pill--agent {
  border-color: rgba(90,111,255,0.3);
  background: rgba(90,111,255,0.06);
  color: #3B4FCC;
}
.wd-tech-pill--agent:hover { background: rgba(90,111,255,0.12); }

/* ============================================================
   AGENTFORCE LIVE CARD (Hero Right)
   ============================================================ */
.wd-agentcard {
  position: relative;
  z-index: 1;
  background: #fff;
  border: 1px solid rgba(0,176,80,0.12);
  border-radius: 24px;
  padding: 1.75rem 2rem;
  box-shadow:
    0 1px 3px rgba(0,0,0,0.04),
    0 12px 40px rgba(0,176,80,0.07),
    0 40px 80px rgba(0,0,0,0.06);
  width: 100%;
}

/* Header */
.wd-agentcard-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wd-border);
}
.wd-agentcard-platforms {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.wd-platform-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(0,176,80,0.25);
  background: rgba(0,176,80,0.07);
  color: var(--wd-green-dark);
}
.wd-pp-agent {
  border-color: rgba(90,111,255,0.25);
  background: rgba(90,111,255,0.07);
  color: #3B4FCC;
}
.wd-platform-connector {
  position: relative;
  width: 56px;
  height: 14px;
  flex-shrink: 0;
}
.wd-conn-dot {
  position: absolute;
  width: 7px; height: 7px;
  border-radius: 50%;
  top: 50%; transform: translateY(-50%);
}
.wd-conn-dot-1 {
  background: #00B050;
  box-shadow: 0 0 4px rgba(0,176,80,0.7);
  animation: wd-conn-travel 2.2s ease-in-out infinite;
}
.wd-conn-dot-2 {
  background: #5A6FFF;
  box-shadow: 0 0 4px rgba(90,111,255,0.7);
  animation: wd-conn-travel 2.2s ease-in-out infinite 1.1s;
}
@keyframes wd-conn-travel {
  0%        { left: 0;    opacity: 0; }
  8%        { opacity: 1; }
  88%       { opacity: 1; }
  100%      { left: calc(100% - 7px); opacity: 0; }
}
.wd-agentcard-live {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green-dark);
  background: rgba(0,176,80,0.08);
  border: 1px solid rgba(0,176,80,0.2);
  border-radius: 999px;
  padding: 0.22rem 0.6rem;
}

/* Body: orb + KPI cards */
.wd-agentcard-body {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.1rem;
}
.wd-agent-orb-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.wd-agent-orb {
  position: relative;
  width: 100px; height: 100px;
  display: flex; align-items: center; justify-content: center;
}
.wd-agent-orb-core {
  position: relative;
  z-index: 2;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, #00C55A 0%, #007A35 100%);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(0,176,80,0.45);
  animation: wd-core-breathe 3s ease-in-out infinite;
}
@keyframes wd-core-breathe {
  0%, 100% { box-shadow: 0 4px 20px rgba(0,176,80,0.4); transform: scale(1); }
  50%       { box-shadow: 0 4px 32px rgba(0,176,80,0.7), 0 0 0 8px rgba(0,176,80,0.08); transform: scale(1.04); }
}
.wd-agent-orb-ring {
  position: absolute;
  border-radius: 50%;
  border: 1.5px solid rgba(0,176,80,0.18);
}
.wd-aor-1 { inset: 14px; animation: wd-ring-clockwise 7s linear infinite; }
.wd-aor-2 { inset: 4px;  animation: wd-ring-clockwise 13s linear infinite reverse; border-style: dashed; border-color: rgba(0,176,80,0.1); }
@keyframes wd-ring-clockwise { to { transform: rotate(360deg); } }

/* Orbiting nodes */
.wd-agent-orbit {
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
.wd-ao-1 { animation: wd-orbit-cw 3.5s linear infinite; }
.wd-ao-2 { animation: wd-orbit-cw 5.5s linear infinite reverse; }
.wd-ao-3 { animation: wd-orbit-cw 8s linear infinite; }
@keyframes wd-orbit-cw { to { transform: rotate(360deg); } }

.wd-orbit-node {
  position: absolute;
  width: 9px; height: 9px;
  border-radius: 50%;
  top: 0; left: 50%;
  margin-left: -4.5px;
}
.wd-on-green  { background: #00B050; box-shadow: 0 0 6px rgba(0,176,80,0.8); }
.wd-on-blue   { background: #5A6FFF; box-shadow: 0 0 6px rgba(90,111,255,0.8); }
.wd-on-purple { background: #8B5CF6; box-shadow: 0 0 6px rgba(139,92,246,0.8); }

.wd-agent-orb-label {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--wd-green-dark);
  white-space: nowrap;
  text-align: center;
}

/* KPI cards */
.wd-agent-kpis {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  flex: 1;
  min-width: 0;
}
.wd-agent-kpi-card {
  background: var(--wd-off-white);
  border: 1px solid var(--wd-border);
  border-radius: 14px;
  padding: 0.75rem 1rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.wd-agent-kpi-card:hover {
  transform: translateX(4px);
  box-shadow: 0 4px 16px rgba(0,176,80,0.1);
  border-color: rgba(0,176,80,0.2);
}
.wd-agent-kpi-val {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1;
}
.wd-agent-kpi-lbl {
  font-size: 0.68rem;
  color: var(--wd-mid);
  font-weight: 500;
  margin-top: 0.12rem;
}
.wd-agent-kpi-delta {
  font-size: 0.65rem;
  font-weight: 700;
  margin-top: 0.18rem;
}
.wd-delta-up { color: var(--wd-green); }

/* Progress bar */
.wd-agentcard-prog {
  margin-bottom: 1rem;
}
.wd-agentcard-prog-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.4rem;
}
.wd-agentcard-prog-label {
  font-size: 0.68rem;
  color: var(--wd-mid);
  font-weight: 500;
}
.wd-prog-pct {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green-dark);
}
.wd-agentcard-prog-track {
  height: 5px;
  background: rgba(0,176,80,0.1);
  border-radius: 999px;
  overflow: hidden;
}
.wd-agentcard-prog-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #00B050 0%, #5CDBA0 100%);
  animation: wd-agent-prog 4.5s ease-in-out infinite;
}
@keyframes wd-agent-prog {
  0%, 5%   { width: 15%; }
  55%, 80% { width: 78%; }
  95%, 100%{ width: 15%; }
}

/* Activity feed */
.wd-agentcard-feed {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  border-top: 1px solid var(--wd-border);
  padding-top: 0.9rem;
}
.wd-acf-item {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
.wd-acf-1 { animation: wd-feed-in 6s ease-in-out infinite 0s; }
.wd-acf-2 { animation: wd-feed-in 6s ease-in-out infinite 2s; }
.wd-acf-3 { animation: wd-feed-in 6s ease-in-out infinite 4s; }
@keyframes wd-feed-in {
  0%, 6%   { opacity: 0.2; transform: translateX(-5px); }
  18%, 80% { opacity: 1;   transform: translateX(0); }
  94%, 100%{ opacity: 0.2; }
}
.wd-acf-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.wd-acf-green  { background: #00B050; box-shadow: 0 0 4px rgba(0,176,80,0.6); }
.wd-acf-blue   { background: #5A6FFF; box-shadow: 0 0 4px rgba(90,111,255,0.6); }
.wd-acf-purple { background: #8B5CF6; box-shadow: 0 0 4px rgba(139,92,246,0.6); }
.wd-acf-text {
  flex: 1;
  font-size: 0.68rem;
  color: var(--wd-body);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wd-acf-time {
  font-size: 0.63rem;
  color: var(--wd-mid);
  font-weight: 600;
  flex-shrink: 0;
}

/* ============================================================
   HERO VISUAL — TEAM SLIDESHOW + FLOATING DASHBOARD CARDS
   ============================================================ */

/* Scene = the 16:9 photo frame itself; cards float on top */
.wd-hv-scene {
  position: relative;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 16 / 9;
  margin: auto;
  overflow: visible; /* cards allowed to bleed outside edges */
}

/* Photo-wrap fills the entire scene */
.wd-hv-photo-wrap {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  overflow: hidden;
  z-index: 3;
  box-shadow:
    0 0 0 3px rgba(0,153,68,0.2),
    0 16px 50px rgba(0,0,0,0.18),
    0 4px 12px rgba(0,0,0,0.08);
}

/* Slideshow images — stacked, opacity crossfade */
.wd-hv-slide {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  opacity: 0;
  transition: opacity 1.4s ease-in-out;
}
.wd-hv-slide--active {
  opacity: 1;
}

.wd-hv-photo-glow {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, transparent 60%, rgba(0,20,8,0.15) 100%);
  pointer-events: none;
}

/* Floating dashboard illustration cards */
/* Metric stat cards floating over the hero photo */
.wd-fcard {
  position: absolute;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(0,0,0,0.07);
  border-radius: 16px;
  padding: 14px 18px;
  z-index: 5;
  text-align: center;
  min-width: 120px;
  box-shadow:
    0 8px 32px rgba(0,0,0,0.10),
    0 2px 8px rgba(0,0,0,0.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.wd-fcard-stat-icon {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: rgba(0,153,68,0.1);
  color: #009944;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 6px;
}
.wd-fcard-stat-icon--blue   { background: rgba(90,111,255,0.1); color: #5a6fff; }
.wd-fcard-stat-icon--purple { background: rgba(139,92,246,0.1); color: #8b5cf6; }
.wd-fcard-stat-num {
  font-size: 1.9rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1;
}
.wd-fcard-stat-label {
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--wd-mid);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 4px;
  white-space: nowrap;
}

/* Card positions — triangular composition */
.wd-fcard--clients {
  top: 5%; left: -14%;
  animation: wd-fcard-float 5.5s ease-in-out infinite;
}
.wd-fcard--tco {
  top: 40%; right: -14%;
  animation: wd-fcard-float 4.8s ease-in-out 1.0s infinite;
}
.wd-fcard--golive {
  bottom: 5%; left: -14%;
  animation: wd-fcard-float 6s ease-in-out 0.6s infinite;
}

@keyframes wd-fcard-float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}

/* Floating illustration cards over hero photo */
.wd-hv-illus-card {
  position: absolute;
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(0,0,0,0.07);
  border-radius: 16px;
  padding: 11px 14px;
  z-index: 5;
  box-shadow: 0 8px 28px rgba(0,0,0,0.11), 0 2px 8px rgba(0,0,0,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.wd-hv-ic-header {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 7px;
}
.wd-hv-ic-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #00B050;
  flex-shrink: 0;
}
.wd-hv-ic-dot--teal   { background: #38ECA0; }
.wd-hv-ic-dot--purple { background: #8b5cf6; }
.wd-hv-ic-title {
  font-size: 0.60rem;
  font-weight: 700;
  color: #52596A;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
/* Card 1 — top-left, growth sparkline */
.wd-hv-ic-1 {
  top: 5%; left: -14%;
  animation: wd-fcard-float 5.5s ease-in-out infinite;
}
/* Card 2 — mid-right, AI node network */
.wd-hv-ic-2 {
  top: 38%; right: -14%;
  animation: wd-fcard-float 4.8s ease-in-out 1.0s infinite;
}
/* Card 3 — bottom-left, arc gauge */
.wd-hv-ic-3 {
  bottom: 5%; left: -14%;
  animation: wd-fcard-float 6.0s ease-in-out 0.5s infinite;
}
@media (max-width: 968px) {
  .wd-hv-ic-1, .wd-hv-ic-3 { left: 2%; }
  .wd-hv-ic-2 { right: 2%; }
}

/* Metrics strip below the hero photo */
.wd-hero-photo-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
  max-width: 900px;
  margin-top: 1.5rem;
  border-top: 1px solid var(--wd-border);
}
.wd-hpm-sep {
  display: none;
}
.wd-hpm-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  padding: 2rem 2.5rem;
  border-right: 1px solid var(--wd-border);
}
.wd-hpm-item:nth-child(5) {
  border-right: none;
}
.wd-hpm-num {
  font-size: 5rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1;
  position: relative;
  padding-bottom: 0;
}
.wd-hpm-num::after {
  display: none;
}
.wd-hpm-label {
  font-size: 1rem;
  font-weight: 400;
  color: var(--wd-mid);
  text-transform: none;
  letter-spacing: normal;
  white-space: normal;
}
.wd-hpm-aside {
  display: none;
}

/* Responsive */
@media (max-width: 968px) {
  .wd-hv-scene { max-width: 100%; }
  .wd-hpm-num { font-size: 2.2rem; }
  .wd-hpm-label { font-size: 0.58rem; }
}
@media (max-width: 600px) {
  .wd-hero-photo-metrics { padding: 1.25rem 0 0.25rem; }
  .wd-hpm-num { font-size: 1.8rem; }
  .wd-hpm-sep { height: 34px; }
}

/* ============================================================
   PROOF STAT ICON
   ============================================================ */
.wd-proof-stat-icon {
  width: 46px; height: 46px;
  border-radius: 13px;
  background: rgba(0,176,80,0.08);
  border: 1px solid rgba(0,176,80,0.15);
  display: flex; align-items: center; justify-content: center;
  color: var(--wd-green);
  margin: 0 auto 0.7rem;
  transition: background 0.2s, transform 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-proof-stat:hover .wd-proof-stat-icon {
  background: rgba(0,176,80,0.14);
  transform: scale(1.1) rotate(-4deg);
}

/* ============================================================
   HERO — ANIMATED ORB BACKGROUND
   ============================================================ */
.wd-hero-orbs { display: none; }
@keyframes orb1 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%       { transform: translate(100px, 70px) scale(1.07); }
  66%       { transform: translate(30px, 140px) scale(0.94); }
}
@keyframes orb2 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  40%       { transform: translate(-90px, -70px) scale(1.1); }
  75%       { transform: translate(-30px, -150px) scale(0.88); }
}
@keyframes orb3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%       { transform: translate(-70px, 50px) scale(1.18); }
}
@keyframes orb4 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  30%       { transform: translate(50px, -35px) scale(0.86); }
  65%       { transform: translate(-35px, 55px) scale(1.08); }
}

/* ============================================================
   CLIENT LOGOS SECTION
   ============================================================ */
/* ============================================================
   CLIENTS — Light grid, industry-grouped
   ============================================================ */
/* ── Our Clients ── */
.wd-clients {
  background: transparent;
  padding-block: clamp(2rem, 3vw, 2.5rem);
  width: 100%;
  overflow: hidden;
}

.wd-cl-outer {
  width: min(1000px, 100%);
  margin-inline: auto;
  padding-inline: clamp(1.5rem, 4vw, 3rem);
  box-sizing: border-box;
}

.wd-cl-head {
  text-align: center;
  margin-bottom: 1.5rem;
}

.wd-cl-headline {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--wd-dark);
  letter-spacing: -0.025em;
  margin: 0.35rem 0 0;
}

/* Logo carousel — crossfade between panels */
.wd-cl-carousel {
  position: relative;
  width: 100%;
}

.wd-cl-panel {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 0.9s ease;
  pointer-events: none;
}
.wd-cl-panel--active {
  position: relative;
  opacity: 1;
  pointer-events: auto;
}

/* 7-column grid */
.wd-cl-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  width: 100%;
}

.wd-cl-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 118px;
  padding: 12px 16px;
  border-right:  0.5px solid rgba(0,0,0,0.10);
  border-bottom: 0.5px solid rgba(0,0,0,0.10);
  background: transparent;
  transition: background 0.18s ease;
}
.wd-cl-cell:hover { background: rgba(0,0,0,0.02); }
.wd-cl-cell--ghost { pointer-events: none; }

/* Interior lines only — 7-column desktop */
.wd-cl-cell:nth-child(7n)        { border-right: none; }
.wd-cl-cell:last-child           { border-right: none; }
.wd-cl-cell:nth-last-child(-n+7) { border-bottom: none; }

.wd-cl-cell img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 76px;
  object-fit: contain;
  filter: grayscale(15%);
  opacity: 0.82;
  transition: filter 0.22s ease, opacity 0.22s ease;
}
.wd-cl-cell:hover img { filter: grayscale(0%); opacity: 1; }

/* Larger logos (cure.fit / cult.fit) */
.wd-cl-cell--lg img { max-height: 100px; }
@media (max-width: 600px) { .wd-cl-cell--lg img { max-height: 80px; } }

/* Dot indicators */
.wd-cl-dots {
  display: none;
}
.wd-cl-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(0,0,0,0.18);
  transition: background 0.3s ease;
}
.wd-cl-dot--active { background: var(--wd-green, #009944); }

/* Tablet: 4 columns */
@media (max-width: 960px) {
  .wd-cl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .wd-cl-cell:nth-child(7n)        { border-right: 0.5px solid rgba(0,0,0,0.10); }
  .wd-cl-cell:nth-last-child(-n+7) { border-bottom: 0.5px solid rgba(0,0,0,0.10); }
  .wd-cl-cell:nth-child(4n)        { border-right: none; }
  .wd-cl-cell:nth-last-child(-n+4) { border-bottom: none; }
}

/* Mobile: 3 columns */
@media (max-width: 600px) {
  .wd-cl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wd-cl-cell { height: 96px; padding: 10px 12px; }
  .wd-cl-cell img { max-height: 64px; }
  .wd-cl-cell:nth-child(4n)        { border-right: 0.5px solid rgba(0,0,0,0.10); }
  .wd-cl-cell:nth-last-child(-n+4) { border-bottom: 0.5px solid rgba(0,0,0,0.10); }
  .wd-cl-cell:nth-child(3n)        { border-right: none; }
  .wd-cl-cell:nth-last-child(-n+3) { border-bottom: none; }
}

/* ============================================================
   SECTION HEADER (shared)
   ============================================================ */
.wd-section-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 3.5rem;
}
.wd-section-header h2 { margin-bottom: 0.75rem; hyphens: none; }
.wd-section-header p { font-size: 1.1rem; }

/* Centre-align all section header containers and their h2s */
.wd-section-header,
.wd-cl-head,
.wd-team-section-header,
.wd-ind-header {
  text-align: center;
}
.wd-section-header h2,
.wd-cl-head h2,
.wd-team-section-header h2,
.wd-ind-header h2 {
  text-align: center;
}

/* ============================================================
   PARTNER TRUST STRIP
   ============================================================ */
.wd-partner-strip {
  background: var(--wd-off-white);
  border-block: 1px solid var(--wd-border);
  padding-block: 1.75rem;
}
.wd-partner-strip-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center;
}
.wd-partner-strip-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--wd-muted);
  white-space: nowrap;
}
.wd-partner-logos {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: center;
}
.wd-summit-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  background: #032D60;
  color: #fff;
  font-size: 0.95rem;
  font-weight: 700;
  padding: 0.7rem 1.5rem;
  border-radius: var(--wd-radius-full);
  letter-spacing: 0.02em;
  box-shadow: 0 3px 12px rgba(3,45,96,0.3);
  white-space: nowrap;
}
.wd-summit-badge svg {
  width: 16px;
  height: 16px;
  fill: #F4BC18;
  flex-shrink: 0;
}
.wd-partner-logo {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: #fff;
  border: 1px solid var(--wd-border);
  color: var(--wd-mid);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.5rem 0.9rem;
  border-radius: var(--wd-radius-full);
}
.wd-partner-logo svg { width: 14px; height: 14px; }

/* ============================================================
   CXO SEGMENTATION
   ============================================================ */
.wd-cxo {
  background:
    radial-gradient(ellipse 600px 400px at 105% 0%, rgba(0,176,80,0.05) 0%, transparent 60%),
    #FFFFFF;
  border-top: 1px solid var(--wd-border);
}
.wd-cxo-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.wd-cxo-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 3rem;
}
.wd-cxo-header h2 { margin-bottom: 0; }

/* Tabs */
.wd-tabs {
  display: flex;
  gap: 0.5rem;
  background: var(--wd-off-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius);
  padding: 0.4rem;
  width: fit-content;
  margin: 0 auto 3rem;
  flex-wrap: wrap;
  justify-content: center;
}
.wd-tab-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 1.4rem;
  font-family: 'Rubik', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--wd-mid);
  border: none;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.18s;
  white-space: nowrap;
}
.wd-tab-btn svg { width: 15px; height: 15px; }
.wd-tab-btn:hover { color: var(--wd-dark); }
.wd-tab-btn.active {
  background: #fff;
  color: var(--wd-green);
  box-shadow: var(--wd-shadow-sm);
}

/* Tab panels — visual-first layout */
.wd-tab-panel { display: none; }
.wd-tab-panel.active {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}

/* Text side */
.wd-cxo-panel-text .eyebrow { margin-bottom: 0.75rem; }
.wd-cxo-panel-text h3 {
  font-size: clamp(1.35rem, 2.8vw, 1.85rem);
  margin-bottom: 1.75rem;
  line-height: 1.3;
}
.wd-cxo-panel-text .wd-btn { margin-top: 0.25rem; }

/* Metric pills */
.wd-cxo-metrics {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1.75rem;
}
.wd-cxo-metric {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  background: var(--wd-off-white);
  border: 1px solid var(--wd-border);
  border-radius: 12px;
  padding: 0.85rem 1.25rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.wd-cxo-metric:hover {
  border-color: rgba(0,176,80,0.3);
  box-shadow: 0 4px 16px rgba(0,176,80,0.08);
}
.wd-cxo-metric-num {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--wd-green-dark);
  letter-spacing: -0.04em;
  line-height: 1;
  min-width: 4.5rem;
  white-space: nowrap;
}
.wd-cxo-metric-label {
  font-size: 0.82rem;
  color: var(--wd-mid);
  line-height: 1.4;
  font-weight: 500;
}

/* Visual side */
.wd-cxo-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Generic viz wrapper */
.wd-viz {
  background: var(--wd-off-white);
  border: 1px solid var(--wd-border);
  border-radius: 20px;
  padding: 2rem 1.75rem 1.5rem;
  width: 100%;
  max-width: 360px;
  box-shadow: var(--wd-shadow-card);
  position: relative;
  overflow: hidden;
}
.wd-viz::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 200px 120px at 80% 0%, rgba(0,176,80,0.07) 0%, transparent 65%);
  pointer-events: none;
}
.wd-viz-label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-muted);
  margin-bottom: 1.5rem;
}

/* ── CEO bar chart ── */
.wd-viz-bar-chart {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  height: 130px;
  padding: 0 0.25rem;
}
.wd-viz-bar {
  flex: 1;
  height: var(--vh);
  background: linear-gradient(180deg, #00B050 0%, #5A6FFF 100%);
  border-radius: 5px 5px 0 0;
  position: relative;
  transform-origin: bottom;
  animation: wd-bar-rise 3.8s ease-in-out infinite;
  animation-delay: var(--vd);
  opacity: 0.85;
  transition: opacity 0.2s;
}
.wd-viz-bar:hover { opacity: 1; }
.wd-viz-bar span {
  position: absolute;
  bottom: -1.3rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.65rem;
  color: var(--wd-muted);
  font-weight: 600;
  white-space: nowrap;
}
.wd-viz-kicker {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 2.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--wd-green-dark);
}

@keyframes wd-bar-rise {
  0%, 8%   { transform: scaleY(0.08); opacity: 0.4; }
  35%, 72% { transform: scaleY(1);    opacity: 0.85; }
  92%, 100%{ transform: scaleY(0.08); opacity: 0.4; }
}

/* ── CIO architecture SVG ── */
.wd-viz-cio { display: flex; align-items: center; justify-content: center; }
.wd-arch-svg { width: 100%; height: auto; overflow: visible; }

.wd-arch-line {
  animation: wd-line-draw 4s ease-in-out infinite;
  animation-delay: var(--ld);
}
@keyframes wd-line-draw {
  0%, 5%   { stroke-dashoffset: 72; opacity: 0.3; }
  30%, 70% { stroke-dashoffset: 0;  opacity: 0.7; }
  90%, 100%{ stroke-dashoffset: 72; opacity: 0.3; }
}

.wd-arch-sat {
  animation: wd-sat-pulse 4s ease-in-out infinite;
  animation-delay: var(--sd);
}
@keyframes wd-sat-pulse {
  0%, 100%{ stroke-opacity: 0.3; }
  40%, 65%{ stroke-opacity: 0.9; }
}

/* ── CFO cost comparison bars ── */
.wd-viz-cost-rows {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.wd-viz-cost-row {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  align-items: center;
  gap: 0.75rem;
}
.wd-viz-cost-name {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--wd-dark);
  white-space: nowrap;
}
.wd-viz-cost-track {
  height: 10px;
  background: var(--wd-border);
  border-radius: 5px;
  overflow: hidden;
}
.wd-viz-cost-fill {
  height: 100%;
  border-radius: 5px;
  width: 0;
  animation: wd-bar-fill 3.5s ease-out infinite;
}
.wd-viz-cost-wd      { background: linear-gradient(90deg, #00B050, #5CDBA0); animation-delay: 0s; }
.wd-viz-cost-boutique{ background: linear-gradient(90deg, #8B5CF6, #A78BFA); animation-delay: 0.2s; }
.wd-viz-cost-big4    { background: linear-gradient(90deg, #dc2626, #ef4444); animation-delay: 0.4s; }

@keyframes wd-bar-fill {
  0%, 5%   { width: 0; }
  35%, 72% { width: var(--cw); }
  92%, 100%{ width: 0; }
}

.wd-viz-cost-tag {
  font-size: 0.62rem;
  font-weight: 700;
  padding: 0.18rem 0.55rem;
  border-radius: 100px;
  white-space: nowrap;
}
.wd-tag-green  { background: rgba(0,176,80,0.12); color: #008040; }
.wd-tag-red    { background: rgba(220,38,38,0.1); color: #b91c1c; }
.wd-tag-mid    { background: rgba(82,89,106,0.1); color: var(--wd-mid); }

.wd-viz-savings {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--wd-green-dark);
  padding-top: 0.5rem;
  border-top: 1px solid var(--wd-border);
}

/* ============================================================
   SERVICES
   ============================================================ */
.wd-services {
  background:
    radial-gradient(ellipse 700px 500px at 105% 0%, rgba(90,111,255,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 500px 400px at -5% 100%, rgba(0,176,80,0.05) 0%, transparent 60%),
    #F7F8FC;
  position: relative;
}
.wd-services-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  padding-block: clamp(2rem, 3.5vw, 3rem);
}

.wd-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.25rem;
}

.wd-service-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: 22px;
  padding: 2.25rem;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s, border-color 0.3s;
  position: relative;
  overflow: hidden;
  box-shadow: var(--wd-shadow-card);
}
.wd-service-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--wd-gradient);
  opacity: 0;
  transition: opacity 0.3s;
}
.wd-service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 28px 64px rgba(0,0,0,0.10);
  border-color: rgba(0,176,80,0.18);
}
.wd-service-card:hover::before { opacity: 1; }

.wd-service-icon {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  flex-shrink: 0;
  position: relative;
  box-shadow:
    0 10px 30px rgba(0,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.32),
    inset 0 -2px 0 rgba(0,0,0,0.12);
}
.wd-service-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255,255,255,0.22) 0%, transparent 55%);
  pointer-events: none;
}
.wd-service-icon svg {
  width: 26px; height: 26px;
  position: relative; z-index: 1;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.18));
}
/* Service icon — unified brand green */
.wd-svc-sf,
.wd-svc-ai,
.wd-svc-data,
.wd-svc-mgd,
.wd-svc-cloud,
.wd-svc-ms { background: linear-gradient(145deg, #00C55A, #007A35); }

.wd-service-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin-bottom: 0.6rem;
  letter-spacing: -0.01em;
}
.wd-service-desc {
  font-size: 0.875rem;
  color: var(--wd-mid);
  line-height: 1.7;
  margin-bottom: 1.25rem;
}
.wd-service-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--wd-green);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  transition: gap 0.18s;
}
.wd-service-link svg { width: 14px; height: 14px; }
.wd-service-link:hover { gap: 0.7rem; }

/* ============================================================
   FRAMEWORK / AGENTFORCE ACCELERATOR
   ============================================================ */
.wd-framework {
  background:
    radial-gradient(ellipse 700px 500px at 105% 50%, rgba(0,176,80,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 500px 400px at -5% 30%, rgba(90,111,255,0.05) 0%, transparent 60%),
    linear-gradient(135deg, #F5F8FF 0%, #F0FAF6 100%);
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
}
.wd-framework::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.wd-framework::after {
  content: '';
  position: absolute;
  bottom: -20%;
  right: -5%;
  width: 600px;
  height: 600px;
  background: radial-gradient(ellipse, rgba(0,176,80,0.07) 0%, transparent 70%);
  pointer-events: none;
}
.wd-framework-inner {
  position: relative;
  z-index: 1;
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  padding-block: clamp(56px, 8vw, 88px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
}
.wd-framework-ip {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: var(--wd-green);
  line-height: 1.1;
  margin-bottom: 1rem;
  letter-spacing: -0.025em;
}
.wd-framework-text h2 {
  color: var(--wd-dark);
  margin-bottom: 1.25rem;
}
.wd-framework-text p { color: var(--wd-mid); }

.wd-phases { display: flex; flex-direction: column; gap: 0.75rem; }
.wd-phase {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius);
  padding: 1rem 1.25rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: var(--wd-shadow-xs);
}
.wd-phase:hover {
  border-color: rgba(0,176,80,0.25);
  box-shadow: 0 4px 20px rgba(0,176,80,0.08);
}
.wd-phase-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--wd-green);
  color: #fff;
  font-weight: 800;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wd-phase-text { flex: 1; font-size: 0.875rem; font-weight: 500; color: var(--wd-body); }
.wd-phase-week { font-size: 0.75rem; color: var(--wd-muted); font-weight: 600; white-space: nowrap; }

/* ================================================================
   BUSINESS IMPACT CARDS (Framework section right column)
   ================================================================ */

.wd-impact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem;
  will-change: transform;
}

.wd-impact-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: 16px;
  padding: 1.25rem 1.35rem 1.1rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
  transition: transform 0.4s cubic-bezier(0.22,1,0.36,1),
              box-shadow 0.3s ease;
  position: relative;
  overflow: hidden;
}

.wd-impact-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--wd-gradient);
  opacity: 0;
  transition: opacity 0.25s;
}

.wd-impact-card:hover::before { opacity: 1; }
.wd-impact-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.09);
}

.wd-impact-cat {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--wd-green);
  margin-bottom: 0.55rem;
}

.wd-impact-num {
  font-size: clamp(1.6rem, 3vw, 2.1rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 0.3rem;
}

.wd-impact-lbl {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--wd-dark);
  line-height: 1.3;
  margin-bottom: 0.25rem;
}

.wd-impact-ctx {
  font-size: 0.7rem;
  color: var(--wd-muted);
  line-height: 1.4;
}

/* ================================================================
   BUILT FOR THE BUYING COMMITTEE STRIP
   ================================================================ */

.wd-buycomm-strip {
  border-top: 1px solid var(--wd-border);
  margin-top: 3rem;
  padding: clamp(40px, 6vw, 64px) 0;
  position: relative;
  z-index: 1;
}

.wd-buycomm-hdr {
  text-align: center;
  margin-bottom: clamp(28px, 4vw, 44px);
}

.wd-buycomm-hdr h3 {
  font-size: clamp(1.4rem, 2.5vw, 1.9rem);
  font-weight: 700;
  color: var(--wd-dark);
  margin-top: 0.5rem;
}

.wd-buycomm-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.wd-buycomm-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: 18px;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  transition: transform 0.4s cubic-bezier(0.22,1,0.36,1),
              box-shadow 0.3s ease;
}

.wd-buycomm-card:hover {
  box-shadow: 0 12px 36px rgba(0,0,0,0.1);
}

/* Content area below the visual header */
.wd-bc-content {
  padding: clamp(16px, 2.5vw, 22px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
  flex: 1;
}

/* ── Animated visual header ──────────────────────────────── */
.wd-bc-vis {
  position: relative;
  height: 140px;
  overflow: hidden;
  border-bottom: 1px solid rgba(14,17,23,0.06);
}

/* Grid pattern overlay */
.wd-bc-vis::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 4;
  background-image:
    linear-gradient(to right, rgba(128,128,128,0.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(128,128,128,0.07) 1px, transparent 1px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, black 60%, transparent 100%);
  mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, black 60%, transparent 100%);
  pointer-events: none;
}

/* Radial glow per-card (inline style sets background) */
.wd-bc-vis-glow {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
}

/* Bar chart — slides left 50% on hover to reveal taller "impact" bars */
.wd-bc-vis-bars {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 6;
  width: 200%;
  height: 100%;
  transition: transform 0.5s cubic-bezier(0.6, 0.6, 0, 1);
}
.wd-bc-vis-bars svg {
  display: block;
  width: 100%;
  height: 100%;
}
.wd-buycomm-card:hover .wd-bc-vis-bars {
  transform: translateX(-50%);
}

/* Area / line chart — always present, revealed as wipe slides away */
.wd-bc-vis-area {
  position: absolute;
  top: 0;
  left: -1px;
  width: 100%;
  height: 100%;
}
.wd-bc-vis-area svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* White gradient wipe — covers the area chart initially, slides right on hover */
.wd-bc-vis-wipe {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 0%, #fff 15%);
  transition: transform 0.5s cubic-bezier(0.6, 0.6, 0, 1);
}
.wd-buycomm-card:hover .wd-bc-vis-wipe {
  transform: translateX(100%);
}

/* Role/metric pill badges — fade out on hover */
.wd-bc-vis-pills {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: opacity 0.3s ease-in-out;
}
.wd-buycomm-card:hover .wd-bc-vis-pills { opacity: 0; }
.wd-bc-vis-pill {
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(255,255,255,0.75);
  border: 1px solid rgba(14,17,23,0.1);
  border-radius: 100px;
  padding: 3px 8px 3px 6px;
  font-size: 0.6rem;
  font-weight: 600;
  color: var(--wd-dark);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  white-space: nowrap;
}
.wd-bc-vis-dot {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Tooltip — slides down from above on hover */
.wd-bc-vis-tip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 7;
  transform: translateY(-100%);
  padding: 10px 12px;
  transition: transform 0.5s cubic-bezier(0.6, 0.6, 0, 1);
}
.wd-buycomm-card:hover .wd-bc-vis-tip {
  transform: translateY(0);
}
.wd-bc-vis-tip-wrap {
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(14,17,23,0.1);
  border-radius: 8px;
  padding: 7px 10px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  transition: opacity 0.5s ease;
}
.wd-buycomm-card:hover .wd-bc-vis-tip-wrap { opacity: 1; }
.wd-bc-vis-tip-t {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin: 0 0 2px;
}
.wd-bc-vis-tip-d {
  font-size: 0.65rem;
  color: var(--wd-muted);
  margin: 0;
}

.wd-bc-badge {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 5px 13px;
  border-radius: 100px;
  align-self: flex-start;
}

.wd-bc-ceo { background: rgba(0,176,80,0.1);  color: var(--wd-green); }
.wd-bc-cio { background: rgba(59,130,246,0.1); color: #2563eb; }
.wd-bc-cfo { background: rgba(139,92,246,0.1); color: #7c3aed; }

.wd-bc-headline {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.3;
  margin: 0;
}

.wd-bc-body {
  font-size: 0.83rem;
  color: var(--wd-muted);
  line-height: 1.6;
  margin: 0;
  flex: 1;
}

.wd-bc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-top: auto;
}

.wd-bc-chips span {
  font-size: 0.6rem;
  font-weight: 600;
  color: var(--wd-muted);
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.06);
  padding: 3px 8px;
  border-radius: 100px;
}

/* Mobile */
@media (max-width: 760px) {
  .wd-impact-grid { grid-template-columns: 1fr 1fr; gap: 0.65rem; }
  .wd-buycomm-row { grid-template-columns: 1fr; }
}

/* ============================================================
   HOW WE BRING THE IMPACT — scroll-driven horizontal reveal
   ============================================================ */

.wd-howwe-section {
  background: transparent;
  position: relative;
}

/* Scroller — creates scroll height for the sticky animation */
.wd-howwe-scroller {
  position: relative;
  min-height: 360vh;
  background: #fff;
}

/* Sticky viewport — pins while user scrolls through */
.wd-howwe-sticky {
  position: sticky;
  top: 72px;
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
  padding-block: clamp(2rem, 5vh, 4rem);
  background: #fff;
}

/* Max-width inner grid */
.wd-howwe-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  width: 100%;
  display: grid;
  grid-template-columns: 38% 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
}

/* ── Left column ─────────────────────────────────────────── */
.wd-howwe-lhs {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.wd-howwe-lhs .eyebrow {
  color: var(--wd-green);
  margin-bottom: 0.75rem;
}
.wd-howwe-lhs h2 {
  color: var(--wd-dark);
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.025em;
  margin-bottom: 0.75rem;
}
.wd-howwe-lhs > p {
  color: var(--wd-muted);
  font-size: 0.9rem;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

/* Phase navigation */
.wd-howwe-nav {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  width: 100%;
}
.wd-hi-dot {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem 0.6rem;
  border-radius: 8px;
  transition: background 0.2s;
  text-align: left;
  width: 100%;
}
.wd-hi-dot:hover { background: rgba(0,176,80,0.05); }
.wd-hi-dot.active { background: rgba(0,176,80,0.08); }
.wd-hi-dot-num {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: rgba(14,17,23,0.05);
  border: 1px solid rgba(14,17,23,0.12);
  color: var(--wd-muted);
  font-size: 0.65rem;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background 0.25s, color 0.25s, border-color 0.25s;
}
.wd-hi-dot.active .wd-hi-dot-num {
  background: var(--wd-green);
  border-color: var(--wd-green);
  color: #fff;
}
.wd-hi-dot-lbl {
  font-size: 0.78rem;
  color: var(--wd-muted);
  font-weight: 500;
  transition: color 0.25s;
}
.wd-hi-dot.active .wd-hi-dot-lbl {
  color: var(--wd-dark);
  font-weight: 600;
}

/* CTA area — visually separated from the nav */
.wd-howwe-cta-wrap {
  width: 100%;
  margin-top: 1.5rem;
  padding-top: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
}
.wd-howwe-cta-hint {
  font-size: 0.72rem;
  color: var(--wd-muted);
  letter-spacing: 0.01em;
}

/* ── Right column — card stage ───────────────────────────── */
.wd-howwe-rhs {
  position: relative;
  height: clamp(380px, 56vh, 500px);
  overflow: visible;
}
.wd-howwe-stage {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Individual impact cards — white enterprise style */
.wd-hi-card {
  position: absolute;
  top: 0;
  left: 0;
  width: 75%;
  height: 100%;
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: 20px;
  padding: clamp(1.5rem, 2.5vw, 2rem) clamp(1.5rem, 2.5vw, 2rem) clamp(1.5rem, 2.5vw, 2rem) clamp(2rem, 3.5vw, 3rem);
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  will-change: transform;
  box-shadow: 0 8px 48px rgba(0,0,0,0.12), 0 2px 12px rgba(0,0,0,0.06);
}
.wd-hi-card[data-hi-idx="0"] { z-index: 1; }
.wd-hi-card[data-hi-idx="1"] { z-index: 2; }
.wd-hi-card[data-hi-idx="2"] { z-index: 3; }
.wd-hi-card[data-hi-idx="3"] { z-index: 4; }

.wd-hi-top {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.wd-hi-num {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--wd-green);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.wd-hi-tag {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--wd-green);
  background: rgba(0,176,80,0.08);
  border: 1px solid rgba(0,176,80,0.18);
  border-radius: 100px;
  padding: 0.2em 0.8em;
}
.wd-hi-title {
  font-size: clamp(1.15rem, 1.9vw, 1.5rem);
  font-weight: 800;
  color: var(--wd-dark);
  line-height: 1.22;
  letter-spacing: -0.02em;
  margin: 0;
}
.wd-hi-body {
  font-size: 0.855rem;
  color: var(--wd-muted);
  line-height: 1.72;
  flex: 1;
  margin: 0;
}
.wd-hi-impact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  padding-top: 1rem;
  margin-top: auto;
}
.wd-hi-stat {
  font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  font-weight: 900;
  color: var(--wd-green);
  line-height: 1;
  letter-spacing: -0.03em;
}
.wd-hi-stat-lbl {
  display: block;
  font-size: 0.78rem;
  color: var(--wd-muted);
  line-height: 1.5;
}
.wd-hi-stat-lbl::first-letter { text-transform: uppercase; }

/* Buying committee strip — default light styles apply, just fix margin */
.wd-howwe-section .wd-buycomm-strip {
  margin-top: 0;
}

/* ── Mobile: disable animation, stack vertically ─────────── */
@media (max-width: 900px) {
  .wd-howwe-scroller { min-height: unset; }
  .wd-howwe-sticky {
    position: static;
    height: auto;
    padding-block: clamp(3rem, 7vw, 5rem);
  }
  .wd-howwe-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .wd-howwe-rhs {
    height: auto;
    overflow: visible;
  }
  .wd-howwe-stage {
    position: static;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
  }
  .wd-hi-card {
    position: static;
    width: 100%;
    height: auto;
    transform: none !important;
  }
  .wd-howwe-nav { display: none; }
  .wd-howwe-cta-wrap { margin-top: 1.25rem; }
}

/* ============================================================
   OUTCOMES / CASE STUDIES
   ============================================================ */
.wd-outcomes {
  background:
    radial-gradient(ellipse 700px 400px at 105% 0%, rgba(0,176,80,0.05) 0%, transparent 60%),
    radial-gradient(ellipse 500px 300px at -5% 100%, rgba(90,111,255,0.04) 0%, transparent 60%),
    #F9FAFB;
  border-top: 1px solid var(--wd-border);
}
.wd-outcomes-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-outcomes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 1.5rem;
}

.wd-case-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s;
  box-shadow: var(--wd-shadow-card);
}
.wd-case-card:hover { transform: translateY(-6px); box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 28px 64px rgba(0,0,0,0.10); }

.wd-case-top {
  background: var(--wd-gradient);
  padding: 2rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.wd-case-industry {
  display: inline-block;
  background: rgba(255,255,255,0.18);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.35rem 0.75rem;
  border-radius: var(--wd-radius-full);
}
.wd-case-metric-num {
  font-size: 2.5rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.04em;
  text-align: right;
}
.wd-case-metric-label {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.7);
  text-align: right;
  font-weight: 500;
}
.wd-case-body { padding: 1.75rem; }
.wd-case-client {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.75rem;
}
.wd-case-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin-bottom: 0.75rem;
  line-height: 1.4;
}
.wd-case-desc {
  font-size: 0.875rem;
  color: var(--wd-mid);
  line-height: 1.7;
  margin-bottom: 1.25rem;
}
.wd-case-link {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--wd-green);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  transition: opacity 0.15s;
}
.wd-case-link:hover { opacity: 0.75; }

/* ============================================================
   INDUSTRIES
   ============================================================ */
.wd-industries {
  background:
    radial-gradient(ellipse 600px 400px at 50% 110%, rgba(90,111,255,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 400px 300px at -5% 0%, rgba(14,165,233,0.04) 0%, transparent 60%),
    #F7F8FC;
}
.wd-industries-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-industry-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
}

.wd-industry-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 2rem 1rem;
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: var(--wd-radius-lg);
  text-decoration: none;
  text-align: center;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
  box-shadow: var(--wd-shadow-card);
}
.wd-industry-tile:hover {
  border-color: rgba(0,176,80,0.25);
  background: #fff;
  transform: translateY(-5px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 20px 48px rgba(0,0,0,0.09);
}
.wd-industry-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
  box-shadow:
    0 8px 24px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.3),
    inset 0 -2px 0 rgba(0,0,0,0.1);
}
.wd-industry-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255,255,255,0.22) 0%, transparent 55%);
  pointer-events: none;
}
.wd-industry-icon svg { position: relative; z-index: 1; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15)); }
/* Industry icon color variants */
.wd-ind-finance { background: linear-gradient(145deg, #FFC030, #E08010); }
.wd-ind-mfg     { background: linear-gradient(145deg, #4898FF, #0A8EC8); }
.wd-ind-health  { background: linear-gradient(145deg, #20D890, #10A870); }
.wd-ind-retail  { background: linear-gradient(145deg, #FF506A, #F030A0); }
.wd-ind-tech    { background: linear-gradient(145deg, #A875FF, #7830D8); }
.wd-ind-gov     { background: linear-gradient(145deg, #5088FF, #2040D8); }

.wd-industry-name {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.01em;
}
.wd-industry-count {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--wd-green);
  background: rgba(0,176,80,0.1);
  padding: 0.22rem 0.6rem;
  border-radius: var(--wd-radius-full);
  letter-spacing: 0.02em;
}

/* ============================================================
   TECH STACK
   ============================================================ */
.wd-tech { background: transparent; }
.wd-tech-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-tech-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  justify-content: center;
}

.wd-tech-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 1.1rem;
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius-full);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--wd-body);
  transition: all 0.18s;
  white-space: nowrap;
}
.wd-tech-pill:hover { border-color: var(--wd-green); box-shadow: var(--wd-shadow); }
.wd-tech-pill .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.wd-tech-pill.salesforce .dot { background: #009EDB; }
.wd-tech-pill.ai .dot { background: var(--wd-green); }
.wd-tech-pill.cloud .dot { background: var(--wd-accent-blue); }
.wd-tech-pill.data .dot { background: #F9CE34; }

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.wd-testimonials {
  background:
    radial-gradient(ellipse 600px 400px at -5% 50%, rgba(139,92,246,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 500px 400px at 105% 50%, rgba(90,111,255,0.06) 0%, transparent 60%),
    linear-gradient(135deg, #F8F7FF 0%, #F3F0FF 40%, #F8F7FF 100%);
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--wd-border);
}
.wd-testimonials-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
}

.wd-testimonial {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: 22px;
  padding: 2.25rem;
  transition: box-shadow 0.3s, transform 0.3s, border-color 0.3s;
  position: relative;
  box-shadow: var(--wd-shadow-card);
}
.wd-testimonial::before {
  content: '\201C';
  position: absolute;
  top: 1.25rem;
  right: 1.75rem;
  font-size: 5rem;
  line-height: 1;
  color: var(--wd-green);
  opacity: 0.12;
  font-family: Georgia, serif;
  pointer-events: none;
}
.wd-testimonial:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 20px 52px rgba(0,0,0,0.08);
  transform: translateY(-4px);
  border-color: rgba(0,176,80,0.18);
}
.wd-testimonial-text {
  font-size: 0.95rem;
  color: var(--wd-body);
  line-height: 1.8;
  margin-bottom: 1.5rem;
  font-style: italic;
}
.wd-testimonial-author { display: flex; align-items: center; gap: 0.85rem; }
.wd-testimonial-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--wd-gradient);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wd-testimonial-name {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--wd-dark);
}
.wd-testimonial-role {
  font-size: 0.78rem;
  color: var(--wd-muted);
  margin-top: 0.15rem;
}

/* ── Our Partners grid (6-column, single row) ── */
.wd-partner-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  width: 100%;
}
/* Desktop: no bottom border (single row), last cell no right border */
.wd-partner-grid .wd-cl-cell              { border-bottom: none; }
.wd-partner-grid .wd-cl-cell:nth-child(6n){ border-right: none; }
/* Mobile: 3×2 grid */
@media (max-width: 860px) {
  .wd-partner-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wd-partner-grid .wd-cl-cell              { border-bottom: 0.5px solid rgba(0,0,0,0.10); }
  .wd-partner-grid .wd-cl-cell:nth-child(3n){ border-right: none; }
  .wd-partner-grid .wd-cl-cell:nth-child(6n){ border-right: none; }
  .wd-partner-grid .wd-cl-cell:nth-last-child(-n+3) { border-bottom: none; }
}

/* ============================================================
   GLOBAL REACH SECTION
   ============================================================ */
.wd-global-section {
  padding-block: clamp(4rem, 8vw, 7rem);
  background-color: var(--wd-tint);
  background-image:
    linear-gradient(to right,  rgba(71,85,105,0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(71,85,105,0.08) 1px, transparent 1px);
  background-size: 32px 32px;
  overflow: hidden;
}
.wd-global-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.wd-global-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
}
.wd-global-presence {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}
.wd-global-loc {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--wd-body);
  letter-spacing: -0.01em;
}
.wd-global-sep { color: var(--wd-muted); font-size: 0.9rem; }

/* Globe */
.wd-global-globe-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .wd-global-inner { grid-template-columns: 1fr; }
  .wd-global-text { align-items: center; text-align: center; }
  .wd-global-presence { justify-content: center; }
}
#wd-globe-canvas { display: block; border-radius: 50%; box-shadow: 0 8px 40px rgba(0,0,0,0.10); }
.wd-globe-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.wd-globe-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(0,176,80,0.18);
  border-top-color: var(--wd-green);
  border-radius: 50%;
  animation: wd-globe-spin 0.75s linear infinite;
}
@keyframes wd-globe-spin { to { transform: rotate(360deg); } }

/* ============================================================
   INSIGHTS
   ============================================================ */
.wd-insights {
  background:
    radial-gradient(ellipse 500px 400px at 105% 100%, rgba(90,111,255,0.05) 0%, transparent 60%),
    radial-gradient(ellipse 400px 300px at 0% 0%, rgba(0,176,80,0.04) 0%, transparent 60%),
    #F7F8FC;
}
.wd-insights-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-insights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
}
/* 2-card perspectives grid in non-insights sections */
.wd-insights .wd-ins-grid {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 640px) {
  .wd-insights .wd-ins-grid { grid-template-columns: 1fr; }
}

.wd-insight-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s;
  box-shadow: var(--wd-shadow-card);
}
.wd-insight-card:hover { transform: translateY(-5px); box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 24px 56px rgba(0,0,0,0.09); }

.wd-insight-thumb {
  height: 200px;
  background: var(--wd-gradient-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  position: relative;
  overflow: hidden;
}
.wd-insight-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.wd-insight-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(0,176,80,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,176,80,0.08) 1px, transparent 1px);
  background-size: 30px 30px;
}
.wd-insight-body { padding: 1.5rem; }
.wd-insight-tag {
  display: inline-block;
  background: var(--wd-green-tint);
  color: var(--wd-green-dark);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0.3rem 0.7rem;
  border-radius: var(--wd-radius-full);
  margin-bottom: 0.75rem;
}
.wd-insight-title {
  font-size: 0.975rem;
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.4;
  margin-bottom: 0.6rem;
}
.wd-insight-excerpt {
  font-size: 0.845rem;
  color: var(--wd-mid);
  line-height: 1.65;
  margin-bottom: 1rem;
}
.wd-insight-meta {
  display: flex;
  gap: 1rem;
  font-size: 0.75rem;
  color: var(--wd-muted);
  font-weight: 500;
}

/* ============================================================
   LEADERSHIP
   ============================================================ */
.wd-leadership {
  background:
    radial-gradient(ellipse 500px 400px at 50% -10%, rgba(0,176,80,0.05) 0%, transparent 60%),
    #FFFFFF;
}
.wd-leadership-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

.wd-leadership-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 420px));
  gap: 1.5rem;
  justify-content: center;
}

.wd-leader-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s, border-color 0.3s;
  box-shadow: var(--wd-shadow-card);
}
.wd-leader-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 28px 64px rgba(0,0,0,0.10);
  border-color: rgba(0,176,80,0.18);
}

.wd-leader-photo {
  height: 130px;
  background: linear-gradient(135deg, #06080F 0%, #0D1020 50%, #101620 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: rgba(255,255,255,0.6);
  position: relative;
  overflow: hidden;
}
.wd-leader-photo::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: var(--wd-gradient);
}
.wd-leader-body { padding: 1.5rem; }
.wd-leader-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin-bottom: 0.2rem;
}
.wd-leader-title {
  font-size: 0.8rem;
  font-weight: 600;
  color: #CDCDCD;
  margin-bottom: 0.75rem;
}
.wd-leader-bio {
  font-size: 0.845rem;
  color: var(--wd-mid);
  line-height: 1.65;
  margin-bottom: 1rem;
}
.wd-leader-linkedin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  color: #0077B5;
  background: rgba(0, 119, 181, 0.08);
  transition: background 0.2s ease, transform 0.2s ease;
}
.wd-leader-linkedin:hover {
  background: rgba(0, 119, 181, 0.18);
  transform: translateY(-2px);
}

/* ============================================================
   CTA BLOCK
   ============================================================ */
.wd-cta-block {
  background:
    radial-gradient(ellipse 700px 500px at 50% 120%, rgba(0,176,80,0.1) 0%, transparent 60%),
    radial-gradient(ellipse 500px 400px at -5% 0%, rgba(90,111,255,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 400px 400px at 105% 0%, rgba(139,92,246,0.06) 0%, transparent 60%),
    linear-gradient(135deg, #EEF2FF 0%, #EBF7EE 45%, #F2EEFF 100%);
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--wd-border);
}
.wd-cta-block::before {
  content: '';
  position: absolute;
  inset: 0;
}
.wd-cta-block::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 500px;
  background: radial-gradient(ellipse, rgba(0,176,80,0.1) 0%, transparent 70%);
  pointer-events: none;
}
.wd-cta-inner {
  position: relative;
  z-index: 1;
  max-width: 680px;
  margin-inline: auto;
  padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 5vw, 2.5rem);
  text-align: center;
}
.wd-cta-inner h2 {
  color: var(--wd-dark);
  font-size: clamp(1.9rem, 3.2vw, 2.8rem);
  margin-bottom: 1rem;
}
.wd-cta-inner p {
  color: var(--wd-mid);
  font-size: 1.05rem;
  margin-bottom: 2.25rem;
}
.wd-cta-actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* ============================================================
   FOOTER
   ============================================================ */
.wd-footer {
  background: transparent;
  border-top: 1px solid var(--wd-border);
}
.wd-footer-bar {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding: 2rem clamp(1.25rem, 5vw, 2.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
.wd-footer-logo-link { display: inline-flex; flex-shrink: 0; }
.wd-footer-wordmark {
  height: 40px;
  width: auto;
  display: block;
}
.wd-footer-copy {
  font-size: 0.8rem;
  color: var(--wd-muted);
  margin: 0;
}
.wd-footer-legal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.2rem 1rem;
}
.wd-footer-legal a,
.wd-cookie-settings-btn {
  font-size: 0.78rem;
  color: var(--wd-muted);
  transition: color 0.15s;
  white-space: nowrap;
}
.wd-footer-legal a:hover,
.wd-cookie-settings-btn:hover { color: var(--wd-green); }
.wd-cookie-settings-btn {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.wd-footer-social {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.wd-footer-icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--wd-border);
  color: var(--wd-muted);
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.wd-footer-icon-link:hover {
  color: var(--wd-green);
  border-color: var(--wd-green);
  background: var(--wd-green-tint);
}
.wd-footer-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(0,176,80,0.08);
  border: 1px solid rgba(0,176,80,0.2);
  color: var(--wd-green-dark);
  padding: 0.4rem 0.85rem;
  border-radius: var(--wd-radius-full);
  font-size: 0.75rem;
  font-weight: 600;
}

/* ============================================================
   INNER PAGES (two-column layout)
   ============================================================ */
.wd-two-col { grid-template-columns: 1fr 1fr; }
@media (max-width: 768px) {
  .wd-two-col { grid-template-columns: 1fr; }
}

/* ============================================================
   ANIMATIONS
   ============================================================ */
/* ============================================================
   SCROLL PROGRESS BAR
   ============================================================ */
.wd-scroll-progress {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 4px;
  background: #00B050;
  transform-origin: left center;
  transform: scaleX(0);
  z-index: 99999;
  pointer-events: none;
  box-shadow: 0 0 8px rgba(0,176,80,0.8);
}

/* ============================================================
   SCROLL-TRIGGERED ANIMATIONS
   ============================================================ */
[data-aos] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
[data-aos="fade-left"]    { transform: translateX(-24px); }
[data-aos="fade-right"]   { transform: translateX(24px); }
[data-aos="scale-in"]     { transform: scale(0.94) translateY(14px); }
[data-aos="fade-up-slow"] { transform: translateY(36px); transition-duration: 1.0s; }
[data-aos="fade-scale"]   { transform: translateY(16px) scale(0.97); }
[data-aos].aos-in {
  opacity: 1;
  transform: none;
}

/* Word-reveal spans injected by JS */
.wd-wr {
  display: inline-block;
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1) var(--wd-wr-d, 0s),
              transform 0.55s cubic-bezier(0.16, 1, 0.3, 1) var(--wd-wr-d, 0s);
  will-change: opacity, transform;
}
.aos-in .wd-wr {
  opacity: 1;
  transform: none;
}

/* Character convergence spans injected by GSAP */
.wd-char {
  display: inline-block;
  will-change: transform;
}

/* Stagger children auto-delays */
[data-stagger] > * {
  opacity: 0;
  transform: translateY(18px) scale(0.98);
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
[data-stagger].aos-in > *:nth-child(1)  { opacity: 1; transform: none; transition-delay: 0.00s; }
[data-stagger].aos-in > *:nth-child(2)  { opacity: 1; transform: none; transition-delay: 0.07s; }
[data-stagger].aos-in > *:nth-child(3)  { opacity: 1; transform: none; transition-delay: 0.14s; }
[data-stagger].aos-in > *:nth-child(4)  { opacity: 1; transform: none; transition-delay: 0.21s; }
[data-stagger].aos-in > *:nth-child(5)  { opacity: 1; transform: none; transition-delay: 0.28s; }
[data-stagger].aos-in > *:nth-child(6)  { opacity: 1; transform: none; transition-delay: 0.35s; }

/* ============================================================
   STAGGER CHILDREN
   ============================================================ */
.stagger-child {
  opacity: 0;
  transform: translateY(18px) scale(0.98);
  transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.stagger-child.stagger-in {
  opacity: 1;
  transform: none;
}

/* ============================================================
   CURSOR SPOTLIGHT on dark sections
   ============================================================ */
.wd-cta-block,
.wd-proof-stats {
  --spot-x: 50%;
  --spot-y: 50%;
}
.wd-cta-block::after,
.wd-proof-stats::after {
  background:
    radial-gradient(400px circle at var(--spot-x) var(--spot-y),
      rgba(0,176,80,0.12) 0%, transparent 70%),
    radial-gradient(ellipse 700px 400px at 50% -10%,
      rgba(0,176,80,0.07) 0%, transparent 70%);
}

/* ============================================================
   FLOATING ICONS
   ============================================================ */
@keyframes wd-float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-9px); }
}
.wd-service-card:nth-child(1) .wd-service-icon { animation: wd-float 3.8s ease-in-out infinite; }
.wd-service-card:nth-child(2) .wd-service-icon { animation: wd-float 4.2s ease-in-out infinite 0.4s; }
.wd-service-card:nth-child(3) .wd-service-icon { animation: wd-float 3.6s ease-in-out infinite 0.8s; }
.wd-service-card:nth-child(4) .wd-service-icon { animation: wd-float 4.0s ease-in-out infinite 0.2s; }
.wd-service-card:nth-child(5) .wd-service-icon { animation: wd-float 3.9s ease-in-out infinite 0.6s; }
.wd-service-card:nth-child(6) .wd-service-icon { animation: wd-float 4.4s ease-in-out infinite 1.0s; }

/* ============================================================
   CARD TILT (3D hover — enhanced via JS)
   ============================================================ */
.wd-service-card,
.wd-leader-card,
.wd-testimonial-card {
  transform-style: preserve-3d;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  will-change: transform;
}

/* ============================================================
   LEADER CARD — PREMIUM AVATAR
   ============================================================ */
.wd-leader-photo.wd-leader-avatar {
  position: relative;
  width: 120px; height: 120px;
  border-radius: 50%;
  background: linear-gradient(135deg, #008040 0%, #00B050 50%, #5CDBA0 100%);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1.5rem;
  box-shadow:
    0 0 0 4px rgba(0,176,80,0.15),
    0 12px 40px rgba(0,176,80,0.3);
  animation: wd-avatar-pulse 3s ease-in-out infinite;
}
.wd-leader-avatar--alt {
  background: linear-gradient(135deg, #1B5EEA 0%, #0070D2 50%, #38bdf8 100%);
  box-shadow:
    0 0 0 4px rgba(27,94,234,0.15),
    0 12px 40px rgba(27,94,234,0.28);
  animation-delay: 1.5s;
}
@keyframes wd-avatar-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(0,176,80,0.15), 0 12px 40px rgba(0,176,80,0.3); }
  50%       { box-shadow: 0 0 0 8px rgba(0,176,80,0.08), 0 16px 50px rgba(0,176,80,0.45); }
}
.wd-avatar-initials {
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
  position: relative;
  z-index: 1;
}
.wd-avatar-ring {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px dashed rgba(0,176,80,0.3);
  animation: wd-ring-spin 12s linear infinite;
}
.wd-leader-avatar--alt .wd-avatar-ring {
  border-color: rgba(27,94,234,0.3);
}
@keyframes wd-ring-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.wd-leader-card {
  text-align: center;
  padding: 2.5rem 2rem;
}
.wd-leader-photo { font-size: 0; }

/* ============================================================
   PROOF STATS (animated counters)
   ============================================================ */
.wd-proof-stats {
  background:
    radial-gradient(ellipse 700px 350px at -5% 50%, rgba(0,176,80,0.1) 0%, transparent 65%),
    radial-gradient(ellipse 700px 350px at 105% 50%, rgba(90,111,255,0.08) 0%, transparent 65%),
    linear-gradient(135deg, #EEF9F3 0%, #EBF3FF 50%, #F0EEFF 100%);
  position: relative;
  overflow: hidden;
  padding-block: clamp(3rem, 6vw, 5rem);
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
}
.wd-proof-stats::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.wd-proof-stats-inner {
  position: relative;
  z-index: 1;
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.wd-proof-stat {
  flex: 1;
  min-width: 140px;
  text-align: center;
  padding: 1rem;
}
.wd-proof-stat-num {
  font-size: clamp(2.4rem, 4vw, 3.5rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 0.5rem;
  font-variant-numeric: tabular-nums;
}
.wd-proof-stat-label {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--wd-green);
  margin-bottom: 0.3rem;
  letter-spacing: 0.01em;
}
.wd-proof-stat-sub {
  font-size: 0.78rem;
  color: var(--wd-mid);
  line-height: 1.5;
}
.wd-proof-divider {
  width: 1px;
  height: 60px;
  background: var(--wd-border);
  flex-shrink: 0;
  align-self: center;
}

/* ============================================================
   COMPARISON TABLE
   ============================================================ */
.wd-compare {
  background:
    radial-gradient(ellipse 500px 400px at 0% 50%, rgba(90,111,255,0.04) 0%, transparent 60%),
    #F7F8FC;
  border-top: 1px solid var(--wd-border);
}
.wd-compare-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.wd-compare-scroll-hint {
  display: none;
  text-align: right;
  font-size: 0.72rem;
  color: var(--wd-muted);
  margin-bottom: 0.5rem;
}
.wd-compare-wrapper {
  overflow-x: auto;
  border-radius: var(--wd-radius-lg);
  box-shadow: var(--wd-shadow-lg);
  border: 1px solid var(--wd-border);
  -webkit-overflow-scrolling: touch;
}
.wd-compare-table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  background: #fff;
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
}
.wd-compare-table thead tr {
  background: var(--wd-dark);
}
.wd-compare-crit-head {
  padding: 1.1rem 1.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-align: left;
  width: 30%;
}
.wd-compare-col-head {
  padding: 1.1rem 1.25rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  text-align: center;
  vertical-align: middle;
  width: 23%;
}
.wd-compare-col-head--wd {
  background: rgba(0,176,80,0.2);
  position: relative;
}
.wd-compare-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  color: var(--wd-green-light);
  font-weight: 700;
  font-size: 0.9rem;
  margin-bottom: 0.4rem;
}
.wd-compare-badge {
  display: inline-block;
  background: var(--wd-green);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0.2rem 0.55rem;
  border-radius: var(--wd-radius-full);
}
.wd-compare-table tbody tr:nth-child(odd) { background: var(--wd-off-white); }
.wd-compare-table tbody tr:nth-child(even) { background: #fff; }
.wd-compare-table tbody tr:hover td { background: rgba(0,176,80,0.04); }
.wd-compare-crit {
  padding: 1rem 1.25rem;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--wd-dark);
  text-align: left;
  border-right: 1px solid var(--wd-border);
  vertical-align: middle;
}
.wd-crit-icon-wrap {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  margin-right: 0.5rem;
  opacity: 0.55;
}
.wd-compare-wd,
.wd-compare-bad,
.wd-compare-mid {
  padding: 1rem 1rem;
  font-size: 0.82rem;
  font-weight: 500;
  text-align: center;
  vertical-align: middle;
}
.wd-compare-wd {
  background: rgba(0,176,80,0.07);
  color: var(--wd-green-dark);
  font-weight: 600;
  border-left: 2px solid rgba(0,176,80,0.28);
  border-right: 2px solid rgba(0,176,80,0.28);
  position: relative;
  overflow: hidden;
}
.wd-compare-wd::after {
  content: '';
  position: absolute;
  top: 0; left: -60%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent 0%, rgba(0,176,80,0.14) 50%, transparent 100%);
  animation: wd-col-shimmer 4s ease-in-out infinite;
  pointer-events: none;
}
.wd-compare-table tbody tr:nth-child(1) .wd-compare-wd::after { animation-delay: 0s; }
.wd-compare-table tbody tr:nth-child(2) .wd-compare-wd::after { animation-delay: 0.25s; }
.wd-compare-table tbody tr:nth-child(3) .wd-compare-wd::after { animation-delay: 0.5s; }
.wd-compare-table tbody tr:nth-child(4) .wd-compare-wd::after { animation-delay: 0.75s; }
.wd-compare-table tbody tr:nth-child(5) .wd-compare-wd::after { animation-delay: 1s; }
@keyframes wd-col-shimmer {
  0%, 15% { left: -60%; }
  65%, 100% { left: 120%; }
}
.wd-compare-bad { color: #dc2626; }
.wd-compare-mid { color: var(--wd-mid); }

/* Icon badges — larger and visually distinct */
.wd-cmp-check,
.wd-cmp-cross,
.wd-cmp-mid {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-right: 0.4rem;
  vertical-align: middle;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
}
.wd-cmp-check {
  background: rgba(0,176,80,0.14);
  color: var(--wd-green-dark);
}
.wd-cmp-check::before { content: '✓'; }
.wd-cmp-cross {
  background: rgba(220,38,38,0.1);
  color: #dc2626;
}
.wd-cmp-cross::before { content: '✗'; }
.wd-cmp-mid {
  background: rgba(139,147,166,0.12);
  color: var(--wd-muted);
}
.wd-cmp-mid::before  { content: '—'; }

/* Timeline race bar visualisation */
.wd-tl-bar {
  height: 5px;
  border-radius: 3px;
  margin-top: 0.5rem;
  width: 0;
}
.wd-tl-wd       { background: var(--wd-green); animation: wd-race-wd   4.8s ease-in-out infinite; }
.wd-tl-big4     { background: #ef4444;          animation: wd-race-big4 4.8s ease-in-out infinite; }
.wd-tl-boutique { background: var(--wd-muted);  animation: wd-race-bout 4.8s ease-in-out infinite; }

@keyframes wd-race-wd {
  0%, 5%   { width: 0; }
  22%, 70% { width: 38%; }
  88%, 100%{ width: 0; }
}
@keyframes wd-race-bout {
  0%, 18%  { width: 0; }
  40%, 70% { width: 62%; }
  88%, 100%{ width: 0; }
}
@keyframes wd-race-big4 {
  0%, 30%  { width: 0; }
  56%, 70% { width: 100%; }
  88%, 100%{ width: 0; }
}

/* ── Clock hand spin ── */
.wd-hand-h, .wd-hand-m {
  transform-box: view-box;
  transform-origin: 50% 50%;
}
.wd-hand-h { animation: wd-hand-spin 10s linear infinite; }
.wd-hand-m { animation: wd-hand-spin  2s linear infinite; }
@keyframes wd-hand-spin { to { transform: rotate(360deg); } }

/* ── Lock shackle bounce ── */
.wd-lock-shackle {
  animation: wd-lock-bob 3s ease-in-out infinite;
}
@keyframes wd-lock-bob {
  0%, 60%, 100% { transform: translateY(0);    }
  20%           { transform: translateY(-2.5px); }
  40%           { transform: translateY(0);    }
}

/* ── Star spin (AI row) ── */
.wd-star-spin {
  transform-box: view-box;
  transform-origin: 50% 50%;
  animation: wd-star-twirl 6s ease-in-out infinite;
}
@keyframes wd-star-twirl {
  0%, 100% { transform: rotate(0deg) scale(1); }
  30%      { transform: rotate(18deg) scale(1.15); }
  60%      { transform: rotate(-10deg) scale(0.95); }
}

/* ── Shield / ROI checkmark draw-in ── */
.wd-shield-check, .wd-roi-check {
  stroke-dasharray: 15;
  stroke-dashoffset: 15;
  animation: wd-check-draw 4s ease-in-out infinite;
}
.wd-roi-check { animation-delay: 0.6s; }
@keyframes wd-check-draw {
  0%, 12%  { stroke-dashoffset: 15; opacity: 0.25; }
  42%, 82% { stroke-dashoffset: 0;  opacity: 1; }
  96%, 100%{ stroke-dashoffset: 15; opacity: 0.25; }
}

/* ── WD check-badge pulse ── */
.wd-compare-wd .wd-cmp-check {
  animation: wd-badge-pop 3s ease-in-out infinite;
}
.wd-compare-table tbody tr:nth-child(2) .wd-compare-wd .wd-cmp-check { animation-delay: 0.4s; }
.wd-compare-table tbody tr:nth-child(3) .wd-compare-wd .wd-cmp-check { animation-delay: 0.8s; }
.wd-compare-table tbody tr:nth-child(4) .wd-compare-wd .wd-cmp-check { animation-delay: 1.2s; }
.wd-compare-table tbody tr:nth-child(5) .wd-compare-wd .wd-cmp-check { animation-delay: 1.6s; }
@keyframes wd-badge-pop {
  0%, 100% { transform: scale(1);    box-shadow: none; }
  50%      { transform: scale(1.18); box-shadow: 0 0 0 3px rgba(0,176,80,0.18); }
}

/* ── WD badge glow pulse ── */
.wd-compare-badge {
  animation: wd-badge-glow-pulse 2.5s ease-in-out infinite;
}
@keyframes wd-badge-glow-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,176,80,0.5); }
  50%      { box-shadow: 0 0 0 5px rgba(0,176,80,0); }
}

/* ── WD lightning bolt pulse ── */
.wd-bolt-pulse {
  animation: wd-bolt-flash 2.8s ease-in-out infinite;
  transform-box: view-box;
  transform-origin: 50% 50%;
}
@keyframes wd-bolt-flash {
  0%, 100%{ opacity: 0.7; filter: drop-shadow(0 0 0px transparent); }
  45%     { opacity: 1;   filter: drop-shadow(0 0 4px rgba(0,176,80,0.9)); }
}

.wd-compare-footnote {
  text-align: center;
  margin-top: 2.5rem;
}

/* ============================================================
   ROI CALCULATOR
   ============================================================ */
.wd-roi-calc {
  background:
    radial-gradient(ellipse 500px 400px at 100% 100%, rgba(0,176,80,0.04) 0%, transparent 60%),
    #FFFFFF;
}
.wd-roi-inner {
  max-width: 860px;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.wd-roi-header {
  text-align: center;
  margin-bottom: 3rem;
}
.wd-roi-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: var(--wd-radius-xl);
  padding: clamp(1.5rem, 4vw, 3rem);
  box-shadow: var(--wd-shadow-card), 0 0 0 1px rgba(14,17,23,0.04);
}
.wd-roi-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 2.5rem;
}
.wd-roi-slider-wrap { display: flex; flex-direction: column; gap: 0.75rem; }
.wd-roi-slider-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--wd-dark);
}
.wd-roi-slider-label strong {
  color: var(--wd-green);
  font-size: 1rem;
}
.wd-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 5px;
  border-radius: 5px;
  background: var(--wd-border);
  outline: none;
  cursor: pointer;
  transition: background 0.15s;
}
.wd-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--wd-green);
  cursor: pointer;
  box-shadow: 0 0 0 4px rgba(0,176,80,0.15);
  transition: box-shadow 0.2s, transform 0.1s;
}
.wd-range::-webkit-slider-thumb:hover { box-shadow: 0 0 0 6px rgba(0,176,80,0.22); transform: scale(1.1); }
.wd-range::-moz-range-thumb {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--wd-green);
  cursor: pointer;
  border: none;
  box-shadow: 0 0 0 4px rgba(0,176,80,0.15);
}
.wd-range-ticks {
  display: flex;
  justify-content: space-between;
  font-size: 0.7rem;
  color: var(--wd-muted);
}
.wd-roi-outputs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}
.wd-roi-output {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius-lg);
  padding: 1.5rem 1.25rem;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
}
.wd-roi-output:hover { transform: translateY(-2px); box-shadow: var(--wd-shadow); }
.wd-roi-output--primary {
  background: linear-gradient(135deg, #008040 0%, #00B050 100%);
  border-color: transparent;
  box-shadow: 0 8px 28px rgba(0,176,80,0.3);
}
.wd-roi-output--primary .wd-roi-output-val { color: #fff; }
.wd-roi-output--primary .wd-roi-output-label { color: rgba(255,255,255,0.8); }
.wd-roi-output--primary .wd-roi-output-icon { color: rgba(255,255,255,0.7); }
.wd-roi-output-icon {
  color: var(--wd-green);
  margin-bottom: 0.5rem;
  display: flex;
  justify-content: center;
}
.wd-roi-output-icon svg { width: 22px; height: 22px; }
.wd-roi-output-val {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  margin-bottom: 0.35rem;
  font-variant-numeric: tabular-nums;
  transition: all 0.3s ease;
}
.wd-roi-output-label {
  font-size: 0.75rem;
  color: var(--wd-mid);
  font-weight: 500;
  line-height: 1.4;
}
.wd-roi-note {
  font-size: 0.72rem;
  color: var(--wd-muted);
  text-align: center;
  line-height: 1.5;
  margin-top: 0.5rem;
}

/* ============================================================
   INSIGHT CARD THUMBNAILS
   ============================================================ */
.wd-insight-thumb {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--wd-radius-lg) var(--wd-radius-lg) 0 0;
  flex-shrink: 0;
}
.wd-insight-thumb--ai  { background: linear-gradient(135deg, #10b981 0%, #0891b2 100%); }
.wd-insight-thumb--cfo { background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%); }
.wd-insight-thumb--mfg { background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); }

/* ============================================================
   TESTIMONIAL ENHANCEMENTS
   ============================================================ */
.wd-testimonial-stars {
  color: #f59e0b;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  margin-bottom: 1rem;
}

/* ============================================================
   MICRO-ANIMATIONS — FRAMER-MOTION-INSPIRED ACROSS ALL SECTIONS
   ============================================================ */

/* ── Hero ──────────────────────────────────────────────────── */

.wd-hero-badge {
  animation: wd-badge-float 4s ease-in-out infinite;
}
@keyframes wd-badge-float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-5px); }
}

.wd-hero-badge .dot {
  animation: wd-dot-pulse 2s ease-in-out infinite;
}
@keyframes wd-dot-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,176,80,0.5), 0 0 0 3px rgba(0,176,80,0.15); }
  50%       { box-shadow: 0 0 0 5px rgba(0,176,80,0), 0 0 0 3px rgba(0,176,80,0.08); }
}

/* Dashboard bars — staggered spring rise on page load */
.wd-dash-bar-fill {
  animation: wd-bar-spring-rise 1.4s cubic-bezier(0.34,1.56,0.64,1) forwards;
  transform-origin: bottom;
  transform: scaleY(0);
}
.wd-dash-bar-item:nth-child(1) .wd-dash-bar-fill { animation-delay: 0.15s; }
.wd-dash-bar-item:nth-child(2) .wd-dash-bar-fill { animation-delay: 0.28s; }
.wd-dash-bar-item:nth-child(3) .wd-dash-bar-fill { animation-delay: 0.41s; }
.wd-dash-bar-item:nth-child(4) .wd-dash-bar-fill { animation-delay: 0.54s; }
.wd-dash-bar-item:nth-child(5) .wd-dash-bar-fill { animation-delay: 0.67s; }
.wd-dash-bar-item:nth-child(6) .wd-dash-bar-fill { animation-delay: 0.80s; }
@keyframes wd-bar-spring-rise {
  0%   { transform: scaleY(0); }
  100% { transform: scaleY(1); }
}

/* ── Partner Strip — contrast fix ──────────────────────────── */

.wd-partner-logo {
  border-color: rgba(14,17,23,0.12);
  color: var(--wd-dark);
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
}
.wd-partner-logo:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,0.1);
}
.wd-pl-ms svg     { color: #0078D4; }
.wd-pl-oracle svg { color: #C74634; }
.wd-pl-aws svg    { color: #FF9900; }
.wd-pl-mulesoft svg { color: #0176D3; }

.wd-summit-badge {
  animation: wd-summit-glow 3.5s ease-in-out infinite;
}
@keyframes wd-summit-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,176,80,0); }
  50%       { box-shadow: 0 0 0 7px rgba(0,176,80,0.12), 0 4px 20px rgba(0,176,80,0.12); }
}

.wd-logo-pill {
  transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.28s ease;
}
.wd-logo-pill:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
}

/* ── Proof Stats ───────────────────────────────────────────── */

.wd-proof-stat {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-proof-stat:hover { transform: translateY(-5px) scale(1.03); }

.wd-proof-stat-num {
  animation: wd-stat-glow 5s ease-in-out infinite;
}
@keyframes wd-stat-glow {
  0%, 100% { text-shadow: none; }
  50%       { text-shadow: 0 0 24px rgba(0,176,80,0.22); }
}

/* ── Proof Stats — Card Layout ──────────────────────────────── */

.wd-proof-cards-row {
  position: relative;
  z-index: 1;
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  padding-top: 0.25rem;
  padding-bottom: 0.5rem;
}

.wd-proof-card {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: 20px;
  padding: 1.75rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s ease;
}
.wd-proof-card:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 12px 40px rgba(0,0,0,0.1), 0 0 0 2px rgba(0,176,80,0.08);
}
.wd-proof-card--hero {
  background: linear-gradient(145deg, #F4FBF7 0%, #EAF7EF 100%);
  border-color: rgba(0,176,80,0.2);
  box-shadow: 0 2px 12px rgba(0,176,80,0.08), 0 1px 3px rgba(0,176,80,0.06);
}
.wd-proof-card--hero:hover {
  box-shadow: 0 12px 40px rgba(0,176,80,0.14), 0 0 0 2px rgba(0,176,80,0.14);
}

.wd-proof-card-vis {
  width: 100%;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.75rem;
  position: relative;
  overflow: visible;
}

.wd-proof-card-num {
  font-size: clamp(2.1rem, 3.2vw, 2.9rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  animation: wd-stat-glow 5s ease-in-out infinite;
}
.wd-proof-card-label {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.02em;
  margin-top: 0.4rem;
}
.wd-proof-card-sub {
  font-size: 0.74rem;
  color: var(--wd-muted);
  line-height: 1.55;
  margin-top: 0.25rem;
}

/* ── Network Vis (Card 1) ─────────────────────────────────── */

.wd-vis-network {
  position: relative;
  width: 110px;
  height: 110px;
  flex-shrink: 0;
}
.wd-vn-ring {
  position: absolute;
  border-radius: 50%;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  border: 1.5px dashed rgba(0,176,80,0.2);
  pointer-events: none;
}
.wd-vnr-1 { width: 68px; height: 68px; }
.wd-vnr-2 { width: 102px; height: 102px; border-color: rgba(0,176,80,0.1); }

.wd-vn-orbit {
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
.wd-vno-1 { animation: wd-orbit-cw 6s linear infinite; }
.wd-vno-2 { animation: wd-orbit-cw 9s linear infinite reverse; }
.wd-vno-3 { animation: wd-orbit-cw 13s linear infinite; }

.wd-vn-dot {
  position: absolute;
  width: 8px; height: 8px;
  border-radius: 50%;
  top: 0; left: 50%;
  margin-left: -4px;
}
.wd-vnd-g { background: #00B050; box-shadow: 0 0 6px rgba(0,176,80,0.7); }
.wd-vnd-b { background: #5A6FFF; box-shadow: 0 0 6px rgba(90,111,255,0.7); }
.wd-vnd-p { background: #8B5CF6; box-shadow: 0 0 6px rgba(139,92,246,0.7); }

.wd-vn-core {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 42px; height: 42px;
  background: linear-gradient(135deg, #00C55A, #008040);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 8px rgba(0,176,80,0.1);
  animation: wd-core-breathe 3s ease-in-out infinite;
  z-index: 2;
}

.wd-vn-tag {
  position: absolute;
  background: #fff;
  border: 1px solid rgba(0,176,80,0.25);
  color: #007A35;
  font-size: 0.58rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--wd-radius-full);
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  z-index: 3;
  animation: wd-badge-float 4s ease-in-out infinite;
}
.wd-vnt-1 { top: 6px; right: -4px; animation-delay: 0s; }
.wd-vnt-2 { bottom: 14px; left: -10px; animation-delay: 1.4s; }
.wd-vnt-3 { bottom: 6px; right: -2px; animation-delay: 2.7s; }

/* ── TCO Vis (Card 2) ─────────────────────────────────────── */

.wd-vis-tco {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
}
.wd-tco-chart {
  display: flex;
  align-items: flex-end;
  gap: 1.75rem;
  height: 74px;
}
.wd-tco-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.wd-tco-bar {
  border-radius: 5px 5px 0 0;
  width: 28px;
  animation: wd-tco-grow 3.2s ease-in-out infinite;
  transform-origin: bottom;
}
.wd-tco-others .wd-tco-bar {
  height: 72px;
  background: linear-gradient(to top, #F87171, #FECACA);
  border: 1px solid rgba(248,113,113,0.4);
}
.wd-tco-wd .wd-tco-bar {
  height: 50px;
  background: linear-gradient(to top, #00B050, #5CDBA0);
  border: 1px solid rgba(0,176,80,0.35);
  animation-delay: 0.1s;
}
@keyframes wd-tco-grow {
  0%, 8% { transform: scaleY(0.1); }
  30%, 80% { transform: scaleY(1); }
  95%, 100% { transform: scaleY(0.1); }
}
.wd-tco-label {
  font-size: 0.6rem;
  font-weight: 600;
  color: var(--wd-muted);
  white-space: nowrap;
}
.wd-tco-save {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(0,176,80,0.1);
  border: 1px solid rgba(0,176,80,0.22);
  color: #007A35;
  font-size: 0.67rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: var(--wd-radius-full);
  animation: wd-badge-float 3s ease-in-out infinite;
  animation-delay: 0.5s;
}

/* ── Rocket Vis (Card 3) ─────────────────────────────────── */

.wd-vis-rocket {
  position: relative;
  width: 110px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wd-rkt-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  animation: wd-rkt-hover 2.4s ease-in-out infinite;
  z-index: 2;
}
@keyframes wd-rkt-hover {
  0%, 100% { transform: translateY(4px); }
  50%       { transform: translateY(-8px); }
}
.wd-rkt-body { display: flex; }
.wd-rkt-flame {
  display: flex;
  gap: 2px;
  justify-content: center;
  margin-top: -3px;
}
.wd-rfl-1, .wd-rfl-2 {
  border-radius: 0 0 4px 4px;
}
.wd-rfl-1 {
  width: 8px; height: 14px;
  background: linear-gradient(to top, #FF6B00, #FFCC00);
  animation: wd-flame-anim 0.22s ease-in-out infinite alternate;
}
.wd-rfl-2 {
  width: 5px; height: 10px;
  background: linear-gradient(to top, #FF9500, #FFEE00);
  animation: wd-flame-anim 0.22s ease-in-out infinite alternate-reverse;
}

.wd-rkt-speed {
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-60%);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.wd-rsp-1, .wd-rsp-2, .wd-rsp-3 {
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(to right, transparent, rgba(0,176,80,0.55));
  animation: wd-rsp-sweep 1.3s ease-in-out infinite;
}
.wd-rsp-1 { width: 24px; animation-delay: 0s; }
.wd-rsp-2 { width: 18px; animation-delay: 0.22s; }
.wd-rsp-3 { width: 12px; animation-delay: 0.44s; }
@keyframes wd-rsp-sweep {
  0%   { transform: scaleX(0) translateX(-4px); opacity: 0; }
  25%  { opacity: 1; }
  65%  { transform: scaleX(1) translateX(0); opacity: 1; }
  100% { transform: scaleX(0) translateX(-4px); opacity: 0; }
}

.wd-rkt-badge {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: #fff;
  border: 1px solid rgba(0,176,80,0.25);
  color: var(--wd-dark);
  font-size: 0.57rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--wd-radius-full);
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,0.09);
  z-index: 3;
}

/* Responsive */
@media (max-width: 768px) {
  .wd-proof-cards-row { grid-template-columns: 1fr; }
}

/* ── Services — per-icon colored glow ─────────────────────── */

/* Icon glow via box-shadow on hover — brand green */
.wd-service-card:hover .wd-svc-sf,
.wd-service-card:hover .wd-svc-ai,
.wd-service-card:hover .wd-svc-data,
.wd-service-card:hover .wd-svc-mgd,
.wd-service-card:hover .wd-svc-cloud,
.wd-service-card:hover .wd-svc-ms { box-shadow: 0 0 0 8px rgba(0,176,80,0.15), 0 8px 24px rgba(0,176,80,0.28); }

.wd-service-icon {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s ease;
}

/* ── Proof Card — Chamfered (Ref 03) ───────────────────────── */

.wd-pcs {
  filter: drop-shadow(0 3px 14px rgba(0,0,0,0.07));
}
.wd-pcs--hero {
  filter: drop-shadow(0 6px 24px rgba(0,176,80,0.22));
}
.wd-proof-card {
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
  border-radius: 0;
  box-shadow: none;
}
.wd-proof-card--hero {
  background: linear-gradient(145deg, #00C55A 0%, #007230 100%);
  border-color: transparent;
}
.wd-proof-card--hero .wd-proof-card-num  { color: #fff; }
.wd-proof-card--hero .wd-proof-card-label { color: rgba(255,255,255,0.9); }
.wd-proof-card--hero .wd-proof-card-sub  { color: rgba(255,255,255,0.65); }
.wd-proof-card--hero .wd-tco-label       { color: rgba(255,255,255,0.75); }
.wd-proof-card--hero .wd-tco-save        {
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.3);
  color: #fff;
}
.wd-proof-card--hero .wd-tco-others .wd-tco-bar { opacity: 0.7; }

/* ── Service Card — Illustration Areas (Ref 02) ───────────── */

.wd-service-card {
  padding: 0;
  overflow: hidden;
}
.wd-svc-illus {
  width: 100%;
  height: 140px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Per-card illustration backgrounds */
.wd-svc-illus--sf   { background: linear-gradient(140deg, #E8F9EE 0%, #C8F0DA 100%); }
.wd-svc-illus--ai   { background: linear-gradient(140deg, #00853A 0%, #00B050 100%); }
.wd-svc-illus--data { background: linear-gradient(140deg, #EAF7F3 0%, #C5EDD8 100%); }
.wd-svc-illus--mgd  { background: linear-gradient(140deg, #063A1C 0%, #0B6B30 100%); }
.wd-svc-illus--cloud{ background: linear-gradient(140deg, #E0F5FA 0%, #B8E8F3 100%); }
.wd-svc-illus--ms   { background: linear-gradient(140deg, #EEF8F1 0%, #D3EFE0 100%); }

/* Abstract decorative blobs */
.wd-svc-illus::before,
.wd-svc-illus::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.wd-svc-illus::before {
  width: 90px; height: 90px;
  top: -25px; right: -20px;
  background: rgba(255,255,255,0.18);
}
.wd-svc-illus::after {
  width: 55px; height: 55px;
  bottom: -15px; left: 15px;
  background: rgba(255,255,255,0.12);
}

.wd-sil-icon {
  width: 56px; height: 56px;
  background: linear-gradient(145deg, #00C55A, #007A35);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.25);
  position: relative;
  z-index: 2;
}
/* Dark-bg cards use lighter icon treatment */
.wd-svc-illus--ai .wd-sil-icon,
.wd-svc-illus--mgd .wd-sil-icon {
  background: rgba(255,255,255,0.18);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.25);
  backdrop-filter: blur(8px);
}

.wd-sil-chip {
  position: absolute;
  bottom: 10px; left: 12px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0,176,80,0.18);
  color: #007A35;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--wd-radius-full);
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  letter-spacing: 0.02em;
}
.wd-sil-chip--light {
  background: rgba(255,255,255,0.2);
  border-color: rgba(255,255,255,0.35);
  color: #fff;
}

/* Mini UI rows (card 1 - Salesforce) */
.wd-sil-mini-ui {
  position: absolute;
  right: 16px; top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 5px;
  z-index: 2;
}
.wd-sil-row {
  display: flex;
  align-items: center;
  gap: 5px;
}
.wd-sil-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.wd-sil-d1 { background: rgba(0,176,80,0.55); }
.wd-sil-d2 { background: rgba(0,176,80,0.35); }
.wd-sil-d3 { background: rgba(0,176,80,0.25); }
.wd-sil-bar {
  height: 5px;
  border-radius: 3px;
  background: rgba(0,176,80,0.22);
  display: block;
}

/* Orbiting elements (card 2 - AI) */
.wd-sil-orbits {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}
.wd-sil-orb {
  position: absolute;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.2);
}
.wd-sil-orb-1 { width: 70px; height: 70px; top: 50%; left: 50%; transform: translate(-50%,-50%); animation: wd-ring-clockwise 8s linear infinite; }
.wd-sil-orb-2 { width: 100px; height: 100px; top: 50%; left: 50%; transform: translate(-50%,-50%); animation: wd-ring-clockwise 14s linear infinite reverse; }
.wd-sil-orb-3 { width: 130px; height: 130px; top: 50%; left: 50%; transform: translate(-50%,-50%); animation: wd-ring-clockwise 20s linear infinite; }

/* Bar chart (card 3 - Data) */
.wd-sil-chart {
  position: absolute;
  right: 16px;
  bottom: 14px;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  z-index: 2;
}
.wd-sil-bar-v {
  width: 10px;
  border-radius: 3px 3px 0 0;
  background: rgba(0,176,80,0.3);
  display: block;
}
.wd-sil-bar-v--hi { background: rgba(0,176,80,0.65); }

/* Gauge arc (card 4 - Managed) */
.wd-sil-gauge {
  position: absolute;
  right: 12px; top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

/* Pipeline (card 5 - Cloud) */
.wd-sil-pipeline {
  position: absolute;
  right: 10px; top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 3px;
  z-index: 2;
}
.wd-sil-step {
  background: rgba(0,176,80,0.18);
  border: 1px solid rgba(0,176,80,0.3);
  color: #007A35;
  font-size: 0.55rem;
  font-weight: 700;
  padding: 3px 6px;
  border-radius: 5px;
}
.wd-sil-step-3 { background: rgba(0,176,80,0.35); }
.wd-sil-arrow { font-size: 0.65rem; color: rgba(0,120,60,0.5); line-height: 1; }

/* Connect nodes (card 6 - MS) */
.wd-sil-connect {
  position: absolute;
  right: 10px; top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 3px;
  z-index: 2;
}
.wd-sil-node {
  width: 26px; height: 26px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0;
}
.wd-sn-ms { background: rgba(0,120,212,0.15); color: #0078D4; border: 1px solid rgba(0,120,212,0.25); }
.wd-sn-sf { background: rgba(0,176,80,0.15); color: #007A35; border: 1px solid rgba(0,176,80,0.3); }
.wd-sn-or { background: rgba(199,70,52,0.12); color: #C74634; border: 1px solid rgba(199,70,52,0.22); }
.wd-sil-conn-line {
  width: 14px; height: 2px;
  background: linear-gradient(to right, rgba(0,176,80,0.3), rgba(0,176,80,0.15));
  border-radius: 1px;
}

/* Service body below illustration */
.wd-svc-body {
  padding: 1.5rem 1.75rem 1.5rem;
}

/* ── Logo Pills — Square Card Style (Ref 01) ─────────────── */

.wd-logo-pill {
  width: 80px;
  height: 80px;
  padding: 12px;
  min-width: unset;
  max-width: unset;
  border-radius: 18px;
  flex-direction: column;
  gap: 4px;
  border: 1px solid rgba(14,17,23,0.07);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 0 0 0 rgba(0,176,80,0);
  transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.28s ease;
}
.wd-logo-pill:hover {
  transform: translateY(-6px) scale(1.06);
  box-shadow: 0 12px 28px rgba(0,0,0,0.12), 0 0 0 2px rgba(0,176,80,0.1);
}
.wd-logo-img {
  height: 38px;
  max-width: 56px;
  object-fit: contain;
  display: block;
}

/* ── Framework / Phases ────────────────────────────────────── */

/* Phase slide-in from left, staggered */
.wd-phase {
  opacity: 0;
  transform: translateX(-22px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-phases.aos-in .wd-phase              { opacity: 1; transform: translateX(0); }
.wd-phases.aos-in .wd-phase:nth-child(1) { transition-delay: 0.04s; }
.wd-phases.aos-in .wd-phase:nth-child(2) { transition-delay: 0.13s; }
.wd-phases.aos-in .wd-phase:nth-child(3) { transition-delay: 0.22s; }
.wd-phases.aos-in .wd-phase:nth-child(4) { transition-delay: 0.31s; }
.wd-phases.aos-in .wd-phase:nth-child(5) { transition-delay: 0.40s; }
.wd-phases.aos-in .wd-phase:nth-child(6) { transition-delay: 0.49s; }

/* Phase number spring pop */
.wd-phase-num {
  transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s ease;
}
.wd-phase:hover .wd-phase-num {
  transform: scale(1.22);
  box-shadow: 0 0 0 6px rgba(0,176,80,0.14);
}

/* Trajectory arc draw-in */
.wd-traj-draw {
  stroke-dasharray: 420;
  stroke-dashoffset: 420;
  animation: wd-traj-draw-in 2.6s cubic-bezier(0.4,0,0.2,1) 0.6s forwards;
}
@keyframes wd-traj-draw-in { to { stroke-dashoffset: 0; } }

/* Flame flicker */
.wd-flame-flicker {
  transform-box: view-box;
  transform-origin: 50% 100%;
  animation: wd-flame-anim 1.5s ease-in-out infinite;
}
@keyframes wd-flame-anim {
  0%, 100% { transform: scaleY(1)    scaleX(1);    opacity: 0.22; }
  20%       { transform: scaleY(1.4) scaleX(0.82); opacity: 0.65; }
  50%       { transform: scaleY(0.85) scaleX(1.12); opacity: 0.3; }
  75%       { transform: scaleY(1.25) scaleX(0.88); opacity: 0.55; }
}

/* IP badge shimmer */
.wd-framework-ip {
  position: relative;
  overflow: hidden;
}
.wd-framework-ip::after {
  content: '';
  position: absolute;
  top: 0; left: -70%; width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  animation: wd-ip-sweep 4.5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes wd-ip-sweep {
  0%, 18%   { left: -70%; }
  65%, 100% { left: 130%; }
}

/* ── Testimonials ──────────────────────────────────────────── */

/* Colored header shimmer cascade */
.wd-testi-hdr-green,
.wd-testi-hdr-blue,
.wd-testi-hdr-purple {
  position: relative;
  overflow: hidden;
}
.wd-testi-hdr-green::after,
.wd-testi-hdr-blue::after,
.wd-testi-hdr-purple::after {
  content: '';
  position: absolute;
  top: 0; left: -80%; width: 55%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
  animation: wd-hdr-sweep 5.5s ease-in-out infinite;
  pointer-events: none;
}
.wd-testi-hdr-blue::after   { animation-delay: 1.8s; }
.wd-testi-hdr-purple::after { animation-delay: 3.6s; }
@keyframes wd-hdr-sweep {
  0%, 12%   { left: -80%; }
  60%, 100% { left: 130%; }
}

/* Metric number float */
.wd-testi-metric-num {
  display: inline-block;
  animation: wd-metric-bounce 3.2s ease-in-out infinite;
}
@keyframes wd-metric-bounce {
  0%, 100% { transform: translateY(0) scale(1); }
  50%       { transform: translateY(-4px) scale(1.05); }
}

/* Star sparkle stagger */
.wd-testimonial-stars span {
  display: inline-block;
  animation: wd-sparkle 3s ease-in-out infinite;
}
.wd-testimonial-stars span:nth-child(1) { animation-delay: 0s; }
.wd-testimonial-stars span:nth-child(2) { animation-delay: 0.14s; }
.wd-testimonial-stars span:nth-child(3) { animation-delay: 0.28s; }
.wd-testimonial-stars span:nth-child(4) { animation-delay: 0.42s; }
.wd-testimonial-stars span:nth-child(5) { animation-delay: 0.56s; }
@keyframes wd-sparkle {
  0%, 55%, 100% { transform: scale(1) rotate(0deg);   filter: brightness(1); }
  28%            { transform: scale(1.35) rotate(18deg); filter: brightness(1.5); }
}

/* Testimonial card hover lift */
.wd-testimonial {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s ease;
}
.wd-testimonial:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(0,0,0,0.1);
}

/* ── Insights ──────────────────────────────────────────────── */

/* Thumb brightness breathe */
.wd-insight-thumb {
  animation: wd-thumb-pulse 4s ease-in-out infinite;
}
@keyframes wd-thumb-pulse {
  0%, 100% { filter: brightness(1) saturate(1); }
  50%       { filter: brightness(1.08) saturate(1.12); }
}

/* Card: top rainbow border draw-in on hover */
.wd-insight-card {
  position: relative;
}
.wd-insight-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--wd-green) 0%, #5A6FFF 50%, #8B5CF6 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s cubic-bezier(0.34,1.56,0.64,1);
  z-index: 1;
}
.wd-insight-card:hover::before { transform: scaleX(1); }

/* Tag shimmer */
.wd-insight-tag {
  position: relative;
  overflow: hidden;
}
.wd-insight-tag::after {
  content: '';
  position: absolute;
  top: 0; left: -80%; width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(0,176,80,0.28), transparent);
  animation: wd-tag-sweep 6s ease-in-out infinite;
  pointer-events: none;
}
.wd-insights-grid article:nth-child(2) .wd-insight-tag::after { animation-delay: 2s; }
.wd-insights-grid article:nth-child(3) .wd-insight-tag::after { animation-delay: 4s; }
@keyframes wd-tag-sweep {
  0%, 18%   { left: -80%; }
  65%, 100% { left: 130%; }
}

/* ── Leadership ────────────────────────────────────────────── */

/* Radar ping rings */
.wd-radar-ring {
  position: absolute;
  border-radius: 50%;
  border: 1.5px solid var(--wd-green);
  opacity: 0;
  pointer-events: none;
  animation: wd-radar-ping 3.2s ease-out infinite;
}
.wd-radar-r1 { inset: -10px; animation-delay: 0s; }
.wd-radar-r2 { inset: -22px; animation-delay: 1.6s; }
.wd-leader-avatar--alt .wd-radar-r1,
.wd-leader-avatar--alt .wd-radar-r2 {
  border-color: #1B5EEA;
}
@keyframes wd-radar-ping {
  0%   { transform: scale(0.85); opacity: 0.5; }
  75%  { transform: scale(1.3);  opacity: 0; }
  100% { transform: scale(1.3);  opacity: 0; }
}

/* LinkedIn icon button — no underline needed */

/* ── CTA Block — ring rotations ────────────────────────────── */

.wd-cta-ring {
  transform-box: view-box;
  transform-origin: 50% 50%;
}
.wd-cta-ring-1 { animation: wd-rot-cw  22s linear infinite; }
.wd-cta-ring-2 { animation: wd-rot-ccw 34s linear infinite; }
.wd-cta-ring-3 { animation: wd-rot-cw  50s linear infinite; }
.wd-cta-ring-4 { animation: wd-rot-ccw 72s linear infinite; }
@keyframes wd-rot-cw  { to { transform: rotate(360deg);  } }
@keyframes wd-rot-ccw { to { transform: rotate(-360deg); } }

/* Central dot pulse */
.wd-cta-deco svg circle[r="6"] {
  transform-box: view-box;
  transform-origin: 50% 50%;
  animation: wd-cta-core-pulse 2.8s ease-in-out infinite;
}
@keyframes wd-cta-core-pulse {
  0%, 100% { transform: scale(1);   opacity: 0.35; }
  50%       { transform: scale(1.7); opacity: 0.6; }
}

/* ── Footer ────────────────────────────────────────────────── */

.wd-footer-col ul li a {
  position: relative;
  display: inline-block;
  transition: color 0.2s ease, transform 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-footer-col ul li a::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0;
  width: 100%; height: 1.5px;
  background: var(--wd-green);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.32s cubic-bezier(0.34,1.56,0.64,1);
}
.wd-footer-col ul li a:hover { transform: translateX(4px); }
.wd-footer-col ul li a:hover::after { transform: scaleX(1); }

.wd-footer-badge {
  animation: wd-footer-star-glow 4s ease-in-out infinite;
}
@keyframes wd-footer-star-glow {
  0%, 100% { box-shadow: none; }
  50%       { box-shadow: 0 0 0 5px rgba(0,153,68,0.16), 0 4px 16px rgba(0,153,68,0.12); }
}

/* ── Button ripple ─────────────────────────────────────────── */
@keyframes wd-ripple {
  0%   { transform: scale(0); opacity: 0.5; }
  100% { transform: scale(1); opacity: 0; }
}

/* ── Accessibility ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .wd-hero-badge,
  .wd-hero-badge .dot,
  .wd-dash-bar-fill,
  .wd-summit-badge,
  .wd-proof-stat-num,
  .wd-traj-draw,
  .wd-flame-flicker,
  .wd-framework-ip::after,
  .wd-testi-hdr-green::after,
  .wd-testi-hdr-blue::after,
  .wd-testi-hdr-purple::after,
  .wd-testi-metric-num,
  .wd-testimonial-stars span,
  .wd-insight-thumb,
  .wd-insight-tag::after,
  .wd-radar-ring,
  .wd-cta-ring,
  .wd-footer-badge {
    animation: none !important;
  }
  .wd-dash-bar-fill { transform: scaleY(1); }
  [data-aos]        { opacity: 1; transform: none; transition: none; }
  .stagger-child    { opacity: 1; transform: none; transition: none; }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .wd-hero-inner { grid-template-columns: 1fr; }
  .wd-hero-card { display: none; }
  .wd-framework-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .wd-tab-panel.active { grid-template-columns: 1fr; }
  .wd-cxo-visual { display: none; }
  .wd-footer-top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

@media (max-width: 768px) {
  .wd-nav-wrap { display: none; }
  .wd-nav-wrap.open {
    display: flex;
    flex-direction: column;
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.98);
    backdrop-filter: blur(20px);
    z-index: 99;
    padding: 5rem 1.5rem 2rem;
    overflow-y: auto;
  }
  .wd-nav { flex-direction: column; align-items: flex-start; width: 100%; height: auto; }
  .wd-nav-indicator, .wd-nav-hover-bg { display: none !important; }
  .wd-nav > li { width: 100%; height: auto; }
  .wd-nav > li > a { width: 100%; height: auto; padding: 0.9rem 1rem; font-size: 1rem; color: var(--wd-body); }
  .sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    border-radius: 0;
    padding: 0 0 0 1rem;
    background: none;
    min-width: 0;
    display: none;
  }
  .wd-nav > li:hover .sub-menu { display: block; }
  .sub-menu li a { font-size: 0.9rem; }
  .wd-menu-toggle { display: flex; }
  .wd-footer-top { grid-template-columns: 1fr; gap: 1.5rem; }
  .wd-hero-stats { gap: 1.5rem; }
  .wd-tabs { flex-direction: column; width: 100%; }
  .wd-tab-btn { width: 100%; justify-content: center; }
  .wd-outcomes-grid, .wd-services-grid, .wd-testimonials-grid { grid-template-columns: 1fr; }
  .wd-industry-grid { grid-template-columns: repeat(2, 1fr); }
  .wd-leadership-grid { grid-template-columns: 1fr 1fr; }
  .wd-footer-bottom { flex-direction: column; text-align: center; }
}

@media (max-width: 480px) {
  .wd-industry-grid { grid-template-columns: 1fr 1fr; }
  .wd-leadership-grid { grid-template-columns: 1fr; }
  .wd-hero h1 { font-size: 2.2rem; }
  .wd-roi-inputs { grid-template-columns: 1fr; gap: 1.5rem; }
  .wd-roi-outputs { grid-template-columns: 1fr; }
  .wd-proof-stats-inner { flex-direction: column; align-items: stretch; }
  .wd-proof-divider { width: 80%; height: 1px; margin-inline: auto; }
  .wd-compare-scroll-hint { display: block; }
}

/* ============================================================
   INLINE FORM
   ============================================================ */
.wd-inline-form {
  display: flex;
  gap: 0.75rem;
  max-width: 440px;
  margin-inline: auto;
}
.wd-inline-form input[type="email"] {
  flex: 1;
  padding: 0.875rem 1.25rem;
  border: 2px solid var(--wd-border);
  border-radius: var(--wd-radius-sm);
  font-size: 0.9rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.18s;
}
.wd-inline-form input[type="email"]:focus {
  border-color: var(--wd-green);
  box-shadow: 0 0 0 3px rgba(0,176,80,.12);
}

/* ============================================================
   POST CONTENT PAGES
   ============================================================ */
main .wd-page-hero {
  background: var(--wd-gradient-hero);
}

/* Blog post typography */
.entry-content h2 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin-top: 2.5rem; margin-bottom: 0.75rem; }
.entry-content h3 { font-size: 1.15rem; margin-top: 2rem; margin-bottom: 0.6rem; }
.entry-content p { margin-bottom: 1.25rem; font-size: 1rem; }
.entry-content ul, .entry-content ol { padding-left: 1.5rem; margin-bottom: 1.25rem; }
.entry-content li { margin-bottom: 0.4rem; font-size: 0.975rem; color: var(--wd-mid); }
.entry-content strong { color: var(--wd-dark); font-weight: 700; }

/* Responsive helper grids used across inner pages */
.wd-responsive-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem; }
@media (max-width: 900px) {
  .wd-responsive-grid-3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .wd-responsive-grid-3 { grid-template-columns: 1fr; }
}

/* Inner page two-column grids collapse on tablet */
@media (max-width: 800px) {
  .wd-container [style*="grid-template-columns:1fr 2fr"],
  .wd-container [style*="grid-template-columns: 1fr 2fr"],
  .wd-container [style*="grid-template-columns:1fr 1fr"],
  .wd-container [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  .wd-container [style*="grid-template-columns:repeat(3,1fr)"],
  .wd-container [style*="grid-template-columns: repeat(3,1fr)"],
  .wd-container [style*="grid-template-columns:repeat(4,1fr)"],
  .wd-container [style*="grid-template-columns: repeat(4,1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 500px) {
  .wd-container [style*="grid-template-columns:repeat(3,1fr)"],
  .wd-container [style*="grid-template-columns: repeat(3,1fr)"],
  .wd-container [style*="grid-template-columns:repeat(4,1fr)"],
  .wd-container [style*="grid-template-columns: repeat(4,1fr)"] {
    grid-template-columns: 1fr !important;
  }
}


/* ============================================================
   TESTIMONIALS — REDESIGNED PREMIUM CARDS
   ============================================================ */
.wd-testimonial {
  position: relative;
  overflow: hidden;
}
.wd-quote-svg {
  width: 44px;
  height: 33px;
  color: rgba(0,176,80,0.20);
  margin-bottom: 1rem;
  display: block;
  flex-shrink: 0;
}
.wd-testimonial-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,0.22);
}

/* Variant cards — metric header design */
.wd-testi-variant {
  padding: 0;
  border-radius: 22px;
  display: flex;
  flex-direction: column;
}
.wd-testi-variant::before { display: none; }

.wd-testi-header {
  padding: 1.5rem 1.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  border-radius: 21px 21px 0 0;
}
.wd-testi-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, transparent 55%);
  pointer-events: none;
}
.wd-testi-hdr-green  { background: linear-gradient(135deg, #006D35 0%, #00B050 100%); }
.wd-testi-hdr-blue   { background: linear-gradient(135deg, #004A8F 0%, #0070D2 60%, #38bdf8 100%); }
.wd-testi-hdr-purple { background: linear-gradient(135deg, #5B21B6 0%, #7C3AED 60%, #A78BFA 100%); }

.wd-testi-metric { display: flex; flex-direction: column; gap: 0.22rem; }
.wd-testi-metric-num {
  font-size: 1.9rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.035em;
  line-height: 1;
}
.wd-testi-metric-label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.75);
  font-weight: 500;
  line-height: 1.3;
}

.wd-testi-body {
  padding: 1.75rem 1.75rem 2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.wd-testi-body .wd-testimonial-stars {
  font-size: 0.88rem;
  letter-spacing: 0.06em;
  color: #f59e0b;
  margin-bottom: 0.9rem;
}
.wd-testi-body .wd-testimonial-text {
  flex: 1;
  margin-bottom: 1.5rem;
  font-size: 0.94rem;
  line-height: 1.78;
  color: var(--wd-body);
  font-style: italic;
}
.wd-testi-body .wd-testimonial-author {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--wd-border);
}
.wd-testi-body .wd-testimonial-name {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin-bottom: 0.12rem;
}
.wd-testi-body .wd-testimonial-role {
  font-size: 0.76rem;
  color: var(--wd-muted);
  line-height: 1.3;
}

/* ============================================================
   SECTION NUMBER WATERMARKS
   ============================================================ */
[data-section-num] {
  position: relative;
}
[data-section-num]::before {
  content: attr(data-section-num);
  position: absolute;
  top: -1rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 9rem;
  font-weight: 900;
  color: rgba(0,0,0,0.03);
  line-height: 1;
  pointer-events: none;
  letter-spacing: -0.04em;
  z-index: 0;
  white-space: nowrap;
}
.wd-section-header > * { position: relative; z-index: 1; }
.wd-cxo-header > * { position: relative; z-index: 1; }

/* ============================================================
   FRAMEWORK — TIMELINE CONNECTOR
   ============================================================ */
.wd-phases-list {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.wd-phases-list::before {
  content: '';
  position: absolute;
  left: 38px;
  top: 28px;
  bottom: 28px;
  width: 2px;
  background: linear-gradient(to bottom, #00B050 0%, rgba(0,176,80,0.12) 100%);
  border-radius: 2px;
}

/* ============================================================
   STACKING CONTEXT for sections with pseudo-elements
   ============================================================ */
.wd-hero,
.wd-proof-stats,
.wd-framework,
.wd-cta-block {
  isolation: isolate;
}

/* ============================================================
   INSIGHT CARDS — richer visual
   ============================================================ */
.wd-insight-card {
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s ease;
}
.wd-insight-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}
.wd-insight-thumb {
  position: relative;
  overflow: hidden;
}
.wd-insight-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.08) 0%, transparent 50%);
  pointer-events: none;
}

/* ============================================================
   CASE STUDY CARDS — metric bar visual
   ============================================================ */
.wd-case-metric-num {
  position: relative;
  display: inline-block;
}
.wd-case-metric-num::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 3px;
  background: rgba(255,255,255,0.4);
  border-radius: 2px;
}

/* ============================================================
   TECH STACK — enhanced pills
   ============================================================ */
.wd-tech-pill {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.wd-tech-pill:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}

/* ============================================================
   INDUSTRIES — enhanced tile hover
   ============================================================ */
.wd-industry-tile {
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s ease;
}
.wd-industry-tile:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 16px 40px rgba(0,0,0,0.1);
}

/* ============================================================
   PARTNER STRIP — Summit badge glow animation
   ============================================================ */
.wd-summit-badge {
  background: #032D60;
  border: none;
  animation: wd-badge-glow 3.5s ease-in-out infinite;
}
@keyframes wd-badge-glow {
  0%, 100% { box-shadow: 0 3px 12px rgba(3,45,96,0.3); }
  50%       { box-shadow: 0 4px 20px rgba(3,45,96,0.5), 0 0 0 4px rgba(3,45,96,0.08); }
}

/* ============================================================
   COMPARISON TABLE — highlight row on hover
   ============================================================ */
.wd-compare-table tbody tr {
  transition: background 0.2s ease;
}
.wd-compare-table tbody tr:hover {
  background: rgba(0,176,80,0.025);
}

/* ============================================================
   DECORATIVE ILLUSTRATIONS
   ============================================================ */
.wd-illus {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  overflow: visible;
}
.wd-illus svg { display: block; width: 100%; height: 100%; overflow: visible; }

/* Hero constellation */
.wd-hero-deco {
  width: 520px; height: 440px;
  top: -30px; left: -80px;
  opacity: 0.85;
}
@media (max-width: 900px) { .wd-hero-deco { display: none; } }

/* Services network */
.wd-services-deco {
  width: 460px; height: 280px;
  top: 0; right: -30px;
  opacity: 0.55;
}
@media (max-width: 900px) { .wd-services-deco { display: none; } }

/* Framework rocket */
.wd-framework-deco {
  width: 240px; height: 320px;
  bottom: -20px; right: -20px;
  opacity: 0.45;
}
@media (max-width: 900px) { .wd-framework-deco { display: none; } }

/* CTA radiating circles */
.wd-cta-deco {
  inset: 0;
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  opacity: 0.9;
}
.wd-cta-deco svg { width: 900px; height: 600px; flex-shrink: 0; }

/* Proof stats wave */
.wd-stats-deco {
  right: 0; top: 0;
  width: 360px; height: 100%;
  opacity: 0.5;
}
@media (max-width: 900px) { .wd-stats-deco, .wd-framework-deco, .wd-services-deco { display: none; } }

/* Testimonials quote decoration */
.wd-testi-deco {
  left: 0; top: 0;
  width: 100%; height: 100%;
  opacity: 0.35;
  overflow: hidden;
}

/* Tech section decoration */
.wd-tech-deco {
  right: -60px; bottom: -20px;
  width: 300px; height: 300px;
  opacity: 0.35;
}

/* ============================================================
   UNIFIED BACKGROUND & CONSISTENCY SYSTEM
   Clean, premium, brand-consistent throughout.
   All overrides here take precedence over earlier declarations.
   ============================================================ */

/* ── Design tokens ────────────────────────────────────────── */
:root {
  --bg-white:   transparent;
  --bg-subtle:  transparent;
  --bg-tinted:  transparent;
  --section-pad: clamp(2.5rem, 3.5vw, 3.5rem);
  --section-gap: none;
}

/* ── Hero — pure white ──────────────────────────────────── */
.wd-hero { background: transparent; }
.wd-hero::after { display: none; }

/* ── Partner strip (legacy, hidden) ─────────────────────── */
.wd-partner-strip { display: none; }

/* ── Trusted Technology Partners (bottom section) ───────── */
.wd-tech-partners {
  background: transparent;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.08) 20%, rgba(0,0,0,0.08) 80%, transparent 100%) 1;
  padding-block: clamp(2.5rem, 4vw, 3.5rem);
}
.wd-tp-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}
.wd-tp-label {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.2;
  text-align: center;
  margin: 0;
}
.wd-tp-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(2rem, 5vw, 4.5rem);
  flex-wrap: wrap;
}
.wd-tp-logo {
  display: block;
  height: 52px;
  width: auto;
  object-fit: contain;
  opacity: 1;
  transition: opacity 0.25s ease;
}
.wd-tp-logo:hover { opacity: 0.8; }
.wd-tp-logo-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}
.wd-tp-logo-name {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--wd-dark);
  letter-spacing: 0.01em;
}
.wd-tp-salesforce { height: 52px; }
.wd-tp-slack      { height: 48px; }
.wd-tp-mulesoft   { height: 48px; }
.wd-tp-tableau    { height: 48px; }
/* 6 partner logos — same 480×160 canvas, sized by width so they're all equal */
.wd-tp-partner {
  height: auto;
  width: clamp(80px, 10vw, 130px);
  max-height: 44px;
  object-fit: contain;
}
.wd-tp-logos:has(.wd-tp-partner) {
  flex-wrap: nowrap;
  gap: clamp(0.75rem, 2.5vw, 2rem);
}

/* ── Proof stats ────────────────────────────────────────── */
.wd-proof-stats {
  background: var(--bg-white);
  border-top: var(--section-gap);
  border-bottom: var(--section-gap);
  padding-block: var(--section-pad);
}
.wd-proof-stats::after { display: none; }

/* ── CXO ────────────────────────────────────────────────── */
.wd-cxo {
  background: var(--bg-subtle);
  border-top: var(--section-gap);
}

/* ── Compare ────────────────────────────────────────────── */
.wd-compare {
  background: var(--bg-white);
  border-top: var(--section-gap);
}

/* ── Services ──────────────────────────────────────────── */
.wd-services {
  background: var(--bg-subtle);
  border-top: var(--section-gap);
}

/* ── Framework ─────────────────────────────────────────── */
.wd-framework {
  background:
    radial-gradient(ellipse 55% 55% at 100% 50%, rgba(0,176,80,0.05) 0%, transparent 65%),
    var(--bg-white);
  border-top: var(--section-gap);
  border-bottom: var(--section-gap);
}
.wd-framework::after {
  background: radial-gradient(ellipse 45% 60% at 100% 80%, rgba(0,176,80,0.05) 0%, transparent 70%);
}

/* ── Industries ─────────────────────────────────────────── */
.wd-industries {
  background: var(--bg-subtle);
  border-top: var(--section-gap);
}

/* ── Testimonials ───────────────────────────────────────── */
.wd-testimonials {
  background:
    radial-gradient(ellipse 50% 60% at 0% 60%, rgba(0,176,80,0.04) 0%, transparent 65%),
    var(--bg-white);
  border-top: var(--section-gap);
}

/* ── Leadership ─────────────────────────────────────────── */
.wd-leadership {
  background: var(--bg-subtle);
  border-top: var(--section-gap);
}

/* ── Insights ───────────────────────────────────────────── */
.wd-insights {
  background: var(--bg-white);
  border-top: var(--section-gap);
}

/* ── CTA block ──────────────────────────────────────────── */
.wd-cta-block {
  background:
    radial-gradient(ellipse 60% 70% at 50% 100%, rgba(0,176,80,0.08) 0%, transparent 65%),
    radial-gradient(ellipse 40% 50% at 0% 0%,   rgba(0,176,80,0.04) 0%, transparent 65%),
    var(--bg-tinted);
  border-top: var(--section-gap);
}
.wd-cta-block::after {
  background: radial-gradient(ellipse 50% 60% at 50% 50%, rgba(0,176,80,0.07) 0%, transparent 70%);
}

/* ── Section padding standardisation ───────────────────── */
.wd-partner-strip,
.wd-cxo .wd-cxo-inner,
.wd-compare .wd-compare-inner,
.wd-services .wd-services-inner,
.wd-framework .wd-framework-inner,
.wd-industries .wd-industries-inner,
.wd-testimonials .wd-testimonials-inner,
.wd-leadership .wd-leadership-inner,
.wd-insights .wd-insights-inner {
  padding-block: var(--section-pad);
}

/* ── Section header refinement ─────────────────────────── */
.wd-section-header {
  margin-bottom: clamp(2.5rem, 4vw, 4rem);
}
.wd-section-header h2,
.wd-cxo-header h2 {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.wd-section-header p {
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--wd-mid);
  max-width: 560px;
}
.wd-section-header.centered { text-align: center; }
.wd-section-header.centered p { margin-inline: auto; }
/* .eyebrow hidden globally — see rule at top of file */

/* ── Card consistency ───────────────────────────────────── */
.wd-service-card,
.wd-industry-tile,
.wd-testimonial-card,
.wd-insight-card,
.wd-leader-card {
  border-color: rgba(0,0,0,0.07);
}
.wd-service-card:hover,
.wd-industry-tile:hover,
.wd-testimonial-card:hover,
.wd-insight-card:hover,
.wd-leader-card:hover {
  border-color: rgba(0,176,80,0.18);
}

/* ── Typography polish ──────────────────────────────────── */
p {
  line-height: 1.72;
}

/* ── Proof card — hero colour consistency on dark bg ──── */
.wd-proof-card--hero .wd-tco-others .wd-tco-bar {
  background: linear-gradient(to top, rgba(255,255,255,0.4), rgba(255,255,255,0.2));
  border-color: rgba(255,255,255,0.3);
}

/* ── Remove stale decoration SVGs from Proof Stats ─────── */
.wd-stats-deco { display: none; }

/* ── Subtle green link underline consistent ────────────── */
.wd-service-link,
.wd-insight-link {
  color: var(--wd-green);
}
.wd-service-link:hover,
.wd-insight-link:hover {
  color: var(--wd-green-dark);
}

/* ============================================================
   HERO — LIGHT THEME + RICH ANIMATIONS
   ============================================================ */

/* ── Hero — transparent, shows body gradient ────────────────── */
.wd-hero {
  background: transparent;
}
.wd-hero::after    { display: none; }
.wd-ui-glow        { display: none; }
.wd-hero-orbs      { display: none; }
.wd-hero-particles { display: none; }
.wd-hero-gleam     { display: none; }
.wd-illus.wd-hero-deco { display: none; }
.wd-hv-illus-card  { display: none; }

/* ── 4. Hero entrance stagger ───────────────────────────────── */
@keyframes wd-enter-up {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes wd-enter-right {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes wd-enter-badge {
  from { opacity: 0; transform: translateY(14px) scale(0.92); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}

.wd-hero-left .wd-hero-badge {
  animation: wd-enter-badge 0.7s cubic-bezier(0.34,1.56,0.64,1) 0.10s both;
}
.wd-hero-tech-stack .wd-tech-pill:nth-child(1) {
  animation: wd-enter-up 0.55s cubic-bezier(0.34,1.56,0.64,1) 0.24s both;
}
.wd-hero-tech-stack .wd-tech-pill:nth-child(2) {
  animation: wd-enter-up 0.55s cubic-bezier(0.34,1.56,0.64,1) 0.34s both;
}
.wd-hero-tech-stack .wd-tech-pill:nth-child(3) {
  animation: wd-enter-up 0.55s cubic-bezier(0.34,1.56,0.64,1) 0.44s both;
}
.wd-hero-tech-stack .wd-tech-pill:nth-child(4) {
  animation: wd-enter-up 0.55s cubic-bezier(0.34,1.56,0.64,1) 0.54s both;
}
.wd-hero-split h1 {
  animation: wd-enter-up 0.80s cubic-bezier(0.22,1,0.36,1) 0.40s both;
}
.wd-hero-sub {
  animation: wd-enter-up 0.65s cubic-bezier(0.22,1,0.36,1) 0.57s both;
}
.wd-hero-ctas {
  animation: wd-enter-up 0.65s cubic-bezier(0.34,1.56,0.64,1) 0.72s both;
}
.wd-hero-right {
  animation: wd-enter-right 0.85s cubic-bezier(0.22,1,0.36,1) 0.50s both;
}
.wd-hero-deco {
  animation: wd-enter-up 1.2s cubic-bezier(0.22,1,0.36,1) 0.3s both;
}

/* ── 5. Constellation line-draw ─────────────────────────────── */
.wd-cd-line {
  stroke-dasharray: 800;
  stroke-dashoffset: 800;
  animation: wd-cd-draw 1.8s ease-out forwards;
}
.wd-cd-l1 { animation-delay: 0.8s; }
.wd-cd-l2 { animation-delay: 1.0s; }
.wd-cd-l3 { animation-delay: 1.2s; }
.wd-cd-l4 { animation-delay: 1.4s; }
.wd-cd-l5 { animation-delay: 1.6s; }
.wd-cd-l6 { animation-delay: 1.8s; }
.wd-cd-l7 { stroke-dasharray: 4 7; stroke-dashoffset: 0; opacity: 0; animation: wd-cd-fade 1.5s ease-out 2.0s forwards; }
.wd-cd-l8 { stroke-dasharray: 3 8; stroke-dashoffset: 0; opacity: 0; animation: wd-cd-fade 1.5s ease-out 2.2s forwards; }
@keyframes wd-cd-draw {
  from { stroke-dashoffset: 800; opacity: 0.2; }
  5%   { opacity: 1; }
  to   { stroke-dashoffset: 0; }
}
@keyframes wd-cd-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── 6. Constellation node pulse ───────────────────────────── */
.wd-cd-node {
  transform-box: fill-box;
  transform-origin: center;
  animation: wd-node-breathe 5s ease-in-out infinite;
}
.wd-cd-node-2 { animation-duration: 6.5s; animation-delay: 1.3s; }
.wd-cd-node-3 { animation-duration: 4.2s; animation-delay: 2.6s; }
@keyframes wd-node-breathe {
  0%, 100% { transform: scale(1);   opacity: 0.9; }
  50%       { transform: scale(1.4); opacity: 0.4; }
}

/* ── 7. Reduced motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .wd-particle,
  .wd-hero-gleam::before,
  .wd-hero-left .wd-hero-badge,
  .wd-hero-tech-stack .wd-tech-pill,
  .wd-hero-split h1,
  .wd-hero-sub,
  .wd-hero-ctas,
  .wd-hero-right,
  .wd-hero-deco,
  .wd-cd-line,
  .wd-cd-node {
    animation: none;
    opacity: 1;
    stroke-dashoffset: 0;
  }
}

/* ============================================================
   PROOF CARDS — CONSISTENT REDESIGN
   ============================================================ */

/* Remove chamfered clip-path → standard card system */
.wd-pcs, .wd-pcs--hero { filter: none; }

.wd-proof-card {
  clip-path: none;
  border-radius: 20px;
  border: 1px solid rgba(0,0,0,0.07);
  box-shadow: 0 1px 4px rgba(0,0,0,0.04), 0 6px 20px rgba(0,0,0,0.05);
  position: relative;
  overflow: hidden;
}
.wd-proof-card:hover {
  box-shadow: 0 4px 20px rgba(0,0,0,0.08), 0 0 0 2px rgba(0,176,80,0.10);
}

/* Featured middle card — white with animated green top accent */
.wd-proof-card--hero {
  background: #fff;
  border-color: rgba(0,176,80,0.18);
  box-shadow: 0 1px 6px rgba(0,176,80,0.06), 0 8px 28px rgba(0,176,80,0.09);
}
.wd-proof-card--hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #00B050, #38ECA0, #00B050);
  background-size: 200% auto;
  animation: wd-accent-bar 3s linear infinite;
}
@keyframes wd-accent-bar {
  to { background-position: 200% center; }
}

/* Restore light-theme text colors on hero card */
.wd-proof-card--hero .wd-proof-card-num   { color: var(--wd-dark); }
.wd-proof-card--hero .wd-proof-card-label { color: var(--wd-green); }
.wd-proof-card--hero .wd-proof-card-sub   { color: var(--wd-muted); }
.wd-proof-card--hero .wd-tco-label        { color: var(--wd-muted); }
.wd-proof-card--hero .wd-tco-save {
  background: rgba(0,176,80,0.08);
  border-color: rgba(0,176,80,0.20);
  color: #007A35;
}
.wd-proof-card--hero:hover {
  box-shadow: 0 4px 24px rgba(0,176,80,0.13), 0 0 0 2px rgba(0,176,80,0.14);
}

/* Fix off-brand orbit dot colors → green palette only */
.wd-vnd-b { background: #38ECA0; box-shadow: 0 0 6px rgba(56,236,160,0.55); }
.wd-vnd-p { background: #005C24; box-shadow: 0 0 5px rgba(0,92,36,0.40); }

/* Fix TCO "Others" bar red → neutral slate */
.wd-tco-others .wd-tco-bar,
.wd-proof-card--hero .wd-tco-others .wd-tco-bar {
  background: linear-gradient(to top, #94A3B8, #CBD5E1);
  border: 1px solid rgba(148,163,184,0.30);
  opacity: 1;
}

/* ============================================================
   ICON MICRO ANIMATIONS — SITE-WIDE
   ============================================================ */

/* Base transition on all interactive SVGs */
.wd-btn svg,
.wd-service-link svg,
.wd-insight-link svg,
.wd-sil-icon svg,
.wd-service-icon svg,
.wd-industry-icon svg,
.wd-leader-linkedin svg,
.wd-partner-logo svg,
.wd-tab-btn svg,
.wd-tech-pill svg,
.wd-platform-pill svg,
.wd-hero-badge svg {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}

/* ── Buttons: trailing arrow slides right ─────────────────── */
.wd-btn-ghost-white:hover svg:last-child,
.wd-btn-secondary:hover   svg:last-child,
.wd-btn-outline-dark:hover svg:last-child {
  transform: translateX(5px);
}
/* Primary button leading icon: scale pop */
.wd-btn-primary:hover svg:first-child {
  transform: scale(1.18);
}

/* ── Service card illustration icons: scale + tilt ────────── */
.wd-service-card:hover .wd-sil-icon svg {
  transform: scale(1.15) rotate(-7deg);
}
/* Legacy floating service icon: lift + pause float */
.wd-service-card:hover .wd-service-icon {
  transform: scale(1.1) translateY(-4px) !important;
  animation-play-state: paused !important;
}

/* ── Service link arrow ───────────────────────────────────── */
.wd-service-link:hover svg { transform: translateX(5px); }

/* ── Insight link arrow ───────────────────────────────────── */
.wd-insight-card:hover .wd-insight-link svg { transform: translateX(5px); }

/* ── Industry icons: scale pop + tilt ────────────────────── */
.wd-industry-tile:hover .wd-industry-icon svg {
  transform: scale(1.22) rotate(-8deg);
}

/* ── LinkedIn: lift + rotate ──────────────────────────────── */
.wd-leader-linkedin:hover svg {
  transform: scale(1.3) rotate(-12deg);
}

/* ── Partner logo icons ───────────────────────────────────── */
.wd-partner-logo:hover svg {
  transform: scale(1.2) rotate(-5deg);
}

/* ── CXO tab buttons ──────────────────────────────────────── */
.wd-tab-btn:hover svg  { transform: scale(1.15); }
.wd-tab-btn.active svg { transform: scale(1.18) rotate(-5deg); }

/* ── Tech stack pills in hero ─────────────────────────────── */
.wd-tech-pill:hover svg   { transform: scale(1.2) rotate(-8deg); }
.wd-platform-pill:hover svg { transform: scale(1.15); }

/* ── Compare table: checkmark bounce on row hover ─────────── */
.wd-compare-table tbody tr:hover .wd-cmp-check {
  animation: wd-check-bounce 0.45s cubic-bezier(0.34,1.56,0.64,1) both;
}
@keyframes wd-check-bounce {
  0%   { transform: scale(1); }
  45%  { transform: scale(1.4); }
  100% { transform: scale(1); }
}

/* ── Agentcard: platform pills ────────────────────────────── */
.wd-agentcard-platforms .wd-platform-pill:hover svg {
  transform: scale(1.2) rotate(-6deg);
}

/* ── Hero badge dot: pulse faster on badge hover ─────────── */
.wd-hero-badge:hover .dot {
  animation-duration: 0.7s;
}

/* Reduced motion: disable all micro animations */
@media (prefers-reduced-motion: reduce) {
  .wd-btn svg, .wd-service-link svg, .wd-insight-link svg,
  .wd-sil-icon svg, .wd-service-icon svg, .wd-industry-icon svg,
  .wd-leader-linkedin svg, .wd-partner-logo svg, .wd-tab-btn svg,
  .wd-tech-pill svg, .wd-platform-pill svg, .wd-hero-badge svg {
    transition: none;
  }
  .wd-proof-card--hero::before { animation: none; }
}

/* ── Leader photo (real headshot) ─────────────────────────── */
.wd-leader-avatar--photo {
  background: transparent;
  overflow: hidden;
}
.wd-leader-avatar--photo .wd-avatar-initials { display: none; }
.wd-leader-photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  border-radius: 50%;
  display: block;
}

/* ── Insight card — full-card link wrap ───────────────────── */
.wd-insight-link-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.wd-insight-card:hover .wd-insight-link-wrap { color: inherit; }

/* ── Insight thumb: photo image support ──────────────────── */
.wd-insight-thumb:has(img)::after {
  background: linear-gradient(to bottom, transparent 55%, rgba(0,0,0,0.18) 100%);
  background-size: unset;
}

/* ── "We're hiring!" nav badge ───────────────────────────── */
.wd-hiring-badge {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  padding: 0.38rem 0.85rem 0.38rem 0.75rem !important;
  background: #EDF2EE !important;
  border-radius: var(--wd-radius-full) !important;
  color: #1a3d25 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
  transition: background 0.15s !important;
  white-space: nowrap;
}
.wd-hiring-badge:hover {
  background: #d9ecdf !important;
  color: #009944 !important;
}

/* Pulsing green dot */
.wd-hiring-dot {
  position: relative;
  width: 8px;
  height: 8px;
  flex-shrink: 0;
}
.wd-hiring-dot::before,
.wd-hiring-dot::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #009944;
}
.wd-hiring-dot::after {
  animation: wd-ping 1.6s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes wd-ping {
  0%   { transform: scale(0.8); opacity: 1; }
  70%  { transform: scale(2.4); opacity: 0; }
  100% { transform: scale(2.4); opacity: 0; }
}

/* ── WarpDrive wordmark logo ─────────────────────────────── */
.wd-logo-wordmark-img {
  height: 30px;
  width: auto;
  display: block;
  flex-shrink: 0;
}

/* ── Salesforce Summit Partner badge — hero ──────────────── */
.wd-sf-summit-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 14px;
  padding: 0.65rem 1.1rem;
  text-decoration: none;
  transition: background 0.18s, border-color 0.18s;
  width: fit-content;
}
.wd-sf-summit-hero-badge:hover {
  background: rgba(255,255,255,0.12);
  border-color: rgba(1,118,211,0.55);
}
.wd-sf-cloud-icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.wd-sf-summit-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.wd-sf-brand-name {
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
}
.wd-sf-tier-name {
  font-size: 0.92rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.wd-sf-stars {
  display: flex;
  align-items: center;
  margin-left: 0.25rem;
  opacity: 0.9;
}

/* ================================================================
   INDUSTRY FAN DECK CARDS
   ================================================================ */

.wd-industries-section {
  padding: clamp(60px, 8vw, 100px) 0 0;
  background: transparent;
  position: relative;
}

.wd-industries-section::before,
.wd-industries-section::after {
  display: none;
}

.wd-ind-header {
  text-align: center;
  max-width: 680px;
  margin-bottom: clamp(40px, 6vw, 64px);
  position: relative;
  z-index: 1;
}

.wd-ind-header h2 {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.wd-ind-lead {
  color: var(--wd-muted);
  font-size: clamp(0.95rem, 1.4vw, 1.1rem);
  line-height: 1.65;
}

/* --- Fan wrapper ------------------------------------------ */
.wd-fan-wrap {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(52px, 7vw, 80px) 72px;
}

/* --- Fan stage -------------------------------------------- */
.wd-fan-stage {
  position: relative;
  height: 540px;
  perspective: 1200px;
  overflow: visible;
}

/* --- Individual card -------------------------------------- */
.wd-fan-card {
  position: absolute;
  width: 400px;
  height: 488px;
  left: 50%;
  bottom: 0;
  margin-left: -200px;

  background: rgba(255,255,255,0.68);
  backdrop-filter: blur(28px) saturate(160%);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,0.92);
  box-shadow:
    0 20px 56px rgba(100,116,200,0.13),
    0 4px 16px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.98);

  cursor: pointer;
  transform-origin: bottom center;
  transition: transform 0.55s cubic-bezier(0.34,1.56,0.64,1),
              opacity   0.35s ease,
              box-shadow 0.3s ease;
  will-change: transform, opacity;
  overflow: hidden;
  user-select: none;
}

/* Colour-accent top stripe */
.wd-fan-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--accent, var(--wd-green));
  opacity: 0.85;
  z-index: 1;
}

.wd-fan-card.wd-fan-active {
  cursor: grab;
  box-shadow:
    0 32px 72px rgba(100,116,200,0.18),
    0 8px 24px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.98);
}

.wd-fan-card.wd-fan-active:active { cursor: grabbing; }

/* --- Card body -------------------------------------------- */
.wd-fc-inner {
  padding: 26px 22px 20px;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
}

.wd-fc-tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent, var(--wd-green));
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.08);
  padding: 4px 12px;
  border-radius: 100px;
  margin-bottom: 0.85rem;
  align-self: flex-start;
}

.wd-fc-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.28;
  margin-bottom: 0.9rem;
}

.wd-fc-list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
}

.wd-fc-list li {
  font-size: 0.8rem;
  color: var(--wd-muted);
  padding-left: 1rem;
  position: relative;
  line-height: 1.45;
}

.wd-fc-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--accent, var(--wd-green));
}

/* --- KPI bar ---------------------------------------------- */
.wd-fc-kpi {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 0.9rem;
  background: rgba(0,0,0,0.03);
  border-left: 3px solid var(--accent, var(--wd-green));
  border-radius: 0 8px 8px 0;
  margin-bottom: 0.75rem;
}

.wd-fc-kpi-n {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--accent, var(--wd-green));
  line-height: 1;
  letter-spacing: -0.02em;
}

.wd-fc-kpi-t {
  font-size: 0.78rem;
  color: var(--wd-muted);
  font-weight: 500;
}

/* --- Cloud chips ------------------------------------------ */
.wd-fc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-bottom: 0.85rem;
}

.wd-fc-chips span {
  font-size: 0.6rem;
  font-weight: 600;
  color: #6b7280;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.07);
  padding: 3px 9px;
  border-radius: 100px;
}

/* --- Client logo row -------------------------------------- */
.wd-fc-logos {
  display: flex;
  gap: 0.4rem;
  margin-top: auto;
}

.wd-fc-logo {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 8px;
  padding: 5px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  min-height: 36px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.wd-fc-logo img {
  height: 18px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

/* --- Prev / Next buttons ---------------------------------- */
.wd-fan-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.92);
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wd-dark);
  transition: background 0.2s, box-shadow 0.2s, transform 0.2s;
  z-index: 200;
}

.wd-fan-btn:hover {
  background: #fff;
  box-shadow: 0 6px 20px rgba(0,0,0,0.14);
  transform: translateY(-50%) scale(1.06);
}

.wd-fan-prev { left: 0; }
.wd-fan-next { right: 0; }

/* --- Dot navigation --------------------------------------- */
.wd-fan-dots {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 8px;
}

.wd-fan-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(0,0,0,0.18);
  cursor: pointer;
  padding: 0;
  transition: background 0.25s, transform 0.25s;
}

.wd-fan-dot.active {
  background: var(--wd-green);
  transform: scale(1.4);
}

/* --- Service fan card overrides (white + colored header) -- */
.wd-fan-card--svc {
  height: 436px;
  background: #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(14,17,23,0.08);
  box-shadow:
    0 4px 24px rgba(0,0,0,0.08),
    0 1px 4px rgba(0,0,0,0.04);
}

.wd-services .wd-fan-stage {
  height: 500px;
}

.wd-fan-card--svc::before { display: none; }

.wd-fan-card--svc.wd-fan-active {
  box-shadow:
    0 20px 52px rgba(0,0,0,0.12),
    0 4px 16px rgba(0,0,0,0.07);
}

.wd-fcs-header {
  background: var(--card-bg, linear-gradient(135deg, #1d4ed8 0%, #0ea5e9 100%));
  padding: 22px 22px 20px;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  position: relative;
  overflow: hidden;
}

.wd-fcs-header::after {
  content: '';
  position: absolute;
  width: 160px;
  height: 160px;
  background: rgba(255,255,255,0.07);
  border-radius: 50%;
  bottom: -70px;
  right: -30px;
  pointer-events: none;
}

.wd-fcs-icon {
  width: 46px;
  height: 46px;
  background: rgba(255,255,255,0.18);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.wd-fcs-chip {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.3);
  padding: 4px 10px;
  border-radius: 100px;
  align-self: flex-start;
  position: relative;
  z-index: 1;
}

.wd-fcs-body {
  padding: 20px 22px 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.wd-fcs-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.28;
  margin-bottom: 0.7rem;
}

.wd-fcs-desc {
  font-size: 0.82rem;
  color: var(--wd-muted);
  line-height: 1.6;
  margin-bottom: 1rem;
  flex: 1;
}

.wd-fcs-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--fcs-accent, #1d4ed8);
  text-decoration: none;
  padding: 0;
  background: none;
  border: none;
  transition: gap 0.2s ease;
  align-self: flex-start;
  margin-top: auto;
}

.wd-fcs-link:hover {
  gap: 0.6rem;
  background: none;
  border-color: transparent;
}

/* --- Illustrations in fan card header --------------------- */
.wd-fcs-illus {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  position: relative;
  z-index: 1;
}

/* Mini CRM list (Salesforce Implementation) */
.wd-fcs-mini-ui {
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 100%;
  padding: 2px 0;
}

.wd-fcs-row {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.1);
  border-radius: 6px;
  padding: 5px 8px;
}

.wd-fcs-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.fcs-d1 { background: rgba(255,255,255,0.9); }
.fcs-d2 { background: rgba(255,255,255,0.6); }
.fcs-d3 { background: rgba(255,255,255,0.4); }

.wd-fcs-cbar {
  height: 5px;
  border-radius: 3px;
  background: rgba(255,255,255,0.45);
  flex-shrink: 0;
}

.wd-fcs-badge {
  margin-left: auto;
  font-size: 0.58rem;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
  letter-spacing: 0.03em;
}

/* Orbital animation (Agentforce & Einstein AI) */
.wd-fcs-orbits {
  position: relative;
  width: 64px;
  height: 64px;
}

.wd-fcs-orbits::before {
  content: '';
  position: absolute;
  inset: 18px;
  background: rgba(255,255,255,0.25);
  border-radius: 50%;
}

.wd-fcs-orb {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  margin: -5px;
  border-radius: 50%;
  background: rgba(255,255,255,0.9);
  transform-origin: 0 0;
  box-shadow: 0 0 6px rgba(255,255,255,0.5);
}

.fcs-orb-1 { animation: fcs-orbit 2.4s linear infinite; }
.fcs-orb-2 { animation: fcs-orbit 3.6s linear infinite reverse; width: 7px; height: 7px; margin: -3.5px; background: rgba(255,255,255,0.65); }
.fcs-orb-3 { animation: fcs-orbit 5.2s linear infinite; width: 6px; height: 6px; margin: -3px; background: rgba(255,255,255,0.45); }

@keyframes fcs-orbit {
  from { transform: rotate(0deg) translateX(26px) rotate(0deg); }
  to   { transform: rotate(360deg) translateX(26px) rotate(-360deg); }
}

/* Bar chart (Data Cloud & Analytics) */
.wd-fcs-chart {
  display: flex;
  align-items: flex-end;
  gap: 7px;
  height: 60px;
  padding-bottom: 4px;
}

.wd-fcs-bv {
  width: 28px;
  border-radius: 4px 4px 0 0;
  background: rgba(255,255,255,0.35);
  transition: height 0.3s ease;
}

.fcs-bv-hi {
  background: rgba(255,255,255,0.9);
  box-shadow: 0 0 8px rgba(255,255,255,0.4);
}

/* Uptime gauge */
.wd-fcs-gauge {
  display: block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.15));
}

/* CI/CD pipeline (Cloud & DevOps) */
.wd-fcs-pipeline {
  display: flex;
  align-items: center;
  gap: 6px;
}

.wd-fcs-step {
  padding: 5px 12px;
  border-radius: 100px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: white;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.28);
}

.fcs-s1 { background: rgba(255,255,255,0.22); }
.fcs-s2 { background: rgba(255,255,255,0.15); }
.fcs-s3 { background: rgba(255,255,255,0.28); border-color: rgba(255,255,255,0.5); }

.wd-fcs-arr {
  color: rgba(255,255,255,0.55);
  font-size: 1.1rem;
  line-height: 1;
}

/* Integration diagram (Microsoft & Oracle) */
.wd-fcs-connect {
  display: flex;
  align-items: center;
  gap: 0;
}

.wd-fcs-node {
  padding: 7px 14px;
  border-radius: 8px;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: white;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.3);
  white-space: nowrap;
}

.fcs-sf {
  background: rgba(255,255,255,0.28);
  border-color: rgba(255,255,255,0.55);
  transform: scale(1.05);
}

.wd-fcs-cline {
  width: 20px;
  height: 2px;
  background: rgba(255,255,255,0.35);
  position: relative;
}

.wd-fcs-cline::before,
.wd-fcs-cline::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  transform: translateY(-50%);
}

.wd-fcs-cline::before { left: 0; }
.wd-fcs-cline::after  { right: 0; }

/* --- Mobile ------------------------------------------------ */
@media (max-width: 680px) {
  .wd-fan-stage { height: 420px; }
  .wd-services .wd-fan-stage { height: 400px; }

  .wd-fan-card {
    width: min(340px, 88vw);
    height: 420px;
    margin-left: calc(min(340px, 88vw) / -2);
  }

  .wd-fan-card--svc {
    height: 380px;
  }

  .wd-fan-wrap { padding-left: 44px; padding-right: 44px; }
}

/* ============================================================
   SERVICES GRID (replaces fan deck)
   ============================================================ */

.wd-svc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 3rem;
}

.wd-svc-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(14,17,23,0.08);
  box-shadow:
    0 4px 24px rgba(0,0,0,0.07),
    0 1px 4px rgba(0,0,0,0.04);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
  cursor: default;
}

.wd-svc-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 20px 56px rgba(0,0,0,0.11),
    0 4px 16px rgba(0,0,0,0.07);
}

.wd-svc-card .wd-fcs-header {
  flex-shrink: 0;
}

.wd-svc-card .wd-fcs-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.wd-svc-card .wd-fcs-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wd-svc-card .wd-fcs-desc {
  flex: 1;
}

@media (max-width: 900px) {
  .wd-svc-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 540px) {
  .wd-svc-grid { grid-template-columns: 1fr; gap: 1rem; }
  .wd-svc-card .wd-fcs-title { white-space: normal; }
}

/* ================================================================
   SERVICES — CARD STACK (light theme)
   ================================================================ */

.wd-cardstack-wrap {
  position: relative;
  margin-top: 3.5rem;
  padding-bottom: 3rem;
}

/* Stage — perspective container */
.wd-csk-stage {
  position: relative;
  height: 500px;
  perspective: 1100px;
  perspective-origin: 50% 85%;
}

/* Individual card — light theme */
.wd-csk-card {
  position: absolute;
  width: 370px;
  height: 456px;
  left: 50%;
  bottom: 0;
  margin-left: -185px;

  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(14,17,23,0.09);
  box-shadow:
    0 4px 20px rgba(0,0,0,0.08),
    0 1px 4px rgba(0,0,0,0.05);

  display: flex;
  flex-direction: column;

  /* Start hidden — JS sets initial positions before enabling transitions */
  opacity: 0;
  transform-origin: bottom center;
  transition:
    transform 0.50s cubic-bezier(0.34, 1.35, 0.64, 1),
    opacity   0.30s ease,
    box-shadow 0.28s ease;
  will-change: transform, opacity;
  user-select: none;
  cursor: pointer;
}

/* Transitions are suppressed by JS during initial layout, then enabled */
.wd-csk-card.csk-ready {
  opacity: 1; /* JS controls this via inline style after positioning */
}

.wd-csk-card.is-active {
  box-shadow:
    0 16px 48px rgba(0,0,0,0.13),
    0 4px 16px rgba(0,0,0,0.08);
}

/* Full-bleed image container — covers entire upper card area */
.wd-csk-top {
  position: relative;
  height: 220px;
  overflow: hidden;
  flex-shrink: 0;
}

.wd-csk-top > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}

.wd-csk-card:hover .wd-csk-top > img {
  transform: scale(1.04);
}

/* Icon + chip bar — overlaid at the bottom of the image as dark scrim */
.wd-csk-hdr {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0) 100%);
  padding: 28px 16px 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.6rem;
}

/* Icon badge */
.wd-csk-icon {
  width: 42px;
  height: 42px;
  background: rgba(255,255,255,0.18);
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

/* Agentforce brand overlay — top of the image */
.wd-af-overlay {
  position: absolute;
  top: 0; left: 0; right: 0;
  padding: 14px 16px 32px;
  background: linear-gradient(to bottom, rgba(0,0,0,0.62) 0%, transparent 100%);
  display: flex;
  flex-direction: column;
  gap: 3px;
  z-index: 2;
}

.wd-af-brand {
  display: flex;
  align-items: center;
  gap: 9px;
}

.wd-af-hex-icon {
  flex-shrink: 0;
  filter: drop-shadow(0 0 6px rgba(139,92,246,0.7));
}

.wd-af-wordmark {
  font-size: 1.15rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
}

.wd-af-byline {
  font-size: 0.6rem;
  font-weight: 600;
  color: rgba(255,255,255,0.65);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding-left: 41px;
}

/* Illustration area (kept for non-image cards) */
.wd-csk-illus {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  position: relative;
  z-index: 1;
}


/* Chip label in header */
.wd-csk-chip {
  display: inline-block;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.28);
  padding: 4px 10px;
  border-radius: 100px;
  margin-left: auto;
  position: relative;
  z-index: 1;
  white-space: nowrap;
}

/* White body section */
.wd-csk-body {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.wd-csk-title {
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  font-weight: 700;
  color: var(--wd-dark, #1a1a2e);
  line-height: 1.28;
  margin: 0 0 0.55rem;
  letter-spacing: -0.015em;
}

.wd-csk-desc {
  font-size: 0.8rem;
  color: var(--wd-muted, #6b7280);
  line-height: 1.6;
  margin: 0 0 1rem;
  flex: 1;
}

.wd-csk-link {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--csk-accent, #1d4ed8);
  text-decoration: none;
  align-self: flex-start;
  margin-top: auto;
  transition: gap 0.2s ease;
  background: none;
  border: none;
}

.wd-csk-link:hover {
  gap: 0.6rem;
  background: none;
  border-color: transparent;
  opacity: 1;
}

/* Dots navigation */
.wd-csk-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 2rem;
}

.wd-csk-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background: rgba(0,0,0,0.15);
  cursor: pointer;
  transition: background 0.25s ease, transform 0.25s ease;
}

.wd-csk-dot.is-active {
  background: var(--wd-dark, #1a1a2e);
  transform: scale(1.4);
}

/* Mobile */
@media (max-width: 680px) {
  .wd-csk-stage { height: 430px; }
  .wd-csk-card {
    width: min(330px, 88vw);
    height: 410px;
    margin-left: calc(min(330px, 88vw) / -2);
  }
  .wd-csk-hdr { height: 162px; }
}

/* ================================================================
   INDUSTRY STACKED SCROLL CARDS
   ================================================================ */

.wd-stack-cards-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 52px clamp(16px, 4vw, 48px) 200px;
  position: relative;
  z-index: 1;
}

.wd-stack-card {
  position: sticky;
  top: 148px; /* header 72px + bookmark tabs 42px + 34px gap */
  z-index: var(--card-idx, 1);
  background: transparent;
  border-radius: 0 0 20px 20px;
  margin: 0 auto clamp(100px, 18vh, 180px);
  border: none;
  transform-origin: top center;
  transition: transform 0.35s ease, opacity 0.35s ease;
  overflow: visible;
  will-change: transform;
}

.wd-stack-card:last-child {
  margin-bottom: clamp(100px, 18vh, 180px);
}

/*
  Bookmark tab — sticks UP above the card's top edge, staggered
  horizontally so all six tabs are simultaneously visible when cards stack.
  The tab belongs to its card but lives in the 52 px headroom above the wrap.
*/
.wd-sc-bookmark {
  position: absolute;
  bottom: 100%;            /* flush with card's top edge                   */
  left: calc((var(--card-idx, 1) - 1) * (100% / 6) + 2px);
  width: calc(100% / 6 - 4px);
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  border: none;
  border-radius: 10px 10px 0 0;
  background: var(--card-accent, #3B82F6);
  cursor: pointer;
  box-shadow: 0 -3px 10px rgba(0,0,0,0.10);
  opacity: 0.42;
  transition:
    opacity    0.3s ease,
    box-shadow 0.3s ease;
  z-index: 10;
  overflow: hidden;
}

.wd-sc-bookmark:hover {
  opacity: 0.72;
}

.wd-sc-bookmark.is-active {
  opacity: 1;
  box-shadow: 0 -4px 14px rgba(0,0,0,0.20);
}

/* Tiny shine line at active tab bottom edge to visually "connect" to card */
.wd-sc-bookmark.is-active::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: rgba(255,255,255,0.35);
}

.wd-sc-bm-l {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: rgba(255,255,255,0.92);
  line-height: 1.3;
  text-align: center;
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: none;
}

/* Placeholder for old selectors referenced later in the file */
.wd-sc-bm-num {
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--card-accent, #333);
  line-height: 1;
  letter-spacing: -0.03em;
}

.wd-sc-bm.is-active .wd-sc-bm-num {
  color: #fff;
}

.wd-sc-bm-name {
  font-size: 0.48rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #6b7280;
  line-height: 1.35;
  text-align: center;
}

.wd-sc-bm.is-active .wd-sc-bm-name {
  color: rgba(255,255,255,0.88);
}

.wd-stack-card::before {
  display: none;
}

.wd-sc-inner {
  display: grid;
  grid-template-columns: 1fr 360px;
  min-height: 320px;
  border-radius: 0 0 20px 20px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  box-shadow:
    0 4px 24px rgba(0,0,0,0.07),
    0 1px 4px rgba(0,0,0,0.04);
  transition: box-shadow 0.35s ease;
}

.wd-sc-content {
  padding: clamp(28px, 4vw, 44px);
  display: flex;
  flex-direction: column;
}

.wd-sc-tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--card-accent, var(--wd-green));
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.08);
  padding: 4px 12px;
  border-radius: 100px;
  margin-bottom: 0.9rem;
  align-self: flex-start;
}

.wd-sc-content h3 {
  font-size: clamp(1.05rem, 1.7vw, 1.35rem);
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.25;
  margin-bottom: 1rem;
}

.wd-sc-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
}

.wd-sc-list li {
  font-size: 0.86rem;
  color: var(--wd-muted);
  padding-left: 1.1rem;
  position: relative;
  line-height: 1.5;
}

.wd-sc-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.52em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--card-accent, var(--wd-green));
}

.wd-sc-kpi {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: flex-start;      /* prevents stretching to full column width */
  gap: 0.15rem;
  padding: 0.7rem 1rem 0.65rem;
  background: var(--card-accent, var(--wd-green));
  border-radius: 12px;
  margin-bottom: 0.85rem;
  box-shadow: 0 4px 14px rgba(0,0,0,0.14);
  position: relative;
  overflow: hidden;
}

/* Subtle inner shine */
.wd-sc-kpi::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.16) 0%, transparent 55%);
  pointer-events: none;
}

.wd-sc-kpi-n {
  font-size: clamp(1.75rem, 2.4vw, 2.1rem);
  font-weight: 900;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.03em;
  position: relative;
  text-shadow: none;
}

.wd-sc-kpi-t {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.95);
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.35;
  position: relative;
}

.wd-sc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-top: auto;
  padding-top: 0.5rem;
}

.wd-sc-chips span {
  font-size: 0.62rem;
  font-weight: 600;
  color: #6b7280;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.07);
  padding: 3px 9px;
  border-radius: 100px;
}

.wd-sc-image-panel {
  display: flex;
  overflow: hidden;
  min-height: 320px;
  background: #e5e7eb;
}
.wd-sc-image-panel img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  flex: 1;
  min-height: 0;
  transition: transform 0.5s ease;
}
.wd-stack-card:hover .wd-sc-image-panel img {
  transform: scale(1.04);
}
.wd-sol-eco .wd-sc-inner {
  min-height: 240px;
}
.wd-sol-eco .wd-sc-image-panel {
  min-height: 240px;
  background: #f0f2f5;
}
.wd-sol-eco .wd-sc-image-panel img {
  object-fit: cover;
  object-position: center;
}
.wd-sc-trusted {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: auto;
  padding-top: 2rem;
}
.wd-sc-trusted-label {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--wd-muted);
}
.wd-sc-trusted-logos {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.wd-sc-trusted-logos img {
  width: 120px;
  height: auto;
  max-height: 72px;
  object-fit: contain;
  filter: grayscale(20%);
  opacity: 0.9;
  transition: filter 0.25s ease, opacity 0.25s ease;
}
.wd-sc-trusted-logos img:hover {
  filter: grayscale(0%);
  opacity: 1;
}

/* --- Industry cards mobile -------------------------------- */
@media (max-width: 760px) {
  .wd-stack-cards-wrap {
    padding-right: clamp(16px, 4vw, 48px); /* restore normal padding; hide bookmarks */
  }

  .wd-sc-bookmark {
    display: none; /* bookmarks hidden on mobile; cards still scroll-stack */
  }

  .wd-sc-inner {
    grid-template-columns: 1fr;
  }

  .wd-sc-image-panel {
    display: none;
  }

  .wd-stack-card {
    margin-bottom: clamp(60px, 12vh, 100px);
  }

  .wd-stack-card:last-child {
    margin-bottom: 300px;
  }
}


/* ============================================================
   SCROLL ANIMATION POLISH
   ============================================================ */

/* Eyebrow line draws in when section header enters view */
.wd-section-header .eyebrow::before {
  width: 0;
  transition: width 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0.18s;
}
.wd-section-header.aos-in .eyebrow::before {
  width: 20px;
}

/* Smoother, snappier card hover transitions */
.wd-service-card,
.wd-insight-card,
.wd-leader-card {
  will-change: transform;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.3s ease;
}
.wd-service-card:hover  { transform: translateY(-5px); }
.wd-leader-card:hover   { transform: translateY(-5px); }
.wd-insight-card:hover  { transform: translateY(-5px); }

/* Hero metrics strip entrance */
.wd-hero-photo-metrics {
  animation: wd-metrics-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both;
}
@keyframes wd-metrics-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

/* Metric numbers count-up pop entrance */
.wd-hpm-num {
  animation: wd-num-pop 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both;
}
.wd-hpm-item:nth-child(3) .wd-hpm-num { animation-delay: 0.65s; }
.wd-hpm-item:nth-child(5) .wd-hpm-num { animation-delay: 0.75s; }
@keyframes wd-num-pop {
  0%   { opacity: 0; transform: scale(0.80); }
  65%  { transform: scale(1.06); }
  100% { opacity: 1; transform: scale(1); }
}

/* Glow pulse that fires once after count-up lands */
.wd-hpm-num.wd-counted {
  animation: wd-num-glow 0.9s ease-out forwards;
}
@keyframes wd-num-glow {
  0%   { text-shadow: 0 0 0px rgba(0,168,71,0); }
  40%  { text-shadow: 0 0 18px rgba(0,168,71,0.55); }
  100% { text-shadow: 0 0 0px rgba(0,168,71,0); }
}

/* Illustration card parallax — smooth transition hint */
.wd-illus {
  transition: transform 0.1s linear;
  will-change: transform;
}

/* Clip-path wipe — GPU compositing hint for smooth scrub */
.wd-insight-thumb,
.wd-leader-photo-img,
.wd-bc-vis {
  will-change: clip-path;
}

/* Card stagger entrance — GPU hint */
.wd-hi-card,
.wd-fan-card,
.wd-buycomm-card {
  will-change: transform, opacity;
}


/* ============================================================
   SOLUTIONS PAGE
   ============================================================ */

/* Shared inner container */
.wd-sol-section-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}

/* Hero: 3-item metrics bar — centered */
.wd-sol-hero .wd-hero-photo-metrics.wd-sol-metrics {
  grid-template-columns: repeat(5, auto);
  justify-content: center;
  max-width: 900px;
}
.wd-sol-hero .wd-sol-metrics .wd-hpm-item {
  padding: 2rem 2.5rem;
  align-items: center;
}
.wd-sol-hero .wd-sol-metrics .wd-hpm-item:last-child {
  border-right: none;
}
.wd-sol-hero .wd-sol-metrics .wd-hpm-num {
  font-size: 5rem;
}
.wd-sol-hero .wd-sol-metrics .wd-hpm-label {
  font-size: 0.85rem;
}

/* Eyebrow colour variants */
.wd-eyebrow-purple {
  color: #7C3AED;
  background: rgba(124,58,237,0.09);
  border-color: rgba(124,58,237,0.22);
}
.wd-eyebrow-white {
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.22);
}
.wd-text-purple { color: #A78BFA; }

/* ── Service Pillars ─────────────────────────────────────── */
.wd-sol-pillars {
  background:
    radial-gradient(ellipse 800px 400px at 110% -10%, rgba(0,176,80,0.04) 0%, transparent 55%),
    radial-gradient(ellipse 500px 300px at -10% 110%, rgba(90,111,255,0.04) 0%, transparent 55%),
    #F9FAFB;
  border-top: 1px solid var(--wd-border);
  padding-block: clamp(4rem, 8vw, 7rem);
}
.wd-sol-pillars .wd-section-header {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.wd-sol-pillars .wd-section-header p {
  max-width: 640px;
  margin-inline: auto;
}

.wd-sol-svc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto auto;
  gap: 1.5rem;
}

/* Last 2 cards (rows 2) centred in a 3-col grid */
.wd-sol-svc-card:nth-child(4) { grid-column: 1 / 2; }
.wd-sol-svc-card:nth-child(5) { grid-column: 2 / 3; }

.wd-sol-svc-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--wd-shadow-card);
  transition: transform 0.35s cubic-bezier(0.16,1,0.3,1), box-shadow 0.35s;
}
.wd-sol-svc-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 28px 64px rgba(0,0,0,0.11);
}

.wd-sol-svc-top {
  position: relative;
  height: 210px;
  overflow: hidden;
  flex-shrink: 0;
}
.wd-sol-svc-top > img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}
.wd-sol-svc-card:hover .wd-sol-svc-top > img { transform: scale(1.04); }

.wd-sol-svc-scrim {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0) 100%);
  padding: 32px 14px 12px;
  display: flex; align-items: center; gap: 0.6rem;
}
.wd-sol-svc-icon {
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  backdrop-filter: blur(4px);
}
.wd-sol-svc-badge {
  font-size: 0.65rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 999px; padding: 3px 10px;
  white-space: nowrap;
  margin-left: auto;
}

.wd-sol-svc-body {
  padding: 1.5rem;
  flex: 1;
  display: flex; flex-direction: column; gap: 0.65rem;
}
.wd-sol-svc-title {
  font-size: 1.1rem; font-weight: 700;
  color: var(--wd-dark); margin: 0;
  letter-spacing: -0.02em;
}
.wd-sol-svc-desc {
  font-size: 0.875rem; color: var(--wd-mid);
  line-height: 1.7; flex: 1; margin: 0;
}
.wd-sol-svc-link {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: 0.82rem; font-weight: 600;
  color: var(--wd-green);
  margin-top: auto;
  transition: gap 0.2s;
}
.wd-sol-svc-link:hover { gap: 0.55rem; }

/* ── Agentforce Spotlight ───────────────────────────────── */
.wd-sol-af-spot {
  background: var(--wd-off-white);
  border-top: 1px solid var(--wd-border);
  padding-top: clamp(4rem, 8vw, 7rem);
  padding-bottom: clamp(2rem, 3.5vw, 3rem);
  position: relative;
  overflow: hidden;
}
.wd-sol-af-spot::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 600px 400px at 80% 50%, rgba(109,40,217,0.06) 0%, transparent 55%),
    radial-gradient(ellipse 400px 300px at 20% 80%, rgba(79,70,229,0.04) 0%, transparent 55%);
  pointer-events: none;
}

.wd-sol-af-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: center;
}

.wd-sol-af-visual { position: relative; }
.wd-sol-af-img-wrap {
  position: relative;
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 32px rgba(14,17,23,0.08), 0 0 0 1px rgba(14,17,23,0.05);
}
.wd-sol-af-img-wrap img {
  width: 100%; height: 380px;
  object-fit: contain; object-position: center;
  display: block;
  padding: 2rem;
}
.wd-sol-af-img-badge {
  position: absolute; top: 16px; left: 16px;
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,0.90);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(14,17,23,0.10);
  border-radius: 12px; padding: 10px 14px;
}
.wd-sol-af-img-badge-title {
  font-size: 0.88rem; font-weight: 800; color: var(--wd-dark);
  letter-spacing: -0.01em;
}
.wd-sol-af-img-badge-sub {
  font-size: 0.6rem; font-weight: 600;
  color: var(--wd-mid);
  text-transform: uppercase; letter-spacing: 0.08em;
}

.wd-sol-af-content { position: relative; z-index: 1; }
.wd-sol-af-content h2 {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.wd-sol-af-lead {
  font-size: 1.05rem; color: var(--wd-mid);
  line-height: 1.75; margin-block: 1.25rem;
}

.wd-sol-af-features {
  list-style: none; padding: 0; margin: 0 0 2rem;
  display: flex; flex-direction: column; gap: 1rem;
}
.wd-sol-af-features li {
  display: flex; gap: 1rem; align-items: flex-start;
}
.wd-sol-af-feat-icon {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(109,40,217,0.08);
  border: 1px solid rgba(109,40,217,0.18);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 3px;
}
.wd-sol-af-features li > div {
  display: flex; flex-direction: column; gap: 3px;
}
.wd-sol-af-features li strong {
  font-size: 0.9rem; font-weight: 700; color: var(--wd-dark); line-height: 1.25;
}
.wd-sol-af-features li span {
  font-size: 0.82rem; color: var(--wd-mid); line-height: 1.45;
}
.wd-sol-af-ctas { display: flex; gap: 0.85rem; flex-wrap: wrap; }

/* ── Agentforce background orbs ────────────────────────── */
.wd-af-bg-orbs {
  position: absolute; inset: 0; overflow: hidden;
  pointer-events: none; z-index: 0;
}
.wd-af-bg-orb {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: 0;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
.wd-af-bg-orb-1 {
  width: 520px; height: 520px;
  top: -120px; left: -80px;
  background: radial-gradient(circle, rgba(0,161,224,0.09) 0%, transparent 70%);
  animation: afOrbDrift1 14s ease-in-out infinite alternate;
  opacity: 0.8;
}
.wd-af-bg-orb-2 {
  width: 420px; height: 420px;
  top: 30%; right: -60px;
  background: radial-gradient(circle, rgba(109,40,217,0.07) 0%, transparent 70%);
  animation: afOrbDrift2 18s ease-in-out infinite alternate;
  opacity: 0.7;
}
.wd-af-bg-orb-3 {
  width: 340px; height: 340px;
  bottom: -80px; left: 38%;
  background: radial-gradient(circle, rgba(0,176,80,0.07) 0%, transparent 70%);
  animation: afOrbDrift3 22s ease-in-out infinite alternate;
  opacity: 0.6;
}
@keyframes afOrbDrift1 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(60px, 40px) scale(1.12); }
}
@keyframes afOrbDrift2 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-50px, 55px) scale(1.08); }
}
@keyframes afOrbDrift3 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(40px, -45px) scale(1.15); }
}

/* ── Agentforce console card ────────────────────────────── */
.wd-af-console {
  position: relative;
  margin-top: 1rem;
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: 14px;
  overflow: hidden;
  animation: afConsoleFloat 4s ease-in-out infinite alternate;
  box-shadow: 0 4px 24px rgba(14,17,23,0.08), 0 1px 4px rgba(14,17,23,0.04);
}
@keyframes afConsoleFloat {
  from { transform: translateY(0px); }
  to   { transform: translateY(-8px); }
}
.wd-af-con-header {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.6rem 0.85rem;
  border-bottom: 1px solid rgba(14,17,23,0.07);
  background: rgba(14,17,23,0.02);
}
.wd-af-con-traffic {
  display: flex; gap: 5px; flex-shrink: 0;
}
.wd-af-con-traffic span {
  display: block; width: 10px; height: 10px; border-radius: 50%;
}
.wd-af-con-traffic span:nth-child(1) { background: #FF5F57; }
.wd-af-con-traffic span:nth-child(2) { background: #FEBC2E; }
.wd-af-con-traffic span:nth-child(3) { background: #28C840; }
.wd-af-con-title {
  display: flex; align-items: center; gap: 0.4rem;
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em;
  color: var(--wd-body); flex: 1;
}
.wd-af-con-title svg { width: 14px; height: 14px; flex-shrink: 0; }
.wd-af-con-live {
  display: flex; align-items: center; gap: 0.35rem;
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em;
  color: #28C840; text-transform: uppercase;
}
.wd-af-con-pulse {
  display: block; width: 6px; height: 6px; border-radius: 50%;
  background: #28C840;
  animation: afPulse 1.4s ease-in-out infinite;
}
@keyframes afPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(40,200,64,0.7); }
  50%       { box-shadow: 0 0 0 5px rgba(40,200,64,0); }
}

/* feed */
.wd-af-con-feed {
  min-height: 120px;
  max-height: 200px;
  overflow: hidden;
  padding: 0.5rem 0;
  display: flex; flex-direction: column; gap: 0;
}
.wd-af-feed-row {
  display: flex; align-items: flex-start; gap: 0.65rem;
  padding: 0.45rem 0.85rem;
  opacity: 0;
  transform: translateY(10px);
  transition: background 0.2s;
}
.wd-af-feed-row.is-active {
  animation: afSlideIn 0.35s ease forwards;
  background: rgba(14,17,23,0.03);
}
.wd-af-feed-row.is-done {
  animation: afSlideIn 0.35s ease forwards;
}
@keyframes afSlideIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.wd-af-feed-icon {
  flex-shrink: 0;
  width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.65rem; font-weight: 700; color: #fff;
  margin-top: 1px;
}
.wd-af-feed-body { flex: 1; min-width: 0; }
.wd-af-feed-agent {
  font-size: 0.68rem; font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: 0.02em;
  margin-bottom: 1px;
}
.wd-af-feed-action {
  font-size: 0.68rem; color: var(--wd-mid);
  line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.wd-af-feed-action.is-result {
  color: rgba(40,200,64,0.85);
}
.wd-af-typing {
  display: inline-flex; align-items: center; gap: 3px;
}
.wd-af-typing span {
  display: block; width: 4px; height: 4px; border-radius: 50%;
  background: rgba(14,17,23,0.28);
  animation: afTypeDot 1.1s ease-in-out infinite both;
}
.wd-af-typing span:nth-child(2) { animation-delay: 0.15s; }
.wd-af-typing span:nth-child(3) { animation-delay: 0.30s; }
@keyframes afTypeDot {
  0%, 80%, 100% { transform: scale(1); opacity: 0.4; }
  40%            { transform: scale(1.5); opacity: 1; }
}

/* footer metrics */
.wd-af-con-footer {
  display: flex; align-items: center; justify-content: space-around;
  padding: 0.6rem 0.85rem;
  border-top: 1px solid rgba(14,17,23,0.07);
  background: rgba(14,17,23,0.02);
}
.wd-af-con-metric {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
}
.wd-af-con-mn {
  font-size: 0.88rem; font-weight: 700;
  color: var(--wd-dark); letter-spacing: -0.01em;
}
.wd-af-con-ml {
  font-size: 0.6rem; color: var(--wd-mid);
  text-transform: uppercase; letter-spacing: 0.06em;
}
.wd-af-con-sep {
  width: 1px; height: 28px;
  background: rgba(14,17,23,0.08);
}

/* ── Salesforce Ecosystem ───────────────────────────────── */
.wd-sol-eco {
  background: #fff;
  border-top: 1px solid var(--wd-border);
  padding-top: clamp(2rem, 3.5vw, 3rem);
  padding-bottom: 0;
}
.wd-sol-eco .wd-section-header {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.wd-sol-eco .wd-section-header p {
  max-width: 600px; margin-inline: auto;
}

.wd-sol-eco-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}

.wd-sol-eco-tile {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: var(--wd-radius);
  overflow: hidden;
  box-shadow: var(--wd-shadow-xs);
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), box-shadow 0.3s, border-color 0.3s;
  display: flex; flex-direction: column;
}
.wd-sol-eco-tile:hover {
  transform: translateY(-4px);
  box-shadow: var(--wd-shadow);
  border-color: rgba(14,17,23,0.12);
}

.wd-sol-eco-icon {
  background: var(--eco-col, #00A1E0);
  height: 56px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.wd-sol-eco-body {
  padding: 1rem;
  flex: 1;
  display: flex; flex-direction: column; gap: 0.35rem;
}
.wd-sol-eco-name {
  font-size: 0.82rem; font-weight: 700;
  color: var(--wd-dark); line-height: 1.3;
}
.wd-sol-eco-desc {
  font-size: 0.75rem; color: var(--wd-muted);
  line-height: 1.6;
}

/* ── Why WarpDrive ──────────────────────────────────────── */
.wd-sol-why {
  background:
    radial-gradient(ellipse 700px 400px at 105% 0%, rgba(0,176,80,0.05) 0%, transparent 55%),
    radial-gradient(ellipse 500px 350px at -5% 100%, rgba(90,111,255,0.04) 0%, transparent 55%),
    var(--wd-off-white);
  border-top: 1px solid var(--wd-border);
  padding-block: clamp(4rem, 8vw, 7rem);
  position: relative; overflow: hidden;
}

/* Animated scrolling grid — mirrors the React component's AnimatedGrid */
.wd-why-grid {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 50% 50%, transparent 10%, #F7F8FC 62%),
    linear-gradient(rgba(14,17,23,0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14,17,23,0.055) 1px, transparent 1px);
  background-size: cover, 40px 40px, 40px 40px;
  background-position: center, 0px 0px, 0px 0px;
  animation: wdWhyGrid 6s linear infinite;
  pointer-events: none; z-index: 0;
}
@keyframes wdWhyGrid {
  to { background-position: center, 40px 40px, 40px 40px; }
}
.wd-sol-why .wd-sol-section-inner { position: relative; z-index: 1; }

.wd-sol-why .wd-section-header {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.wd-sol-why .wd-section-header p {
  max-width: 560px; margin-inline: auto;
}

.wd-sol-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

/* Cards: start hidden with tilt, animate in via .is-visible */
.wd-sol-why-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: var(--wd-radius-lg);
  padding: clamp(1.5rem, 2.5vw, 2rem);
  box-shadow: var(--wd-shadow-card);
  display: flex; flex-direction: column; gap: 0.9rem;
  position: relative; overflow: hidden;
  opacity: 0;
  transform: rotate(var(--card-rot, 0deg)) translateY(26px) scale(0.96);
  transition: opacity 0.55s cubic-bezier(0.16,1,0.3,1),
              transform 0.38s cubic-bezier(0.16,1,0.3,1),
              box-shadow 0.32s;
}
.wd-sol-why-card.is-visible {
  opacity: 1;
  transform: rotate(var(--card-rot, 0deg));
}
.wd-sol-why-card.is-visible:hover {
  transform: rotate(calc(var(--card-rot, 0deg) + 2deg)) scale(1.05) translateY(-6px);
  box-shadow: 0 20px 60px rgba(14,17,23,0.13), 0 2px 8px rgba(14,17,23,0.07);
}

/* Cursor spotlight */
.wd-sol-why-card::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(
    circle 260px at var(--mx, 50%) var(--my, 50%),
    rgba(0,176,80,0.08) 0%,
    transparent 65%
  );
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
  z-index: 0;
  border-radius: inherit;
}
.wd-sol-why-card:hover::before { opacity: 1; }

/* Top accent sweep */
.wd-sol-why-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--wd-green) 0%, #00e676 100%);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.55s cubic-bezier(0.16,1,0.3,1);
  z-index: 1;
  border-radius: 2px 2px 0 0;
}
.wd-sol-why-card:hover::after { transform: scaleX(1); }

/* Ensure card children sit above pseudo-elements */
.wd-sol-why-icon,
.wd-sol-why-card h3,
.wd-sol-why-card p { position: relative; z-index: 1; }

.wd-sol-why-icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--wd-gradient);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0,176,80,0.25);
  transition: transform 0.45s cubic-bezier(0.16,1,0.3,1), box-shadow 0.45s;
}
.wd-sol-why-card:hover .wd-sol-why-icon {
  transform: scale(1.14) rotate(-8deg);
  box-shadow: 0 10px 28px rgba(0,176,80,0.45);
}

.wd-sol-why-card h3 {
  font-size: 1rem; font-weight: 700;
  color: var(--wd-dark); margin: 0;
  line-height: 1.35;
  transition: color 0.25s;
}
.wd-sol-why-card:hover h3 { color: #000; }

.wd-sol-why-card p {
  font-size: 0.875rem; color: var(--wd-mid);
  line-height: 1.72; margin: 0;
}

/* Benefit pills staggered entrance */
.wd-sol-benefit-pill {
  opacity: 0;
  transform: translateY(14px) scale(0.92);
}
.wd-sol-benefits.is-visible .wd-sol-benefit-pill {
  animation: wdPillIn 0.55s cubic-bezier(0.16,1,0.3,1) forwards;
}
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(1) { animation-delay: 0.00s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(2) { animation-delay: 0.06s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(3) { animation-delay: 0.12s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(4) { animation-delay: 0.18s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(5) { animation-delay: 0.24s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(6) { animation-delay: 0.30s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(7) { animation-delay: 0.36s; }
.wd-sol-benefits.is-visible .wd-sol-benefit-pill:nth-child(8) { animation-delay: 0.42s; }
@keyframes wdPillIn {
  from { opacity: 0; transform: translateY(14px) scale(0.92); }
  to   { opacity: 1; transform: none; }
}

/* Benefit pills */
.wd-sol-benefits {
  display: flex; flex-wrap: wrap; gap: 0.65rem;
  justify-content: center;
}
.wd-sol-benefit-pill {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.78rem; font-weight: 600;
  color: var(--wd-body);
  background: #fff;
  border: 1px solid rgba(14,17,23,0.1);
  border-radius: 999px; padding: 0.45rem 1rem;
  box-shadow: var(--wd-shadow-xs);
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.wd-sol-benefit-pill:hover {
  background: var(--wd-green-tint);
  border-color: rgba(0,176,80,0.25);
  transform: translateY(-1px);
}
.wd-sol-benefit-pill svg { color: var(--wd-green); flex-shrink: 0; }

/* ── Our Process ────────────────────────────────────────── */
.wd-sol-process {
  background: #fff;
  border-top: 1px solid var(--wd-border);
  padding-block: clamp(4rem, 8vw, 7rem);
}
.wd-sol-process .wd-section-header {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}
.wd-sol-process .wd-section-header p {
  max-width: 580px; margin-inline: auto;
}

.wd-sol-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
}
/* Connecting line between steps */
.wd-sol-steps::before {
  content: '';
  position: absolute;
  top: 28px; left: calc(100% / 6);
  width: calc(100% * 2 / 3);
  height: 2px;
  background: linear-gradient(90deg, var(--wd-green) 0%, rgba(0,176,80,0.2) 100%);
  z-index: 0;
}

.wd-sol-step {
  padding: 0 1.5rem;
  position: relative;
  z-index: 1;
}
.wd-sol-step:first-child { padding-left: 0; }
.wd-sol-step:last-child  { padding-right: 0; }

.wd-sol-step-num {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--wd-gradient);
  color: #fff; font-size: 1.1rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 20px rgba(0,176,80,0.3);
  letter-spacing: -0.02em;
  position: relative; z-index: 2;
}
.wd-sol-step-tag {
  display: inline-flex;
  font-size: 0.65rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--wd-green);
  background: rgba(0,176,80,0.08);
  border: 1px solid rgba(0,176,80,0.2);
  border-radius: 999px; padding: 3px 10px;
  margin-bottom: 0.65rem;
}
.wd-sol-step-content h3 {
  font-size: 1.1rem; font-weight: 700;
  color: var(--wd-dark); margin: 0 0 0.65rem;
  line-height: 1.3;
}
.wd-sol-step-content p {
  font-size: 0.875rem; color: var(--wd-mid);
  line-height: 1.72; margin: 0 0 1rem;
}
.wd-sol-step-checklist {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 0.4rem;
}
.wd-sol-step-checklist li {
  font-size: 0.8rem; color: var(--wd-mid);
  padding-left: 1.1rem; position: relative; line-height: 1.55;
}
.wd-sol-step-checklist li::before {
  content: '';
  position: absolute; left: 0; top: 6px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--wd-green);
  opacity: 0.6;
}

/* ── Social Proof ───────────────────────────────────────── */
.wd-sol-proof {
  background: var(--wd-gradient-dark);
  padding-block: clamp(4rem, 8vw, 7rem);
  position: relative; overflow: hidden;
}
.wd-sol-proof::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 700px 400px at 85% 20%, rgba(0,176,80,0.12) 0%, transparent 55%),
    radial-gradient(ellipse 500px 350px at 15% 80%, rgba(90,111,255,0.08) 0%, transparent 55%);
  pointer-events: none;
}

.wd-sol-proof-header {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  position: relative; z-index: 1;
}
.wd-sol-proof-header h2 {
  color: #fff;
  margin-block: 0.75rem;
}
.wd-sol-proof-header p {
  color: rgba(255,255,255,0.55);
  max-width: 480px; margin-inline: auto;
}

.wd-sol-proof-metrics {
  display: flex; align-items: stretch;
  justify-content: center; flex-wrap: wrap;
  gap: 0;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  margin-bottom: 3.5rem;
  position: relative; z-index: 1;
}

.wd-sol-proof-metric {
  flex: 1; min-width: 140px;
  padding: 2rem 1.5rem;
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 0.4rem;
}
.wd-sol-proof-divider {
  width: 1px; background: rgba(255,255,255,0.08);
  align-self: stretch; flex-shrink: 0;
}
.wd-sol-proof-num {
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  font-weight: 900; color: #fff;
  line-height: 1; letter-spacing: -0.04em;
}
.wd-sol-proof-stars {
  display: flex; gap: 2px; justify-content: center;
}
.wd-sol-proof-label {
  font-size: 0.78rem; color: rgba(255,255,255,0.55);
  font-weight: 500; letter-spacing: 0.02em;
  text-transform: uppercase;
}

.wd-sol-proof-quote {
  position: relative; z-index: 1;
  max-width: 640px; margin-inline: auto;
  text-align: center;
}
.wd-sol-proof-qmark {
  display: block; margin: 0 auto 1.25rem;
}
.wd-sol-proof-quote p {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  color: rgba(255,255,255,0.8);
  font-style: italic; line-height: 1.7;
  margin-bottom: 1.25rem;
}
.wd-sol-proof-attr {
  display: flex; flex-direction: column; gap: 2px;
}
.wd-sol-proof-attr strong {
  font-size: 0.88rem; color: #fff; font-weight: 700;
}
.wd-sol-proof-attr span {
  font-size: 0.78rem; color: rgba(255,255,255,0.45);
}

/* ── CTA Band ───────────────────────────────────────────── */
.wd-sol-cta-band {
  background: var(--wd-gradient);
  padding-block: clamp(4rem, 8vw, 6rem);
  position: relative; overflow: hidden;
  text-align: center;
}
.wd-sol-cta-bg {
  position: absolute; inset: 0; pointer-events: none;
}
.wd-sol-cta-orb {
  position: absolute; border-radius: 50%;
  background: rgba(255,255,255,0.06);
  filter: blur(60px);
}
.wd-sol-cta-orb-1 {
  width: 500px; height: 500px;
  top: -200px; right: -100px;
}
.wd-sol-cta-orb-2 {
  width: 350px; height: 350px;
  bottom: -150px; left: -80px;
}

.wd-sol-cta-inner {
  position: relative; z-index: 1;
  display: flex; flex-direction: column;
  align-items: center; gap: 1rem;
}
.wd-sol-cta-inner h2 {
  color: #fff; font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800; margin: 0.5rem 0;
}
.wd-sol-cta-inner p {
  color: rgba(255,255,255,0.8);
  max-width: 520px; margin-inline: auto;
  font-size: 1.05rem;
}
.wd-sol-cta-actions {
  display: flex; gap: 1rem; flex-wrap: wrap;
  justify-content: center; margin-top: 0.75rem;
}
.wd-sol-cta-note {
  font-size: 0.78rem; color: rgba(255,255,255,0.6);
  letter-spacing: 0.03em;
}

/* ── Salesforce Stacked Scroll ──────────────────────────── */
.wd-sol-stk-track {
  position: relative;
  /* Height set dynamically by JS (stage-height + 5 × dwell-per-card) */
}

.wd-sol-stk-stage {
  position: sticky;
  top: 80px;
  height: clamp(460px, calc(100vh - 110px), 680px);
  overflow: visible;
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 1.25rem;
  align-items: stretch;
}

/* ── Bookmark nav ─────────────────────────────────────────── */
.wd-sol-stk-nav {
  display: flex;
  flex-direction: column;
  gap: 5px;
  height: 100%;
}

.wd-sol-stk-bk {
  display: flex;
  align-items: stretch;
  background: rgba(14,17,23,0.04);
  border: 1px solid rgba(14,17,23,0.08);
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  flex: 1;
  min-height: 0;
  text-align: left;
  padding: 0;
  transition:
    background 0.35s ease,
    border-color 0.35s ease,
    flex 0.45s cubic-bezier(0.16,1,0.3,1);
}
.wd-sol-stk-bk:hover {
  background: rgba(14,17,23,0.065);
  border-color: rgba(14,17,23,0.13);
}
.wd-sol-stk-bk.is-active {
  flex: 2.2;
  background: color-mix(in srgb, var(--eco-col) 8%, #fff);
  border-color: color-mix(in srgb, var(--eco-col) 30%, transparent);
}

/* Left colour accent bar */
.wd-sol-stk-bk-accent {
  width: 4px;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--eco-col) 28%, rgba(14,17,23,0.1));
  transition: background 0.35s ease;
}
.wd-sol-stk-bk.is-active .wd-sol-stk-bk-accent {
  background: var(--eco-col);
}

/* Content area */
.wd-sol-stk-bk-inner {
  flex: 1;
  min-width: 0;
  padding: 0.6rem 0.85rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.3rem;
}

.wd-sol-stk-bk-num {
  display: block;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--eco-col);
  opacity: 0.65;
  line-height: 1;
  transition: opacity 0.3s;
}
.wd-sol-stk-bk.is-active .wd-sol-stk-bk-num { opacity: 1; }

.wd-sol-stk-bk-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.wd-sol-stk-bk-icon {
  width: 26px; height: 26px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--eco-col) 13%, transparent);
  border: 1px solid color-mix(in srgb, var(--eco-col) 22%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--eco-col);
  flex-shrink: 0;
  transition: background 0.3s, border-color 0.3s;
}
.wd-sol-stk-bk.is-active .wd-sol-stk-bk-icon {
  background: color-mix(in srgb, var(--eco-col) 20%, transparent);
  border-color: color-mix(in srgb, var(--eco-col) 35%, transparent);
}

.wd-sol-stk-bk-name {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--wd-body);
  line-height: 1.35;
  /* inactive: single line + ellipsis */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.3s;
}
.wd-sol-stk-bk.is-active .wd-sol-stk-bk-name {
  white-space: normal;
  color: var(--wd-dark);
  font-weight: 700;
}

/* ── Card deck ────────────────────────────────────────────── */
.wd-sol-stk-deck {
  position: relative;
  height: 100%;
}

.wd-sol-stk-card {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  border-radius: 20px;
  overflow: hidden;
  box-shadow:
    0 2px 6px rgba(0,0,0,0.06),
    0 12px 40px rgba(0,0,0,0.13),
    0 32px 80px rgba(0,0,0,0.10);
  background: #fff;
  opacity: 0;
  transform: translateY(52px) scale(0.96);
  will-change: transform, opacity;
}
.wd-sol-stk-card:first-child {
  /* Visible before JS runs */
  opacity: 1;
  transform: none;
}

/* Left: image pane */
.wd-sol-stk-media {
  position: relative;
  overflow: hidden;
}
.wd-sol-stk-media img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.wd-sol-stk-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    150deg,
    color-mix(in srgb, var(--eco-col) 55%, #000) 0%,
    rgba(0,0,0,0.15) 55%,
    transparent 100%
  );
}
.wd-sol-stk-counter {
  position: absolute;
  top: 1.25rem; left: 1.25rem;
  font-size: 0.65rem; font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  background: rgba(0,0,0,0.32);
  backdrop-filter: blur(8px) saturate(1.5);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 8px;
  padding: 5px 12px;
  line-height: 1;
}
.wd-sol-stk-counter span {
  opacity: 0.55;
  font-weight: 600;
}

/* Right: content pane */
.wd-sol-stk-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  padding: clamp(2rem, 4.5vw, 3.5rem) clamp(1.75rem, 4vw, 3rem);
  background: #fff;
}

.wd-sol-stk-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  color: var(--eco-col);
  line-height: 1;
}

.wd-sol-stk-body h3 {
  font-size: clamp(1.55rem, 2.8vw, 2.3rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.15;
  color: var(--wd-dark);
  margin: 0;
}

.wd-sol-stk-body > p {
  font-size: clamp(0.9rem, 1.2vw, 1rem);
  color: var(--wd-mid);
  line-height: 1.72;
  margin: 0;
  max-width: 38ch;
}

.wd-sol-stk-list {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.wd-sol-stk-list li {
  font-size: 0.875rem;
  color: var(--wd-mid);
  padding-left: 1.25rem;
  position: relative;
  line-height: 1.55;
}
.wd-sol-stk-list li::before {
  content: '';
  position: absolute;
  left: 0; top: 6px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--eco-col);
}

/* Vertical progress dots — right side of stage */
.wd-sol-stk-dots {
  position: absolute;
  right: -28px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 20;
}
.wd-sol-stk-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(14,17,23,0.18);
  transition: background 0.3s, transform 0.3s;
}
.wd-sol-stk-dot.is-active {
  background: var(--wd-green);
  transform: scale(1.5);
}

/* 12-card stack variant (Solutions page) — divide tabs into 12 slots */
.wd-stack-cards-12 .wd-sc-bookmark {
  left:  calc((var(--card-idx, 1) - 1) * (100% / 12) + 2px);
  width: calc(100% / 12 - 4px);
}
.wd-stack-cards-12 .wd-sc-bm-l {
  font-size: 0.5rem;
  letter-spacing: 0.04em;
}
.wd-stack-cards-10 .wd-sc-bookmark {
  left:  calc((var(--card-idx, 1) - 1) * (100% / 10) + 2px);
  width: calc(100% / 10 - 4px);
}
.wd-stack-cards-10 .wd-sc-bm-l {
  font-size: 0.55rem;
  letter-spacing: 0.04em;
}

/* ── Ecosystem Parallax Feature Rows ────────────────────── */
.wd-sol-eco-feats {
  display: flex;
  flex-direction: column;
}

.wd-sol-eco-feat {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2.5rem, 6vw, 5rem);
  align-items: center;
  padding-block: clamp(3.5rem, 7vw, 5rem);
  border-bottom: 1px solid var(--wd-border);
}
.wd-sol-eco-feat:last-of-type { border-bottom: none; }

.wd-sol-eco-feat.is-rev [data-eco-img]  { order: 2; }
.wd-sol-eco-feat.is-rev [data-eco-body] { order: 1; }

[data-eco-img] {
  position: relative;
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  clip-path: inset(0 100% 0 0);
  opacity: 0;
  will-change: clip-path, opacity;
  box-shadow: 0 12px 48px rgba(0,0,0,0.12);
}
[data-eco-img] img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
}

.wd-sol-eco-feat-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--eco-col, #00A1E0);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

[data-eco-body] {
  transform: translateY(-50px);
  opacity: 0;
  will-change: transform, opacity;
}

.wd-sol-eco-feat-cloud {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--eco-col, #00A1E0);
  margin-bottom: 0.75rem;
  display: block;
}

[data-eco-body] h3 {
  font-size: clamp(1.5rem, 2.8vw, 2.2rem);
  font-weight: 800;
  color: var(--wd-dark);
  line-height: 1.2;
  margin: 0 0 1rem;
  letter-spacing: -0.03em;
}

[data-eco-body] > p {
  font-size: 1rem;
  color: var(--wd-mid);
  line-height: 1.75;
  margin: 0 0 1.25rem;
}

.wd-sol-eco-feat-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.wd-sol-eco-feat-list li {
  font-size: 0.875rem;
  color: var(--wd-mid);
  padding-left: 1.3rem;
  position: relative;
  line-height: 1.6;
}
.wd-sol-eco-feat-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wd-green);
}

/* "Also on the platform" chips row */
.wd-sol-eco-also {
  padding-block: 2.5rem;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  border-top: 1px solid var(--wd-border);
  margin-top: 0.5rem;
}
.wd-sol-eco-also-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  white-space: nowrap;
}
.wd-sol-eco-also-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.wd-sol-eco-also-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--eco-col);
  background: color-mix(in srgb, var(--eco-col) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--eco-col) 25%, transparent);
  border-radius: 999px;
  padding: 0.4rem 0.9rem;
  transition: background 0.2s, transform 0.2s;
}
.wd-sol-eco-also-chip:hover {
  background: color-mix(in srgb, var(--eco-col) 18%, transparent);
  transform: translateY(-1px);
}

/* ── Solutions Responsive ───────────────────────────────── */
@media (max-width: 1024px) {
  .wd-sol-svc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .wd-sol-svc-card:nth-child(4),
  .wd-sol-svc-card:nth-child(5) {
    grid-column: auto;
  }
  .wd-sol-eco-grid { grid-template-columns: repeat(3, 1fr); }
  .wd-sol-af-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .wd-sol-af-inner { grid-template-areas: "content" "visual"; }
  .wd-sol-af-visual { grid-area: visual; }
  .wd-sol-af-content { grid-area: content; }
}

@media (max-width: 1024px) {
  /* Collapse bookmark names — show icon + number only */
  .wd-sol-stk-stage { grid-template-columns: 56px 1fr; }
  .wd-sol-stk-bk-name { display: none; }
  .wd-sol-stk-bk-num { display: none; }
  .wd-sol-stk-bk-inner { padding: 0.5rem; align-items: center; }
  .wd-sol-stk-bk-label { justify-content: center; }
  .wd-sol-stk-bk-icon { width: 32px; height: 32px; border-radius: 8px; }
}

@media (max-width: 768px) {
  .wd-sol-svc-grid { grid-template-columns: 1fr; }
  .wd-sol-eco-grid { grid-template-columns: repeat(2, 1fr); }
  .wd-sol-why-grid { grid-template-columns: 1fr; }
  .wd-sol-steps {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .wd-sol-steps::before { display: none; }
  .wd-sol-step { padding: 0; }
  .wd-sol-proof-metrics { flex-direction: column; }
  .wd-sol-proof-divider { width: 100%; height: 1px; }

  /* On mobile, disable sticky stacking — plain vertical list */
  .wd-sol-stk-track { height: auto !important; }
  .wd-sol-stk-stage {
    position: static;
    height: auto;
    overflow: visible;
    display: block;
  }
  .wd-sol-stk-nav { display: none; } /* hide bookmarks on mobile */
  .wd-sol-stk-deck {
    position: static;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
  }
  .wd-sol-stk-card {
    position: static;
    grid-template-columns: 1fr;
    height: auto;
    opacity: 1 !important;
    transform: none !important;
  }
  .wd-sol-stk-media { height: 220px; }
  .wd-sol-stk-body { padding: 1.75rem; }

  /* Parallax rows (legacy selectors, now unused) */
  .wd-sol-eco-feat { grid-template-columns: 1fr; gap: 1.75rem; }
  .wd-sol-eco-feat.is-rev [data-eco-img],
  .wd-sol-eco-feat.is-rev [data-eco-body] { order: unset; }
  [data-eco-img] img { height: 240px; }
  [data-eco-img] { clip-path: none !important; opacity: 1 !important; }
  [data-eco-body] { transform: none !important; opacity: 1 !important; }
  .wd-sol-eco-also { flex-direction: column; align-items: flex-start; }
}


/* ============================================================
   AGENTFORCE PAGE
   ============================================================ */

/* ── Agentforce page badge ── */
.wd-af-page-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 1.25rem;
  margin-inline: auto;
  padding: 0.4rem 1.1rem 0.4rem 0.65rem;
  border: 1px solid rgba(109,40,217,0.25);
  border-radius: 999px;
  background: rgba(109,40,217,0.06);
  backdrop-filter: blur(4px);
}

.wd-af-page-badge-icon {
  display: block;
  flex-shrink: 0;
}

.wd-af-page-badge-divider {
  display: block;
  width: 1px;
  height: 16px;
  background: rgba(109,40,217,0.30);
  flex-shrink: 0;
}

.wd-af-page-badge-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: rgba(167,139,250,0.95);
}

/* ── Agentforce visual showcase ── */
.wd-af-page-visual {
  background: #fff;
  padding-block: clamp(3rem,6vw,5rem);
  border-top: 1px solid var(--wd-border);
}

.wd-af-page-img-wrap {
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  background: #F8F4FF;
  box-shadow: 0 8px 40px rgba(14,17,23,0.10);
}

.wd-af-page-img-wrap img {
  width: 100%;
  max-height: 460px;
  object-fit: contain;
  object-position: center;
  display: block;
  padding: 2.5rem;
}

/* ── Agent cards ── */
.wd-af-agents {
  background: var(--wd-off-white);
  border-top: 1px solid var(--wd-border);
  padding-block: clamp(4rem,8vw,7rem);
}

.wd-af-agents-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.wd-af-card {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: var(--wd-radius-lg);
  padding: clamp(1.5rem,2.5vw,2rem);
  box-shadow: var(--wd-shadow-card);
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), box-shadow 0.3s;
}

.wd-af-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--wd-shadow);
}

.wd-af-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--wd-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0,176,80,0.25);
}

.wd-af-card h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin: 0;
  line-height: 1.35;
}

.wd-af-card p {
  font-size: 0.875rem;
  color: var(--wd-mid);
  line-height: 1.72;
  margin: 0;
}

/* ── Process / Accelerator section ── */
.wd-af-process {
  background: linear-gradient(160deg,#06020F 0%,#12063A 40%,#0D0A2E 100%);
  padding-block: clamp(4rem,8vw,7rem);
  position: relative;
  overflow: hidden;
}

.wd-af-process .wd-section-header {
  text-align: center;
  margin-bottom: 0;
}

.wd-af-process .wd-section-header h2 {
  color: #fff;
}

.wd-af-process .wd-section-header p {
  color: rgba(255,255,255,0.65);
  max-width: 560px;
  margin-inline: auto;
}

.wd-af-phases-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin-top: 3rem;
}

.wd-af-phase-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--wd-radius-lg);
  padding: 1.75rem;
  position: relative;
  overflow: hidden;
  transition: background 0.3s, border-color 0.3s;
}

.wd-af-phase-card:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.18);
}

.wd-af-phase-num {
  font-size: 3.5rem;
  font-weight: 800;
  line-height: 1;
  background: var(--wd-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.wd-af-phase-week {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(167,139,250,0.9);
  background: rgba(109,40,217,0.2);
  border: 1px solid rgba(109,40,217,0.3);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
}

.wd-af-phase-card h4 {
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  margin: 0.75rem 0 0;
  line-height: 1.4;
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .wd-af-agents-grid { grid-template-columns: 1fr; }
  .wd-af-phases-grid { grid-template-columns: 1fr; }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .wd-af-agents-grid { grid-template-columns: repeat(2, 1fr); }
  .wd-af-phases-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Agentforce page: 6-phase howwe variant ── */
.wd-howwe-6 .wd-howwe-scroller {
  min-height: 540vh;
}
.wd-howwe-6 .wd-hi-card[data-hi-idx="4"] { z-index: 5; }
.wd-howwe-6 .wd-hi-card[data-hi-idx="5"] { z-index: 6; }

/* ── Image-first card: 75% photo / 25% text ── */
.wd-hi-card--img-first {
  overflow: hidden;
  padding: 0.875rem;
  padding-top: 0;
  gap: 0.5rem;
}

/* Image: 65% of card height — leaves 35% for readable text */
.wd-hi-card--img-first .wd-hi-img-wrap {
  order: -1;
  margin-top: 0;
  margin-left: -0.875rem;
  margin-right: -0.875rem;
  margin-bottom: 0.5rem;
  padding-top: 0;
  border-top: none;
}
.wd-hi-card--img-first .wd-hi-img-wrap img {
  height: clamp(220px, 34vh, 310px);
  border-radius: 0;
}
.wd-hi-card--img-first .wd-hi-img-wrap--badges {
  border-radius: 0;
  min-height: clamp(220px, 34vh, 310px);
}
/* Badge images in img-first cards */
.wd-hi-card--img-first .wd-hi-img-wrap--badges img {
  flex: unset;
  max-width: 42%;
  height: clamp(110px, 17vh, 160px);
}
.wd-hi-card--img-first .wd-hi-img-wrap--badges img:only-child {
  max-width: 70%;
  height: clamp(150px, 24vh, 220px);
}

/* Smaller number circle in compact context */
.wd-hi-card--img-first .wd-hi-num {
  width: 24px;
  height: 24px;
  font-size: 0.6rem;
}

/* Title: compact but legible */
.wd-hi-card--img-first .wd-hi-title {
  font-size: clamp(0.88rem, 1.3vw, 1.05rem);
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}

/* Description: 1 line visible */
.wd-hi-card--img-first .wd-hi-body {
  font-size: 0.75rem;
  color: var(--wd-muted);
  line-height: 1.5;
  -webkit-line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}

/* 7-card history variant */
.wd-howwe-7 .wd-howwe-scroller  { min-height: 630vh; }
.wd-howwe-7 .wd-hi-card[data-hi-idx="4"] { z-index: 5; }
.wd-howwe-7 .wd-hi-card[data-hi-idx="5"] { z-index: 6; }
.wd-howwe-7 .wd-hi-card[data-hi-idx="6"] { z-index: 7; }

/* History card — image strip at bottom */
.wd-hi-img-wrap {
  margin-top: auto;
  padding-top: 0.85rem;
  border-top: 1px solid var(--wd-border);
}
.wd-hi-img-wrap img {
  display: block;
  width: 100%;
  height: 130px;
  object-fit: cover;
  border-radius: 8px;
}
/* Badge variant — centred on light bg, fills the area */
.wd-hi-img-wrap--badges {
  margin-top: auto;
  border-top: none;
  background: #f5f8f4;
  border-radius: 10px;
  min-height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  padding: 1rem;
}
/* Multiple badges side by side */
.wd-hi-img-wrap--badges img {
  flex: 1;
  min-width: 0;
  max-width: 48%;
  height: 90px;
  object-fit: contain;
  border-radius: 0;
}
/* Single badge — fill the space */
.wd-hi-img-wrap--badges img:only-child {
  max-width: 65%;
  height: 120px;
}




/* ════════════════════════════════════════════════════════════
   INSIGHTS PAGE — Blog Listing
   ════════════════════════════════════════════════════════════ */

/* ── Filter bar ── */
.wd-ins-filter-bar {
  background: #fff;
  border-bottom: 1px solid rgba(14,17,23,0.08);
  position: sticky;
  top: 72px;
  z-index: 200;
}
.wd-ins-filter-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding: 0.85rem clamp(1.25rem,5vw,2.5rem);
}
.wd-ins-filter-tabs {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  align-items: center;
}
.wd-blog-filter-tab {
  padding: 0.38rem 1.05rem;
  border-radius: 100px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-mid);
  background: transparent;
  border: 1px solid rgba(14,17,23,0.12);
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: inherit;
  line-height: 1;
}
.wd-blog-filter-tab:hover {
  color: var(--wd-dark);
  border-color: var(--wd-green);
  background: var(--wd-green-tint);
}
.wd-blog-filter-tab.active {
  background: var(--wd-green);
  color: #fff;
  border-color: var(--wd-green);
}

/* ── Section wrapper ── */
.wd-ins-section {
  padding: 3rem 0 6rem;
  background-color: #F7F8FC;
  background-image:
    linear-gradient(to right,  rgba(71,85,105,0.09) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(71,85,105,0.09) 1px, transparent 1px);
  background-size: 32px 32px;
}
.wd-ins-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.25rem,5vw,2.5rem);
}

/* ── Category badge ── */
.wd-ins-badge {
  display: inline-block;
  background: rgba(0,176,80,0.12);
  color: #059669;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  padding: 0.28rem 0.7rem;
  border-radius: 100px;
}
.wd-ins-badge--overlay {
  position: absolute;
  top: 0.9rem;
  left: 0.9rem;
  background: rgba(10,10,20,0.72);
  color: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.wd-ins-dot { opacity: 0.35; margin: 0 0.1rem; }

/* ── Featured post ── */
.wd-ins-featured {
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08), 0 8px 32px rgba(0,0,0,0.07);
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s;
  background: #fff;
  border: 1px solid rgba(14,17,23,0.08);
}
.wd-ins-featured:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0,0,0,0.10), 0 24px 56px rgba(0,0,0,0.08);
}
.wd-ins-featured-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  text-decoration: none;
  color: inherit;
}
.wd-ins-featured-inner > p { display: none; } /* hide stray wpautop <p> tags */
.wd-ins-featured-body {
  display: flex !important;
  grid-column: 1;
  grid-row: 1;
  padding: 3rem 3rem 3rem 3.5rem;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  background: #ffffff;
  position: relative;
  z-index: 1;
}
.wd-ins-featured-body .wd-ins-badge {
  background: rgba(0,176,80,0.1);
  color: #059669;
  width: fit-content;
}
.wd-ins-featured-title {
  font-size: clamp(1.35rem, 2.5vw, 1.85rem);
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
  letter-spacing: -0.025em;
  margin: 0;
}
.wd-ins-featured-excerpt {
  font-size: 0.95rem;
  color: #64748b;
  line-height: 1.65;
  margin: 0;
}
.wd-ins-featured-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.82rem;
  color: #94a3b8;
  margin-top: 0.25rem;
  flex-wrap: wrap;
}
.wd-ins-featured-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: #059669;
  font-weight: 700;
  margin-left: auto;
  transition: gap 0.2s;
}
.wd-ins-featured:hover .wd-ins-featured-cta { gap: 0.5rem; }
.wd-ins-featured-img {
  display: block !important;
  grid-column: 2;
  grid-row: 1;
  position: relative;
  overflow: hidden;
  min-height: 280px;
  background: #f1f5f9;
  align-self: stretch;
}
.wd-ins-featured-img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform 0.6s ease;
  display: block;
}
.wd-ins-featured:hover .wd-ins-featured-img img { transform: scale(1.04); }

@media (max-width: 768px) {
  .wd-ins-featured-inner { grid-template-columns: 1fr; grid-template-rows: auto; }
  .wd-ins-featured-body { grid-column: 1; grid-row: 1; padding: 2rem; }
  .wd-ins-featured-img { grid-column: 1; grid-row: 2; height: 240px; min-height: unset; }
  .wd-ins-featured-cta { display: none; }
}

/* ── Cards grid ── */
.wd-ins-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.wd-ins-grid--no-featured { margin-top: 0; }

@media (max-width: 1024px) { .wd-ins-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px)  { .wd-ins-grid { grid-template-columns: 1fr; } }

/* ── Individual card ── */
.wd-ins-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(14,17,23,0.07);
  box-shadow: 0 1px 4px rgba(0,0,0,0.05), 0 4px 16px rgba(0,0,0,0.04);
  transition: transform 0.32s cubic-bezier(0.22,1,0.36,1), box-shadow 0.32s;
  display: flex;
  flex-direction: column;
}
.wd-ins-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 6px 24px rgba(0,0,0,0.09), 0 24px 48px rgba(0,0,0,0.08);
}
.wd-ins-card-inner {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.wd-ins-card-thumb {
  height: 210px;
  position: relative;
  overflow: hidden;
  background: var(--wd-gradient-dark);
  flex-shrink: 0;
}
.wd-ins-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}
.wd-ins-card:hover .wd-ins-card-thumb img { transform: scale(1.07); }
.wd-ins-card-thumb-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
}
.wd-ins-card-body {
  padding: 1.4rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.wd-ins-card-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.4;
  margin: 0 0 0.6rem;
  letter-spacing: -0.01em;
  transition: color 0.2s;
}
.wd-ins-card:hover .wd-ins-card-title { color: #00913a; }
.wd-ins-card-excerpt {
  font-size: 0.855rem;
  color: var(--wd-mid);
  line-height: 1.65;
  margin: 0 0 1rem;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wd-ins-card-meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  color: rgba(14,17,23,0.4);
  padding-top: 0.85rem;
  border-top: 1px solid rgba(14,17,23,0.06);
  margin-top: auto;
}
.wd-ins-card-cta {
  margin-left: auto;
  font-weight: 700;
  color: #059669;
  font-size: 0.78rem;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.2s, transform 0.2s;
}
.wd-ins-card:hover .wd-ins-card-cta { opacity: 1; transform: none; }




/* ════════════════════════════════════════════════════════════
   SINGULAR — Blog Post Detail  (Opkey-style layout)
   ════════════════════════════════════════════════════════════ */

.wd-post-wrap { display: block; }

/* ── Dark banner with title ── */
.wd-post-banner {
  position: relative;
  background: var(--wd-gradient-dark);
  overflow: hidden;
  padding: 4rem 0 3.5rem;
  min-height: 240px;
  display: flex;
  align-items: center;
}
.wd-post-banner .wd-aurora-bg { opacity: 0.6; }
.wd-post-banner-inner {
  position: relative;
  z-index: 2;
  max-width: 960px;
  margin-inline: auto;
  padding-inline: clamp(1.5rem,5vw,3rem);
  width: 100%;
}
.wd-post-banner-inner .wp-block-post-title {
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  margin: 0;
  max-width: 780px;
}

/* ── Main content page ── */
.wd-post-page {
  background: #fff;
  padding-bottom: 0;
}
.wd-post-container {
  max-width: 920px;
  margin-inline: auto;
  padding: 0 clamp(1.5rem,5vw,3rem);
}

/* ── Breadcrumb ── */
.wd-post-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
  padding: 1.4rem 0 0;
  font-size: 0.82rem;
  color: #94a3b8;
  border-bottom: 1px solid rgba(14,17,23,0.07);
  padding-bottom: 1.4rem;
  margin-bottom: 0;
}
.wd-post-breadcrumb a {
  color: #059669;
  text-decoration: none;
  font-weight: 500;
  transition: opacity 0.2s;
}
.wd-post-breadcrumb a:hover { opacity: 0.7; }
.wd-bc-sep { color: #cbd5e1; font-size: 0.9rem; }
.wd-bc-current { color: #64748b; }

/* ── Intro block: large title + meta ── */
.wd-post-intro {
  padding: 2.5rem 0 2rem;
  border-bottom: 1px solid rgba(14,17,23,0.07);
  margin-bottom: 2.5rem;
}
.wd-post-intro .wd-post-main-title,
.wd-post-intro .wp-block-post-title {
  font-size: clamp(2rem, 5vw, 3.2rem) !important;
  font-weight: 800 !important;
  color: #0f172a;
  line-height: 1.1 !important;
  letter-spacing: -0.035em;
  margin: 0 0 1.25rem !important;
}

/* Meta row */
.wd-post-meta-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}
.wd-post-meta-row .wp-block-post-date,
.wd-post-meta-row .wp-block-post-date time {
  font-size: 0.88rem;
  color: #64748b;
  font-weight: 500;
}
.wd-post-meta-row .wp-block-post-terms {
  display: flex !important;
  gap: 0.35rem;
  align-items: center;
}
.wd-post-meta-row .wp-block-post-terms::before {
  content: '/';
  color: #cbd5e1;
  font-size: 0.9rem;
}
.wd-post-meta-row .wp-block-post-terms a {
  font-size: 0.83rem;
  font-weight: 600;
  color: #059669;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.wd-post-meta-row .wp-block-post-terms__separator { display: none; }

/* ── Featured image ── */
.wd-post-thumb-block {
  margin-bottom: 2.5rem;
}
.wd-post-thumb-block .wp-block-post-featured-image {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.10);
}
.wd-post-thumb-block .wp-block-post-featured-image img {
  width: 100%;
  height: auto;
  max-height: 480px;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* ── Article body ── */
.wd-post-article {
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(14,17,23,0.07);
  margin-bottom: 2rem;
}

/* H2 */
.wd-post-article .wp-block-post-content h2 {
  font-size: clamp(1.35rem, 3vw, 1.75rem);
  font-weight: 800;
  color: #0f172a;
  margin: 2.8rem 0 0.85rem;
  letter-spacing: -0.022em;
  line-height: 1.2;
  padding-left: 1rem;
  border-left: 3px solid #00B050;
}
.wd-post-article .wp-block-post-content h2:first-child { margin-top: 0; }

/* H3 */
.wd-post-article .wp-block-post-content h3 {
  font-size: clamp(1.05rem, 2.5vw, 1.25rem);
  font-weight: 700;
  color: #1e293b;
  margin: 2rem 0 0.6rem;
  letter-spacing: -0.01em;
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}
.wd-post-article .wp-block-post-content h3::before {
  content: '';
  display: inline-block;
  width: 7px;
  height: 7px;
  min-width: 7px;
  background: #00B050;
  border-radius: 50%;
  position: relative;
  top: -1px;
}

/* Body text */
.wd-post-article .wp-block-post-content p {
  font-size: 1.05rem;
  line-height: 1.82;
  color: #374151;
  margin-bottom: 1.4rem;
}
.wd-post-article .wp-block-post-content > p:first-of-type {
  font-size: 1.1rem;
  color: #1e293b;
  line-height: 1.78;
}

/* Lists */
.wd-post-article .wp-block-post-content ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 1.5rem;
}
.wd-post-article .wp-block-post-content ul li {
  position: relative;
  padding-left: 1.4rem;
  font-size: 1.03rem;
  line-height: 1.78;
  color: #374151;
  margin-bottom: 0.6rem;
}
.wd-post-article .wp-block-post-content ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 6px;
  height: 6px;
  background: #00B050;
  border-radius: 50%;
}
.wd-post-article .wp-block-post-content ol {
  padding-left: 1.5rem;
  margin-bottom: 1.5rem;
}
.wd-post-article .wp-block-post-content ol li {
  font-size: 1.03rem;
  line-height: 1.78;
  color: #374151;
  margin-bottom: 0.6rem;
}
.wd-post-article .wp-block-post-content strong { color: #0f172a; font-weight: 700; }
.wd-post-article .wp-block-post-content a {
  color: #059669;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.wd-post-article .wp-block-post-content a:hover { opacity: 0.8; }
.wd-post-article .wp-block-post-content blockquote {
  margin: 2.5rem 0;
  padding: 1.5rem 2rem;
  background: #f0fdf4;
  border-left: 4px solid #00B050;
  border-radius: 0 12px 12px 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: #1e293b;
  font-style: normal;
  box-shadow: 0 2px 12px rgba(0,176,80,0.08);
}

/* ── Back link ── */
.wd-post-back-row {
  padding: 1.5rem 0 3rem;
}
.wd-post-back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #64748b;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 600;
  transition: color 0.2s, gap 0.2s;
}
.wd-post-back-link:hover { color: #059669; gap: 0.65rem; }

/* ── Bottom CTA ── */
/* ── Related posts — "Keep Reading" ── */
.wd-related-section {
  background: #F7F8FC;
  padding: 5rem 0 6rem;
  border-top: 1px solid rgba(14,17,23,0.07);
}
.wd-related-inner {
  max-width: var(--wd-container);
  margin-inline: auto;
  padding-inline: clamp(1.5rem,5vw,2.5rem);
}
.wd-related-header {
  margin-bottom: 2.5rem;
}
.wd-related-title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.025em;
  margin: 0.4rem 0 0;
}
.wd-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}
@media (max-width: 1024px) { .wd-related-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px)  { .wd-related-grid { grid-template-columns: 1fr; } }

.wd-rel-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(14,17,23,0.07);
  box-shadow: 0 1px 4px rgba(0,0,0,0.05), 0 4px 16px rgba(0,0,0,0.04);
  transition: transform 0.32s cubic-bezier(0.22,1,0.36,1), box-shadow 0.32s;
  display: flex;
  flex-direction: column;
}
.wd-rel-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 24px rgba(0,0,0,0.09), 0 20px 48px rgba(0,0,0,0.07);
}
.wd-rel-card-inner {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.wd-rel-card-thumb {
  height: 200px;
  position: relative;
  overflow: hidden;
  background: var(--wd-gradient-dark);
  flex-shrink: 0;
}
.wd-rel-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}
.wd-rel-card:hover .wd-rel-card-thumb img { transform: scale(1.06); }
.wd-rel-card-thumb-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg,#1e293b 0%,#0f172a 100%);
}
.wd-rel-card-body {
  padding: 1.35rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.wd-rel-card-title {
  font-size: 0.975rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.4;
  margin: 0 0 0.55rem;
  letter-spacing: -0.01em;
  transition: color 0.2s;
}
.wd-rel-card:hover .wd-rel-card-title { color: #059669; }
.wd-rel-card-excerpt {
  font-size: 0.845rem;
  color: #64748b;
  line-height: 1.65;
  margin: 0 0 1rem;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wd-rel-card-meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  color: rgba(14,17,23,0.4);
  padding-top: 0.85rem;
  border-top: 1px solid rgba(14,17,23,0.06);
  margin-top: auto;
}
.wd-rel-card-cta {
  margin-left: auto;
  font-weight: 700;
  color: #059669;
  font-size: 0.78rem;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.2s, transform 0.2s;
}
.wd-rel-card:hover .wd-rel-card-cta { opacity: 1; transform: none; }

.wd-related-all { text-align: center; }

@media (max-width: 700px) {
  .wd-post-banner { padding: 3rem 0 2.5rem; min-height: 180px; }
  .wd-post-banner-inner .wp-block-post-title { font-size: clamp(1.5rem,6vw,2rem) !important; }
  .wd-post-intro .wp-block-post-title { font-size: clamp(1.75rem,6vw,2.2rem) !important; }
}




/* ════════════════════════════════════════════════════════════
   ABOUT US / CULTURE PAGE  — Premium redesign
   ════════════════════════════════════════════════════════════ */

/* ── Hero video ── */
.wd-about-hero {
  position: relative;
  height: 92vh;
  min-height: 580px;
  overflow: hidden;
  background: #000;
}
.wd-about-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  transform: scale(1.04);
}
.wd-about-hero-scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom, rgba(5,6,15,0.35) 0%, rgba(5,6,15,0.55) 55%, rgba(5,6,15,0.88) 100%);
  z-index: 1;
}

/* ── Hero text overlay ── */
.wd-about-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 0 clamp(1.5rem, 6vw, 5rem) clamp(3.5rem, 7vw, 5.5rem);
  text-align: center;
}
.wd-about-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1.1rem;
  border: 1px solid rgba(0,176,80,0.45);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--wd-green);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  background: rgba(0,176,80,0.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  margin-bottom: 1.4rem;
}
.wd-about-hero-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  background: var(--wd-green);
  border-radius: 50%;
  animation: wd-pulse-green 2s ease infinite;
}
.wd-about-hero-h1 {
  font-size: clamp(2rem, 4.5vw, 3.75rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.04em;
  line-height: 1.06;
  margin-bottom: 1.1rem;
  text-shadow: 0 4px 32px rgba(0,0,0,0.45);
}
.wd-about-hero-h1 em {
  font-style: normal;
  background: linear-gradient(90deg, #00B050 0%, #5CDBA0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.wd-about-hero-sub {
  font-size: clamp(0.9rem, 1.4vw, 1.05rem);
  color: rgba(255,255,255,0.65);
  max-width: 540px;
  line-height: 1.72;
  margin-bottom: 2rem;
}
.wd-about-hero-metrics {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 2rem);
  flex-wrap: wrap;
  justify-content: center;
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--wd-radius-lg);
  padding: 1rem clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: 2.5rem;
}
.wd-about-hm {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
}
.wd-about-hm strong {
  font-size: clamp(1.4rem, 2.5vw, 1.9rem);
  font-weight: 900;
  color: var(--wd-green);
  line-height: 1;
}
.wd-about-hm span {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.wd-about-hm-sep {
  width: 1px;
  height: 36px;
  background: rgba(255,255,255,0.12);
  flex-shrink: 0;
}
.wd-about-hero-scroll {
  color: rgba(255,255,255,0.35);
  animation: wd-bounce-down 2.4s ease infinite;
  line-height: 0;
}
@keyframes wd-bounce-down {
  0%, 100% { transform: translateY(0); opacity: 0.35; }
  50% { transform: translateY(7px); opacity: 0.6; }
}
@media (max-width: 600px) {
  .wd-about-hero-metrics { gap: 0.8rem; padding: 0.8rem 1.2rem; }
  .wd-about-hm-sep { display: none; }
}

/* ── Mission ── */
.wd-ac-mission {
  position: relative;
  background: var(--wd-gradient-dark);
  padding: 8rem 0;
  text-align: center;
  overflow: hidden;
}
.wd-ac-mission .wd-aurora-bg { opacity: 0.4; }
.wd-ac-mission-inner {
  position: relative;
  z-index: 2;
  max-width: 800px;
  margin-inline: auto;
  padding-inline: clamp(1.5rem,5vw,3rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}
.wd-ac-mission-qmark {
  width: 60px;
  height: 45px;
  opacity: 0.6;
}
.wd-ac-mission-quote {
  font-size: clamp(1.6rem, 3.5vw, 2.6rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  letter-spacing: -0.025em;
  font-style: italic;
  border: none;
  padding: 0;
  margin: 0;
}
.wd-ac-mission-sub {
  font-size: 1rem;
  color: rgba(255,255,255,0.6);
  line-height: 1.75;
  max-width: 580px;
  margin: 0;
}

/* ── Values — alternating rows ── */
.wd-ac-values-section { background: #fff; }
.wd-ac-vs-header {
  padding: 5rem clamp(1.5rem,5vw,4rem) 3.5rem;
  max-width: 1200px;
  margin-inline: auto;
}
.wd-ac-vs-header .eyebrow { margin-bottom: 0.5rem; }
.wd-ac-vs-header h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.03em;
  margin: 0;
}

.wd-ac-vrow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 420px;
  overflow: hidden;
}
.wd-ac-vrow--flip .wd-ac-vrow-img { order: -1; }

.wd-ac-vrow-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem,5vw,5rem) clamp(2rem,5vw,5rem);
  position: relative;
}
.wd-ac-vrow-text--light { background: #fff; }
.wd-ac-vrow-text--dark  { background: #F7F8FC; }

.wd-ac-vrow-num {
  font-size: 0.72rem;
  font-weight: 800;
  color: #00B050;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}
.wd-ac-vrow-name {
  font-size: clamp(3rem, 6vw, 5.5rem);
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.04em;
  line-height: 0.9;
  margin-bottom: 1.5rem;
  position: relative;
}
.wd-ac-vrow-name::after {
  content: '';
  display: block;
  width: 40px;
  height: 4px;
  background: #00B050;
  border-radius: 2px;
  margin-top: 1.25rem;
}
.wd-ac-vrow-desc {
  font-size: 1rem;
  color: #64748b;
  line-height: 1.75;
  max-width: 400px;
  margin: 0;
}

.wd-ac-vrow-img {
  overflow: hidden;
  background: #1e293b;
  position: relative;
}
.wd-ac-vrow-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.7s ease;
}
.wd-ac-vrow:hover .wd-ac-vrow-img img { transform: scale(1.04); }

@media (max-width: 768px) {
  .wd-ac-vrow { grid-template-columns: 1fr; }
  .wd-ac-vrow--flip .wd-ac-vrow-img { order: 0; }
  .wd-ac-vrow-img { height: 280px; }
  .wd-ac-vrow-name { font-size: clamp(2.5rem,10vw,3.5rem); }
}

/* ── Diversity — full-bleed cinematic ── */
.wd-ac-diversity {
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center;
}
.wd-ac-diversity-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.wd-ac-diversity-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.wd-ac-diversity-overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 15, 30, 0.82);
  z-index: 1;
}
.wd-ac-diversity-content {
  position: relative;
  z-index: 2;
  padding: 5rem clamp(1.5rem,5vw,3rem);
  max-width: 740px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.wd-ac-diversity-heading {
  font-size: clamp(4rem, 12vw, 9rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.05em;
  line-height: 0.9;
  margin: 0.5rem 0 1.5rem;
  text-transform: uppercase;
}
.wd-ac-diversity-text {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.8;
  margin: 0;
}
.wd-ac-diversity-text strong { color: #fff; }

/* ── People ── */
.wd-ac-people {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  min-height: 560px;
  background: #fff;
}
@media (max-width: 900px) { .wd-ac-people { grid-template-columns: 1fr; } }

.wd-ac-people-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem,6vw,6rem) clamp(2rem,5vw,5rem);
  border-right: 1px solid rgba(14,17,23,0.08);
  background: #0f172a;
}
.wd-ac-people-label {
  font-size: clamp(3.5rem, 8vw, 6rem);
  font-weight: 900;
  color: rgba(255,255,255,0.08);
  letter-spacing: -0.04em;
  line-height: 1;
  display: block;
  margin-bottom: 1.5rem;
}
.wd-ac-people-quote {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  color: rgba(255,255,255,0.85);
  line-height: 1.55;
  font-style: italic;
  margin: 0;
}

.wd-ac-people-right {
  overflow: hidden;
  padding: 0;
}
.wd-ac-people-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  height: 100%;
  gap: 3px;
}
.wd-ac-pg-item {
  overflow: hidden;
  background: #1e293b;
}
.wd-ac-pg-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}
.wd-ac-pg-item:hover img { transform: scale(1.06); }
.wd-ac-pg-item--tall { grid-row: span 2; }

/* ── Moments ── */
.wd-ac-moments {
  background: #F7F8FC;
  overflow: hidden;
}
.wd-ac-moments-header {
  padding: 5rem 0 3rem;
}
.wd-ac-moments-title-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
  margin-bottom: 2rem;
}
@media (max-width: 900px) { .wd-ac-moments-title-row { grid-template-columns: 1fr; gap: 2rem; } }

.wd-ac-moments-title-row .eyebrow { margin-bottom: 0.5rem; }
.wd-ac-moments-h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0;
}
.wd-ac-moments-h2 em { color: #00B050; font-style: normal; }
.wd-ac-moments-callout {
  background: #fff;
  border: none;
  border-left: 4px solid #00B050;
  border-radius: 0 16px 16px 0;
  padding: 1.5rem 1.75rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: #1e293b;
  font-style: normal;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
  margin: 0;
  align-self: center;
}
.wd-ac-moments-body {
  font-size: 1rem;
  color: #64748b;
  line-height: 1.8;
  max-width: 760px;
  margin: 0;
}

/* Photo strip */
.wd-ac-strip {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1.5fr;
  height: 360px;
  gap: 4px;
}
@media (max-width: 768px) {
  .wd-ac-strip { grid-template-columns: 1fr 1fr 1fr; height: 240px; }
  .wd-ac-strip-item--lg { grid-column: span 1; }
  .wd-ac-strip-item:nth-child(4) { display: none; }
}
.wd-ac-strip-item { overflow: hidden; background: #1e293b; }
.wd-ac-strip-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.5s ease, filter 0.4s ease;
  filter: brightness(0.88);
}
.wd-ac-strip-item:hover img { transform: scale(1.07); filter: brightness(1); }

/* Video */
.wd-ac-video-wrap {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 48px rgba(0,0,0,0.14);
}
.wd-ac-video {
  width: 100%;
  height: auto;
  display: block;
  max-height: 580px;
  background: #0f172a;
}

/* ── Join Us ── */
.wd-ac-join {
  padding: 7rem 0;
  background: var(--wd-gradient-dark);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.wd-ac-join::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 700px 500px at 70% 40%, rgba(90,111,255,0.15) 0%, transparent 65%),
    radial-gradient(ellipse 500px 400px at 20% 80%, rgba(0,176,80,0.12) 0%, transparent 60%);
  pointer-events: none;
}
.wd-ac-join-inner {
  max-width: 560px;
  margin-inline: auto;
  padding-inline: clamp(1.5rem,5vw,3rem);
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}
.wd-ac-join-inner h2 {
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.04em;
  line-height: 1;
  margin: 0;
}
.wd-ac-join-inner p {
  color: rgba(255,255,255,0.6);
  font-size: 1rem;
  line-height: 1.65;
  margin: 0;
}

/* ============================================================
   ABOUT — HISTORY TIMELINE
   ============================================================ */
.wd-about-timeline {
  background: var(--wd-gradient-dark);
  padding: 6rem 0;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.wd-about-timeline::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 700px 500px at 85% 40%, rgba(0,176,80,0.06) 0%, transparent 65%),
    radial-gradient(ellipse 500px 400px at 15% 70%, rgba(0,161,224,0.04) 0%, transparent 60%);
  pointer-events: none;
}

.wd-about-tl {
  margin-top: 3rem;
  display: flex;
  flex-direction: column;
}

.wd-about-tl-item {
  display: grid;
  grid-template-columns: 90px 20px 1fr;
  gap: 0 1.75rem;
  padding-bottom: 2.75rem;
  position: relative;
}
.wd-about-tl-item:last-child { padding-bottom: 0; }

.wd-about-tl-date {
  text-align: right;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--wd-green);
  padding-top: 0.15rem;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

.wd-about-tl-line {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.wd-about-tl-line::after {
  content: '';
  position: absolute;
  top: 16px;
  bottom: -2.75rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.06) 100%);
}
.wd-about-tl-item:last-child .wd-about-tl-line::after { display: none; }

.wd-about-tl-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  border: 2px solid rgba(255,255,255,0.3);
  flex-shrink: 0;
  margin-top: 0.15rem;
  position: relative;
  z-index: 1;
  transition: background 0.3s, border-color 0.3s;
}
.wd-about-tl-item:hover .wd-about-tl-dot {
  background: var(--wd-green);
  border-color: var(--wd-green);
  box-shadow: 0 0 0 4px rgba(0,176,80,0.2);
}
.wd-about-tl-dot--active {
  background: var(--wd-green) !important;
  border-color: var(--wd-green) !important;
  box-shadow: 0 0 0 3px rgba(0,176,80,0.25), 0 0 0 7px rgba(0,176,80,0.1);
  animation: wd-tl-pulse 2.5s ease infinite;
}
@keyframes wd-tl-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(0,176,80,0.25), 0 0 0 7px rgba(0,176,80,0.1); }
  50% { box-shadow: 0 0 0 4px rgba(0,176,80,0.4), 0 0 0 10px rgba(0,176,80,0.15); }
}

.wd-about-tl-content {
  padding-top: 0;
  padding-right: 1rem;
}
.wd-about-tl-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.35rem;
  line-height: 1.35;
}
.wd-about-tl-desc {
  font-size: 0.84rem;
  color: rgba(255,255,255,0.5);
  line-height: 1.65;
}

@media (max-width: 600px) {
  .wd-about-tl-item { grid-template-columns: 70px 16px 1fr; gap: 0 1.25rem; }
}

/* ============================================================
   ABOUT — LEADERSHIP (in page-about template)
   ============================================================ */
.wd-about-team {
  padding: 6rem 0;
  background: var(--wd-off-white);
}
.wd-about-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 440px));
  gap: 1.5rem;
  justify-content: center;
  margin-top: 3rem;
}
@media (max-width: 900px) { .wd-about-team-grid { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; } }

.wd-about-leader {
  background: #fff;
  border: 1px solid rgba(14,17,23,0.07);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s, border-color 0.3s;
  box-shadow: var(--wd-shadow-card);
  display: flex;
  flex-direction: column;
}
.wd-about-leader:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 32px rgba(0,0,0,0.09), 0 32px 72px rgba(0,0,0,0.1);
  border-color: rgba(0,176,80,0.2);
}
.wd-about-leader-header {
  height: 6px;
  background: var(--wd-gradient);
}
.wd-about-leader-body {
  padding: 1.75rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.wd-about-leader-avatar {
  width: 52px;
  height: 52px;
  background: linear-gradient(135deg, var(--wd-gradient-dark));
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.4rem;
  border: 2px solid var(--wd-border);
  margin-bottom: 1.1rem;
}
.wd-about-leader-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  margin-bottom: 0.2rem;
  line-height: 1.2;
}
.wd-about-leader-title {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-green);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.85rem;
}
.wd-about-leader-bio {
  font-size: 0.86rem;
  color: var(--wd-mid);
  line-height: 1.7;
  flex: 1;
  margin-bottom: 1.1rem;
}
.wd-about-leader-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-sky);
  letter-spacing: 0.03em;
  transition: color 0.2s, gap 0.2s;
  align-self: flex-start;
}
.wd-about-leader-link:hover {
  color: var(--wd-green);
  gap: 0.6rem;
}

/* ── Refined mission ── */
.wd-ac-mission-quote {
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.35;
  letter-spacing: -0.02em;
  font-style: italic;
  border: none;
  padding: 0;
  margin: 0;
}
.wd-ac-mission::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(200px, 40vw);
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(0,176,80,0.4), transparent);
}

/* ── Values row refined ── */
.wd-ac-vrow-desc {
  font-size: 1rem;
  color: #475569;
  line-height: 1.8;
  max-width: 400px;
  margin: 0;
}
.wd-ac-vrow-text--light .wd-ac-vrow-desc { color: #475569; }
.wd-ac-vrow-text--dark  .wd-ac-vrow-desc { color: #475569; }

/* ============================================================
   ABOUT PAGE — REDESIGN v3
   New: Manifesto · Stats Strip · Cinematic Values
   ============================================================ */

/* ── Manifesto (replaces plain mission) ── */
.wd-about-manifesto {
  position: relative;
  background: var(--wd-dark);
  padding: 7rem 0;
  overflow: hidden;
}
.wd-about-manifesto::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 700px 500px at 12% 65%, rgba(0,176,80,0.08) 0%, transparent 60%),
    radial-gradient(ellipse 600px 500px at 88% 25%, rgba(0,161,224,0.05) 0%, transparent 60%);
  pointer-events: none;
}
.wd-about-manifesto-inner {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 6vw, 6rem);
  align-items: center;
}
@media (max-width: 768px) {
  .wd-about-manifesto-inner { grid-template-columns: 1fr; gap: 2.5rem; }
}

.wd-about-mf-year {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 1.75rem;
}
.wd-about-mf-year::before {
  content: '';
  width: 28px;
  height: 1px;
  background: var(--wd-green);
  flex-shrink: 0;
}
.wd-about-mf-quote {
  font-size: clamp(1.35rem, 2.4vw, 1.95rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.45;
  letter-spacing: -0.02em;
  font-style: italic;
  border: none;
  padding: 0 0 0 1.5rem;
  margin: 0;
  border-left: 3px solid var(--wd-green);
}

.wd-about-mf-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1.75rem;
}
.wd-about-mf-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.85rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.11);
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.wd-about-mf-desc {
  font-size: 1rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.8;
  margin-bottom: 0.75rem;
}
.wd-about-mf-desc--muted { color: rgba(255,255,255,0.35); font-size: 0.93rem; }
.wd-about-mf-sep {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin: 1.25rem 0;
}

/* ── Stats strip ── */
.wd-about-stats {
  background: #fff;
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
}
.wd-about-stats-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 3vw, 2rem);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 860px) { .wd-about-stats-inner { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px)  { .wd-about-stats-inner { grid-template-columns: repeat(2, 1fr); } }

.wd-about-stat {
  padding: 3rem 1rem;
  text-align: center;
  position: relative;
  transition: background 0.25s;
}
.wd-about-stat:hover { background: var(--wd-off-white); }
.wd-about-stat + .wd-about-stat::before {
  content: '';
  position: absolute;
  left: 0;
  top: 22%;
  height: 56%;
  width: 1px;
  background: var(--wd-border);
}
.wd-about-stat-num {
  font-size: clamp(2rem, 3.2vw, 3rem);
  font-weight: 900;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.wd-about-stat-num em {
  font-style: normal;
  color: var(--wd-green);
}
.wd-about-stat-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--wd-muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

/* ── Values — cinematic editorial blocks ── */
.wd-about-values { background: #fff; }

.wd-about-vals-header {
  max-width: 1100px;
  margin: 0 auto;
  padding: 5.5rem clamp(1.5rem, 5vw, 4rem) 3rem;
}
.wd-about-vals-header .eyebrow { margin-bottom: 0.5rem; }
.wd-about-vals-header h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  margin: 0;
}

.wd-about-val-block {
  position: relative;
  height: clamp(320px, 48vh, 520px);
  overflow: hidden;
}
.wd-about-val-bg {
  position: absolute;
  inset: 0;
}
.wd-about-val-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.wd-about-val-block:hover .wd-about-val-bg img { transform: scale(1.05); }

.wd-about-val-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    108deg,
    rgba(5,6,15,0.92) 0%,
    rgba(5,6,15,0.68) 42%,
    rgba(5,6,15,0.28) 100%
  );
  z-index: 1;
  transition: opacity 0.5s;
}

.wd-about-val-content {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  padding: clamp(1.5rem, 3vw, 3.5rem) clamp(2rem, 6vw, 6rem);
  gap: clamp(1.5rem, 3.5vw, 3.5rem);
}
.wd-about-val-num {
  font-size: clamp(4.5rem, 9vw, 8rem);
  font-weight: 900;
  color: rgba(0,176,80,0.22);
  line-height: 1;
  letter-spacing: -0.05em;
  flex-shrink: 0;
  align-self: flex-end;
  transition: color 0.4s;
  user-select: none;
}
.wd-about-val-block:hover .wd-about-val-num { color: rgba(0,176,80,0.42); }

.wd-about-val-name {
  font-size: clamp(2.2rem, 4.5vw, 3.75rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.8rem;
}
.wd-about-val-desc {
  font-size: clamp(0.85rem, 1.1vw, 0.98rem);
  color: rgba(255,255,255,0.58);
  line-height: 1.78;
  max-width: 520px;
  transition: color 0.4s;
}
.wd-about-val-block:hover .wd-about-val-desc { color: rgba(255,255,255,0.78); }

/* green accent line on hover */
.wd-about-val-name::after {
  content: '';
  display: block;
  width: 0;
  height: 2px;
  background: var(--wd-green);
  margin-top: 0.6rem;
  transition: width 0.4s cubic-bezier(0.22,1,0.36,1);
}
.wd-about-val-block:hover .wd-about-val-name::after { width: 48px; }

@media (max-width: 600px) {
  .wd-about-val-block { height: 280px; }
  .wd-about-val-content { gap: 1rem; padding: 1.25rem 1.5rem; }
  .wd-about-val-scrim { background: rgba(5,6,15,0.86); }
}

/* ============================================================
   ABOUT PAGE — OPKEY-INSPIRED LAYOUT  (prefix: wd-about2-)
   ============================================================ */

/* ── Hero — dark navy, two-column ── */
.wd-about2-hero {
  background: linear-gradient(150deg, #05080F 0%, #0C1628 55%, #081220 100%);
  padding: 5.5rem 0 4.5rem;
  position: relative;
  overflow: hidden;
}
.wd-about2-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 900px 600px at -5% 55%, rgba(0,161,224,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 600px 500px at 105% 10%, rgba(0,176,80,0.05) 0%, transparent 55%);
  pointer-events: none;
}
.wd-about2-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
}
@media (max-width: 900px) {
  .wd-about2-hero-inner { grid-template-columns: 1fr; }
  .wd-about2-hero-right { order: -1; }
}
.wd-about2-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 1.4rem;
}
.wd-about2-hero-eyebrow::before {
  content: '';
  width: 22px;
  height: 1px;
  background: var(--wd-green);
  flex-shrink: 0;
}
.wd-about2-hero-h1 {
  font-size: clamp(2.8rem, 5.5vw, 4.5rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.045em;
  line-height: 1.04;
  margin-bottom: 1.25rem;
}
.wd-about2-hero-sub {
  font-size: clamp(0.95rem, 1.4vw, 1.05rem);
  color: rgba(255,255,255,0.55);
  line-height: 1.78;
  max-width: 460px;
  margin-bottom: 2.25rem;
}
.wd-about2-hero-ctas {
  display: flex;
  gap: 0.85rem;
  flex-wrap: wrap;
  align-items: center;
}
/* Right: floating card */
.wd-about2-hero-card {
  position: relative;
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  aspect-ratio: 4/3;
  border: 1px solid rgba(255,255,255,0.09);
  box-shadow: 0 32px 80px rgba(0,0,0,0.45);
}
.wd-about2-hero-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  filter: brightness(0.85) saturate(0.9);
}
.wd-about2-hero-card-footer {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(5,8,15,0.92) 0%, rgba(5,8,15,0.4) 100%);
  padding: 2.5rem 1.75rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.wd-about2-hcs {
  flex: 1;
  text-align: center;
}
.wd-about2-hcs strong {
  display: block;
  font-size: clamp(1.3rem, 2vw, 1.6rem);
  font-weight: 900;
  color: var(--wd-green);
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.2rem;
}
.wd-about2-hcs span {
  font-size: 0.62rem;
  font-weight: 600;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.11em;
}
.wd-about2-hcs-div {
  width: 1px;
  height: 30px;
  background: rgba(255,255,255,0.12);
  flex-shrink: 0;
}

/* ── Story section — white, two-column ── */
.wd-about2-story {
  background: #fff;
  padding: 6rem 0;
}
.wd-about2-story-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 6vw, 6rem);
  align-items: center;
}
@media (max-width: 860px) {
  .wd-about2-story-inner { grid-template-columns: 1fr; }
}
.wd-about2-story-label {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.wd-about2-story-label::before {
  content: ''; width: 20px; height: 1px; background: var(--wd-green);
}
.wd-about2-story-h2 {
  font-size: clamp(2rem, 3.8vw, 2.8rem);
  font-weight: 900;
  color: var(--wd-dark);
  letter-spacing: -0.035em;
  line-height: 1.14;
  margin-bottom: 0.6rem;
}
.wd-about2-story-lead {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--wd-dark);
  line-height: 1.55;
  margin-bottom: 1.25rem;
}
.wd-about2-story-body {
  font-size: 0.96rem;
  color: var(--wd-mid);
  line-height: 1.82;
  margin-bottom: 0.85rem;
}
.wd-about2-story-photo {
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  aspect-ratio: 4/3;
  box-shadow: var(--wd-shadow-xl);
}
.wd-about2-story-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  transition: transform 0.7s ease;
}
.wd-about2-story-photo:hover img { transform: scale(1.04); }

/* ── Partner ecosystem — off-white, two-column ── */
.wd-about2-ecosystem {
  background: var(--wd-off-white);
  padding: 5.5rem 0;
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
}
.wd-about2-ecosystem-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 6vw, 6rem);
  align-items: center;
}
@media (max-width: 860px) {
  .wd-about2-ecosystem-inner { grid-template-columns: 1fr; }
}
.wd-about2-eco-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
}
.wd-about2-eco-logo {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius);
  padding: 1.1rem 0.85rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--wd-mid);
  text-align: center;
  line-height: 1.25;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
  min-height: 72px;
}
.wd-about2-eco-logo:hover {
  border-color: rgba(0,176,80,0.28);
  box-shadow: 0 4px 18px rgba(0,176,80,0.08);
  transform: translateY(-2px);
}
.wd-about2-eco-logo-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.wd-about2-eco-label {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-sky);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.wd-about2-eco-label::before { content: ''; width: 20px; height: 1px; background: var(--wd-sky); }
.wd-about2-eco-h3 {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1.25;
  margin-bottom: 1.1rem;
}
.wd-about2-eco-body {
  font-size: 0.97rem;
  color: var(--wd-mid);
  line-height: 1.8;
  margin-bottom: 0.75rem;
}

/* ── Scale / Stats — white ── */
.wd-about2-scale {
  background: #fff;
  padding: 6rem 0;
}
.wd-about2-scale-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}
.wd-about2-scale-h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1.2;
  margin-bottom: 0.75rem;
  max-width: 620px;
}
.wd-about2-scale-sub {
  font-size: 1rem;
  color: var(--wd-mid);
  line-height: 1.78;
  max-width: 600px;
  margin-bottom: 3rem;
}
.wd-about2-stats-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius-lg);
  overflow: hidden;
}
@media (max-width: 860px) { .wd-about2-stats-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px)  { .wd-about2-stats-row { grid-template-columns: repeat(2, 1fr); } }
.wd-about2-sc {
  padding: 2.5rem 1.25rem;
  text-align: center;
  border-right: 1px solid var(--wd-border);
  transition: background 0.2s;
}
.wd-about2-sc:last-child { border-right: none; }
.wd-about2-sc:hover { background: var(--wd-off-white); }
.wd-about2-sc-num {
  font-size: clamp(1.9rem, 3.2vw, 2.9rem);
  font-weight: 900;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.45rem;
}
.wd-about2-sc-num em { font-style: normal; color: var(--wd-green); }
.wd-about2-sc-lbl {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--wd-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  line-height: 1.4;
}

/* ── Values — centered, clean cards ── */
.wd-about2-values {
  background: #fff;
  border-top: 1px solid var(--wd-border);
  padding: 6rem 0;
}
.wd-about2-values-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  text-align: center;
}
.wd-about2-values-intro {
  font-size: clamp(0.97rem, 1.6vw, 1.1rem);
  color: var(--wd-mid);
  max-width: 660px;
  margin: 0 auto 0.6rem;
  line-height: 1.78;
}
.wd-about2-values-h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  margin-bottom: 3.5rem;
}
.wd-about2-vals-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  text-align: left;
}
@media (max-width: 860px) { .wd-about2-vals-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .wd-about2-vals-grid { grid-template-columns: 1fr; } }
.wd-about2-val-card {
  background: var(--wd-off-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-radius-lg);
  padding: 2rem 1.75rem;
  transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
}
.wd-about2-val-card:hover {
  border-color: rgba(0,176,80,0.22);
  box-shadow: var(--wd-shadow);
  transform: translateY(-3px);
}
.wd-about2-val-card-num {
  font-size: 0.65rem;
  font-weight: 800;
  color: var(--wd-green);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 0.65rem;
}
.wd-about2-val-card-name {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.025em;
  margin-bottom: 0.6rem;
  line-height: 1.2;
}
.wd-about2-val-card-desc {
  font-size: 0.9rem;
  color: var(--wd-mid);
  line-height: 1.78;
}

/* ── Full-bleed culture photo ── */
.wd-about2-culture {
  position: relative;
  min-height: 55vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wd-about2-culture-bg {
  position: absolute; inset: 0;
}
.wd-about2-culture-bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
}
.wd-about2-culture-ov {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(5,8,15,0.50) 0%, rgba(5,8,15,0.82) 100%);
}
.wd-about2-culture-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
  padding: 5rem clamp(1.5rem, 5vw, 3rem);
  text-align: center;
}
.wd-about2-culture-quote {
  font-size: clamp(1.35rem, 2.8vw, 2.1rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.45;
  letter-spacing: -0.02em;
  font-style: italic;
  margin: 0;
}
.wd-about2-culture-quote em {
  font-style: normal;
  color: var(--wd-green);
}

/* ── Bold statement ("Build Boldly" equivalent) ── */
.wd-about2-bold {
  position: relative;
  min-height: 46vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.wd-about2-bold-bg {
  position: absolute; inset: 0;
}
.wd-about2-bold-bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
}
.wd-about2-bold-ov {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(11,61,145,0.88) 0%, rgba(5,8,15,0.78) 100%);
}
.wd-about2-bold-content {
  position: relative;
  z-index: 2;
  padding: 4.5rem clamp(1.5rem, 5vw, 4rem);
}
.wd-about2-bold-h2 {
  font-size: clamp(3rem, 7.5vw, 5.5rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.05em;
  line-height: 1;
  margin-bottom: 0.85rem;
}
.wd-about2-bold-sub {
  font-size: clamp(1rem, 1.8vw, 1.25rem);
  color: rgba(255,255,255,0.6);
  font-style: italic;
}

/* ============================================================
   ABOUT PAGE — LIGHT MODE (no dark backgrounds)
   ============================================================ */

/* ── Hero light ── */
.wd-about2-hero {
  background: linear-gradient(135deg, #EEF6FB 0%, #F2F8F4 100%);
}
.wd-about2-hero::before {
  background:
    radial-gradient(ellipse 900px 600px at -5% 55%, rgba(0,161,224,0.09) 0%, transparent 55%),
    radial-gradient(ellipse 600px 500px at 105% 10%, rgba(0,176,80,0.07) 0%, transparent 55%);
}
.wd-about2-hero-h1 { color: var(--wd-dark); }
.wd-about2-hero-sub { color: var(--wd-mid); }
.wd-about2-hero-card {
  border-color: var(--wd-border);
  box-shadow: 0 20px 60px rgba(0,0,0,0.12), 0 4px 16px rgba(0,0,0,0.06);
}
.wd-about2-hero-card img { filter: brightness(0.92) saturate(0.95); }
.wd-about2-hero-card-footer {
  background: linear-gradient(to top, rgba(255,255,255,0.97) 0%, rgba(255,255,255,0.6) 60%, transparent 100%);
}
.wd-about2-hcs strong { color: var(--wd-green); }
.wd-about2-hcs span   { color: var(--wd-muted); }
.wd-about2-hcs-div    { background: var(--wd-border); }

/* ── Culture quote — light split ── */
.wd-about2-cq {
  background: var(--wd-off-white);
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
  padding: 6rem 0;
}
.wd-about2-cq-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 6vw, 6rem);
  align-items: center;
}
@media (max-width: 860px) { .wd-about2-cq-inner { grid-template-columns: 1fr; } }
.wd-about2-cq-mark {
  font-size: 6rem;
  font-weight: 900;
  color: var(--wd-green);
  line-height: 0.6;
  margin-bottom: 1.25rem;
  display: block;
  opacity: 0.4;
}
.wd-about2-cq-text {
  font-size: clamp(1.25rem, 2.5vw, 1.8rem);
  font-weight: 700;
  color: var(--wd-dark);
  line-height: 1.45;
  letter-spacing: -0.02em;
  font-style: italic;
  margin: 0;
}
.wd-about2-cq-text em {
  font-style: normal;
  color: var(--wd-green);
}
.wd-about2-cq-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 0.75rem;
  height: 380px;
}
.wd-about2-cq-photo {
  border-radius: var(--wd-radius);
  overflow: hidden;
}
.wd-about2-cq-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}
.wd-about2-cq-photo:hover img { transform: scale(1.05); }
.wd-about2-cq-photo--tall { grid-row: span 2; }

/* ── Bold statement — light ── */
.wd-about2-statement {
  background: #fff;
  padding: 7rem 0;
  text-align: center;
  border-top: 1px solid var(--wd-border);
}
.wd-about2-statement-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}
.wd-about2-statement-label {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
  justify-content: center;
}
.wd-about2-statement-label::before,
.wd-about2-statement-label::after {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--wd-green);
}
.wd-about2-statement-h2 {
  font-size: clamp(3rem, 7.5vw, 5.5rem);
  font-weight: 900;
  color: var(--wd-dark);
  letter-spacing: -0.05em;
  line-height: 1.02;
  margin-bottom: 1rem;
}
.wd-about2-statement-sub {
  font-size: clamp(1rem, 1.8vw, 1.25rem);
  color: var(--wd-muted);
  font-style: italic;
}

/* ── Timeline — light ── */
.wd-about-timeline {
  background: var(--wd-off-white) !important;
}
.wd-about-timeline::before { display: none; }
.wd-about-timeline .wd-section-header .eyebrow { color: var(--wd-sky) !important; }
.wd-about-timeline h2 { color: var(--wd-dark) !important; }
.wd-about-tl-line::after {
  background: linear-gradient(to bottom, rgba(14,17,23,0.14) 0%, rgba(14,17,23,0.04) 100%) !important;
}
.wd-about-tl-dot {
  background: #fff !important;
  border: 2px solid rgba(14,17,23,0.18) !important;
  box-shadow: none !important;
}
.wd-about-tl-item:hover .wd-about-tl-dot {
  background: var(--wd-green) !important;
  border-color: var(--wd-green) !important;
}
.wd-about-tl-dot--active {
  background: var(--wd-green) !important;
  border-color: var(--wd-green) !important;
  box-shadow: 0 0 0 4px rgba(0,176,80,0.15) !important;
}
.wd-about-tl-date { color: var(--wd-green) !important; }
.wd-about-tl-title { color: var(--wd-dark) !important; }
.wd-about-tl-desc  { color: var(--wd-mid)  !important; }

/* ── Join Us — light ── */
.wd-ac-join {
  background: var(--wd-off-white) !important;
  border-top: 1px solid var(--wd-border);
}
.wd-ac-join::before { display: none !important; }
.wd-ac-join-inner h2 { color: var(--wd-dark) !important; }
.wd-ac-join-inner p  { color: var(--wd-mid)  !important; }
.wd-ac-join-inner .eyebrow { color: var(--wd-sky) !important; }

/* ── Hero — full video (no card crop) ── */
.wd-about2-hero-video-wrap {
  border-radius: var(--wd-radius-xl);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.12), 0 4px 16px rgba(0,0,0,0.06);
  line-height: 0;
}
.wd-about2-hero-video-full {
  width: 100%;
  height: auto;
  display: block;
}

/* ── Hero — full-bleed video, no text ── */
.wd-about2-hero-full {
  width: 100%;
  line-height: 0;
  overflow: hidden;
  background: #000;
}
.wd-about2-hero-full-video {
  width: 100%;
  height: auto;
  display: block;
  max-height: 92vh;
  object-fit: cover;
}

/* ============================================================
   VALUES CARDS — Sophisticated redesign
   ============================================================ */
.wd-about2-vals-grid {
  gap: 1rem;
}
.wd-about2-val-card {
  background: #fff;
  border: none;
  border-radius: 20px;
  padding: 2.25rem 2rem 2rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(14,17,23,0.04), 0 4px 16px rgba(14,17,23,0.05);
  transition: transform 0.32s cubic-bezier(0.22,1,0.36,1), box-shadow 0.32s;
}
/* gradient border via mask trick */
.wd-about2-val-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(0,176,80,0.25) 0%, rgba(14,17,23,0.07) 60%, rgba(14,17,23,0.04) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  transition: background 0.32s;
}
.wd-about2-val-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 24px rgba(14,17,23,0.08), 0 24px 48px rgba(14,17,23,0.06);
}
.wd-about2-val-card:hover::before {
  background: linear-gradient(135deg, rgba(0,176,80,0.55) 0%, rgba(0,176,80,0.15) 60%, rgba(14,17,23,0.05) 100%);
}
/* large ghost number watermark */
.wd-about2-val-card::after {
  content: attr(data-index);
  position: absolute;
  bottom: -1.5rem;
  right: 1.25rem;
  font-size: 8rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.06em;
  color: rgba(14,17,23,0.03);
  pointer-events: none;
  user-select: none;
}

.wd-about2-val-card-num {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.58rem;
  font-weight: 800;
  color: var(--wd-green);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}
.wd-about2-val-card-num::after {
  content: '';
  display: inline-block;
  width: 20px;
  height: 1px;
  background: var(--wd-green);
  opacity: 0.4;
}
.wd-about2-val-card-name {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin-bottom: 0.85rem;
}
.wd-about2-val-card-desc {
  font-size: 0.91rem;
  color: var(--wd-mid);
  line-height: 1.8;
}

/* Dark accent card (Founder-Led) */
.wd-about2-val-card--dark {
  background: linear-gradient(145deg, #0D1020 0%, #0A0C18 100%);
  box-shadow: 0 1px 2px rgba(0,0,0,0.12), 0 8px 24px rgba(0,0,0,0.18);
}
.wd-about2-val-card--dark::before {
  background: linear-gradient(135deg, rgba(0,176,80,0.4) 0%, rgba(0,176,80,0.1) 50%, rgba(255,255,255,0.04) 100%);
}
.wd-about2-val-card--dark:hover::before {
  background: linear-gradient(135deg, rgba(0,176,80,0.65) 0%, rgba(0,176,80,0.2) 50%, rgba(255,255,255,0.06) 100%);
}
.wd-about2-val-card--dark::after { color: rgba(255,255,255,0.03); }
.wd-about2-val-card--dark .wd-about2-val-card-num { color: var(--wd-green); }
.wd-about2-val-card--dark .wd-about2-val-card-num::after { background: var(--wd-green); opacity: 0.35; }
.wd-about2-val-card--dark .wd-about2-val-card-name { color: #fff; }
.wd-about2-val-card--dark .wd-about2-val-card-desc { color: rgba(255,255,255,0.45); }

/* ============================================================
   ZOOM PARALLAX — History section
   ============================================================ */
.wd-zp-section {
  background: var(--wd-off-white);
  border-top: 1px solid var(--wd-border);
}
.wd-zp-label {
  text-align: center;
  padding: 4rem 0 0;
}
.wd-zp-label .eyebrow { justify-content: center; }
.wd-zp-label h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  margin-top: 0.5rem;
}
.wd-zp-container {
  position: relative;
  height: 300vh;
}
.wd-zp-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}
.wd-zp-item {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  will-change: transform;
  transform-origin: center center;
}
.wd-zp-frame {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}
.wd-zp-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* frame sizes and offsets (relative within centred flex) */
.wd-zp-frame-0 { width: 25vw; height: 25vh; }
.wd-zp-frame-1 { width: 35vw; height: 30vh; top: -30vh; left:  5vw; }
.wd-zp-frame-2 { width: 20vw; height: 45vh; top: -10vh; left: -25vw; }
.wd-zp-frame-3 { width: 25vw; height: 25vh; top:      0; left:  27.5vw; }
.wd-zp-frame-4 { width: 20vw; height: 25vh; top:  27.5vh; left:  5vw; }
.wd-zp-frame-5 { width: 30vw; height: 25vh; top:  27.5vh; left: -22.5vw; }
.wd-zp-frame-6 { width: 15vw; height: 15vh; top:  22.5vh; left:  25vw; }
@media (max-width: 768px) {
  .wd-zp-frame-0 { width: 60vw; height: 30vh; }
  .wd-zp-frame-1, .wd-zp-frame-2, .wd-zp-frame-3,
  .wd-zp-frame-4, .wd-zp-frame-5, .wd-zp-frame-6 { display: none; }
}

/* ============================================================
   ABOUT PAGE — ELEGANT MINIMAL REDESIGN  (prefix: wd-ab-)
   ============================================================ */

.wd-ab-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 3rem);
}
.wd-ab-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-bottom: 2.5rem;
}
.wd-ab-rule {
  border: none;
  border-top: 1px solid var(--wd-border);
  margin: 0;
}

/* ── Hero ── */
.wd-ab-hero {
  width: 100%;
  background: #000;
  overflow: hidden;
  line-height: 0;
}
.wd-ab-hero video {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  display: block;
}

/* ── Opening statement ── */
.wd-ab-open {
  padding: 9rem 0 7rem;
  background: #fff;
}
.wd-ab-open-meta {
  display: block;
  font-size: 0.7rem;
  color: var(--wd-muted);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 2rem;
}
.wd-ab-open-h {
  font-size: clamp(2.2rem, 4.5vw, 3.75rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin-bottom: 2.25rem;
}
.wd-ab-open-body {
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  color: var(--wd-mid);
  line-height: 1.85;
  max-width: 640px;
}

/* ── Values — plain numbered list ── */
.wd-ab-values {
  padding: 6rem 0;
  background: #fff;
  border-top: 1px solid var(--wd-border);
}
.wd-ab-val {
  display: grid;
  grid-template-columns: 2.75rem 1fr;
  gap: 0 1.75rem;
  padding: 2rem 0;
  border-top: 1px solid var(--wd-border);
  align-items: start;
}
.wd-ab-val:last-child { border-bottom: 1px solid var(--wd-border); }
.wd-ab-val-n {
  font-size: 0.6rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.18em;
  padding-top: 0.22rem;
  display: block;
}
.wd-ab-val-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.02em;
  margin-bottom: 0.45rem;
  line-height: 1.25;
}
.wd-ab-val-desc {
  font-size: 0.9rem;
  color: var(--wd-mid);
  line-height: 1.8;
  margin: 0;
}

/* ── History / Timeline ── */
.wd-ab-history {
  padding: 6rem 0;
  background: #fff;
  border-top: 1px solid var(--wd-border);
}
.wd-ab-tl {
  position: relative;
  padding-left: 5rem;
  margin-top: 2rem;
}
/* the drawing line */
.wd-ab-tl::before {
  content: '';
  position: absolute;
  left: 2.1rem;
  top: 0.4rem;
  bottom: 0.4rem;
  width: 1px;
  background: var(--wd-green);
  transform: scaleY(0);
  transform-origin: top center;
  transition: transform 1.8s cubic-bezier(0.16, 1, 0.3, 1);
  opacity: 0.5;
}
.wd-ab-tl.wd-ab-tl--drawn::before {
  transform: scaleY(1);
}
.wd-ab-tl-item {
  position: relative;
  padding-bottom: 2.5rem;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.wd-ab-tl-item:last-child { padding-bottom: 0; }
.wd-ab-tl-item.wd-ab-tl--vis {
  opacity: 1;
  transform: none;
}
/* dot */
.wd-ab-tl-item::before {
  content: '';
  position: absolute;
  left: -2.95rem;
  top: 0.38rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  border: 1.5px solid #d1d5db;
  transition: border-color 0.4s, background 0.4s;
}
.wd-ab-tl-item.wd-ab-tl--vis::before { border-color: var(--wd-green); }
.wd-ab-tl-item--now::before {
  background: var(--wd-green) !important;
  border-color: var(--wd-green) !important;
  box-shadow: 0 0 0 3px rgba(0,176,80,0.18);
}
.wd-ab-tl-year {
  font-size: 0.62rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
  display: block;
}
.wd-ab-tl-title {
  font-size: 0.975rem;
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.01em;
  margin-bottom: 0.3rem;
  line-height: 1.3;
}
.wd-ab-tl-desc {
  font-size: 0.855rem;
  color: var(--wd-muted);
  line-height: 1.68;
  margin: 0;
}
/* Timeline item — photo */
.wd-ab-tl-img {
  display: block;
  width: 100%;
  height: 160px;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
  margin-top: 0.875rem;
  box-shadow: 0 2px 14px rgba(0,0,0,0.11);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.wd-ab-tl-item:hover .wd-ab-tl-img {
  transform: scale(1.02);
  box-shadow: 0 6px 22px rgba(0,0,0,0.16);
}

/* Timeline item — badge(s) */
.wd-ab-tl-badges {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  margin-top: 0.875rem;
  flex-wrap: wrap;
}

.wd-ab-tl-badge {
  height: 56px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  display: block;
}

@media (max-width: 600px) {
  .wd-ab-tl { padding-left: 3.5rem; }
  .wd-ab-tl::before { left: 1.5rem; }
  .wd-ab-tl-item::before { left: -2.1rem; }
  .wd-ab-tl-img { height: 120px; }
  .wd-ab-tl-badge { height: 44px; }
}

/* ── History: cards-left / timeline-right layout ── */
.wd-ab-history-inner {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 4.5rem;
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 3rem);
  align-items: start;
}

/* Intro heading (above timeline on right) */
.wd-ab-history-intro {
  margin-bottom: 2.25rem;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid var(--wd-border);
}
.wd-ab-history-intro .eyebrow { color: var(--wd-green); margin-bottom: 0.6rem; }
.wd-ab-history-intro h2 {
  font-size: clamp(1.7rem, 2.4vw, 2.4rem);
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1.2;
  margin: 0 0 0.9rem;
}
.wd-ab-history-intro h2 em { font-style: normal; color: var(--wd-green); }
.wd-ab-history-intro p { font-size: 0.93rem; color: var(--wd-mid); line-height: 1.78; margin: 0; }

/* ── Animated card stack (left column) ── */
.wd-ab-history-visual {
  position: sticky;
  top: 130px;
  align-self: start;
}

.wd-hcs-wrap {
  position: relative;
  width: 320px;
  height: 400px;
  perspective: 1200px;
  margin: 0 auto;
}

.wd-hcs-card {
  position: absolute;
  inset: 0;
  border-radius: 20px;
  overflow: hidden;
  will-change: transform, opacity;
  transition:
    transform  0.65s cubic-bezier(0.34, 1.2, 0.64, 1),
    opacity    0.50s ease,
    box-shadow 0.50s ease;
  backface-visibility: hidden;
}

/* photo card */
.wd-hcs-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

/* badge card (logos/partner badges) */
.wd-hcs-card--badge {
  background: #f5f8f4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding: 2.5rem 2rem;
}
.wd-hcs-card--badge img {
  width: auto;
  height: 72px;
  object-fit: contain;
}

/* ── State classes applied by JS ── */
.wd-hcs-card.st-active {
  transform: translateY(0px) rotate(0deg) scale(1) translateZ(0px);
  z-index: 20;
  opacity: 1;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22);
}
.wd-hcs-card.st-peek-1 {
  transform: translateY(12px) rotate(2.5deg) scale(0.96) translateZ(-12px);
  z-index: 15;
  opacity: 1;
  box-shadow: 0 8px 28px rgba(0,0,0,0.13);
}
.wd-hcs-card.st-peek-2 {
  transform: translateY(22px) rotate(4.5deg) scale(0.92) translateZ(-24px);
  z-index: 14;
  opacity: 0.78;
  box-shadow: 0 4px 16px rgba(0,0,0,0.09);
}
.wd-hcs-card.st-peek-3 {
  transform: translateY(30px) rotate(6deg) scale(0.88) translateZ(-36px);
  z-index: 13;
  opacity: 0.45;
}
.wd-hcs-card.st-hidden {
  transform: translateY(36px) rotate(7.5deg) scale(0.84) translateZ(-48px);
  z-index: 10;
  opacity: 0;
  pointer-events: none;
}
.wd-hcs-card.st-gone {
  transform: translateY(-115%) rotate(-6deg) scale(0.94);
  z-index: 1;
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 820px) {
  .wd-ab-history-inner {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .wd-ab-history-visual {
    position: static;
  }
  .wd-hcs-wrap {
    width: 280px;
    height: 340px;
    margin-bottom: 2rem;
  }
}

/* ── Team ── */
.wd-ab-team {
  padding: 6rem 0;
  background: #fff;
  border-top: 1px solid var(--wd-border);
}
.wd-ab-founders {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  margin-top: 2rem;
}
@media (max-width: 680px) {
  .wd-ab-founders { grid-template-columns: 1fr; gap: 3rem; }
}
.wd-ab-founder-photo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--wd-border);
  margin-bottom: 1.25rem;
  background: var(--wd-off-white);
}
.wd-ab-founder-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
}
.wd-ab-founder-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.02em;
  margin-bottom: 0.2rem;
}
.wd-ab-founder-role {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--wd-green);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.9rem;
}
.wd-ab-founder-bio {
  font-size: 0.9rem;
  color: var(--wd-mid);
  line-height: 1.8;
  margin-bottom: 1rem;
}
.wd-ab-founder-li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--wd-mid);
  transition: color 0.2s;
}
.wd-ab-founder-li:hover { color: var(--wd-dark); }

/* ── CTA ── */
.wd-ab-cta {
  padding: 9rem 0;
  background: #fff;
  border-top: 1px solid var(--wd-border);
  text-align: center;
}
.wd-ab-cta-h {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--wd-dark);
  letter-spacing: -0.04em;
  line-height: 1.15;
  margin-bottom: 0.85rem;
}
.wd-ab-cta-sub {
  font-size: 1rem;
  color: var(--wd-mid);
  line-height: 1.7;
  margin-bottom: 2.5rem;
}

/* ============================================================
   ABOUT PAGE — CULTURE-INSPIRED REDESIGN  (prefix: wd-ac2-)
   ============================================================ */

/* Mint base */
.wd-ac2-page { background: #EAF0E6; }

.wd-ac2-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}
.wd-ac2-inner--narrow {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}

/* pill label */
.wd-ac2-pill {
  display: inline-block;
  padding: 0.35rem 1.1rem;
  background: rgba(0,0,0,0.06);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--wd-mid);
  letter-spacing: 0.06em;
  margin-bottom: 1.25rem;
}

/* ── Opening ── */
.wd-ac2-open {
  padding: 8rem 0 6rem;
  background: #EAF0E6;
  text-align: center;
}
.wd-ac2-open-h {
  font-size: clamp(2.4rem, 5vw, 4rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin-bottom: 1.75rem;
}
.wd-ac2-open-h em { font-style: normal; color: var(--wd-green); }
.wd-ac2-open-body {
  font-size: clamp(1rem, 1.4vw, 1.1rem);
  color: #4a5a40;
  line-height: 1.82;
  max-width: 600px;
  margin: 0 auto;
}

/* ── Values cards ── */
.wd-ac2-values {
  padding: 6rem 0;
  background: #EAF0E6;
}
.wd-ac2-values-h {
  text-align: center;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #1a2410;
  letter-spacing: -0.03em;
  margin-bottom: 3.5rem;
}
.wd-ac2-values-h em { font-style: normal; color: var(--wd-green); }
.wd-ac2-cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.25rem;
}
@media (max-width: 900px) { .wd-ac2-cards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .wd-ac2-cards { grid-template-columns: repeat(2, 1fr); } }
.wd-ac2-card {
  background: #fff;
  border-radius: 20px;
  padding: 2rem 1.5rem 1.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 12px rgba(30,50,20,0.06), 0 8px 32px rgba(30,50,20,0.06);
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), box-shadow 0.3s;
}
.wd-ac2-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 20px rgba(30,50,20,0.1), 0 16px 48px rgba(30,50,20,0.1);
}
.wd-ac2-card-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #f0f3ee;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  color: #3a4a30;
}
.wd-ac2-card-icon svg { width: 28px; height: 28px; }
.wd-ac2-card-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-green);
  margin-bottom: 0.5rem;
  letter-spacing: -0.01em;
}
.wd-ac2-card-desc {
  font-size: 0.83rem;
  color: #6a7a60;
  line-height: 1.65;
  margin: 0;
}

/* ── Mission quote ── */
.wd-ac2-mission {
  padding: 7rem 0;
  background: #EAF0E6;
  text-align: center;
}
.wd-ac2-mission-q {
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  font-weight: 700;
  color: var(--wd-green);
  line-height: 1.45;
  letter-spacing: -0.02em;
  max-width: 820px;
  margin: 0 auto;
}

/* ── Scroll-driven timeline ── */
.wd-ac2-history {
  background: #EAF0E6;
  padding: 4rem 0 0;
}
.wd-ac2-history-head {
  text-align: center;
  padding-bottom: 3rem;
}
.wd-ac2-history-h {
  font-size: clamp(2.5rem, 5vw, 3.75rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.04em;
  line-height: 1.1;
}
.wd-ac2-history-h em { font-style: normal; color: var(--wd-green); }

.wd-ac2-tl-scroll {
  position: relative;
}
.wd-ac2-tl-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* center line */
.wd-ac2-tl-line {
  position: absolute;
  left: 50%;
  top: 5%;
  bottom: 5%;
  width: 2px;
  background: linear-gradient(to bottom, transparent, var(--wd-green) 15%, var(--wd-green) 85%, transparent);
  transform: translateX(-50%);
  opacity: 0.5;
}
/* each milestone panel */
.wd-ac2-ms {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 200px 1fr;
  gap: 0 2rem;
  align-items: center;
  padding: 0 clamp(2rem, 6vw, 8rem);
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.55s cubic-bezier(0.16,1,0.3,1), transform 0.55s cubic-bezier(0.16,1,0.3,1);
  pointer-events: none;
}
.wd-ac2-ms.is-active {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.wd-ac2-ms-date {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 900;
  color: var(--wd-green);
  text-align: center;
  letter-spacing: -0.05em;
  line-height: 1;
}
.wd-ac2-ms-photo {
  display: flex;
  justify-content: flex-end;
  padding-right: 2rem;
}
.wd-ac2-ms--flip .wd-ac2-ms-photo { order: 3; justify-content: flex-start; padding-right: 0; padding-left: 2rem; }
.wd-ac2-ms--flip .wd-ac2-ms-text  { order: 1; text-align: right; }
.wd-ac2-ms-text { padding-left: 2rem; }
.wd-ac2-ms--flip .wd-ac2-ms-text { padding-left: 0; padding-right: 2rem; }

/* polaroid card */
.wd-ac2-polaroid {
  background: #fff;
  padding: 10px 10px 32px;
  box-shadow: 0 8px 32px rgba(30,50,20,0.14), 0 2px 8px rgba(30,50,20,0.08);
  border-radius: 4px;
  transform: rotate(-2.5deg);
  max-width: 240px;
  transition: transform 0.4s ease;
}
.wd-ac2-ms--flip .wd-ac2-polaroid { transform: rotate(2.5deg); }
.wd-ac2-polaroid:hover { transform: rotate(0deg) scale(1.03) !important; }
.wd-ac2-polaroid img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 2px;
}

.wd-ac2-ms-title {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  font-weight: 800;
  color: #1a2410;
  letter-spacing: -0.025em;
  line-height: 1.25;
  margin-bottom: 0.6rem;
}
.wd-ac2-ms-desc {
  font-size: 0.9rem;
  color: #5a6a50;
  line-height: 1.72;
  margin: 0;
  max-width: 320px;
}
.wd-ac2-ms--flip .wd-ac2-ms-desc { margin-left: auto; }

/* progress indicator */
.wd-ac2-tl-progress {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.4rem;
}
.wd-ac2-tl-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(0,176,80,0.25);
  transition: background 0.3s, transform 0.3s;
}
.wd-ac2-tl-dot.is-active {
  background: var(--wd-green);
  transform: scale(1.4);
}

@media (max-width: 768px) {
  .wd-ac2-ms {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    gap: 1.5rem 0;
    padding: 3rem clamp(1.5rem, 5vw, 3rem);
    text-align: center;
  }
  .wd-ac2-ms-photo, .wd-ac2-ms--flip .wd-ac2-ms-photo { 
    order: 1; justify-content: center; padding: 0; 
  }
  .wd-ac2-ms-date { order: 2; font-size: 2.5rem; }
  .wd-ac2-ms-text, .wd-ac2-ms--flip .wd-ac2-ms-text { 
    order: 3; padding: 0; text-align: center; 
  }
  .wd-ac2-ms-desc, .wd-ac2-ms--flip .wd-ac2-ms-desc { margin: 0 auto; }
  .wd-ac2-polaroid { max-width: 180px; }
  .wd-ac2-polaroid img { height: 120px; }
}

/* ── Team ── */
.wd-ac2-team {
  padding: 8rem 0;
  background: #EAF0E6;
}
.wd-ac2-team-h {
  text-align: center;
  margin-bottom: 4rem;
}
.wd-ac2-team-h h2 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #1a2410;
  letter-spacing: -0.03em;
}
.wd-ac2-team-h h2 em { font-style: normal; color: var(--wd-green); }
.wd-ac2-founders-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  max-width: 900px;
  margin: 0 auto;
}
@media (max-width: 680px) { .wd-ac2-founders-row { grid-template-columns: 1fr; } }
.wd-ac2-founder-card {
  background: #fff;
  border-radius: 20px;
  padding: 2.25rem;
  box-shadow: 0 2px 12px rgba(30,50,20,0.06), 0 8px 32px rgba(30,50,20,0.05);
  display: flex;
  flex-direction: column;
}
.wd-ac2-founder-photo {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 1.25rem;
  background: #f0f3ee;
}
.wd-ac2-founder-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
}
.wd-ac2-founder-name {
  font-size: 1.1rem;
  font-weight: 800;
  color: #1a2410;
  letter-spacing: -0.02em;
  margin-bottom: 0.2rem;
}
.wd-ac2-founder-role {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.wd-ac2-founder-bio {
  font-size: 0.9rem;
  color: #5a6a50;
  line-height: 1.78;
  flex: 1;
  margin-bottom: 1.25rem;
}
.wd-ac2-founder-li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #4a5a40;
  background: #f0f3ee;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  transition: background 0.2s, color 0.2s;
  align-self: flex-start;
}
.wd-ac2-founder-li:hover { background: var(--wd-green); color: #fff; }

/* ── CTA ── */
.wd-ac2-cta {
  padding: 9rem 0;
  background: #EAF0E6;
  text-align: center;
  border-top: 1px solid rgba(0,0,0,0.07);
}
.wd-ac2-cta-h {
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.04em;
  line-height: 1.15;
  margin-bottom: 0.75rem;
}
.wd-ac2-cta-h em { font-style: normal; color: var(--wd-green); }
.wd-ac2-cta-sub {
  font-size: 1rem;
  color: #5a6a50;
  line-height: 1.7;
  margin-bottom: 2.5rem;
}

/* ============================================================
   ABOUT PAGE — CLEAN BALANCED REDESIGN  (prefix: wd-s2-)
   ============================================================ */

.wd-s2-inner {
  max-width: 1060px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}

/* ── Opening — white ── */
.wd-s2-open {
  background: #ffffff;
  padding: 8rem 0;
  text-align: center;
}
.wd-s2-tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  color: #8a9a80;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 2rem;
}
.wd-s2-headline {
  font-size: clamp(2.6rem, 5.5vw, 4.2rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.045em;
  line-height: 1.08;
  margin: 0 auto 2rem;
  max-width: 820px;
}
.wd-s2-headline em { font-style: normal; color: #00B050; }
.wd-s2-body {
  font-size: clamp(1rem, 1.4vw, 1.1rem);
  color: #5a6a50;
  line-height: 1.85;
  max-width: 620px;
  margin: 0 auto;
}

/* ── Values — mint ── */
.wd-s2-values {
  background: #EAF0E6;
  padding: 8rem 0;
  text-align: center;
}
.wd-s2-section-h {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin-bottom: 3.5rem;
}
.wd-s2-section-h em { font-style: normal; color: #00B050; }
.wd-s2-section-sub {
  font-size: 1rem;
  color: #6a7a60;
  line-height: 1.7;
  max-width: 560px;
  margin: -2rem auto 3.5rem;
}

.wd-s2-cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.25rem;
}
@media (max-width: 960px) { .wd-s2-cards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 580px) { .wd-s2-cards { grid-template-columns: repeat(2, 1fr); } }

.wd-s2-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 2.25rem 1.5rem 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 8px rgba(30,50,20,0.05), 0 8px 24px rgba(30,50,20,0.06);
  transition: transform 0.28s cubic-bezier(0.22,1,0.36,1), box-shadow 0.28s;
}
.wd-s2-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 16px rgba(30,50,20,0.08), 0 16px 40px rgba(30,50,20,0.1);
}
.wd-s2-card-icon {
  width: 68px;
  height: 68px;
  background: #f0f5ec;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  color: #3a5030;
  flex-shrink: 0;
}
.wd-s2-card-icon svg { width: 26px; height: 26px; }
.wd-s2-card-name {
  font-size: 1rem;
  font-weight: 800;
  color: #00B050;
  letter-spacing: -0.01em;
  margin-bottom: 0.55rem;
}
.wd-s2-card-desc {
  font-size: 0.82rem;
  color: #6a7a60;
  line-height: 1.68;
  margin: 0;
}

/* ── Team — white ── */
.wd-s2-team {
  background: #ffffff;
  padding: 8rem 0;
  text-align: center;
}
.wd-s2-founders {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  max-width: 860px;
  margin: 0 auto;
  text-align: left;
}
@media (max-width: 680px) { .wd-s2-founders { grid-template-columns: 1fr; } }

.wd-s2-founder {
  background: #EAF0E6;
  border-radius: 20px;
  padding: 2.5rem 2.25rem;
  display: flex;
  flex-direction: column;
}
.wd-s2-founder-photo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 1.25rem;
  background: #d8e4d0;
  border: 2px solid rgba(255,255,255,0.8);
  flex-shrink: 0;
}
.wd-s2-founder-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
}
.wd-s2-founder-name {
  font-size: 1.1rem;
  font-weight: 800;
  color: #1a2410;
  letter-spacing: -0.02em;
  margin-bottom: 0.2rem;
}
.wd-s2-founder-role {
  font-size: 0.7rem;
  font-weight: 700;
  color: #00B050;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.wd-s2-founder-bio {
  font-size: 0.9rem;
  color: #4a5a40;
  line-height: 1.78;
  flex: 1;
  margin-bottom: 1.5rem;
}
.wd-s2-li-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #2a3a20;
  background: #fff;
  padding: 0.45rem 1rem;
  border-radius: 999px;
  align-self: flex-start;
  transition: background 0.2s, color 0.2s;
}
.wd-s2-li-btn:hover { background: #00B050; color: #fff; }

/* ── CTA — mint ── */
.wd-s2-cta {
  background: #EAF0E6;
  padding: 9rem 0;
  text-align: center;
}
.wd-s2-cta-h {
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.04em;
  line-height: 1.12;
  margin-bottom: 1rem;
}
.wd-s2-cta-h em { font-style: normal; color: #00B050; }
.wd-s2-cta-sub {
  font-size: 1rem;
  color: #6a7a60;
  line-height: 1.72;
  margin-bottom: 2.5rem;
}

/* ── Happy Souls section ── */
.wd-happy-souls {
  background: #E8EDE6;
  padding: 5rem 2rem;
}
.wd-happy-souls-inner {
  max-width: 1040px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.wd-polaroids {
  position: relative;
  width: 280px;
  height: 280px;
  margin: 0 auto;
}
.wd-polaroid {
  position: absolute;
  width: 200px;
  background: #fff;
  border-radius: 4px;
  padding: 10px 10px 36px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.13);
  transition: transform 0.3s ease;
}
.wd-polaroid img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;
  border-radius: 2px;
}
.wd-polaroid:nth-child(1) { transform: rotate(-8deg); top: 40px; left: 0;   z-index: 1; }
.wd-polaroid:nth-child(2) { transform: rotate(4deg);  top: 20px; left: 50px; z-index: 2; }
.wd-polaroid:nth-child(3) { transform: rotate(-2deg); top: 60px; left: 80px; z-index: 3; }
.wd-polaroids:hover .wd-polaroid:nth-child(1) { transform: rotate(-12deg) translateX(-10px); }
.wd-polaroids:hover .wd-polaroid:nth-child(2) { transform: rotate(2deg); }
.wd-polaroids:hover .wd-polaroid:nth-child(3) { transform: rotate(3deg)  translateX(10px); }
.wd-moments-label {
  text-align: center;
  margin-top: 1.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--wd-green);
}
.wd-happy-souls-text h2 {
  font-size: clamp(1.9rem, 3.2vw, 2.8rem);
  font-weight: 700;
  color: #1a2410;
  letter-spacing: -0.025em;
  line-height: 1.15;
  margin: 0 0 1.25rem;
}
.wd-happy-souls-text h2 em {
  font-style: normal;
  color: var(--wd-green);
}
.wd-happy-souls-text p {
  font-size: 1rem;
  color: #4a5a40;
  line-height: 1.75;
  margin: 0;
  max-width: 520px;
}
@media (max-width: 768px) {
  .wd-happy-souls-inner {
    grid-template-columns: 1fr;
    gap: 3rem;
    text-align: center;
  }
  .wd-happy-souls-text p { margin: 0 auto; }
}

/* ── About page size corrections ── */

/* ══ OUR MISSION SECTION ══════════════════════════════════════ */
.wd-mission-section {
  background-color: #F0F4EE;
  background-image:
    linear-gradient(to right,  rgba(71,85,105,0.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(71,85,105,0.07) 1px, transparent 1px);
  background-size: 32px 32px;
  padding: 6rem 2rem;
  overflow: hidden;
}

.wd-mission-section--text-only {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 6rem 2rem;
}

.wd-howwe-section--heading-only {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 6rem 2rem;
  background: #fff;
}

/* ── History flip gallery (horizontal book-flip) ─────────── */
/* ============================================================
   OUR JOURNEY — Expandable horizontal gallery (gallery-animation style)
   ============================================================ */
.wd-journey-section {
  background: #fff;
  padding: 5rem 1.5rem 6rem;
}
.wd-journey-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.wd-journey-header {
  text-align: center;
  margin-bottom: 3rem;
}
.wd-journey-header h2 { margin-top: 0.25rem; }

/* ── Gallery strip ── */
.wd-gallery-strip {
  display: flex;
  gap: 6px;
  height: 480px;
  width: 100%;
  user-select: none;
}

.wd-gallery-panel {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border-radius: 12px;
  transition: flex-grow 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.wd-gallery-strip.has-hover .wd-gallery-panel          { flex-grow: 0.5; }
.wd-gallery-strip.has-hover .wd-gallery-panel.is-active { flex-grow: 3.2; }

.wd-gallery-panel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}
.wd-gallery-panel--badge img {
  object-fit: contain;
  padding: 18px;
}
.wd-gallery-strip.has-hover .wd-gallery-panel.is-active img { transform: scale(1.04); }

/* Dark overlay — 0.3 by default, 0 on active */
.wd-gallery-panel__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 176, 80, 0.88);
  transition: background 0.4s ease;
  pointer-events: none;
}
.wd-gallery-strip.has-hover .wd-gallery-panel.is-active .wd-gallery-panel__overlay {
  background: rgba(0, 176, 80, 0);
}

/* Info block — slides up on active */
.wd-gallery-panel__info {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 3rem 1.6rem 1.85rem;
  background: linear-gradient(to top,
    rgba(255,255,255,0.97) 0%,
    rgba(255,255,255,0.95) 45%,
    rgba(255,255,255,0.8)  65%,
    rgba(255,255,255,0.35) 82%,
    transparent            100%);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}
.wd-gallery-strip.has-hover .wd-gallery-panel.is-active .wd-gallery-panel__info {
  opacity: 1;
  transform: translateY(0);
}
.wd-gallery-panel__milestone {
  font-family: 'Rubik', sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(0,0,0,0.42);
  margin: 0 0 0.35rem;
}
.wd-gallery-panel__date {
  font-family: 'Rubik', sans-serif;
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: #007832;
  margin: 0 0 0.35rem;
}
.wd-gallery-panel__title {
  font-family: 'Rubik', sans-serif;
  font-size: 1.45rem;
  font-weight: 800;
  color: #0E1117;
  line-height: 1.15;
  margin: 0 0 0.65rem;
}
.wd-gallery-panel__divider {
  width: 2.25rem;
  height: 2.5px;
  background: #007832;
  border: none;
  margin: 0 0 0.65rem;
  opacity: 1;
}
.wd-gallery-panel__desc {
  font-size: 0.92rem;
  line-height: 1.6;
  color: #52596A;
  margin: 0;
}

/* Vertical year tag — visible when collapsed */
.wd-gallery-panel__tag {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  white-space: nowrap;
  font-family: 'Rubik', sans-serif;
  font-size: clamp(0.75rem, 1.15vw, 1.15rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.82);
  text-shadow: 0 2px 14px rgba(0,0,0,0.45);
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.wd-gallery-strip.has-hover .wd-gallery-panel.is-active .wd-gallery-panel__tag { opacity: 0; }

/* ── Lightbox ── */
.wd-gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(5, 6, 12, 0.96);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.wd-gallery-lightbox.is-open {
  opacity: 1;
  pointer-events: all;
}
.wd-gl-frame {
  max-width: 860px;
  max-height: 78vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  overflow: hidden;
}
.wd-gl-frame img {
  max-width: 100%;
  max-height: 75vh;
  object-fit: contain;
  display: block;
  border-radius: 10px;
}
.wd-gl-close {
  position: absolute;
  top: 1.25rem; right: 1.25rem;
  color: rgba(255,255,255,0.65);
  background: rgba(255,255,255,0.08);
  border: none; border-radius: 50%;
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.wd-gl-close:hover { background: rgba(255,255,255,0.16); color: #fff; }
.wd-gl-prev, .wd-gl-next {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  color: rgba(255,255,255,0.65);
  background: rgba(255,255,255,0.08);
  border: none; border-radius: 50%;
  width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.wd-gl-prev:hover, .wd-gl-next:hover { background: rgba(255,255,255,0.16); color: #fff; }
.wd-gl-prev { left: 1.5rem; }
.wd-gl-next { right: 1.5rem; }
.wd-gl-meta {
  position: absolute;
  bottom: 3.5rem; left: 50%;
  transform: translateX(-50%);
  text-align: center;
  white-space: nowrap;
}
.wd-gl-date {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: #00B050; margin: 0 0 0.3rem;
}
.wd-gl-title {
  font-family: 'Rubik', sans-serif;
  font-size: 1rem; font-weight: 600;
  color: rgba(255,255,255,0.9); margin: 0;
}
.wd-gl-counter {
  position: absolute;
  bottom: 1.5rem; left: 50%;
  transform: translateX(-50%);
  font-size: 0.68rem; color: rgba(255,255,255,0.3);
  letter-spacing: 0.1em;
}

@media (max-width: 768px) {
  .wd-gallery-strip { height: 300px; gap: 4px; }
  .wd-gallery-panel { border-radius: 8px; }
  .wd-journey-section { padding: 3.5rem 1rem 4rem; }
}
@media (max-width: 480px) {
  .wd-gallery-strip { height: 240px; }
  .wd-journey-header { margin-bottom: 2rem; }
  .wd-gl-prev { left: 0.5rem; }
  .wd-gl-next { right: 0.5rem; }
}

.wd-mission-layout {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 440px 1fr;
  gap: 2.5rem;
  align-items: center;
}

.wd-mission-col {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.wd-mission-col--left  { padding-top: 3rem; }
.wd-mission-col--right { padding-bottom: 3rem; }

.wd-mission-col--left  .wd-mp:nth-child(2) { margin-left: 1.25rem; margin-top: -3rem; z-index: 2; }
.wd-mission-col--right .wd-mp:nth-child(2) { margin-right: 1.25rem; margin-top: -3rem; z-index: 2; }
.wd-mission-col .wd-mp { position: relative; z-index: 1; }

.wd-mp {
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 6px 28px rgba(0,0,0,0.40);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  flex-shrink: 0;
}

.wd-mp:hover {
  transform: scale(1.03);
  box-shadow: 0 12px 40px rgba(0,0,0,0.55);
}

.wd-mp img {
  width: 100%;
  display: block;
  object-fit: cover;
}

.wd-mp--sm img { height: 155px; }
.wd-mp--md img { height: 205px; }
.wd-mp--lg img { height: 255px; }
/* Full image — no height cap, no overflow clip, radius on the img itself */
.wd-mp--full {
  overflow: visible;
  border-radius: 0;
}
.wd-mp--full img {
  width: 100%;
  height: auto !important;
  object-fit: fill;
  border-radius: 20px;
}

/* Center text */
.wd-mission-text {
  text-align: center;
  padding: 0.5rem 0;
}

.wd-mission-text .eyebrow { color: var(--wd-green); margin-bottom: 0.75rem; }

.wd-mission-h2 {
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 1.5rem;
}

.wd-mission-h2 em {
  font-style: normal;
  color: var(--wd-green);
}

.wd-mission-quote {
  font-size: clamp(1rem, 1.3vw, 1.15rem);
  font-weight: 400;
  color: var(--wd-dark);
  line-height: 1.25;
  margin: 0 0 1.1rem;
}

.wd-mission-body {
  font-size: 0.93rem;
  color: var(--wd-mid);
  line-height: 1.82;
  margin: 0;
}

@media (max-width: 860px) {
  .wd-mission-layout {
    grid-template-columns: 1fr;
    max-width: 520px;
  }
  .wd-mission-col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 0 !important;
  }
  .wd-mission-col .wd-mp:nth-child(2) { margin: 0 !important; }
  .wd-mp--sm img, .wd-mp--md img, .wd-mp--lg img { height: 100px; }
  .wd-mission-col--right { order: 3; }
  .wd-mission-text { order: 2; }
}

.wd-s2-open                { padding: 5rem 0; }
.wd-s2-headline            { font-size: clamp(1.75rem, 3vw, 2.6rem); margin-bottom: 1.5rem; }
.wd-s2-body                { font-size: 0.97rem; }

.wd-s2-values              { padding: 5rem 0; }
.wd-s2-section-h           { font-size: clamp(1.5rem, 2.5vw, 2.1rem); margin-bottom: 2.5rem; }
.wd-s2-card                { padding: 1.75rem 1.25rem 1.5rem; border-radius: 16px; }
.wd-s2-card-icon           { width: 54px; height: 54px; margin-bottom: 1rem; }
.wd-s2-card-icon svg       { width: 22px; height: 22px; }
.wd-s2-card-name           { font-size: 0.92rem; }
.wd-s2-card-desc           { font-size: 0.78rem; }

.wd-s2-team                { padding: 5rem 0; }
.wd-s2-section-sub         { font-size: 0.92rem; margin: -1.75rem auto 2.5rem; }
.wd-s2-founder             { padding: 2rem 2rem; border-radius: 16px; }
.wd-s2-founder-photo       { width: 48px; height: 48px; margin-bottom: 1rem; }
.wd-s2-founder-name        { font-size: 1rem; }
.wd-s2-founder-role        { font-size: 0.65rem; }
.wd-s2-founder-bio         { font-size: 0.85rem; }
.wd-s2-li-btn              { font-size: 0.72rem; padding: 0.35rem 0.85rem; }

.wd-s2-cta                 { padding: 5rem 0; }
.wd-s2-cta-h               { font-size: clamp(1.5rem, 3vw, 2.4rem); margin-bottom: 0.75rem; }
.wd-s2-cta-sub             { font-size: 0.92rem; margin-bottom: 2rem; }

/* ── Values cards — equal height, clear borders ── */
.wd-s2-values         { padding: 4.5rem 0; }
.wd-s2-cards          { align-items: stretch; gap: 1rem; }
.wd-s2-card {
  height: 100%;
  border: 1px solid #d4dece;
  justify-content: flex-start;
  padding: 1.75rem 1.25rem;
}
.wd-s2-card-icon      { margin-bottom: 1rem; flex-shrink: 0; }
.wd-s2-card-name      { margin-bottom: 0.5rem; flex-shrink: 0; }
.wd-s2-card-desc      { flex: 1; }

/* ============================================================
   VALUES — Neumorphic flip cards
   ============================================================ */
.wd-vals-section {
  background: #E8EDE6;
  padding: 5rem 0 5.5rem;
  text-align: center;
}
.wd-vals-heading {
  font-size: clamp(1.75rem, 3vw, 2.4rem);
  font-weight: 900;
  color: #1a2410;
  letter-spacing: -0.035em;
  margin-bottom: 3rem;
}
.wd-vals-heading em { font-style: normal; color: #00B050; }

.wd-vals-grid {
  display: flex;
  gap: 1.25rem;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0 clamp(1.5rem, 5vw, 4rem);
}

/* ── Flip card shell ── */
.wd-val-flip {
  perspective: 1200px;
  width: 210px;
  height: 300px;
  flex-shrink: 0;
}
.wd-val-flip-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.72s cubic-bezier(0.4, 0.2, 0.2, 1);
  border-radius: 22px;
}
.wd-val-flip:hover .wd-val-flip-inner {
  transform: rotateY(180deg);
}

/* ── Shared face styles ── */
.wd-val-front, .wd-val-back {
  position: absolute;
  inset: 0;
  border-radius: 22px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2rem 1.25rem 1.75rem;
}

/* ── Front face — neumorphic ── */
.wd-val-front {
  background: #E8EDE6;
  box-shadow:
    9px 9px 22px rgba(0,0,0,0.11),
    -9px -9px 22px rgba(255,255,255,0.88);
}
/* ── Icon circle — inset/concave ── */
.wd-val-icon-circle {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #E8EDE6;
  box-shadow:
    inset 5px 5px 12px rgba(0,0,0,0.12),
    inset -5px -5px 12px rgba(255,255,255,0.88);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  flex-shrink: 0;
}
.wd-val-icon-circle svg { width: 46px; height: 46px; }
.wd-val-front-name {
  font-size: 1.05rem;
  font-weight: 800;
  color: #00B050;
  margin-bottom: 0.6rem;
  letter-spacing: -0.01em;
}
.wd-val-front-desc {
  font-size: 0.78rem;
  color: #5a6a50;
  line-height: 1.65;
  text-align: center;
  margin: 0;
}

/* ── Back face — green ── */
.wd-val-back {
  background: #00B050;
  transform: rotateY(180deg);
  justify-content: center;
  box-shadow:
    9px 9px 22px rgba(0,100,40,0.22),
    -9px -9px 22px rgba(255,255,255,0.55);
}
.wd-val-back-name {
  font-size: 1.15rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
  margin-bottom: 0.85rem;
}
.wd-val-back-desc {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.92);
  line-height: 1.7;
  text-align: center;
  margin: 0;
}

@media (max-width: 700px) {
  .wd-val-flip { width: 160px; height: 270px; }
  .wd-val-icon-circle { width: 76px; height: 76px; }
  .wd-val-icon-circle svg { width: 36px; height: 36px; }
}

/* ── Fix: contain SVG icons inside circle ── */
.wd-val-icon-circle {
  overflow: hidden;
}
.wd-val-icon-circle svg {
  display: block;
  width: 44px !important;
  height: 44px !important;
  flex-shrink: 0;
}

/* ── Cards without icons — centred content ── */
.wd-val-front { justify-content: center; }
.wd-val-front-name { font-size: 1.15rem; margin-bottom: 0.75rem; }
.wd-val-front-desc { font-size: 0.82rem; }

/* ── Values cards — clear white cards ── */
.wd-val-front {
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(30,50,20,0.08), 0 8px 32px rgba(30,50,20,0.08);
  border: 1px solid #d8e4d2;
  padding: 2.25rem 1.5rem;
  justify-content: center;
}
.wd-val-back {
  padding: 2.25rem 1.5rem;
}
.wd-val-front-name {
  font-size: 1.25rem;
  font-weight: 800;
  color: #00B050;
  margin-bottom: 0.85rem;
  letter-spacing: -0.02em;
}
.wd-val-front-desc {
  font-size: 0.85rem;
  color: #5a6a50;
  line-height: 1.7;
}
.wd-val-back-name {
  font-size: 1.2rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 0.85rem;
}
.wd-val-back-desc {
  font-size: 0.85rem;
  line-height: 1.72;
}
.wd-val-flip {
  width: 200px;
  height: 270px;
}

/* ── Flip cards — cross-browser fade approach ── */
.wd-val-flip { position: relative; cursor: pointer; }

/* Reset the broken 3D transform approach */
.wd-val-flip-inner {
  transform-style: flat !important;
  -webkit-transform-style: flat !important;
  transition: none !important;
  transform: none !important;
  position: relative;
  width: 100%;
  height: 100%;
}
.wd-val-flip:hover .wd-val-flip-inner {
  transform: none !important;
}

/* Front — visible by default */
.wd-val-front {
  transform: none !important;
  backface-visibility: visible !important;
  -webkit-backface-visibility: visible !important;
  position: relative;
  opacity: 1;
  transition: opacity 0.35s ease;
  height: 100%;
}

/* Back — hidden by default, shown on hover/active */
.wd-val-back {
  transform: none !important;
  backface-visibility: visible !important;
  -webkit-backface-visibility: visible !important;
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}

/* Hover (desktop) */
.wd-val-flip:hover .wd-val-front { opacity: 0; }
.wd-val-flip:hover .wd-val-back  { opacity: 1; visibility: visible; }

/* Tap (mobile) */
.wd-val-flip.flipped .wd-val-front { opacity: 0; }
.wd-val-flip.flipped .wd-val-back  { opacity: 1; visibility: visible; }


/* ════════════════════════════════════════════════════════════
   TEAM PAGE
   ════════════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────────────── */
.wd-team-hero {
  background: var(--wd-off-white);
  border-bottom: 1px solid var(--wd-border);
  padding-block: clamp(4rem, 8vw, 6rem);
  text-align: center;
}
.wd-team-hero .eyebrow { margin-bottom: 0.75rem; }
.wd-team-hero h1 {
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.12;
  color: var(--wd-dark);
  margin: 0 0 1rem;
}
.wd-team-hero h1 em {
  font-style: normal;
  color: var(--wd-green);
}
.wd-team-hero-sub {
  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
  color: var(--wd-mid);
  max-width: 560px;
  margin: 0 auto;
  line-height: 1.7;
}

/* ── Section wrapper ──────────────────────────────────────── */
.wd-team-section {
  padding-block: clamp(4rem, 7vw, 6rem);
  background: #fff;
}
.wd-team-section--alt {
  background: var(--wd-off-white);
}

/* ── Section header ───────────────────────────────────────── */
.wd-team-section-header {
  text-align: center;
  max-width: 580px;
  margin: 0 auto clamp(2.5rem, 4vw, 3.5rem);
}
.wd-team-section-header .eyebrow { margin-bottom: 0.6rem; }
.wd-team-section-header h2 {
  margin: 0 0 0.75rem;
}
.wd-team-section-header p {
  font-size: 0.95rem;
  color: var(--wd-mid);
  line-height: 1.7;
  margin: 0;
}

/* ── Grids ────────────────────────────────────────────────── */
.wd-tm-grid { display: grid; }

.wd-tm-grid--leaders {
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1.5rem, 3vw, 2.5rem);
  max-width: 780px;
  margin: 0 auto;
}
.wd-tm-grid--founding {
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.25rem, 2.5vw, 2rem);
  max-width: 900px;
  margin: 0 auto;
}
.wd-tm-grid--employees {
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(1rem, 2vw, 1.5rem);
}

/* ── Base card ────────────────────────────────────────────── */
.wd-tm-card {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: 20px;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.wd-tm-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.10);
}

/* ── Photo wrap ───────────────────────────────────────────── */
.wd-tm-photo-wrap {
  width: 100%;
  background: var(--wd-off-white);
  overflow: hidden;
  position: relative;
}
.wd-tm-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* ── Avatar (initials fallback) ───────────────────────────── */
.wd-tm-avatar {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(0,176,80,0.12) 0%, rgba(0,176,80,0.06) 100%);
}
.wd-tm-avatar::after {
  content: attr(data-initials);
  font-family: 'Rubik', sans-serif;
  font-weight: 700;
  color: var(--wd-green);
  letter-spacing: -0.02em;
}

/* ── Card body ────────────────────────────────────────────── */
.wd-tm-body {
  padding: 1.1rem 1.25rem 1.25rem;
}
.wd-tm-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wd-dark);
  letter-spacing: -0.01em;
  margin-bottom: 0.2rem;
}
.wd-tm-role {
  font-size: 0.78rem;
  color: var(--wd-mid);
  font-weight: 500;
  line-height: 1.4;
}
.wd-tm-bio {
  font-size: 0.82rem;
  color: var(--wd-muted);
  line-height: 1.68;
  margin: 0.65rem 0 0.75rem;
}
.wd-tm-linkedin {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--wd-green);
  text-decoration: none;
  transition: opacity 0.18s;
}
.wd-tm-linkedin:hover { opacity: 0.75; }

/* ── Leadership card — tall photo ─────────────────────────── */
.wd-tm-card--leader .wd-tm-photo-wrap {
  height: 280px;
}
.wd-tm-card--leader .wd-tm-avatar::after { font-size: 3rem; }
.wd-tm-card--leader .wd-tm-body { padding: 1.25rem 1.5rem 1.5rem; }
.wd-tm-card--leader .wd-tm-name { font-size: 1.1rem; }
.wd-tm-card--leader .wd-tm-role { font-size: 0.82rem; margin-bottom: 0; }

/* ── Founding team card — medium photo ────────────────────── */
.wd-tm-card--founder .wd-tm-photo-wrap {
  height: 220px;
}
.wd-tm-card--founder .wd-tm-avatar::after { font-size: 2.5rem; }

/* ── Employee card — compact square photo ─────────────────── */
.wd-tm-card--member .wd-tm-photo-wrap {
  height: 180px;
}
.wd-tm-card--member .wd-tm-avatar::after { font-size: 2rem; }
.wd-tm-card--member .wd-tm-body { padding: 0.875rem 1rem 1rem; }
.wd-tm-card--member .wd-tm-name { font-size: 0.9rem; }
.wd-tm-card--member .wd-tm-role { font-size: 0.72rem; }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .wd-tm-grid--employees { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .wd-tm-grid--leaders  { grid-template-columns: 1fr; max-width: 400px; }
  .wd-tm-grid--founding { grid-template-columns: repeat(2, 1fr); }
  .wd-tm-grid--employees { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .wd-tm-grid--founding  { grid-template-columns: 1fr; max-width: 320px; margin-inline: auto; }
  .wd-tm-grid--employees { grid-template-columns: repeat(2, 1fr); }
  .wd-tm-card--leader .wd-tm-photo-wrap { height: 240px; }
}

/* ── Team page card size overrides ───────────────────────── */

/* Founding team: slightly smaller avatar */
.wd-tm-card--founding .wd-leader-photo.wd-leader-avatar {
  width: 100px;
  height: 100px;
  margin-bottom: 1.25rem;
}
.wd-tm-card--founding .wd-avatar-initials { font-size: 2.2rem; }
.wd-tm-card--founding .wd-leader-photo-img { border-radius: 50%; }
.wd-tm-card--founding.wd-leader-card { padding: 2rem 1.5rem; }

/* Employee cards: compact avatar */
.wd-tm-card--member .wd-leader-photo.wd-leader-avatar {
  width: 80px;
  height: 80px;
  margin-bottom: 1rem;
  box-shadow: 0 0 0 3px rgba(0,176,80,0.12), 0 8px 24px rgba(0,176,80,0.22);
}
.wd-tm-card--member .wd-leader-avatar--alt {
  box-shadow: 0 0 0 3px rgba(27,94,234,0.12), 0 8px 24px rgba(27,94,234,0.2);
}
.wd-tm-card--member .wd-avatar-initials { font-size: 1.6rem; }
.wd-tm-card--member .wd-leader-photo-img { border-radius: 50%; }
.wd-tm-card--member.wd-leader-card { padding: 1.75rem 1.25rem; }
.wd-tm-card--member .wd-leader-name { font-size: 0.9rem; }
.wd-tm-card--member .wd-leader-title { font-size: 0.75rem; margin-bottom: 0; }
/* Hide radar rings on smallest cards to reduce visual noise */
.wd-tm-card--member .wd-radar-ring { display: none; }

/* ── Values fan carousel ─────────────────────────────────── */
.wd-val-section { overflow-x: clip; padding-bottom: 1.5rem !important; }

.wd-val-fan {
  position: relative;
  height: 360px;
  overflow: visible;
}

.wd-val-card {
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -110px;
  width: 220px;
  opacity: 0;
  will-change: transform, opacity;
  cursor: default;
}

@media (max-width: 1023px) { .wd-val-fan { height: 330px; } }
@media (max-width: 767px)  { .wd-val-fan { height: 300px; } }
@media (max-width: 639px)  { .wd-val-fan { height: 270px; } }
@media (max-width: 479px)  { .wd-val-fan { height: 250px; } }



/* ── Booking Section ────────────────────────────────────── */
.wd-book-section {
  background: #fff;
  border-top: 1px solid #E4E7EF;
  padding: 4rem 1.5rem 0;
}
.wd-book-section__wrap {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 4rem;
  align-items: start;
}
.wd-book-section__left {
  padding-top: 2.5rem;
  position: sticky;
  top: 2rem;
}
.wd-book-section__label {
  display: inline-block;
  font-family: 'Rubik', sans-serif;
  font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: #00B050; margin-bottom: .75rem;
}
.wd-book-section__title {
  font-family: 'Rubik', sans-serif;
  font-size: clamp(2rem, 3.4vw, 3rem); font-weight: 700;
  color: #0E1117; letter-spacing: -.025em; line-height: 1.12; margin: 0 0 1.1rem;
}
.wd-book-section__title .wd-green { color: #00B050; }
.wd-book-section__sub {
  font-family: 'Rubik', sans-serif;
  font-size: .9375rem; color: #52596A; line-height: 1.7; margin: 0;
}

/* Iframe container — flush to bottom of section */
.wd-book-iframe-wrap {
  width: 100%;
  height: 1000px;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  border: 1px solid #E4E7EF;
  border-bottom: none;
  box-shadow: 0 -2px 20px rgba(14,17,23,.05);
}
.wd-book-iframe-wrap iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

@media (max-width: 860px) {
  .wd-book-section__wrap {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .wd-book-section__left {
    padding-top: 0;
    position: static;
  }
  .wd-book-section { padding: 3rem 1rem 0; }
  .wd-book-iframe-wrap { height: 960px; border-radius: 12px 12px 0 0; }
}
