/* =========================================
   AUP.CSS — VERIFIED CLEAN VERSION
   PRESERVES ALL FUNCTIONAL STYLING
   ========================================= */

/* ===============================
   GENERAL STYLES AND UTILITIES
   =============================== */

.section {
  padding: 80px 24px;
  max-width: 1150px;
  margin: 0 auto;
}

.section h2.title {
  font-size: 36px;
  font-weight: 700;
  color: #0A2342;
  margin-bottom: 20px;
}

.section .lead {
  font-size: 19px;
  color: #4A5A70;
  line-height: 1.55;
  max-width: 900px;
  margin: 0 auto 12px;
}

.section .sublead {
  font-size: 18px;
  color: #50627B;
  max-width: 880px;
  margin: 0 auto;
}


/* ===== ICON GRID (What AUP Can Do For You) ===== */

.icon-grid.light-bg {
  background: #F7FAFF;
  padding: 90px 0 60px;
}

.icon-cards {
  display: grid;
  gap: 32px;
}

@media (min-width: 992px) {
  .icon-cards {
    grid-template-columns: repeat(4, 1fr);
  }
}

.icon-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 32px 18px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  transition: transform .25s ease;
}

.icon-card:hover {
  transform: translateY(-6px);
}

.icon-card h3 {
  font-size: 20px;
  color: #0A2342;
  margin-top: 14px;
}

.icon-card p {
  font-size: 16px;
  color: #4A5A70;
  margin-top: 8px;
}


/* ===== FEATURE CARDS ===== */

.banks h2.title-light {
  color: #ffffff;
  margin-bottom: 18px;
}

.cta-final .btn-primary.big-cta {
  display: inline-block;
  padding: 16px 40px;
  background: #1FCF8C;
  border-radius: 50px;
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  transition: background .25s ease;
}

.cta-final .btn-primary.big-cta:hover {
  background: #19B879;
}
/* =========================================
   AUP — Benefit Cards / Used On THIS Page
   ========================================= */

.aup-benefits .container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}

.banks h2.title-light {
    font-size: 38px;
    margin-bottom: 18px;
    color: #FFFFFF;
}

.banks h2.title-light {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 18px;
    color: #FFFFFF;
}

.banks h2.title-light {
    font-size: 44px;
    font-weight: 800;
    margin-bottom: 18px;
    color: #FFFFFF !important;
}

/* Tighter body spacing */

.banks h2.title-light {
    font-size: 44px;
    font-weight: 800;
    margin-bottom: 18px;
    color: #FFFFFF !important;
}

/* Tighter body spacing */

.banks .title-light {
    position: relative;
    display: inline-block;
    padding-bottom: 12px;
}

/* Accent underline */

.banks .title-light::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 68px;
    height: 4px;
    background: #1FCF8C; /* MEED Green */
    border-radius: 4px;
}

/* Center underline when grid collapses */
@media (max-width: 900px) {
    .banks .title-light {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .banks .title-light::after {
        left: 50%;
        transform: translateX(-50%);
    }
}
/* ======================================================
   BANKS SECTION 
   ====================================================== */

/* Add a secondary floating inset highlight */

.banks .title-light {
    z-index: 2;
}

.banks .title-light::before {
    content: "";
    position: absolute;
    left: -20px;
    right: -20px;
    top: -8px;
    height: 32px;
    background: rgba(255,255,255,0.05);
    filter: blur(12px);
    border-radius: 12px;
    z-index: -1;
    pointer-events: none;
}

/* Smooth panel entrance animation */

.icon-check::before {
    content: "✔";
    font-size: 22px;
    color: #1FCF8C;
    font-weight: 800;
}

/* Red X Icon */

.icon-x::before {
    content: "✘";
    font-size: 22px;
    color: #FF5555;
    font-weight: 800;
}

/* Bullet points */

.aup-usecases .title {
  font-size: 36px;
  font-weight: 800;
  color: #071A2F;
  margin-bottom: 24px;
}

.aup-usecases.v10 .title {
  font-size: 40px;
  font-weight: 800;
  color: #071A2F;
  margin-bottom: 18px;
  position: relative;
  display: inline-block;
}

.aup-usecases.v10 .title::after {
  content: "";
  width: 90px;
  height: 4px;
  background: #1FCF8C;
  border-radius: 4px;
  position: absolute;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
}

/* Intro Paragraph */

.fade-up {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.65s cubic-bezier(.16,1,.3,1) forwards;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Tablet Spacing Refinement */
@media (max-width: 1024px) {
  .aup-usecases.v10 .title {
    font-size: 34px;
  }
}

/* Mobile Refinement */
@media (max-width: 600px) {
  .usecase-card {
    padding: 28px 22px;
  }
}
/* ==========================================================
   WHY MEED FOR AUP — V10 PREMIUM CLOSING SECTION
   ========================================================== */

.why-meed.v10 .title {
  font-size: 40px;
  font-weight: 800;
  color: #071A2F;
  margin-bottom: 16px;
  position: relative;
  display: inline-block;
}

.why-meed.v10 .title::after {
  content: "";
  width: 90px;
  height: 4px;
  background: #1FCF8C;
  border-radius: 4px;
  position: absolute;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
}

/* Subtitle */

.why-meed.v10 .subtitle {
  font-size: 18px;
  color: #3A4A5C;
  max-width: 850px;
  margin: 0 auto 50px auto;
  line-height: 1.65;
}

/* Grid */

.fade-up {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.65s cubic-bezier(.16,1,.3,1) forwards;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Tablet refinement */
@media (max-width: 1024px) {
  .why-meed.v10 .title { font-size: 34px; }
}

/* Mobile refinement */
@media (max-width: 600px) {
  .why-card { padding: 26px 20px; }
}

.section.why-meed-v10 .why-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    padding: 32px 26px !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.07) !important;
    position: relative !important;
}
/* ============================================
   FIX: Override legacy grid rules for WHY-MEED
   ============================================ */

section.why-meed-v10 .why-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    align-items: stretch !important;
    gap: 32px !important;
}

