/* ==========================================================================
   MomentGlow — global stylesheet (single source of truth for the site)
   Library-first: Bootstrap 5.3.3 carries grid/utilities, this file only adds
   the .mg-* design layer (tokens, components, decorations).
   TODO: keep new section styles here, never inline <style> blocks in pages.
   NOTE: never put empty url(../../images/momentglow_bd8089d491c03.94348010.jpg) tokens in this file — the photo pipeline
   rewrites them; backgrounds are set inline per-section in HTML instead.
   ========================================================================== */

/* ---------- 1. Design tokens ---------- */
:root {
  --mg-ivory: #f7f3ec;
  --mg-paper: #fffcf6;
  --mg-sand: #efe7d8;
  --mg-ink: #211d16;
  --mg-muted: #6f6759;
  --mg-gold: #a07c3b;
  --mg-gold-soft: #c9a96a;
  --mg-gold-tint: #f0e6d2;
  --mg-emerald: #1e3a2b;
  --mg-emerald-deep: #142a1f;
  --mg-graphite: #23211e;
  --mg-cream-text: #f4efe6;
  --mg-line: rgba(33, 29, 22, .14);
  --mg-line-strong: rgba(33, 29, 22, .34);
  --mg-radius: 1.25rem;
  --mg-radius-lg: 2rem;
  --mg-shadow: 0 30px 70px -38px rgba(33, 29, 22, .45);
  --mg-font-display: "Playfair Display", "Georgia", serif;
  --mg-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
}

/* Bootstrap re-skin: warm ivory base, never pure black / pure white */
[data-bs-theme="light"] {
  --bs-body-bg: var(--mg-ivory);
  --bs-body-color: var(--mg-ink);
  --bs-body-font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-primary: #a07c3b;
  --bs-primary-rgb: 160, 124, 59;
  --bs-link-color: #8a6a33;
  --bs-link-hover-color: #6e5426;
  --bs-border-color: var(--mg-line);
  --bs-border-radius: 1rem;
}
/* ---------- 2. Base typography ---------- */
body {
  font-family: "Manrope", system-ui, sans-serif;
  color: var(--mg-ink);
  background: var(--mg-ivory);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, .h1, h2, .h2, h3, .h3, .display-1, .display-2, .display-3, .display-4 {
  font-family: var(--mg-font-display);
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--mg-gold-soft);
}

