/* ==========================================================================
   FinishMyClass.us - Clearbit Enterprise SaaS Figma Design System Stylesheet
   Palette: Deep Navy (#26325F / #33366D / #343668), Slate Copy (#6C7192),
            Muted Metadata (#B2BAD4), Indigo Action (#4822DC -> #4566F2),
            Pure White Surfaces (#FFFFFF) & Cool Airy Gradients (#F4F7FC -> #FFFFFF)
   Typography: 'Inter' (Headings 700, Body 400, UI 500/600)
   ========================================================================== */

:root {
  /* Core Figma Design System Color Tokens */
  --primary: #4822DC;
  --primarytint: #4566F2;
  --secondary: #FFFFFF;
  --secondarytint: #F4F7FC;
  --accent: #FF6438;
  --accenttint: #FFF7F4;
  --titlelight: #33366D;
  --descriptionlight: #6C7192;
  --titledark: #FFFFFF;
  --descriptiondark: #B2BAD4;
  --textalt: #FFFFFF;
  --bglight1: #FFFFFF;
  --bglight2: #F4F7FC;
  --bgdark1: #26325F;
  --bgdark2: #33366D;
  --backgroundalt: #4822DC;
  --neutral: #E9EDF4;
  --neutrallight: #E9EDF4;
  --neutraldark: rgba(255, 255, 255, 0.14);
  --spark: rgba(255, 255, 255, 0.2);
  --glow: rgba(40, 62, 114, 0.13);
  --color-primary-text: #ffffff;
  --color-primary-text-exported: #FFFFFF;
  --color-secondary-text: #33366D;

  /* Mapped Component Tokens */
  --primary-navy: #26325F;
  --primary-dark: #33366D;
  --accent-blue: #4822DC;
  --accent-blue-hover: #4566F2;
  --accent-blue-active: #3518B0;
  --accent-blue-container: #F4F7FC;
  --accent-emerald: #56A87B;
  --accent-emerald-dark: #268E57;
  --accent-emerald-container: #EBF9F1;
  --surface-white: #FFFFFF;
  --surface-ice: #F4F7FC;
  --surface-card: #FFFFFF;
  --surface-dark: #26325F;
  --border-light: #E9EDF4;
  --border-focus: #4822DC;
  --text-main: #33366D;
  --text-muted: #6C7192;
  --text-light: #FFFFFF;

  /* Figma Inter Typography Scale & Families */
  --uc-heading-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --uc-body-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --uc-size-heading-xs: 20px;
  --uc-size-heading-sm: 28px;
  --uc-size-heading-md: 36px;
  --uc-size-heading-lg: 44px;
  --uc-size-heading-xl: 56px;
  --uc-size-heading-2xl: 76px;
  --uc-size-body-sm: 13px;
  --uc-size-body-md: 16px;
  --uc-size-body-lg: 18px;
  --uc-size-body-xl: 21px;
  --uc-heading-weight: 700;
  --uc-heading-tracking: -0.02em;
  --uc-heading-leading: 1.21;
  --uc-body-weight: 400;
  --uc-body-leading: 1.45;

  /* Figma Dimensions, Radii & Soft Indigo-Slate Shadows */
  --border-width-full: 1px;
  --Button-radius-xxs: 9px;
  --card-radius-xs: 5px;
  --card-radius-sm: 6px;
  --card-radius-full: 9999px;
  --badge-radius-full: 5px;
  --radius-sm: 5px;
  --radius-md: 6px;
  --radius-lg: 9px;
  --radius-full: 9999px;

  --shadow-card-offset: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  --shadow-card-offset-primary: 0px 18px 36px 0px rgba(40, 62, 114, 0.15), 0px 8px 10px 0px rgba(106, 124, 185, 0.18);
  --shadow-card-offset-sm: 0px 10px 20px 0px rgba(77, 96, 155, 0.08), 0px 4px 6px 0px rgba(106, 124, 185, 0.11);
  --shadow-btn-offset: 0px 8px 18px 0px rgba(72, 34, 220, 0.22);
  --shadow-soft: 0px 14px 36px 0px rgba(40, 62, 114, 0.11);
  --shadow-soft-hover: 0px 20px 42px 0px rgba(40, 62, 114, 0.16);
  --mui-elevation-1: var(--shadow-card-offset);
  --transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Keyframe Animations */
@keyframes fade-up {
  0% {
    opacity: 0.01;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ping {
  75%, to {
    opacity: 0;
    transform: scale(2.1);
  }
}

/* ==========================================================================
   Reset & Global Base
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  font-size: 16px;
  overflow-x: hidden;
}

body {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-weight: 400;
  color: #6C7192;
  background-color: #FFFFFF;
  line-height: 1.45;
  overflow-x: hidden;
  max-width: 100vw;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.21;
  color: #33366D;
  overflow-wrap: break-word;
}

img, svg {
  display: block;
  max-width: 100%;
}

button, input, select, textarea {
  font: inherit;
}

a {
  color: #4822DC;
  text-decoration: none;
  text-underline-offset: 4px;
  transition: var(--transition);
}

a:hover {
  color: #4566F2;
}

/* ==========================================================================
   Layout Containers & Section Surfaces
   ========================================================================== */
.container {
  width: 100%;
  max-width: 1132px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.section {
  padding: 96px 0;
  background: radial-gradient(circle at 43% 43%, rgba(239, 243, 250, 1) 0%, rgba(250, 252, 253, 1) 100%);
  position: relative;
}

/* Core Web Vitals Optimization: Defer rendering of offscreen sections until scrolled near */
#how-it-works,
#lms-platforms,
#academic-subjects,
#privacy-protocol,
#zero-ai-standard,
#proctored-exams,
#grade-guarantee,
#comparison,
#case-studies,
#pricing-calculator,
#faq,
#emergency-rescue,
#contact-cta,
.site-footer {
  content-visibility: auto;
  contain-intrinsic-size: auto 700px;
}

.section-alt {
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
  border-top: none;
  border-bottom: none;
}

.section-dark {
  background: #FFFFFF;
  color: #26325F;
}

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

/* ==========================================================================
   Section Headers & Anti-AI Muted Metadata Labels (#3:169 / #7:223)
   ========================================================================== */
.section-header {
  margin-bottom: 36px;
}

.section-tag {
  display: inline-block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0.02em;
  color: #B2BAD4;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  margin-bottom: 8px;
  box-shadow: none;
}

.section-tag::before,
.section-tag::after,
.section-tag-emerald::before,
.section-tag-emerald::after {
  content: none;
  display: none;
}

.section-tag-emerald {
  color: #B2BAD4;
  background: transparent;
  border: none;
}

.section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(32px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1.22em;
  letter-spacing: -0.02em;
  color: #33366D;
  margin-bottom: 18px;
}

.section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #6C7192;
  max-width: 680px;
  margin: 0 auto;
  line-height: 1.42em;
}

/* ==========================================================================
   Site Header & Navigation (Exact Figma #3:608 "Navigation" Layout)
   ========================================================================== */
.site-header {
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
  z-index: 1000;
  background: transparent;
  border: none;
  transition: var(--transition);
}

.header-container {
  max-width: 1132px;
  height: 55px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: nowrap;
}

/* Figma #3:609 "Clearbit brand" — 34x34 Mark + Inter Regular 19px #26325F */
.brand-logo {
  display: inline-flex;
  align-items: center;
  gap: 0;
  font-family: 'Inter', sans-serif;
  font-size: 19px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: #26325F;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}

.brand-logo::before {
  content: "";
  width: 34px;
  height: 34px;
  margin-right: 11px;
  flex-shrink: 0;
  background-image: url("/assets/logo.webp");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.brand-logo:hover {
  color: #26325F;
  opacity: 0.85;
}

.brand-logo span:not(.brand-badge) {
  color: #26325F;
  font-weight: 700;
}

.brand-badge {
  display: none !important;
}

/* Figma #3:615 "Main navigation" — Single-line Row, Inter Semi Bold #26325F */
.nav-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
  border: none;
  width: auto;
  flex-wrap: nowrap;
}

.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0;
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1;
  color: #26325F;
  padding: 0;
  position: relative;
  white-space: nowrap;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.nav-link::after {
  display: none !important;
}

.nav-link:hover {
  color: #4822DC;
  opacity: 0.85;
}

/* Figma #3:629 "Account actions" & #3:631 "Get started" */
.header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.header-actions .btn-primary {
  height: 48px;
  padding: 0 18px;
  background: transparent;
  color: #26325F;
  border: 2px solid #26325F;
  border-radius: 9px;
  box-shadow: none;
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.header-actions .btn-primary:hover {
  background: #26325F;
  color: #FFFFFF;
  border-color: #26325F;
  box-shadow: none;
}

.mobile-toggle {
  display: none;
  width: 42px;
  height: 42px;
  border-radius: 9px;
  background: transparent;
  border: 2px solid #26325F;
  font-size: 1.25rem;
  cursor: pointer;
  color: #26325F;
  align-items: center;
  justify-content: center;
}

/* ==========================================================================
   Global Buttons
   ========================================================================== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 13px 24px;
  font-family: var(--uc-body-family);
  font-size: 1rem;
  font-weight: 600;
  line-height: 24px;
  border-radius: var(--Button-radius-xxs, 12px);
  cursor: pointer;
  transition: all 0.25s ease;
  text-align: center;
}

.btn-primary {
  background: linear-gradient(90deg, rgba(72, 34, 220, 1) 0%, rgba(69, 102, 242, 1) 100%);
  color: #FFFFFF;
  border: none;
  border-radius: 9px;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
}

.btn-primary:hover {
  background: linear-gradient(90deg, rgba(60, 26, 196, 1) 0%, rgba(55, 88, 228, 1) 100%);
  color: #FFFFFF;
  transform: translateY(-1px);
}

.btn-emerald {
  background: #F4F7FC;
  color: #33366D;
  border: 1px solid #E9EDF4;
  border-radius: 9px;
  box-shadow: none;
}

.btn-emerald:hover {
  background: #4822DC;
  color: #FFFFFF;
  border-color: #4822DC;
}

.btn-outline {
  background: transparent;
  color: #26325F;
  border: 2px solid #26325F;
  border-radius: 9px;
  box-shadow: none;
}

.btn-outline:hover {
  background: #26325F;
  color: #FFFFFF;
  border-color: #26325F;
  box-shadow: none;
}

.btn-sm {
  padding: 13px 24px;
  font-size: 1rem;
  font-weight: 500;
}

/* ==========================================================================
   Hero Section (Exact Figma #3:607 "Clearbit hero" Design)
   ========================================================================== */
.mui-hero-section {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 175px 0 72px;
  background:
    radial-gradient(38% 46% at 86% 56%, rgba(138, 217, 242, 0.78) 0%, rgba(181, 234, 245, 0.37) 54%, rgba(255, 255, 255, 0) 100%),
    radial-gradient(36% 48% at 55% 54%, rgba(150, 115, 241, 0.95) 0%, rgba(183, 161, 247, 0.68) 42%, rgba(255, 255, 255, 0) 100%),
    #FFFFFF;
  border-bottom: 5px solid #D1B5FC;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

.mui-hero-container {
  position: relative;
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  min-height: 0;
  border-radius: 0;
  overflow: visible;
  display: block;
}

.mui-hero-container::before,
.mui-hero-container::after {
  display: none;
}

/* Hero Main Grid: Left Copy (#3:633, 535px) + Right Intelligence Card (#3:668) + Bottom Trust Bar (#3:722) */
.mui-hero-grid {
  position: relative;
  z-index: 2;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 535px) minmax(0, 1fr);
  grid-template-rows: auto auto auto auto;
  column-gap: 56px;
  row-gap: 0;
  align-items: start;
}

/* Figma #3:639 "Data constellation" SVG (244x300) bridging the Hero Message and Right Card */
.mui-hero-grid::before {
  content: "";
  position: absolute;
  left: 465px;
  top: 110px;
  width: 244px;
  height: 300px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='244' height='300' viewBox='0 0 244 300' fill='none'%3E%3Cg opacity='0.75'%3E%3Cpath d='M24 62L118 28L212 84L168 188L58 224L24 62Z' stroke='%23FFFFFF' stroke-width='1.5' stroke-dasharray='4 4'/%3E%3Cpath d='M118 28L168 188M24 62L212 84M58 224L212 84M58 224L142 276L220 218' stroke='%23E9EDF4' stroke-width='1.2'/%3E%3Ccircle cx='24' cy='62' r='6' fill='%23FFFFFF' stroke='%234822DC' stroke-width='2.5'/%3E%3Ccircle cx='118' cy='28' r='5' fill='%2323A4EB'/%3E%3Ccircle cx='212' cy='84' r='7' fill='%23FFFFFF' stroke='%2323A4EB' stroke-width='2.5'/%3E%3Ccircle cx='168' cy='188' r='6' fill='%234566F2'/%3E%3Ccircle cx='58' cy='224' r='5' fill='%23FFFFFF' stroke='%239673F1' stroke-width='2.5'/%3E%3Ccircle cx='142' cy='276' r='4.5' fill='%2323A4EB'/%3E%3Ccircle cx='220' cy='218' r='5' fill='%23FFFFFF' stroke='%234822DC' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
}

/* Unwrap .mui-hero-content so its children sit in exact Figma positions */
.mui-hero-content {
  display: contents;
}

/* Clean Figma Eyebrow Label above #3:634 Headline (Zero AI Pill Box / Dot / Shield) */
.mui-status-chip {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
  margin-bottom: 12px;
  position: relative;
  z-index: 2;
}

.mui-status-chip .status-dot,
.mui-status-chip .status-dot::after {
  display: none;
}

.mui-status-chip img {
  width: 0;
  height: 0;
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

.mui-status-chip .status-text {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #5355A2;
}

/* Figma #3:634 Headline — Inter Bold 700, line-height 1.07em, color #26325F */
.mui-hero-heading {
  grid-column: 1;
  grid-row: 2;
  font-family: 'Inter', sans-serif;
  font-size: clamp(44px, 4.2vw, 60px);
  font-weight: 700;
  line-height: 1.07em;
  letter-spacing: -0.03em;
  color: #26325F;
  max-width: 535px;
  margin: 0 0 23px 0;
  position: relative;
  z-index: 2;
}

.mui-hero-highlight {
  background: linear-gradient(90deg, #4822DC 0%, #4566F2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 700;
  padding: 0;
}

/* Figma #3:635 Subheadline — Inter Regular 400, 21px, line-height 1.36em, width 474px, color #26325F */
.mui-hero-copy {
  grid-column: 1;
  grid-row: 3;
  font-family: 'Inter', sans-serif;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.36em;
  color: #26325F;
  max-width: 474px;
  margin: 0;
  position: relative;
  z-index: 2;
}

.mui-hero-copy strong {
  color: #26325F;
  font-weight: 600;
}

/* Figma #3:668 "Company intelligence preview" Card (Right Side Floating App Window) */
.mui-hero-calculator {
  grid-column: 2;
  grid-row: 1 / 4;
  align-self: center;
  width: 100%;
  position: relative;
  z-index: 2;
}

.mui-paper-card {
  position: relative;
  background-color: #FFFFFF;
  border-radius: 20px;
  border: 1px solid #E9EDF4;
  box-shadow: 0px 14px 40px 0px rgba(93, 77, 152, 0.13);
  padding: 23px 24px 24px 83px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mui-paper-card:hover {
  box-shadow: 0px 18px 48px 0px rgba(93, 77, 152, 0.18);
}

/* Figma #3:669 "App sidebar" (63px wide left sidebar with #E9EDF4 right stroke & top 2x2 brand mark only — 5 lower icons removed) */
.mui-paper-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 63px;
  background-color: #FFFFFF;
  border-right: 1px solid #E9EDF4;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='63' height='64' viewBox='0 0 63 64' fill='none'%3E%3Crect x='19' y='23' width='12' height='12' rx='2.5' fill='%2326325F'/%3E%3Crect x='33' y='23' width='11' height='12' rx='2.5' fill='%2323A4EB'/%3E%3Crect x='19' y='37' width='12' height='11' rx='2.5' fill='%234566F2'/%3E%3Crect x='33' y='37' width='11' height='11' rx='2.5' fill='%23D1B5FC'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: top center;
  pointer-events: none;
}

/* Figma #3:680 "Company heading" */
.mui-card-header {
  position: relative;
  padding: 0 0 14px 0;
  background: transparent;
  border-bottom: 1px solid #E9EDF4;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Figma #3:687 Active Tab Indicator (#23A4EB 2px bar) */
.mui-card-header::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 118px;
  height: 2px;
  background-color: #23A4EB;
}

.mui-card-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

/* Figma #3:681 Company Icon (24x24 #354962 radius 3px) + #3:683 Inter Semi Bold 18px #3A4251 */
.mui-card-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #3A4251;
  margin: 0;
}

.mui-card-title::before {
  content: "";
  width: 24px;
  height: 24px;
  border-radius: 3px;
  background-color: #354962;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cpath d='M9 22v-4h6v4M8 6h.01M16 6h.01M12 6h.01M12 10h.01M12 14h.01M16 10h.01M16 14h.01M8 10h.01M8 14h.01'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}

.mui-pill-instant {
  display: none !important;
}

.mui-card-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: #707787;
  margin: 0;
}

.mui-card-content {
  padding: 0;
}

.mui-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 14px;
  align-items: end;
}

.mui-form-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

/* Figma #3:699 Label Style (Inter Semi Bold #677184) */
.mui-field-label {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #677184;
}

.mui-input-control,
.mui-select-control {
  width: 100%;
  height: 40px;
  padding: 8px 12px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #3A4251;
  background-color: #FFFFFF;
  border: 1px solid #E9EDF4;
  border-radius: 6px;
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  outline: none;
}

.mui-input-control::placeholder {
  color: #9EA6B4;
}

.mui-input-control:focus,
.mui-select-control:focus {
  border-color: #23A4EB;
  box-shadow: 0 0 0 3px rgba(35, 164, 235, 0.14);
}

/* Figma #3:637 "Primary action" CTA Button — Height 61px, Radius 9px, Linear Gradient #4822DC -> #4566F2 */
.mui-btn-contained {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 61px;
  padding: 0 32px;
  background: linear-gradient(90deg, rgba(72, 34, 220, 1) 0%, rgba(69, 102, 242, 1) 100%);
  color: #FFFFFF;
  border: none;
  border-radius: 9px;
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
  margin-top: 4px;
}

.mui-btn-contained:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0px 8px 20px rgba(72, 34, 220, 0.28);
}

.mui-form::after {
  content: "✓ 100% A/B Grade Guarantee";
  grid-column: 1 / -1;
  display: block;
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #707787;
  margin-top: 2px;
}

/* Figma #3:722 "Customer trust" Bottom Bar (1105px wide, #77748F caption + #26325F logo row) */
.mui-trust-grid {
  grid-column: 1 / -1;
  grid-row: 4;
  width: 100%;
  max-width: 1105px;
  margin: 72px auto 0;
  padding-top: 0;
  border-top: none;
  display: grid;
  grid-template-columns: repeat(4, auto);
  justify-content: space-between;
  align-items: center;
  row-gap: 38px;
  column-gap: 24px;
}

.mui-trust-grid::before {
  content: "FinishMyClass.us is behind America’s highest-achieving online university students";
  grid-column: 1 / -1;
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.3;
  color: #77748F;
}

.mui-trust-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  color: #26325F;
  cursor: default;
  transition: opacity 0.2s ease;
}

.mui-trust-chip:hover {
  background: transparent;
  border: none;
  box-shadow: none;
  transform: none;
  opacity: 0.8;
}

/* Replace Material Symbol font ligature text with crisp zero-network inline SVG icons */
.mui-trust-chip .material-symbols-outlined {
  display: inline-block;
  width: 26px;
  height: 26px;
  font-size: 0 !important;
  color: transparent !important;
  overflow: hidden;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* 1. A or B Grade Guarantee — Check Circle Icon */
.mui-trust-chip:nth-child(1) .material-symbols-outlined {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

/* 2. Local Home IP Login — Globe Shield Lock Icon */
.mui-trust-chip:nth-child(2) .material-symbols-outlined {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E");
}

/* 3. Pure Human Writing — Feather Quill / Pen Icon */
.mui-trust-chip:nth-child(3) .material-symbols-outlined {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19l7-7 3 3-7 7-3-3z'/%3E%3Cpath d='M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z'/%3E%3Cpath d='M2 2l7.586 7.586'/%3E%3Ccircle cx='11' cy='11' r='2'/%3E%3C/svg%3E");
}

/* 4. Pay As You Go — Milestone Payments Icon */
.mui-trust-chip:nth-child(4) .material-symbols-outlined {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cline x1='2' x2='22' y1='10' y2='10'/%3E%3C/svg%3E");
}

.mui-trust-chip .chip-label {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #26325F;
  white-space: nowrap;
}

/* ==========================================================================
   Answer-First Direct Definition Copy (Clean Figma Editorial Lead Style)
   ========================================================================== */
.answer-box {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  margin-bottom: 24px;
  box-shadow: none;
}

.section-alt .answer-box {
  background: transparent;
}

.answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  color: #6C7192;
  font-weight: 400;
  line-height: 1.45em;
}

.answer-box p strong {
  color: #33366D;
  font-weight: 700;
}

/* ==========================================================================
   Section 2: Outcomes Section (#executive-summary — Exact Figma #11:3 Design)
   ========================================================================== */
#executive-summary {
  background: radial-gradient(circle at 50% 28%, rgba(72, 34, 220, 0.045) 0%, rgba(239, 243, 250, 0.55) 48%, rgba(255, 255, 255, 1) 100%);
  padding: 100px 0 80px;
  font-family: 'Inter', sans-serif;
}

#executive-summary > .container {
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#executive-summary .section-header {
  margin-bottom: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

#executive-summary .section-tag {
  background-color: transparent;
  border: none;
  color: #B2BAD4;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  padding: 0;
  box-shadow: none;
  margin-bottom: 0;
}

/* Figma #11:5 — Inter Bold 700, 56px, line-height 1.1em, CENTER, #26325F */
#executive-summary .section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(36px, 3.9vw, 56px);
  font-weight: 700;
  line-height: 1.1em;
  letter-spacing: -0.025em;
  color: #26325F;
  text-shadow: 0 4px 16px rgba(38, 50, 95, 0.08);
  text-align: center;
  max-width: 840px;
  margin: 0;
}

#executive-summary .section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55em;
  color: #6B7A99;
  text-align: center;
  max-width: 700px;
  margin: 0;
}