section.why-meed-v10 .why-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    padding: 32px 26px !important;
    background: #fff !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.07) !important;
}
/* FORCE ALL WHY-MEED CARDS TO MATCH TALLEST HEIGHT */

.section.why-meed-v10 .why-card {
    min-height: 360px !important; /* adjust until all cards visually match */
}

.section.why-meed-v10 .why-card.fade-up {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
}
/* FIX WHY-MEED CONTENT ALIGNMENT (REAL FIX) */

.section.why-meed-v10 .why-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* ensures content starts at same place */
    height: auto !important;
}

/* force paragraphs to occupy consistent space */

.section.why-meed-v10 .why-card p {
    min-height: 90px !important;  /* tune this number until cards look visually aligned */
}

/* ======================
   SECTION-SPECIFIC BLOCKS
   ====================== */

/* =========================================================
   AUP PAGE — CLEAN PREMIUM BUILD (FINAL)
   No hero styling — that lives in hero.css
========================================================= */

/* ===== Global Section Defaults ===== */

.centered-width {
  text-align: center;
}

/* ===== WHAT IS AUP ===== */

.feature-cards {
  display: grid;
  gap: 32px;
  text-align: left;
}

@media (min-width: 992px) {
  .feature-cards {
    grid-template-columns: repeat(4,1fr);
  }
}

.feature-card h4 {
  font-size: 18px;
  color: #0A2342;
  margin-bottom: 8px;
}

.feature-card p {
  font-size: 16px;
  color: #4A5A70;
}


/* ===== BANKS SECTION ===== */

.banks.dark-bg {
  background: #0B1D37;
  color: #C8D3E5;
  padding: 90px 0;
}

.bullet-light li {
  margin-left: 20px;
  line-height: 1.55;
}

.callout {
  margin-top: 40px;
  padding: 28px;
  background: rgba(255,255,255,0.07);
  border-radius: 16px;
  text-align: center;
}


/* ===== WORKFLOW (steps) ===== */

.workflow.light-bg {
  background: #F8FBFF;
  text-align: center;
}

.workflow-steps {
  display: grid;
  gap: 40px;
  margin-top: 32px;
}

@media (min-width: 992px) {
  .workflow-steps {
    grid-template-columns: repeat(4,1fr);
  }
}

.step-circle {
  display: inline-flex;
  width: 48px;
  height: 48px;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #26C281;
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
}


/* ===== WHAT CAN/CANNOT DO ===== */

.split-tiles.dark-bg {
  background: #07172A;
  color: #C8D3E5;
}

.tile {
  padding: 40px;
  border-radius: 14px;
}

.tile-light { background: rgba(255,255,255,0.08); }

.tile-dark { background: rgba(0,0,0,0.15); }

.tile h3 {
  color: #ffffff;
  margin-bottom: 12px;
}


/* ===== FINAL CTA ===== */

.cta-final.dark-bg {
  text-align: center;
  background: #0A1E34;
  padding: 100px 24px;
}

.aup-benefits-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 0 80px;
  text-align: center;
}

.aup-benefits-section h2 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 40px;
  color: #071A2F;
}

/* Card wrapper */

.aup-benefit-grid {
  display: flex;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: nowrap;
}

/* Card style */

.aup-benefit-card {
  flex: 1;
  background: #fff;
  border-radius: 16px;
  padding: 48px 32px;
  box-shadow: 0px 8px 32px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 340px;
}

/* Icon */

.aup-benefit-card img,

.aup-benefit-card svg {
  height: 48px;
  width: auto;
  margin-bottom: 20px;
}

/* Heading */

.aup-benefit-card h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 12px;
  color: #071A2F;
}

/* Body text */

.aup-benefit-card p {
  font-size: 16px;
  line-height: 1.48;
  max-width: 260px;
  color: #4F5B67;
}

/* MOBILE */
@media (max-width: 991px) {
  .aup-benefit-grid {
    flex-wrap: wrap;
  }
  .aup-benefit-card {
    width: 100%;
  }
}
/* =========================================
   WHAT AN AUP CAN DO FOR YOU — FINAL BUILD
========================================= */

.aup-benefits {
  background: #F6FAFF;
  padding: 80px 0 100px;
}

.aup-title {
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  color: #071A2F;
  margin: 0; 
}
	/* FORCE CENTERING OF SVG ICONS IN AUP CARDS */

.aup-card {
    text-align: center;              /* center h3 and p */
}

.aup-card svg {
    display: block;                  /* remove inline baseline spacing */
    margin: 0 auto 16px auto;        /* center the SVG horizontally */
}
/* FIX AUP CARD INTERNAL ALIGNMENT */

.aup-card {
    display: flex;
    flex-direction: column;
    align-items: center;      /* centers SVG + text together */
    text-align: center;
}

/* Ensure SVG visual centering */

.aup-card svg {
    display: block;
    margin: 0 auto 16px auto;
}

/* ============================================================
   BANKS SECTION — PREMIUM, CLEAN, BALANCED (FINAL VERSION)
   ============================================================ */

.banks.dark-bg {
    background: #0A1E34;                       /* richer premium navy */
    padding: 110px 0;
    color: #C8D3E5;
    display: grid;
    grid-template-columns: 1fr 420px;          /* text left, callout right */
    align-items: center;
    gap: 60px;
    border-radius: 28px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    max-width: 1280px;
    margin: 0 auto 90px auto;                  /* TRUE center + spacing */
    padding-left: 60px;
    padding-right: 60px;
}

.banks .content {
    max-width: 640px;
}

.banks p {
    font-size: 18px;
    line-height: 1.55;
    margin-bottom: 20px;
    color: #D9E3F2;
}

.bullet-light li {
    color: #E7EEFA;
    margin-left: 20px;
    margin-bottom: 10px;
}

/* Premium callout box */

.banks .callout {
    background: #FFFFFF;
    color: #0A1A2F;
    padding: 40px 32px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.12);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.45;
    text-align: center;
}