p { color: #4c463c; line-height: 1.75; }
a { color: #8a6a30; text-underline-offset: 3px; }
a:hover { color: var(--mg-gold); }
::selection { background: var(--mg-gold); color: #fff; }

.mg-mono {
  font-family: var(--mg-font-mono);
  font-size: .72rem;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Mono kicker label with leading rule */
.mg-kicker {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  font-family: var(--mg-font-mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mg-gold);
}
.mg-kicker::before {
  content: "";
  width: 34px;
  height: 1px;
  background: var(--mg-gold);
  display: inline-block;
}
.mg-kicker--light { color: var(--mg-gold-soft); }

/* Giant outlined numeral (decorative) */
.mg-num-ghost {
  font-family: var(--mg-font-display);
  font-weight: 800;
  line-height: .8;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(33, 29, 22, .22);
  user-select: none;
}
.mg-section--dark .mg-num-ghost,
.mg-on-dark .mg-num-ghost { -webkit-text-stroke: 1.5px rgba(244, 239, 230, .25); }

/* Status dot with pulse */
.mg-dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: #3d9a50;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(61, 154, 80, .5);
  animation: mgPulse 2.2s infinite;
}
@keyframes mgPulse { 0% { box-shadow: 0 0 0 0 rgba(61, 154, 80, .45); } 70% { box-shadow: 0 0 0 9px rgba(61, 154, 80, 0); } 100% { box-shadow: 0 0 0 0 rgba(61, 154, 80, 0); } }
.mg-dot { animation: mgPulse 2.2s infinite; }

/* ---------- 3. Buttons & links ---------- */
.mg-btn {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  padding: .9rem 1.7rem;
  border-radius: 999px;
  background: var(--mg-graphite);
  color: var(--mg-cream-text);
  font-weight: 700;
  font-size: .92rem;
  border: 1px solid var(--mg-graphite);
  transition: transform .25s ease, background .25s ease, color .25s ease;
  text-decoration: none;
}
.mg-btn:hover { transform: translateY(-2px); background: var(--mg-gold); border-color: var(--mg-gold); color: #fff; }
.mg-btn--gold { background: var(--mg-gold); border-color: var(--mg-gold); color: #fff; }
.mg-btn--gold:hover { background: #8a6a30; border-color: #6e5426; color: #fff; }
.mg-btn--ghost {
  background: transparent;
  color: inherit;
  border: 1px solid var(--mg-line-strong);
}
.mg-btn--ghost:hover { background: var(--mg-ink); color: var(--mg-cream-text); border-color: var(--mg-ink); }
.mg-btn--light { background: var(--mg-cream-text); color: var(--mg-ink); border-color: var(--mg-cream-text); }
.mg-btn--light:hover { background: var(--mg-gold-soft); border-color: var(--mg-gold-soft); color: var(--mg-ink); }
.mg-btn--ghost-light { background: transparent; color: var(--mg-cream-text); border: 1px solid rgba(244, 239, 230, .4); }
.mg-btn--ghost-light:hover { background: rgba(244, 239, 230, .14); color: #fff; border-color: rgba(244, 239, 230, .6); }
/* Standalone-safe gold button (used without .mg-btn base in input-groups) */
button.mg-btn--gold, .btn.mg-btn--gold { border-radius: 999px; font-weight: 700; }

/* Inline text link used inside paragraphs (internal linking) */
.mg-textlink {
  color: var(--mg-gold);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed rgba(160, 124, 59, .55);
}
.mg-textlink:hover { color: #6e5426; border-bottom-color: #6e5426; }

/* ---------- 4. Sections ---------- */
.mg-section { padding: clamp(4.5rem, 9vw, 7.5rem) 0; position: relative; }
.mg-section--dark { background: var(--mg-graphite); color: var(--mg-cream-text); }
.mg-section--dark p { color: rgba(244, 239, 230, .78); }
.mg-section--dark h1, .mg-section--dark h2, .mg-section--dark h3 { color: var(--mg-cream-text); }
.mg-section--emerald { background: var(--mg-emerald); color: var(--mg-cream-text); }
.mg-section--paper { background: var(--mg-paper); }

/* Decorative dot grid + hatch (pure CSS, no images) */
.mg-dotgrid {
  background-image: radial-gradient(rgba(33, 29, 22, .16) 1px, transparent 1.4px);
  background-size: 22px 22px;
}
.mg-section--dark .mg-dotgrid,
.mg-dotgrid--light {
  background-image: radial-gradient(rgba(244, 239, 230, .16) 1px, transparent 1.4px);
}
.mg-hatch {
  background-image: repeating-linear-gradient(45deg, rgba(160, 124, 59, .16) 0 1px, transparent 1px 9px);
}

/* Hairline frame card with offset border (editorial look) */
.mg-card--frame { position: relative; }
.mg-card--frame::after {
  content: "";
  position: absolute;
  inset: 14px -14px -14px 14px;
  border: 1px solid var(--mg-gold-soft);
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
}

/* ---------- 5. Header ---------- */
.mg-topbar {
  background: var(--mg-graphite);
  color: rgba(244, 239, 230, .85);
  font-family: var(--mg-font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  padding: .55rem 0;
}
.mg-topbar a { color: rgba(244, 239, 230, .92); text-decoration: none; }
.mg-topbar a:hover { color: var(--mg-gold-soft); }
.mg-topbar__group { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.mg-topbar i { color: var(--mg-gold-soft); }

.mg-nav {
  background: rgba(247, 243, 236, .86);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--mg-line);
  padding: .9rem 0;
  transition: box-shadow .3s ease, background .3s ease;
}
.mg-nav.is-scrolled { box-shadow: 0 14px 40px -22px rgba(33, 29, 22, .4); background: rgba(255, 252, 246, .92); }
.mg-brand { display: flex; align-items: center; gap: .7rem; }
.mg-brand__logo { height: 42px; width: auto; }
.mg-brand__text {
  font-family: var(--mg-font-display);
  font-weight: 700;
  font-size: 1.35rem;
  color: var(--mg-ink);
  line-height: 1;
}
.mg-brand__text small { display: block; font-family: var(--mg-font-mono); font-size: .58rem; letter-spacing: .3em; color: var(--mg-gold); }
.mg-nav-link {
  font-weight: 600;
  font-size: .95rem;
  color: var(--mg-ink);
  text-decoration: none;
  padding: .35rem 0;
  position: relative;
}
.mg-nav-link::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 0; height: 2px;
  background: var(--mg-gold);
  transition: width .25s ease;
}
.mg-nav-link:hover, .mg-nav-link.is-active { color: var(--mg-gold); }
.mg-nav-link:hover::after, .mg-nav-link.is-active::after { width: 100%; }
.mg-nav-link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  height: 2px; width: 0;
  background: var(--mg-gold);
  transition: width .25s ease;
}
.mg-burger {
  border: 1px solid var(--mg-line-strong);
  border-radius: 12px;
  padding: .45rem .7rem;
  color: var(--mg-ink);
  font-size: 1.1rem;
}
.mg-burger:focus { box-shadow: none; }

/* Mobile drawer (dark graphite, matches footer) */
.mg-drawer { background: var(--mg-graphite); width: min(88vw, 380px); color: var(--mg-cream-text); }
.mg-drawer .offcanvas-header { border-bottom: 1px solid rgba(244, 239, 230, .14); }
.mg-drawer .mg-brand__text { color: var(--mg-cream-text); }
.mg-drawer .btn-close { filter: invert(1); }
.mg-drawer__link {
  display: block;
  font-family: var(--mg-font-display);
  font-size: 1.7rem;
  font-weight: 600;
  color: var(--mg-cream-text);
  text-decoration: none;
  padding: .7rem 0;
  border-bottom: 1px solid rgba(244, 239, 230, .12);
  transition: color .2s ease, padding-left .2s ease;
}
.mg-drawer__link:hover { color: var(--mg-gold-soft); padding-left: .5rem; }
.mg-drawer__contact {
  font-family: var(--mg-font-mono);
  font-size: .78rem;
  letter-spacing: .04em;
  color: rgba(244, 239, 230, .75);
  display: block;
  padding: .3rem 0;
}
.mg-drawer__label {
  font-family: var(--mg-font-mono);
  font-size: .66rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mg-gold-soft);
}

/* ---------- 6. Hero ---------- */
.mg-hero { position: relative; overflow: hidden; background: var(--mg-ivory); }
.mg-hero__meta {
  border-bottom: 1px solid var(--mg-line);
  padding: .9rem 0;
}
.mg-hero__title {
  font-size: clamp(3rem, 9.5vw, 8.2rem);
  line-height: .96;
  letter-spacing: -.03em;
}
.mg-hero__title .mg-outline {
  color: transparent;
  -webkit-text-stroke: 2px var(--mg-ink);
}
.mg-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem 1.1rem;
  border-radius: 999px;
  background: var(--mg-graphite);
  color: var(--mg-cream-text);
  font-family: var(--mg-font-mono);
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.mg-hero__orbit {
  width: 108px; height: 108px;
  border: 1px dashed var(--mg-gold);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--mg-gold);
  font-size: 1.5rem;
  animation: mgSpin 16s linear infinite;
  background: rgba(255, 252, 246, .75);
}
@keyframes mgSpin { to { transform: rotate(360deg); } }

/* Bottom console strip of the hero */
.mg-console {
  border-top: 1px solid var(--mg-line);
  background: var(--mg-paper);
}
.mg-console__cell {
  padding: 1.4rem 1.6rem;
  border-right: 1px solid var(--mg-line);
  min-height: 118px;
}
.mg-console__cell:last-child { border-right: 0; }

/* Floating glass widget */
.mg-glass {
  background: rgba(255, 252, 246, .72);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, .65);
  box-shadow: 0 24px 60px -30px rgba(33, 29, 22, .5);
  border-radius: var(--mg-radius);
}

/* ---------- 7. Cards, chips, media ---------- */
.mg-card {
  background: var(--mg-paper);
  border: 1px solid var(--mg-line);
  border-radius: var(--mg-radius);
  transition: transform .3s ease, box-shadow .3s ease;
}
.mg-card--hover:hover { transform: translateY(-6px); box-shadow: var(--mg-shadow); }
.mg-card__icon {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--mg-gold-tint);
  color: var(--mg-gold);
  font-size: 1.25rem;
}
.mg-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--mg-font-mono);
  font-size: .66rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .32rem .7rem;
  border: 1px solid var(--mg-line-strong);
  border-radius: 999px;
  color: var(--mg-muted);
  background: transparent;
}
.mg-chip--gold { border-color: rgba(160, 124, 59, .5); color: var(--mg-gold); background: rgba(160, 124, 59, .08); }
.mg-chip--dark { border-color: rgba(244, 239, 230, .35); color: var(--mg-cream-text); }
.mg-chip--glass { border-color: rgba(255, 255, 255, .35); color: rgba(255, 255, 255, .92); background: rgba(255, 255, 255, .08); backdrop-filter: blur(6px); }

.mg-media {
  border-radius: var(--mg-radius);
  overflow: hidden;
  background: var(--mg-sand);
}
.mg-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Dark media block with inline overlay background (set per-section in HTML) */
.mg-media-dark {
  border-radius: var(--mg-radius);
  background-size: cover;
  background-position: center;
  color: var(--mg-cream-text);
  overflow: hidden;
  position: relative;
}

.mg-avatar {
  width: 52px; height: 52px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--mg-gold-soft);
  background: var(--mg-sand);
}
.mg-avatar--sm { width: 42px; height: 42px; }