/* Figma #11:6 "Body text" — 700px Centered Column, Inter Regular 17px, 1.55em, #6B7A99 */
#executive-summary .answer-box {
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  max-width: 700px;
  margin: 0 auto 20px;
}

#executive-summary .answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55em;
  color: #6B7A99;
  text-shadow: 0 2px 10px rgba(38, 50, 95, 0.06);
  text-align: center;
}

#executive-summary .answer-box p strong {
  color: #26325F;
  font-weight: 600;
}

#executive-summary .container > div:not([class]) {
  width: 100%;
  margin-top: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 320px));
  justify-content: center;
  align-items: stretch;
  row-gap: 20px;
  column-gap: 0;
}

#executive-summary .container > div:not([class]) > p:nth-child(-n+3) {
  grid-column: 1 / -1;
  max-width: 700px;
  margin: 0 auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55em;
  color: #6B7A99;
  text-shadow: 0 2px 10px rgba(38, 50, 95, 0.06);
  text-align: center;
}

#executive-summary .container > div:not([class]) > p:nth-child(3) {
  margin-bottom: 28px;
}

/* Figma #11:9 "Stats row" — 3 Columns (320px each, padding 32px, gap 12px) + 1px #E9EDF4 Dividers */
#executive-summary .container > div:not([class]) > p:nth-child(n+4) {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  max-width: 320px;
  padding: 32px;
  margin: 0;
  background: transparent;
  box-shadow: none;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5em;
  color: #8892A4;
  text-shadow: 0 2px 8px rgba(38, 50, 95, 0.05);
  text-align: center;
  position: relative;
}

/* Figma #11:16 & #11:23 — 1px x 160px #E9EDF4 Vertical Dividers */
#executive-summary .container > div:not([class]) > p:nth-child(4),
#executive-summary .container > div:not([class]) > p:nth-child(5) {
  border-right: 1px solid #E9EDF4;
}

/* Figma #11:11, #11:18, #11:25 — Stat Numbers (Inter Bold 700, 48px, #4822DC) */
#executive-summary .container > div:not([class]) > p:nth-child(4)::before,
#executive-summary .container > div:not([class]) > p:nth-child(5)::before,
#executive-summary .container > div:not([class]) > p:nth-child(6)::before {
  font-family: 'Inter', sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  color: #4822DC;
  text-shadow: 0 6px 18px rgba(72, 34, 220, 0.16);
  display: block;
}

#executive-summary .container > div:not([class]) > p:nth-child(4)::before {
  content: "300%";
}

#executive-summary .container > div:not([class]) > p:nth-child(5)::before {
  content: "70%";
}

#executive-summary .container > div:not([class]) > p:nth-child(6)::before {
  content: "100%";
}

/* Figma #11:13, #11:20, #11:27 — Stat Footer Icon + Brand Label (#26325F) */
#executive-summary .container > div:not([class]) > p:nth-child(4)::after {
  content: "Undergrad & PhD";
  display: inline-flex;
  align-items: center;
  padding-top: 16px;
  padding-left: 26px;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.2;
  color: #26325F;
  filter: drop-shadow(0 3px 8px rgba(38, 50, 95, 0.10));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 2 7 12 12 22 7 12 2'/%3E%3Cpolyline points='2 17 12 22 22 17'/%3E%3Cpolyline points='2 12 12 17 22 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left bottom 1px;
  background-size: 20px 20px;
}

#executive-summary .container > div:not([class]) > p:nth-child(5)::after {
  content: "FEDERAL SAP";
  display: inline-flex;
  align-items: center;
  padding-top: 16px;
  padding-left: 30px;
  font-family: 'Inter', sans-serif;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  color: #26325F;
  filter: drop-shadow(0 3px 8px rgba(38, 50, 95, 0.10));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='28' viewBox='0 0 24 28' fill='none'%3E%3Cpath d='M12 2L14.8 9.2L22 10.5L16.5 15.8L18.2 23.5L12 19.4L5.8 23.5L7.5 15.8L2 10.5L9.2 9.2L12 2Z' stroke='%2326325F' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left bottom 0px;
  background-size: 24px 28px;
}

#executive-summary .container > div:not([class]) > p:nth-child(6)::after {
  content: "Full Syllabus";
  display: inline-flex;
  align-items: center;
  padding-top: 16px;
  padding-left: 26px;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.2;
  color: #26325F;
  filter: drop-shadow(0 3px 8px rgba(38, 50, 95, 0.10));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2326325F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left bottom 1px;
  background-size: 20px 20px;
}

/* Figma #11:30 "Explore CTA" — Height 56px, Radius 9px, Gradient #4822DC -> #4566F2 */
#executive-summary .container > div:not([class])::after {
  content: "Explore the platform";
  grid-column: 1 / -1;
  justify-self: center;
  margin-top: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  padding: 0 32px;
  border-radius: 9px;
  background: linear-gradient(90deg, rgba(72, 34, 220, 1) 0%, rgba(69, 102, 242, 1) 100%);
  box-shadow: 0px 10px 24px -6px rgba(72, 34, 220, 0.28);
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 600;
  color: #FFFFFF;
}

/* ==========================================================================
   Section 3: #how-it-works — Exact Figma #3:169 "Buyer intelligence feature"
   ========================================================================== */
#how-it-works {
  position: relative;
  background: radial-gradient(circle at 43% 43%, rgba(239, 243, 250, 1) 0%, rgba(250, 252, 253, 1) 100%);
  padding: 112px 0 104px;
  border-top: none;
  border-bottom: none;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#how-it-works > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 1.06fr 0.94fr;
  column-gap: 76px;
  row-gap: 0;
  align-items: center;
}

/* Right Column: Heading (#3:193) & Narrative Copy (#3:194) */
#how-it-works .section-header {
  grid-column: 2;
  grid-row: 1;
  text-align: left;
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#how-it-works .section-tag {
  background: transparent;
  border: none;
  color: #B2BAD4;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 8px;
}

/* Figma #3:193 — Inter Bold 700, line-height 1.2em, #343668 */
#how-it-works .section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(34px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: -0.02em;
  color: #343668;
  text-align: left;
  margin: 0 0 20px 0;
}

/* Figma #3:194 — Inter Regular 400, line-height 1.35em–1.45em, #6C7192 */
#how-it-works .section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.45em;
  color: #6C7192;
  text-align: left;
  max-width: 470px;
  margin: 0;
}

#how-it-works .answer-box {
  grid-column: 2;
  grid-row: 2;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 0 14px 0;
  max-width: 470px;
}

#how-it-works .answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.45em;
  color: #6C7192;
  text-align: left;
}

#how-it-works .answer-box p strong {
  color: #343668;
  font-weight: 700;
}

#how-it-works .container > div:not([class]) {
  grid-column: 2;
  grid-row: 3;
  margin-top: 0;
  max-width: 470px;
}

#how-it-works .container > div:not([class]) > p {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.45em;
  color: #6C7192;
  margin-bottom: 12px;
}

#how-it-works .container > aside {
  grid-column: 2;
  grid-row: 4;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
  max-width: 470px;
}

#how-it-works .container > aside > article {
  background: rgba(255, 255, 255, 0.93);
  border: none;
  border-radius: 6px;
  padding: 18px;
  box-shadow: 0px 5px 13px 0px rgba(40, 62, 114, 0.13);
}

#how-it-works .container > aside > article > span {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #B2BAD4;
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 4px;
}

#how-it-works .container > aside > article > h3 {
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.25em;
  color: #343668;
  margin-bottom: 6px;
}

#how-it-works .container > aside > article > p {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  line-height: 1.4em;
  color: #6C7192;
}

/* Left Column: Figma #3:184 "Contact profile" & #3:170 "Company profile" Overlapping Cards */
.protocol-grid {
  grid-column: 1;
  grid-row: 1 / 5;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 0;
  row-gap: 24px;
  margin-top: 0;
  position: relative;
  align-items: start;
}

/* Figma effect_c33d3c7d: 0px 5px 13px 0px rgba(40, 62, 114, 0.13) (scaled to desktop: 0px 14px 36px) & borderRadius 6px */
.protocol-card {
  background: #FFFFFF;
  border: none;
  border-radius: 6px;
  padding: 28px 26px;
  position: relative;
  box-shadow: 0px 14px 36px 0px rgba(40, 62, 114, 0.13);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Figma #3:184 (x:16, y:60, fill #FFFFFF) vs #3:170 (x:98, y:46, fill rgba(255,255,255,0.93)) */
.protocol-card:nth-child(1) {
  margin-top: 38px;
  z-index: 1;
  background: #FFFFFF;
}

.protocol-card:nth-child(2) {
  margin-left: -22px;
  margin-top: 0;
  z-index: 2;
  background: rgba(255, 255, 255, 0.93);
  backdrop-filter: blur(4px);
}

.protocol-card:nth-child(3) {
  margin-top: 14px;
  z-index: 1;
  background: #FFFFFF;
}

.protocol-card:nth-child(4) {
  margin-left: -22px;
  margin-top: -24px;
  z-index: 2;
  background: rgba(255, 255, 255, 0.93);
  backdrop-filter: blur(4px);
}

.protocol-card:hover {
  transform: translateY(-3px);
  box-shadow: 0px 18px 42px 0px rgba(40, 62, 114, 0.17);
}

/* Service-Related Header Illustrations on Each Overlapping Card (No bottom border, matching #3:184 & #3:170) */
.protocol-card::before {
  content: "";
  display: block;
  width: 100%;
  height: 48px;
  margin-bottom: 18px;
  padding-bottom: 0;
  border-bottom: none;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain;
}

/* Card 1 Header: US PhD Specialist Profile Avatar + Name (Matches "Dharmesh Shah" #3:185 & #3:186) */
.protocol-card:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='48' viewBox='0 0 220 48' fill='none'%3E%3Crect width='44' height='44' rx='3' fill='%23343668'/%3E%3Ccircle cx='22' cy='17' r='7.5' fill='%238AD9F2'/%3E%3Cpath d='M9 38C9 31.5 14.8 27.5 22 27.5C29.2 27.5 35 31.5 35 38' fill='%2359AEED'/%3E%3Cpath d='M13 11L22 7L31 11L22 15L13 11Z' fill='%23FFFFFF'/%3E%3Ctext x='56' y='19' font-family='Inter, sans-serif' font-size='13.5' font-weight='700' fill='%23343668'%3EDr. Marcus Vance%3C/text%3E%3Ctext x='56' y='35' font-family='Inter, sans-serif' font-size='11' font-weight='400' fill='%2359AEED'%3EPhD Curriculum Lead%3C/text%3E%3C/svg%3E");
}

/* Card 2 Header: Course Portal Hub Emblem + Domain (Matches "HubSpot" #3:171 & #3:176) */
.protocol-card:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='48' viewBox='0 0 220 48' fill='none'%3E%3Ccircle cx='22' cy='22' r='6' stroke='%23FF6438' stroke-width='2.6'/%3E%3Ccircle cx='11' cy='13' r='2.8' fill='%23FF6438'/%3E%3Ccircle cx='33' cy='13' r='2.8' fill='%23FF6438'/%3E%3Ccircle cx='22' cy='35' r='2.8' fill='%23FF6438'/%3E%3Cpath d='M13 14.8L17.5 18.5M31 14.8L26.5 18.5M22 28V32.5' stroke='%23FF6438' stroke-width='2.4' stroke-linecap='round'/%3E%3Ctext x='48' y='19' font-family='Inter, sans-serif' font-size='13.5' font-weight='700' fill='%23343668'%3ESpecialist Match%3C/text%3E%3Ctext x='48' y='34' font-family='Inter, sans-serif' font-size='11' font-weight='400' fill='%236C7192'%3E50+ STEM & BSN Fields%3C/text%3E%3C/svg%3E");
}

/* Card 3 Header: Domestic US Static IP & Geolocation Shield */
.protocol-card:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='48' viewBox='0 0 220 48' fill='none'%3E%3Cpath d='M22 8L11 13V21C11 28 15.7 34.3 22 36C28.3 34.3 33 28 33 21V13L22 8Z' stroke='%2359AEED' stroke-width='2.4' stroke-linejoin='round'/%3E%3Cpath d='M17.5 22L20.5 25L27 18.5' stroke='%2359AEED' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='48' y='19' font-family='Inter, sans-serif' font-size='13.5' font-weight='700' fill='%23343668'%3EDomestic Home IP%3C/text%3E%3Ctext x='48' y='34' font-family='Inter, sans-serif' font-size='11' font-weight='400' fill='%2359AEED'%3Eus-static.vpn • Local ISP%3C/text%3E%3C/svg%3E");
}

/* Card 4 Header: Gradebook Telemetry & A/B Guarantee Badge */
.protocol-card:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='48' viewBox='0 0 220 48' fill='none'%3E%3Cpath d='M11 30L18 23L22.5 27.5L32 16' stroke='%235355A2' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M26 16H32V22' stroke='%235355A2' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='48' y='19' font-family='Inter, sans-serif' font-size='13.5' font-weight='700' fill='%23343668'%3E96.4%25 Grade Avg%3C/text%3E%3Ctext x='48' y='34' font-family='Inter, sans-serif' font-size='11' font-weight='400' fill='%236C7192'%3EA/B Grade Warranty%3C/text%3E%3C/svg%3E");
}

/* Figma #3:187, #3:189, #3:191 — Muted Field Label (#B2BAD4, Inter Regular) */
.protocol-step-num {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #B2BAD4;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  margin-bottom: 3px;
}

.protocol-card:nth-child(even) .protocol-step-num {
  color: #B2BAD4;
  background: transparent;
  border: none;
}

/* Figma #3:188, #3:192 — Bold Field Value (#6C7192 / #343668, Inter Bold 700, 1.2em) */
.protocol-card h3 {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25em;
  color: #343668;
  margin-bottom: 8px;
}

.protocol-card p {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  color: #6C7192;
  line-height: 1.45em;
  margin: 0;
}

/* ==========================================================================
   Section 4: #lms-platforms — Exact Figma #7:223 "Floating integrations section"
   ========================================================================== */
@keyframes constellation-float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-9px);
  }
}

@keyframes subject-badge-float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-4px);
  }
}

#lms-platforms {
  position: relative;
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 58%, #F2F4FC 58%, #F2F4FC 100%);
  padding: 96px 0 88px;
  border-top: none;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#lms-platforms > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  column-gap: 64px;
  row-gap: 0;
  align-items: start;
}

/* Left Column: Figma #7:224 "Integration introduction" (gap 23px) */
#lms-platforms .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  margin-bottom: 20px;
  padding-top: 28px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#lms-platforms .section-tag {
  background: transparent;
  border: none;
  color: #B2BAD4;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 8px;
}

/* Figma #7:225 — Bold 700, 44px, line-height 1.23em, #33366D */
#lms-platforms .section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(34px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1.23em;
  letter-spacing: -0.02em;
  color: #33366D;
  text-align: left;
  margin: 0 0 23px 0;
}

/* Figma #7:226 — Regular 400, line-height 1.42em, #6C7192 */
#lms-platforms .section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.42em;
  color: #6C7192;
  text-align: left;
  max-width: 450px;
  margin: 0;
}

#lms-platforms .answer-box {
  grid-column: 1;
  grid-row: 2;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
  max-width: 450px;
}

#lms-platforms .answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.42em;
  color: #6C7192;
  text-align: left;
}

#lms-platforms .answer-box p strong {
  color: #33366D;
  font-weight: 700;
}

/* Figma #7:227 — "All integrations ›" Link Accent (#5355A2 Bold) */
#lms-platforms .answer-box::after {
  content: "All supported portals ›";
  display: inline-block;
  margin-top: 18px;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #5355A2;
}