/* MOBILE */
@media (max-width: 900px) {
    .banks.dark-bg {
        grid-template-columns: 1fr;
        padding: 70px 24px;
    }
}
/* ===============================================
   BANKS SECTION — ULTRA PREMIUM BUILD (V2)
   =============================================== */

.banks.dark-bg {
    background: linear-gradient(135deg, #0A1A2F 0%, #0F2C4D 100%);
    padding: 110px 70px;
    border-radius: 22px;
    position: relative;
    display: grid;
    grid-template-columns: 58% 42%;
    gap: 50px;
    max-width: 1280px;
    margin: 0 auto 110px auto;
    box-shadow:
        0 28px 80px rgba(0,0,0,0.45),
        inset 0 0 18px rgba(255,255,255,0.06);
}

/* Subtle grain (optional — VERY premium look) */

.banks.dark-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/png;base64,iVBORw...") repeat;
    opacity: 0.04;
    pointer-events: none;
}

/* Left accent bar */

.banks.dark-bg::after {
    content: "";
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    width: 6px;
    background: #1FCF8C;
    border-radius: 6px;
    opacity: 0.9;
}

/* TEXT COLUMN */

.banks .content {
    padding-right: 20px;
}

.banks p {
    font-size: 19px;
    color: #DCE6F5;
    max-width: 600px;
    margin-bottom: 20px;
}

.bullet-light li {
    color: #ECF3FF;
    font-size: 17px;
    margin-bottom: 10px;
}

/* CALLOUT — NEW PREMIUM BLOCK */

.banks .callout {
    background: #ffffff;
    padding: 50px 40px;
    border-radius: 18px;
    font-size: 20px;
    line-height: 1.45;
    color: #0A1A2F;
    box-shadow:
        0 12px 40px rgba(0,0,0,0.18),
        inset 0 0 12px rgba(0,0,0,0.04);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}

/* MOBILE */
@media (max-width: 900px) {
    .banks.dark-bg {
        grid-template-columns: 1fr;
        padding: 70px 30px;
    }
    .banks.dark-bg::after {
        left: 0;
        top: 20px;
        bottom: 20px;
    }
}
/* ======================================================
   BANKS SECTION – PREMIUM GRAPHIC CALLOUT
   ====================================================== */

.bank-graphic-callout {
    background: #ffffff;
    padding: 32px 32px;
    border-radius: 20px;
    box-shadow:
        0 12px 40px rgba(0,0,0,0.18),
        inset 0 0 12px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
}

.bank-graphic-callout img {
    width: 100%;
    max-width: 380px;        /* PERFECT SIZE FOR BALANCE */
    height: auto;
    display: block;
}
    /* ======================================================
   BANKS SECTION — V3 PREMIUM REFINEMENT
   ====================================================== */

/* Fix unreadable body text (high contrast override) */

.banks.dark-bg p,

.banks.dark-bg .content p {
    color: #E8F1FF !important;   /* bright, readable */
}

/* Fix bullet readability + spacing */

.bullet-light li {
    color: #F2F7FF !important;
    font-size: 17px;
    margin-bottom: 10px;
}

/* Improve column proportions */

.banks.dark-bg {
    grid-template-columns: 60% 40%;   /* slightly wider text column */
    padding: 110px 70px;
}

/* Heading refinement */

.banks.dark-bg p {
    font-size: 19px;
    line-height: 1.55;
    margin-bottom: 18px;
    max-width: 680px;
}

/* Image callout refinement */

.bank-graphic-callout {
    background: #ffffff;
    padding: 28px 28px;
    border-radius: 18px;
    box-shadow:
        0 16px 45px rgba(0,0,0,0.22),
        inset 0 0 10px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
}

.bank-graphic-callout img {
    width: 100%;
    max-width: 360px;  /* slightly smaller = better balance */
    border-radius: 6px;
}

/* Add subtle premium glow around the navy card */

.banks.dark-bg {
    box-shadow:
        0 30px 70px rgba(0,0,0,0.42),
        inset 0 0 18px rgba(255,255,255,0.05);
    border-radius: 20px;
}

/* Optional: increase column gap */

.banks.dark-bg {
    gap: 70px;
}

/* Mobile refinement */
@media (max-width: 900px) {
    .banks.dark-bg {
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 60px 24px;
    }
    .bank-graphic-callout img {
        max-width: 300px;
    }
}

/* Mobile adjustments */
@media (max-width: 900px) {
    .bank-graphic-callout {
        padding: 24px;
    }
    .bank-graphic-callout img {
        max-width: 320px;
    }
}
/* ======================================================
   BANKS SECTION — V3 PREMIUM REFINEMENT
   ====================================================== */

/* Fix unreadable body text (high contrast override) */

.banks.dark-bg p,

.banks.dark-bg .content p {
    color: #E8F1FF !important;   /* bright, readable */
}

/* Fix bullet readability + spacing */

.bullet-light li {
    color: #F2F7FF !important;
    font-size: 17px;
    margin-bottom: 10px;
}

/* Improve column proportions */

.banks.dark-bg {
    grid-template-columns: 60% 40%;   /* slightly wider text column */
    padding: 110px 70px;
}

/* Heading refinement */

.banks.dark-bg p {
    font-size: 19px;
    line-height: 1.55;
    margin-bottom: 18px;
    max-width: 680px;
}

/* Image callout refinement */

.bank-graphic-callout {
    background: #ffffff;
    padding: 28px 28px;
    border-radius: 18px;
    box-shadow:
        0 16px 45px rgba(0,0,0,0.22),
        inset 0 0 10px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
}

.bank-graphic-callout img {
    width: 100%;
    max-width: 360px;  /* slightly smaller = better balance */
    border-radius: 6px;
}

/* Add subtle premium glow around the navy card */

.banks.dark-bg {
    box-shadow:
        0 30px 70px rgba(0,0,0,0.42),
        inset 0 0 18px rgba(255,255,255,0.05);
    border-radius: 20px;
}

