/* ==========================================================================
   Magendoo / AI — Swiss design system
   Loaded after bootstrap-theme.css on every page. Two jobs:
   1. Re-token the whole site (colors, font, radius) so legacy pages inherit
      the new look without markup changes.
   2. Provide the sw-* component classes used by the rebuilt pages.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */
:root {
    --sw-paper: #fafaf7;
    --sw-ink: #141412;
    --sw-accent: #e0442a;
    --sw-hairline: #dcdcd4;
    --sw-muted: #54544e;
    --sw-faint: #7d7d76;
    --sw-placeholder: #9a9a90;
    --sw-footer-bg: #f2f2ec;
    --sw-body: #33332e;
    --sw-font: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --sw-gutter: clamp(20px, 4vw, 56px);

    /* Remap Bootstrap theme tokens */
    --bs-primary: #141412;
    --bs-primary-dark: #000000;
    --bs-secondary: #e0442a;
    --bs-accent: #e0442a;
    --bs-accent-dark: #b8371f;
    --bs-info: #54544e;
    --bs-light: #f2f2ec;
    --bs-dark: #141412;
    --bs-font-sans-serif: var(--sw-font);
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-border-radius-pill: 0;
    --bs-border-radius-xl: 0;
    --bs-border-radius-xxl: 0;
    --bs-link-color: #141412;
    --bs-link-hover-color: #e0442a;
    --bs-body-bg: #fafaf7;
    --bs-body-color: #141412;
}

/* --------------------------------------------------------------------------
   2. Global re-theme (affects legacy pages too)
   -------------------------------------------------------------------------- */
body {
    font-family: var(--sw-font);
    background-color: var(--sw-paper);
    color: var(--sw-ink);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--sw-font);
    color: var(--sw-ink);
    font-weight: 700;
    letter-spacing: -.02em;
}

a { color: var(--sw-ink); }
a:hover { color: var(--sw-accent); }

.text-primary { color: var(--sw-ink) !important; }
.text-secondary, .text-accent { color: var(--sw-accent) !important; }
.bg-primary { background-color: var(--sw-ink) !important; }
.bg-light { background-color: var(--sw-footer-bg) !important; }
.bg-white { background-color: var(--sw-paper) !important; }

/* Squared, inky buttons everywhere */
.btn { border-radius: 0; font-family: var(--sw-font); font-weight: 600; }
.btn-primary,
.btn-accent,
.btn-cta {
    background-color: var(--sw-ink);
    border-color: var(--sw-ink);
    color: var(--sw-paper);
}
.btn-primary:hover, .btn-primary:focus,
.btn-accent:hover, .btn-accent:focus,
.btn-cta:hover, .btn-cta:focus {
    background-color: #000;
    border-color: #000;
    color: var(--sw-paper);
    opacity: .85;
}
.btn-secondary {
    background-color: var(--sw-accent);
    border-color: var(--sw-accent);
    color: var(--sw-paper);
}
.btn-secondary:hover, .btn-secondary:focus {
    background-color: var(--bs-accent-dark);
    border-color: var(--bs-accent-dark);
}
.btn-outline-primary,
.btn-outline-light {
    border-color: var(--sw-ink);
    color: var(--sw-ink);
    background: transparent;
}
.btn-outline-primary:hover,
.btn-outline-light:hover {
    background-color: var(--sw-ink);
    border-color: var(--sw-ink);
    color: var(--sw-paper);
}

/* Kill rounded corners on common components */
.card, .badge, .alert, .form-control, .form-select, .dropdown-menu,
.accordion, .accordion-item, .accordion-button, .modal-content,
.list-group, .list-group-item, img.rounded, .rounded, .rounded-3, .rounded-4 {
    border-radius: 0 !important;
}
.card { border-color: var(--sw-hairline); background-color: var(--sw-paper); }
.badge { font-weight: 600; letter-spacing: .04em; }