/* Right Top Split: Exact Figma #7:228 "Floating app constellation" (2-4-3-4 13 White 80x76 Tiles) */
#lms-platforms > .container::after {
  content: "";
  grid-column: 2;
  grid-row: 1 / 3;
  width: 100%;
  height: 480px;
  align-self: center;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  animation: constellation-float 6.5s ease-in-out infinite;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='375 30 450 510' fill='none'%3E%3Cdefs%3E%3Cfilter id='ts' x='-30%25' y='-25%25' width='160%25' height='165%25'%3E%3CfeDropShadow dx='0' dy='15' stdDeviation='11' flood-color='%234D609B' flood-opacity='0.09'/%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='3.5' flood-color='%236A7CB9' flood-opacity='0.15'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23ts)'%3E%3Crect x='402' y='241' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Ccircle cx='442' cy='265' r='3.2' fill='%23E72429'/%3E%3Ccircle cx='442' cy='285' r='3.2' fill='%23E72429'/%3E%3Ccircle cx='432' cy='275' r='3.2' fill='%23E72429'/%3E%3Ccircle cx='452' cy='275' r='3.2' fill='%23E72429'/%3E%3Ccircle cx='435' cy='268' r='2.5' fill='%23E72429'/%3E%3Ccircle cx='449' cy='282' r='2.5' fill='%23E72429'/%3E%3Ccircle cx='449' cy='268' r='2.5' fill='%23E72429'/%3E%3Ccircle cx='435' cy='282' r='2.5' fill='%23E72429'/%3E%3Ctext x='442' y='304' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%2333366D'%3ECANVAS%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='402' y='367' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cpath d='M425 398L442 389L459 398L442 407L425 398Z' fill='%23F98012'/%3E%3Cpath d='M432 403V411C432 414 452 414 452 411V403' stroke='%23F98012' stroke-width='2.5' stroke-linecap='round'/%3E%3Ctext x='442' y='430' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%2333366D'%3EMOODLE%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='508' y='58' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cpath d='M537 97H557C561 97 564 94 564 90C564 86.5 561.5 83.6 558 83.1C556.8 78.5 552.6 75 547.5 75C541.7 75 537 79.7 537 85.5C534.2 86.2 532 88.7 532 91.8C532 94.8 534.3 97 537 97Z' fill='%23179DD2'/%3E%3Ctext x='548' y='118' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%23179DD2'%3EMYLAB%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='508' y='183' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cpath d='M535 210H561M535 218H561' stroke='%2379C69C' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M539 204C544 200 552 201 556 206M555 224C550 228 542 227 538 222' stroke='%2379C69C' stroke-width='3' stroke-linecap='round'/%3E%3Ctext x='548' y='245' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='700' fill='%2356A87B'%3EBRIGHTSPACE%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='508' y='306' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cellipse cx='548' cy='336' rx='16' ry='6.5' transform='rotate(-30 548 336)' stroke='%23179DD2' stroke-width='2.2'/%3E%3Cellipse cx='548' cy='336' rx='16' ry='6.5' transform='rotate(30 548 336)' stroke='%23179DD2' stroke-width='2.2'/%3E%3Ccircle cx='548' cy='336' r='3.2' fill='%23179DD2'/%3E%3Ctext x='548' y='368' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%23179DD2'%3EALEKS%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='508' y='429' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cpath d='M548 446V472M535 459H561M539 450L557 468M557 450L539 468' stroke='%23F3532E' stroke-width='2.8' stroke-linecap='round'/%3E%3Ccircle cx='548' cy='459' r='4' fill='%23FFFFFF' stroke='%23F3532E' stroke-width='2.2'/%3E%3Ctext x='548' y='491' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='700' fill='%23F3532E'%3EWEBASSIGN%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='612' y='123' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Crect x='638' y='145' width='5' height='16' rx='1.5' fill='%2362449D'/%3E%3Crect x='647' y='139' width='5' height='24' rx='1.5' fill='%2362449D'/%3E%3Crect x='656' y='142' width='5' height='21' rx='1.5' fill='%2362449D'/%3E%3Ctext x='652' y='184' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='700' fill='%2362449D'%3EBLACKBOARD%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='612' y='251' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Cpath d='M652 268L667 294H637L652 268Z' stroke='%234854B4' stroke-width='2.6' stroke-linejoin='round'/%3E%3Ccircle cx='652' cy='286' r='3' fill='%234854B4'/%3E%3Ctext x='652' y='313' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%234854B4'%3EMINDTAP%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='612' y='377' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Crect x='636' y='394' width='32' height='24' rx='4' fill='%23FF6438'/%3E%3Cpath d='M644 402L648 411L652 404L656 411L660 402' stroke='%23FFFFFF' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='652' y='438' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='700' fill='%23FF6438'%3EWILEYPLUS%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='716' y='55' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Ccircle cx='756' cy='85' r='13' stroke='%239562B9' stroke-width='2.5'/%3E%3Cpath d='M751 85L754.5 88.5L762 81' stroke='%239562B9' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='756' y='117' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%239562B9'%3ESOPHIA%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='716' y='179' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Crect x='739' y='196' width='34' height='24' rx='4' fill='%2355585C'/%3E%3Cpath d='M747 205L743 208L747 211M765 205L769 208L765 211M758 203L754 213' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='756' y='240' text-anchor='middle' font-family='Inter,sans-serif' font-size='8.5' font-weight='700' fill='%2355585C'%3EZYBOOKS%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='716' y='309' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Crect x='735' y='327' width='42' height='24' rx='4' fill='%23F4F7FC' stroke='%23D8E0F0'/%3E%3Ctext x='756' y='343' text-anchor='middle' font-family='Inter,sans-serif' font-size='10.5' font-weight='800' fill='%2355555B'%3ESNHU%3C/text%3E%3Ctext x='756' y='371' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='600' fill='%23B2BAD4'%3EBRIGHTSPACE%3C/text%3E%3C/g%3E%3Cg filter='url(%23ts)'%3E%3Crect x='716' y='433' width='80' height='76' rx='5' fill='%23FFFFFF' stroke='%23FFFFFF'/%3E%3Ccircle cx='756' cy='462' r='14' fill='%23EE777B'/%3E%3Ctext x='756' y='465.5' text-anchor='middle' font-family='Inter,sans-serif' font-size='9.5' font-weight='800' fill='%23FFFFFF'%3EWGU%3C/text%3E%3Ctext x='756' y='495' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='700' fill='%23EE777B'%3EPORTAL%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* Full Content Cards Below Top Split: Styled with Figma #7:228 White Tile Elevation & 5px Radius */
.lms-grid {
  grid-column: 1 / -1;
  grid-row: 3;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
  align-items: stretch;
}

/* Figma effect_02d8bf1c: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15) & borderRadius 5px */
.lms-card {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.lms-card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 20px 28px 0px rgba(77, 96, 155, 0.12), 0px 10px 10px 0px rgba(106, 124, 185, 0.18);
}

/* Service-Related LMS Brand Logos at the Top of Each Tile (::before) */
.lms-card::before {
  content: "";
  display: block;
  width: 100%;
  height: 44px;
  margin-bottom: 6px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}

/* Tile 1: Canvas by Instructure (Red Sunburst Logo + Badge) */
.lms-card:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='44' viewBox='0 0 180 44' fill='none'%3E%3Crect width='42' height='42' rx='5' fill='%23FFF5F5'/%3E%3Ccircle cx='21' cy='11' r='2.8' fill='%23E72429'/%3E%3Ccircle cx='21' cy='31' r='2.8' fill='%23E72429'/%3E%3Ccircle cx='11' cy='21' r='2.8' fill='%23E72429'/%3E%3Ccircle cx='31' cy='21' r='2.8' fill='%23E72429'/%3E%3Ccircle cx='14' cy='14' r='2.3' fill='%23E72429'/%3E%3Ccircle cx='28' cy='28' r='2.3' fill='%23E72429'/%3E%3Ccircle cx='28' cy='14' r='2.3' fill='%23E72429'/%3E%3Ccircle cx='14' cy='28' r='2.3' fill='%23E72429'/%3E%3Ccircle cx='21' cy='21' r='3.5' stroke='%23E72429' stroke-width='2'/%3E%3Ctext x='54' y='25' font-family='Inter, sans-serif' font-size='13' font-weight='800' letter-spacing='0.04em' fill='%23E72429'%3ECANVAS LMS%3C/text%3E%3C/svg%3E");
}

/* Tile 2: Blackboard Learn Ultra (Purple/Indigo Bars Logo — Matches #7:234 Marketo #62449D) */
.lms-card:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='195' height='44' viewBox='0 0 195 44' fill='none'%3E%3Crect width='42' height='42' rx='5' fill='%23F6F3FC'/%3E%3Crect x='12' y='15' width='4' height='13' rx='1' fill='%2362449D'/%3E%3Crect x='19' y='11' width='4' height='19' rx='1' fill='%2362449D'/%3E%3Crect x='26' y='13' width='4' height='17' rx='1' fill='%2362449D'/%3E%3Ctext x='54' y='25' font-family='Inter, sans-serif' font-size='13' font-weight='800' letter-spacing='0.03em' fill='%2362449D'%3EBLACKBOARD%3C/text%3E%3C/svg%3E");
}

/* Tile 3: D2L Brightspace (Mint/Teal Loop Logo — Matches #7:238 Segment #79C69C) */
.lms-card:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='195' height='44' viewBox='0 0 195 44' fill='none'%3E%3Crect width='42' height='42' rx='5' fill='%23F2FAF6'/%3E%3Cpath d='M13 18H29M13 24H29' stroke='%2379C69C' stroke-width='2.6' stroke-linecap='round'/%3E%3Cpath d='M16 13C19.5 10.5 24.5 11.5 27 15M26 29C22.5 31.5 17.5 30.5 15 27' stroke='%2379C69C' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='14' cy='18' r='2' fill='%2379C69C'/%3E%3Ccircle cx='28' cy='24' r='2' fill='%2379C69C'/%3E%3Ctext x='54' y='25' font-family='Inter, sans-serif' font-size='13' font-weight='800' letter-spacing='0.03em' fill='%2356A87B'%3EBRIGHTSPACE%3C/text%3E%3C/svg%3E");
}

/* Tile 4: Pearson MyLab & ALEKS (Sky Blue Cloud Emblem — Matches #7:231 Salesforce #179DD2) */
.lms-card:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='205' height='44' viewBox='0 0 205 44' fill='none'%3E%3Crect width='42' height='42' rx='5' fill='%23F0F9FD'/%3E%3Cpath d='M14.5 27.5H27.5C30 27.5 32 25.5 32 23C32 20.7 30.2 18.8 28 18.5C27.2 15.3 24.4 13 21 13C17.1 13 14 16.1 14 20C12.3 20.5 11 22 11 24C11 26 12.6 27.5 14.5 27.5Z' fill='%23179DD2'/%3E%3Ctext x='54' y='25' font-family='Inter, sans-serif' font-size='12.5' font-weight='800' letter-spacing='0.03em' fill='%23179DD2'%3EMYLAB & ALEKS%3C/text%3E%3C/svg%3E");
}

.lms-card h4 {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25em;
  color: #33366D;
  margin: 0;
}

.lms-card p {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  color: #6C7192;
  line-height: 1.45em;
  margin: 0;
}

.lms-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: auto;
  padding-top: 6px;
}

.lms-pill {
  display: inline-flex;
  align-items: center;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 500;
  background: transparent;
  color: #B2BAD4;
  padding: 0;
  border-radius: 0;
  border: none;
}

/* ==========================================================================
   In-Between Section Band: Exact Figma #3:269 "Clearbit get started" (#F2F4FC)
   Placed Directly Between .lms-grid and Section 5 (#academic-subjects)
   ========================================================================== */

/* Left Side (#3:270 "Registration card" & #3:271 "Registration form") */
#lms-platforms .container > aside {
  grid-column: 1;
  grid-row: 4;
  margin-top: 84px;
  background: #EFF2FB;
  border: 1px solid #E4E8F4;
  border-radius: 4px;
  padding: 26px 24px;
  box-shadow: 0px 9px 14px 0px rgba(82, 101, 155, 0.09);
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
}

/* Figma #3:272 + #3:273 (45deg Cyan-Blue Brand Mark) + #3:274 ("Get Started" #4B5678 Bold) */
#lms-platforms .container > aside::before {
  content: "";
  display: block;
  width: 100%;
  height: 76px;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='76' viewBox='0 0 260 76' fill='none'%3E%3Cdefs%3E%3ClinearGradient id='cbm' x1='0' y1='38' x2='38' y2='0' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0%25' stop-color='%231393ED'/%3E%3Cstop offset='100%25' stop-color='%237CD2F6'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg transform='translate(111, 2)'%3E%3Crect width='38' height='38' rx='6' fill='url(%23cbm)'/%3E%3Cpath d='M19 0H32C35.3137 0 38 2.68629 38 6V19H19V0Z' fill='%23B1E3FA' fill-opacity='0.38'/%3E%3Cpath d='M11 19.5L16.5 25L27.5 14' stroke='%23FFFFFF' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Ctext x='130' y='62' text-anchor='middle' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%234B5678'%3EGet Started%3C/text%3E%3C/svg%3E");
}

/* Figma #3:276 ("Email field") & #3:280 ("Message field") Input Containers (#F5F7FC + #E4E8F4 stroke) */
#lms-platforms .container > aside > article {
  background: #F5F7FC;
  border: 1px solid #E4E8F4;
  border-radius: 4px;
  padding: 16px 18px;
  box-shadow: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

#lms-platforms .container > aside > article:hover {
  transform: none;
  background: #FFFFFF;
  border-color: #C7D1EA;
  box-shadow: none;
}

/* Figma #3:277 & #3:281 Field Labels (#6876A0 Bold) */
#lms-platforms .container > aside > article > span,
#lms-platforms .container > aside > article:nth-child(2) > span {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #6876A0;
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 6px;
}

/* Figma #3:279 Input Value Text (#4B5678 / #6876A0 Bold) */
#lms-platforms .container > aside > article > h3 {
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.3em;
  color: #4B5678;
  margin-bottom: 6px;
}

/* Figma #3:283 Secondary Field Text (#6876A0 Regular) */
#lms-platforms .container > aside > article > p {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  line-height: 1.45em;
  color: #6876A0;
  margin: 0;
}

/* Figma #3:284 ("Explore the platform" / "Start Free Account" buttons removed per user request) */
#lms-platforms .container > aside::after {
  display: none;
}

/* Right Side (#3:288 Heading + #3:289 Subcopy + #3:290/#3:301/#3:312 3 Customer Award Shields) */
#lms-platforms .container > div:not([class]) {
  grid-column: 2;
  grid-row: 4;
  margin-top: 96px;
  max-width: 540px;
}

/* Figma #3:288 — "Ready to see how\nit works?" (#242B68 Bold, line-height 1.18em) */
#lms-platforms .container > div:not([class])::before {
  content: "Ready to see how\A it works?";
  white-space: pre-line;
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: clamp(30px, 3vw, 38px);
  font-weight: 700;
  line-height: 1.18em;
  letter-spacing: -0.02em;
  color: #242B68;
  margin-bottom: 18px;
}

/* Figma #3:289 — Narrative Subcopy (#6876A0 Regular) */
#lms-platforms .container > div:not([class]) > p {
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.48em;
  color: #6876A0;
  margin-bottom: 10px;
}

/* Figma #3:290, #3:301, #3:312 — 3 "Customer award" Shields + 2-Line #6876A0 Captions */
#lms-platforms .container > div:not([class])::after {
  content: "";
  display: block;
  width: 100%;
  max-width: 440px;
  height: 175px;
  margin-top: 24px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 430 175' fill='none'%3E%3Cg transform='translate(6, 4)'%3E%3Cpath d='M14 2H92V68C92 88 53 104 53 104C53 104 14 88 14 68V2Z' fill='%23F4F5F8' stroke='%23D5D9E3' stroke-width='2.4'/%3E%3Crect x='43' y='0' width='20' height='21' fill='%23EF343E'/%3E%3Ctext x='51' y='15' text-anchor='middle' font-family='Inter,sans-serif' font-size='14' font-weight='800' fill='%23FFFFFF'%3EG%3C/text%3E%3Ctext x='59' y='9' font-family='Inter,sans-serif' font-size='7' font-weight='800' fill='%23FFFFFF'%3E2%3C/text%3E%3Ctext x='53' y='44' text-anchor='middle' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%23363A48'%3ELeader%3C/text%3E%3Cpath d='M6 54H100L95 62L100 70H6L11 62L6 54Z' fill='%23EF343E'/%3E%3Ctext x='53' y='65.5' text-anchor='middle' font-family='Inter,sans-serif' font-size='9.5' font-weight='700' letter-spacing='0.06em' fill='%23FFFFFF'%3EWINTER%3C/text%3E%3Ctext x='53' y='88' text-anchor='middle' font-family='Inter,sans-serif' font-size='13' font-weight='700' fill='%23363A48'%3E2026%3C/text%3E%3Ctext x='53' y='128' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3ECanvas & LMS%3C/text%3E%3Ctext x='53' y='145' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3EIntelligence%3C/text%3E%3C/g%3E%3Cg transform='translate(154, 4)'%3E%3Cpath d='M14 2H92V68C92 88 53 104 53 104C53 104 14 88 14 68V2Z' fill='%23F4F5F8' stroke='%23D5D9E3' stroke-width='2.4'/%3E%3Crect x='43' y='0' width='20' height='21' fill='%23EF343E'/%3E%3Ctext x='51' y='15' text-anchor='middle' font-family='Inter,sans-serif' font-size='14' font-weight='800' fill='%23FFFFFF'%3EG%3C/text%3E%3Ctext x='59' y='9' font-family='Inter,sans-serif' font-size='7' font-weight='800' fill='%23FFFFFF'%3E2%3C/text%3E%3Ctext x='53' y='44' text-anchor='middle' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%23363A48'%3ELeader%3C/text%3E%3Cpath d='M6 54H100L95 62L100 70H6L11 62L6 54Z' fill='%23EF343E'/%3E%3Ctext x='53' y='65.5' text-anchor='middle' font-family='Inter,sans-serif' font-size='9.5' font-weight='700' letter-spacing='0.06em' fill='%23FFFFFF'%3EWINTER%3C/text%3E%3Ctext x='53' y='88' text-anchor='middle' font-family='Inter,sans-serif' font-size='13' font-weight='700' fill='%23363A48'%3E2026%3C/text%3E%3Ctext x='53' y='128' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3EMyLab & ALEKS%3C/text%3E%3Ctext x='53' y='145' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3EIntelligence%3C/text%3E%3C/g%3E%3Cg transform='translate(302, 4)'%3E%3Cpath d='M14 2H92V68C92 88 53 104 53 104C53 104 14 88 14 68V2Z' fill='%23F4F5F8' stroke='%23D5D9E3' stroke-width='2.4'/%3E%3Crect x='43' y='0' width='20' height='21' fill='%23EF343E'/%3E%3Ctext x='51' y='15' text-anchor='middle' font-family='Inter,sans-serif' font-size='14' font-weight='800' fill='%23FFFFFF'%3EG%3C/text%3E%3Ctext x='59' y='9' font-family='Inter,sans-serif' font-size='7' font-weight='800' fill='%23FFFFFF'%3E2%3C/text%3E%3Ctext x='53' y='44' text-anchor='middle' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%23363A48'%3ELeader%3C/text%3E%3Cpath d='M6 54H100L95 62L100 70H6L11 62L6 54Z' fill='%23EF343E'/%3E%3Ctext x='53' y='65.5' text-anchor='middle' font-family='Inter,sans-serif' font-size='9.5' font-weight='700' letter-spacing='0.06em' fill='%23FFFFFF'%3EWINTER%3C/text%3E%3Ctext x='53' y='88' text-anchor='middle' font-family='Inter,sans-serif' font-size='13' font-weight='700' fill='%23363A48'%3E2026%3C/text%3E%3Ctext x='53' y='128' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3ESelf-Paced Portal%3C/text%3E%3Ctext x='53' y='145' text-anchor='middle' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%236876A0'%3EIntelligence%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* ==========================================================================
   Section 5: #academic-subjects — Figma #7:223 Split & Staggered Subject Constellation
   ========================================================================== */
#academic-subjects {
  position: relative;
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
  padding: 104px 0 144px;
  border-top: none;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#academic-subjects > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.88fr 1.12fr;
  column-gap: 72px;
  row-gap: 0;
  align-items: start;
}

/* Left Column: Figma #7:224 "Integration introduction" */
#academic-subjects .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#academic-subjects .section-tag {
  background: transparent;
  border: none;
  color: #B2BAD4;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 8px;
}