/* Optional: increase column gap */

.banks.dark-bg {
    gap: 70px;
}

/* Mobile refinement */
@media (max-width: 900px) {
    .banks.dark-bg {
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 60px 24px;
    }
    .bank-graphic-callout img {
        max-width: 300px;
    }
}
/* ======================================================
   BANKS SECTION — V4 TITLE ACCENT
   ====================================================== */

.banks.dark-bg {
    position: relative;
    overflow: hidden;
}

/* Large soft radial highlight behind text */

.banks.dark-bg::before {
    content: "";
    position: absolute;
    top: -120px;
    left: -120px;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle,
        rgba(255,255,255,0.12) 0%,
        rgba(255,255,255,0) 70%);
    pointer-events: none;
    filter: blur(40px);
}

/* Glow on the green accent bar */

.banks.dark-bg::after {
    box-shadow: 0 0 18px rgba(31,207,140,0.65);
}

/* Fade-up animation for the right-hand graphic */

.bank-graphic-callout {
    opacity: 0;
    transform: translateY(18px);
    animation: bankCalloutIn 0.9s cubic-bezier(.16,1,.3,1) forwards;
    animation-delay: 0.15s;
}

@keyframes bankCalloutIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Slight lift on hover (elite detail) */

.bank-graphic-callout:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 50px rgba(0,0,0,0.26),
        inset 0 0 14px rgba(0,0,0,0.06);
    transition: 0.25s ease;
}

/* Title glow background for hierarchy */

.banks.dark-bg {
    opacity: 0;
    animation: banksPanelIn 0.8s cubic-bezier(.16,1,.3,1) forwards;
}

@keyframes banksPanelIn {
    to { opacity: 1; }
}
/* ==========================================================
   PREMIUM AUP COMPARISON TABLE (Professional Build)
   ========================================================== */

.capability-compare {
    max-width: 1280px;
    margin: 0 auto 90px auto;
    text-align: center;
}

.compare-title {
    font-size: 36px;
    font-weight: 800;
    color: #071A2F;
    margin-bottom: 40px;
}

/* Table layout */

.compare-table {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}
/* Shared column styling */

.compare-col {
    background: #0B1D37;
    border-radius: 18px;
    padding: 40px 36px;
    box-shadow: 0 18px 40px rgba(0,0,0,0.30);
    color: #E6EEF7;
    text-align: left;
    position: relative;
    overflow: hidden;
}

/* Light column */

.compare-col.can-do {
    background: linear-gradient(145deg, #122741, #0E2036);
}

/* Darker column */

.compare-col.cannot-do {
    background: linear-gradient(145deg, #091523, #0B1A2D);
}

/* Column headers */

.compare-col h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #FFFFFF;
}

/* List styling */

.compare-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.compare-col ul li {
    margin-bottom: 12px;
    padding-left: 20px;
    position: relative;
    font-size: 17px;
    line-height: 1.55;
}

/* Custom bullet */

.compare-col ul li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 2px;
    color: #1FCF8C; /* MEED green */
    font-size: 22px;
}

/* Mobile stack */
@media (max-width: 900px) {
    .compare-table {
        grid-template-columns: 1fr;
    }
}
/* ======================================================
   V4/V5 ELITE PREMIUM COMPARISON MODULE
   ====================================================== */

.capability-compare {
    max-width: 1280px;
    margin: 0 auto 110px auto;
    text-align: center;
}

/* Title with MEED-green accent underline */

.compare-title {
    font-size: 40px;
    font-weight: 800;
    color: #071A2F;
    margin-bottom: 48px;
    display: inline-block;
    position: relative;
}

.compare-title::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    width: 90px;
    height: 4px;
    background: #1FCF8C;
    border-radius: 4px;
    transform: translateX(-50%);
}

/* Grid layout */

.compare-table {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    align-items: stretch;
}

/* Base styling for columns */

.compare-col {
    background: linear-gradient(145deg, #0C1F37, #061221);
    border-radius: 22px;
    padding: 42px 36px;
    color: #E9F1FF;
    box-shadow: 
        0 24px 45px rgba(0,0,0,0.32),
        inset 0 0 16px rgba(255,255,255,0.04);
    position: relative;
}

/* Premium header layout */

.compare-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.compare-header h3 {
    font-size: 22px;
    font-weight: 700;
    margin: 0;
}

/* MEED Green Check Icon */

.compare-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.compare-col ul li {
    margin-bottom: 14px;
    line-height: 1.55;
    font-size: 17px;
    padding-left: 24px;
    position: relative;
}

/* subtle MEED-green bullets for Can Do */

.can-do ul li::before {
    content: "•";
    position: absolute;
    left: 6px;
    top: 3px;
    color: #1FCF8C;
    font-size: 22px;
}

/* red bullets for Cannot Do */

.cannot-do ul li::before {
    content: "•";
    position: absolute;
    left: 6px;
    top: 3px;
    color: #FF5555;
    font-size: 22px;
}

/* V5 separator line between columns */

.compare-table::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(255,255,255,0.08);
    transform: translateX(-50%);
}

/* Hover lift for V5 premium interactivity */

.compare-col:hover {
    transform: translateY(-6px);
    transition: 0.25s ease;
    box-shadow:
        0 32px 60px rgba(0,0,0,0.40),
        inset 0 0 18px rgba(255,255,255,0.05);
}

/* Mobile stack */
@media (max-width: 900px) {
    .compare-table {
        grid-template-columns: 1fr;
    }
    .compare-table::after {
        display: none;
    }
}
/* ==========================================================
   HOW ORGANIZATIONS USE AUPs — PREMIUM SECTION
   ========================================================== */

.aup-usecases {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.aup-usecases .intro {
  font-size: 18px;
  color: #3A4A5C;
  max-width: 900px;
  margin: 0 auto 50px auto;
}

.usecase-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 36px;
}

.usecase-card {
  background: #FFFFFF;
  border-radius: 20px;
  padding: 32px 28px;
  text-align: left;
  box-shadow: 0 18px 45px rgba(0,0,0,0.08);
  transition: 0.25s ease;
}