/* Legacy hero sections → paper background, ink text */
.hero, .hero--service, .hero-section, [class*="hero"] {
    background-image: none;
}
.hero, .hero--service, .hero-section {
    background-color: var(--sw-paper);
    color: var(--sw-ink);
    border-bottom: 1px solid var(--sw-ink);
}
.hero h1, .hero--service h1, .hero-section h1,
.hero p, .hero--service p, .hero-section p,
.hero .lead, .hero--service .lead, .hero-section .lead {
    color: var(--sw-ink);
}
.hero .text-white-50, .hero--service .text-white-50, .hero-section .text-white-50 {
    color: var(--sw-muted) !important;
}

/* --------------------------------------------------------------------------
   3. Swiss chrome — navigation
   -------------------------------------------------------------------------- */
.sw-nav {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--sw-paper);
    border-bottom: 1px solid var(--sw-ink);
    padding: 14px var(--sw-gutter);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: clamp(16px, 2vw, 30px);
    row-gap: 10px;
}
.sw-nav__brand {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-right: auto;
    text-decoration: none;
}
.sw-nav__brand:hover { opacity: .7; color: var(--sw-ink); }
.sw-nav__brand-name {
    font: 800 18px var(--sw-font);
    letter-spacing: .02em;
    color: var(--sw-ink);
}
.sw-nav__brand-suffix {
    font: 600 12px var(--sw-font);
    color: var(--sw-accent);
}
.sw-nav__link {
    font: 500 13.5px var(--sw-font);
    color: var(--sw-ink);
    text-decoration: none;
}
.sw-nav__link:hover { opacity: .7; color: var(--sw-ink); }
.sw-nav__link.active { font-weight: 600; color: var(--sw-accent); }
.sw-nav__cta {
    font: 600 13px var(--sw-font);
    background: var(--sw-ink);
    color: var(--sw-paper);
    padding: 12px 18px;
    text-decoration: none;
}
.sw-nav__cta:hover { color: var(--sw-paper); opacity: .8; }
.sw-nav__toggle {
    display: none;
    background: transparent;
    border: 1px solid var(--sw-ink);
    color: var(--sw-ink);
    font: 600 12px var(--sw-font);
    letter-spacing: .12em;
    padding: 10px 14px;
    cursor: pointer;
}

@media (max-width: 991.98px) {
    .sw-nav__toggle { display: inline-block; }
    .sw-nav__links {
        display: none;
        flex-basis: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        border-top: 1px solid var(--sw-hairline);
        margin-top: 12px;
    }
    .sw-nav__links.open { display: flex; }
    .sw-nav__links .sw-nav__link {
        display: block;
        width: 100%;
        padding: 13px 0;
        border-bottom: 1px solid var(--sw-hairline);
        font-size: 15px;
    }
    .sw-nav__links .sw-nav__cta {
        margin-top: 14px;
        display: inline-block;
    }
}
@media (min-width: 992px) {
    .sw-nav__links {
        display: flex;
        align-items: center;
        column-gap: clamp(16px, 2vw, 30px);
        row-gap: 10px;
    }
}

/* --------------------------------------------------------------------------
   4. Swiss chrome — footer
   -------------------------------------------------------------------------- */
.sw-footer {
    background: var(--sw-footer-bg);
    color: var(--sw-ink);
    padding: clamp(40px, 4vw, 56px) var(--sw-gutter) 40px;
}
.sw-footer__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 32px 24px;
    margin-bottom: 48px;
}
.sw-footer__heading {
    font: 700 11px var(--sw-font);
    letter-spacing: .18em;
    color: var(--sw-faint);
    margin-bottom: 14px;
    text-transform: uppercase;
}
.sw-footer__links { display: grid; gap: 9px; }
.sw-footer__links a {
    font: 400 13.5px var(--sw-font);
    color: var(--sw-ink);
    text-decoration: none;
}
.sw-footer__links a:hover { opacity: .7; color: var(--sw-ink); }
.sw-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    border-top: 1px solid var(--sw-ink);
    padding-top: 24px;
}
.sw-footer__legal, .sw-footer__legal a {
    font: 400 12px var(--sw-font);
    color: var(--sw-placeholder);
    text-decoration: none;
}
.sw-footer__legal a:hover { color: var(--sw-ink); }