/* Figma #7:225 — Bold 700, 44px, line-height 1.23em, #33366D */
#academic-subjects .section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(34px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1.23em;
  letter-spacing: -0.02em;
  color: #33366D;
  text-align: left;
  margin: 0 0 23px 0;
}

/* Figma #7:226 — Regular 400, line-height 1.42em, #6C7192 */
#academic-subjects .section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.42em;
  color: #6C7192;
  text-align: left;
  max-width: 450px;
  margin: 0;
}

#academic-subjects .answer-box {
  grid-column: 1;
  grid-row: 2;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 0 14px 0;
  max-width: 450px;
}

#academic-subjects .answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.42em;
  color: #6C7192;
  text-align: left;
}

#academic-subjects .answer-box p strong {
  color: #33366D;
  font-weight: 700;
}

#academic-subjects .container > div:not([class]) {
  grid-column: 1;
  grid-row: 3;
  margin-top: 0;
  max-width: 450px;
}

#academic-subjects .container > div:not([class]) > p {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.42em;
  color: #6C7192;
  margin-bottom: 14px;
}

/* Figma #7:227 — Link Accent (#5355A2 Bold) */
#academic-subjects .container > div:not([class])::after {
  content: "All 50+ academic disciplines ›";
  display: inline-block;
  margin-top: 8px;
  margin-bottom: 24px;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #5355A2;
}

/* Left Column Bottom Aside Callouts (Quantitative STEM Standards & Clinical Writing) */
#academic-subjects .container > aside {
  grid-column: 1;
  grid-row: 4;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-top: 4px;
  max-width: 450px;
}

#academic-subjects .container > aside > article {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 20px 22px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
}

#academic-subjects .container > aside > article > span {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #B2BAD4;
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 4px;
}

#academic-subjects .container > aside > article:nth-child(2) > span {
  color: #B2BAD4;
  background: transparent;
  border: none;
}

#academic-subjects .container > aside > article > h3 {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25em;
  color: #33366D;
  margin-bottom: 6px;
}

#academic-subjects .container > aside > article > p {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  line-height: 1.45em;
  color: #6C7192;
}

/* Right Column: Staggered Floating Subject Constellation (#7:228) */
.subject-grid {
  grid-column: 2;
  grid-row: 1 / 5;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-top: 0;
  align-items: start;
}

/* Figma #7:228 Tile Surface: #FFFFFF, borderRadius 5px, effect_02d8bf1c */
.subject-card {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 26px 24px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Staggered Vertical Offset matching Figma #7:228 Constellation */
.subject-card:nth-child(even) {
  transform: translateY(44px);
}

.subject-card:hover {
  transform: translateY(-4px);
  border-color: #FFFFFF;
  box-shadow: 0px 20px 28px 0px rgba(77, 96, 155, 0.12), 0px 10px 10px 0px rgba(106, 124, 185, 0.18);
}

.subject-card:nth-child(even):hover {
  transform: translateY(40px);
}

/* Service-Related Floating Subject Icon Tiles (Exact Figma #7:228 76x72 White Elevated App Tiles) */
.subject-icon {
  width: 76px;
  height: 72px;
  border-radius: 5px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  display: block;
  margin-bottom: 18px;
  animation: subject-badge-float 5s ease-in-out infinite;
}

.subject-icon svg {
  display: none;
}

/* Exact Figma #7:228 White Tile + Unique Solid Emblem + Micro-Label across the 6 Subject Disciplines */
/* 1. Mathematics & Statistics — Solid Sky Blue (#179DD2) Sigma & Normal Curve Emblem */
.subject-card:nth-child(1) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 0s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23179DD2'/%3E%3Cpath d='M31 19H45L37 28L45 37H31' stroke='%23FFFFFF' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='49' cy='16' r='3' fill='%237CD2F6'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%23179DD2'%3EMATH & STATS%3C/text%3E%3C/svg%3E");
}

/* 2. Nursing & Health Sciences — Solid Coral Rose (#EE777B) Clinical Shield & ECG Pulse */
.subject-card:nth-child(2) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 0.8s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Cpath d='M38 10L21 16V26.5C21 36.2 28.2 44.5 38 47C47.8 44.5 55 36.2 55 26.5V16L38 10Z' fill='%23EE777B'/%3E%3Cpath d='M26 28H32L35 20L40 35L43 28H50' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.04em' fill='%23EE777B'%3EBSN & MSN%3C/text%3E%3C/svg%3E");
}

/* 3. Business, Finance & MBA — Solid Royal Purple (#62449D) Executive Equity Crest */
.subject-card:nth-child(3) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 1.6s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%2362449D'/%3E%3Crect x='27' y='29' width='5' height='10' rx='1' fill='%23C9B6F2'/%3E%3Crect x='35.5' y='23' width='5' height='16' rx='1' fill='%23FFFFFF'/%3E%3Crect x='44' y='17' width='5' height='22' rx='1' fill='%23F2BA41'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%2362449D'%3EMBA FINANCE%3C/text%3E%3C/svg%3E");
}

/* 4. Computer Science & IT — Solid Charcoal & Mint (#55585C + #56A87B) IDE Terminal Badge */
.subject-card:nth-child(4) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 2.4s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='19' y='11' width='38' height='34' rx='6' fill='%2333366D'/%3E%3Ccircle cx='25' cy='17' r='1.8' fill='%23EE777B'/%3E%3Ccircle cx='30' cy='17' r='1.8' fill='%23F2BA41'/%3E%3Ccircle cx='35' cy='17' r='1.8' fill='%2356A87B'/%3E%3Cpath d='M27 26L33 30.5L27 35M36 35H46' stroke='%2379C69C' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%2356A87B'%3ECS & PYTHON%3C/text%3E%3C/svg%3E");
}

/* 5. Natural & Physical Sciences — Solid Deep Indigo (#4854B4) Lab Flask & Molecular Ring */
.subject-card:nth-child(5) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 3.2s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Cpath d='M33 12H43M35 12V22L24 38C22.8 40 24.2 43 26.8 43H49.2C51.8 43 53.2 40 52 38L41 22V12' fill='%234854B4'/%3E%3Cpath d='M33 12H43' stroke='%234854B4' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M28 34H48L51 39.5C51.6 40.7 50.8 42 49.4 42H26.6C25.2 42 24.4 40.7 25 39.5L28 34Z' fill='%237CD2F6'/%3E%3Ccircle cx='35' cy='30' r='2.2' fill='%23FFFFFF'/%3E%3Ccircle cx='41' cy='37' r='2.5' fill='%23FFFFFF'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.03em' fill='%234854B4'%3ECHEM & BIO%3C/text%3E%3C/svg%3E");
}

/* 6. Humanities & Social Sciences — Solid Warm Orange (#FF6438) Classical Pillar & Scroll */
.subject-card:nth-child(6) .subject-icon {
  background-color: #FFFFFF;
  border-color: #EEF2F9;
  animation-delay: 4s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23FF6438'/%3E%3Cpath d='M38 17L26 23H50L38 17Z' fill='%23FFFFFF'/%3E%3Crect x='29' y='25' width='3.2' height='11' rx='1' fill='%23FFFFFF'/%3E%3Crect x='36.4' y='25' width='3.2' height='11' rx='1' fill='%23FFFFFF'/%3E%3Crect x='43.8' y='25' width='3.2' height='11' rx='1' fill='%23FFFFFF'/%3E%3Crect x='26' y='37.5' width='24' height='3' rx='1' fill='%23FFE0D6'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.04em' fill='%23FF6438'%3EAPA / MLA%3C/text%3E%3C/svg%3E");
}

.subject-card h3 {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25em;
  color: #33366D;
  margin-bottom: 8px;
}

.subject-card p {
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  color: #6C7192;
  margin-bottom: 14px;
  line-height: 1.45em;
}

.subject-courses {
  list-style: none;
  border-top: 1px solid #F0F3F9;
  padding-top: 12px;
}

.subject-courses li {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #33366D;
  padding: 3.5px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.subject-courses li::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #5355A2;
  flex-shrink: 0;
}

/* ==========================================================================
   Section 6: #privacy-protocol — Exact Figma #10:707 "Clearbit resources" Design
   ========================================================================== */
#privacy-protocol {
  background: linear-gradient(180deg, rgba(253, 254, 255, 1) 0%, rgba(242, 247, 250, 1) 100%);
  padding: 108px 0 124px;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#privacy-protocol > .container {
  max-width: 1060px;
  margin: 0 auto;
  padding: 0 20px;
  display: block;
}

/* Figma #10:708 Top-Left Heading Block */
#privacy-protocol .section-header {
  text-align: left;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 680px;
}

#privacy-protocol .section-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(34px, 3.6vw, 44px);
  font-weight: 700;
  line-height: 1.22em;
  letter-spacing: -0.02em;
  color: #30366B;
  text-align: left;
  margin: 0 0 16px 0;
}

#privacy-protocol .section-lead {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.42em;
  color: #657093;
  text-align: left;
  margin: 0;
  max-width: 640px;
}

#privacy-protocol .answer-box {
  max-width: 640px;
  margin: 0 0 56px 0;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

#privacy-protocol .answer-box p {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.42em;
  color: #657093;
  text-align: left;
}

#privacy-protocol > .container::after {
  display: none;
}

/* Figma #10:709, #10:718, #10:729, #10:738 — 2-Column Unboxed Horizontal Resource Grid */
#privacy-protocol .container > div:not([class]) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 64px;
  row-gap: 54px;
  margin-top: 0;
  align-items: start;
}

/* Each Resource Item: Left 112x112 Floating White Geometric Tile + Right Unboxed Text Column */
#privacy-protocol .container > div:not([class]) > p {
  position: relative;
  background-color: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  transform: none;
  padding: 0 0 4px 140px;
  min-height: 116px;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 14.5px;
  font-weight: 400;
  line-height: 1.42em;
  color: #657093;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 116px 120px;
  transition: transform 0.2s ease;
}

#privacy-protocol .container > div:not([class]) > p:nth-child(even),
#privacy-protocol .container > div:not([class]) > p:hover,
#privacy-protocol .container > div:not([class]) > p:nth-child(even):hover {
  transform: none;
}

/* Figma #10:715, #10:726, #10:735, #10:745 — Bold #30366B Resource Heading Above Body Copy */
#privacy-protocol .container > div:not([class]) > p::before {
  display: block;
  width: auto;
  height: auto;
  margin: 0 0 8px 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35em;
  color: #30366B;
}

/* Figma #10:717 / EL-5bac0e77 — "Get started ›" Bold #333E84 Action Link Below Body Copy */
#privacy-protocol .container > div:not([class]) > p::after {
  content: "Get started ›";
  display: inline-block;
  margin-top: 12px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2em;
  color: #333E84;
}

/* Resource 1 (#10:709 / #10:710): Exact Coral #FA5A65 + Deep Navy #293C87 Globe Block Tile */
#privacy-protocol .container > div:not([class]) > p:nth-child(1) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r1' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r1)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='34' y='32' width='44' height='44' fill='%23FA5A65'/%3E%3Crect x='34' y='44' width='44' height='5' fill='%23FFFFFF'/%3E%3Crect x='49' y='49' width='29' height='27' fill='%23293C87'/%3E%3Ccircle cx='63.5' cy='62.5' r='7.5' stroke='%23CBD8FC' stroke-width='1.5'/%3E%3Cellipse cx='63.5' cy='62.5' rx='3.8' ry='7.5' stroke='%23CBD8FC' stroke-width='1.5'/%3E%3Cline x1='56' y1='62.5' x2='71' y2='62.5' stroke='%23CBD8FC' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(1)::before {
  content: "Overseas & Data Center IP Risk";
}

/* Resource 2 (#10:718 / #10:719): Exact Deep Navy #304A8A + Gold #FFCF3E + Slate #344A8C Cascading Tiles */
#privacy-protocol .container > div:not([class]) > p:nth-child(2) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r2' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r2)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='58' y='56' width='20' height='20' fill='%23344A8C'/%3E%3Ctext x='68' y='71' text-anchor='middle' font-family='Inter,sans-serif' font-size='14' font-weight='600' fill='%23FFFFFF'%3E$%3C/text%3E%3Crect x='48' y='44' width='22' height='22' fill='%23FFCF3E'/%3E%3Ctext x='59' y='60' text-anchor='middle' font-family='Inter,sans-serif' font-size='16' font-weight='700' fill='%23FFFFFF'%3E−%3C/text%3E%3Crect x='34' y='32' width='22' height='22' fill='%23304A8A'/%3E%3Ctext x='45' y='48' text-anchor='middle' font-family='Inter,sans-serif' font-size='16' font-weight='600' fill='%23FFFFFF'%3E+%3C/text%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(2)::before {
  content: "Static Domestic US Home IP";
}

/* Resource 3 (#10:729 / #10:730): Exact Periwinkle #A8B6FF + Royal Blue #6D86F5 + Navy #303F7B Alignment Bars */
#privacy-protocol .container > div:not([class]) > p:nth-child(3) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r3' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r3)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='34' y='32' width='30' height='15' fill='%23A8B6FF'/%3E%3Crect x='49' y='49' width='30' height='12.5' fill='%236D86F5'/%3E%3Crect x='34' y='64' width='35' height='12.5' fill='%23303F7B'/%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(3)::before {
  content: "The Art of Device & OS Alignment";
}

/* Resource 4 (#10:738 / #10:739): Exact Lavender #DF8DFF + Deep Indigo #3F428E Profile Frame */
#privacy-protocol .container > div:not([class]) > p:nth-child(4) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r4' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r4)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='34' y='32' width='44' height='44' fill='%23DF8DFF'/%3E%3Crect x='44' y='47' width='24' height='24' fill='%233F428E'/%3E%3Crect x='53' y='30' width='7' height='19' fill='%23FFFFFF'/%3E%3Crect x='42.5' y='40.5' width='27' height='27' stroke='%23FFFFFF' stroke-width='2'/%3E%3Ccircle cx='56' cy='54.5' r='3' stroke='%23FFFFFF' stroke-width='2'/%3E%3Cpath d='M51 65.5V63C51 58.5 61 58.5 61 63V65.5' stroke='%23FFFFFF' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(4)::before {
  content: "Zero Portal Security Flags";
}

/* Resource 5: Geometric Mint-Teal #56B7A5 + Deep Navy #293C87 Session Window Block Tile */
#privacy-protocol .container > div:not([class]) > p:nth-child(5) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r5' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r5)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='34' y='32' width='44' height='44' fill='%2356B7A5'/%3E%3Crect x='46' y='32' width='5' height='44' fill='%23FFFFFF'/%3E%3Crect x='49' y='49' width='29' height='27' fill='%23293C87'/%3E%3Ccircle cx='63.5' cy='62.5' r='7' stroke='%23CBD8FC' stroke-width='1.6'/%3E%3Cpath d='M63.5 58.5V62.5L66.5 64.5' stroke='%23CBD8FC' stroke-width='1.6' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(5)::before {
  content: "Synchronized Study Windows";
}

/* Resource 6: Geometric Royal Blue #6D86F5 + Gold #FFCF3E + Deep Indigo #30366B Vault Block Tile */
#privacy-protocol .container > div:not([class]) > p:nth-child(6) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='116' height='120' viewBox='0 0 116 120' fill='none'%3E%3Cdefs%3E%3Cfilter id='r6' x='-12%25' y='-8%25' width='124%25' height='128%25'%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='4' flood-color='%237286C3' flood-opacity='0.16'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23r6)'%3E%3Crect x='4' y='2' width='104' height='104' rx='10' fill='%23FFFFFF'/%3E%3Crect x='34' y='32' width='28' height='28' fill='%236D86F5'/%3E%3Crect x='46' y='42' width='26' height='26' fill='%23FFCF3E'/%3E%3Crect x='54' y='52' width='24' height='24' fill='%2330366B'/%3E%3Ccircle cx='66' cy='62' r='3' fill='%23FFFFFF'/%3E%3Cpath d='M66 64.5V69' stroke='%23FFFFFF' stroke-width='2.2' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E");
}
#privacy-protocol .container > div:not([class]) > p:nth-child(6)::before {
  content: "AES-256 Credential Encryption";
}

/* ==========================================================================
   Section 7: #zero-ai-standard — Figma #7:223 Split Layout & Turnitin 0% AI SVG
   ========================================================================== */
#zero-ai-standard {
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
  padding: 104px 0 128px;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#zero-ai-standard > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  column-gap: 64px;
  align-items: start;
}

#zero-ai-standard .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#zero-ai-standard .section-title {
  color: #33366D;
  text-align: left;
  margin-bottom: 18px;
}

#zero-ai-standard .section-lead {
  text-align: left;
  margin: 0;
  max-width: 450px;
}

#zero-ai-standard .answer-box {
  grid-column: 1;
  grid-row: 2;
  max-width: 450px;
  margin-bottom: 22px;
}

/* Left Column Bottom: Animated Turnitin 0% AI & Human Authorship Scanner SVG */
#zero-ai-standard > .container::after {
  content: "";
  grid-column: 1;
  grid-row: 3;
  width: 100%;
  max-width: 450px;
  height: 270px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  animation: constellation-float 6.5s ease-in-out infinite;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 450 270' fill='none'%3E%3Cdefs%3E%3Cfilter id='aish' x='-10%25' y='-10%25' width='120%25' height='125%25'%3E%3CfeDropShadow dx='0' dy='15' stdDeviation='11' flood-color='%234D609B' flood-opacity='0.09'/%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='3.5' flood-color='%236A7CB9' flood-opacity='0.15'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23aish)'%3E%3Crect x='10' y='12' width='425' height='232' rx='5' fill='%23FFFFFF'/%3E%3Crect x='28' y='28' width='46' height='46' rx='5' fill='%23F2FAF6'/%3E%3Ctext x='51' y='56' text-anchor='middle' font-family='Inter,sans-serif' font-size='15' font-weight='800' fill='%2356A87B'%3E0%25%3C/text%3E%3Ctext x='88' y='45' font-family='Inter,sans-serif' font-size='11' font-weight='500' fill='%23B2BAD4'%3ETURNITIN AI & GPTZERO VERIFICATION%3C/text%3E%3Ctext x='88' y='64' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%2333366D'%3E100%25 Human Scholar Manuscript%3C/text%3E%3Cline x1='28' y1='88' x2='417' y2='88' stroke='%23F0F3F9'/%3E%3Ctext x='28' y='112' font-family='Inter,sans-serif' font-size='11' font-weight='600' fill='%2333366D'%3EHuman Burstiness & Syntactic Variance%3C/text%3E%3Ctext x='417' y='112' text-anchor='end' font-family='Inter,sans-serif' font-size='11' font-weight='700' fill='%2356A87B'%3E99.4%25 Authentic%3C/text%3E%3Crect x='28' y='120' width='389' height='8' rx='4' fill='%23F0F3F9'/%3E%3Crect x='28' y='120' width='378' height='8' rx='4' fill='%2356A87B'/%3E%3Ctext x='28' y='152' font-family='Inter,sans-serif' font-size='11' font-weight='600' fill='%2333366D'%3EPeer-Reviewed DOI Citations (PubMed / JSTOR / IEEE)%3C/text%3E%3Ctext x='417' y='152' text-anchor='end' font-family='Inter,sans-serif' font-size='11' font-weight='700' fill='%23179DD2'%3EVerified Primary%3C/text%3E%3Crect x='28' y='160' width='389' height='8' rx='4' fill='%23F0F3F9'/%3E%3Crect x='28' y='160' width='389' height='8' rx='4' fill='%23179DD2'/%3E%3Crect x='28' y='184' width='389' height='42' rx='5' fill='%23F8FAFD' stroke='%23E9EDF4'/%3E%3Ctext x='44' y='209' font-family='Inter,sans-serif' font-size='11.5' font-weight='600' fill='%235355A2'%3E✓ Full Word / Google Docs Version History Included ›%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* Right Column: 2x2 Staggered Floating Constellation Cards */