.usecase-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 60px rgba(0,0,0,0.12);
}

.usecase-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: #071A2F;
  margin-bottom: 12px;
}

.usecase-card p {
  font-size: 16px;
  color: #4A5A70;
  margin-bottom: 18px;
}

.usecase-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.usecase-card ul li {
  margin-bottom: 10px;
  padding-left: 18px;
  position: relative;
  font-size: 15px;
  color: #334155;
}

.usecase-card ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: #1FCF8C;
  font-size: 22px;
}
/* ==========================================================
   V10 ULTRA-PREMIUM AUP USE-CASE SECTION
   Deloitte / BCG / Stripe-level design system
   ========================================================== */

.aup-usecases.v10 {
  max-width: 1280px;
  margin: 0 auto 120px auto;
  text-align: center;
  padding: 0 24px;
}

/* Section Title */

.aup-usecases.v10 .intro {
  font-size: 18px;
  color: #3A4A5C;
  max-width: 880px;
  margin: 0 auto 60px auto;
  line-height: 1.65;
}

/* Grid Layout */

.usecase-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 40px;
}

/* Card Container */

.usecase-card {
  background: #FFFFFF;
  border-radius: 22px;
  padding: 36px 30px 40px;
  text-align: left;
  box-shadow: 
    0 18px 40px rgba(0,0,0,0.08),
    inset 0 0 14px rgba(255,255,255,0.03);
  transition: 0.25s ease;
  position: relative;
  overflow: hidden;
}

/* Hover Micro-Interaction */

.usecase-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 26px 60px rgba(0,0,0,0.12),
    inset 0 0 16px rgba(255,255,255,0.04);
}

/* Icon Above Title */

.usecase-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
}

.usecase-icon img {
  width: 100%;
  height: auto;
  opacity: 0.92;
}

/* Card Title */

.usecase-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: #071A2F;
  margin-bottom: 10px;
}

/* Description */

.usecase-card p {
  font-size: 16px;
  color: #4A5A70;
  margin-bottom: 18px;
  line-height: 1.55;
}

/* Bullet List */

.usecase-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.usecase-card ul li {
  margin-bottom: 12px;
  padding-left: 20px;
  position: relative;
  font-size: 15px;
  color: #334155;
}

.usecase-card ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: #1FCF8C;
  font-size: 22px;
}

/* Fade-Up Animation */

.why-meed.v10 {
  max-width: 1280px;
  margin: 0 auto 120px auto;
  text-align: center;
  padding: 0 24px;
}

/* Title */

.why-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 36px;
}

/* Individual Card */

.why-card {
  background: #FFFFFF;
  padding: 34px 28px 40px;
  border-radius: 20px;
  text-align: left;
  box-shadow: 0 18px 40px rgba(0,0,0,0.08);
  transition: 0.25s ease;
  position: relative;
}

.why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 60px rgba(0,0,0,0.12);
}

/* Icon */

.why-icon {
  width: 46px;
  margin-bottom: 16px;
}

.why-icon img {
  width: 100%;
  opacity: 0.95;
}

/* Heading */

.why-card h3 {
  font-size: 20px;
  font-weight: 700;
  color: #071A2F;
  margin-bottom: 10px;
}

/* Body Text */

.why-card p {
  font-size: 16px;
  line-height: 1.6;
  color: #4A5A70;
}

/* Fade-up animation */

.cta-hero-final {
  position: relative;
  background: linear-gradient(135deg, #0A1E34 0%, #071A2A 100%);
  padding: 110px 24px;
  text-align: center;
  overflow: hidden;
  border-radius: 20px;
  max-width: 1280px;
  margin: 90px auto 120px auto;
  box-shadow: 
      0 30px 70px rgba(0,0,0,0.40),
      inset 0 0 30px rgba(255,255,255,0.05);
}

/* Subtle premium background glow */

.cta-hero-final::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,0.10), transparent 70%);
  opacity: 0.25;
  pointer-events: none;
}

.cta-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}

.cta-hero-inner h2 {
  font-size: 40px;
  font-weight: 800;
  color: #FFFFFF;
  margin-bottom: 18px;
}

.cta-hero-inner p {
  font-size: 20px;
  line-height: 1.6;
  color: #D8E6F7;
  margin-bottom: 36px;
}

.cta-hero-btn {
  display: inline-block;
  background: #1FCF8C;
  color: #FFFFFF;
  padding: 16px 40px;
  font-size: 18px;
  font-weight: 700;
  border-radius: 50px;
  transition: all 0.25s ease;
  box-shadow: 0 6px 16px rgba(31,207,140,0.45);
}

.cta-hero-btn:hover {
  background: #19B879;
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(31,207,140,0.55);
}

/* Mobile refinements */
@media (max-width: 768px) {
  .cta-hero-inner h2 {
    font-size: 32px;
  }
  .cta-hero-inner p {
    font-size: 18px;
  }
  .cta-hero-final {
    padding: 80px 20px;
  }
}
/* ==========================================================
   CTA HERO — PREMIUM MEED ACCENT STRIPE
   ========================================================== */

.cta-hero-final {
  position: relative;
}

/* Vertical MEED-green accent bar */

.cta-hero-final::after {
  content: "";
  position: absolute;
  left: 0;
  top: 30px;
  bottom: 30px;
  width: 6px;
  background: #1FCF8C;
  border-radius: 6px;
  box-shadow: 
      0 0 18px rgba(31, 207, 140, 0.55),
      0 0 28px rgba(31, 207, 140, 0.35);
  opacity: 0.95;
  z-index: 3;
}
/* Body copy */

.cta-hero-final p {
  font-size: 20px;
  max-width: 800px;
  margin: 0 auto 28px;
  color: #F3F9FF !important;
  line-height: 1.6;
  opacity: 1;
  font-weight: 400;
}
/* Ensure CTA content stays above everything */

