/* =====================================================
   MH Theme — Phase 30 Global Token Enforcement

   Purpose: fix root causes exposed by light mode. Legacy .mht-* sections
   were still carrying local hardcoded colors, local button variants,
   weak surface contrast, and section-specific visual rules. This file loads
   last and forces the main interactive/card/surface system through the brand
   tokens without changing markup or deleting liked sections.
   ===================================================== */

/* ──────────────────────────────────────────────
   Global brand role aliases for this enforcement layer
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"],
html[data-mht-theme="light"] {
  --mht-l-bg: #F6F2F7;
  --mht-l-bg-soft: #FBF8FD;
  --mht-l-surface: rgba(255,255,255,.88);
  --mht-l-surface-solid: #FFFFFF;
  --mht-l-card: rgba(255,255,255,.82);
  --mht-l-card-strong: rgba(253,251,255,.94);
  --mht-l-border: rgba(76,52,93,.18);
  --mht-l-border-strong: rgba(76,52,93,.28);
  --mht-l-text: #2F1F3A;
  --mht-l-text-soft: #4C345D;
  --mht-l-muted: #7C7284;
  --mht-l-brand: #8E63A3;
  --mht-l-brand-deep: #4C345D;
  --mht-l-glow: #B78CFF;
  --mht-l-lavender: #E6D8FF;
}

/* Links should never fall back to browser default underline/purple during
   loading/order conflicts. */
.mht-nav a,
.mht-footer a,
.mht-hero a,
.mht-section a,
.mht-u-btn,
.mht-btn {
  text-decoration: none;
}

/* ──────────────────────────────────────────────
   Header glass stays glass. It must not become a flat grey bar.
────────────────────────────────────────────── */
.mht-nav__inner {
  -webkit-backdrop-filter: saturate(150%) blur(18px);
  backdrop-filter: saturate(150%) blur(18px);
}
html[data-mht-theme-effective="light"] .mht-nav__inner,
html[data-mht-theme="light"] .mht-nav__inner {
  background:
    linear-gradient(180deg, rgba(255,255,255,.50), rgba(246,242,247,.34)),
    linear-gradient(90deg, rgba(230,216,255,.30), rgba(255,255,255,.20), rgba(230,216,255,.24));
  border-color: rgba(76,52,93,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.76),
    0 18px 44px rgba(76,52,93,.12),
    0 0 42px rgba(183,140,255,.14);
}
html[data-mht-theme-effective="light"] .mht-nav__link,
html[data-mht-theme="light"] .mht-nav__link {
  color: rgba(47,31,58,.72) !important;
  text-decoration: none !important;
}
html[data-mht-theme-effective="light"] .mht-nav__link:hover,
html[data-mht-theme-effective="light"] .mht-nav__link.is-active,
html[data-mht-theme="light"] .mht-nav__link:hover,
html[data-mht-theme="light"] .mht-nav__link.is-active {
  color: #2F1F3A !important;
}

/* ──────────────────────────────────────────────
   Button foundation: primary cannot be black-heavy in light mode.
   Base = brand purple. Hover = darker brand. Same contract everywhere.
────────────────────────────────────────────── */
.mht-u-btn,
.mht-u-btn.mht-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px;
  text-decoration: none !important;
  vertical-align: middle;
}
.mht-u-btn__label { display: inline-flex; align-items: center; justify-content: center; min-width: 0; }
.mht-u-btn__orb {
  display: inline-grid !important;
  place-items: center !important;
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  aspect-ratio: 1 / 1;
}
.mht-u-btn__svg { width: 18px !important; height: 18px !important; }

html[data-mht-theme-effective="light"] .mht-u-btn--primary,
html[data-mht-theme="light"] .mht-u-btn--primary {
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(246,242,247,.68)) !important;
  border-color: rgba(142,99,163,.34) !important;
  color: #2F1F3A !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.84),
    0 12px 30px rgba(76,52,93,.07) !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--primary:hover,