#zero-ai-standard .container > div:not([class]) {
  grid-column: 2;
  grid-row: 1 / 4;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
  margin-top: 0;
  align-items: start;
}

#zero-ai-standard .container > div:not([class]) > p {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 24px 22px;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.48em;
  color: #6C7192;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

#zero-ai-standard .container > div:not([class]) > p:nth-child(even) {
  transform: translateY(40px);
}

#zero-ai-standard .container > div:not([class]) > p:hover {
  transform: translateY(-4px);
}

#zero-ai-standard .container > div:not([class]) > p:nth-child(even):hover {
  transform: translateY(36px);
}

/* Exact Figma #7:228 Floating White App-Tile Icons for #zero-ai-standard (4 Unique Human-Authorship Tiles) */
#zero-ai-standard .container > div:not([class]) > p::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 16px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/* Card 1: Turnitin AI & GPTZero Ban — Coral AI Bot Prohibition Badge */
#zero-ai-standard .container > div:not([class]) > p:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%23EE777B'/%3E%3Crect x='29' y='21' width='18' height='13' rx='3' fill='%23FFFFFF'/%3E%3Ccircle cx='34' cy='27' r='2' fill='%23EE777B'/%3E%3Ccircle cx='42' cy='27' r='2' fill='%23EE777B'/%3E%3Cpath d='M26 16L50 40' stroke='%239E2A31' stroke-width='3.2' stroke-linecap='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%23EE777B'%3ENO AI BOTS%3C/text%3E%3C/svg%3E");
}

/* Card 2: JSTOR, PubMed & IEEE Sources — Sky-Blue Peer-Reviewed Journal Crest */
#zero-ai-standard .container > div:not([class]) > p:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='22' y='11' width='32' height='34' rx='5' fill='%23179DD2'/%3E%3Cpath d='M29 19H47M29 25H47M29 31H39' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='46' cy='35' r='5' fill='%237CD2F6'/%3E%3Cpath d='M44 35L45.5 36.5L48.5 33.5' stroke='%23179DD2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='800' letter-spacing='0.02em' fill='%23179DD2'%3EPEER REVIEW%3C/text%3E%3C/svg%3E");
}

/* Card 3: Natural Burstiness & Version History — Royal-Purple Revision Timeline Badge */
#zero-ai-standard .container > div:not([class]) > p:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%2362449D'/%3E%3Cpath d='M26 34L32 23L39 30L49 18' stroke='%23FFFFFF' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='23' r='3' fill='%23F2BA41'/%3E%3Ccircle cx='39' cy='30' r='3' fill='%237CD2F6'/%3E%3Ccircle cx='49' cy='18' r='3' fill='%2379C69C'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='800' letter-spacing='0.02em' fill='%2362449D'%3EDOC HISTORY%3C/text%3E%3C/svg%3E");
}

/* Card 4: Voice Matching & Rubric Calibration — Emerald-Mint Fountain Nib Stamp */
#zero-ai-standard .container > div:not([class]) > p:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%2356A87B'/%3E%3Cpath d='M38 16L46 28L42 39H34L30 28L38 16Z' fill='%23FFFFFF'/%3E%3Ccircle cx='38' cy='28' r='2.5' fill='%2356A87B'/%3E%3Cpath d='M38 16V25.5' stroke='%2356A87B' stroke-width='2'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.3' font-weight='800' letter-spacing='0.02em' fill='%2356A87B'%3EHUMAN PROSE%3C/text%3E%3C/svg%3E");
}

/* ==========================================================================
   Section 8: #proctored-exams — Exact Figma #10:749 ("Clearbit hero")
   ========================================================================== */
#proctored-exams {
  background: #FCFCFF;
  padding: 88px 0 112px;
  font-family: 'Inter', sans-serif;
  position: relative;
  overflow: hidden;
  border-top: 1px solid #EEF5FB;
}

/* Figma #10:750 Top Header Accent Line */
#proctored-exams::before {
  content: "";
  position: absolute;
  top: 0;
  right: 14%;
  width: 124px;
  height: 3px;
  background: #A9D9F9;
}

#proctored-exams > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  column-gap: 56px;
  row-gap: 44px;
  align-items: center;
}

/* Left Column Row 1: Exact Figma #10:774 3D Isometric Data Platform Illustration */
#proctored-exams > .container::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  height: 490px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg width='202' height='215' viewBox='0 0 202 215' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_10_774)'%3E%3Cpath d='M0 91L68 52L187 121L185 132L53 209L0 178V91Z' fill='%23ECF9FF'/%3E%3Cpath d='M46 126L175 51L202 67L73 142L46 126Z' fill='%23E0F3FA'/%3E%3Cpath d='M45 150L150 89L183 108L78 169L45 150Z' fill='%23ECF9FD'/%3E%3Cg filter='url(%23filter0_f_10_774)'%3E%3Cpath d='M64 82.5581L112.632 70L169 87.7907L121.474 115L64 82.5581Z' fill='%239DD1E1' fill-opacity='0.266667'/%3E%3C/g%3E%3Cpath d='M70.5178 78.2C65.8274 80.8899 65.8274 84.5884 70.5178 89.2957L104.69 109.47C111.391 114.177 118.426 114.177 125.797 109.47L161.98 88.287C167.34 84.2522 167.34 80.8899 161.98 78.2L122.782 57.0174C118.091 54.3275 113.401 54.3275 108.711 57.0174L70.5178 78.2Z' fill='%23D6EAF4'/%3E%3Cpath d='M70.5178 74.2C65.8274 76.8899 65.8274 79.9159 70.5178 83.2783L104.69 105.47C111.391 110.177 118.426 110.177 125.797 105.47L161.98 84.287C167.34 80.2522 167.34 76.8899 161.98 74.2L122.782 53.0174C118.091 50.3275 113.401 50.3275 108.711 53.0174L70.5178 74.2Z' fill='%23F2FBFF'/%3E%3Cpath d='M70.5178 74.5111C65.8274 77.237 65.8274 80.3037 70.5178 83.7111L93.6345 97L161.98 84.7333C167.34 80.6444 167.34 77.237 161.98 74.5111L122.782 53.0444C118.091 50.3185 113.401 50.3185 108.711 53.0444L70.5178 74.5111Z' fill='url(%23paint0_linear_10_774)'/%3E%3Cpath d='M93 77L115 73L141 86L123 95L93 77Z' fill='%2366BCE2' fill-opacity='0.196078'/%3E%3Cpath d='M112 44L130 34V76L112 86V44Z' fill='%23D1F1FC'/%3E%3Cpath d='M94 34L112 44V86L94 76V34Z' fill='white'/%3E%3Cpath d='M130 63L139 58V84L130 89V63Z' fill='%23C5EBF8'/%3E%3Cpath d='M118 56L130 63V89L118 82V56Z' fill='white'/%3E%3Cpath d='M143 109L161 121' stroke='%238FE5F5'/%3E%3Cpath d='M121 74L127 78.5V83L121 78.5V74ZM131 78.5L137 74V78.5L131 83V78.5Z' fill='%236FCBE6'/%3E%3Cpath d='M121 68L127 72.5V77L121 72.5V68ZM131 72.5L137 68V72.5L131 77V72.5Z' fill='%236FCBE6'/%3E%3Cpath d='M121 62L127 66.5V71L121 66.5V62ZM131 66.5L137 62V66.5L131 71V66.5Z' fill='%236FCBE6'/%3E%3Cpath d='M120 56L128 51L137 57L130 61L120 56Z' fill='%23A3EBFA'/%3E%3Cpath d='M118 56L128 50L139 57L130 63L118 56Z' fill='%2357D4F5'/%3E%3Cpath d='M115 71.4L119 69.6V73.2L115 75V71.4ZM122 67.8L126 66V69.6L122 71.4V67.8Z' fill='%23A9E5F7'/%3E%3Cpath d='M115 64.4L119 62.6V66.2L115 68V64.4ZM122 60.8L126 59V62.6L122 64.4V60.8Z' fill='%23A9E5F7'/%3E%3Cpath d='M115 57.4L119 55.6V59.2L115 61V57.4ZM122 53.8L126 52V55.6L122 57.4V53.8Z' fill='%23A9E5F7'/%3E%3Cpath d='M115 50.4L119 48.6V52.2L115 54V50.4ZM122 46.8L126 45V48.6L122 50.4V46.8Z' fill='%23A9E5F7'/%3E%3Cpath d='M97 67.5L100.667 69.1V72.2059L97 70.6059V67.5ZM104.333 70.7941L108 72.3941V75.5L104.333 73.9V70.7941Z' fill='%23B9E9F6'/%3E%3Cpath d='M97 62L100.667 63.6V66.7059L97 65.1059V62ZM104.333 65.2941L108 66.8941V70L104.333 68.4V65.2941Z' fill='%2387D4EB'/%3E%3Cpath d='M97 56.5L100.667 58.1V61.2059L97 59.6059V56.5ZM104.333 59.7941L108 61.3941V64.5L104.333 62.9V59.7941Z' fill='%2387D4EB'/%3E%3Cpath d='M97 51L100.667 52.6V55.7059L97 54.1059V51ZM104.333 54.2941L108 55.8941V59L104.333 57.4V54.2941Z' fill='%2387D4EB'/%3E%3Cpath d='M97 45.5L100.667 47.1V50.2059L97 48.6059V45.5ZM104.333 48.7941L108 50.3941V53.5L104.333 51.9V48.7941Z' fill='%2387D4EB'/%3E%3Cpath d='M97 40L100.667 41.6V44.7059L97 43.1059V40ZM104.333 43.2941L108 44.8941V48L104.333 46.4V43.2941Z' fill='%2387D4EB'/%3E%3Cmask id='stroke0_10_774' fill='white'%3E%3Cpath d='M111 27L95 34L111 43L127 34L111 27Z'/%3E%3C/mask%3E%3Cpath d='M95 34L111 27L127 34L111 43L95 34Z' stroke-width='2' stroke='%23C7F4FF' mask='url(%23stroke0_10_774)'/%3E%3Cpath d='M94 34L112 25L130 34L112 45L94 34Z' fill='url(%23paint1_linear_10_774)'/%3E%3Cpath d='M10.2444 44.7363L51.7667 85.8352M55.1333 46.6044L116.856 106.385L185.311 41M8 160.56L80.9444 89.5714M85.4333 207.264L130.708 163.949M130.708 163.949L183.067 113.857L210 140.011M130.708 163.949L121.344 154.956M130.708 163.949L179.7 211M45.0333 179.242L64.1111 160.56' stroke-width='0.6' stroke='%23DFF7FA'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_f_10_774' x='59' y='65' width='115' height='55' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='2.5' result='effect1_foregroundBlur_10_774'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_10_774' x1='67' y1='51' x2='67' y2='97' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2361D9FB'/%3E%3Cstop offset='1' stop-color='%23269BE9'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_10_774' x1='94' y1='25' x2='130' y2='25' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2327B9EB'/%3E%3Cstop offset='0.6' stop-color='%23A4EDFF'/%3E%3Cstop offset='1' stop-color='%23E9FBFF'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_10_774'%3E%3Crect width='202' height='215' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

#proctored-exams > .container::after {
  display: none !important;
}

/* Right Column Row 1: Figma #10:751 Heading + #10:752 Copy + #10:753 Sky-Blue CTA Button */
#proctored-exams .section-header {
  grid-column: 2;
  grid-row: 1;
  text-align: left;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#proctored-exams .section-tag {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 10px 0 !important;
  color: #8AA8B7 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#proctored-exams .section-title {
  color: #182E39;
  font-size: clamp(2.1rem, 3.2vw, 2.75rem);
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: -0.02em;
  text-align: left;
  margin: 0 0 20px 0;
  max-width: 480px;
}

#proctored-exams .section-lead {
  color: #44515B;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55em;
  text-align: left;
  margin: 0 0 28px 0;
  max-width: 440px;
}

/* Figma #10:753 "Get Started" Sky-Blue Gradient CTA Button - Clickable Anchor linking to #contact-cta */
#proctored-exams .section-header::after {
  display: none !important;
}

.exam-get-started-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 28px;
  border-radius: 5px;
  background: linear-gradient(180deg, rgba(57, 185, 255, 1) 0%, rgba(20, 139, 232, 1) 100%);
  color: #FFFFFF !important;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0px 8px 18px rgba(20, 139, 232, 0.22);
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.exam-get-started-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0px 10px 22px rgba(20, 139, 232, 0.32);
  color: #FFFFFF !important;
  text-decoration: none;
}

/* Row 2 Full-Width: Figma #10:755-#10:770 Monochrome Logo Bar + #10:772-#10:773 Centered Summary */
#proctored-exams .answer-box {
  grid-column: 1 / -1;
  grid-row: 2;
  max-width: 860px;
  width: 100%;
  margin: 0 auto 12px;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: center;
}

/* Figma #10:755-#10:770 Monochrome Logo Strip + #10:772 Centered Sub-Headline */
#proctored-exams .answer-box::before {
  content: "";
  display: block;
  width: 100%;
  height: 128px;
  margin: 0 auto 10px;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='820' height='128' viewBox='0 0 820 128' fill='none'%3E%3Cg transform='translate(65, 8)'%3E%3Cg transform='translate(0, 4)'%3E%3Ccircle cx='12' cy='12' r='10' stroke='%238AA8B7' stroke-width='2'/%3E%3Cpath d='M7 10H17M7 14H17' stroke='%238AA8B7' stroke-width='2' stroke-linecap='round'/%3E%3Ctext x='29' y='17' font-family='Inter,sans-serif' font-size='17' font-weight='700' fill='%238AA8B7'%3ECanvas%3C/text%3E%3C/g%3E%3Cg transform='translate(142, 4)'%3E%3Ccircle cx='8' cy='7' r='3.5' fill='%238AA8B7'/%3E%3Ccircle cx='3.5' cy='15' r='3.5' fill='%238AA8B7'/%3E%3Ccircle cx='12.5' cy='15' r='3.5' fill='%238AA8B7'/%3E%3Ctext x='22' y='17' font-family='Inter,sans-serif' font-size='17' font-weight='500' fill='%238AA8B7'%3EMyMathLab%3C/text%3E%3C/g%3E%3Cg transform='translate(298, 2)'%3E%3Crect x='0' y='2' width='22' height='22' rx='3' fill='%238AA8B7'/%3E%3Cpath d='M5 7V15M9 6V16M13 6V16M17 7V15M5 18C8 20 14 20 17 18' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round'/%3E%3Ctext x='30' y='18' font-family='Inter,sans-serif' font-size='13.5' font-weight='700' letter-spacing='0.05em' fill='%238AA8B7'%3EHONORLOCK%3C/text%3E%3C/g%3E%3Cg transform='translate(466, 2)'%3E%3Cellipse cx='42' cy='12' rx='36' ry='16' transform='rotate(-14 42 12)' stroke='%23DCEBF0' stroke-width='1.5'/%3E%3Ctext x='0' y='18' font-family='Inter,sans-serif' font-size='15' font-weight='700' letter-spacing='0.03em' fill='%238AA8B7'%3ERESPONDUS%3C/text%3E%3C/g%3E%3Cg transform='translate(606, 4)'%3E%3Ctext x='0' y='17' font-family='Inter,sans-serif' font-size='17.5' font-weight='700' fill='%238AA8B7'%3EProctorU%3C/text%3E%3C/g%3E%3C/g%3E%3Ctext x='410' y='108' text-anchor='middle' font-family='Inter,sans-serif' font-size='28' font-weight='700' fill='%23232B38'%3EGet the full exam protocol, instantly%3C/text%3E%3C/svg%3E");
}

/* Figma #10:773 Centered Summary Copy */
#proctored-exams .answer-box p {
  max-width: 660px;
  margin: 0 auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #73808C;
  text-shadow: 0 2px 10px rgba(24, 46, 57, 0.06);
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.65em;
  text-align: center;
}

/* Row 3 Full-Width: Clean 3x2 Architectural Grid Preserving All 6 Exam Paragraphs */
#proctored-exams .container > div:not([class]) {
  grid-column: 1 / -1;
  grid-row: 3;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px 40px;
  margin-top: 12px;
  padding-top: 36px;
  border-top: 1px solid #EBF3F9;
  align-items: start;
}

#proctored-exams .container > div:not([class]) > p {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.62em;
  color: #73808C;
  text-shadow: 0 2px 8px rgba(24, 46, 57, 0.05);
  box-shadow: none;
  transform: none !important;
}

#proctored-exams .container > div:not([class]) > p:hover {
  transform: none !important;
}

/* Clean Figma #10:749 Sky-Blue & Slate-Navy Column Headers for the 6 Exam Paragraphs */
#proctored-exams .container > div:not([class]) > p::before {
  display: block;
  width: auto;
  height: auto;
  margin: 0 0 10px 0;
  padding: 0 0 10px 0;
  background: transparent;
  border: none;
  border-bottom: 2px solid #D8EFFC;
  border-radius: 0;
  box-shadow: 0 2px 8px -2px rgba(57, 185, 255, 0.22);
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: #182E39;
  text-shadow: 0 2px 10px rgba(24, 46, 57, 0.08);
}

#proctored-exams .container > div:not([class]) > p:nth-child(1)::before {
  content: "01. Timed Portal Quizzes & MyMathLab";
}

#proctored-exams .container > div:not([class]) > p:nth-child(2)::before {
  content: "02. Honest Webcam Proctoring Protocol";
}

#proctored-exams .container > div:not([class]) > p:nth-child(3)::before {
  content: "03. Live Side-by-Side Co-Pilot Guidance";
}

#proctored-exams .container > div:not([class]) > p:nth-child(4)::before {
  content: "04. Midterm & Final Grade Protection";
}

#proctored-exams .container > div:not([class]) > p:nth-child(5)::before {
  content: "05. 360° Room Scan & Desk Setup Coaching";
}

#proctored-exams .container > div:not([class]) > p:nth-child(6)::before {
  content: "06. Custom Study Sheets & Practice Prep";
}

/* ==========================================================================
   Section 9: #grade-guarantee — Figma #11:3 + #7:223 SLA Certificate & 4 Cards
   ========================================================================== */
#grade-guarantee {
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
  padding: 104px 0 116px;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#grade-guarantee > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  column-gap: 64px;
  align-items: center;
}

#grade-guarantee .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  margin-bottom: 18px;
}

#grade-guarantee .section-title {
  color: #33366D;
  text-align: left;
  margin-bottom: 18px;
}

#grade-guarantee .section-lead {
  text-align: left;
  margin: 0;
  max-width: 460px;
}

#grade-guarantee .answer-box {
  grid-column: 1;
  grid-row: 2;
  max-width: 460px;
  margin-bottom: 0;
}