.cta-hero-inner {
  position: relative;
  z-index: 4;
}

/* Mobile refinement (shorter stripe, lighter glow) */
@media (max-width: 768px) {
  .cta-hero-final::after {
    top: 20px;
    bottom: 20px;
    width: 5px;
    box-shadow: 
        0 0 12px rgba(31, 207, 140, 0.45),
        0 0 20px rgba(31, 207, 140, 0.25);
  }
}
/* Increase breathing room under headline */

.cta-hero-inner h2 {
  margin-bottom: 22px; /* was 18 */
}

/* Soften CTA text paragraph */

.cta-hero-inner p {
  margin-bottom: 32px; /* slightly less spacing = balanced */
  opacity: 0.95;        /* improves readability on navy */
}

/* REFINE BUTTON – reduce glow, more premium */

.cta-hero-btn {
  background: #1FCF8C;
  box-shadow: 
      0 4px 12px rgba(31, 207, 140, 0.25), /* soft shadow */
      0 0 0 rgba(31, 207, 140, 0);         /* removed neon glow */
  transition: all .25s ease;
}

/* Hover effect – elegant, subtle, professional */

.cta-hero-btn:hover {
  transform: translateY(-3px);
  box-shadow:
      0 6px 18px rgba(31, 207, 140, 0.28), /* soft lift */
      0 0 12px rgba(31, 207, 140, 0.22);   /* subtle glow, not loud */
}

.cta-hero-btn {
  border: 1px solid rgba(255,255,255,0.18);
}

/* UNIVERSAL MEED PAGE WRAPPER */

.meed-section {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 24px;
}

/* UNIVERSAL CENTER CONTAINER */

.meed-container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

/* UNIFIED PREMIUM CARD */

.meed-card {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 34px 28px;
    box-shadow: 0 18px 40px rgba(0,0,0,0.08);
    transition: 0.25s ease;
}

.meed-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 26px 60px rgba(0,0,0,0.12);
}

/* PREMIUM HEADLINE */

.meed-title {
    font-size: 40px;
    font-weight: 800;
    text-align: center;
    color: #071A2F;
    margin-bottom: 18px;
    position: relative;
}

.meed-title::after {
    content: "";
    width: 90px;
    height: 4px;
    background: #1FCF8C;
    border-radius: 4px;
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
}

/* SUBTITLE */

.meed-subtitle {
    font-size: 18px;
    color: #3A4A5C;
    max-width: 850px;
    margin: 0 auto 48px auto;
    line-height: 1.65;
}
/* FIX: Add spacing between AUP section title and 4 benefit cards */

.aup-benefits h2,

.aup-benefits .meed-title,

.aup-benefits h2::after,

.aup-benefits .meed-title::after {
    bottom: -16px !important;
}

.aup-benefits .meed-subtitle {
    margin-bottom: 56px !important;
}
/* Fix: keep comparison separator line inside the module
   (stops the faint vertical line through the hero) */

.compare-table {
  position: relative;
}
/* Premium spacing under main section titles */

.centered-width h2,

.aup-benefits h2,

.aup-usecases h2,

.capability-compare h2,

.why-meed h2 {
    margin-bottom: 42px !important;
}

/* Lower underline so it doesn't collide with cards */

.centered-width h2::after,

.aup-benefits h2::after,

.aup-usecases h2::after,

.capability-compare h2::after,

.why-meed h2::after {
    bottom: -16px !important;
}

.subtext,

.centered-width p {
    margin-bottom: 55px !important;
}
/* Universal premium card polish for AUP page */

.aup-card,

.usecase-card,

.workflow-steps > div,

.why-card,

.compare-col {
    padding: 32px 26px !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.07) !important;
    transition: 0.25s ease !important;
}

.aup-card:hover,

.usecase-card:hover,

.workflow-steps > div:hover,


.why-card:hover,

.compare-col:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(0,0,0,0.12) !important;
}
/* Additional spacing under 'What an AUP Can Do' title */

.aup-benefits {
    margin-top: 50px !important;
}
/* Improve alignment in Banks section */

.banks {
    display: flex;
    align-items: center;
    gap: 40px !important;
}

.banks .content {
    flex: 1 1 55%;
}

.banks .bank-graphic-callout {
    flex: 1 1 45%;
}
/* Equalize card heights in Why MEED */

.why-grid {
    align-items: stretch !important;
}

.why-card {
    height: 100% !important;
}
/* Workflow circles centered + spacing improved */

.step-circle {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #1FCF8C;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 12px auto;
}
/* ============================================
   FIX: Why MEED card alignment + equal heights
   ============================================ */

/* Force all cards in the Why MEED grid to match height */

.why-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 32px;
    align-items: stretch !important; /* key fix */
}

/* Each card fills full height so grid aligns evenly */

.why-card {
    height: 100% !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 32px 26px !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.07) !important;
    background: #fff;
}

/* Improve text spacing inside cards */

.why-card h3,

.why-card h4 {
    margin-bottom: 12px !important;
}

/* Optional: premium hover for consistency with other cards */

.why-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(0,0,0,0.12) !important;
}
/* ==============================
   What Is an Agreed-Upon Procedures Engagement? — Premium Styling
============================== */

/* ================================
   Premium AUP Section Styling
================================ */

.aup-section {
  padding: 120px 20px;
  background: #ffffff;
}

.aup-wrapper {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.aup-heading {
  font-size: 2.6rem;
  font-weight: 800;
  color: #0A1F33;
  letter-spacing: -0.5px;
  margin-bottom: 12px;
}

.aup-accent {
  width: 90px;
  height: 4px;
  background: #1FA779;
  margin: 0 auto 40px;
  border-radius: 2px;
}

.aup-sublead {
  font-size: 1.35rem;
  line-height: 1.8;
  color: #394B5A;
  margin-bottom: 28px;
}

.aup-highlight {
  color: #0A1F33;
  font-weight: 700;
}

.aup-text {
  font-size: 1.18rem;
  color: #425466;
  line-height: 1.75;
  margin-bottom: 50px;
}

.aup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin-bottom: 55px;
}

