/* ===========================
   MeeM EdTech — Global Styles
   =========================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,600;1,400&display=swap');

/* ---------- Variables ---------- */
:root {
  --meem-blue:    #2E6DA4;
  --meem-magenta: #C21E5D;
  --meem-charcoal:#333333;
  --meem-cloud:   #F8F9FA;
  --meem-grey:    #6C757D;
  --meem-teal:    #2FA75F;
  --meem-dark:    #071431;

  --font-sans:  'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;

  --radius-sm:  0.5rem;
  --radius-md:  1rem;
  --radius-lg:  1.5rem;
  --radius-xl:  2rem;
  --radius-full:9999px;

  --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
  --shadow-md:  0 4px 16px rgba(0,0,0,.10);
  --shadow-lg:  0 12px 40px rgba(0,0,0,.14);

  --transition: all .25s ease;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  background: var(--meem-cloud);
  color: var(--meem-charcoal);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
a    { text-decoration: none; color: inherit; }
img  { max-width: 100%; display: block; }
ul   { list-style: none; }
::selection { background: rgba(194,30,93,.25); }

/* ---------- Layout helpers ---------- */
.container {
  max-width: 80rem;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.container--narrow { max-width: 56rem; }
.container--mid    { max-width: 64rem; }

.section      { padding: 6rem 0; }
.section--alt { background: #fff; }
.section--dark {
  background: linear-gradient(135deg, var(--meem-blue), var(--meem-charcoal));
  color: #fff;
}

/* page wrapper for inner pages */
.page-wrapper { min-height: 100vh; background: var(--meem-cloud); }

/* ---------- Typography ---------- */
h1,h2,h3,h4 { line-height: 1.2; }
.font-serif { font-family: var(--font-serif); }

.section-eyebrow {
  display: inline-block;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.eyebrow--magenta { color: var(--meem-magenta); }
.eyebrow--blue    { color: var(--meem-blue); }

.text-blue    { color: var(--meem-blue); }
.text-magenta { color: var(--meem-magenta); }
.text-grey    { color: var(--meem-grey); }
.text-cloud   { color: var(--meem-cloud); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: 1rem 2rem;
  font-family: var(--font-sans);
  font-size: .875rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  border-radius: var(--radius-full);
  transition: var(--transition);
}
.btn--magenta {
  background: var(--meem-magenta);
  color: #fff;
  box-shadow: 0 6px 20px rgba(194,30,93,.25);
}
.btn--magenta:hover { background: #a51a4f; }

.btn--blue {
  background: var(--meem-blue);
  color: #fff;
  box-shadow: 0 6px 20px rgba(46,109,164,.25);
}
.btn--blue:hover { background: #25598a; }

.btn--outline {
  background: transparent;
  color: var(--meem-charcoal);
  border: 1.5px solid rgba(108,117,125,.3);
}
.btn--outline:hover { background: var(--meem-cloud); }

/* ---------- Badge ---------- */
.badge {
  display: inline-block;
  padding: .25rem .85rem;
  border-radius: var(--radius-full);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.badge--blue    { background: rgba(46,109,164,.1);  border:1px solid rgba(46,109,164,.2);  color: var(--meem-blue); }
.badge--magenta { background: rgba(194,30,93,.1);   border:1px solid rgba(194,30,93,.2);   color: var(--meem-magenta); }
.badge--white   { background: var(--meem-magenta);  color: #fff; }

/* ---------- Grid ---------- */
.grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 2rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; }

@media(max-width:1024px){
  .grid-4 { grid-template-columns: repeat(2,1fr); }
  .grid-3 { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:768px){
  .grid-2,.grid-3,.grid-4 { grid-template-columns: 1fr; }
}

/* ---------- Cards ---------- */
.card {
  background: #fff;
  border: 1px solid rgba(108,117,125,.12);
  border-radius: var(--radius-xl);
  padding: 2rem;
  transition: var(--transition);
  box-shadow: var(--shadow-sm);
}
.card:hover { box-shadow: var(--shadow-md); }

.card--cloud { background: var(--meem-cloud); }

.card__icon {
  width: 3rem; height: 3rem;
  border-radius: var(--radius-md);
  background: var(--meem-cloud);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.5rem;
  transition: var(--transition);
  color: var(--meem-magenta);
}
.card:hover .card__icon { transform: scale(1.08); }

.card__step {
  font-size: .65rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--meem-magenta); margin-bottom: .25rem;
}
.card__title   { font-size: 1.2rem; font-weight: 700; color: var(--meem-blue); margin-bottom: .75rem; }
.card__body    { font-size: .875rem; color: var(--meem-grey); line-height: 1.7; }

/* ---------- Icon circle ---------- */
.icon-circle {
  width: 3rem; height: 3rem;
  border-radius: var(--radius-full);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.icon-circle--cloud   { background: var(--meem-cloud); border:1px solid rgba(108,117,125,.1); color: var(--meem-magenta); }
.icon-circle--magenta { background: rgba(194,30,93,.1); color: var(--meem-magenta); }
.icon-circle--blue    { background: rgba(46,109,164,.1); color: var(--meem-blue); }
.icon-circle--dark    { background: rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color: var(--meem-magenta); }

/* ---------- Pillars list (shared) ---------- */
.pillar-item {
  display: flex; gap: 1.5rem; cursor: pointer;
  transition: var(--transition);
}
.pillar-item:hover { transform: translateX(10px); }
.pillar-item__icon {
  width: 3rem; height: 3rem;
  border-radius: .75rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: var(--transition);
  box-shadow: var(--shadow-sm);
  color: #fff;
}
.pillar-item:hover .pillar-item__icon { transform: scale(1.1); }
.pillar-item__title { font-size: 1.15rem; font-weight: 500; color: var(--meem-blue); margin-bottom: .25rem; transition: var(--transition); }
.pillar-item:hover  .pillar-item__title { color: var(--meem-magenta); }
.pillar-item__desc  { font-size: .85rem; color: var(--meem-grey); }

/* ---------- Pillar Modal ---------- */
.modal-overlay {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 1.5rem;
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
}
.modal-overlay.is-open { opacity: 1; pointer-events: all; }

.modal-box {
  background: #f8fafc;
  border-radius: var(--radius-xl);
  width: 100%; max-width: 56rem;
  max-height: 90vh; overflow-y: auto;
  position: relative;
  transform: scale(.95) translateY(20px);
  transition: transform .25s ease;
  box-shadow: var(--shadow-lg);
}
.modal-overlay.is-open .modal-box { transform: scale(1) translateY(0); }

.modal__close {
  position: absolute; top: 1rem; right: 1rem;
  background: rgba(0,0,0,.06); border: none; cursor: pointer;
  width: 2.5rem; height: 2.5rem; border-radius: var(--radius-full);
  display: flex; align-items: center; justify-content: center;
  color: #64748b;
  transition: var(--transition);
}
.modal__close:hover { background: rgba(0,0,0,.12); }

.modal__body { padding: 3rem; }
@media(max-width:640px){ .modal__body { padding: 1.5rem; } }

.modal__badge { display:inline-block; padding:.25rem .75rem; background:var(--meem-magenta); color:#fff; border-radius:var(--radius-full); font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem; }
.modal__title { font-family:var(--font-serif); font-size:clamp(2rem,5vw,3rem); color:var(--meem-magenta); margin-bottom:2rem; }
.modal__section-title { font-size:1.3rem; font-weight:700; color:var(--meem-charcoal); margin-bottom:.75rem; }
.modal__text  { font-size:1rem; color:#334155; line-height:1.75; }
.modal__outcome { display:flex; align-items:flex-start; gap:.75rem; font-size:1rem; color:#334155; margin-bottom:.75rem; }
.modal__outcome-dot { width:.5rem; height:.5rem; border-radius:var(--radius-full); background:var(--meem-magenta); flex-shrink:0; margin-top:.5rem; }
.modal__footer { margin-top:2rem; padding:1.5rem; border:2px solid rgba(194,30,93,.2); border-radius:.75rem; background: rgba(194,30,93,.03); color:#1e293b; font-weight:500; line-height:1.7; }

/* ---------- Navbar ---------- */
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  padding: 1.5rem 0;
  border-bottom: 1px solid transparent;
  transition: var(--transition);
}
.navbar.scrolled {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  border-bottom-color: rgba(108,117,125,.12);
  padding: 1rem 0;
  box-shadow: var(--shadow-sm);
}
.navbar__inner {
  display: flex; align-items: center; justify-content: space-between;
}
.navbar__logo { height: 4rem; width: auto; }

.navbar__links {
  display: flex; align-items: center; gap: 2rem;
}
.navbar__link {
  font-size: .875rem; font-weight: 500;
  color: var(--meem-grey);
  transition: var(--transition);
}
.navbar__link:hover,
.navbar__link.active { color: var(--meem-blue); }

/* Verticals dropdown */
.nav-dropdown { position: relative; }
.nav-dropdown__toggle {
  display: flex; align-items: center; gap: .25rem;
  font-size: .875rem; font-weight: 500;
  color: var(--meem-grey); background: none; border: none; cursor: pointer;
  padding: .5rem 0;
  transition: var(--transition);
}
.nav-dropdown__toggle:hover { color: var(--meem-blue); }
.nav-dropdown__toggle svg { width: .75rem; height: .75rem; }

.nav-dropdown__menu {
  position: absolute; top: 100%; left: 0;
  width: 12rem; padding-top: .5rem;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(.5rem);
  transition: var(--transition);
}
.nav-dropdown:hover .nav-dropdown__menu,
.nav-dropdown__menu.is-open {
  opacity:1; visibility:visible; pointer-events:all; transform:translateY(0);
}
.nav-dropdown__panel {
  background: #fff;
  border: 1px solid rgba(108,117,125,.12);
  border-radius: .75rem;
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.nav-dropdown__item {
  display: block; padding: .75rem 1rem;
  font-size: .875rem; color: var(--meem-grey);
  transition: var(--transition);
}
.nav-dropdown__item:hover { background: var(--meem-cloud); color: var(--meem-blue); }

.navbar__cta {
  padding: .5rem 1.25rem;
  border-radius: var(--radius-full);
  background: var(--meem-magenta);
  color: #fff; font-size: .875rem; font-weight: 600;
  box-shadow: 0 4px 12px rgba(194,30,93,.25);
  transition: var(--transition);
}
.navbar__cta:hover { background: #a51a4f; }

/* Mobile hamburger */
.navbar__hamburger {
  display: none;
  flex-direction: column; gap: .35rem;
  background: none; border: none; cursor: pointer; padding: .25rem;
}
.navbar__hamburger span {
  display: block; width: 1.5rem; height: 2px;
  background: var(--meem-charcoal);
  border-radius: 2px;
  transition: var(--transition);
}
.navbar__hamburger.is-open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.navbar__hamburger.is-open span:nth-child(2) { opacity: 0; }
.navbar__hamburger.is-open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* Mobile drawer */
.navbar__mobile {
  display: none;
  flex-direction: column; gap: 1rem;
  padding: 1.5rem;
  background: #fff;
  border-top: 1px solid rgba(108,117,125,.1);
  box-shadow: var(--shadow-md);
  max-height: 80vh; overflow-y: auto;
}
.navbar__mobile.is-open { display: flex; }
.navbar__mobile .navbar__link { font-size: 1.1rem; color: var(--meem-charcoal); }
.navbar__mobile-sub { padding-left: 1rem; border-left: 2px solid rgba(108,117,125,.2); display:flex; flex-direction:column; gap:.75rem; margin-top:.25rem; }
.navbar__mobile-sublabel { font-size:1rem; font-weight:500; color:var(--meem-charcoal); }
.navbar__mobile-sub a { font-size:.95rem; color: var(--meem-grey); }

@media(max-width:767px){
  .navbar__links      { display: none; }
  .navbar__hamburger  { display: flex; }
}

/* ---------- Footer ---------- */
.footer {
  background: var(--meem-charcoal);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 4rem 0 2rem;
  color: #fff;
}
.footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; margin-bottom:4rem; }
.footer__logo { height:3.5rem; width:auto; margin-bottom:1.5rem; }
.footer__desc { color:#94a3b8; max-width:24rem; font-size:.9rem; line-height:1.75; }
.footer__heading { font-size:.9rem; font-weight:600; color:#fff; margin-bottom:1.5rem; }
.footer__links   { display:flex; flex-direction:column; gap:1rem; }
.footer__links a { font-size:.85rem; color:#94a3b8; transition:var(--transition); }
.footer__links a:hover { color:#fff; }
.footer__bottom  { border-top:1px solid rgba(255,255,255,.06); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.footer__copy    { font-size:.8rem; color:#64748b; }
.footer__legal   { display:flex; gap:1.5rem; }
.footer__legal a { font-size:.8rem; color:#64748b; transition:var(--transition); }
.footer__legal a:hover { color:#fff; }

@media(max-width:768px){
  .footer__grid { grid-template-columns:1fr; }
  .footer__bottom { flex-direction:column; text-align:center; }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  background: var(--meem-cloud);
  padding-top: 5rem;
}
.hero__bg {
  position:absolute; inset:0; z-index:0;
}
.hero__bg-img {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:.18; mix-blend-mode:multiply;
}
.hero__bg-grad {
  position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 50%, var(--meem-cloud) 100%);
}
.hero__bg-radial1 {
  position:absolute; inset:0;
  background: radial-gradient(circle at 50% 50%, rgba(46,109,164,.06), transparent 70%);
}
.hero__bg-radial2 {
  position:absolute; top:33%; right:0; width:50%; height:50%;
  background: radial-gradient(circle at 50% 50%, rgba(194,30,93,.06), transparent 60%);
}
.hero__content { position:relative; z-index:10; text-align:center; max-width:80rem; margin:0 auto; padding:0 1.5rem; }
.hero__h1 {
  font-family: var(--font-serif);
  font-size: clamp(2.5rem, 7vw, 5rem);
  font-weight: 400;
  color: var(--meem-blue);
  line-height: 1.1;
  margin-bottom: 1.5rem;
}
.hero__h1 span {
  background: linear-gradient(90deg, var(--meem-blue), var(--meem-magenta));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip:text;
}
.hero__p { max-width:38rem; margin:0 auto 2.5rem; font-size:1.1rem; color: var(--meem-charcoal); line-height:1.75; }
.hero__actions { display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; }

/* Scroll indicator */
.hero__scroll {
  position:absolute; bottom:2.5rem; left:50%; transform:translateX(-50%);
  color:rgba(108,117,125,.5);
  animation: scrollbounce 2s infinite;
}
.scroll-mouse {
  width:1.5rem; height:2.5rem;
  border:2px solid currentColor; border-radius:999px;
  display:flex; justify-content:center; padding:.25rem;
}
.scroll-mouse span {
  width:.25rem; height:.5rem;
  background:currentColor; border-radius:999px;
}
@keyframes scrollbounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(10px)} }

/* ---------- MQL Teaser ---------- */
.mql-teaser { padding:6rem 0; background: var(--meem-cloud); position:relative; overflow:hidden; }
.mql-teaser__inner { display:flex; align-items:center; gap:3rem; flex-wrap:wrap; }
.mql-teaser__left  { flex:1; min-width:16rem; }
.mql-teaser__h2    { font-family:var(--font-serif); font-size:clamp(2rem,5vw,3.5rem); color:var(--meem-blue); line-height:1.15; margin-bottom:1.25rem; }
.mql-teaser__h2 span { color:var(--meem-magenta); }
.mql-teaser__p  { font-size:1.05rem; color:var(--meem-charcoal); max-width:36rem; line-height:1.75; margin-bottom:2rem; }
.mql-teaser__stats { flex:1; min-width:14rem; display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.mql-stat { background:#fff; padding:1.5rem; border-radius:var(--radius-lg); border:1px solid rgba(108,117,125,.1); box-shadow:var(--shadow-sm); }
.mql-stat__num  { font-size:1.75rem; font-weight:700; color:var(--meem-blue); margin-bottom:.25rem; }
.mql-stat__label{ font-size:.8rem; color:var(--meem-grey); }

/* ---------- Moral Code ---------- */
.moral-code { padding:6rem 0; background:#fff; }
.moral-code__grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.moral-code__list { display:flex; flex-direction:column; gap:2rem; }
.moral-code__item { display:flex; gap:1rem; }
.moral-code__img-wrap { position:relative; border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-lg); }
.moral-code__img { width:100%; height:100%; object-fit:cover; }
.moral-code__img-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(51,51,51,.8), transparent); }
.moral-code__quote { position:absolute; bottom:2rem; left:2rem; right:2rem; font-family:var(--font-serif); font-size:1.3rem; font-style:italic; color:#fff; line-height:1.5; }

@media(max-width:768px){ .moral-code__grid { grid-template-columns:1fr; } }

/* ---------- Verticals ---------- */
.verticals { padding:6rem 0; background:#fff; }
.section-header { text-align:center; margin-bottom:4rem; }
.section-header h2 { font-family:var(--font-serif); font-size:clamp(1.8rem,4vw,2.5rem); color:var(--meem-blue); margin-bottom:.75rem; }
.section-header p  { color:var(--meem-charcoal); }

.vertical-card {
  position:relative; overflow:hidden;
  display:block;
  background:#fff;
  border:1px solid rgba(108,117,125,.1);
  border-radius:var(--radius-xl);
  padding:2rem;
  transition:var(--transition);
  box-shadow:var(--shadow-sm);
}
.vertical-card:hover { border-color:rgba(46,109,164,.3); box-shadow:var(--shadow-md); }
.vertical-card__glow {
  position:absolute; top:0; right:0; width:8rem; height:8rem;
  border-radius:50%; opacity:.06; filter:blur(48px);
  transition:var(--transition); pointer-events:none;
}
.vertical-card:hover .vertical-card__glow { opacity:.12; }
.vertical-card__icon { width:3rem; height:3rem; border-radius:50%; background:var(--meem-cloud); display:flex; align-items:center; justify-content:center; margin-bottom:1.5rem; color:var(--meem-grey); transition:var(--transition); }
.vertical-card:hover .vertical-card__icon { background:rgba(46,109,164,.06); color:var(--meem-blue); }
.vertical-card h3 { font-family:var(--font-serif); font-size:1.4rem; color:var(--meem-blue); margin-bottom:1rem; }
.vertical-card p  { font-size:.875rem; color:var(--meem-grey); line-height:1.7; margin-bottom:2rem; }
.vertical-card__cta { font-size:.7rem; font-weight:500; text-transform:uppercase; letter-spacing:.15em; color:rgba(108,117,125,.7); transition:var(--transition); }
.vertical-card:hover .vertical-card__cta { color:var(--meem-blue); }

/* ---------- Ecosystem ---------- */
.ecosystem { padding:6rem 0; background:var(--meem-cloud); position:relative; overflow:hidden; }
.ecosystem__grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.ecosystem__h2 { font-family:var(--font-serif); font-size:clamp(1.8rem,4vw,2.5rem); color:var(--meem-blue); margin-bottom:1.5rem; }
.ecosystem__p  { font-size:1.05rem; color:var(--meem-charcoal); margin-bottom:3rem; line-height:1.75; }
.ecosystem__pillars { display:flex; flex-direction:column; gap:2.5rem; }
.ecosystem__img-wrap { border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-lg); position:relative; }
.ecosystem__img-wrap img { width:100%; object-fit:cover; display:block; }
.ecosystem__img-overlay { position:absolute; inset:0; background:linear-gradient(to top right, var(--meem-cloud), transparent, transparent); }

@media(max-width:768px){ .ecosystem__grid { grid-template-columns:1fr; } }

/* ---------- Operational Commitment ---------- */
.op-commit { padding:6rem 0; background:#fff; border-top:1px solid rgba(108,117,125,.1); }
.op-commit p { font-size:1.1rem; color:var(--meem-charcoal); line-height:1.8; max-width:56rem; margin:0 auto; text-align:center; }
.op-commit p strong { color:var(--meem-magenta); font-weight:600; }

/* ---------- Ecosystem Partners ---------- */
.partners { padding:6rem 0; background:#fff; }
.partners__grid { display:flex; flex-wrap:wrap; justify-content:center; gap:2rem; margin-bottom:3rem; }
.partner-item { width:100%; }
@media(min-width:640px){ .partner-item { width:calc(50% - 1rem); } }
@media(min-width:1024px){ .partner-item { width:calc(25% - 1.5rem); } }
.partner-item__img { aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1.5rem; background:var(--meem-cloud); }
.partner-item__img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.partner-item:hover .partner-item__img img { transform:scale(1.05); }
.partner-item h3 { font-family:var(--font-serif); font-size:1.15rem; font-weight:700; color:var(--meem-blue); margin-bottom:.5rem; }
.partner-item p  { font-size:.875rem; color:var(--meem-grey); line-height:1.65; }

.partners__callout {
  background:rgba(194,30,93,.04);
  border:1px solid rgba(194,30,93,.1);
  border-radius:var(--radius-lg);
  padding:2rem;
  display:flex; gap:1.5rem; align-items:flex-start;
}
.partners__callout-box { width:1.5rem; height:1.5rem; border:2px solid var(--meem-magenta); border-radius:.25rem; flex-shrink:0; margin-top:.25rem; }
.partners__callout p { font-size:1.05rem; color:var(--meem-charcoal); line-height:1.75; font-weight:500; }

/* ---------- Contact ---------- */
.contact { padding:6rem 0; background:#fff; }
.contact__form {
  background: var(--meem-cloud);
  border:1px solid rgba(108,117,125,.1);
  border-radius:var(--radius-xl);
  padding:2.5rem;
  box-shadow:var(--shadow-sm);
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
@media(max-width:640px){ .form-row { grid-template-columns:1fr; } }
.form-group { display:flex; flex-direction:column; gap:.5rem; }
.form-group label { font-size:.875rem; font-weight:500; color:var(--meem-grey); }
.form-group input,
.form-group textarea {
  background:#fff;
  border:1px solid rgba(108,117,125,.22);
  border-radius:.75rem;
  padding:.875rem 1rem;
  font-family:var(--font-sans);
  font-size:.9rem;
  color:var(--meem-charcoal);
  outline:none;
  transition:var(--transition);
  width:100%;
}
.form-group input:focus,
.form-group textarea:focus { border-color:var(--meem-magenta); }
.form-group textarea { height:8rem; resize:vertical; }
.form-checkboxes { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
@media(max-width:640px){ .form-checkboxes { grid-template-columns:1fr; } }
.form-check {
  display:flex; align-items:center; gap:.75rem;
  padding:.875rem; border-radius:.75rem;
  background:#fff; border:1px solid rgba(108,117,125,.1);
  cursor:pointer; transition:var(--transition);
}
.form-check:hover { background:var(--meem-cloud); }
.form-check input[type=checkbox] { accent-color:var(--meem-magenta); width:1rem; height:1rem; }
.form-check span { font-size:.875rem; color:var(--meem-charcoal); }
.form-submit {
  width:100%; padding:1rem;
  background:var(--meem-magenta); color:#fff;
  border:none; border-radius:.75rem;
  font-family:var(--font-sans); font-size:1rem; font-weight:600;
  cursor:pointer; transition:var(--transition);
  box-shadow:0 4px 12px rgba(194,30,93,.25);
}
.form-submit:hover { background:#a51a4f; }

/* ---------- Inner page hero ---------- */
.inner-hero { padding-top: 9rem; padding-bottom: 4rem; text-align:center; }
.inner-hero h1 { font-family:var(--font-serif); font-size:clamp(2rem,6vw,4rem); color:var(--meem-blue); margin-bottom:1.5rem; }
.inner-hero p  { font-size:1.1rem; color:var(--meem-charcoal); max-width:38rem; margin:0 auto; line-height:1.75; }
.inner-main  { padding-bottom:6rem; }

/* ---------- About page ---------- */
.about-section  { margin-bottom:6rem; }
.about-card { background:#fff; border:1px solid rgba(108,117,125,.1); border-radius:var(--radius-xl); padding:3.5rem; box-shadow:var(--shadow-sm); }
.about-philosophy-item {
  display:flex; gap:1.5rem; padding:1.5rem;
  border-radius:var(--radius-lg); background:#fff;
  border:1px solid rgba(108,117,125,.1);
  transition:var(--transition);
  box-shadow:var(--shadow-sm);
}
.about-philosophy-item:hover { border-color:rgba(46,109,164,.3); }
.compass-banner {
  background:linear-gradient(135deg,var(--meem-blue),var(--meem-charcoal));
  border-radius:var(--radius-xl);
  padding:3.5rem;
  color:#fff;
  position:relative; overflow:hidden;
}
.compass-banner__icon { position:absolute; top:0; right:0; padding:2.5rem; opacity:.08; }
.compass-banner h2 { font-family:var(--font-serif); font-size:2rem; color:#fff; margin-bottom:1.5rem; }
.compass-banner p  { font-size:1.05rem; color:rgba(255,255,255,.88); line-height:1.8; }

/* ---------- Vision page ---------- */
.vision-card { text-align:left; transition:var(--transition); }
.vision-card:hover { box-shadow:var(--shadow-lg); }
.vision-card__icon-wrap { display:inline-flex; padding:1rem; background:var(--meem-cloud); border-radius:var(--radius-lg); margin-bottom:1.5rem; transition:var(--transition); }
.vision-card:hover .vision-card__icon-wrap { transform:scale(1.1); }
.vision-card__num   { font-family:var(--font-serif); font-size:2.25rem; color:var(--meem-blue); margin-bottom:.25rem; }
.vision-card__label { font-size:1.1rem; color:var(--meem-magenta); font-weight:500; margin-bottom:1rem; }

/* ---------- CEO Message ---------- */
.ceo-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:flex-start; }
.ceo-photo-wrap { position:relative; }
.ceo-photo-frame {
  aspect-ratio:3/4; border-radius:var(--radius-xl); overflow:hidden;
  border:1px solid rgba(108,117,125,.1); box-shadow:var(--shadow-lg); position:relative; z-index:1;
}
.ceo-photo-frame img { width:100%; height:100%; object-fit:cover; }
.ceo-photo-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(46,109,164,.9), transparent); }
.ceo-info { position:absolute; bottom:2rem; left:2rem; right:2rem; }
.ceo-info__name { font-family:var(--font-serif); font-size:1.5rem; color:#fff; }
.ceo-info__role { color:var(--meem-magenta); font-weight:500; margin:.25rem 0; }
.ceo-info__org  { font-size:.875rem; color:rgba(255,255,255,.75); }
.ceo-deco-1 { position:absolute; top:-1rem; left:-1rem; width:calc(100% + 2rem); height:calc(100% + 2rem); border:1px solid rgba(46,109,164,.1); border-radius:var(--radius-xl); pointer-events:none; }
.ceo-deco-2 { position:absolute; bottom:-1rem; right:-1rem; width:calc(100% + 2rem); height:calc(100% + 2rem); border:1px solid rgba(194,30,93,.15); border-radius:var(--radius-xl); pointer-events:none; }
.ceo-message-body > p + p { margin-top:1.5rem; }
.ceo-message-body p { font-size:1.05rem; color:var(--meem-charcoal); line-height:1.85; }
.ceo-pillars-box {
  background:#fff; border-left:4px solid var(--meem-magenta);
  padding:1.5rem; margin:2rem 0; border-radius:0 .75rem .75rem 0; box-shadow:var(--shadow-sm);
}
.ceo-pillars-box h3 { font-family:var(--font-serif); font-size:1.2rem; color:var(--meem-blue); margin-bottom:1rem; }
.ceo-pillars-box li { display:flex; gap:.75rem; margin-bottom:1rem; font-size:1rem; color:var(--meem-charcoal); }
.ceo-closing { font-family:var(--font-serif); font-size:1.4rem; color:var(--meem-blue); padding-top:1.5rem; }

@media(max-width:768px){ .ceo-grid { grid-template-columns:1fr; } }

/* ---------- MeeM Academia ---------- */
/* Problem diagram */
.problem-diagram { position:relative; height:37rem; max-width:32rem; margin:0 auto; }
.problem-node {
  position:absolute;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; color:#fff;
  box-shadow:var(--shadow-md);
  border:4px solid #fff;
  text-align:center;
  font-size:.9rem;
}
.problem-node--center { width:8rem; height:8rem; background:var(--meem-magenta); top:50%; left:50%; transform:translate(-50%,-50%); z-index:20; box-shadow:0 8px 24px rgba(194,30,93,.3); }
.problem-node--outer  { width:7rem; height:7rem; background:var(--meem-blue); z-index:10; }
.problem-node--top    { top:0; left:50%; transform:translateX(-50%); }
.problem-node--bottom { bottom:0; left:50%; transform:translateX(-50%); }
.problem-node--left   { left:0; top:50%; transform:translateY(-50%); }
.problem-node--right  { right:0; top:50%; transform:translateY(-50%); }
.problem-arrow {
  position:absolute; background:linear-gradient(var(--meem-blue),var(--meem-magenta));
  pointer-events:none;
}
.problem-bubble {
  position:absolute; background:#fff; border:1px solid rgba(108,117,125,.1);
  border-radius:.75rem; padding:.6rem .75rem;
  font-size:.7rem; color:var(--meem-charcoal);
  box-shadow:var(--shadow-sm); z-index:5;
}

/* Venn */
.venn { position:relative; height:20rem; display:flex; align-items:center; justify-content:center; }
.venn-circle {
  position:absolute;
  width:12rem; height:12rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:1.1rem; color:#fff;
  mix-blend-mode:multiply;
}
.venn-circle--top    { background:rgba(194,30,93,.8); top:0; left:50%; transform:translateX(-50%); }
.venn-circle--left   { background:rgba(46,109,164,.8); bottom:0; left:25%; transform:translateX(-50%); }
.venn-circle--right  { background:rgba(47,167,95,.8); bottom:0; right:25%; transform:translateX(50%); }

/* AI Tech 3 columns */
.tech-cols { display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.tech-col  { flex:1; min-width:12rem; background:#fff; border:1px solid rgba(108,117,125,.1); border-radius:var(--radius-lg); padding:1.5rem; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); }
.tech-col__header { text-align:center; margin-bottom:1.5rem; }
.tech-col__title  { font-size:1rem; font-weight:700; color:var(--meem-blue); }
.tech-col__sub    { font-size:.8rem; color:var(--meem-magenta); font-weight:500; }
.tech-col__img    { aspect-ratio:16/9; border-radius:.75rem; overflow:hidden; margin-bottom:1.5rem; background:var(--meem-cloud); }
.tech-col__img img{ width:100%; height:100%; object-fit:cover; }
.tech-col ul li   { display:flex; gap:.5rem; font-size:.875rem; color:var(--meem-charcoal); margin-bottom:.75rem; }
.tech-op  { display:flex; align-items:center; justify-content:center; font-size:3.5rem; color:var(--meem-blue); font-weight:300; padding:0 .5rem; }

/* ---------- QuranTutor ---------- */
.risks-list { display:flex; flex-direction:column; gap:2rem; }
.risk-item  { display:flex; gap:1.5rem; }
.risk-bar   { width:.375rem; background:var(--meem-magenta); flex-shrink:0; border-radius:999px; }
.risk-item h3 { font-size:1.4rem; font-weight:700; color:var(--meem-blue); margin-bottom:.5rem; }
.risk-item p  { font-size:1.05rem; color:var(--meem-grey); line-height:1.7; }

.agi-table { width:100%; border-collapse:collapse; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); }
.agi-table th { padding:1rem 1.5rem; background:var(--meem-magenta); color:#fff; font-size:1rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; text-align:left; }
.agi-table td { padding:1.25rem 1.5rem; font-size:1rem; vertical-align:top; }
.agi-table tr:nth-child(odd)  td { background:#fff; }
.agi-table tr:nth-child(even) td { background:var(--meem-cloud); }
.agi-table td:nth-child(2) { border-left:1px solid rgba(108,117,125,.1); }
.highlight-word { border-bottom:2px dotted var(--meem-magenta); }

.steps-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:1.5rem; }
.step-card  { width:100%; background:#fff; border:1px solid rgba(108,117,125,.1); border-radius:var(--radius-xl); padding:2rem; box-shadow:var(--shadow-sm); transition:var(--transition); }
.step-card:hover { box-shadow:var(--shadow-md); }
@media(min-width:640px) { .step-card { width:calc(50% - .75rem); } }
@media(min-width:1024px){ .step-card { width:calc(25% - 1.125rem); } }

.dark-banner {
  background: linear-gradient(135deg, var(--meem-blue), var(--meem-charcoal));
  border-radius: var(--radius-xl);
  padding: 3rem;
  color: #fff;
  position:relative;overflow:hidden;
}
.dark-banner h2 { font-family:var(--font-serif); font-size:1.8rem; color:#fff; margin-bottom:1rem; }
.dark-banner p  { font-size:1rem; color:rgba(255,255,255,.85); line-height:1.8; }
.dark-banner__grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; }
@media(max-width:640px){ .dark-banner__grid { grid-template-columns:1fr; } }

/* ---------- GoLSchool ---------- */
.four-h { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
@media(max-width:1024px){ .four-h { grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px) { .four-h { grid-template-columns:1fr; } }
.h-card { border-radius:var(--radius-xl); border:1px solid rgba(108,117,125,.1); padding:2rem; background:#fff; box-shadow:var(--shadow-sm); transition:var(--transition); }
.h-card:hover { box-shadow:var(--shadow-lg); }
.h-card__icon  { margin-bottom:1.5rem; }
.h-card__title { font-family:var(--font-serif); font-size:1.5rem; color:var(--meem-blue); }
.h-card__sub   { font-size:.65rem; text-transform:uppercase;letter-spacing:.12em; color:var(--meem-grey); margin:.25rem 0 1rem; display:block; }
.h-card p      { font-size:.875rem; color:var(--meem-charcoal); line-height:1.7; }

/* ---------- MQL Campaign ---------- */
.mql-page-header h1 { font-family:var(--font-serif); font-size:clamp(2.5rem,7vw,4.5rem); color:var(--meem-blue); line-height:1.1; }
.mql-page-header h1 span { color:var(--meem-magenta); }
.mql-vision-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.mql-vision-img { aspect-ratio:1; border-radius:var(--radius-xl); overflow:hidden; border:1px solid rgba(108,117,125,.1); box-shadow:var(--shadow-lg); position:relative; }
.mql-vision-img img { width:100%; height:100%; object-fit:cover; }
.mql-vision-img-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(46,109,164,.2), transparent); }
@media(max-width:768px){ .mql-vision-grid { grid-template-columns:1fr; } }
.quote-bar { border-left:4px solid var(--meem-magenta); padding:1rem 1.5rem; font-style:italic; color:var(--meem-grey); font-size:1.05rem; line-height:1.75; }

.target-box  { background:#fff; border:1px solid rgba(108,117,125,.1); border-radius:var(--radius-xl); padding:2.5rem 3.5rem; box-shadow:var(--shadow-sm); margin-bottom:4rem; }
.target-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:3rem 4rem; }
.target-item { text-align:center; width:100%; }
@media(min-width:640px){ .target-item { width:calc(50% - 2rem); } }
@media(min-width:1024px){ .target-item { width:calc(33.333% - 2.67rem); } }
.target-item__num   { font-size:3rem; font-weight:700; color:var(--meem-magenta); margin-bottom:.25rem; }
.target-item__label { font-size:1.15rem; font-weight:700; color:var(--meem-blue); margin-bottom:.75rem; }
.target-item p      { font-size:.9rem; color:var(--meem-grey); max-width:14rem; margin:0 auto; line-height:1.65; }

.pillar-circles { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
@media(max-width:768px){ .pillar-circles { grid-template-columns:1fr; } }
.pillar-circle-card { text-align:center; cursor:pointer; }
.pillar-circle-card__icon {
  width:12rem; height:12rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 2rem;
  box-shadow:0 12px 40px rgba(194,30,93,.2);
  transition:var(--transition);
  color:#fff;
}
.pillar-circle-card:hover .pillar-circle-card__icon { transform:scale(1.05); }
.pillar-circle-card h3 { font-family:var(--font-serif); font-size:1.4rem; color:var(--meem-blue); margin-bottom:1rem; transition:var(--transition); }
.pillar-circle-card:hover h3 { color:var(--meem-magenta); }
.pillar-circle-card p   { color:var(--meem-grey); line-height:1.7; margin-bottom:1rem; }
.pillar-circle-card .hint { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--meem-magenta); opacity:0; transition:var(--transition); }
.pillar-circle-card:hover .hint { opacity:1; }

/* ---------- Animations ---------- */
.fade-up { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.fade-up.is-visible { opacity:1; transform:translateY(0); }

/* ---------- Utility ---------- */
.text-center { text-align:center; }
.mt-4  { margin-top:1rem; }
.mt-6  { margin-top:1.5rem; }
.mt-8  { margin-top:2rem; }
.mt-12 { margin-top:3rem; }
.mt-16 { margin-top:4rem; }
.mb-4  { margin-bottom:1rem; }
.mb-8  { margin-bottom:2rem; }
.mb-12 { margin-bottom:3rem; }
.mb-16 { margin-bottom:4rem; }
.mb-24 { margin-bottom:6rem; }
.gap-section { margin-bottom:6rem; }
.divider { border:none; border-top:1px solid rgba(108,117,125,.1); margin:4rem 0; }