/* Top Right Split: Animated Written SLA A/B Grade Guarantee Certificate SVG */
#grade-guarantee > .container::after {
  content: "";
  grid-column: 2;
  grid-row: 1 / 3;
  width: 100%;
  height: 270px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  animation: constellation-float 6s ease-in-out infinite;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 270' fill='none'%3E%3Cdefs%3E%3Cfilter id='gsh' x='-10%25' y='-10%25' width='120%25' height='125%25'%3E%3CfeDropShadow dx='0' dy='15' stdDeviation='11' flood-color='%234D609B' flood-opacity='0.09'/%3E%3CfeDropShadow dx='0' dy='7' stdDeviation='3.5' flood-color='%236A7CB9' flood-opacity='0.15'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23gsh)'%3E%3Crect x='14' y='12' width='492' height='236' rx='6' fill='%23FFFFFF'/%3E%3Crect x='14' y='12' width='492' height='5' rx='2.5' fill='%234822DC'/%3E%3Ccircle cx='66' cy='68' r='24' fill='%23FFF9EB' stroke='%23F2BA41' stroke-width='2'/%3E%3Ctext x='66' y='74' text-anchor='middle' font-family='Inter,sans-serif' font-size='16' font-weight='800' fill='%23D99B1E'%3EA/B%3C/text%3E%3Ctext x='106' y='58' font-family='Inter,sans-serif' font-size='11' font-weight='500' fill='%23B2BAD4'%3EWRITTEN SERVICE-LEVEL AGREEMENT (SLA)%3C/text%3E%3Ctext x='106' y='79' font-family='Inter,sans-serif' font-size='17' font-weight='700' fill='%2333366D'%3E80%25–100%25 Final Grade Protection%3C/text%3E%3Cline x1='34' y1='108' x2='486' y2='108' stroke='%23F0F3F9'/%3E%3Crect x='34' y='124' width='140' height='98' rx='5' fill='%23F8FAFD' stroke='%23E9EDF4'/%3E%3Ctext x='104' y='154' text-anchor='middle' font-family='Inter,sans-serif' font-size='22' font-weight='800' fill='%234822DC'%3E90%25+%3C/text%3E%3Ctext x='104' y='176' text-anchor='middle' font-family='Inter,sans-serif' font-size='11.5' font-weight='700' fill='%2333366D'%3EA-Grade Target%3C/text%3E%3Ctext x='104' y='196' text-anchor='middle' font-family='Inter,sans-serif' font-size='10.5' font-weight='500' fill='%236C7192'%3EPoint-Weight Audit%3C/text%3E%3Crect x='190' y='124' width='140' height='98' rx='5' fill='%23F8FAFD' stroke='%23E9EDF4'/%3E%3Ctext x='260' y='154' text-anchor='middle' font-family='Inter,sans-serif' font-size='22' font-weight='800' fill='%2356A87B'%3E24h%3C/text%3E%3Ctext x='260' y='176' text-anchor='middle' font-family='Inter,sans-serif' font-size='11.5' font-weight='700' fill='%2333366D'%3EFree Revisions%3C/text%3E%3Ctext x='260' y='196' text-anchor='middle' font-family='Inter,sans-serif' font-size='10.5' font-weight='500' fill='%236C7192'%3ERubric Rewrites%3C/text%3E%3Crect x='346' y='124' width='140' height='98' rx='5' fill='%23F8FAFD' stroke='%23E9EDF4'/%3E%3Ctext x='416' y='154' text-anchor='middle' font-family='Inter,sans-serif' font-size='22' font-weight='800' fill='%23179DD2'%3E100%25%3C/text%3E%3Ctext x='416' y='176' text-anchor='middle' font-family='Inter,sans-serif' font-size='11.5' font-weight='700' fill='%2333366D'%3EMoney-Back SLA%3C/text%3E%3Ctext x='416' y='196' text-anchor='middle' font-family='Inter,sans-serif' font-size='10.5' font-weight='500' fill='%236C7192'%3E3–5 Business Days%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* Bottom Row: 4 Floating Guarantee Cards */
#grade-guarantee .container > div:not([class]) {
  grid-column: 1 / -1;
  grid-row: 3;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin-top: 44px;
}

#grade-guarantee .container > div:not([class]) > p {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 24px 20px;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.48em;
  color: #6C7192;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease;
}

#grade-guarantee .container > div:not([class]) > p:hover {
  transform: translateY(-4px);
}

/* Exact Figma #7:228 Floating White App-Tile Icons for #grade-guarantee (4 Unique SLA Tiles) */
#grade-guarantee .container > div:not([class]) > p::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 16px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/* Card 1: Written A/B Contract — Sky-Blue Sealed SLA Pact */
#grade-guarantee .container > div:not([class]) > p:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='22' y='10' width='32' height='35' rx='5' fill='%23179DD2'/%3E%3Cpath d='M30 22L36 28L46 18' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='29' y='34' width='18' height='3' rx='1.5' fill='%237CD2F6'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.04em' fill='%23179DD2'%3EA/B PACT%3C/text%3E%3C/svg%3E");
}

/* Card 2: 24-Hour Free Rubric Revisions — Royal-Purple Rapid Cycle Emblem */
#grade-guarantee .container > div:not([class]) > p:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%2362449D'/%3E%3Cpath d='M30 28C30 23.6 33.6 20 38 20C41 20 43.6 21.6 45 24M46 28C46 32.4 42.4 36 38 36C35 36 32.4 34.4 31 32' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round'/%3E%3Cpath d='M42 24H46V20M34 32H30V36' stroke='%23F2BA41' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.4' font-weight='800' letter-spacing='0.02em' fill='%2362449D'%3E24H REWRITE%3C/text%3E%3C/svg%3E");
}

/* Card 3: Bi-Weekly Milestone Escrow — Emerald-Mint Verified Vault Card */
#grade-guarantee .container > div:not([class]) > p:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='19' y='14' width='38' height='27' rx='5' fill='%2356A87B'/%3E%3Crect x='19' y='20' width='38' height='5' fill='%23337A54'/%3E%3Crect x='25' y='30' width='10' height='5' rx='1.5' fill='%23FFFFFF'/%3E%3Ccircle cx='48' cy='32.5' r='3.5' fill='%23F2BA41'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='800' letter-spacing='0.02em' fill='%2356A87B'%3EESCROW PAY%3C/text%3E%3C/svg%3E");
}

/* Card 4: 100% Money-Back Refund Clause — Gold & Indigo Star Seal */
#grade-guarantee .container > div:not([class]) > p:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%23F2BA41'/%3E%3Cpath d='M38 16L41.3 22.8L48.8 23.9L43.4 29.1L44.7 36.5L38 33L31.3 36.5L32.6 29.1L27.2 23.9L34.7 22.8L38 16Z' fill='%23FFFFFF'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.3' font-weight='800' letter-spacing='0.02em' fill='%23D99B1E'%3E100%25 REFUND%3C/text%3E%3C/svg%3E");
}

/* ==========================================================================
   Section 10: #comparison — Clean Enterprise SaaS Matrix (Zero Cream/Dashed Lines)
   ========================================================================== */
#comparison {
  background: #FFFFFF;
  padding: 100px 0 112px;
  font-family: 'Inter', sans-serif;
}

.comparison-wrapper {
  overflow-x: auto;
  margin-top: 36px;
  border-radius: 6px;
  border: 1px solid #E9EDF4;
  box-shadow: 0px 14px 36px 0px rgba(40, 62, 114, 0.10);
  background: #FFFFFF;
}

.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: #FFFFFF;
  text-align: left;
  font-family: 'Inter', sans-serif;
  font-size: 14.5px;
  color: #6C7192;
}

.comparison-table th,
.comparison-table td {
  padding: 18px 24px;
  border-bottom: 1px solid #EEF2F8;
}

.comparison-table tr:last-child td {
  border-bottom: none;
}

.comparison-table td strong {
  color: #33366D;
  font-weight: 700;
}

.comparison-table th {
  background: #F8FAFD;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0.01em;
  color: #33366D;
  border-bottom: 1px solid #E9EDF4;
}

.comparison-table th.highlight-col,
.comparison-table td.highlight-col {
  background: #FAFBFD;
  border-left: 1px solid #EEF2F8;
  border-right: 1px solid #EEF2F8;
  font-weight: 600;
}

.comparison-table th.highlight-col {
  border-top: 2px solid #30366B;
  color: #30366B;
  font-size: 14px;
}

.badge-yes {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #30366B;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  font-size: 14px;
  font-weight: 600;
}

.badge-no {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #7D86A5;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  font-size: 14px;
  font-weight: 400;
}

#comparison .container > aside {
  margin-top: 32px;
}

#comparison .container > aside > article::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 14px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

#comparison .container > aside > article:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%23EE777B'/%3E%3Cpath d='M32 22L44 34M44 22L32 34' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.4' font-weight='800' letter-spacing='0.02em' fill='%23EE777B'%3EFREELANCER%3C/text%3E%3C/svg%3E");
}

#comparison .container > aside > article:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Cpath d='M38 10L21 16.5V27C21 36.5 28.2 44.5 38 47C47.8 44.5 55 36.5 55 27V16.5L38 10Z' fill='%234822DC'/%3E%3Cpath d='M31 28.5L36 33.5L46 23.5' stroke='%23FFFFFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.2' font-weight='800' letter-spacing='0.02em' fill='%234822DC'%3EMANAGED SLA%3C/text%3E%3C/svg%3E");
}

#comparison .container > div:not([class]) {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 24px;
}

#comparison .container > div:not([class]) > p {
  background: #F8FAFD;
  border: 1px solid #E9EDF4;
  border-radius: 6px;
  padding: 20px 22px;
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5em;
  color: #6C7192;
}

/* ==========================================================================
   Section 11: #case-studies — Figma #3:169 + #11:3 Student Profiles & Metrics
   ========================================================================== */
#case-studies {
  background: radial-gradient(circle at 43% 43%, rgba(239, 243, 250, 1) 0%, rgba(250, 252, 253, 1) 100%);
  padding: 104px 0 116px;
  font-family: 'Inter', sans-serif;
}

#case-studies .answer-box {
  max-width: 720px;
  margin: 0 auto 36px;
  text-align: center;
}

#case-studies .answer-box p {
  text-align: center;
}

#case-studies .container > aside:first-of-type {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 16px;
}

#case-studies .container > aside:last-of-type {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
  margin-top: 26px;
}

/* Exact Figma #7:228 Floating White App-Tile Icons on All 5 Case Study Cards */
#case-studies .container > aside > article::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 16px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/* 1. Healthcare Worker — BSN Statistics (#EE777B Coral Clinical Heartbeat Badge) */
#case-studies .container > aside:first-of-type > article:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23EE777B'/%3E%3Cpath d='M25 28H31L34 19L39 36L42 28H51' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%23EE777B'%3EBSN 94.8%25%3C/text%3E%3C/svg%3E");
}

/* 2. Business Manager — Online MBA Finance (#62449D Royal Purple Executive Portfolio) */
#case-studies .container > aside:first-of-type > article:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='15' width='36' height='28' rx='5' fill='%2362449D'/%3E%3Cpath d='M31 15V12C31 10.9 31.9 10 33 10H43C44.1 10 45 10.9 45 12V15' stroke='%2362449D' stroke-width='2.6'/%3E%3Cpath d='M20 26H56' stroke='%238866C9' stroke-width='2'/%3E%3Crect x='34' y='23' width='8' height='6' rx='1.5' fill='%23F2BA41'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%2362449D'%3EMBA 93.2%25%3C/text%3E%3C/svg%3E");
}

/* 3. College Senior — General Ed College Algebra (#179DD2 Sky Blue Function Graph Crest) */
#case-studies .container > aside:first-of-type > article:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23179DD2'/%3E%3Cpath d='M26 36C31 36 33 20 38 20C43 20 45 36 50 36' stroke='%23FFFFFF' stroke-width='2.8' stroke-linecap='round'/%3E%3Cline x1='26' y1='36' x2='50' y2='36' stroke='%237CD2F6' stroke-width='1.8' stroke-linecap='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='800' letter-spacing='0.02em' fill='%23179DD2'%3EMATH 96.4%25%3C/text%3E%3C/svg%3E");
}

/* 4. Active Military Service — Cyber Security (#4854B4 Indigo Military Chevron & Star) */
#case-studies .container > aside:last-of-type > article:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Cpath d='M38 10L21 16V27C21 36.5 28.2 44.5 38 47C47.8 44.5 55 36.5 55 27V16L38 10Z' fill='%234854B4'/%3E%3Cpath d='M38 17L40.5 22.2L46.2 23L42.1 27L43.1 32.7L38 30L32.9 32.7L33.9 27L29.8 23L35.5 22.2L38 17Z' fill='%23FFFFFF'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.4' font-weight='800' letter-spacing='0.02em' fill='%234854B4'%3EUSAF CYBER%3C/text%3E%3C/svg%3E");
}

/* 5. Community College Transfer — Business Calculus (#56A87B Emerald-Mint Mortarboard) */
#case-studies .container > aside:last-of-type > article:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Cpath d='M16 24L38 13L60 24L38 35L16 24Z' fill='%2356A87B'/%3E%3Cpath d='M25 29V38C25 41.5 51 41.5 51 38V29' fill='%233D8B62'/%3E%3Cpath d='M56 26V37' stroke='%23F2BA41' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='56' cy='38' r='2.2' fill='%23F2BA41'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.04em' fill='%2356A87B'%3EGPA 3.85%3C/text%3E%3C/svg%3E");
}

/* Outcome Metrics Bar at Bottom of #case-studies (Matching Figma #11:3 Outcomes Bar) */
#case-studies .container > div:not([class]) {
  margin-top: 32px;
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  padding: 28px 32px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 32px;
  align-items: center;
}

#case-studies .container > div:not([class]) > p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5em;
  color: #6C7192;
}

#case-studies .container > div:not([class]) > p:first-child {
  border-right: 1px solid #E9EDF4;
  padding-right: 28px;
}

/* ==========================================================================
   Section 12: #pricing-calculator — Clean Figma Enterprise Pricing Tiers
   ========================================================================== */
#pricing-calculator {
  background: linear-gradient(180deg, rgba(244, 247, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
  padding: 104px 0 116px;
  font-family: 'Inter', sans-serif;
}

#pricing-calculator .answer-box {
  max-width: 720px;
  margin: 0 auto 36px;
  text-align: center;
}

#pricing-calculator .answer-box p {
  text-align: center;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 24px;
  align-items: stretch;
}

.pricing-card {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  padding: 36px 28px;
  display: flex;
  flex-direction: column;
  position: relative;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 20px 34px 0px rgba(77, 96, 155, 0.13), 0px 10px 12px 0px rgba(106, 124, 185, 0.18);
}

/* Exact Figma #7:228 Floating White App-Tile Icons at Top of Each Pricing Card */
.pricing-card::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 18px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/* Pricing Tier 1: Undergraduate Gen-Ed — Sky-Blue Core Curriculum Badge */
.pricing-card:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23179DD2'/%3E%3Cpath d='M28 20H48V36H28V20Z' fill='%23FFFFFF' fill-opacity='0.2'/%3E%3Cpath d='M38 19V37M28 22C31 20.5 35 20.5 38 22C41 20.5 45 20.5 48 22V35C45 33.5 41 33.5 38 35C35 33.5 31 33.5 28 35V22Z' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.4' font-weight='800' letter-spacing='0.02em' fill='%23179DD2'%3EGEN-ED TIER%3C/text%3E%3C/svg%3E");
}

/* Pricing Tier 2: Quantitative STEM & Nursing — Deep Indigo Flagship Star Emblem */
.pricing-card:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%234822DC'/%3E%3Cpath d='M38 16L41.1 22.4L48.2 23.4L43 28.4L44.2 35.5L38 32.1L31.8 35.5L33 28.4L27.8 23.4L34.9 22.4L38 16Z' fill='%23F2BA41'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.6' font-weight='800' letter-spacing='0.03em' fill='%234822DC'%3ESTEM & BSN%3C/text%3E%3C/svg%3E");
}

/* Pricing Tier 3: Executive MBA & Graduate — Royal-Purple Capstone Crown Badge */
.pricing-card:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%2362449D'/%3E%3Cpath d='M26 34L28 21L34 27L38 19L42 27L48 21L50 34H26Z' fill='%23F2BA41'/%3E%3Crect x='26' y='36' width='24' height='3' rx='1.5' fill='%23FFFFFF'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.4' font-weight='800' letter-spacing='0.02em' fill='%2362449D'%3EMBA & GRAD%3C/text%3E%3C/svg%3E");
}

.pricing-card.featured {
  background: #FFFFFF;
  border: 1px solid rgba(72, 34, 220, 0.22);
  border-top: 4px solid #4822DC;
  box-shadow: 0px 20px 42px 0px rgba(72, 34, 220, 0.14), 0px 8px 14px 0px rgba(106, 124, 185, 0.16);
  transform: translateY(-6px);
  z-index: 2;
}

.featured-ribbon {
  position: absolute;
  top: 16px;
  right: 20px;
  left: auto;
  transform: none;
  background: #F4F5FC;
  color: #4822DC;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 5px 10px;
  border-radius: 4px;
  box-shadow: none;
}

.pricing-card h3 {
  font-family: 'Inter', sans-serif;
  font-size: 19px;
  font-weight: 700;
  color: #33366D;
  margin-bottom: 8px;
}

.pricing-desc {
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  color: #6C7192;
  margin-bottom: 22px;
  line-height: 1.45em;
}

.price-wrap {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid #F0F3F9;
}

.price-amount {
  font-family: 'Inter', sans-serif;
  font-size: 44px;
  font-weight: 700;
  color: #26325F;
  line-height: 1;
  letter-spacing: -0.02em;
}

.pricing-card.featured .price-amount {
  color: #4822DC;
}

.price-period {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #B2BAD4;
}

.pricing-features {
  list-style: none;
  margin-bottom: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-grow: 1;
}

.pricing-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  color: #6C7192;
}

.pricing-features li::before {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: #F4F7FC;
  border: none;
  font-size: 11px;
  font-weight: 700;
  color: #4822DC;
  flex-shrink: 0;
}

.pricing-card > .btn {
  width: 100%;
  height: 50px;
  border-radius: 6px;
  font-family: 'Inter', sans-serif;
  font-size: 14.5px;
  font-weight: 600;
}

#pricing-calculator .container > div:not([class]) {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 24px;
}

#pricing-calculator .container > div:not([class]) > p {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 5px;
  padding: 22px 24px;
  margin: 0;
  font-size: 13.5px;
  line-height: 1.48em;
  color: #6C7192;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
}

/* ==========================================================================
   Section 13: #faq — 2-Column Split Layout + Animated Support SVG + Clean Cards
   ========================================================================== */
#faq {
  background: #FFFFFF;
  padding: 104px 0 116px;
  font-family: 'Inter', sans-serif;
}

#faq > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.82fr 1.18fr;
  column-gap: 64px;
  align-items: start;
}

#faq .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  position: sticky;
  top: 32px;
  margin-bottom: 0;
}

#faq .section-title {
  color: #33366D;
  text-align: left;
  margin-bottom: 16px;
}

#faq .section-lead {
  text-align: left;
  margin: 0 0 28px 0;
}