/* --------------------------------------------------------------------------
   5. Swiss page components
   -------------------------------------------------------------------------- */
.sw-page { background: var(--sw-paper); color: var(--sw-ink); }

.sw-section {
    padding: clamp(48px, 5.5vw, 80px) var(--sw-gutter);
    border-bottom: 1px solid var(--sw-hairline);
}
.sw-section--rule { border-bottom: 1px solid var(--sw-ink); }
.sw-section--rule-heavy { border-bottom: 4px solid var(--sw-ink); }
.sw-section--hero {
    padding: clamp(56px, 7vw, 96px) var(--sw-gutter) clamp(48px, 5vw, 72px);
    border-bottom: 1px solid var(--sw-ink);
}
.sw-section--cta {
    padding: clamp(56px, 6.5vw, 96px) var(--sw-gutter);
    border-bottom: 1px solid var(--sw-ink);
}
.sw-section--flush { padding: 0; }

.sw-kicker {
    font: 600 12px var(--sw-font);
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--sw-faint);
    margin: 0 0 20px;
}
.sw-kicker--accent { color: var(--sw-accent); }

.sw-display {
    font: 700 clamp(46px, 6.7vw, 96px)/.98 var(--sw-font);
    letter-spacing: -.035em;
    margin: 0 0 clamp(22px, 2.5vw, 32px);
    max-width: 1100px;
}
.sw-display--sub {
    font-size: clamp(38px, 5.3vw, 76px);
    line-height: 1;
}
.sw-h2 {
    font: 700 clamp(30px, 2.9vw, 40px)/1.08 var(--sw-font);
    letter-spacing: -.025em;
    margin: 0 0 clamp(28px, 3vw, 44px);
}
.sw-h2--tight { margin-bottom: 0; max-width: 460px; }
.sw-h2--wide { max-width: 700px; }
.sw-h2--xl {
    font-size: clamp(34px, 3.7vw, 52px);
    line-height: 1.05;
    letter-spacing: -.03em;
    max-width: 900px;
    margin-bottom: 20px;
}
.sw-h3 {
    font: 700 clamp(22px, 1.9vw, 26px) var(--sw-font);
    letter-spacing: -.015em;
    margin: 0 0 12px;
}

.sw-lead {
    font: 700 clamp(17px, 1.6vw, 21px)/1.4 var(--sw-font);
    margin: 0 0 14px;
}
.sw-body {
    font: 400 clamp(15.5px, 1.25vw, 17px)/1.65 var(--sw-font);
    color: var(--sw-body);
    margin: 0;
    text-wrap: pretty;
}
.sw-body--muted { color: var(--sw-muted); }
.sw-body--strong { font-weight: 700; color: var(--sw-ink); }
.sw-fineprint {
    font: 400 12.5px/1.7 var(--sw-font);
    color: var(--sw-faint);
    letter-spacing: .01em;
}

/* Split layouts */
.sw-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
    gap: clamp(28px, 5vw, 72px);
}
.sw-split--end { align-items: end; }
.sw-split--start { align-items: start; }
.sw-split--wide {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    gap: clamp(28px, 4vw, 64px);
}

/* Section header row (h2 + kicker on the right) */
.sw-heading-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 clamp(28px, 3vw, 44px);
}
.sw-heading-row .sw-h2, .sw-heading-row h2 { margin-bottom: 0; }