html[data-mht-theme="light"] .mht-u-btn--primary:hover {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(230,216,255,.74)) !important;
  border-color: rgba(142,99,163,.46) !important;
  color: #2F1F3A !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 14px 32px rgba(76,52,93,.09) !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--primary .mht-u-btn__orb,
html[data-mht-theme="light"] .mht-u-btn--primary .mht-u-btn__orb {
  background: #E6D8FF !important;
  color: #2F1F3A !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--primary:hover .mht-u-btn__orb,
html[data-mht-theme="light"] .mht-u-btn--primary:hover .mht-u-btn__orb {
  background: #B78CFF !important;
  color: #141017 !important;
}

html[data-mht-theme-effective="light"] .mht-u-btn--secondary,
html[data-mht-theme-effective="light"] .mht-u-btn--ghost,
html[data-mht-theme="light"] .mht-u-btn--secondary,
html[data-mht-theme="light"] .mht-u-btn--ghost {
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(246,242,247,.68)) !important;
  border-color: rgba(142,99,163,.34) !important;
  color: #2F1F3A !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.74) !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--secondary:hover,
html[data-mht-theme-effective="light"] .mht-u-btn--ghost:hover,
html[data-mht-theme="light"] .mht-u-btn--secondary:hover,
html[data-mht-theme="light"] .mht-u-btn--ghost:hover {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(230,216,255,.74)) !important;
  border-color: rgba(142,99,163,.46) !important;
  color: #2F1F3A !important;
}

/* Nav/enquiries button: same light-mode family, not a separate purple fill. */
html[data-mht-theme-effective="light"] .mht-u-btn--nav,
html[data-mht-theme="light"] .mht-u-btn--nav {
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(246,242,247,.68)) !important;
  border-color: rgba(142,99,163,.38) !important;
  color: #2F1F3A !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.64), 0 10px 24px rgba(76,52,93,.08) !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--nav .mht-u-btn__dot,
html[data-mht-theme="light"] .mht-u-btn--nav .mht-u-btn__dot {
  background: #B78CFF !important;
  box-shadow: 0 0 12px rgba(183,140,255,.38) !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--nav:hover,
html[data-mht-theme="light"] .mht-u-btn--nav:hover {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(230,216,255,.74)) !important;
  border-color: rgba(142,99,163,.50) !important;
  color: #2F1F3A !important;
}
html[data-mht-theme-effective="light"] .mht-u-btn--nav:hover .mht-u-btn__dot,
html[data-mht-theme="light"] .mht-u-btn--nav:hover .mht-u-btn__dot {
  background: #B78CFF !important;
}