/* Left Column Bottom: Animated Academic Support & Privacy Verification SVG */
#faq .section-header::after {
  content: "";
  display: block;
  width: 100%;
  max-width: 420px;
  height: 240px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  animation: constellation-float 6s ease-in-out infinite;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 420 240' fill='none'%3E%3Cdefs%3E%3Cfilter id='fqsh' x='-10%25' y='-10%25' width='120%25' height='125%25'%3E%3CfeDropShadow dx='0' dy='14' stdDeviation='14' flood-color='%23283E72' flood-opacity='0.11'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23fqsh)'%3E%3Crect x='10' y='10' width='396' height='206' rx='6' fill='%23F8FAFD' stroke='%23E9EDF4'/%3E%3Crect x='28' y='28' width='42' height='42' rx='5' fill='%23FFFFFF'/%3E%3Cpath d='M49 39C43.5 39 39 43 39 48C39 50.4 40 52.5 41.7 54.1L40.5 58.5L45.2 56.6C46.4 56.9 47.7 57 49 57C54.5 57 59 53 59 48C59 43 54.5 39 49 39Z' stroke='%234822DC' stroke-width='2.2' stroke-linejoin='round'/%3E%3Ctext x='84' y='45' font-family='Inter,sans-serif' font-size='11' font-weight='500' fill='%23B2BAD4'%3E24/7 ACADEMIC COORDINATOR DESK%3C/text%3E%3Ctext x='84' y='63' font-family='Inter,sans-serif' font-size='14.5' font-weight='700' fill='%2333366D'%3EVerified US Support & SLA Terms%3C/text%3E%3Crect x='28' y='86' width='360' height='50' rx='5' fill='%23FFFFFF'/%3E%3Ccircle cx='48' cy='111' r='5' fill='%2356A87B'/%3E%3Ctext x='64' y='108' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%2333366D'%3E100%25 Confidential Non-Disclosure Protection%3C/text%3E%3Ctext x='64' y='124' font-family='Inter,sans-serif' font-size='11' font-weight='400' fill='%236C7192'%3EDiscrete merchant billing • Zero school or course descriptors%3C/text%3E%3Crect x='28' y='148' width='360' height='50' rx='5' fill='%23FFFFFF'/%3E%3Ccircle cx='48' cy='173' r='5' fill='%23179DD2'/%3E%3Ctext x='64' y='170' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%2333366D'%3EBi-Weekly Milestone Escrow Verification%3C/text%3E%3Ctext x='64' y='186' font-family='Inter,sans-serif' font-size='11' font-weight='400' fill='%236C7192'%3EVerify posted portal grades before every 14-day step%3C/text%3E%3C/g%3E%3C/svg%3E");
}

.faq-list {
  grid-column: 2;
  grid-row: 1;
  max-width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.faq-item {
  border: 1px solid #E9EDF4;
  border-radius: 6px;
  background: #FFFFFF;
  overflow: hidden;
  box-shadow: 0px 10px 22px 0px rgba(77, 96, 155, 0.06), 0px 4px 6px 0px rgba(106, 124, 185, 0.08);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.faq-item:hover {
  border-color: #D0D8EC;
  box-shadow: 0px 14px 28px 0px rgba(77, 96, 155, 0.10);
}

.faq-item.active {
  background: #FFFFFF;
  border-color: rgba(72, 34, 220, 0.28);
  box-shadow: 0px 16px 32px 0px rgba(72, 34, 220, 0.10);
}

.faq-trigger {
  width: 100%;
  background: none;
  border: none;
  padding: 20px 24px;
  text-align: left;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #33366D;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  transition: color 0.2s ease;
}

.faq-trigger:hover {
  color: #4822DC;
}

.faq-trigger::after {
  content: "▾";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 5px;
  border: 1px solid #E9EDF4;
  background: #F8FAFD;
  font-size: 14px;
  line-height: 1;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.2s ease;
  flex-shrink: 0;
  color: #5355A2;
}

.faq-item.active .faq-trigger::after {
  transform: rotate(180deg);
  background: #4822DC;
  border-color: #4822DC;
  color: #FFFFFF;
}

.faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  padding: 0 24px;
}

.faq-item.active .faq-content {
  padding: 0 24px 22px;
}

.faq-content p {
  font-family: 'Inter', sans-serif;
  font-size: 13.5px;
  color: #6C7192;
  line-height: 1.55em;
  border-top: 1px solid #F0F3F9;
  padding-top: 14px;
}

/* ==========================================================================
   Section 14: #emergency-rescue — Figma #3:169 Split Layout & 48-72h Timeline SVG
   ========================================================================== */
#emergency-rescue {
  background: radial-gradient(circle at 43% 43%, rgba(239, 243, 250, 1) 0%, rgba(250, 252, 253, 1) 100%);
  padding: 104px 0 124px;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}

#emergency-rescue > .container {
  max-width: 1132px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  column-gap: 64px;
  align-items: start;
}

#emergency-rescue .section-header {
  grid-column: 1;
  grid-row: 1;
  text-align: left;
  margin-bottom: 18px;
}

#emergency-rescue .section-title {
  color: #343668;
  text-align: left;
  margin-bottom: 18px;
}

#emergency-rescue .section-lead {
  text-align: left;
  margin: 0;
  max-width: 450px;
}

#emergency-rescue .answer-box {
  grid-column: 1;
  grid-row: 2;
  max-width: 450px;
  margin-bottom: 24px;
}

/* Left Column Bottom: Animated 48-72h Rapid Grade Triage Timeline SVG */
#emergency-rescue > .container::after {
  content: "";
  grid-column: 1;
  grid-row: 3;
  width: 100%;
  max-width: 450px;
  height: 270px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  animation: constellation-float 6s ease-in-out infinite;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 450 270' fill='none'%3E%3Cdefs%3E%3Cfilter id='ersh' x='-10%25' y='-10%25' width='120%25' height='125%25'%3E%3CfeDropShadow dx='0' dy='14' stdDeviation='16' flood-color='%23283E72' flood-opacity='0.12'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23ersh)'%3E%3Crect x='10' y='12' width='425' height='234' rx='6' fill='%23FFFFFF'/%3E%3Crect x='28' y='28' width='44' height='44' rx='5' fill='%23FFF7F4'/%3E%3Cpath d='M52 38L43 50H50L48 58L57 46H50L52 38Z' stroke='%23FF6438' stroke-width='2.2' stroke-linejoin='round'/%3E%3Ctext x='86' y='45' font-family='Inter,sans-serif' font-size='11' font-weight='500' fill='%23B2BAD4'%3E48–72 HOUR BACKLOG INTERVENTION%3C/text%3E%3Ctext x='86' y='64' font-family='Inter,sans-serif' font-size='15' font-weight='700' fill='%23343668'%3ERapid Grade Triage & W-Drop Prevention%3C/text%3E%3Cline x1='28' y1='88' x2='417' y2='88' stroke='%23F0F3F9'/%3E%3Ccircle cx='44' cy='116' r='6' fill='%23179DD2'/%3E%3Cline x1='44' y1='122' x2='44' y2='156' stroke='%23D8E0F0' stroke-width='2'/%3E%3Ctext x='64' y='119' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%23343668'%3EHour 0–6: Net Point-Weight & Late-Penalty Audit%3C/text%3E%3Ccircle cx='44' cy='162' r='6' fill='%2362449D'/%3E%3Cline x1='44' y1='168' x2='44' y2='202' stroke='%23D8E0F0' stroke-width='2'/%3E%3Ctext x='64' y='165' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%23343668'%3EHour 24: High-Weight Papers, Labs & Exams Submitted%3C/text%3E%3Ccircle cx='44' cy='208' r='6' fill='%2356A87B'/%3E%3Ctext x='64' y='211' font-family='Inter,sans-serif' font-size='12' font-weight='700' fill='%2356A87B'%3EHour 48–72: Backlog Cleared • Grade Restored to A/B%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* Right Column: 6 Staggered Floating Rescue Cards */
#emergency-rescue .container > div:not([class]) {
  grid-column: 2;
  grid-row: 1 / 4;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 0;
  align-items: start;
}

#emergency-rescue .container > div:not([class]) > p {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  padding: 22px 20px;
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  line-height: 1.48em;
  color: #6C7192;
  box-shadow: 0px 14px 36px 0px rgba(40, 62, 114, 0.12);
  transition: transform 0.25s ease;
}

#emergency-rescue .container > div:not([class]) > p:nth-child(even) {
  transform: translateY(32px);
}

#emergency-rescue .container > div:not([class]) > p:hover {
  transform: translateY(-4px);
}

#emergency-rescue .container > div:not([class]) > p:nth-child(even):hover {
  transform: translateY(28px);
}

/* Exact Figma #7:228 Floating White App-Tile Icons for #emergency-rescue (6 Unique Triage Tiles) */
#emergency-rescue .container > div:not([class]) > p::before {
  content: "";
  display: block;
  width: 76px;
  height: 72px;
  margin-bottom: 16px;
  background-color: #FFFFFF;
  border: 1px solid #EEF2F9;
  border-radius: 5px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/* Card 1: Midnight 11:59 PM Deadline Triage — Coral Alarm Bell Badge */
#emergency-rescue .container > div:not([class]) > p:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%23EE777B'/%3E%3Cpath d='M38 17C33.6 17 30 20.6 30 25V31L27 34H49L46 31V25C46 20.6 42.4 17 38 17Z' fill='%23FFFFFF'/%3E%3Ccircle cx='38' cy='37' r='2.5' fill='%23FFE0D6'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='8' font-weight='800' letter-spacing='0.04em' fill='%23EE777B'%3E11:59 PM%3C/text%3E%3C/svg%3E");
}

/* Card 2: Point-Weight & Late Penalty Audit — Sky-Blue Precision Balance Badge */
#emergency-rescue .container > div:not([class]) > p:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23179DD2'/%3E%3Cpath d='M38 17V39M27 23H49M27 23L24 31H30L27 23ZM49 23L46 31H52L49 23Z' stroke='%23FFFFFF' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.2' font-weight='800' letter-spacing='0.02em' fill='%23179DD2'%3EWEIGHT AUDIT%3C/text%3E%3C/svg%3E");
}

/* Card 3: Multi-Specialist Pod Deployment — Royal-Purple 3-Node Squad Emblem */
#emergency-rescue .container > div:not([class]) > p:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%2362449D'/%3E%3Ccircle cx='38' cy='22' r='4' fill='%23F2BA41'/%3E%3Ccircle cx='29' cy='31' r='3.5' fill='%23FFFFFF'/%3E%3Ccircle cx='47' cy='31' r='3.5' fill='%23FFFFFF'/%3E%3Cpath d='M38 26L29 31M38 26L47 31M29 31H47' stroke='%23C9B6F2' stroke-width='2'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.5' font-weight='800' letter-spacing='0.02em' fill='%2362449D'%3EPOD DEPLOY%3C/text%3E%3C/svg%3E");
}

/* Card 4: Instructor Extension & Late Waiver — Warm-Orange Official Stamp */
#emergency-rescue .container > div:not([class]) > p:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%23FF6438'/%3E%3Crect x='26' y='19' width='24' height='18' rx='2.5' fill='%23FFFFFF'/%3E%3Cpath d='M31 25H45M31 30H39' stroke='%23FF6438' stroke-width='2.4' stroke-linecap='round'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.3' font-weight='800' letter-spacing='0.02em' fill='%23FF6438'%3ELATE WAIVER%3C/text%3E%3C/svg%3E");
}

/* Card 5: 48-72h Accelerated Sprint — Deep-Indigo Fast-Forward Rocket Crest */
#emergency-rescue .container > div:not([class]) > p:nth-child(5)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Crect x='20' y='11' width='36' height='34' rx='6' fill='%234854B4'/%3E%3Cpath d='M27 21L38 28L27 35V21ZM38 21L49 28L38 35V21Z' fill='%23FFFFFF'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%234854B4'%3E72H SPRINT%3C/text%3E%3C/svg%3E");
}

/* Card 6: W-Drop Prevention & GPA Recovery — Emerald-Mint Lifesaver Shield */
#emergency-rescue .container > div:not([class]) > p:nth-child(6)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='72' viewBox='0 0 76 72' fill='none'%3E%3Ccircle cx='38' cy='28' r='16' fill='%2356A87B'/%3E%3Ccircle cx='38' cy='28' r='7' fill='%23FFFFFF'/%3E%3Cpath d='M38 12V21M38 35V44M22 28H31M45 28H54' stroke='%23FFFFFF' stroke-width='3.5'/%3E%3Ctext x='38' y='61' text-anchor='middle' font-family='Inter,sans-serif' font-size='7.8' font-weight='800' letter-spacing='0.03em' fill='%2356A87B'%3EGPA SAVED%3C/text%3E%3C/svg%3E");
}

/* ==========================================================================
   Shared Semantic Callout Cards (aside > article Across All Sections)
   ========================================================================== */
.section .container > div:not([class]) strong {
  color: #33366D;
  font-weight: 700;
}

.section .container > aside {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 28px;
}

.section .container > aside > article,
.section-alt .container > aside > article {
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  padding: 26px 24px;
  box-shadow: 0px 15px 22px 0px rgba(77, 96, 155, 0.09), 0px 7px 7px 0px rgba(106, 124, 185, 0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.section .container > aside > article:hover {
  transform: translateY(-4px);
  border-color: #FFFFFF;
  box-shadow: 0px 20px 30px 0px rgba(77, 96, 155, 0.12), 0px 10px 12px 0px rgba(106, 124, 185, 0.18);
}

.section .container > aside > article > span,
.section-alt .container > aside > article > span,
.section .container > aside > article:nth-child(2) > span,
.section .container > aside > article:nth-child(3) > span,
#comparison .container > aside > article:first-child > span {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #B2BAD4;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  text-transform: none;
  margin-bottom: 4px;
}

.section .container > aside > article > h3 {
  font-family: 'Inter', sans-serif;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.25em;
  margin: 4px 0 8px;
  color: #33366D;
}

.section .container > aside > article > p {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #6C7192;
  line-height: 1.48em;
}

/* ==========================================================================
   Section 15: #contact-cta — Figma #3:607 Clearbit Hero Glow Conversion Card
   ========================================================================== */
#contact-cta {
  padding: 48px 0 96px;
  background: #FFFFFF;
}

#contact-cta .container {
  position: relative;
  background-color: #FFFFFF;
  background-image:
    radial-gradient(circle at 86% 24%, rgba(138, 217, 242, 0.42) 0%, rgba(138, 217, 242, 0) 48%),
    radial-gradient(circle at 14% 82%, rgba(150, 115, 241, 0.24) 0%, rgba(150, 115, 241, 0) 50%);
  border: 1px solid #E9EDF4;
  border-bottom: 5px solid #D1B5FC;
  border-radius: 12px;
  box-shadow: 0px 18px 46px 0px rgba(40, 62, 114, 0.11);
  padding: 68px 48px;
}

#contact-cta .section-tag {
  background: transparent;
  color: #5355A2;
  font-weight: 600;
  border: none;
  box-shadow: none;
}

#contact-cta .section-title {
  color: #26325F;
  max-width: 780px;
  margin: 12px auto 18px;
}

#contact-cta .section-lead {
  color: #6C7192;
  max-width: 640px;
  margin-bottom: 32px;
}

#contact-cta .container > div {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

#contact-cta .btn {
  height: 56px;
  padding: 0 28px;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 600;
  border-radius: 9px;
}

#contact-cta .btn-outline {
  background-color: #FFFFFF;
  border: 2px solid #26325F;
  color: #26325F;
}

#contact-cta .btn-outline:hover {
  background-color: #26325F;
  color: #FFFFFF;
}

/* ==========================================================================
   Site Footer — Clean Institutional Clearbit SaaS Footer
   ========================================================================== */
.site-footer {
  background: linear-gradient(180deg, #FFFFFF 0%, #F4F7FC 100%);
  color: #6C7192;
  padding: 20px 0 64px;
  border-top: none;
  font-family: 'Inter', sans-serif;
}

.site-footer > .container {
  border: 1px solid #E9EDF4;
  border-radius: 8px;
  padding: 0;
  background-color: #FFFFFF;
  box-shadow: 0px 14px 36px 0px rgba(40, 62, 114, 0.07);
  overflow: hidden;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 44px;
  padding: 48px 44px;
  margin-bottom: 0;
}

.footer-brand h3 {
  font-family: 'Inter', sans-serif;
  font-size: 21px;
  font-weight: 700;
  color: #26325F;
  margin-bottom: 12px;
}

.footer-brand h3 span {
  color: #4822DC;
}

.footer-brand p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #6C7192;
  line-height: 1.55em;
  max-width: 340px;
}

.footer-col h4 {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #33366D;
  margin-bottom: 18px;
}

.footer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.footer-links a {
  display: inline-block;
  font-family: 'Inter', sans-serif;
  color: #6C7192;
  font-size: 14px;
  font-weight: 400;
  transition: transform 0.2s ease, color 0.2s ease;
}

.footer-links a:hover {
  color: #4822DC;
  transform: translateX(3px);
}

.footer-disclaimer {
  border-top: 1px solid #EEF2F8;
  padding: 20px 44px;
  font-family: 'Inter', sans-serif;
  font-size: 12.5px;
  line-height: 1.55em;
  color: #6C7192;
  text-align: left;
  background-color: #F8FAFD;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 44px;
  border-top: 1px solid #EEF2F8;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: #6C7192;
}

.footer-bottom > div {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}

.footer-bottom > div > a {
  color: #6C7192;
  text-underline-offset: 4px;
}

.footer-bottom > div > a:hover {
  color: #4822DC;
  text-decoration: underline;
}

/* ==========================================================================
   Responsive Breakpoints (Tablet <=1024px, Mobile <=768px, Small Phone <=480px)
   ========================================================================== */