/* Hairline-bordered card grid */
.sw-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    border-right: 1px solid var(--sw-ink);
    border-bottom: 1px solid var(--sw-ink);
}
.sw-cards--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.sw-card {
    background: var(--sw-paper);
    border-left: 1px solid var(--sw-ink);
    border-top: 1px solid var(--sw-ink);
    padding: clamp(26px, 2.5vw, 36px) clamp(22px, 2.3vw, 32px);
    display: flex;
    flex-direction: column;
}
.sw-card__title { font: 700 20px var(--sw-font); margin: 0 0 2px; }
.sw-card__subtitle { font: 400 13.5px var(--sw-font); color: var(--sw-faint); margin: 0 0 24px; }
.sw-card__body {
    font: 400 15.5px/1.6 var(--sw-font);
    color: var(--sw-muted);
    margin: 0 0 auto;
    text-wrap: pretty;
}
.sw-card__footer { margin-top: 26px; }

/* Two-panel split with 1px gap (build with agents / build agents) */
.sw-panels {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    gap: 1px;
    background: var(--sw-hairline);
    border-bottom: 1px solid var(--sw-ink);
}
.sw-panels--boxed { border: 1px solid var(--sw-ink); background: var(--sw-ink); border-bottom: 1px solid var(--sw-ink); }
.sw-panel {
    background: var(--sw-paper);
    padding: clamp(40px, 4.5vw, 64px) var(--sw-gutter);
}
.sw-panel--card { padding: clamp(30px, 3vw, 44px) clamp(22px, 2.8vw, 40px); display: flex; flex-direction: column; }
.sw-panel h2 { font: 700 clamp(27px, 2.4vw, 34px) var(--sw-font); letter-spacing: -.02em; margin: 0 0 18px; }

/* Ruled item list */
.sw-rows { display: grid; margin: 0 0 28px; }
.sw-rows > * {
    font: 500 15px/1.5 var(--sw-font);
    padding: 11px 0;
    border-top: 1px solid var(--sw-hairline);
    margin: 0;
}
.sw-rows > *:last-child { border-bottom: 1px solid var(--sw-hairline); }
.sw-rows--plain > * { font-weight: 400; color: var(--sw-body); padding: 14px 0; }

/* Definition table (label / value rows) */
.sw-spec { }
.sw-spec__row {
    display: grid;
    grid-template-columns: minmax(150px, 290px) 1fr;
    column-gap: 20px;
    border-top: 1px solid var(--sw-hairline);
}
.sw-spec__row:first-child { border-top: 1px solid var(--sw-ink); }
.sw-spec__row:last-child { border-bottom: 1px solid var(--sw-ink); }
.sw-spec__label { font: 700 15px/1.45 var(--sw-font); padding: 18px 0; }
.sw-spec__label small {
    display: block;
    font: 600 13px var(--sw-font);
    color: var(--sw-accent);
    margin-top: 4px;
}
.sw-spec__value { font: 400 15px/1.6 var(--sw-font); color: var(--sw-muted); padding: 18px 0; }

/* Stack label above value on small screens (value column otherwise crushes to 1-2 words/line) */
@media (max-width: 575.98px) {
    .sw-spec__row { grid-template-columns: 1fr; column-gap: 0; }
    .sw-spec__label { padding-bottom: 2px; }
    .sw-spec__value { padding-top: 0; }
}

/* Numbered process steps */
.sw-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
    gap: 24px 0;
}
.sw-steps--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.sw-step { border-left: 1px solid var(--sw-hairline); padding: 4px 24px 0 20px; }
.sw-step:first-child { border-left-color: var(--sw-ink); }
.sw-step__num { font: 700 13px var(--sw-font); color: var(--sw-accent); margin: 0 0 12px; }
.sw-step__title { font: 700 19px var(--sw-font); margin: 0 0 10px; }
.sw-step__text { font: 400 14px/1.55 var(--sw-font); color: var(--sw-muted); }
.sw-step__text a { font-weight: 600; color: var(--sw-accent); text-decoration: none; }

/* Big stat */
.sw-stat { display: block; text-decoration: none; }
.sw-stat__value {
    display: block;
    font: 700 clamp(48px, 5vw, 76px)/1 var(--sw-font);
    letter-spacing: -.03em;
    color: var(--sw-ink);
}
.sw-stat__label {
    display: block;
    font: 500 13px var(--sw-font);
    color: var(--sw-muted);
    margin-top: 8px;
    border-top: 1px solid var(--sw-ink);
    padding-top: 8px;
}
.sw-stat-row { display: flex; flex-wrap: wrap; gap: 24px 44px; margin: 0 0 24px; }