.aup-card {
  background: #F7FBFD;
  padding: 22px 20px;
  border: 1px solid #E4EEF3;
  border-radius: 10px;
  font-size: 1.05rem;
  color: #0F253A;
  line-height: 1.55;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.aup-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}

.aup-closing {
  font-size: 1.2rem;
  color: #334559;
  margin-bottom: 18px;
  line-height: 1.7;
}

.aup-tagline {
  font-size: 1.35rem;
  font-weight: 700;
  color: #0A1F33;
}
/* ============================================================
   WHAT IS AN AUP — ULTRA-PREMIUM VISUAL UPGRADE (FINAL)
   This override is safe and aligns with meed-framework.css
   ============================================================ */

/* Tighten readable column width */
.aup-hero .aup-container {
    max-width: 880px;
}

/* Title spacing refinement */
.aup-hero .aup-title {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 22px;
}

/* Green underline perfected */
.aup-hero .aup-divider {
    width: 86px;
    height: 4px;
    background: #1FCF8C;
    border-radius: 4px;
    margin: 0 auto 42px auto;
}

/* Lead paragraph refinement */
.aup-hero .aup-lead {
    font-size: 20px;
    line-height: 1.7;
    color: #3A4A5C;
    margin-bottom: 26px;
    max-width: 760px;
}

/* Secondary paragraph spacing */
.aup-hero .aup-body {
    font-size: 18px;
    line-height: 1.65;
    color: #465467;
    max-width: 760px;
    margin: 0 auto 48px auto;
}

/* ------------------------------
   CARD GRID — MATCH LAYOUT IN YOUR SCREENSHOT
   ------------------------------ */

.aup-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
    gap: 28px 34px;
    max-width: 1000px;
    margin: 0 auto 60px auto;
}

/* Card visual polish */
.aup-grid .aup-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 28px 24px;
    box-shadow: 0 10px 28px rgba(0,0,0,0.06);
    text-align: center;
    transition: 0.25s ease;
}

/* Hover lift */
.aup-grid .aup-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}

/* Heading in cards */
.aup-grid .aup-card h4 {
    font-size: 18px;
    font-weight: 700;
    color: #071A2F;
    margin-bottom: 10px;
}

/* Paragraph inside cards */
.aup-grid .aup-card p {
    font-size: 15px;
    line-height: 1.55;
    color: #42515F;
}

/* ------------------------------
   CLOSING STATEMENT — PREMIUM LOOK
   ------------------------------ */

.aup-tagline-final {
  font-size: 20px;
  font-weight: 650;
  line-height: 1.35;
  text-align: center;
  margin: 28px auto 56px; /* <-- adds clean separation after tagline */
  color: #2A3B4F;
  opacity: 0.96;
  max-width: 760px;
}

.aup-tagline-final span {
    display: inline-block;
    margin-top: 6px;
    font-size: 22px;
    font-weight: 800;
    color: #071A2F;
    letter-spacing: -0.3px;
}
/* ============================================================
   AUP — WHAT IS AN AGREED-UPON PROCEDURES ENGAGEMENT (FIX BLOCK)
   Styling Only — No Content Changes
   ============================================================ */

/* Tighter, premium max-width for paragraphs */
.aup-hero .aup-container {
    max-width: 860px;
    margin: 0 auto;
    text-align: center;
}

/* Title fix: size, weight, spacing */
.aup-hero .aup-title {
    font-size: 42px;
    font-weight: 800;
    letter-spacing: -0.4px;
    margin-bottom: 14px;
    color: #071A2F;
}

/* Underline refinement */
.aup-hero .aup-divider {
    width: 86px;
    height: 4px;
    background: #1FCF8C;
    border-radius: 4px;
    margin: 0 auto 34px auto;
}

/* Premium paragraph spacing & color */
.aup-hero .aup-lead {
    font-size: 19px;
    line-height: 1.65;
    color: #334155;
    max-width: 780px;
    margin: 0 auto 22px auto;
}

.aup-hero .aup-body {
    font-size: 18px;
    line-height: 1.65;
    color: #475569;
    max-width: 760px;
    margin: 0 auto 40px auto;
}

/* GRID FIX — matches screenshot EXACTLY */
.aup-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 28px 34px !important;
    max-width: 1080px;
    margin: 0 auto 60px auto !important;
}

/* CARD FIX — Premium weight, shadow, balance */
.aup-card {
    background: #FFFFFF !important;
    border-radius: 16px !important;
    padding: 28px 24px !important;
    text-align: center !important;
    box-shadow: 0 12px 28px rgba(0,0,0,0.06) !important;
    border: none !important;
    transition: all .25s ease !important;
}

/* Hover effect (premium lift) */
.aup-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 20px 48px rgba(0,0,0,0.12) !important;
}

/* Card headings */
.aup-card h4 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #071A2F !important;
    margin-bottom: 10px !important;
}

/* Card text */
.aup-card p {
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #475569 !important;
}

/* Closing statement styling */
.aup-tagline-final {
    font-size: 18px !important;
    color: #334155 !important;
    margin-top: 10px !important;
    opacity: 0.95;
}

.aup-tagline-final span {
    display: block;
    margin-top: 6px;
    color: #071A2F !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.25px;
}


h2.title,
.aup-title,
.compare-title {
    margin-bottom: 34px !important;
}

h2.title::after,
.aup-title::after,
.compare-title::after {
    bottom: -14px !important;
}

/* Tighter readable line width */
p,
.intro,
.subtitle,
.aup-lead,
.aup-body {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
/* ================================
   WHAT IS AUP — FIXES
================================ */
.aup-hero .aup-container {
    max-width: 900px !important;
}

.aup-hero .aup-lead {
    margin-bottom: 16px !important;
}

.aup-hero .aup-body {
    margin-bottom: 34px !important;
}

.aup-grid {
    row-gap: 34px !important;
}

.aup-grid .aup-card {
    min-height: 150px !important;
}
/* Ensure equal height and better alignment */
.aup-benefit-grid .aup-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    height: 100% !important;
}

