/**
 * Moderna — WISECP adaptations
 * @author Venus <https://venus.tr>
 *
 * Re-skin of the shared WISECP components used on every inner page (forms, cards, tables,
 * client area, sign-in, checkout). Loaded before css/moderna.css (the design system).
 */
/* 1. Global glue on top of the WStyle system
   -------------------------------------------------------------------------- */
:root {
  --mn-accent-subtle: color-mix(in srgb, var(--mn-accent) 12%, var(--mn-surface-bg));
  --mn-primary-subtle: color-mix(in srgb, var(--mn-primary) 12%, var(--mn-surface-bg));
  --mn-on-primary: #fff;
  --bs-body-font-family: var(--mn-font-family);
  --bs-font-monospace: var(--mn-font-mono);
}
[data-bs-theme="dark"] {
  --mn-primary-subtle: color-mix(in srgb, var(--mn-primary) 16%, var(--mn-surface-bg));
  --mn-primary-text: color-mix(in srgb, var(--mn-primary) 72%, white);
}
.mn-r-sharp { --mn-radius: 4px; --mn-radius-sm: 3px; --mn-radius-card: 6px; --mn-radius-lg: 8px; --mn-radius-xl: 10px; }
.mn-r-round { --mn-radius: 14px; --mn-radius-sm: 10px; --mn-radius-card: 20px; --mn-radius-lg: 28px; --mn-radius-xl: 36px; }
.mn-w-wide { --mn-container: 1440px; }
.mn-w-narrow { --mn-container: 1200px; }
@media (min-width: 1400px) { .container, .container-xxl { max-width: var(--mn-container); } }
html { scroll-padding-top: calc(var(--mn-header-h) + 16px); }
body { font-family: var(--mn-font-family); background: var(--mn-body-bg); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { letter-spacing: -0.02em; }
::selection { background: var(--mn-primary); color: #fff; }
.mn-topbar a, .mn-navbar a, .mn-drawer a, .mn-footer a, .mn-mega a, .mn-drop a, .mn-cta a, .mn-fab,
[class*="mn-"] a, a[class*="mn-"] { text-decoration: none; }
.mn-custom__body a, .mn-footer__brand p a { text-decoration: underline; text-underline-offset: 3px; }
.mn-mono, .num-tabular { font-feature-settings: "tnum"; }
.mn-mono { font-family: var(--mn-font-mono); letter-spacing: -0.02em; }
.mn-skip { position: absolute; z-index: 2000; inset-inline-start: 16px; top: 8px; background: var(--mn-ink); color: #fff; padding: 8px 14px; border-radius: 8px; }
.mn-no-anim *, .mn-no-anim *::before, .mn-no-anim *::after { animation: none !important; transition: none !important; }

/* Logo swap by colour mode (platform provides light + dark logo) */
.mn-brand .site-logo { display: block; max-height: 42px; width: auto; }
.mn-brand .site-logo-dark { display: none; }
[data-bs-theme="dark"] .mn-brand .site-logo-light { display: none; }
[data-bs-theme="dark"] .mn-brand .site-logo-dark { display: block; }
.mn-brand--light .site-logo { max-height: 40px; }

/* 3. Shared components
   -------------------------------------------------------------------------- */
.mn-btn {
    --_bg: transparent; --_fg: var(--mn-heading-color); --_bd: transparent;
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    height: 44px; padding: 0 1.15rem;
    font-weight: 600; font-size: .95rem; line-height: 1;
    border-radius: var(--mn-radius-sm);
    background: var(--_bg); color: var(--_fg); border: 1px solid var(--_bd);
    transition: background-color .2s, color .2s, border-color .2s, transform .2s var(--mn-ease), box-shadow .2s;
    white-space: nowrap;
}
.mn-btn:hover { color: var(--_fg); }
.mn-btn:active { transform: translateY(1px); }
.mn-btn .bi { font-size: 1.05em; transition: transform .2s var(--mn-ease); }
.mn-btn:hover .bi-arrow-right { transform: translateX(3px); }
[dir="rtl"] .mn-btn .bi-arrow-right { transform: scaleX(-1); }
.mn-btn--primary { --_bg: var(--mn-primary); --_fg: var(--mn-on-primary); }
.mn-btn--primary:hover { --_bg: var(--mn-primary-hover); background: var(--_bg); box-shadow: 0 8px 20px -8px var(--mn-primary); }
.mn-btn--ink { --_bg: var(--mn-ink); --_fg: #fff; }
.mn-btn--ink:hover { --_bg: #000; background: var(--_bg); }
[data-bs-theme="dark"] .mn-btn--ink { --_bg: var(--mn-on-ink); --_fg: #111; }
.mn-btn--ghost { --_fg: var(--mn-heading-color); --_bd: var(--mn-border-strong); }
.mn-btn--ghost:hover { --_bd: var(--mn-heading-color); border-color: var(--_bd); }
.mn-btn--outline { --_fg: var(--mn-heading-color); --_bd: var(--mn-border-strong); background: var(--mn-surface-bg); }
.mn-btn--outline:hover { --_bd: var(--mn-primary); --_fg: var(--mn-primary-text); border-color: var(--_bd); color: var(--_fg); }
.mn-btn--light { --_bg: rgba(255,255,255,.08); --_fg: #fff; --_bd: rgba(255,255,255,.22); }
.mn-btn--light:hover { --_bg: rgba(255,255,255,.16); background: var(--_bg); }
.mn-btn--text { --_fg: var(--mn-heading-color); padding-inline: .6rem; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--mn-border-strong); }
.mn-btn--text:hover { text-decoration-color: var(--mn-primary); }
.mn-btn--lg { height: 52px; padding: 0 1.5rem; font-size: 1rem; }
.mn-btn--sm { height: 36px; padding: 0 .85rem; font-size: .85rem; }

.mn-icon-btn {
    position: relative; display: inline-grid; place-items: center;
    width: 42px; height: 42px; border-radius: var(--mn-radius-sm);
    border: 1px solid var(--mn-border-color); background: var(--mn-surface-bg); color: var(--mn-heading-color);
    font-size: 1.15rem; transition: border-color .2s, background-color .2s;
}
.mn-icon-btn:hover { border-color: var(--mn-border-strong); background: var(--mn-surface-2); color: var(--mn-heading-color); }
.mn-count {
    position: absolute; top: -6px; inset-inline-end: -6px; min-width: 20px; height: 20px; padding: 0 5px;
    border-radius: 99px; background: var(--mn-primary); color: #fff; font-size: .7rem; font-weight: 700;
    display: grid; place-items: center; border: 2px solid var(--mn-surface-bg);
}
.mn-tag--flame { background: var(--mn-primary); color: #fff; }

.mn-flag {
    display: inline-grid; place-items: center; min-width: 26px; height: 18px; padding: 0 4px;
    font: 700 .62rem/1 var(--mn-font-mono); letter-spacing: .04em;
    border: 1px solid var(--mn-border-strong); border-radius: 4px; color: var(--mn-muted-color);
}

.mn-kicker {
    display: inline-flex; align-items: center; gap: .55rem; margin-bottom: .9rem;
    font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--mn-primary-text);
}
.mn-kicker::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.mn-kicker--light { color: var(--mn-primary); }
.mn-title { font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.6rem); line-height: 1.12; letter-spacing: -.03em; margin-bottom: 1rem; font-weight: 800; max-width: 22ch; }
.mn-lead { font-size: 1.075rem; color: var(--mn-muted-color); max-width: 52ch; }

.mn-link-arrow { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: var(--mn-heading-color); border-bottom: 1.5px solid var(--mn-primary); padding-bottom: 2px; }
.mn-link-arrow:hover { color: var(--mn-primary-text); }
.mn-link-arrow .bi { transition: transform .2s var(--mn-ease); }
.mn-link-arrow:hover .bi { transform: translateX(3px); }

.mn-status { display: inline-flex; align-items: center; gap: .5rem; }
.mn-status__dot { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--mn-success); flex: none; display: inline-block; }
.mn-status__dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--mn-success); opacity: 0; animation: mn-pulse 2.2s infinite; }
@keyframes mn-pulse { 0% { transform: scale(.5); opacity: .8; } 100% { transform: scale(1.4); opacity: 0; } }

.mn-section { padding-block: clamp(4rem, 3rem + 4vw, 7rem); }
.mn-section--tint { background: var(--mn-surface-2); }
.mn-sechead { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.mn-sechead .mn-title { margin-bottom: 0; }

.mn-seg {
    display: inline-flex; padding: 4px; gap: 2px; border-radius: 10px;
    background: var(--mn-surface-bg); border: 1px solid var(--mn-border-color);
}
.mn-seg button, .mn-bill button, .mn-viewswitch button {
    border: 0; background: transparent; color: var(--mn-muted-color); font-weight: 600; font-size: .9rem;
    height: 36px; padding: 0 1rem; border-radius: 7px; transition: background-color .2s, color .2s;
    display: inline-flex; align-items: center; gap: .35rem;
}
.mn-seg button:hover, .mn-bill button:hover, .mn-viewswitch button:hover { color: var(--mn-heading-color); }
.mn-seg button.is-active, .mn-bill button.is-active { background: var(--mn-ink); color: #fff; }
[data-bs-theme="dark"] .mn-seg button.is-active, [data-bs-theme="dark"] .mn-bill button.is-active { background: var(--mn-on-ink); color: #111; }
.mn-seg--sm button { height: 32px; padding: 0 .8rem; font-size: .85rem; }

.mn-rail-nav { display: flex; align-items: center; gap: .5rem; }
.mn-rail-nav .mn-link-arrow { margin-inline-start: .75rem; }

/* 24. Moderna Manager sections
   -------------------------------------------------------------------------- */
.mn-dc.is-single, .mn-why__grid.is-single, .mn-faqwrap.is-single { grid-template-columns: minmax(0, 1fr); }
.mn-steps { grid-template-columns: repeat(var(--mn-steps, 3), minmax(0, 1fr)); }
.mn-bannerwrap { padding-block: clamp(1.5rem, 1rem + 2vw, 3rem); }
.mn-banner { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; gap: 2rem; flex-wrap: wrap; padding: clamp(2rem, 1.2rem + 3vw, 3.5rem); border-radius: var(--mn-radius-xl); }
.mn-banner__text, .mn-banner__actions { position: relative; z-index: 1; }
.mn-banner__text { max-width: 640px; }
.mn-banner h2 { font-size: clamp(1.6rem, 1.1rem + 2vw, 2.6rem); line-height: 1.08; font-weight: 800; letter-spacing: -.04em; margin-bottom: .6rem; color: inherit; }
.mn-banner p { margin: 0; opacity: .85; }
.mn-banner .mn-kicker { margin-bottom: .6rem; }
.mn-banner__actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.mn-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mn-banner--ink { background: var(--mn-ink); color: var(--mn-on-ink); }
.mn-banner--ink h2 span, .mn-banner--paper h2 span { color: var(--mn-primary); }
.mn-banner--ink .mn-kicker { color: var(--mn-primary); }
.mn-banner--flame { background: var(--mn-primary); color: #1a0c05; }
.mn-banner--flame h2 span { color: #fff; }
.mn-banner--flame .mn-kicker { color: #1a0c05; }
.mn-banner--flame .mn-btn--primary { --_bg: var(--mn-ink); --_fg: #fff; }
.mn-banner--flame .mn-btn--light { --_bg: transparent; --_bd: rgba(26,12,5,.4); --_fg: #1a0c05; }
.mn-banner--paper { background: var(--mn-surface-bg); border: 1px solid var(--mn-border-color); color: var(--mn-heading-color); }
.mn-banner--paper .mn-btn--light { --_bg: transparent; --_bd: var(--mn-border-strong); --_fg: var(--mn-heading-color); }
.mn-banner--accent { background: var(--mn-accent); color: #fff; }
.mn-banner--accent .mn-kicker { color: #fff; }
.mn-banner--accent .mn-btn--primary { --_bg: #fff; --_fg: var(--mn-accent); }
.mn-banner--photo { background: var(--mn-ink); color: #fff; min-height: 320px; }
.mn-banner--photo::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(10,10,12,.85), rgba(10,10,12,.35)); }
.mn-banner--photo .mn-kicker { color: var(--mn-primary); }
.mn-banner:not(.mn-banner--photo) .mn-banner__img { opacity: .15; }
@media (max-width: 767.98px) {
    .mn-steps { grid-template-columns: 1fr; }
    .mn-banner__actions { width: 100%; }
    .mn-banner__actions .mn-btn { flex: 1; }
}

/* Mega panel for a flat sub menu: rows in two columns + promo */
.mn-mega__grid:has(.mn-mega__rows) { grid-template-columns: 2fr 1fr; }
.mn-mega__grid.is-nopromo:has(.mn-mega__rows) { grid-template-columns: 1fr; }
.mn-mega__rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1.5rem; align-content: start; }
.mn-mega__rows .mn-mega__label, .mn-mega__rows .mn-mega__all { grid-column: 1 / -1; }
.mn-mega__rows .mn-mega__link { margin-inline: 0; }
.mn-mega__all { justify-self: start; margin-top: .75rem; font-size: .88rem; }

.mn-table__feats { font-size: .82rem; color: var(--mn-muted-color); }
.mn-table__feats span { display: inline-block; margin-inline-end: .9rem; white-space: nowrap; }
.mn-table__feats span::before { content: "✓"; color: var(--mn-primary-text); margin-inline-end: .3rem; font-weight: 700; }

/* About block without an image: a compact centred band */
.mn-about:not(:has(.mn-dc__photo)) { max-width: 820px; margin-inline: auto; text-align: center; }
.mn-about:not(:has(.mn-dc__photo)) .mn-kicker { justify-content: center; }
.mn-about:not(:has(.mn-dc__photo)) .mn-title, .mn-about:not(:has(.mn-dc__photo)) .mn-about__text { margin-inline: auto; max-width: none; }
.mn-section:has(> .container > .mn-about:not(:has(.mn-dc__photo))) { padding-block: clamp(3rem, 2rem + 3vw, 5rem); }

/* 25. Client area — horizontal navigation (client_nav = topbar)
   -------------------------------------------------------------------------- */
.mn-topnav { position: sticky; top: 0; z-index: 1020; background: var(--mn-surface-bg); border-bottom: 1px solid var(--mn-border-color); }
.mn-topnav__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 56px; }
.mn-topnav .client-subnav-nav { display: flex; align-items: center; gap: .15rem; list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.mn-topnav .client-subnav-nav::-webkit-scrollbar { display: none; }
.mn-topnav .client-subnav-link { display: inline-flex; align-items: center; gap: .45rem; height: 40px; padding: 0 .85rem; border: 0; border-radius: var(--mn-radius-sm); background: none; font-weight: 600; font-size: .9rem; color: var(--mn-muted-color); white-space: nowrap; text-decoration: none; position: relative; }
.mn-topnav .client-subnav-link:hover { background: var(--mn-surface-2); color: var(--mn-heading-color); }
.mn-topnav .client-subnav-link.active { color: var(--mn-heading-color); }
.mn-topnav .client-subnav-link.active::after { content: ""; position: absolute; inset-inline: .85rem; bottom: -8px; height: 2px; border-radius: 2px; background: var(--mn-primary); }
.mn-topnav .client-subnav-link .bi { color: var(--mn-primary-text); }
.mn-topnav .client-subnav-badge { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--mn-primary); color: #fff; font-size: .68rem; display: inline-grid; place-items: center; }

/* 26. Global re-skin of the shared WISECP components (every page)
   -------------------------------------------------------------------------- */
.btn { --bs-btn-font-weight: 600; --bs-btn-border-radius: var(--mn-radius); letter-spacing: -.005em; }
.btn-primary { --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; --bs-btn-disabled-color: #fff; }
.btn-soft { --bs-btn-color: var(--mn-heading-color); --bs-btn-bg: var(--mn-surface-2); --bs-btn-hover-bg: var(--mn-primary-subtle); --bs-btn-active-bg: var(--mn-primary-subtle); }
.btn-secondary { --bs-btn-bg: var(--mn-ink); --bs-btn-border-color: var(--mn-ink); --bs-btn-hover-bg: #000; --bs-btn-hover-border-color: #000; --bs-btn-color: #fff; --bs-btn-hover-color: #fff; }
[data-bs-theme="dark"] .btn-secondary { --bs-btn-bg: var(--mn-on-ink); --bs-btn-border-color: var(--mn-on-ink); --bs-btn-color: #111; --bs-btn-hover-bg: #fff; --bs-btn-hover-color: #111; }
.btn-light { --bs-btn-bg: #fff; --bs-btn-border-color: #fff; --bs-btn-color: #121417; }
.btn-lg { --bs-btn-padding-y: .8rem; --bs-btn-padding-x: 1.4rem; }
.card { box-shadow: none; --bs-card-border-radius: var(--mn-radius-card); --bs-card-inner-border-radius: calc(var(--mn-radius-card) - 1px); }
.card-header { background: transparent; border-bottom-color: var(--mn-border-color); font-weight: 700; }
.hover-lift { transition: transform .3s var(--mn-ease), border-color .2s, box-shadow .3s; }
.hover-lift:hover { transform: translateY(-3px); border-color: var(--mn-border-strong); box-shadow: var(--mn-shadow); }
.form-control, .form-select { border-color: var(--mn-border-color); background-color: var(--mn-surface-bg); }
.form-control:not(.form-control-sm):not(.form-control-lg):not(textarea), .form-select:not(.form-select-sm):not(.form-select-lg) { min-height: 44px; }
.form-control:focus, .form-select:focus { border-color: var(--mn-primary); box-shadow: 0 0 0 .2rem rgba(var(--mn-primary-rgb), .15); }
.form-label { font-weight: 600; font-size: .86rem; color: var(--mn-heading-color); margin-bottom: .35rem; }
.form-check-input:checked { background-color: var(--mn-primary); border-color: var(--mn-primary); }
.form-check-input:focus { border-color: var(--mn-primary); box-shadow: 0 0 0 .2rem rgba(var(--mn-primary-rgb), .15); }
.form-switch .form-check-input:focus { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23f2541b'/%3e%3c/svg%3e"); }
.input-group-text { background: var(--mn-surface-2); border-color: var(--mn-border-color); }
.icon-disc { border-radius: var(--mn-radius-sm); }
.badge { --bs-badge-border-radius: 6px; font-weight: 700; letter-spacing: .01em; }
.eyebrow { display: inline-flex; align-items: center; gap: .55rem; letter-spacing: .12em; }
.eyebrow::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.section-head h2, .section-head .h2 { font-weight: 800; letter-spacing: -.03em; }
h1, .h1, h2, .h2 { font-weight: 800; letter-spacing: -.03em; }
.nav-tabs { --bs-nav-tabs-border-color: var(--mn-border-color); --bs-nav-tabs-link-active-bg: transparent; --bs-nav-tabs-link-active-border-color: transparent transparent var(--mn-primary); --bs-nav-tabs-link-hover-border-color: transparent; --bs-nav-tabs-border-radius: 0; }
.nav-tabs .nav-link { font-weight: 600; color: var(--mn-muted-color); border-width: 0 0 2px; margin-bottom: -1px; }
.nav-tabs .nav-link.active { color: var(--mn-heading-color); }
.nav-pills { --bs-nav-pills-border-radius: var(--mn-radius-sm); --bs-nav-pills-link-active-bg: var(--mn-ink); --bs-nav-pills-link-active-color: #fff; }
[data-bs-theme="dark"] .nav-pills { --bs-nav-pills-link-active-bg: var(--mn-on-ink); --bs-nav-pills-link-active-color: #111; }
.nav-pills .nav-link { font-weight: 600; }
.table { --bs-table-bg: transparent; --bs-table-border-color: var(--mn-border-color); --bs-table-hover-bg: color-mix(in srgb, var(--mn-surface-2) 60%, transparent); }
.table > thead th { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mn-faint-color); font-weight: 700; }
.dropdown-menu { --bs-dropdown-border-color: var(--mn-border-color); --bs-dropdown-border-radius: var(--mn-radius-card); --bs-dropdown-link-active-bg: var(--mn-primary-subtle); --bs-dropdown-link-active-color: var(--mn-primary-text); box-shadow: var(--mn-shadow-lg); }
.modal-content { border: 1px solid var(--mn-border-color); border-radius: var(--mn-radius-lg); }
.alert { --bs-alert-border-radius: var(--mn-radius-card); }
.accordion { --bs-accordion-active-bg: var(--mn-primary-subtle); --bs-accordion-active-color: var(--mn-heading-color); --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem rgba(var(--mn-primary-rgb), .15); }
.pagination { --bs-pagination-active-bg: var(--mn-ink); --bs-pagination-active-border-color: var(--mn-ink); --bs-pagination-border-radius: var(--mn-radius-sm); }
.progress { --bs-progress-bar-bg: var(--mn-primary); }
.link-arrow { font-weight: 600; }

/* Page hero (all inner pages): ink band with the Moderna glow + grid */
.page-hero { background-color: var(--mn-ink); isolation: isolate; }
.page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(620px 300px at 85% 10%, rgba(var(--mn-primary-rgb), .28), transparent 70%); }
.page-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: radial-gradient(ellipse at 80% 30%, #000, transparent 70%); mask-image: radial-gradient(ellipse at 80% 30%, #000, transparent 70%); }
.page-hero:has(.page-hero-media)::after { display: none; }
.page-hero-title { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.2rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.page-hero-lead { color: var(--mn-on-ink-muted); max-width: 60ch; font-size: 1.05rem; }
.page-hero .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.35); --bs-breadcrumb-item-active-color: var(--mn-primary); font-weight: 600; }
.page-hero .breadcrumb-item a { color: var(--mn-on-ink-muted); }
.page-hero .breadcrumb-item a:hover { color: #fff; }
.page-hero .btn-soft { --bs-btn-bg: rgba(255,255,255,.08); --bs-btn-color: #fff; --bs-btn-hover-bg: rgba(255,255,255,.16); --bs-btn-hover-color: #fff; }
.chrome-dark { --mn-chrome-bg: var(--mn-ink); }

/* 27. Sign-in pages (layouts/auth.tpl)
   -------------------------------------------------------------------------- */
.mn-auth-stage { background-color: var(--mn-ink); overflow: hidden; isolation: isolate; }
.mn-auth-stage--ink::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(520px 420px at 78% 72%, rgba(var(--mn-primary-rgb), .38), transparent 70%), radial-gradient(420px 320px at 10% 10%, rgba(var(--mn-accent-rgb), .18), transparent 70%); }
.mn-auth-stage__grid { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 48px 48px; -webkit-mask-image: radial-gradient(ellipse at 70% 60%, #000 10%, transparent 72%); mask-image: radial-gradient(ellipse at 70% 60%, #000 10%, transparent 72%); }
.mn-auth-stage__ring { position: absolute; z-index: -1; inset-inline-end: -170px; bottom: -230px; width: 480px; aspect-ratio: 1; border-radius: 50%; border: 70px solid rgba(var(--mn-primary-rgb), .9); opacity: .9; }
.mn-auth-stage__ring::after { content: ""; position: absolute; inset: 60px; border-radius: 50%; border: 1px dashed rgba(255,255,255,.25); }
.mn-auth-stage .auth-stage-inner { color: #fff; }
.mn-auth-stage .auth-stage-title { color: #fff; font-size: clamp(2rem, 1.3rem + 2vw, 3rem); letter-spacing: -.045em; line-height: 1.02; }
.mn-auth-stage .auth-stage-text, .mn-auth-stage .auth-stage-foot { color: var(--mn-on-ink-muted); }
.mn-auth-stage .auth-stage-foot a { color: #fff; }
.mn-auth-points { list-style: none; padding: 0; margin: 1.6rem 0 0; display: grid; gap: .7rem; }
.mn-auth-points li { display: flex; align-items: center; gap: .75rem; color: #fff; font-weight: 500; font-size: .95rem; }
.mn-auth-points i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: var(--mn-radius-sm); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); color: var(--mn-primary); font-size: 1rem; flex: none; }
.auth-form { background-color: var(--mn-body-bg); }
.auth-form-inner .h3, .auth-form-inner h1, .auth-form-inner h2 { font-weight: 800; letter-spacing: -.035em; }
.auth-form-inner .btn-primary { min-height: 48px; }
.auth-icon { border-radius: var(--mn-radius-sm) !important; }

/* 28. Client dashboard (views/account/dashboard*.tpl)
   -------------------------------------------------------------------------- */
.dash { --dash-tile-radius: var(--mn-radius-card); --dash-glass: rgba(255,255,255,.07); --dash-glass-strong: rgba(255,255,255,.14); --dash-glass-border: rgba(255,255,255,.14); }
.dash-hero, [dir="rtl"] .dash-hero, [data-bs-theme="dark"] .dash-hero, [dir="rtl"][data-bs-theme="dark"] .dash-hero {
    background: radial-gradient(560px 320px at 88% 110%, rgba(var(--mn-primary-rgb), .42), transparent 70%), var(--mn-ink);
    color: #fff; border: 1px solid rgba(255,255,255,.06); border-radius: var(--mn-radius-lg); box-shadow: none; overflow: hidden;
}
.dash-hero:before, [dir="rtl"] .dash-hero:before {
    background-image: linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
    background-size: 40px 40px; -webkit-mask-image: radial-gradient(ellipse at 80% 50%, #000 5%, transparent 70%); mask-image: radial-gradient(ellipse at 80% 50%, #000 5%, transparent 70%);
}
.dash-eyebrow { color: var(--mn-primary); display: inline-flex; align-items: center; gap: .5rem; }
.dash-eyebrow::before { content: ""; width: 16px; height: 2px; background: currentColor; }
.dash-greeting { color: #fff; letter-spacing: -.04em; font-size: clamp(1.7rem, 3.2vw, 2.5rem); }
.dash-health { color: var(--mn-on-ink-muted); }
.dash-pulse { --pulse-color: #3ddc97; }
.dash-pulse-warn { --pulse-color: var(--bs-warning); }
.dash-btn-glass { color: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
.dash-btn-glass:hover { color: #fff; }
.dash-btn-light, .dash-btn-light:hover { color: #fff; background: var(--mn-primary); box-shadow: none; }
.dash-btn-light:hover { background: var(--mn-primary-hover, var(--mn-primary)); }
.dash-balance-card { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(255,255,255,.05); }
.dash-balance-label, .dash-balance-note { color: var(--mn-on-ink-muted); }
.dash-balance-value { font-family: var(--mn-font-mono); letter-spacing: -.04em; }
.dash-stat { box-shadow: none; }
.dash-stat:hover { box-shadow: none; transform: translateY(-2px); border-color: var(--mn-border-strong); }
.dash-stat::after { content: ""; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 3px; background: var(--mn-primary); transform: scaleY(0); transform-origin: bottom; transition: transform .3s var(--mn-ease); }
.dash-stat:hover::after { transform: scaleY(1); }
.dash-stat-watermark { display: none; }
.dash-stat-ico { border-radius: var(--mn-radius-sm); }
.dash-stat-label { font-size: .9rem; color: var(--mn-muted-color); }
.dash-stat-value { font-family: var(--mn-font-mono); font-size: 2rem; letter-spacing: -.05em; }
.dash-panel { box-shadow: none; border-radius: var(--mn-radius-card); }
.dash-panel-title { font-weight: 800; letter-spacing: -.02em; }
.dash-panel-link { color: var(--mn-primary-text); }
.dash-alert { border-radius: var(--mn-radius-card); }

/* 29. Client navigation (sidebar + topbar)
   -------------------------------------------------------------------------- */
.client-sidebar-link.active { background-color: rgba(var(--mn-primary-rgb), .14); }
.client-sidebar-link.active:before, .client-sidebar-link:has(.client-sidebar-badge):after { background-color: var(--mn-primary); }
.client-sidebar-badge { background-color: var(--mn-primary); color: #fff; }
.client-sidebar-link .bi { transition: color .2s; }
.client-sidebar-link.active .bi, .client-sidebar-link:hover .bi { color: var(--mn-primary); }
.client-topbar { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: var(--mn-body-bg); border-bottom: 1px solid var(--mn-border-color); }
body[data-client-nav] { background-color: var(--mn-body-bg); }

/* 30. Client lists (services, domains, invoices, tickets …) + status palette
   -------------------------------------------------------------------------- */
:root, [data-bs-theme="light"] {
    --bs-info: #2b7bb9; --bs-info-rgb: 43, 123, 185; --bs-info-text-emphasis: #174a70;
    --bs-info-bg-subtle: #e3eff8; --bs-info-border-subtle: #b5d3ea;
}
[data-bs-theme="dark"] {
    --bs-info: #5fa8e0; --bs-info-rgb: 95, 168, 224; --bs-info-text-emphasis: #9ccbf0;
    --bs-info-bg-subtle: #0f2436; --bs-info-border-subtle: #1f4a6c;
}
.list-title { font-size: clamp(1.6rem, 1.2rem + 1vw, 2.1rem); font-weight: 800; letter-spacing: -.04em; }
.list-page .list-tile, [dir="rtl"] .list-page .list-tile { border: 1px solid var(--mn-border-color); border-radius: var(--mn-radius-card); box-shadow: none; padding: 1rem 1.15rem; transition: background-color .2s, border-color .2s, color .2s; }
.list-page .list-tile:hover { border-color: var(--mn-border-strong); }
.list-tile-watermark { display: none; }
.list-tile-ico { border-radius: var(--mn-radius-sm); }
.list-tile-value { font-family: var(--mn-font-mono); font-size: 1.45rem; letter-spacing: -.05em; }
.list-page .list-tile.is-active, [dir="rtl"] .list-page .list-tile.is-active { background: var(--mn-ink); border-color: var(--mn-ink); box-shadow: none; }
.list-page .list-tile.is-active .list-tile-value { color: #fff; }
.list-page .list-tile.is-active .list-tile-label { color: var(--mn-on-ink-muted); }
.list-page .list-tile.is-active .list-tile-ico { background: rgba(255,255,255,.1); color: var(--mn-primary); }
.list-page .list-tile.is-active .list-tile-sub { color: var(--mn-primary); }
[data-bs-theme="dark"] .list-page .list-tile.is-active { background: var(--mn-surface-3, #22252a); border-color: var(--mn-primary); }
.list-toolbar { border: 1px solid var(--mn-border-color); border-radius: var(--mn-radius-card); }
.list-rows > .list-item, .list-rows > article, .list-row-card { border-radius: var(--mn-radius-card); }
.announcement { border-radius: var(--mn-radius-card); }
.list-item { border: 1px solid var(--mn-border-color); box-shadow: none; }
.list-item:hover { box-shadow: none; border-color: var(--mn-border-strong); }
.mn-compare th.mn-compare__idx { font-family: var(--mn-font-mono); font-size: .72rem; font-weight: 600; color: var(--mn-faint-color); letter-spacing: .04em; }

/* 31. Secondary colour neutralised: WStyle page sheets blend --mn-secondary into gradients and
   accents; Moderna keeps those spots on the ink/primary pair so no mixed hues appear.
   The site-wide brand secondary stays available as --mn-brand-secondary. */
:root {
    --mn-brand-secondary: var(--mn-secondary);
}
body {
    --mn-secondary: var(--mn-ink);
    --mn-secondary-rgb: 18, 20, 23;
    --mn-secondary-subtle: var(--mn-surface-2);
}

/* 32. Checkout shell (configure, cart, checkout, pay): ink rail with the primary glow
   -------------------------------------------------------------------------- */
.checkout-split-aside, [dir="rtl"] .checkout-split-aside {
    background-color: var(--mn-ink);
    background-image: radial-gradient(420px 360px at 100% 100%, rgba(var(--mn-primary-rgb), .45), transparent 70%),
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: auto, 40px 40px, 40px 40px;
}
.checkout-split-aside .btn-light, .checkout-split-aside .btn-primary { --bs-btn-bg: var(--mn-primary); --bs-btn-border-color: var(--mn-primary); --bs-btn-color: #fff; --bs-btn-hover-bg: var(--mn-primary-hover); --bs-btn-hover-border-color: var(--mn-primary-hover); --bs-btn-hover-color: #fff; --bs-btn-disabled-bg: rgba(255,255,255,.12); --bs-btn-disabled-border-color: transparent; --bs-btn-disabled-color: rgba(255,255,255,.6); }
.checkout-steps .is-active .checkout-step-num, .checkout-step.is-current .checkout-step-num { background: var(--mn-primary); }
body[data-client-nav="topbar"] .client-topbar { display: flex; position: sticky; top: 0; z-index: 1030; box-shadow: none; padding-inline: max(.75rem, calc((100vw - var(--mn-container-wide, 1440px)) / 2 + .75rem)); }
/* Top-menu client area: the page body sits in the same centred column as the bars above it */
body[data-client-nav="topbar"] .client-main { display: flex; flex-direction: column; min-block-size: calc(100svh - var(--client-topbar-h, 3.75rem)); }
body[data-client-nav="topbar"] .client-main > main { flex: 1 0 auto; inline-size: 100%; max-inline-size: var(--mn-container-wide, 1440px); margin-inline: auto; padding: 1.5rem .75rem 2rem; }
body[data-client-nav="topbar"] .client-footer > * { max-inline-size: var(--mn-container-wide, 1440px); margin-inline: auto; }
body[data-client-nav="topbar"] .client-topbar-brand { display: inline-flex !important; margin-inline-end: .75rem; }
body[data-client-nav="topbar"] [data-action="client-drawer-toggle"] { display: none !important; }
body[data-client-nav="topbar"] .client-quickactions { display: block !important; }
body[data-client-nav="topbar"] .mn-topnav { top: var(--client-topbar-h, 3.75rem); }
@media (max-width: 575.98px) { body[data-client-nav="topbar"] .client-quickactions { display: none !important; } }
.mn-countdown b { font-variant-numeric: tabular-nums; min-width: 2ch; text-align: center; }
.mn-countdown__over { display: block; font-size: .85rem; font-weight: 600; color: var(--mn-on-ink-muted); padding: .45rem 0; }
.mn-countdown__over[hidden], .mn-countdown[hidden] { display: none; }
.mn-ctop-back { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; white-space: nowrap; }
@media (max-width: 767.98px) { .mn-ctop-back span { display: none; } .mn-ctop-back { padding-inline: .6rem; } }
@media (max-width: 767.98px) { .mn-ctop-locale__label { display: none; } .mn-ctop-locale .locale-toggle .bi { margin: 0 !important; } .mn-ctop-locale .locale-toggle { padding-inline: .6rem; } }