/* ---------- 8. Horizontal rail ---------- */
.mg-rail {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 1rem;
  scrollbar-width: none;
}
.mg-rail::-webkit-scrollbar { display: none; }
.mg-rail > * {
  scroll-snap-align: start;
  flex: 0 0 min(78vw, 420px);
}
.mg-rail__progress { height: 3px; background: var(--mg-line); border-radius: 99px; overflow: hidden; }
.mg-rail__bar { height: 100%; width: 20%; background: var(--mg-gold); border-radius: 99px; transition: width .2s ease; }
.mg-rail-btn {
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid var(--mg-line-strong);
  background: transparent;
  color: var(--mg-ink);
  transition: all .25s ease;
}
.mg-rail-btn:hover { background: var(--mg-graphite); color: var(--mg-cream-text); border-color: var(--mg-graphite); }

/* ---------- 9. Bento grid ---------- */
.mg-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1.25rem;
}
.mg-bento > * { border-radius: var(--mg-radius); }
/* Bento spans: wide hero tile, tall timeline, small squares */
.mg-tile--wide { grid-column: span 7; min-height: 320px; display: flex; align-items: flex-end; }
.mg-tile--tall { grid-column: span 5; grid-row: span 2; }
.mg-tile--mini { grid-column: span 3; }
.mg-tile__icon { font-size: 1.6rem; color: var(--mg-gold); margin-bottom: .9rem; display: inline-block; }
.mg-tile__body { max-width: 100%; }
@media (max-width: 991.98px) {
  .mg-tile--wide, .mg-tile--tall, .mg-tile--mini { grid-column: 1 / -1; grid-row: auto; }
}
.mg-tile {
  background: var(--mg-paper);
  border: 1px solid var(--mg-line);
  border-radius: var(--mg-radius);
  padding: 1.8rem;
  position: relative;
  overflow: hidden;
  height: 100%;
}
.mg-tile--dark { background: var(--mg-graphite); color: var(--mg-cream-text); border-color: transparent; }
.mg-tile--dark p { color: rgba(244, 239, 230, .75); }
.mg-tile--emerald { background: var(--mg-emerald); color: var(--mg-cream-text); }
.mg-tile--gold { background: var(--mg-gold-tint); }
.mg-tile__num { font-family: var(--mg-font-mono); font-size: .7rem; letter-spacing: .2em; color: var(--mg-gold); }