/* Arrow links */
.sw-arrow {
    font: 600 15px var(--sw-font);
    color: var(--sw-accent);
    text-decoration: none;
}
.sw-arrow:hover { color: var(--sw-accent); opacity: .7; }
.sw-arrow--sm { font-size: 14px; }
.sw-arrow-row { font: 600 14px var(--sw-font); color: var(--sw-accent); }
.sw-arrow-row a { color: var(--sw-accent); text-decoration: none; }
.sw-arrow-row a:hover { opacity: .7; color: var(--sw-accent); }

/* Underline text link */
.sw-underline {
    color: var(--sw-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--sw-ink);
    padding-bottom: 2px;
    font-weight: 600;
}
.sw-underline:hover { color: var(--sw-ink); opacity: .7; }

/* Primary CTA buttons */
.sw-btn {
    display: inline-block;
    background: var(--sw-ink);
    color: var(--sw-paper);
    font: 600 15px var(--sw-font);
    padding: 17px 26px;
    text-align: center;
    text-decoration: none;
    border: 0;
    border-radius: 0;
    cursor: pointer;
}
.sw-btn:hover, .sw-btn:focus { color: var(--sw-paper); opacity: .8; }
.sw-btn--lg { font-size: 16px; padding: 18px 30px; }
.sw-btn-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px 26px;
    margin: 0 0 24px;
}
.sw-btn-row--tight { margin: 0; gap: 20px 32px; }

/* Chips (selectable) */
.sw-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.sw-chip {
    font: 500 14px var(--sw-font);
    padding: 10px 16px;
    border: 1px solid var(--sw-ink);
    border-radius: 0;
    cursor: pointer;
    background: transparent;
    color: var(--sw-ink);
}
.sw-chip:hover { border-color: var(--sw-accent); }
.sw-chip.selected, .sw-chip[aria-pressed="true"] {
    background: var(--sw-ink);
    color: var(--sw-paper);
}

/* Swiss forms — underline inputs */
.sw-form {
    display: grid;
    gap: 28px;
    border-top: 1px solid var(--sw-ink);
    padding-top: 28px;
}
.sw-form__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: 28px;
}
.sw-form label,
.sw-form .sw-label {
    display: block;
    font: 600 11px var(--sw-font);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--sw-faint);
    margin: 0 0 8px;
}
.sw-form label .optional { color: #b9b9b0; }
.sw-form input[type="text"],
.sw-form input[type="email"],
.sw-form input[type="tel"],
.sw-form input[type="url"],
.sw-form textarea {
    width: 100%;
    box-sizing: border-box;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--sw-ink);
    border-radius: 0;
    font: 400 16px/1.55 var(--sw-font);
    color: var(--sw-ink);
    padding: 10px 0;
    outline: none;
    box-shadow: none;
}
.sw-form textarea { min-height: 110px; resize: vertical; }
.sw-form input:focus, .sw-form textarea:focus {
    border-bottom-color: var(--sw-accent);
    box-shadow: none;
    background: transparent;
}
.sw-form ::placeholder { color: var(--sw-placeholder); }
.sw-form__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 26px;
}
.sw-form__note { font: 400 13px/1.5 var(--sw-font); color: var(--sw-faint); }
.sw-form__error { font: 600 13.5px var(--sw-font); color: var(--sw-accent); }
.sw-form-success {
    border: 1px solid var(--sw-ink);
    padding: clamp(28px, 3vw, 40px);
}
.sw-form-success__title {
    font: 700 clamp(24px, 2.2vw, 30px) var(--sw-font);
    letter-spacing: -.02em;
    margin: 0 0 12px;
}