/* Fix SVG vertical centering */
.aup-card svg {
    margin-bottom: 18px !important;
}

/* Increase spacing under section title */
.aup-benefits h2 {
    margin-bottom: 42px !important;
}
/* Stronger cohesion with earlier card sets */
.usecase-card {
    box-shadow: 0 16px 40px rgba(0,0,0,0.08) !important;
    padding: 34px 28px !important;
}

.aup-usecases.v10 {
    margin-bottom: 80px !important;
}
/* Reduce brightness of glow and fix underline alignment */
.banks.dark-bg::before {
    opacity: 0.06 !important;
}

.banks.dark-bg::after {
    width: 5px !important;
    left: 10px !important;
}

.bank-graphic-callout img {
    max-width: 340px !important;
}
.workflow-steps > div {
    padding-top: 26px !important;
    padding-bottom: 26px !important;
}

.step-circle {
    margin-bottom: 10px !important;
}
/* Fix center divider alignment */
.compare-table {
    position: relative !important;
}

.compare-table::after {
    left: 50% !important;
    opacity: 0.12 !important;
}

/* Correct padding imbalance */
.compare-col {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
}
.why-grid .why-card {
    height: 100% !important;
    padding: 32px 26px !important;
}

.why-grid .why-card p {
    min-height: 86px !important;
}
/* Prevent accent stripe from touching edges */
.cta-hero-final::after {
    top: 40px !important;
    bottom: 40px !important;
}

/* Stronger button presence */
.cta-hero-btn {
    box-shadow: 0 6px 20px rgba(31,207,140,0.40) !important;
}
.workflow-wrapper {
    max-width: 1100px;
    margin: 0 auto;
}
/* Comparison clarification note (below both cards) */
.aup-compare-note {
  margin-top: 28px;
  font-size: 15.5px;
  line-height: 1.6;
  color: #5A6B7F;
  text-align: center;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* Inline assurance link */
.aup-compare-note .inline-action {
  color: #1FCF8C;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(31, 207, 140, 0.35);
  transition: color 0.2s ease, border-color 0.2s ease;
}

.aup-compare-note .inline-action:hover {
  color: #19B879;
  border-bottom-color: rgba(25, 184, 121, 0.6);
}
.premium-note {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid rgba(10,35,66,0.08);
  font-size: 16px;
  color: #334155;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.premium-note .inline-action {
  font-weight: 600;
}
/* =========================================================
   AUP — FIX BROKEN GRID SELECTORS (500k stability pass)
   ========================================================= */

/* Benefits section spacing */
.aup-benefits {
  padding: 84px 0;
  background: #F7FAFF;
}

.aup-benefits .aup-title {
  text-align: center;
  font-size: 34px;
  font-weight: 800;
  color: #071A2F;
  margin: 0 0 26px;
}

/* Benefits grid (4-up desktop, responsive down) */
.aup-benefit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}

@media (max-width: 1100px) {
  .aup-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .aup-benefit-grid { grid-template-columns: 1fr; }
}

/* Ensure cards feel consistent & premium */
.aup-benefit-grid .aup-card {
  height: 100%;
  background: #ffffff;
  border-radius: 16px;
  padding: 22px 18px;
  box-shadow: 0 10px 26px rgba(7, 26, 47, 0.08);
  border: 1px solid rgba(7, 26, 47, 0.08);
  text-align: center;
}

.aup-benefit-grid .aup-card h3 {
  margin: 12px 0 8px;
  font-size: 16px;
  font-weight: 800;
  color: #071A2F;
}

.aup-benefit-grid .aup-card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: #4A5A70;
}

/* Why MEED grid: only target the grid, not headings */
section.why-meed.v10 .why-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}

@media (max-width: 1100px) {
  section.why-meed.v10 .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  section.why-meed.v10 .why-grid { grid-template-columns: 1fr; }
}

section.why-meed.v10 .why-card {
  height: 100%;
}
/* =========================================================
   AUP PAGE — SPACING FIX AFTER TAGLINE (500k rhythm pass)
   Paste at VERY BOTTOM of aup.css
========================================================= */

/* Tighten the end of the "What Is an AUP" section */
.aup-hero {
  padding-bottom: 56px !important;
}

/* Remove the “floating” extra space under the closing line */
.aup-tagline-final {
  margin: 22px auto 34px auto !important; /* was effectively larger due to global section padding */
}

/* Divider should not create a big gap */
.section-divider {
  margin: 0 !important;
}

/* Next section should not feel pushed down */
.content-section.alt {
  padding-top: 72px !important;
}
/* =========================================================
   AUP PAGE — RHYTHM FIX (after “AUP Reports Deliver Them.”)
   Paste at VERY BOTTOM of aup.css
   ========================================================= */

/* Ensure the closing tagline doesn’t create extra vertical slack */
.aup-tagline-final{
  margin-top: 16px;
  margin-bottom: 0;
}

/* Give the AUP hero section a controlled bottom pad (prevents “floaty gap” feel) */
.aup-hero{
  padding-bottom: 52px;
}

/* IMPORTANT: shrink ONLY the divider that immediately follows the AUP hero */
.aup-hero + .section-divider{
  height: 26px;
  margin: 0;
}
/* =========================================================
   AUP PAGE — SECTION CONSISTENCY (optional, safe)
   ========================================================= */

/* Normalize spacing between your major section headings on this page */
.section.aup-usecases.v10,
.section.centered-width,
.section.workflow.light-bg,
.section.capability-compare,
.section.why-meed.v10{
  margin-top: 0;
  padding-top: 64px;
  padding-bottom: 64px;
}

/* Keep headings from feeling “tight” against cards */
.section.aup-usecases.v10 .title,
.section.centered-width .title,
.section.workflow.light-bg .title,
.section.capability-compare .compare-title,
.section.why-meed.v10 .title{
  margin-bottom: 18px;
}