/* ──────────────────────────────────────────────
   What I Build: no long intro/card descriptions, stronger cards.
────────────────────────────────────────────── */
.mht-build__copy,
.mht-service-card__desc {
  display: none !important;
}
.mht-build__head {
  grid-template-columns: minmax(0, 1fr) !important;
  max-width: 780px;
}
html[data-mht-theme-effective="light"] .mht-build__tabs,
html[data-mht-theme="light"] .mht-build__tabs {
  background: rgba(255,255,255,.70) !important;
  border-color: rgba(76,52,93,.18) !important;
}
html[data-mht-theme-effective="light"] .mht-build__tab,
html[data-mht-theme="light"] .mht-build__tab {
  color: rgba(47,31,58,.62) !important;
}
html[data-mht-theme-effective="light"] .mht-build__tab.is-active,
html[data-mht-theme="light"] .mht-build__tab.is-active {
  color: #F6F2F7 !important;
}
html[data-mht-theme-effective="light"] .mht-build__grid,
html[data-mht-theme="light"] .mht-build__grid {
  background: rgba(76,52,93,.18) !important;
  box-shadow: 0 22px 70px rgba(76,52,93,.10) !important;
}
html[data-mht-theme-effective="light"] .mht-service-card,
html[data-mht-theme="light"] .mht-service-card {
  background:
    radial-gradient(circle at 86% 0%, rgba(230,216,255,.46), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.95), rgba(253,251,255,.84)) !important;
  box-shadow: inset 0 0 0 1px rgba(76,52,93,.08) !important;
}
html[data-mht-theme-effective="light"] .mht-service-card:hover,
html[data-mht-theme="light"] .mht-service-card:hover {
  background:
    radial-gradient(circle at 86% 0%, rgba(197,166,211,.50), transparent 46%),
    linear-gradient(180deg, #FFFFFF, #F6F2F7) !important;
}
html[data-mht-theme-effective="light"] .mht-service-card__title,
html[data-mht-theme="light"] .mht-service-card__title { color: #2F1F3A !important; }
html[data-mht-theme-effective="light"] .mht-service-card__tag,
html[data-mht-theme="light"] .mht-service-card__tag {
  background: rgba(230,216,255,.52) !important;
  border-color: rgba(76,52,93,.12) !important;
  color: rgba(76,52,93,.68) !important;
}
html[data-mht-theme-effective="light"] .mht-service-card__footer,
html[data-mht-theme="light"] .mht-service-card__footer { border-top-color: rgba(76,52,93,.14) !important; }
html[data-mht-theme-effective="light"] .mht-service-card__arrow,
html[data-mht-theme="light"] .mht-service-card__arrow {
  background: rgba(255,255,255,.76) !important;
  border-color: rgba(76,52,93,.18) !important;
  color: #4C345D !important;
}

/* ──────────────────────────────────────────────
   Modals: stable readable surface in light mode.
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"] .mht-modal,
html[data-mht-theme="light"] .mht-modal {
  background: rgba(47,31,58,.38) !important;
}
html[data-mht-theme-effective="light"] .mht-modal__dialog,
html[data-mht-theme="light"] .mht-modal__dialog {
  background:
    radial-gradient(circle at 82% 0%, rgba(230,216,255,.54), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,242,247,.92)) !important;
  border: 1px solid rgba(76,52,93,.18) !important;
  box-shadow: 0 30px 90px rgba(47,31,58,.24), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
html[data-mht-theme-effective="light"] .mht-modal__title,
html[data-mht-theme-effective="light"] .mht-modal__desc,
html[data-mht-theme-effective="light"] .mht-modal__list li,
html[data-mht-theme="light"] .mht-modal__title,
html[data-mht-theme="light"] .mht-modal__desc,
html[data-mht-theme="light"] .mht-modal__list li {
  color: #2F1F3A !important;
}
html[data-mht-theme-effective="light"] .mht-modal__investment,
html[data-mht-theme="light"] .mht-modal__investment {
  color: #7C7284 !important;
  border-top-color: rgba(76,52,93,.14) !important;
}

/* ──────────────────────────────────────────────
   Project cards: remove muddy black overlay on light mode.
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"] .mht-work-tile::after,
html[data-mht-theme="light"] .mht-work-tile::after {
  background:
    linear-gradient(to bottom, rgba(255,255,255,.02), rgba(76,52,93,.06)),
    radial-gradient(ellipse at center, transparent 48%, rgba(76,52,93,.10) 100%) !important;
}
html[data-mht-theme-effective="light"] .mht-work-tile.has-image img,
html[data-mht-theme-effective="light"] .mht-work-card.has-image img,
html[data-mht-theme="light"] .mht-work-tile.has-image img,
html[data-mht-theme="light"] .mht-work-card.has-image img {
  filter: saturate(.96) contrast(.98) brightness(1.04) !important;
}

/* ──────────────────────────────────────────────
   Proof/testimonials/FAQ/cards: use real light surfaces.
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"] .mht-testimonial,
html[data-mht-theme-effective="light"] .mht-faq__item,
html[data-mht-theme="light"] .mht-testimonial,
html[data-mht-theme="light"] .mht-faq__item {
  background:
    radial-gradient(circle at 92% 0%, rgba(230,216,255,.40), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(253,251,255,.82)) !important;
  border-color: rgba(76,52,93,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 18px 48px rgba(76,52,93,.08) !important;
}
html[data-mht-theme-effective="light"] .mht-testimonial__quote p,
html[data-mht-theme-effective="light"] .mht-faq__answer-body,
html[data-mht-theme="light"] .mht-testimonial__quote p,
html[data-mht-theme="light"] .mht-faq__answer-body {
  color: #4C345D !important;
}
html[data-mht-theme-effective="light"] .mht-faq__question,
html[data-mht-theme="light"] .mht-faq__question {
  color: #2F1F3A !important;
}
html[data-mht-theme-effective="light"] .mht-faq__icon,
html[data-mht-theme="light"] .mht-faq__icon {
  background: rgba(230,216,255,.46) !important;
  border-color: rgba(142,99,163,.42) !important;
  color: #8E63A3 !important;
}

/* ──────────────────────────────────────────────
   Logo wall and separators.
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"] .mht-logo-mark,
html[data-mht-theme="light"] .mht-logo-mark {
  color: #8E63A3 !important;
  opacity: .58 !important;
}
html[data-mht-theme-effective="light"] .mht-logo-item:hover .mht-logo-mark,
html[data-mht-theme="light"] .mht-logo-item:hover .mht-logo-mark {
  color: #B78CFF !important;
  opacity: .95 !important;
}
html[data-mht-theme-effective="light"] .mht-logo-wall,
html[data-mht-theme-effective="light"] .mht-footer,
html[data-mht-theme-effective="light"] .mht-footer__bottom,
html[data-mht-theme-effective="light"] .mht-footer__links-cta,
html[data-mht-theme="light"] .mht-logo-wall,
html[data-mht-theme="light"] .mht-footer,
html[data-mht-theme="light"] .mht-footer__bottom,
html[data-mht-theme="light"] .mht-footer__links-cta {
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
  border-image: none !important;
}

/* ──────────────────────────────────────────────
   Footer: no foggy grey disaster in light mode.
────────────────────────────────────────────── */
html[data-mht-theme-effective="light"] .mht-footer,
html[data-mht-theme="light"] .mht-footer {
  background:
    radial-gradient(ellipse 44% 24% at 50% 0%, rgba(230,216,255,.50), transparent 70%),
    linear-gradient(180deg, rgba(246,242,247,0) 0%, rgba(253,251,255,.74) 36%, rgba(246,242,247,.96) 100%) !important;
  color: #4C345D !important;
}
html[data-mht-theme-effective="light"] .mht-footer::before,
html[data-mht-theme="light"] .mht-footer::before {
  opacity: .24 !important;
}
html[data-mht-theme-effective="light"] .mht-footer__brand-line,
html[data-mht-theme-effective="light"] .mht-footer__big-link,
html[data-mht-theme-effective="light"] .mht-footer__social-title,
html[data-mht-theme="light"] .mht-footer__brand-line,
html[data-mht-theme="light"] .mht-footer__big-link,
html[data-mht-theme="light"] .mht-footer__social-title {
  color: #2F1F3A !important;
}
html[data-mht-theme-effective="light"] .mht-footer__links-cta-note,
html[data-mht-theme-effective="light"] .mht-footer__copyright-bottom,
html[data-mht-theme-effective="light"] .mht-footer__policy-link,
html[data-mht-theme="light"] .mht-footer__links-cta-note,
html[data-mht-theme="light"] .mht-footer__copyright-bottom,
html[data-mht-theme="light"] .mht-footer__policy-link {
  color: rgba(76,52,93,.62) !important;
}
html[data-mht-theme-effective="light"] .mht-footer__social-icon,
html[data-mht-theme="light"] .mht-footer__social-icon {
  background: rgba(255,255,255,.66) !important;
  border-color: rgba(76,52,93,.16) !important;
  color: #8E63A3 !important;
}
html[data-mht-theme-effective="light"] .mht-footer__social-icon:hover,
html[data-mht-theme="light"] .mht-footer__social-icon:hover {
  background: #B78CFF !important;
  border-color: #B78CFF !important;
  color: #141017 !important;
}

@media (max-width: 980px) {
  .mht-build__head { max-width: none; }
}