/* FAQ accordion */
.sw-faq { border-bottom: 1px solid var(--sw-ink); max-width: 900px; }
.sw-faq__item { border-top: 1px solid var(--sw-ink); }
.sw-faq__q {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 20px;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 18px 0;
    cursor: pointer;
    font: 700 16px/1.4 var(--sw-font);
    color: var(--sw-ink);
}
.sw-faq__mark { font: 400 22px/1 var(--sw-font); color: var(--sw-accent); flex-shrink: 0; }
.sw-faq__a {
    display: none;
    font: 400 15px/1.65 var(--sw-font);
    color: var(--sw-muted);
    padding: 0 40px 20px 0;
    max-width: 760px;
}
.sw-faq__item.open .sw-faq__a { display: block; }

/* Utility */
.sw-max-660 { max-width: 660px; }
.sw-max-620 { max-width: 620px; }
.sw-max-480 { max-width: 480px; }
.sw-max-460 { max-width: 460px; }
.sw-max-440 { max-width: 440px; }
.sw-max-420 { max-width: 420px; }
.sw-mb-0 { margin-bottom: 0 !important; }
.sw-stack-20 { display: grid; gap: 20px; }
.sw-accent { color: var(--sw-accent); }
.sw-muted { color: var(--sw-muted); }
.sw-strong { font-weight: 700; color: var(--sw-ink); }

/* --------------------------------------------------------------------------
   6. Legacy compatibility polish
   -------------------------------------------------------------------------- */
/* Old navbar (if any page still renders it) recolored */
.navbar.bg-white { background-color: var(--sw-paper) !important; border-bottom: 1px solid var(--sw-ink); }
.navbar .nav-link { font: 500 13.5px var(--sw-font); color: var(--sw-ink); }
.navbar .nav-link.active { color: var(--sw-accent); }

/* Legacy footer recolor if rendered */
footer.footer { background-color: var(--sw-footer-bg); color: var(--sw-ink); }
footer.footer a { color: var(--sw-ink); }
footer.footer h5, footer.footer h6, footer.footer .text-white { color: var(--sw-ink) !important; }

/* Legacy section band recolors */
.trust-bar { background-color: var(--sw-footer-bg); border-top: 1px solid var(--sw-ink); }
.section-cta, .cta-section, .bg-gradient-primary {
    background-image: none !important;
    background-color: var(--sw-ink) !important;
}
.section-cta h2, .cta-section h2 { color: var(--sw-paper); }

/* Form controls on legacy pages */
.form-control, .form-select {
    background-color: transparent;
    border-color: var(--sw-ink);
}
.form-control:focus, .form-select:focus {
    border-color: var(--sw-accent);
    box-shadow: none;
    background-color: transparent;
}

/* Outline-light buttons only appear on dark bands (legacy dark heroes and
   bg-primary/gradient CTA sections) — keep them light there. Overrides the
   global ink recolor in section 2, which made them near-invisible on dark. */
.btn-outline-light {
    border-color: var(--sw-paper);
    color: var(--sw-paper);
    background: transparent;
}
.btn-outline-light:hover, .btn-outline-light:focus {
    background-color: var(--sw-paper);
    border-color: var(--sw-paper);
    color: var(--sw-ink);
}

/* MageIQ: .row.g-5 gutter (3rem) exceeds container padding at phone width,
   bleeding 12px past the viewport (horizontal scroll at 390px). */
@media (max-width: 575.98px) {
    .page-store-iq .row.g-5 { --bs-gutter-x: 1.5rem; }
}

/* MageMCP hero eyebrow badge: bg-primary + text-primary both re-token to ink,
   rendering ink-on-ink on the dark hero. Restore a light pill there. */
.hero--service .badge.text-primary {
    color: var(--sw-paper) !important;
    background-color: rgba(250, 250, 247, 0.12) !important;
}

/* guide-cta bands keep a dark background (ink on /guides, navy gradient on
   /odoo-guides) but headings inherited the global ink color on /odoo-guides. */
.guide-cta h2 { color: var(--sw-paper); }