@media (max-width: 1024px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }
  .site-header {
    top: 24px;
  }
  .header-container {
    padding: 0 20px;
    gap: 14px;
  }
  .nav-menu {
    gap: 16px;
  }
  .nav-link {
    font-size: 14.5px;
  }
  .mui-hero-section {
    padding: 124px 0 56px;
  }
  .mui-hero-grid {
    grid-template-columns: 1fr;
    row-gap: 32px;
  }
  .mui-hero-grid::before {
    display: none;
  }
  .mui-status-chip,
  .mui-hero-heading,
  .mui-hero-copy,
  .mui-hero-calculator,
  .mui-trust-grid {
    grid-column: 1;
    grid-row: auto;
  }
  .mui-hero-heading {
    max-width: 100%;
    font-size: clamp(36px, 5vw, 48px);
    line-height: 1.1;
  }
  .mui-hero-copy {
    max-width: 640px;
  }
  .mui-trust-grid {
    grid-template-columns: repeat(2, auto);
    justify-content: center;
    margin-top: 40px;
    row-gap: 24px;
    column-gap: 40px;
  }
  .section {
    padding: 64px 0;
  }
  #executive-summary {
    padding: 72px 0 64px;
  }
  #executive-summary .section-header::before {
    height: auto;
    aspect-ratio: 810 / 250;
  }
  #executive-summary .container > div:not([class]) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #executive-summary .container > div:not([class]) > p:nth-child(n+4) {
    padding: 24px 18px;
  }
  #how-it-works,
  #lms-platforms,
  #academic-subjects,
  #privacy-protocol,
  #zero-ai-standard,
  #proctored-exams,
  #grade-guarantee,
  #faq,
  #emergency-rescue {
    padding: 72px 0;
  }
  #how-it-works > .container,
  #lms-platforms > .container,
  #academic-subjects > .container,
  #privacy-protocol > .container,
  #zero-ai-standard > .container,
  #proctored-exams > .container,
  #grade-guarantee > .container,
  #faq > .container,
  #emergency-rescue > .container {
    grid-template-columns: 1fr;
    row-gap: 28px;
  }
  #how-it-works .section-header,
  #how-it-works .answer-box,
  #how-it-works .container > div:not([class]),
  #how-it-works .container > aside,
  .protocol-grid,
  #lms-platforms .section-header,
  #lms-platforms .answer-box,
  #lms-platforms .container > div:not([class]),
  #lms-platforms > .container::after,
  .lms-grid,
  #lms-platforms .container > aside,
  #academic-subjects .section-header,
  #academic-subjects .answer-box,
  #academic-subjects .container > div:not([class]),
  #academic-subjects .container > aside,
  .subject-grid,
  #privacy-protocol .section-header,
  #privacy-protocol .answer-box,
  #privacy-protocol > .container::after,
  #privacy-protocol .container > div:not([class]),
  #zero-ai-standard .section-header,
  #zero-ai-standard .answer-box,
  #zero-ai-standard > .container::after,
  #zero-ai-standard .container > div:not([class]),
  #proctored-exams .section-header,
  #proctored-exams .answer-box,
  #proctored-exams > .container::before,
  #proctored-exams > .container::after,
  #proctored-exams .container > div:not([class]),
  #grade-guarantee .section-header,
  #grade-guarantee .answer-box,
  #grade-guarantee > .container::after,
  #grade-guarantee .container > div:not([class]),
  #faq .section-header,
  .faq-list,
  #emergency-rescue .section-header,
  #emergency-rescue .answer-box,
  #emergency-rescue > .container::after,
  #emergency-rescue .container > div:not([class]) {
    grid-column: 1;
    grid-row: auto;
    max-width: 100%;
    position: static;
  }
  #how-it-works .answer-box::after {
    max-width: 520px;
    height: auto;
    aspect-ratio: 520 / 340;
  }
  #lms-platforms > .container::after {
    max-width: 560px;
    height: auto;
    aspect-ratio: 620 / 500;
    margin: 0 auto;
  }
  #lms-platforms .container > aside {
    margin-top: 24px;
  }
  #lms-platforms .container > div:not([class]) {
    margin-top: 16px;
    max-width: 100%;
  }
  #lms-platforms .container > div:not([class])::after {
    height: auto;
    aspect-ratio: 430 / 175;
    max-width: 430px;
  }
  #zero-ai-standard > .container::after,
  #grade-guarantee > .container::after {
    max-width: 450px;
    height: auto;
    aspect-ratio: 450 / 270;
  }
  #emergency-rescue > .container::after {
    max-width: 450px;
    height: auto;
    aspect-ratio: 450 / 280;
  }
  #proctored-exams > .container::before {
    max-width: 340px;
    height: auto;
    aspect-ratio: 202 / 215;
    margin: 0 auto;
  }
  .protocol-grid,
  .lms-grid,
  .subject-grid,
  #proctored-exams .container > div:not([class]),
  #grade-guarantee .container > div:not([class]) {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .protocol-card:nth-child(1),
  .protocol-card:nth-child(2),
  .protocol-card:nth-child(3),
  .protocol-card:nth-child(4) {
    margin: 0;
  }
  .subject-card:nth-child(even),
  .subject-card:nth-child(even):hover,
  #privacy-protocol .container > div:not([class]) > p:nth-child(even),
  #privacy-protocol .container > div:not([class]) > p:nth-child(even):hover,
  #zero-ai-standard .container > div:not([class]) > p:nth-child(even),
  #zero-ai-standard .container > div:not([class]) > p:nth-child(even):hover,
  #proctored-exams .container > div:not([class]) > p:nth-child(even),
  #proctored-exams .container > div:not([class]) > p:nth-child(even):hover,
  #emergency-rescue .container > div:not([class]) > p:nth-child(even),
  #emergency-rescue .container > div:not([class]) > p:nth-child(even):hover {
    transform: none;
  }
  .section-title {
    font-size: clamp(1.85rem, 3.8vw, 2.35rem);
  }
  .pricing-grid {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
  .pricing-card.featured {
    transform: none;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    padding: 36px 28px;
  }
  .footer-disclaimer,
  .footer-bottom {
    padding-left: 28px;
    padding-right: 28px;
  }
  .section .container > aside,
  #case-studies .container > aside:first-of-type,
  #case-studies .container > aside:last-of-type,
  #case-studies .container > div:not([class]),
  #comparison .container > div:not([class]),
  #pricing-calculator .container > div:not([class]) {
    grid-template-columns: 1fr;
  }
  #case-studies .container > div:not([class]) > p:first-child {
    border-right: none;
    border-bottom: 1px solid #E9EDF4;
    padding-right: 0;
    padding-bottom: 16px;
  }
}

@media (max-width: 768px) {
  .container {
    padding-left: 16px;
    padding-right: 16px;
  }
  .site-header {
    top: 14px;
  }
  .header-container {
    position: relative;
    height: 48px;
    padding: 0 16px;
    gap: 10px;
  }
  .brand-logo {
    font-size: 17px;
  }
  .brand-logo::before {
    width: 28px;
    height: 28px;
    margin-right: 8px;
  }
  .nav-menu {
    display: none;
  }
  .nav-menu.is-open {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    position: absolute;
    top: 56px;
    left: 16px;
    right: 16px;
    background: #FFFFFF;
    padding: 14px 18px;
    border-radius: 12px;
    border: 1px solid #E9EDF4;
    box-shadow: 0px 18px 42px rgba(38, 50, 95, 0.16);
    z-index: 1001;
  }
  .nav-menu.is-open li {
    width: 100%;
  }
  .nav-menu.is-open .nav-link {
    display: flex;
    width: 100%;
    padding: 12px 8px;
    font-size: 15.5px;
    border-bottom: 1px solid #F1F5FA;
  }
  .nav-menu.is-open li:last-child .nav-link {
    border-bottom: none;
  }
  .mobile-toggle {
    display: inline-flex;
    width: 40px;
    height: 40px;
    font-size: 1.15rem;
    flex-shrink: 0;
  }
  .header-actions {
    gap: 8px;
  }
  .header-actions .btn-primary {
    height: 40px;
    padding: 0 12px;
    font-size: 13.5px;
    border-radius: 8px;
  }
  .mui-hero-section {
    padding: 84px 0 44px;
    background:
      radial-gradient(120% 45% at 10% 18%, rgba(167, 139, 250, 0.38) 0%, rgba(167, 139, 250, 0) 70%),
      radial-gradient(120% 50% at 92% 52%, rgba(103, 214, 248, 0.45) 0%, rgba(103, 214, 248, 0) 72%),
      radial-gradient(110% 45% at 20% 88%, rgba(149, 117, 245, 0.34) 0%, rgba(149, 117, 245, 0) 70%),
      linear-gradient(155deg, #F3EEFF 0%, #E8E0FF 34%, #DFF3FF 70%, #F0F9FF 100%);
  }
  .mui-hero-grid {
    row-gap: 18px;
  }
  .mui-hero-calculator {
    grid-row: 1;
    margin-bottom: 10px;
  }
  .mui-status-chip {
    grid-row: 2;
    font-size: 12px;
    margin-bottom: 0;
  }
  .mui-hero-heading {
    grid-row: 3;
    font-size: clamp(30px, 7.8vw, 38px);
    line-height: 1.14;
    margin-bottom: 4px;
  }
  .mui-hero-copy {
    grid-row: 4;
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 4px;
  }
  .mui-trust-grid {
    grid-row: 5;
  }
  .mui-paper-card {
    padding: 20px 18px;
    border-radius: 16px;
  }
  .mui-paper-card::before {
    display: none;
  }
  .mui-card-title {
    font-size: 17px;
  }
  .mui-form {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  /* 16px font-size prevents iOS Safari auto-zoom on input focus */
  .mui-input-control,
  .mui-select-control {
    height: 44px;
    font-size: 16px;
  }
  .mui-btn-contained {
    height: 52px;
    font-size: 16px;
  }
  .mui-trust-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: start;
    margin-top: 28px;
    row-gap: 16px;
    column-gap: 16px;
  }
  .mui-trust-grid::before {
    justify-self: center;
    font-size: 14.5px;
    padding: 0 4px;
  }
  .mui-trust-chip .chip-label {
    font-size: 15.5px;
  }
  /* Pause continuous floating animations on mobile to save GPU & battery */
  #how-it-works .answer-box::after,
  #lms-platforms > .container::after,
  .subject-icon,
  #zero-ai-standard > .container::after,
  #grade-guarantee > .container::after,
  #emergency-rescue > .container::after {
    animation: none !important;
  }
  .section,
  #how-it-works,
  #lms-platforms,
  #academic-subjects,
  #privacy-protocol,
  #zero-ai-standard,
  #proctored-exams,
  #grade-guarantee,
  #comparison,
  #case-studies,
  #pricing-calculator,
  #faq,
  #emergency-rescue {
    padding: 52px 0;
  }
  #executive-summary {
    padding: 52px 0 44px;
  }
  #executive-summary .container > div:not([class]) {
    grid-template-columns: 1fr;
  }
  #executive-summary .container > div:not([class]) > p:nth-child(-n+3) {
    font-size: 15px;
  }
  #executive-summary .container > div:not([class]) > p:nth-child(n+4) {
    max-width: 100%;
    padding: 20px 16px;
  }
  #executive-summary .container > div:not([class]) > p:nth-child(4),
  #executive-summary .container > div:not([class]) > p:nth-child(5) {
    border-right: none;
    border-bottom: 1px solid #E9EDF4;
  }
  #how-it-works .container > aside,
  #lms-platforms .container > aside,
  #privacy-protocol .container > div:not([class]),
  #zero-ai-standard .container > div:not([class]),
  #proctored-exams .container > div:not([class]),
  #grade-guarantee .container > div:not([class]),
  #emergency-rescue .container > div:not([class]) {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  #privacy-protocol .answer-box {
    margin-bottom: 32px;
  }
  #privacy-protocol .container > div:not([class]) {
    row-gap: 32px;
  }
  #privacy-protocol .container > div:not([class]) > p {
    background-size: 88px 92px;
    padding: 0 0 4px 106px;
  }
  /* Mobile-proportioned SVG viewBox for #proctored-exams 5-logo bar + subheadline */
  #proctored-exams .answer-box::before {
    height: auto;
    aspect-ratio: 380 / 132;
    max-width: 380px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='132' viewBox='0 0 380 132' fill='none'%3E%3Cg transform='translate(14, 6)'%3E%3Cg transform='translate(0, 2)'%3E%3Ccircle cx='9' cy='9' r='7.5' stroke='%238AA8B7' stroke-width='1.8'/%3E%3Cpath d='M5 7.5H13M5 10.5H13' stroke='%238AA8B7' stroke-width='1.6' stroke-linecap='round'/%3E%3Ctext x='21' y='13' font-family='Inter,sans-serif' font-size='13' font-weight='700' fill='%238AA8B7'%3ECanvas%3C/text%3E%3C/g%3E%3Cg transform='translate(92, 2)'%3E%3Ccircle cx='6' cy='5' r='2.6' fill='%238AA8B7'/%3E%3Ccircle cx='2.6' cy='11' r='2.6' fill='%238AA8B7'/%3E%3Ccircle cx='9.4' cy='11' r='2.6' fill='%238AA8B7'/%3E%3Ctext x='16' y='13' font-family='Inter,sans-serif' font-size='13' font-weight='500' fill='%238AA8B7'%3EMyMathLab%3C/text%3E%3C/g%3E%3Cg transform='translate(204, 0)'%3E%3Crect x='0' y='1' width='16' height='16' rx='2.5' fill='%238AA8B7'/%3E%3Cpath d='M4 5V11M8 4V12M12 5V11' stroke='%23FFFFFF' stroke-width='1.3' stroke-linecap='round'/%3E%3Ctext x='21' y='13' font-family='Inter,sans-serif' font-size='11' font-weight='700' letter-spacing='0.04em' fill='%238AA8B7'%3EHONORLOCK%3C/text%3E%3C/g%3E%3Cg transform='translate(68, 32)'%3E%3Cellipse cx='32' cy='9' rx='26' ry='11' transform='rotate(-12 32 9)' stroke='%23DCEBF0' stroke-width='1.3'/%3E%3Ctext x='0' y='13' font-family='Inter,sans-serif' font-size='12' font-weight='700' letter-spacing='0.03em' fill='%238AA8B7'%3ERESPONDUS%3C/text%3E%3C/g%3E%3Cg transform='translate(198, 32)'%3E%3Ctext x='0' y='13' font-family='Inter,sans-serif' font-size='13.5' font-weight='700' fill='%238AA8B7'%3EProctorU%3C/text%3E%3C/g%3E%3C/g%3E%3Ctext x='190' y='92' text-anchor='middle' font-family='Inter,sans-serif' font-size='20' font-weight='700' fill='%23232B38'%3EGet the full exam protocol,%3C/text%3E%3Ctext x='190' y='118' text-anchor='middle' font-family='Inter,sans-serif' font-size='20' font-weight='700' fill='%23232B38'%3Einstantly%3C/text%3E%3C/svg%3E");
  }
  .section-title,
  #lms-platforms .section-title,
  #academic-subjects .section-title,
  #privacy-protocol .section-title,
  #proctored-exams .section-title {
    font-size: clamp(1.65rem, 6.5vw, 2.05rem);
    line-height: 1.22;
  }
  .protocol-grid,
  .lms-grid,
  .subject-grid,
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  /* Comparison table touch scroll & compact mobile cells */
  .comparison-wrapper {
    margin-top: 24px;
    -webkit-overflow-scrolling: touch;
  }
  .comparison-table {
    min-width: 580px;
    font-size: 13px;
  }
  .comparison-table th,
  .comparison-table td {
    padding: 13px 14px;
  }
  .faq-trigger {
    padding: 16px 18px;
    font-size: 15px;
  }
  .faq-content-inner {
    padding: 0 18px 18px;
    font-size: 14px;
  }
  #contact-cta .container {
    padding: 36px 20px;
  }
  #contact-cta .container > div {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
  }
  #contact-cta .container > div > .btn {
    width: 100%;
  }
  .footer-grid {
    padding: 28px 20px;
  }
  .footer-disclaimer,
  .footer-bottom {
    padding-left: 20px;
    padding-right: 20px;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}

@media (max-width: 480px) {
  .brand-logo {
    font-size: 15.5px;
  }
  .brand-logo::before {
    width: 24px;
    height: 24px;
    margin-right: 6px;
  }
  .header-actions .btn-primary {
    height: 36px;
    padding: 0 10px;
    font-size: 12.5px;
  }
  .mobile-toggle {
    width: 36px;
    height: 36px;
  }
  .mui-hero-heading {
    font-size: 28px;
  }
  .mui-paper-card {
    padding: 18px 16px;
  }
  .mui-trust-grid {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: 14px;
  }
  .mui-trust-chip {
    width: 232px;
    justify-content: flex-start;
  }
  #privacy-protocol .container > div:not([class]) > p {
    background-size: 84px 88px;
    padding: 96px 0 4px 0;
  }
  .pricing-card {
    padding: 24px 20px;
  }
}

/* ==========================================================================
   Utility Pages (Contact, About, Privacy, Refund, Terms, 404)
   ========================================================================== */

/* Hero Section on Inner Pages */
.hero-section {
  position: relative;
  width: 100%;
  padding: 160px 0 76px;
  background:
    radial-gradient(40% 50% at 85% 45%, rgba(138, 217, 242, 0.45) 0%, rgba(255, 255, 255, 0) 100%),
    radial-gradient(35% 45% at 50% 40%, rgba(150, 115, 241, 0.25) 0%, rgba(255, 255, 255, 0) 100%),
    #FFFFFF;
  border-bottom: 1px solid #E9EDF4;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.12fr 0.88fr;
  gap: 48px;
  align-items: start;
}

.hero-content {
  display: flex;
  flex-direction: column;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 9999px;
  background: #EBF8FE;
  color: #0284C7;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 18px;
  border: 1px solid #BAE6FD;
  width: fit-content;
}

.hero-badge svg {
  color: #0284C7;
  flex-shrink: 0;
}

.hero-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(2.1rem, 3.8vw, 2.9rem);
  font-weight: 800;
  line-height: 1.2;
  color: #26325F;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
}

.hero-title span {
  background: linear-gradient(135deg, #4822DC 0%, #2563EB 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.hero-p {
  font-size: 16px;
  line-height: 1.6;
  color: #6C7192;
  margin-bottom: 24px;
}

.hero-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 20px;
}

.trust-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #33366D;
  background: #FFFFFF;
  border: 1px solid #E4E8F4;
  padding: 8px 14px;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(40, 62, 114, 0.04);
}

.trust-item svg {
  color: #059669;
  flex-shrink: 0;
}

/* Quote Card on Contact Page */
.quote-card {
  background: #FFFFFF;
  border: 1px solid #E9EDF4;
  border-bottom: 4px solid #4822DC;
  border-radius: 14px;
  box-shadow: 0 16px 42px rgba(40, 62, 114, 0.12);
  padding: 30px 26px;
  position: relative;
}

.quote-card-header {
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #F1F5F9;
}

.quote-card-header h3 {
  font-size: 19px;
  font-weight: 700;
  color: #26325F;
  margin-bottom: 6px;
}

.quote-card-header p {
  font-size: 13px;
  color: #6C7192;
  margin: 0;
}

.quote-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-label {
  font-size: 13px;
  font-weight: 600;
  color: #33366D;
}

.form-control {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #26325F;
  background: #FFFFFF;
  border: 1.5px solid #CBD5E1;
  border-radius: 8px;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus {
  border-color: #4822DC;
  box-shadow: 0 0 0 3px rgba(72, 34, 220, 0.12);
}

select.form-control {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236C7192' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px;
  appearance: none;
  -webkit-appearance: none;
  padding-right: 38px;
}

.quote-result-preview {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #F8FAFC;
  border: 1px dashed #CBD5E1;
  border-radius: 8px;
  padding: 12px 16px;
  margin-top: 4px;
}

.estimate-label {
  font-size: 12.5px;
  color: #64748B;
  font-weight: 500;
}

.estimate-value {
  font-size: 15px;
  font-weight: 700;
  color: #059669;
}

/* Stats Banner across About & Legal Pages */
.stats-banner {
  background: #26325F;
  padding: 38px 0;
  color: #FFFFFF;
  border-bottom: 1px solid #1E2749;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  text-align: center;
}

.stat-val {
  font-size: clamp(2rem, 3.2vw, 2.5rem);
  font-weight: 800;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  margin-bottom: 6px;
}

.stat-label {
  font-size: 13.5px;
  color: #B2BAD4;
  font-weight: 500;
}

/* Final Conversion CTA on all Utility Pages (.section-dark) */
.section-dark {
  padding: 48px 0 96px;
  background: #FFFFFF !important;
}

.section-dark .container {
  position: relative;
  background-color: #FFFFFF;
  background-image:
    radial-gradient(circle at 86% 24%, rgba(138, 217, 242, 0.42) 0%, rgba(138, 217, 242, 0) 48%),
    radial-gradient(circle at 14% 82%, rgba(150, 115, 241, 0.24) 0%, rgba(150, 115, 241, 0) 50%);
  border: 1px solid #E9EDF4;
  border-bottom: 5px solid #D1B5FC;
  border-radius: 12px;
  box-shadow: 0px 18px 46px 0px rgba(40, 62, 114, 0.11);
  padding: 68px 48px;
}

.section-dark .section-tag {
  background: transparent !important;
  color: #5355A2 !important;
  font-weight: 600;
  border: none;
  box-shadow: none;
}

.section-dark .section-title {
  color: #26325F !important;
  max-width: 780px;
  margin: 12px auto 18px;
}

.section-dark .section-lead {
  color: #6C7192 !important;
  max-width: 680px;
  margin: 0 auto 32px;
}

.section-dark .btn-outline {
  background-color: #FFFFFF !important;
  border: 2px solid #26325F !important;
  color: #26325F !important;
}

.section-dark .btn-outline:hover {
  background-color: #26325F !important;
  color: #FFFFFF !important;
  border-color: #26325F !important;
}

@media (max-width: 960px) {
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

@media (max-width: 768px) {
  .hero-section {
    padding: 125px 0 54px;
  }
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 24px;
  }
  .section-dark .container {
    padding: 40px 24px;
  }
}

@media (max-width: 480px) {
  .hero-section {
    padding: 110px 0 46px;
  }
  .stats-grid {
    grid-template-columns: 1fr;
  }
  .hero-trust-row {
    flex-direction: column;
  }
  .trust-item {
    width: 100%;
  }
  .quote-card {
    padding: 22px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}