/* ---------- 10. Diagonal split ---------- */
.mg-split { display: grid; grid-template-columns: 1fr 1fr; position: relative; }
.mg-split__pane { padding: clamp(3rem, 6vw, 5.5rem); }
.mg-split__pane--dark { background: var(--mg-graphite); color: var(--mg-cream-text); }
.mg-split__pane--dark p { color: rgba(244, 239, 230, .78); }
.mg-split__badge {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%) rotate(-6deg);
  z-index: 3;
  background: var(--mg-gold);
  color: #fff;
  width: 92px; height: 92px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.6rem;
  box-shadow: 0 18px 44px -14px rgba(33, 29, 22, .5);
  border: 4px solid var(--mg-ivory);
}

/* ---------- 11. Steps ---------- */
.mg-step { position: relative; padding: 1.8rem; background: var(--mg-paper); border: 1px solid var(--mg-line); border-radius: var(--mg-radius); }
.mg-step__num {
  font-family: var(--mg-font-mono);
  font-size: .8rem;
  color: var(--mg-gold);
  letter-spacing: .2em;
}
.mg-step__big {
  font-family: var(--mg-font-display);
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(33, 29, 22, .35);
}

/* ---------- 12. Metrics ---------- */
.mg-metric { border-top: 1px solid var(--mg-line); padding-top: 1.4rem; }
.mg-metric__value {
  font-family: var(--mg-font-display);
  font-weight: 800;
  font-size: clamp(3rem, 6vw, 5rem);
  line-height: 1;
  color: var(--mg-ink);
}
.mg-section--dark .mg-metric__value { color: var(--mg-cream-text); }
.mg-metric__suffix { color: var(--mg-gold); font-size: .55em; }
.mg-metric__label { font-family: var(--mg-font-mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--mg-gold-soft); }
.mg-price { font-family: var(--mg-font-mono); font-size: .85rem; font-weight: 600; color: var(--mg-gold); white-space: nowrap; }
.mg-hours li { display: flex; gap: 1.2rem; padding: .8rem 0; border-bottom: 1px dashed var(--mg-line); }
.mg-hours li:last-child { border-bottom: 0; }
.mg-hours .mg-mono { color: var(--mg-gold); flex: 0 0 3.4rem; padding-top: .15rem; }
.mg-card--rail { scroll-snap-align: start; }
.mg-card--dark-line { background: transparent; border: 1px solid rgba(244, 239, 230, .16); }
.mg-input-dark {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .25);
  color: #fff;
}
.mg-input-dark::placeholder { color: rgba(255, 255, 255, .5); }
.mg-input-dark:focus { background: rgba(255, 255, 255, .12); color: #fff; box-shadow: none; border-color: var(--mg-gold-soft); }

/* ---------- 13. Quote ---------- */
.mg-quote__mark { font-size: 3.2rem; color: var(--mg-gold); line-height: 1; }
.mg-quote__text {
  font-family: var(--mg-font-display);
  font-size: clamp(1.5rem, 3.4vw, 2.5rem);
  line-height: 1.25;
  font-weight: 600;
}

/* ---------- 14. Slit gallery ---------- */
.mg-slits { display: flex; gap: 1rem; min-height: 460px; }
.mg-slit {
  flex: 1;
  border-radius: var(--mg-radius);
  background-size: cover;
  background-position: center;
  transition: flex .5s cubic-bezier(.22, .8, .3, 1);
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.mg-slit:hover, .mg-slit.is-open { flex: 2.6; }
.mg-slit__label {
  position: absolute;
  left: 1.2rem; right: 1.2rem; bottom: 1.2rem;
  color: #fff;
  display: flex;
  align-items: baseline;
  gap: .9rem;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .5);
}
.mg-slit__label .mg-mono { color: var(--mg-gold-soft); }

/* ---------- 15. Timeline ---------- */
.mg-timeline { position: relative; }
.mg-timeline__spine {
  position: absolute;
  left: 50%;
  top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(var(--mg-gold), var(--mg-line));
  transform: translateX(-.5px);
}
.mg-timeline__dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--mg-gold);
  border: 3px solid var(--mg-ivory);
  box-shadow: 0 0 0 1px var(--mg-gold);
}

/* ---------- 16. Team ---------- */
.mg-person__photo {
  border-radius: var(--mg-radius);
  overflow: hidden;
  aspect-ratio: 3 / 4;
  background: var(--mg-sand);
}
.mg-person__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mg-person:hover .mg-person__photo img { transform: scale(1.05); }

/* ---------- 17. Specs / mono tables ---------- */
.mg-spec__row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 0;
  border-bottom: 1px dashed var(--mg-line-strong);
  font-family: var(--mg-font-mono);
  font-size: .8rem;
}
.mg-spec__key { color: var(--mg-muted); text-transform: uppercase; letter-spacing: .1em; }
.mg-spec__val { color: var(--mg-ink); font-weight: 600; text-align: right; }

/* ---------- 18. Forms & notifications ---------- */
.mg-field { margin-bottom: 1.1rem; }
.mg-field__label {
  font-family: var(--mg-font-mono);
  font-size: .68rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mg-muted);
  margin-bottom: .4rem;
  display: block;
}
.mg-input {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid var(--mg-line-strong);
  background: transparent;
  padding: .7rem .2rem;
  font-size: 1rem;
  color: var(--mg-ink);
  outline: none;
  transition: border-color .25s ease;
  border-radius: 0;
}
.mg-input:focus { outline: none; border-bottom-color: var(--mg-gold); box-shadow: none; background: transparent; }
.mg-input.is-invalid { border-bottom-color: #b3423a; }

/* Inline notification (never window.alert) */
.mg-note {
  display: none;
  align-items: center;
  gap: .6rem;
  margin-top: 1rem;
  padding: .8rem 1.1rem;
  border-radius: 12px;
  font-size: .92rem;
  border: 1px solid transparent;
}
.mg-note.is-visible { display: flex; }
.mg-note--ok { background: rgba(61, 154, 80, .1); border-color: rgba(61, 154, 80, .4); color: #2c6e3a; }
.mg-note--err { background: rgba(179, 68, 58, .08); border-color: rgba(179, 68, 58, .4); color: #93362f; }

/* ---------- 19. Cookie banner (index only) ---------- */
.mg-cookie {
  position: fixed;
  left: 1rem; right: 1rem; bottom: 1rem;
  z-index: 1080;
  max-width: 640px;
  margin: 0 auto;
  background: var(--mg-graphite);
  color: var(--mg-cream-text);
  border: 1px solid rgba(244, 239, 230, .18);
  border-radius: var(--mg-radius);
  padding: 1.2rem 1.4rem;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .55);
}

/* ---------- 20. Marquee ---------- */
.mg-marquee { overflow: hidden; border-block: 1px solid var(--mg-line); background: var(--mg-paper); }
.mg-marquee__track {
  display: flex;
  gap: 3.5rem;
  width: max-content;
  padding: 1rem 0;
  animation: mgScroll 28s linear infinite;
}
.mg-marquee--dark { background: var(--mg-graphite); border-color: rgba(244, 239, 230, .12); }
@keyframes mgScroll { to { transform: translateX(-50%); } }
.mg-marquee__item {
  font-family: var(--mg-font-display);
  font-size: 1.15rem;
  white-space: nowrap;
  color: var(--mg-muted);
  display: inline-flex;
  align-items: center;
  gap: 3rem;
}

/* ---------- 21. FAQ (Bootstrap accordion, restyled) ---------- */
.mg-faq .accordion-item {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--mg-line);
}
.mg-faq .accordion-button {
  background: transparent;
  color: var(--mg-ink);
  font-family: var(--mg-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  padding: 1.4rem .5rem;
  box-shadow: none;
}
.mg-faq .accordion-button:not(.collapsed) { background: transparent; color: var(--mg-gold); }
.mg-faq .accordion-button:focus { box-shadow: none; }
.mg-faq .accordion-button::after { display: none; }
.mg-faq__icon { color: var(--mg-gold); transition: transform .3s ease; }
.accordion-button:not(.collapsed) .mg-faq__icon { transform: rotate(45deg); }

/* ---------- 22. Index wall (services list) ---------- */
.mg-index__row {
  display: grid;
  grid-template-columns: 90px 1.2fr 2fr auto;
  gap: 1.5rem;
  align-items: center;
  padding: 1.6rem .8rem;
  border-bottom: 1px solid var(--mg-line);
  transition: background .25s ease, padding .25s ease;
}
.mg-index__row:hover { background: rgba(160, 124, 59, .06); }
.mg-index__num { font-family: var(--mg-font-mono); color: var(--mg-gold); font-size: .85rem; }
.mg-index__name { font-family: var(--mg-font-display); font-size: clamp(1.3rem, 2.6vw, 1.9rem); font-weight: 700; color: var(--mg-ink); }
.mg-index__row:hover { background: rgba(160, 124, 59, .05); }

/* ---------- 23. Versus (comparison) ---------- */
.mg-versus__item { display: flex; gap: .8rem; align-items: flex-start; padding: .65rem 0; }
.mg-versus__col--bad i { color: #b3423a; }
.mg-versus__col--good i { color: #3d9a50; }

/* ---------- 24. Footer ---------- */
.mg-footer {
  background: var(--mg-graphite);
  color: rgba(244, 239, 230, .82);
  padding: 4.5rem 0 2rem;
}
.mg-footer a { color: rgba(244, 239, 230, .8); text-decoration: none; }
.mg-footer a:hover { color: var(--mg-gold-soft); }
.mg-footer__title {
  font-family: var(--mg-font-mono);
  font-size: .68rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--mg-gold-soft);
  margin-bottom: 1.1rem;
}
.mg-footer__link {
  display: block;
  color: rgba(244, 239, 230, .78);
  text-decoration: none;
  padding: .28rem 0;
  font-size: .95rem;
}
.mg-footer__wordmark {
  font-family: var(--mg-font-display);
  font-weight: 800;
  font-size: clamp(3.2rem, 12.5vw, 12rem);
  line-height: .9;
  letter-spacing: -.02em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(244, 239, 230, .3);
  white-space: nowrap;
  text-align: center;
  user-select: none;
}
.mg-footer__disclaimer {
  border: 1px dashed rgba(201, 169, 106, .5);
  border-radius: var(--mg-radius);
  padding: 1.1rem 1.4rem;
  font-size: .85rem;
  color: rgba(244, 239, 230, .75);
  background: rgba(201, 169, 106, .06);
}

/* ---------- 25. Misc ---------- */
.mg-dropcap::first-letter {
  font-family: var(--mg-font-display);
  font-size: 3.6em;
  float: left;
  line-height: .8;
  padding-right: .6rem;
  padding-top: .1rem;
  color: var(--mg-gold);
  font-weight: 700;
}
.mg-lead { font-size: 1.15rem; color: #4d463b; }
.mg-section--dark .mg-dropcap::first-letter,
.mg-on-dark .mg-dropcap::first-letter { color: var(--mg-gold-soft); }

.mg-tape {
  display: inline-block;
  padding: .35rem 1rem;
  background: var(--mg-gold);
  color: #fff;
  font-family: var(--mg-font-mono);
  font-size: .68rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  transform: rotate(-2deg);
  border-radius: 4px;
}

/* Map frame */
.mg-map { border-radius: var(--mg-radius); overflow: hidden; border: 1px solid var(--mg-line); filter: grayscale(35%) contrast(1.02); }
.mg-map iframe { width: 100%; height: 420px; border: 0; display: block; }

/* Cookie banner inner */
.mg-cookie__actions { display: flex; gap: .6rem; flex-wrap: wrap; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .mg-hero__orbit, .mg-dot { animation: none; }
  .mg-marquee__item { animation: none; }
}

/* ---------- 26. Responsive ---------- */
@media (max-width: 991.98px) {
  .mg-split { display: block; }
  .mg-split__badge { left: 50%; top: auto; bottom: -46px; }
  .mg-slits { flex-direction: column; }
  .mg-slit { min-height: 220px; }
  .mg-console__cell { border-right: 0; border-bottom: 1px solid var(--mg-line); }
  .mg-timeline__spine { left: 12px; }
}
@media (max-width: 575.98px) {
  .mg-hero__title { font-size: clamp(2.6rem, 13vw, 4rem); }
  .mg-bento { grid-template-columns: 1fr !important; }
  .mg-rail > * { flex-basis: 86vw; }
  .mg-footer__wordmark { font-size: 3rem; -webkit-text-stroke-width: 1px; }
html{overflow-x: hidden;}

}