/**
 * Modernize — components and page sections
 * @author Venus <https://venus.tr>
 *
 * Loaded after default.css. Tokens come from css/theme.css (+ the settings block printed by
 * partials/head-assets.tpl). All selectors are prefixed with .mz- ; RTL via logical properties.
 */

/* 1. Global glue on top of the WStyle system
   -------------------------------------------------------------------------- */
:root {
  --mz-accent-subtle: color-mix(in srgb, var(--mz-accent) 12%, var(--mz-surface-bg));
  --mz-primary-subtle: color-mix(in srgb, var(--mz-primary) 12%, var(--mz-surface-bg));
  --mz-on-primary: #fff;
  --bs-body-font-family: var(--mz-font-family);
  --bs-font-monospace: var(--mz-font-mono);
}
[data-bs-theme="dark"] {
  --mz-primary-subtle: color-mix(in srgb, var(--mz-primary) 16%, var(--mz-surface-bg));
  --mz-primary-text: color-mix(in srgb, var(--mz-primary) 72%, white);
}
.mz-r-sharp { --mz-radius: 4px; --mz-radius-sm: 3px; --mz-radius-card: 6px; --mz-radius-lg: 8px; --mz-radius-xl: 10px; }
.mz-r-round { --mz-radius: 14px; --mz-radius-sm: 10px; --mz-radius-card: 20px; --mz-radius-lg: 28px; --mz-radius-xl: 36px; }
.mz-w-wide { --mz-container: 1440px; }
.mz-w-narrow { --mz-container: 1200px; }
@media (min-width: 1400px) { .container, .container-xxl { max-width: var(--mz-container); } }
html { scroll-padding-top: calc(var(--mz-header-h) + 16px); }
body { font-family: var(--mz-font-family); background: var(--mz-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(--mz-primary); color: #fff; }
.mz-topbar a, .mz-navbar a, .mz-drawer a, .mz-footer a, .mz-mega a, .mz-drop a, .mz-cta a, .mz-fab,
[class*="mz-"] a, a[class*="mz-"] { text-decoration: none; }
.mz-custom__body a, .mz-footer__brand p a { text-decoration: underline; text-underline-offset: 3px; }
.mz-mono, .num-tabular { font-feature-settings: "tnum"; }
.mz-mono { font-family: var(--mz-font-mono); letter-spacing: -0.02em; }
.mz-skip { position: absolute; z-index: 2000; inset-inline-start: 16px; top: 8px; background: var(--mz-ink); color: #fff; padding: 8px 14px; border-radius: 8px; }
.mz-no-anim *, .mz-no-anim *::before, .mz-no-anim *::after { animation: none !important; transition: none !important; }

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

/* 3. Shared components
   -------------------------------------------------------------------------- */
.mz-btn {
    --_bg: transparent; --_fg: var(--mz-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(--mz-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(--mz-ease), box-shadow .2s;
    white-space: nowrap;
}
.mz-btn:hover { color: var(--_fg); }
.mz-btn:active { transform: translateY(1px); }
.mz-btn .bi { font-size: 1.05em; transition: transform .2s var(--mz-ease); }
.mz-btn:hover .bi-arrow-right { transform: translateX(3px); }
[dir="rtl"] .mz-btn .bi-arrow-right { transform: scaleX(-1); }
.mz-btn--primary { --_bg: var(--mz-primary); --_fg: var(--mz-on-primary); }
.mz-btn--primary:hover { --_bg: var(--mz-primary-hover); background: var(--_bg); box-shadow: 0 8px 20px -8px var(--mz-primary); }
.mz-btn--ink { --_bg: var(--mz-ink); --_fg: #fff; }
.mz-btn--ink:hover { --_bg: #000; background: var(--_bg); }
[data-bs-theme="dark"] .mz-btn--ink { --_bg: var(--mz-on-ink); --_fg: #111; }
.mz-btn--ghost { --_fg: var(--mz-heading-color); --_bd: var(--mz-border-strong); }
.mz-btn--ghost:hover { --_bd: var(--mz-heading-color); border-color: var(--_bd); }
.mz-btn--outline { --_fg: var(--mz-heading-color); --_bd: var(--mz-border-strong); background: var(--mz-surface-bg); }
.mz-btn--outline:hover { --_bd: var(--mz-primary); --_fg: var(--mz-primary-text); border-color: var(--_bd); color: var(--_fg); }
.mz-btn--light { --_bg: rgba(255,255,255,.08); --_fg: #fff; --_bd: rgba(255,255,255,.22); }
.mz-btn--light:hover { --_bg: rgba(255,255,255,.16); background: var(--_bg); }
.mz-btn--text { --_fg: var(--mz-heading-color); padding-inline: .6rem; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--mz-border-strong); }
.mz-btn--text:hover { text-decoration-color: var(--mz-primary); }
.mz-btn--lg { height: 52px; padding: 0 1.5rem; font-size: 1rem; }
.mz-btn--sm { height: 36px; padding: 0 .85rem; font-size: .85rem; }

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

.mz-tag {
    display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 5px;
    font-size: .66rem; font-weight: 700; letter-spacing: .04em; font-style: normal;
    background: var(--mz-surface-2); color: var(--mz-heading-color); vertical-align: middle; line-height: 1;
}
.mz-tag--flame { background: var(--mz-primary); color: #fff; }

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

.mz-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(--mz-primary-text);
}
.mz-kicker::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.mz-kicker--light { color: var(--mz-primary); }
.mz-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; }
.mz-lead { font-size: 1.075rem; color: var(--mz-muted-color); max-width: 52ch; }

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

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

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

.mz-seg {
    display: inline-flex; padding: 4px; gap: 2px; border-radius: 10px;
    background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color);
}
.mz-seg button, .mz-bill button, .mz-viewswitch button {
    border: 0; background: transparent; color: var(--mz-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;
}
.mz-seg button:hover, .mz-bill button:hover, .mz-viewswitch button:hover { color: var(--mz-heading-color); }
.mz-seg button.is-active, .mz-bill button.is-active { background: var(--mz-ink); color: #fff; }
[data-bs-theme="dark"] .mz-seg button.is-active, [data-bs-theme="dark"] .mz-bill button.is-active { background: var(--mz-on-ink); color: #111; }
.mz-seg--sm button { height: 32px; padding: 0 .8rem; font-size: .85rem; }

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

/* 4. Topbar
   -------------------------------------------------------------------------- */
.mz-topbar { background: var(--mz-ink); color: var(--mz-on-ink-muted); font-size: .82rem; position: relative; z-index: 1031; }
.mz-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 42px; }
.mz-topbar__left, .mz-topbar__right { display: flex; align-items: center; gap: 1.1rem; }
.mz-topbar a, .mz-topbar button { white-space: nowrap; }
.mz-topbar__right { gap: .4rem; }
.mz-topbar .mz-status { color: var(--mz-on-ink); font-weight: 500; }
.mz-topbar .mz-status__dot { background: #5aa9ff; }
.mz-topbar .mz-status__dot::after { border-color: #5aa9ff; }
.mz-topbar__link { display: inline-flex; align-items: center; gap: .4rem; color: var(--mz-on-ink-muted); transition: color .2s; }
.mz-topbar__link:hover, .mz-topbar__nav a:hover { color: #fff; }
.mz-topbar__nav { gap: 1.1rem; margin-inline-end: .6rem; }
.mz-topbar__nav a { color: var(--mz-on-ink-muted); transition: color .2s; }
.mz-topbar__sep { width: 1px; height: 18px; background: rgba(255,255,255,.14); margin-inline: .3rem; }
.mz-chip-btn {
    display: inline-flex; align-items: center; gap: .35rem; height: 30px; padding: 0 .6rem;
    border-radius: 6px; border: 1px solid transparent; background: transparent; color: var(--mz-on-ink);
    font-size: .8rem; font-weight: 600; transition: background-color .2s, border-color .2s;
}
.mz-chip-btn:hover, .mz-chip-btn[aria-expanded="true"] { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.mz-chip-btn .mz-caret { font-size: .65rem; opacity: .7; }
.mz-theme-toggle { width: 30px; justify-content: center; padding: 0; font-size: .95rem; }
.mz-topbar__cta { align-items: center; gap: .4rem; height: 30px; padding: 0 .75rem; border-radius: 6px; background: var(--mz-primary); color: #fff; font-weight: 600; margin-inline-start: .35rem; }
.mz-topbar__cta:hover { background: var(--mz-primary-hover); color: #fff; }
.mz-mini-menu {
    --bs-dropdown-bg: var(--mz-surface-bg); --bs-dropdown-border-color: var(--mz-border-color); --bs-dropdown-link-color: var(--mz-heading-color);
    --bs-dropdown-link-hover-bg: var(--mz-surface-2); --bs-dropdown-link-active-bg: var(--mz-primary-subtle); --bs-dropdown-link-active-color: var(--mz-primary-text);
    --bs-dropdown-font-size: .88rem; border-radius: var(--mz-radius-card); padding: 6px; box-shadow: var(--mz-shadow); min-width: 170px; margin-top: 6px !important;
}
.mz-mini-menu .dropdown-item { border-radius: 6px; padding: .45rem .7rem; font-weight: 500; }

/* 5. Navbar + menus
   -------------------------------------------------------------------------- */
.mz-header { position: relative; z-index: 1030; }
.mz-sticky .mz-header { position: sticky; top: 0; }
.mz-sticky .mz-header:has(.mz-topbar) { top: -42px; }
@media (max-width: 767.98px) { .mz-sticky .mz-header:has(.mz-topbar) { top: -40px; } }
.mz-navbar {
    position: sticky; top: 0; z-index: 1030;
    background: color-mix(in srgb, var(--mz-surface-bg) 97%, transparent);
    border-bottom: 1px solid var(--mz-border-color);
    transition: box-shadow .3s, background-color .3s;
}
.mz-header.is-scrolled .mz-navbar { box-shadow: 0 8px 24px -16px rgba(0,0,0,.3); }
.mz-navbar__inner { display: flex; align-items: center; gap: 1.5rem; height: var(--mz-header-h); }

.mz-brand { display: inline-flex; align-items: center; gap: .6rem; color: var(--mz-heading-color); flex: none; }
.mz-brand:hover { color: var(--mz-heading-color); }
.mz-brand__word { font-size: 1.45rem; font-weight: 800; letter-spacing: -.045em; line-height: 1; }
.mz-brand__word b { color: var(--mz-primary); }
.mz-brand--light { color: #fff; }
.mz-brand--light:hover { color: #fff; }

.mz-menu-wrap { flex: 1; }
.mz-menu { display: flex; align-items: center; gap: .15rem; list-style: none; margin: 0; padding: 0; }
.mz-menu__item { position: static; height: var(--mz-header-h); display: flex; align-items: center; }
.mz-menu__item:not(.has-mega) { position: relative; }
.mz-menu__link {
    white-space: nowrap;
    display: inline-flex; align-items: center; gap: .35rem; height: 40px; padding: 0 .8rem;
    border: 0; background: transparent; border-radius: 8px;
    font-weight: 600; font-size: .95rem; color: var(--mz-heading-color);
    transition: background-color .2s, color .2s;
}
.mz-menu__link .mz-caret { font-size: .7rem; transition: transform .25s var(--mz-ease); opacity: .6; }
.mz-menu__item:hover > .mz-menu__link,
.mz-menu__item.is-open > .mz-menu__link { background: var(--mz-surface-2); color: var(--mz-heading-color); }
.mz-menu__item:hover > .mz-menu__link .mz-caret,
.mz-menu__item.is-open > .mz-menu__link .mz-caret { transform: rotate(180deg); }
.mz-menu__link .mz-tag { margin-inline-start: .2rem; }

/* Ortak açılır panel davranışı */
.mz-drop, .mz-mega {
    position: absolute; top: 100%; z-index: 1040;
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity .2s var(--mz-ease), transform .25s var(--mz-ease), visibility 0s linear .25s;
}
.mz-menu__item.has-drop:hover > .mz-drop,
.mz-menu__item.has-drop:hover > .mz-mega,
.mz-menu__item.is-open > .mz-drop,
.mz-menu__item.is-open > .mz-mega {
    opacity: 1; visibility: visible; transform: none; transition-delay: 0s;
}
.mz-menu__item.is-closed > .mz-drop,
.mz-menu__item.is-closed > .mz-mega { opacity: 0; visibility: hidden; transform: translateY(8px); }
.mz-menu__item.is-closed > .mz-menu__link .mz-caret { transform: none !important; }

.mz-drop {
    inset-inline-start: 0; margin-top: -6px; min-width: 240px; padding: 8px;
    background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-card);
    box-shadow: var(--mz-shadow-lg); list-style: none;
}
.mz-drop--simple li { position: relative; }
.mz-drop--simple a {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .6rem .8rem; border-radius: 8px; font-weight: 500; font-size: .92rem; color: var(--mz-heading-color);
}
.mz-drop--simple a:hover { background: var(--mz-surface-2); }
.mz-drop--simple a .bi { font-size: .75rem; opacity: .5; }
.mz-drop--sub { top: -9px; inset-inline-start: 100%; margin-top: 0; margin-inline-start: 6px; }
.mz-drop--simple .has-sub:hover > .mz-drop--sub,
.mz-drop--simple .has-sub:focus-within > .mz-drop--sub { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.mz-drop--simple .has-sub::after { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 100%; width: 10px; }

.mz-drop--rich { width: 380px; padding: 10px; }
.mz-drop__row { display: flex; gap: .85rem; align-items: flex-start; padding: .7rem; border-radius: 10px; transition: background-color .2s; }
.mz-drop__row:hover { background: var(--mz-surface-2); }
.mz-drop__row b { display: block; font-size: .93rem; font-weight: 600; color: var(--mz-heading-color); }
.mz-drop__row small { display: block; font-size: .8rem; color: var(--mz-muted-color); line-height: 1.4; margin-top: 2px; }
.mz-ico {
    flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 9px;
    background: var(--mz-primary-subtle); color: var(--mz-primary-text); font-size: 1.05rem;
}
.mz-drop__foot {
    display: flex; align-items: center; gap: .5rem; margin-top: 6px; padding: .8rem .75rem .5rem;
    border-top: 1px dashed var(--mz-border-color); font-size: .84rem; font-weight: 600; color: var(--mz-heading-color);
}
.mz-drop__foot .bi { margin-inline-start: auto; transition: transform .2s; }
.mz-drop__foot:hover .bi { transform: translateX(3px); }

/* Mega panel: container genişliğinde, navbar'ın altında */
.mz-mega {
    left: 0; right: 0; padding-top: 1px;
}
.mz-mega > .container {
    background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: 0 0 var(--mz-radius-lg) var(--mz-radius-lg);
    box-shadow: var(--mz-shadow-lg); padding: 1.75rem; border-top: 0;
}
.mz-mega__grid { display: grid; grid-template-columns: 1fr 1fr .8fr 1.1fr; gap: 1.5rem; }
.mz-mega__label { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--mz-faint-color); margin-bottom: .75rem; }
.mz-mega__link { display: flex; gap: .8rem; padding: .6rem; margin-inline: -.6rem; border-radius: 10px; transition: background-color .2s; }
.mz-mega__link:hover { background: var(--mz-surface-2); }
.mz-mega__link > .bi { flex: none; font-size: 1.15rem; color: var(--mz-primary-text); margin-top: 1px; }
.mz-mega__link b { font-weight: 600; font-size: .93rem; color: var(--mz-heading-color); }
.mz-mega__link small { display: block; color: var(--mz-muted-color); font-size: .8rem; }
.mz-mega__col--list { border-inline-start: 1px solid var(--mz-border-color); padding-inline-start: 1.5rem; }
.mz-mega__col--list a { display: flex; align-items: center; gap: .6rem; padding: .45rem 0; font-size: .9rem; font-weight: 500; color: var(--mz-heading-color); }
.mz-mega__col--list a:hover { color: var(--mz-primary-text); }
.mz-mega__col--list .bi { color: var(--mz-faint-color); }
.mz-mega__promo { position: relative; display: block; border-radius: var(--mz-radius-card); overflow: hidden; min-height: 240px; background: var(--mz-ink); color: #fff; }
.mz-mega__promo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; transition: transform .6s var(--mz-ease), opacity .3s; }
.mz-mega__promo:hover img { transform: scale(1.05); opacity: .35; }
.mz-mega__promo-body { position: absolute; inset: auto 0 0 0; padding: 1.25rem; display: flex; flex-direction: column; gap: .35rem; background: linear-gradient(transparent, rgba(0,0,0,.75)); }
.mz-mega__promo-body .mz-tag { align-self: flex-start; }
.mz-mega__promo-body b { font-size: 1.2rem; }
.mz-mega__promo-body small { color: rgba(255,255,255,.75); }
.mz-mega__promo-go { font-weight: 600; font-size: .88rem; margin-top: .35rem; color: #fff; }

/* Sekmeli mega */
.mz-mtabs { display: grid; grid-template-columns: 260px 1fr; gap: 1.75rem; }
.mz-mtabs__list { display: flex; flex-direction: column; gap: 4px; border-inline-end: 1px solid var(--mz-border-color); padding-inline-end: 1.25rem; }
.mz-mtabs__tab {
    display: flex; align-items: center; gap: .8rem; padding: .7rem .8rem; border: 0; border-radius: 10px;
    background: transparent; text-align: start; color: var(--mz-heading-color); transition: background-color .2s;
}
.mz-mtabs__tab .bi { font-size: 1.2rem; color: var(--mz-faint-color); transition: color .2s; }
.mz-mtabs__tab b { display: block; font-size: .93rem; font-weight: 600; }
.mz-mtabs__tab small { display: block; font-size: .78rem; color: var(--mz-muted-color); }
.mz-mtabs__tab:hover { background: var(--mz-surface-2); }
.mz-mtabs__tab.is-active { background: var(--mz-ink); color: #fff; }
.mz-mtabs__tab.is-active small { color: var(--mz-on-ink-muted); }
.mz-mtabs__tab.is-active .bi { color: var(--mz-primary); }
[data-bs-theme="dark"] .mz-mtabs__tab.is-active { background: var(--mz-surface-3); }
.mz-mtabs__pane { display: none; grid-template-columns: 1fr 220px; gap: 2rem; animation: mz-fade .3s var(--mz-ease); }
.mz-mtabs__pane.is-active { display: grid; }
.mz-mtabs__text h3 { font-size: 1.5rem; font-weight: 800; letter-spacing: -.03em; margin-bottom: .5rem; }
.mz-mtabs__text p { color: var(--mz-muted-color); max-width: 52ch; }
.mz-mtabs__side { background: var(--mz-surface-2); border-radius: var(--mz-radius-card); padding: 1.1rem 1.2rem; }
.mz-mtabs__side a { display: flex; align-items: center; gap: .55rem; padding: .4rem 0; font-size: .9rem; font-weight: 500; color: var(--mz-heading-color); }
.mz-mtabs__side a:hover { color: var(--mz-primary-text); }
.mz-specs-inline { display: flex; gap: 0; list-style: none; padding: 0; margin: 1.1rem 0 1.4rem; border: 1px solid var(--mz-border-color); border-radius: 10px; overflow: hidden; }
.mz-specs-inline li { flex: 1; padding: .7rem .9rem; border-inline-end: 1px solid var(--mz-border-color); }
.mz-specs-inline li:last-child { border: 0; }
.mz-specs-inline span { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mz-faint-color); font-weight: 600; }
.mz-specs-inline b { font-family: var(--mz-font-mono); font-size: .98rem; }
@keyframes mz-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.mz-nav-actions { display: flex; align-items: center; gap: .6rem; margin-inline-start: auto; }

/* Drawer (mobil) */
.mz-drawer { --bs-offcanvas-width: min(400px, 92vw); --bs-offcanvas-bg: var(--mz-surface-bg); --bs-offcanvas-color: var(--mz-heading-color); border-inline-start: 1px solid var(--mz-border-color) !important; }
.mz-drawer .offcanvas-header { justify-content: space-between; border-bottom: 1px solid var(--mz-border-color); padding: 1rem 1.25rem; }
.mz-drawer .offcanvas-body { display: flex; flex-direction: column; padding: 1.25rem; gap: 1.25rem; }
.mz-drawer__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.mz-drawer__nav { display: flex; flex-direction: column; }
.mz-drawer__toggle, .mz-drawer__link {
    display: flex; align-items: center; justify-content: space-between; width: 100%;
    padding: .95rem .25rem; border: 0; border-bottom: 1px solid var(--mz-border-color); background: none;
    font-weight: 600; font-size: 1rem; color: var(--mz-heading-color); text-align: start;
}
.mz-drawer__toggle span, .mz-drawer__link span:first-child { display: inline-flex; align-items: center; gap: .75rem; }
.mz-drawer__toggle span .bi, .mz-drawer__link span .bi { color: var(--mz-primary-text); font-size: 1.1rem; }
.mz-drawer__toggle > .bi { transition: transform .25s; font-size: .85rem; }
.mz-drawer__toggle:not(.collapsed) > .bi { transform: rotate(180deg); }
.mz-drawer__sub { display: flex; flex-direction: column; padding: .4rem 0 .8rem 2.1rem; border-bottom: 1px solid var(--mz-border-color); }
.mz-drawer__sub a { padding: .45rem 0; color: var(--mz-muted-color); font-weight: 500; }
.mz-drawer__sub a:hover { color: var(--mz-primary-text); }
.mz-drawer__foot { margin-top: auto; display: flex; flex-direction: column; gap: .6rem; padding-top: 1rem; }
.mz-drawer__foot a { display: flex; align-items: center; gap: .6rem; font-weight: 600; color: var(--mz-heading-color); }

/* 6. Hero / mega banner
   -------------------------------------------------------------------------- */
.mz-hero { padding: 1.5rem 0 1rem; }
.mz-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 1rem; }
.mz-stage { position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: var(--mz-radius-xl); overflow: hidden; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); }
.mz-stage__carousel { flex: 1; }
/* Tüm slaytlar üst üste: yükseklik en uzun slayta sabitlenir, geçişte sayfa zıplamaz */
.mz-stage__carousel .carousel-inner { display: grid; grid-template-columns: minmax(0, 1fr); height: 100%; }
.mz-stage__carousel .carousel-item { display: block; grid-area: 1 / 1; float: none; margin: 0; height: 100%; visibility: hidden; pointer-events: none; transition: opacity .6s ease, visibility 0s linear .6s; }
.mz-stage__carousel .carousel-item.active,
.mz-stage__carousel .carousel-item-next,
.mz-stage__carousel .carousel-item-prev { visibility: visible; transition: opacity .6s ease, visibility 0s; }
.mz-stage__carousel .carousel-item.active { pointer-events: auto; }
.mz-slide {
    position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: stretch; gap: 1rem;
    min-height: 470px; height: 100%; padding: 3.25rem 0 2.5rem 3rem; overflow: hidden;
}
[dir="rtl"] .mz-slide { padding: 3.25rem 3rem 2.5rem 0; }
.mz-slide--paper { background: var(--mz-surface-bg); }
.mz-slide--paper::before {
    content: ""; position: absolute; inset: 0;
    background-image: linear-gradient(var(--mz-border-color) 1px, transparent 1px), linear-gradient(90deg, var(--mz-border-color) 1px, transparent 1px);
    background-size: 44px 44px; opacity: .5;
    -webkit-mask-image: radial-gradient(ellipse at 75% 50%, #000 0%, transparent 65%); mask-image: radial-gradient(ellipse at 75% 50%, #000 0%, transparent 65%);
}
.mz-slide--ink { background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-slide--ink::before { content: ""; position: absolute; inset: 0; background: radial-gradient(600px 300px at 80% 20%, rgba(242,84,27,.25), transparent 70%); }
.mz-slide--flame { background: var(--mz-primary); color: #1a0c05; }
.mz-slide--flame::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, rgba(0,0,0,.035) 0 2px, transparent 2px 14px); }
.mz-slide--sky { background: #e8eefc; }
[data-bs-theme="dark"] .mz-slide--sky { background: #141c30; }
/* Metin her slaytta aynı noktadan başlar; geçişte başlık zıplamaz */
.mz-slide__copy { position: relative; z-index: 2; max-width: 540px; align-self: start; }
.mz-slide__eyebrow { display: block; font-size: .9rem; font-weight: 600; color: var(--mz-muted-color); margin-bottom: .9rem; }
.mz-slide__eyebrow .mz-mono { margin-inline-end: .1rem; font-weight: 700; color: var(--mz-primary-text); font-size: 1rem; }
.mz-slide__title { font-size: clamp(2rem, 1.3rem + 2.4vw, 3.35rem); line-height: 1.04; font-weight: 800; letter-spacing: -.045em; margin-bottom: 1rem; color: inherit; }
.mz-slide__title em { font-style: normal; color: var(--mz-primary); position: relative; white-space: nowrap; }
.mz-slide__title em::after { content: ""; position: absolute; inset-inline: 0; bottom: .02em; height: .12em; background: currentColor; opacity: .25; border-radius: 2px; }
.mz-slide__lead { font-size: 1.05rem; color: var(--mz-muted-color); max-width: 46ch; margin-bottom: 1.25rem; }
.mz-ticks { display: grid; grid-template-columns: repeat(2, max-content); gap: .45rem 1.5rem; list-style: none; padding: 0; margin: 0 0 1.75rem; font-weight: 500; font-size: .93rem; }
.mz-ticks li { display: flex; align-items: center; gap: .45rem; }
.mz-ticks .bi { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--mz-primary-subtle); color: var(--mz-primary-text); font-size: .8rem; }
.mz-slide__cta { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

.mz-slide--ink .mz-slide__eyebrow, .mz-slide--ink .mz-slide__lead { color: var(--mz-on-ink-muted); }
.mz-slide--ink .mz-slide__eyebrow .mz-mono { color: var(--mz-primary); }
.mz-slide--ink .mz-ticks .bi { background: rgba(255,255,255,.08); color: var(--mz-primary); }
.mz-slide--ink .mz-btn--text { --_fg: #fff; text-decoration-color: rgba(255,255,255,.3); }
.mz-slide--flame .mz-slide__eyebrow, .mz-slide--flame .mz-slide__lead { color: rgba(26,12,5,.75); }
.mz-slide--flame .mz-slide__eyebrow .mz-mono { color: #1a0c05; }
.mz-slide--flame .mz-slide__title em { color: #fff; }
.mz-slide--flame .mz-slide__title { color: #1a0c05; }
.mz-slide--sky .mz-slide__title em { color: var(--mz-accent); }

.mz-slide__search { display: flex; gap: .5rem; padding: 6px; background: #fff; border-radius: 12px; max-width: 440px; box-shadow: 0 20px 40px -20px rgba(0,0,0,.35); }
.mz-slide__search input { flex: 1; min-width: 0; border: 0; outline: 0; padding: 0 .9rem; font-size: 1rem; font-weight: 500; background: transparent; color: #111; }

.mz-slide__visual { position: relative; z-index: 1; align-self: stretch; display: flex; align-items: flex-end; justify-content: center; }
.mz-photo { position: relative; overflow: hidden; background: var(--mz-surface-2); }
.mz-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mz-photo--arch { width: 320px; height: 400px; border-radius: 180px 180px 18px 18px; margin-bottom: -2.5rem; }
.mz-photo--tall { width: 330px; height: 420px; border-radius: 18px; transform: rotate(3deg); margin-bottom: -1.5rem; outline: 1px solid rgba(255,255,255,.1); }
.mz-photo--round { width: 340px; height: 340px; border-radius: 50%; align-self: center; border: 10px solid rgba(255,255,255,.2); }

.mz-float {
    position: absolute; z-index: 3; background: var(--mz-surface-bg); color: var(--mz-heading-color);
    border: 1px solid var(--mz-border-color); border-radius: 14px; box-shadow: var(--mz-shadow-lg);
    padding: .8rem 1rem; animation: mz-bob 6s ease-in-out infinite;
}
.mz-float small { display: block; font-size: .75rem; color: var(--mz-muted-color); }
.mz-float--a { top: 16%; inset-inline-start: 0; display: grid; gap: .1rem; min-width: 170px; }
.mz-float__label { font-size: .75rem; color: var(--mz-muted-color); font-weight: 500; }
.mz-float--a b { font-size: 1.35rem; }
.mz-spark { display: flex; align-items: flex-end; gap: 3px; height: 26px; margin-top: .3rem; }
.mz-spark i { flex: 1; height: var(--h); background: var(--mz-primary); border-radius: 2px; opacity: .85; }
.mz-spark i:nth-child(odd) { opacity: .45; }
.mz-float--b { bottom: 14%; inset-inline-end: 6%; display: flex; align-items: center; gap: .6rem; animation-delay: -3s; }
.mz-float--b > .bi { font-size: 1.4rem; color: var(--mz-accent); }
.mz-float--b b { font-size: .9rem; }
.mz-float--term { top: 18%; inset-inline-start: -4%; background: #0b0c0e; color: #d7dae0; border-color: #25282d; font-size: .78rem; display: grid; gap: .2rem; padding: .7rem .95rem .85rem; min-width: 230px; }
.mz-float--term code { color: inherit; font-family: var(--mz-font-mono); font-size: .76rem; }
.mz-float--term code span { color: var(--mz-primary); }
.mz-float--term code b { color: #fff; font-weight: 500; }
.mz-term__bar { display: flex; gap: 5px; margin-bottom: .35rem; }
.mz-term__bar i { width: 8px; height: 8px; border-radius: 50%; background: #3a3e45; }
.mz-term__bar i:first-child { background: var(--mz-primary); }
.mz-float--domain { bottom: 16%; inset-inline-start: 2%; display: flex; align-items: center; gap: 1rem; font-size: 1rem; color: #111; background: #fff; border-color: transparent; }
.mz-float--domain em { font-style: normal; font-size: .75rem; font-weight: 700; background: var(--mz-ink); color: #fff; padding: .25rem .55rem; border-radius: 6px; }
.mz-float--mail { top: 22%; inset-inline-start: 0; display: flex; align-items: center; gap: .7rem; }
.mz-float--mail > .bi { font-size: 1.4rem; color: var(--mz-accent); }
.mz-float--mail b { font-size: .88rem; }
@keyframes mz-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

.mz-stage__tabs { display: flex; align-items: stretch; border-top: 1px solid var(--mz-border-color); background: var(--mz-surface-bg); position: relative; z-index: 3; }
.mz-stage__tab {
    position: relative; flex: 1; border: 0; background: transparent; padding: 1rem 1.25rem; text-align: start;
    font-weight: 600; font-size: .9rem; color: var(--mz-muted-color); border-inline-end: 1px solid var(--mz-border-color); transition: color .2s, background-color .2s;
}
.mz-stage__tab:hover { color: var(--mz-heading-color); background: var(--mz-surface-2); }
.mz-stage__tab.is-active { color: var(--mz-heading-color); }
.mz-stage__bar { position: absolute; left: 0; right: 0; top: -1px; height: 3px; background: transparent; overflow: hidden; }
.mz-stage__bar::after { content: ""; position: absolute; inset: 0; background: var(--mz-primary); transform-origin: left; transform: scaleX(var(--p, 0)); }
[dir="rtl"] .mz-stage__bar::after { transform-origin: right; }
.mz-stage.is-stopped .mz-stage__tab.is-active .mz-stage__bar::after { transform: scaleX(1); }
.mz-stage__pause { flex: none; width: 56px; border: 0; background: transparent; color: var(--mz-muted-color); font-size: 1.1rem; }
.mz-stage__pause:hover { color: var(--mz-heading-color); background: var(--mz-surface-2); }

/* Hero side tiles */
.mz-hero__side { display: grid; grid-template-rows: 1fr auto; gap: 1rem; min-width: 0; }
.mz-hero__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.mz-tile { position: relative; display: block; border-radius: var(--mz-radius-lg); padding: 1.25rem; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); overflow: hidden; }
.mz-tile__kicker { display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--mz-primary-text); margin: 0 0 .25rem; }
.mz-tile--photo { background: var(--mz-ink); color: #fff; min-height: 250px; border: 0; }
.mz-tile--photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; transition: transform .8s var(--mz-ease); }
.mz-tile--photo:hover img { transform: scale(1.06); }
.mz-tile--photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,10,12,.1) 20%, rgba(10,10,12,.85)); }
.mz-tile__body { position: absolute; inset: auto 0 0 0; z-index: 2; padding: 1.4rem; display: flex; flex-direction: column; gap: .3rem; }
.mz-tile--photo .mz-tile__kicker { color: var(--mz-primary); }
.mz-tile__body b { font-size: 1.45rem; line-height: 1.15; letter-spacing: -.03em; }
.mz-tile__body small { color: rgba(255,255,255,.72); font-size: .88rem; }
.mz-tile__go { display: inline-flex; align-items: center; gap: .4rem; align-self: flex-start; margin-top: .6rem; padding: .5rem .9rem; border-radius: 8px; background: var(--mz-primary); font-weight: 600; font-size: .88rem; }
.mz-tile__title { display: block; font-size: 1.05rem; margin-bottom: .6rem; letter-spacing: -.02em; }
.mz-tile--tld ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.mz-tile--tld li { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: .4rem; padding: .35rem 0; border-bottom: 1px dashed var(--mz-border-color); font-size: .86rem; }
.mz-tile--tld li:last-child { border: 0; }
.mz-tile--tld li span { font-weight: 700; }
.mz-tile--tld del { color: var(--mz-faint-color); font-size: .75rem; }
.mz-tile--tld li b { font-family: var(--mz-font-mono); color: var(--mz-primary-text); }
.mz-tile--deal { background: var(--mz-ink); color: #fff; border-color: transparent; }
.mz-tile--deal .mz-tile__kicker { color: var(--mz-primary); }
.mz-tile__big { display: block; font-size: 2.6rem; font-weight: 800; letter-spacing: -.05em; line-height: 1; color: var(--mz-primary); }
.mz-tile--deal small { display: block; color: var(--mz-on-ink-muted); font-size: .8rem; line-height: 1.35; margin: .25rem 0 .8rem; }
.mz-countdown { display: flex; gap: .3rem; }
.mz-countdown span { flex: 1; display: grid; justify-items: center; padding: .35rem 0; border-radius: 7px; background: rgba(255,255,255,.07); }
.mz-countdown b { font-family: var(--mz-font-mono); font-size: 1rem; line-height: 1.1; }
.mz-countdown i { font-style: normal; font-size: .62rem; color: var(--mz-on-ink-muted); text-transform: uppercase; letter-spacing: .06em; }

/* 7. Domain band
   -------------------------------------------------------------------------- */
.mz-domain { padding: 1rem 0 0; }
.mz-domain__box {
    position: relative; overflow: hidden; background: var(--mz-ink); color: var(--mz-on-ink);
    border-radius: var(--mz-radius-xl); padding: clamp(1.75rem, 1rem + 3vw, 3.25rem);
}
.mz-domain__box::before {
    content: ""; position: absolute; inset-inline-end: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%;
    border: 70px solid rgba(242,84,27,.12);
}
[data-bs-theme="dark"] .mz-domain__box, [data-bs-theme="dark"] .mz-tile--deal { background: #121417; box-shadow: inset 0 0 0 1px var(--mz-border-color); }
[data-bs-theme="dark"] .mz-why { border-block: 1px solid var(--mz-border-color); }
.mz-domain__head { position: relative; display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.mz-domain__title { color: #fff; font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.35rem); font-weight: 800; letter-spacing: -.035em; margin: 0; max-width: 20ch; line-height: 1.1; }
.mz-domain__note { margin: 0; font-size: .88rem; color: var(--mz-on-ink-muted); display: flex; align-items: center; gap: .4rem; }
.mz-domain__note .bi { color: var(--mz-primary); }
.mz-domain__note b { color: #fff; }
.mz-dsearch {
    position: relative; display: flex; align-items: center; gap: .5rem; padding: 8px; padding-inline-start: 3.25rem;
    background: #fff; border-radius: 16px; box-shadow: 0 0 0 6px rgba(255,255,255,.06);
}
.mz-dsearch__icon { position: absolute; inset-inline-start: 1.2rem; font-size: 1.35rem; color: #8b9098; }
.mz-dsearch__input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 1.15rem; font-weight: 500; color: #121417; height: 52px; }
.mz-dsearch__input::placeholder { color: #9aa0a8; }
.mz-dsearch__modes { display: flex; gap: 2px; padding: 3px; background: #f0ede8; border-radius: 10px; }
.mz-dsearch__modes input { position: absolute; opacity: 0; pointer-events: none; }
.mz-dsearch__modes span { display: block; padding: .5rem .85rem; border-radius: 7px; font-size: .85rem; font-weight: 600; color: #5e636b; cursor: pointer; transition: background-color .2s, color .2s; }
.mz-dsearch__modes input:checked + span { background: #fff; color: #121417; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.mz-dsearch__modes input:focus-visible + span { outline: 2px solid var(--mz-primary); }
.mz-dsearch__btn { height: 52px; padding: 0 1.6rem; font-size: 1rem; border-radius: 11px; }
.mz-dpicks { position: relative; display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; margin-top: 1.1rem; }
.mz-dpicks__label { font-size: .85rem; color: var(--mz-on-ink-muted); margin-inline-end: .25rem; }
.mz-pick input { position: absolute; opacity: 0; pointer-events: none; }
.mz-pick span {
    display: inline-flex; align-items: center; gap: .35rem; height: 32px; padding: 0 .75rem; border-radius: 8px;
    border: 1px solid rgba(255,255,255,.16); font-size: .85rem; font-weight: 600; color: var(--mz-on-ink-muted); cursor: pointer; transition: all .2s;
}
.mz-pick span::before { content: "+"; font-weight: 400; opacity: .6; }
.mz-pick input:checked + span { background: rgba(242,84,27,.14); border-color: var(--mz-primary); color: #fff; }
.mz-pick input:checked + span::before { content: "✓"; color: var(--mz-primary); opacity: 1; }
.mz-pick input:focus-visible + span { outline: 2px solid var(--mz-primary); outline-offset: 2px; }
.mz-dpicks__more { margin-inline-start: auto; font-size: .88rem; font-weight: 600; color: #fff; display: inline-flex; align-items: center; gap: .35rem; }
.mz-dpicks__more:hover { color: var(--mz-primary); }
.mz-dresult { position: relative; margin-top: 1.25rem; display: grid; gap: .5rem; }
.mz-dres {
    display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 1rem;
    padding: .75rem .9rem .75rem 1.1rem; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08);
    animation: mz-fade .35s var(--mz-ease) both;
}
.mz-dres__name { font-weight: 600; font-size: 1.02rem; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mz-dres__name small { display: block; font-size: .78rem; font-weight: 500; color: var(--mz-on-ink-muted); }
.mz-dres__name small.is-free { color: #7fb8ff; }
.mz-dres__name small.is-taken { color: #ff9b7a; }
.mz-dres__price { font-family: var(--mz-font-mono); font-weight: 700; }
.mz-dres.is-taken { opacity: .6; }

.mz-tldrail-wrap { margin-top: 1rem; }
.mz-tldrail {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: .75rem;
    overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .75rem; scrollbar-width: thin;
    scrollbar-color: var(--mz-border-strong) transparent;
}
.mz-tldrail:focus-visible { outline-offset: 4px; }
.mz-tld {
    position: relative; scroll-snap-align: start; display: flex; flex-direction: column; gap: .15rem;
    padding: 1.1rem 1.2rem; border-radius: var(--mz-radius-card); background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color);
    transition: border-color .2s, transform .25s var(--mz-ease);
}
.mz-tld:hover { border-color: var(--mz-primary); transform: translateY(-2px); }
.mz-tld__ext { font-size: 1.55rem; font-weight: 800; letter-spacing: -.04em; line-height: 1.1; color: var(--mz-heading-color); }
.mz-tld__price { display: flex; align-items: baseline; gap: .35rem; margin-top: .35rem; }
.mz-tld__price del { font-size: .8rem; color: var(--mz-faint-color); }
.mz-tld__price b { font-family: var(--mz-font-mono); font-size: 1.1rem; color: var(--mz-heading-color); }
.mz-tld__price small { font-size: .78rem; color: var(--mz-muted-color); }
.mz-tld__renew { font-size: .76rem; color: var(--mz-faint-color); }
.mz-tld .mz-tag { position: absolute; top: .9rem; inset-inline-end: .9rem; }
.mz-tldrail-wrap .mz-rail-nav { justify-content: flex-end; margin-top: .25rem; }

/* 8. Service index
   -------------------------------------------------------------------------- */
.mz-index-wrap { position: relative; display: grid; grid-template-columns: 5fr 7fr; gap: 3rem; align-items: start; }
.mz-index-intro { position: sticky; top: calc(var(--mz-header-h) + 32px); }
.mz-index-proof { display: flex; gap: 2.5rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--mz-border-color); }
.mz-index-proof b { display: block; font-size: 1.9rem; line-height: 1; }
.mz-index-proof span { font-size: .85rem; color: var(--mz-muted-color); }
.mz-index { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--mz-border-strong); }
.mz-index li { border-bottom: 1px solid var(--mz-border-color); }
.mz-index__row {
    position: relative; display: grid; grid-template-columns: 48px 1fr auto 44px; align-items: center; gap: 1.25rem;
    padding: 1.35rem .5rem; transition: padding .3s var(--mz-ease), background-color .3s;
}
.mz-index__row::before { content: ""; position: absolute; inset: 0; background: var(--mz-surface-bg); transform: scaleY(0); transform-origin: bottom; transition: transform .35s var(--mz-ease); z-index: -1; border-radius: 10px; }
.mz-index__row:hover::before, .mz-index__row:focus-visible::before { transform: scaleY(1); }
.mz-index__row:hover { padding-inline: 1.1rem; }
.mz-index__num { font-family: var(--mz-font-mono); font-size: .85rem; color: var(--mz-faint-color); }
.mz-index__name b { display: block; font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.2; color: var(--mz-heading-color); }
.mz-index__name small { display: block; color: var(--mz-muted-color); font-size: .9rem; margin-top: .15rem; }
.mz-index__price { text-align: end; }
.mz-index__price small { display: block; font-size: .72rem; color: var(--mz-faint-color); text-transform: uppercase; letter-spacing: .08em; }
.mz-index__price b { font-family: var(--mz-font-mono); font-size: 1.05rem; color: var(--mz-heading-color); }
.mz-index__go { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--mz-border-strong); color: var(--mz-heading-color); transition: background-color .25s, color .25s, border-color .25s, transform .3s var(--mz-ease); }
.mz-index__row:hover .mz-index__go { background: var(--mz-primary); border-color: var(--mz-primary); color: #fff; transform: rotate(45deg); }
.mz-index__peek {
    position: fixed; z-index: 20; left: 0; top: 0; width: 240px; height: 170px; border-radius: 14px; overflow: hidden;
    pointer-events: none; opacity: 0; transform: translate(-50%, -50%) scale(.85) rotate(-4deg);
    transition: opacity .25s, transform .35s var(--mz-ease); box-shadow: var(--mz-shadow-lg);
}
.mz-index__peek.is-on { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-4deg); }
.mz-index__peek img { width: 100%; height: 100%; object-fit: cover; }

/* 9. Plans — shared views (components/mz-plans.tpl)
   -------------------------------------------------------------------------- */
.mz-plans__head { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 2.25rem; }
.mz-plans__head .mz-title { margin-bottom: .25rem; }
.mz-plans__head .mz-lead { margin: 0; }
.mz-plans__controls { display: flex; gap: .6rem; flex-wrap: wrap; }
.mz-seg button.active, .mz-seg button.is-active, .mz-bill button.active { background: var(--mz-ink); color: #fff; }
[data-bs-theme="dark"] .mz-seg button.active, [data-bs-theme="dark"] .mz-bill button.active { background: var(--mz-on-ink); color: #111; }
.mz-bill, .mz-viewswitch { display: inline-flex; padding: 4px; gap: 2px; border-radius: 10px; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); }
.mz-bill .billing-option { border: 0; }
.mz-viewswitch button { width: 40px; padding: 0; justify-content: center; font-size: 1.05rem; }
.mz-viewswitch button.is-active { background: var(--mz-primary-subtle); color: var(--mz-primary-text); }

.mz-pv { display: none; }
.mz-pviews[data-view="grid"] .mz-pv-grid,
.mz-pviews[data-view="list"] .mz-pv-list,
.mz-pviews[data-view="table"] .mz-pv-table,
.mz-pviews[data-view="compare"] .mz-pv-compare { display: block; }
.mz-pviews[data-view="grid"] .mz-pv-grid { display: grid; }

/* Price block (WISECP price contract nodes) */
.mz-price { display: flex; flex-direction: column; gap: .15rem; }
.mz-price__was { display: flex; align-items: center; gap: .4rem; min-height: 1.2em; }
.mz-price__was del { font-size: .85rem; color: var(--mz-faint-color); }
.mz-save { font-size: .7rem; font-weight: 700; padding: .12rem .45rem; border-radius: 5px; background: var(--mz-primary-subtle); color: var(--mz-primary-text); }
.mz-save .bi { display: none; }
.mz-price__now { display: flex; align-items: baseline; flex-wrap: wrap; gap: .2rem .35rem; }
.mz-price__now b { font-family: var(--mz-font-mono); font-size: 2.1rem; line-height: 1; letter-spacing: -.05em; font-weight: 700; color: var(--mz-heading-color); }
.mz-price__now small { color: var(--mz-muted-color); font-size: .85rem; }
.mz-price__once { font-style: normal; font-size: .7rem; font-weight: 700; padding: .12rem .45rem; border-radius: 5px; background: var(--mz-surface-2); color: var(--mz-body-color); }

/* Grid: one joined rack, not separate cards */
.mz-pv-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-lg); }
/* More than four plans: the rack becomes a horizontal rail instead of wrapping 5+1 */
.mz-pv-grid:has(> .mz-plan-cell:nth-child(5)) { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(250px, calc((100% - 1px) / 4)); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--mz-border-strong) transparent; }
.mz-pv-grid:has(> .mz-plan-cell:nth-child(5)) .mz-plan-cell { scroll-snap-align: start; }
.mz-pv-grid:has(> .mz-plan-cell:nth-child(5)) .mz-plan.is-featured { margin: 0; border-radius: 0; box-shadow: none; }
.mz-pv-grid:has(> .mz-plan-cell:nth-child(5)) .mz-plan__flag { top: .9rem; transform: none; }
.mz-pv-grid .mz-plan-cell { display: flex; border-inline-end: 1px solid var(--mz-border-color); min-width: 0; }
.mz-pv-grid .mz-plan-cell:last-child { border-inline-end: 0; }
.mz-plan { position: relative; flex: 1; display: flex; flex-direction: column; padding: 2rem 1.6rem 1.75rem; min-width: 0; }
.mz-plan.is-featured { background: var(--mz-ink); color: var(--mz-on-ink); margin: -12px 0; border-radius: var(--mz-radius-lg); padding-top: calc(2rem + 12px); padding-bottom: calc(1.75rem + 12px); box-shadow: var(--mz-shadow-lg); z-index: 1; }
[data-bs-theme="dark"] .mz-plan.is-featured { background: var(--mz-surface-3); outline: 1px solid var(--mz-primary); }
.mz-plan.is-soldout { opacity: .6; }
.mz-plan__flag { position: absolute; top: 0; inset-inline-start: 1.6rem; transform: translateY(-50%); background: var(--mz-primary); color: #fff; font-size: .72rem; font-weight: 700; padding: .3rem .65rem; border-radius: 6px; letter-spacing: .02em; z-index: 2; white-space: nowrap; }
.mz-plan__head h3 { font-size: 1.2rem; margin-bottom: .15rem; color: inherit; }
.mz-plan__head p { font-size: .88rem; color: var(--mz-muted-color); margin: 0; }
.mz-plan .mz-price { margin: 1.3rem 0 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px dashed var(--mz-border-strong); }
.mz-plan.is-featured .mz-plan__head p, .mz-plan.is-featured .mz-price__now small { color: var(--mz-on-ink-muted); }
.mz-plan.is-featured .mz-price { border-color: rgba(255,255,255,.15); }
.mz-plan.is-featured .mz-price__now b { color: var(--mz-primary); }
.mz-plan__feats { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .55rem; font-size: .9rem; }
.mz-plan__feats li { position: relative; padding-inline-start: 1.4rem; }
.mz-plan__feats li::before { content: ""; position: absolute; inset-inline-start: 2px; top: .38em; width: 12px; height: 7px; border-inline-start: 2px solid var(--mz-primary); border-bottom: 2px solid var(--mz-primary); transform: rotate(-45deg); }
.mz-plan__more { align-self: flex-start; border: 0; background: none; padding: 0; font-size: .82rem; font-weight: 600; color: var(--mz-primary-text); margin-bottom: 1rem; }
.mz-plan.is-featured .mz-plan__more { color: var(--mz-primary); }
.mz-plan__more .bi { transition: transform .2s; }
.mz-plan__more.is-open .bi { transform: rotate(180deg); }
.mz-plan__foot { margin-top: auto; }
.mz-plan__foot .mz-btn { width: 100%; }
.mz-plan.is-featured .mz-btn--outline { background: transparent; --_fg: #fff; --_bd: rgba(255,255,255,.3); }

/* List: horizontal rows */
.mz-pv-list .mz-plan-cell + .mz-plan-cell { margin-top: .6rem; }
.mz-prow { position: relative; display: grid; grid-template-columns: minmax(150px, 190px) 1fr 170px 150px; align-items: center; gap: 1.25rem; padding: 1.1rem 1.4rem; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-card); transition: border-color .2s; }
.mz-prow:hover { border-color: var(--mz-border-strong); }
.mz-prow.is-featured { border-color: var(--mz-primary); box-shadow: inset 4px 0 0 var(--mz-primary); }
[dir="rtl"] .mz-prow.is-featured { box-shadow: inset -4px 0 0 var(--mz-primary); }
.mz-prow .mz-plan__flag { inset-inline-start: 1.4rem; font-size: .65rem; padding: .15rem .5rem; }
.mz-prow__id h3 { font-size: 1.05rem; margin: 0; }
.mz-prow__id p { font-size: .8rem; color: var(--mz-muted-color); margin: .15rem 0 0; }
.mz-prow__specs { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: .4rem 1rem; }
.mz-prow__specs b { display: block; font-family: var(--mz-font-mono); font-size: .92rem; color: var(--mz-heading-color); }
.mz-prow__specs small { display: block; font-size: .72rem; color: var(--mz-muted-color); }
.mz-prow__specs .is-text { display: flex; gap: .35rem; font-size: .82rem; align-items: baseline; }
.mz-prow__specs .is-text .bi { color: var(--mz-primary-text); }
.mz-prow .mz-price { align-items: flex-end; text-align: end; }
.mz-prow .mz-price__now { justify-content: flex-end; }
.mz-prow .mz-price__now b { font-size: 1.5rem; }
.mz-prow__cta .mz-btn { width: 100%; }

/* Compare: feature matrix */
.mz-compare { overflow-x: auto; overflow-y: hidden; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-lg); }
.mz-compare table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .9rem; }
.mz-compare th, .mz-compare td { padding: .9rem 1.2rem; border-bottom: 1px solid var(--mz-border-color); text-align: center; }
.mz-compare tbody th { text-align: start; font-weight: 500; color: var(--mz-muted-color); }
.mz-compare thead th { vertical-align: bottom; padding-top: 1.4rem; }
.mz-compare__head b { display: block; font-size: 1.05rem; margin-bottom: .4rem; color: var(--mz-heading-color); }
.mz-compare__head .mz-price { align-items: center; }
.mz-compare__head .mz-price__now { justify-content: center; }
.mz-compare__head .mz-price__now b { font-size: 1.35rem; }
.mz-compare .is-featured { background: var(--mz-primary-subtle); }
.mz-compare tr:last-child > * { border-bottom: 0; }
.mz-compare .bi-dash { color: var(--mz-faint-color); }

/* Table view uses the .mz-table styles below */
.mz-pv-table .mz-price { align-items: flex-end; }
.mz-pv-table .mz-price__now { justify-content: flex-end; }
.mz-pv-table .mz-price__now b { font-size: 1.1rem; letter-spacing: -.03em; }
.mz-pv-table .mz-price__was { min-height: 0; }
.mz-plans__foot { margin: 1.75rem 0 0; font-size: .88rem; color: var(--mz-muted-color); display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.mz-plans__foot a { font-weight: 600; margin-inline-start: auto; }

/* 10. Servers table + configurator
   -------------------------------------------------------------------------- */
.mz-srv__head { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.75rem; }
.mz-srv__head .mz-title { margin: 0; }
.mz-srv__filters { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; }
.mz-select { position: relative; display: inline-flex; align-items: center; height: 42px; border: 1px solid var(--mz-border-color); border-radius: 10px; background: var(--mz-surface-bg); padding-inline-start: .8rem; }
.mz-select .bi { color: var(--mz-faint-color); }
.mz-select select { appearance: none; border: 0; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%238b9098' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .8rem center; padding: 0 2.2rem 0 .5rem; height: 100%; font-weight: 600; font-size: .88rem; color: var(--mz-heading-color); outline: 0; cursor: pointer; }
[dir="rtl"] .mz-select select { background-position: left .8rem center; padding: 0 .5rem 0 2.2rem; }
.mz-select:focus-within { border-color: var(--mz-primary); }
.mz-select option { background: var(--mz-surface-bg); color: var(--mz-heading-color); }

.mz-table-wrap { background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-lg); overflow: hidden; }
.mz-table { width: 100%; border-collapse: collapse; }
.mz-table thead th { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--mz-faint-color); font-weight: 700; padding: 1rem 1.1rem; background: var(--mz-surface-2); border-bottom: 1px solid var(--mz-border-color); white-space: nowrap; }
.mz-table tbody th, .mz-table td { padding: 1rem 1.1rem; border-bottom: 1px solid var(--mz-border-color); vertical-align: middle; font-size: .92rem; }
.mz-table tbody tr:last-child > * { border-bottom: 0; }
.mz-table tbody tr { transition: background-color .2s; }
.mz-table tbody tr:hover { background: color-mix(in srgb, var(--mz-surface-2) 60%, transparent); }
.mz-table tbody tr.is-hot { background: var(--mz-primary-subtle); }
.mz-table td b { display: block; font-family: var(--mz-font-mono); font-weight: 700; font-size: .95rem; }
.mz-table td small { display: block; font-size: .78rem; color: var(--mz-muted-color); }
.mz-srv__name b { display: block; font-size: 1rem; font-weight: 700; }
.mz-stock { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; font-weight: 600; }
.mz-stock::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.mz-stock.is-ok { color: var(--mz-success); }
.mz-stock.is-low { color: var(--mz-warning-color); }
.mz-srv__price { font-size: 1.15rem !important; color: var(--mz-heading-color); }
.mz-table td:last-child { text-align: end; width: 1%; }
.mz-srv__empty { padding: 2rem; text-align: center; color: var(--mz-muted-color); margin: 0; }
.mz-srv__empty a { font-weight: 600; color: var(--mz-primary-text); }
.mz-table tr.is-hidden { display: none; }

.mz-config {
    margin-top: 1rem; display: grid; grid-template-columns: 1fr 1.3fr 240px; gap: 2rem; align-items: center;
    padding: 1.75rem; border-radius: var(--mz-radius-lg); background: var(--mz-surface-2); border: 1px dashed var(--mz-border-strong);
}
.mz-config__intro h3 { font-size: 1.3rem; font-weight: 800; letter-spacing: -.03em; margin-bottom: .35rem; }
.mz-config__intro p { color: var(--mz-muted-color); font-size: .92rem; margin: 0; }
.mz-config__intro .mz-kicker { margin-bottom: .5rem; }
.mz-config__sliders { display: grid; gap: 1.1rem; }
.mz-range label { display: flex; justify-content: space-between; font-weight: 600; font-size: .88rem; margin-bottom: .35rem; }
.mz-range output { font-family: var(--mz-font-mono); color: var(--mz-primary-text); }
.mz-range input[type="range"] {
    --p: 10%;
    -webkit-appearance: none; appearance: none; width: 100%; height: 6px; border-radius: 6px; outline: 0;
    background: linear-gradient(to right, var(--mz-primary) var(--p), var(--mz-surface-3) var(--p));
}
[dir="rtl"] .mz-range input[type="range"] { background: linear-gradient(to left, var(--mz-primary) var(--p), var(--mz-surface-3) var(--p)); }
.mz-range input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: var(--mz-surface-bg); border: 5px solid var(--mz-primary); cursor: grab; box-shadow: var(--mz-shadow-sm); }
.mz-range input[type="range"]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--mz-surface-bg); border: 5px solid var(--mz-primary); cursor: grab; }
.mz-range input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px var(--bs-focus-ring-color); }
.mz-config__total { display: grid; gap: .5rem; padding: 1.25rem; border-radius: var(--mz-radius-card); background: var(--mz-ink); color: #fff; }
.mz-config__total small { color: var(--mz-on-ink-muted); font-size: .8rem; }
.mz-config__total b { font-size: 2.1rem; line-height: 1; margin-bottom: .5rem; }
[data-bs-theme="dark"] .mz-config__total { background: var(--mz-surface-3); }

/* 11. Why / stats / uptime
   -------------------------------------------------------------------------- */
.mz-why { background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-why__top { max-width: 900px; }
.mz-why__statement { color: #fff; font-size: clamp(1.9rem, 1.2rem + 2.6vw, 3.4rem); line-height: 1.08; letter-spacing: -.04em; font-weight: 800; }
.mz-why__statement span { color: var(--mz-primary); }
.mz-stats { display: grid; grid-template-columns: repeat(4, 1fr); margin: 3.5rem 0; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); }
.mz-stat { padding: 1.75rem 1.5rem; border-inline-end: 1px solid rgba(255,255,255,.12); }
.mz-stat:first-child { padding-inline-start: 0; }
.mz-stat:last-child { border: 0; }
.mz-stat dt { font-weight: 500; font-size: .85rem; color: var(--mz-on-ink-muted); margin-bottom: .6rem; }
.mz-stat dd { margin: 0; display: flex; align-items: baseline; gap: .15rem; }
.mz-stat dd b { font-size: clamp(2.1rem, 1.6rem + 1.6vw, 3.1rem); line-height: 1; color: #fff; }
.mz-stat dd span { font-size: 1.3rem; font-weight: 700; color: var(--mz-primary); }

.mz-why__grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 3rem; align-items: start; }
.mz-uptime { padding: 1.5rem; border-radius: var(--mz-radius-lg); background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); }
.mz-uptime__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.mz-uptime__head b { color: #fff; }
.mz-status--plain { font-size: .82rem; color: var(--mz-on-ink-muted); }
.mz-uptime .mz-status__dot { background: #5aa9ff; }
.mz-uptime .mz-status__dot::after { border-color: #5aa9ff; }
.mz-uptime__row { display: grid; grid-template-columns: 100px 1fr 64px; align-items: center; gap: .9rem; padding: .65rem 0; border-top: 1px solid rgba(255,255,255,.07); }
.mz-uptime__name { font-size: .85rem; font-weight: 600; color: #fff; }
.mz-uptime__row > b { text-align: end; font-size: .82rem; color: var(--mz-on-ink-muted); }
.mz-uptime__bars { display: flex; gap: 2px; height: 26px; }
.mz-uptime__bars i { flex: 1; border-radius: 2px; background: #3d7fe0; opacity: .9; transition: transform .2s; }
.mz-uptime__bars i.is-warn { background: var(--mz-amber); }
.mz-uptime__bars i.is-down { background: var(--mz-primary); }
.mz-uptime__bars i:hover { transform: scaleY(1.2); }
.mz-uptime__foot { display: flex; justify-content: space-between; align-items: center; margin-top: .75rem; padding-top: .75rem; border-top: 1px solid rgba(255,255,255,.07); font-size: .75rem; color: var(--mz-on-ink-muted); }
.mz-uptime__foot a { color: #fff; font-weight: 600; }
.mz-feats { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.mz-feats li { display: flex; gap: 1rem; padding: 1.3rem 0; border-top: 1px solid rgba(255,255,255,.12); }
.mz-feats__n { font-family: var(--mz-font-mono); font-size: .8rem; color: var(--mz-primary); padding-top: .2rem; }
.mz-feats h3 { font-size: 1.05rem; color: #fff; margin-bottom: .3rem; }
.mz-feats p { color: var(--mz-on-ink-muted); font-size: .9rem; margin: 0; }

/* 12. Datacenter / ping
   -------------------------------------------------------------------------- */
.mz-dc { display: grid; grid-template-columns: 1fr 1.05fr; gap: 3.5rem; align-items: center; }
.mz-dc__photo { position: relative; border-radius: var(--mz-radius-xl); overflow: hidden; aspect-ratio: 4 / 4.2; }
.mz-dc__photo img { width: 100%; height: 100%; object-fit: cover; }
.mz-dc__badge { position: absolute; inset-inline-start: 1.25rem; bottom: 1.25rem; padding: .9rem 1.1rem; border-radius: 12px; background: var(--mz-surface-bg); display: grid; box-shadow: var(--mz-shadow); }
.mz-dc__badge b { font-size: 1.3rem; letter-spacing: -.03em; }
.mz-dc__badge span { font-size: .8rem; color: var(--mz-muted-color); }
.mz-ping { margin-top: 2rem; display: grid; gap: .25rem; }
.mz-ping__row { display: grid; grid-template-columns: 34px 140px 1fr 70px; align-items: center; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid var(--mz-border-color); }
.mz-ping__city { font-weight: 600; line-height: 1.2; }
.mz-ping__city small { display: block; font-weight: 500; font-size: .76rem; color: var(--mz-faint-color); }
.mz-ping__bar { height: 8px; border-radius: 8px; background: var(--mz-surface-2); overflow: hidden; }
.mz-ping__bar i { display: block; height: 100%; width: 0; border-radius: 8px; background: var(--mz-primary); transition: width 1s var(--mz-ease); }
.mz-ping__row > b { text-align: end; font-size: .92rem; }
.mz-ping__row.is-best .mz-ping__city { color: var(--mz-primary-text); }
.mz-ping .mz-btn { justify-self: start; margin-top: 1.25rem; }

/* 13. Migration steps + marquee
   -------------------------------------------------------------------------- */
.mz-move { display: grid; grid-template-columns: 1fr 2fr; gap: 3rem; align-items: start; }
.mz-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); counter-reset: s; position: relative; }
.mz-steps::before { content: ""; position: absolute; top: 22px; inset-inline: 22px 22px; border-top: 2px dashed var(--mz-border-strong); }
.mz-steps li { position: relative; padding-inline-end: 1.5rem; }
.mz-steps__n { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--mz-ink); color: #fff; font-family: var(--mz-font-mono); font-weight: 700; margin-bottom: 1.25rem; box-shadow: 0 0 0 8px var(--mz-surface-2); }
.mz-steps li:last-child .mz-steps__n { background: var(--mz-primary); }
[data-bs-theme="dark"] .mz-steps__n { background: var(--mz-surface-3); }
.mz-steps h3 { font-size: 1.15rem; margin-bottom: .35rem; }
.mz-steps p { font-size: .92rem; color: var(--mz-muted-color); margin-bottom: .75rem; }
.mz-steps__time { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 600; padding: .25rem .6rem; border-radius: 6px; background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); }
.mz-marquee { margin-top: 4.5rem; overflow: hidden; border-block: 1px solid var(--mz-border-strong); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.mz-marquee__track { display: flex; width: max-content; animation: mz-marquee 40s linear infinite; }
.mz-marquee:hover .mz-marquee__track { animation-play-state: paused; }
.mz-marquee__track span { display: inline-flex; align-items: center; gap: .5rem; padding: 1.4rem 2.2rem; font-size: 1.35rem; font-weight: 700; letter-spacing: -.03em; color: var(--mz-muted-color); white-space: nowrap; border-inline-end: 1px solid var(--mz-border-color); }
.mz-marquee__track span .bi { color: var(--mz-primary); }
@keyframes mz-marquee { to { transform: translateX(-50%); } }
[dir="rtl"] .mz-marquee__track { animation-name: mz-marquee-rtl; }
@keyframes mz-marquee-rtl { to { transform: translateX(50%); } }

/* 14. Reviews
   -------------------------------------------------------------------------- */
.mz-reviews { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 3rem; align-items: start; }
.mz-scores { display: grid; gap: .8rem; margin: 1.5rem 0 2rem; }
.mz-score { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 1rem; align-items: center; padding: 1rem 1.2rem; border-radius: var(--mz-radius-card); background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); }
.mz-score b { grid-row: span 2; font-size: 2.1rem; line-height: 1; }
.mz-stars { color: var(--mz-amber); font-size: .88rem; letter-spacing: 2px; }
.mz-score small { color: var(--mz-muted-color); font-size: .8rem; }
.mz-reviews__rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, 400px); gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 1rem; scrollbar-width: thin; scrollbar-color: var(--mz-border-strong) transparent; }
.mz-review { scroll-snap-align: start; margin: 0; display: flex; flex-direction: column; padding: 1.75rem; border-radius: var(--mz-radius-lg); background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); }
.mz-review:nth-child(2n) { background: var(--mz-surface-2); }
.mz-review__service { align-self: flex-start; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--mz-primary-text); margin-bottom: 1rem; }
.mz-review blockquote { font-size: 1.08rem; line-height: 1.55; font-weight: 500; letter-spacing: -.01em; margin: 0 0 1.5rem; flex: 1; }
.mz-review figcaption { display: flex; align-items: center; gap: .8rem; padding-top: 1.1rem; border-top: 1px solid var(--mz-border-color); }
.mz-review figcaption img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.mz-review figcaption b { display: block; font-size: .95rem; }
.mz-review figcaption small { color: var(--mz-muted-color); font-size: .82rem; }

/* 15. Blog
   -------------------------------------------------------------------------- */
.mz-blog { display: grid; grid-template-columns: 1.35fr 1fr; gap: 2.5rem; }
.mz-post__img { display: block; overflow: hidden; border-radius: var(--mz-radius-lg); background: var(--mz-surface-3); }
.mz-post__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--mz-ease); }
.mz-post:hover .mz-post__img img { transform: scale(1.04); }
.mz-post__meta { font-size: .8rem; color: var(--mz-muted-color); margin-bottom: .4rem; }
.mz-post__meta span { font-weight: 700; color: var(--mz-primary-text); }
.mz-post h3 a:hover { color: var(--mz-primary-text); }
.mz-post--lead .mz-post__img { aspect-ratio: 16 / 9.5; }
.mz-post--lead .mz-post__body { padding-top: 1.4rem; }
.mz-post--lead h3 { font-size: clamp(1.35rem, 1.1rem + .9vw, 1.85rem); line-height: 1.2; letter-spacing: -.03em; font-weight: 800; }
.mz-post--lead p:not(.mz-post__meta) { color: var(--mz-muted-color); max-width: 60ch; }
.mz-blog__list { display: flex; flex-direction: column; }
.mz-blog__list .mz-post { display: grid; grid-template-columns: 150px 1fr; gap: 1.25rem; align-items: center; padding: 1.25rem 0; border-bottom: 1px solid var(--mz-border-strong); }
.mz-blog__list .mz-post:first-child { padding-top: 0; }
.mz-blog__list .mz-post__img { aspect-ratio: 4 / 3; border-radius: var(--mz-radius-card); }
.mz-blog__list h3 { font-size: 1.1rem; line-height: 1.3; margin: 0; }

/* 16. FAQ + support
   -------------------------------------------------------------------------- */
.mz-faqwrap { display: grid; grid-template-columns: 1.4fr 1fr; gap: 3rem; align-items: start; }
.mz-accordion {
    --bs-accordion-bg: transparent; --bs-accordion-border-color: var(--mz-border-color); --bs-accordion-border-radius: 0; --bs-accordion-inner-border-radius: 0;
    --bs-accordion-btn-padding-x: 0; --bs-accordion-btn-padding-y: 1.3rem; --bs-accordion-body-padding-x: 0; --bs-accordion-body-padding-y: 0;
    --bs-accordion-active-bg: transparent; --bs-accordion-active-color: var(--mz-heading-color); --bs-accordion-btn-focus-box-shadow: none; --bs-accordion-color: var(--mz-heading-color);
    --bs-accordion-btn-color: var(--mz-heading-color);
    border-top: 1px solid var(--mz-border-strong); margin-top: 1.5rem;
}
.mz-accordion .accordion-item { border-inline: 0; border-top: 0; }
.mz-accordion .accordion-button { font-weight: 600; font-size: 1.08rem; gap: 1rem; }
.mz-accordion .accordion-button:focus-visible { outline: 2px solid var(--mz-primary); outline-offset: 2px; }
.mz-accordion .accordion-button::after {
    background-image: none; content: "+"; display: grid; place-items: center; width: 32px; height: 32px; flex: none;
    border-radius: 50%; border: 1px solid var(--mz-border-strong); font-size: 1.2rem; font-weight: 400; transform: none; transition: transform .3s var(--mz-ease), background-color .2s;
}
.mz-accordion .accordion-button:not(.collapsed)::after { transform: rotate(45deg); background-color: var(--mz-primary); border-color: var(--mz-primary); color: #fff; }
.mz-accordion .accordion-body { color: var(--mz-muted-color); padding-bottom: 1.4rem; max-width: 64ch; }
.mz-support { position: sticky; top: calc(var(--mz-header-h) + 32px); border-radius: var(--mz-radius-xl); overflow: hidden; background: var(--mz-ink); color: #fff; }
.mz-support__photo { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; object-position: center 12%; display: block; }
.mz-support__body { padding: 1.6rem; }
.mz-support__live { display: flex; align-items: center; gap: .55rem; font-size: .82rem; color: var(--mz-on-ink-muted); margin-bottom: .6rem; }
.mz-support__live .mz-status__dot { background: #5aa9ff; }
.mz-support__live .mz-status__dot::after { border-color: #5aa9ff; }
.mz-support h3 { color: #fff; font-size: 1.4rem; line-height: 1.2; margin-bottom: 1.1rem; }
.mz-support__line { display: flex; align-items: center; gap: .9rem; padding: .85rem 0; border-top: 1px solid rgba(255,255,255,.1); color: #fff; }
.mz-support__line:hover { color: var(--mz-primary); }
.mz-support__line .bi { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(255,255,255,.07); font-size: 1.05rem; color: var(--mz-primary); }
.mz-support__line small { display: block; font-size: .76rem; color: var(--mz-on-ink-muted); }
.mz-support__line b { font-size: .98rem; }

/* 17. CTA
   -------------------------------------------------------------------------- */
.mz-cta-wrap { padding-bottom: clamp(3rem, 2rem + 3vw, 5rem); }
.mz-cta {
    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(--mz-radius-xl); background: var(--mz-primary); color: #1a0c05;
}
.mz-cta::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, rgba(0,0,0,.04) 0 2px, transparent 2px 16px); }
.mz-cta__text, .mz-cta__actions { position: relative; }
.mz-cta h2 { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.8rem); line-height: 1.08; font-weight: 800; letter-spacing: -.04em; color: #1a0c05; margin-bottom: .6rem; max-width: 20ch; }
.mz-cta h2 span { color: #fff; }
.mz-cta p { margin: 0; color: rgba(26,12,5,.75); max-width: 50ch; }
.mz-cta__actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.mz-cta .mz-btn--primary { --_bg: var(--mz-ink); --_fg: #fff; }
.mz-cta .mz-btn--primary:hover { --_bg: #000; box-shadow: none; }
.mz-cta .mz-btn--light { --_bg: transparent; --_bd: rgba(26,12,5,.4); --_fg: #1a0c05; }
.mz-cta .mz-btn--light:hover { --_bg: rgba(255,255,255,.25); }
[data-bs-theme="dark"] .mz-cta .mz-btn--primary { --_bg: #111; }

/* 18. Footer
   -------------------------------------------------------------------------- */
.mz-footer { background: var(--mz-ink); color: var(--mz-on-ink-muted); padding: 0 0 5.5rem; font-size: .92rem; }
.mz-contactbar { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid rgba(255,255,255,.1); }
.mz-contactbar a { display: flex; align-items: center; gap: .9rem; padding: 1.75rem 1.25rem; border-inline-end: 1px solid rgba(255,255,255,.1); color: #fff; transition: background-color .2s; }
.mz-contactbar a:first-child { padding-inline-start: 0; }
.mz-contactbar a:last-child { border: 0; }
.mz-contactbar a:hover b { color: var(--mz-primary); }
.mz-contactbar .bi { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: rgba(255,255,255,.06); font-size: 1.15rem; color: var(--mz-primary); flex: none; }
.mz-contactbar small { display: block; font-size: .76rem; color: var(--mz-on-ink-muted); }
.mz-contactbar b { font-size: .98rem; font-weight: 600; transition: color .2s; word-break: break-word; }
.mz-footer__main { display: grid; grid-template-columns: minmax(260px, 1.1fr) 2.6fr; gap: 3rem; padding: 3.5rem 0 3rem; }
.mz-footer .mz-footer__cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 2rem 1.5rem; align-content: start; }
.mz-footer__brand p { margin: 1.1rem 0 1.5rem; max-width: 40ch; line-height: 1.6; }
.mz-footer__col h2 { font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; color: #fff; margin-bottom: 1.1rem; font-weight: 700; }
.mz-footer__col a { display: block; padding: .3rem 0; color: var(--mz-on-ink-muted); transition: color .2s; }
.mz-footer__col a:hover { color: #fff; }
.mz-social { display: flex; gap: .4rem; margin-top: 1.25rem; }
.mz-social a { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; border: 1px solid rgba(255,255,255,.12); color: #fff; transition: background-color .2s, border-color .2s; }
.mz-social a:hover { background: var(--mz-primary); border-color: var(--mz-primary); }
.mz-footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); font-size: .82rem; }
.mz-footer__bottom p { margin: 0; }
.mz-pay { display: flex; gap: .4rem; list-style: none; padding: 0; margin: 0; flex-wrap: wrap; }
.mz-pay li { padding: .3rem .6rem; border-radius: 6px; border: 1px solid rgba(255,255,255,.14); font-size: .7rem; font-weight: 700; letter-spacing: .06em; color: #fff; }
.mz-legal { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.mz-legal a:hover { color: #fff; }

/* 19. Floating UI
   -------------------------------------------------------------------------- */
.mz-fab {
    position: fixed; z-index: 1020; bottom: 1.25rem; inset-inline-start: 1.25rem; display: inline-flex; align-items: center; gap: .55rem;
    height: 50px; padding: 0 1.1rem 0 .9rem; border-radius: 50px; background: var(--mz-ink); color: #fff; font-weight: 600; font-size: .9rem;
    box-shadow: var(--mz-shadow-lg); transition: transform .25s var(--mz-ease);
}
.mz-fab:hover { color: #fff; transform: translateY(-2px); }
.mz-fab .bi { font-size: 1.35rem; color: #5fa8ff; }
[data-bs-theme="dark"] .mz-fab { background: var(--mz-surface-3); border: 1px solid var(--mz-border-strong); }
.mz-totop {
    position: fixed; z-index: 1020; bottom: 1.25rem; inset-inline-end: 1.25rem; width: 48px; height: 48px; border-radius: 50%;
    border: 1px solid var(--mz-border-strong); background: var(--mz-surface-bg); color: var(--mz-heading-color); font-size: 1.15rem; box-shadow: var(--mz-shadow);
    opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .3s, transform .3s var(--mz-ease), visibility 0s linear .3s;
}
.scroll-top.show { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.mz-totop:hover { background: var(--mz-primary); color: #fff; border-color: var(--mz-primary); }
.mz-cookie {
    position: fixed; z-index: 1025; bottom: 1.25rem; left: 50%; transform: translateX(-50%); width: min(620px, calc(100% - 2rem));
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem .75rem .75rem 1.1rem;
    background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: 14px; box-shadow: var(--mz-shadow-lg); font-size: .88rem;
    animation: mz-fade .4s var(--mz-ease) both;
}
.mz-cookie[hidden] { display: none; }
.mz-cookie p { margin: 0; display: flex; align-items: center; gap: .5rem; }
.mz-cookie p .bi { color: var(--mz-primary); font-size: 1.1rem; }
.mz-cookie p a { text-decoration: underline; text-underline-offset: 3px; }
.mz-cookie div { display: flex; gap: .3rem; flex: none; }

/* 21. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1399.98px) {
    .mz-hero__grid { grid-template-columns: minmax(0, 1fr) 340px; }
    .mz-photo--arch { width: 280px; height: 360px; }
    .mz-photo--tall { width: 290px; height: 380px; }
    .mz-photo--round { width: 290px; height: 290px; }
    .mz-mega__grid { grid-template-columns: 1fr 1fr .85fr 1fr; }
    .mz-navbar__inner { gap: 1rem; }
    .mz-menu__link { padding: 0 .6rem; font-size: .92rem; }
}

@media (max-width: 1199.98px) {
    :root { --mz-header-h: 68px; }
    .mz-hero__grid { grid-template-columns: 1fr; }
    .mz-hero__side { grid-template-columns: 1.2fr 1fr; grid-template-rows: none; }
    .mz-hero__pair { grid-template-columns: 1fr 1fr; }
    .mz-tile--photo { min-height: 230px; }
    .mz-index-wrap { grid-template-columns: 1fr; gap: 2rem; }
    .mz-index-intro { position: static; }
    .mz-prow { grid-template-columns: minmax(140px, 170px) 1fr 150px; }
    .mz-prow__cta { grid-column: 1 / -1; }
    .mz-config { grid-template-columns: 1fr 1fr; }
    .mz-config__intro { grid-column: 1 / -1; }
    .mz-why__grid { grid-template-columns: 1fr; }
    .mz-reviews { grid-template-columns: 1fr; gap: 1.5rem; }
    .mz-scores { grid-template-columns: 1fr 1fr; margin-bottom: 1.25rem; }
    .mz-move { grid-template-columns: 1fr; gap: 2rem; }
    .mz-footer__main { grid-template-columns: 1fr; }
    .mz-footer__brand { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0 3rem; align-items: start; }
    .mz-footer__brand .mz-brand { grid-column: 1 / -1; }
    .mz-footer__brand p { margin-top: 1rem; }
    .mz-footer__brand .mz-newsletter { margin-top: 1rem; }
    .mz-footer__brand .mz-social { grid-column: 2; margin-top: .75rem; }
}

@media (max-width: 991.98px) {
    .mz-slide { grid-template-columns: minmax(0, 1fr); padding: 2.25rem 2rem 0; min-height: 0; }
    [dir="rtl"] .mz-slide { padding: 2.25rem 2rem 0; }
    .mz-slide__copy { max-width: none; }
    .mz-slide__visual { justify-content: center; min-height: 280px; }
    .mz-photo--arch { width: 240px; height: 280px; margin-bottom: 0; }
    .mz-photo--tall { width: 250px; height: 280px; margin-bottom: 0; transform: rotate(2deg) translateY(20px); }
    .mz-photo--round { width: 250px; height: 250px; margin-bottom: 1.5rem; }
    .mz-float--a { inset-inline-start: 4%; top: 10%; }
    .mz-float--term { inset-inline-start: 2%; top: 8%; }
    .mz-stage__tab { padding: .9rem .75rem; font-size: .82rem; }
    .mz-hero__side { grid-template-columns: 1fr; }
    .mz-pv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mz-pv-grid .mz-plan-cell { border-bottom: 1px solid var(--mz-border-color); }
    .mz-pv-grid .mz-plan-cell:nth-child(2n) { border-inline-end: 0; }
    .mz-plan.is-featured { margin: 0; }
    .mz-stats { grid-template-columns: repeat(2, 1fr); }
    .mz-stat:nth-child(2) { border-inline-end: 0; }
    .mz-stat:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.12); }
    .mz-stat:nth-child(3) { padding-inline-start: 0; }
    .mz-dc { grid-template-columns: 1fr; gap: 2rem; }
    .mz-dc__photo { aspect-ratio: 16 / 9; }
    .mz-blog { grid-template-columns: 1fr; }
    .mz-faqwrap { grid-template-columns: 1fr; }
    .mz-support { position: static; display: grid; grid-template-columns: 1fr 1.2fr; }
    .mz-support__photo { height: 100%; aspect-ratio: auto; }
    .mz-contactbar { grid-template-columns: repeat(2, 1fr); }
    .mz-contactbar a:nth-child(2) { border-inline-end: 0; }
    .mz-contactbar a:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
    .mz-contactbar a:nth-child(3) { padding-inline-start: 0; }

    /* Sunucu tablosu: satırlar blok görünüme geçer */
    .mz-table-wrap { background: transparent; border: 0; border-radius: 0; overflow: visible; }
    .mz-table thead { display: none; }
    .mz-table, .mz-table tbody { display: block; }
    .mz-table tbody { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
    .mz-table tbody tr { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem 1rem; padding: 1.1rem; border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-card); background: var(--mz-surface-bg); }
    .mz-table tbody tr.is-hidden { display: none; }
    .mz-table tbody tr.is-hot { border-color: var(--mz-primary); background: var(--mz-surface-bg); box-shadow: inset 0 3px 0 var(--mz-primary); }
    .mz-table tbody th, .mz-table td { padding: 0; border: 0 !important; }
    .mz-table tbody th { grid-column: 1 / -1; padding-bottom: .6rem; border-bottom: 1px solid var(--mz-border-color) !important; }
    .mz-table td[data-label]::before { content: attr(data-label); display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mz-faint-color); font-weight: 600; margin-bottom: .1rem; }
    .mz-table td[data-label="Aylık"] { text-align: start !important; }
    .mz-table td:last-child { width: auto; grid-column: 1 / -1; }
    .mz-table td:last-child .mz-btn { width: 100%; }
    .mz-srv__empty { background: var(--mz-surface-bg); border-radius: var(--mz-radius-card); border: 1px solid var(--mz-border-color); }
}

@media (max-width: 767.98px) {
    .mz-topbar__inner { min-height: 40px; }
    .mz-navbar__inner { gap: .75rem; }
    .mz-brand__word { font-size: 1.3rem; }
    .mz-brand img { width: 34px; height: 34px; }
    .mz-hero { padding-top: 1rem; }
    .mz-stage { border-radius: var(--mz-radius-lg); }
    .mz-slide { padding: 1.75rem 1.25rem 0; }
    [dir="rtl"] .mz-slide { padding: 1.75rem 1.25rem 0; }
    .mz-ticks { grid-template-columns: 1fr 1fr; gap: .4rem .75rem; font-size: .85rem; }
    .mz-slide__visual { min-height: 240px; }
    .mz-photo--arch { width: 200px; height: 240px; }
    .mz-photo--tall { width: 210px; height: 240px; }
    .mz-photo--round { width: 210px; height: 210px; }
    .mz-float { padding: .6rem .75rem; }
    .mz-float--a { min-width: 140px; }
    .mz-float--a b { font-size: 1.1rem; }
    .mz-float--term { min-width: 190px; }
    .mz-float--b { inset-inline-end: 0; }
    .mz-stage__tabs { overflow-x: auto; scrollbar-width: none; }
    .mz-stage__tabs::-webkit-scrollbar { display: none; }
    .mz-stage__tab { flex: 0 0 auto; }
    .mz-stage__pause { width: 48px; margin-inline-start: auto; }
    .mz-hero__pair { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .mz-tile { padding: 1rem; }
    .mz-tile__big { font-size: 2.1rem; }

    .mz-dsearch { flex-wrap: wrap; padding: 8px; padding-inline-start: 2.75rem; }
    .mz-dsearch__icon { top: 22px; inset-inline-start: 1rem; font-size: 1.15rem; }
    .mz-dsearch__input { flex-basis: 100%; height: 44px; font-size: 1.05rem; }
    .mz-dsearch__modes { margin-inline-start: -2.25rem; }
    .mz-dsearch__btn { flex: 1; height: 46px; }
    .mz-dpicks__more { margin-inline-start: 0; width: 100%; }
    .mz-dres { grid-template-columns: 1fr auto; }
    .mz-dres .mz-btn { grid-column: 1 / -1; }

    .mz-index__row { grid-template-columns: 32px 1fr 36px; gap: .75rem; padding-block: 1.1rem; }
    .mz-index__row:hover { padding-inline: .5rem; }
    .mz-index__price { grid-column: 2; grid-row: 2; text-align: start; display: flex; gap: .4rem; align-items: baseline; }
    .mz-index__go { grid-column: 3; grid-row: 1 / span 2; width: 36px; height: 36px; }
    .mz-index__peek { display: none; }

    .mz-plans__controls { width: 100%; }
    .mz-plans__controls .mz-seg { width: 100%; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
    .mz-plans__controls .mz-seg::-webkit-scrollbar { display: none; }
    .mz-plans__controls .mz-seg button { flex: 1 0 auto; justify-content: center; white-space: nowrap; }
    .mz-plans__controls .mz-bill { overflow-x: auto; max-width: 100%; scrollbar-width: none; }
    .mz-pv-grid { grid-template-columns: 1fr; }
    .mz-pv-grid .mz-plan-cell { border-inline-end: 0 !important; }
    .mz-prow { grid-template-columns: 1fr auto; gap: 1rem; }
    .mz-prow__specs { grid-column: 1 / -1; order: 3; }
    .mz-prow .mz-price { order: 2; }
    .mz-prow__cta { order: 4; }

    .mz-srv__filters { width: 100%; }
    .mz-srv__filters .mz-seg { width: 100%; }
    .mz-srv__filters .mz-seg button { flex: 1; justify-content: center; padding: 0 .4rem; }
    .mz-srv__filters .mz-select { flex: 1; }
    .mz-srv__filters .mz-select select { width: 100%; }
    .mz-table tbody { grid-template-columns: 1fr; }
    .mz-config { grid-template-columns: 1fr; padding: 1.25rem; gap: 1.5rem; }

    .mz-stat { padding: 1.25rem 1rem; }
    .mz-uptime__row { grid-template-columns: 74px 1fr 52px; gap: .6rem; }
    .mz-uptime__name { font-size: .78rem; }
    .mz-stat dd b { font-size: 2rem; }
    .mz-uptime__bars i:nth-child(-n+15) { display: none; }
    .mz-feats { grid-template-columns: 1fr; }

    .mz-ping__row { grid-template-columns: 30px 1fr 64px; gap: .75rem; }
    .mz-ping__bar { grid-column: 2 / -1; grid-row: 2; }

    .mz-steps { grid-template-columns: 1fr; gap: 1.75rem; }
    .mz-steps::before { top: 22px; bottom: 22px; inset-inline-start: 22px; inset-inline-end: auto; border-top: 0; border-inline-start: 2px dashed var(--mz-border-strong); }
    .mz-steps li { display: grid; grid-template-columns: 46px 1fr; column-gap: 1.1rem; padding: 0; }
    .mz-steps__n { grid-row: span 3; margin: 0; }
    .mz-steps__time { justify-self: start; }
    .mz-marquee { margin-top: 3rem; }
    .mz-marquee__track span { padding: 1rem 1.4rem; font-size: 1.1rem; }

    .mz-scores { grid-template-columns: 1fr; }
    .mz-reviews__rail { grid-auto-columns: 85%; }
    .mz-blog__list .mz-post { grid-template-columns: 110px 1fr; gap: 1rem; }
    .mz-blog__list h3 { font-size: 1rem; }
    .mz-support { grid-template-columns: 1fr; }
    .mz-support__photo { aspect-ratio: 16 / 9; height: auto; }

    .mz-cta__actions { width: 100%; }
    .mz-cta__actions .mz-btn { flex: 1; }

    .mz-contactbar { grid-template-columns: 1fr; }
    .mz-contactbar a { padding: 1.1rem 0 !important; border-inline-end: 0 !important; border-bottom: 1px solid rgba(255,255,255,.1); }
    .mz-contactbar a:last-child { border-bottom: 0; }
    .mz-footer__main { grid-template-columns: 1fr; gap: 2rem; }
    .mz-footer .mz-footer__cols { grid-template-columns: 1fr 1fr; }
    .mz-footer__brand { display: block; }
    .mz-footer__bottom { flex-direction: column; align-items: flex-start; }

    .mz-fab span { display: none; }
    .mz-fab { width: 50px; padding: 0; justify-content: center; }
    .mz-cookie { flex-direction: column; align-items: stretch; bottom: .75rem; }
    .mz-cookie div { justify-content: flex-end; }
}

@media (max-width: 575.98px) {
    .mz-ticks li:nth-child(n+3) { display: none; }
    .mz-slide__lead { font-size: .98rem; }
    .mz-slide__visual { min-height: 220px; }
}

@media (max-width: 419.98px) {
    .mz-nav-actions .mz-icon-btn:not(.mz-burger) { display: none; }
    .mz-hero__pair { grid-template-columns: 1fr; }
    .mz-slide__title { font-size: 1.85rem; }
    .mz-ticks { grid-template-columns: 1fr; }
    .mz-dsearch__modes span { padding: .5rem .6rem; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    .mz-marquee__track { animation: none; }
}

/* 22. Header variants (Theme settings → Header)
   -------------------------------------------------------------------------- */
.mz-header-dark .mz-navbar { background: color-mix(in srgb, var(--mz-ink) 94%, transparent); border-bottom-color: rgba(255,255,255,.08); }
.mz-header-dark .mz-navbar .mz-menu__link,
.mz-header-dark .mz-navbar .mz-brand__word { color: #fff; }
.mz-header-dark .mz-menu__item:hover > .mz-menu__link,
.mz-header-dark .mz-menu__item.is-open > .mz-menu__link { background: rgba(255,255,255,.08); color: #fff; }
.mz-header-dark .mz-navbar .mz-icon-btn { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: #fff; }
.mz-header-dark .mz-navbar .mz-btn--ghost { --_fg: #fff; --_bd: rgba(255,255,255,.25); }
.mz-header-dark .mz-brand .site-logo-light { display: none; }
.mz-header-dark .mz-brand .site-logo-dark { display: block; }

/* 23. WISECP adaptations — hero variants, blocks, shell extras
   -------------------------------------------------------------------------- */
/* Menu extras */
.mz-menu__link > .bi:not(.mz-caret) { font-size: 1rem; opacity: .8; }
.mz-menu__link .mz-tag, .mz-drop__row b .mz-tag, .mz-mega__link b .mz-tag, .mz-drop--simple .mz-tag, .mz-mtabs__tab b .mz-tag { margin-inline-start: .35rem; }
.mz-tag .bi { margin-inline-end: .2rem; font-size: .9em; }
.mz-mega__link .mz-ico { width: 34px; height: 34px; font-size: 1rem; }
.mz-mega__grid.is-nopromo { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.mz-mega__label a { color: inherit; }
.mz-mega__label a:hover { color: var(--mz-primary-text); }
.mz-mega__html { background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-top: 0; border-radius: 0 0 var(--mz-radius-lg) var(--mz-radius-lg); box-shadow: var(--mz-shadow-lg); padding: 1.75rem; }
.mz-drop__overview { display: flex; align-items: center; justify-content: space-between; padding: .55rem .7rem .7rem; margin-bottom: 4px; border-bottom: 1px dashed var(--mz-border-color); font-size: .82rem; font-weight: 700; color: var(--mz-primary-text); }
.mz-drop--simple a > span { flex: 1; }
.mz-drop__ico { font-size: 1rem !important; opacity: .65 !important; color: var(--mz-primary-text); }
.mz-mtabs__pane.is-single { grid-template-columns: 1fr; }
.mz-auth-menu .dropdown-item { display: flex; gap: .7rem; align-items: flex-start; }
.mz-auth-menu .dropdown-item .bi { font-size: 1.1rem; color: var(--mz-primary-text); margin-top: .1rem; }
.mz-auth-menu b { display: block; font-weight: 600; }
.mz-auth-menu small { display: block; color: var(--mz-muted-color); white-space: normal; }
.mz-auth-menu { min-width: 250px; }
.mz-icon-btn.is-empty .mz-count { display: none; }
.mz-nav-actions .account-avatar { width: 42px; height: 42px; border-radius: var(--mz-radius-sm); border: 1px solid var(--mz-border-color); background: var(--mz-surface-bg); color: var(--mz-heading-color); font-weight: 700; font-size: .85rem; }
.mz-topbar__social { gap: .7rem; }
.mz-topbar__social a { color: var(--mz-on-ink-muted); }
.mz-topbar__social a:hover { color: #fff; }

/* Drawer extras */
.mz-drawer__account { display: flex; align-items: center; gap: .8rem; padding: .8rem; border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-card); color: var(--mz-heading-color); }
.mz-drawer__account b { display: block; }
.mz-drawer__account small { color: var(--mz-muted-color); }
.mz-drawer__account .bi { margin-inline-start: auto; }
.mz-drawer__avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--mz-primary-subtle); color: var(--mz-primary-text); font-weight: 700; overflow: hidden; }
.mz-drawer__avatar img { width: 100%; height: 100%; object-fit: cover; }
.mz-drawer__nav .wui-collapse { border-bottom: 1px solid var(--mz-border-color); }
.mz-drawer__sub { border-bottom: 0; }
.mz-drawer__group { display: block; margin-top: .6rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--mz-faint-color); }
.mz-drawer__overview { font-weight: 700 !important; color: var(--mz-primary-text) !important; }
.mz-drawer__line { display: flex; align-items: center; gap: .6rem; font-weight: 600; color: var(--mz-heading-color); }
.mz-drawer__foot { gap: .75rem; }
.mz-drawer__foot .dropup .btn { justify-content: space-between; }
.mz-drawer__toggle .drawer-caret { transition: transform .25s; }
.mz-drawer__toggle[aria-expanded="true"] .drawer-caret { transform: rotate(180deg); }
.mz-mode-switch { display: inline-flex; padding: 3px; gap: 2px; border-radius: 9px; border: 1px solid var(--mz-border-color); background: var(--mz-surface-bg); }
.mz-mode-switch button { width: 34px; height: 30px; border: 0; border-radius: 6px; background: transparent; color: var(--mz-muted-color); }
.mz-mode-switch button.active { background: var(--mz-ink); color: #fff; }

/* Hero: shared + variants */
.mz-hero__grid.is-single { grid-template-columns: minmax(0, 1fr); }
.mz-stage--wide .mz-slide { min-height: 520px; }
.mz-slide--accent { background: var(--mz-accent); color: #fff; }
.mz-slide--accent .mz-slide__eyebrow, .mz-slide--accent .mz-slide__lead { color: rgba(255,255,255,.8); }
.mz-slide--accent .mz-slide__title em { color: #fff; }
.mz-slide--accent .mz-slide__eyebrow .mz-mono { color: #fff; }
.mz-slide--photo { background: var(--mz-ink); color: #fff; grid-template-columns: minmax(0, 1fr); padding-inline-end: 3rem; }
.mz-slide__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.mz-slide__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(10,10,12,.82) 0%, rgba(10,10,12,.55) 45%, rgba(10,10,12,.1) 100%); }
[dir="rtl"] .mz-slide__scrim { background: linear-gradient(270deg, rgba(10,10,12,.82) 0%, rgba(10,10,12,.55) 45%, rgba(10,10,12,.1) 100%); }
.mz-slide--photo .mz-slide__eyebrow, .mz-slide--photo .mz-slide__lead { color: rgba(255,255,255,.78); }
.mz-slide--photo .mz-slide__eyebrow .mz-mono { color: var(--mz-primary); }
.mz-slide--photo .mz-btn--text { --_fg: #fff; text-decoration-color: rgba(255,255,255,.35); }
.mz-slide.no-media { grid-template-columns: minmax(0, 1fr); padding-inline-end: 3rem; }
.mz-photo video { width: 100%; height: 100%; object-fit: cover; display: block; }
.mz-photo--square { width: 340px; height: 340px; border-radius: var(--mz-radius-lg); align-self: center; }
.mz-stage__arrow { position: absolute; z-index: 4; bottom: 1.25rem; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--mz-border-color); background: var(--mz-surface-bg); color: var(--mz-heading-color); display: grid; place-items: center; }
.mz-stage__arrow.is-prev { inset-inline-end: 4.5rem; }
.mz-stage__arrow.is-next { inset-inline-end: 1.25rem; }
.mz-tile--search { background: var(--mz-ink); color: #fff; }
.mz-tile--search .mz-tile__body { position: relative; inset: auto; padding: 0; height: 100%; justify-content: flex-end; }
.mz-tile__search { display: flex; gap: .4rem; margin-top: .9rem; padding: 5px; border-radius: 12px; background: #fff; }
.mz-tile__search input { flex: 1; min-width: 0; border: 0; outline: 0; padding: 0 .7rem; font-weight: 500; color: #121417; background: transparent; }
.mz-tile__search .mz-btn { height: 40px; width: 44px; padding: 0; }
.mz-hero__pair.is-single { grid-template-columns: 1fr; }
.mz-tile--tld li a { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: .4rem; color: var(--mz-heading-color); width: 100%; }
.mz-tile--tld li { display: block; }
.mz-tile--tld li a:hover span { color: var(--mz-primary-text); }
.mz-tile--tld li a i { width: 0; }
a.mz-tile--deal { color: #fff; }
a.mz-tile--deal:hover { color: #fff; }

/* Split hero */
.mz-hero--split { padding: 2rem 0 1rem; }
.mz-split { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 3rem; padding: 3rem; border-radius: var(--mz-radius-xl); background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); position: relative; overflow: hidden; }
.mz-split::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--mz-border-color) 1px, transparent 1px), linear-gradient(90deg, var(--mz-border-color) 1px, transparent 1px); background-size: 44px 44px; opacity: .45; -webkit-mask-image: radial-gradient(ellipse at 80% 50%, #000, transparent 65%); mask-image: radial-gradient(ellipse at 80% 50%, #000, transparent 65%); }
.mz-split__copy, .mz-split__visual { position: relative; z-index: 1; }
.mz-split__visual { display: flex; justify-content: center; }
.mz-split .mz-dsearch { max-width: 560px; box-shadow: 0 0 0 1px var(--mz-border-color), var(--mz-shadow); }
.mz-split__proof { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .9rem; font-weight: 500; }
.mz-split__proof li { display: flex; align-items: center; gap: .45rem; }
.mz-split__proof .bi { color: var(--mz-primary-text); }
.mz-split__art { width: min(420px, 100%); background: #0b0c0e; color: #d7dae0; border-radius: var(--mz-radius-lg); padding: 1.2rem 1.4rem 1.5rem; display: grid; gap: .45rem; box-shadow: var(--mz-shadow-lg); transform: rotate(-2deg); }
.mz-split__art code { color: inherit; font-family: var(--mz-font-mono); font-size: .88rem; }
.mz-split__art code span { color: var(--mz-primary); }
.mz-split__art code b { color: #fff; font-weight: 500; }

/* Minimal hero */
.mz-hero--minimal { padding: 1.5rem 0 .5rem; }
.mz-minimal { position: relative; overflow: hidden; text-align: center; padding: clamp(3rem, 2rem + 5vw, 6rem) clamp(1.25rem, 1rem + 4vw, 5rem); border-radius: var(--mz-radius-xl); background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-minimal.has-image::before { content: ""; position: absolute; inset: 0; background: var(--mz-hero-img) center / cover no-repeat; opacity: .28; }
.mz-minimal::after { content: ""; position: absolute; inset-inline-end: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%; border: 70px solid rgba(var(--mz-primary-rgb), .14); }
.mz-minimal > * { position: relative; z-index: 1; }
.mz-minimal .mz-kicker { justify-content: center; }
.mz-minimal h1 { color: #fff; font-size: clamp(2rem, 1.3rem + 3vw, 3.6rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; max-width: 18ch; margin: 0 auto 1rem; }
.mz-minimal__lead { color: var(--mz-on-ink-muted); font-size: 1.1rem; max-width: 56ch; margin: 0 auto 2rem; }
.mz-minimal .mz-dsearch { max-width: 760px; margin: 0 auto; text-align: start; }
.mz-minimal .mz-dpicks { justify-content: center; }
.mz-minimal .mz-dpicks__more { margin-inline-start: 0; }

/* Domain search: button chips + card style */
button.mz-pick { border: 0; background: none; padding: 0; }
.mz-dsearch:not(.is-dark) { box-shadow: 0 0 0 1px var(--mz-border-color); }
.mz-dpicks .mz-pick span::before { content: none; }
.mz-domain__perks { position: relative; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; list-style: none; padding: 0; margin: 1.25rem 0 0; font-size: .88rem; color: var(--mz-on-ink-muted); }
.mz-domain__perks .bi { color: var(--mz-primary); margin-inline-end: .35rem; }
.mz-domain--card .mz-domain__box { background: var(--mz-surface-bg); color: var(--mz-body-color); border: 1px solid var(--mz-border-color); }
.mz-domain--card .mz-domain__box::before { border-color: rgba(var(--mz-primary-rgb), .08); }
.mz-domain--card .mz-domain__title { color: var(--mz-heading-color); }
.mz-domain--card .mz-domain__note, .mz-domain--card .mz-domain__perks { color: var(--mz-muted-color); }
.mz-domain--card .mz-dpicks__label { color: var(--mz-muted-color); }
.mz-domain--card .mz-pick span { border-color: var(--mz-border-strong); color: var(--mz-body-color); }
.mz-domain--card .mz-dpicks__more { color: var(--mz-heading-color); }
.mz-domain--card .mz-dsearch { background: var(--mz-body-bg); }
.mz-domain--card .mz-dsearch__input { color: var(--mz-heading-color); }
.mz-tld__logo { height: 28px; width: auto; max-width: 110px; object-fit: contain; object-position: left; margin-bottom: .2rem; }
[dir="rtl"] .mz-tld__logo { object-position: right; }
.mz-tld--more { justify-content: space-between; background: transparent; border-style: dashed; }
.mz-tld--more .mz-link-arrow { align-self: flex-start; font-size: .85rem; }
.mz-tldrail-wrap .mz-rail-nav .mz-link-arrow { display: none; }

/* Features (light numbered list) */
.mz-featwrap { display: grid; grid-template-columns: 5fr 7fr; gap: 3rem; align-items: start; }
.mz-featwrap__intro { position: sticky; top: calc(var(--mz-header-h) + 32px); }
.mz-feats--light li { border-top-color: var(--mz-border-color); }
.mz-feats--light h3, .mz-feats--light h3 a { color: var(--mz-heading-color); }
.mz-feats--light p { color: var(--mz-muted-color); }
.mz-feats--light .mz-feats__n { color: var(--mz-primary-text); font-size: 1.1rem; min-width: 26px; }
.mz-feats--light .mz-feats__n .bi { font-size: 1.2rem; }

/* Statistics band */
.mz-statband { position: relative; overflow: hidden; padding: 1rem 0; }
.mz-statband--dark { background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-statband__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .18; }
.mz-statband .mz-stats { position: relative; margin: 0; border: 0; }
.mz-statband .mz-stat dt .bi { color: var(--mz-primary); margin-inline-end: .25rem; }
.mz-statband--light .mz-stats { border-block: 1px solid var(--mz-border-color); }
.mz-statband--light .mz-stat { border-inline-end-color: var(--mz-border-color); }
.mz-statband--light .mz-stat dt { color: var(--mz-muted-color); }
.mz-statband--light .mz-stat dd b { color: var(--mz-heading-color); }

/* About */
.mz-about .mz-dc__photo { aspect-ratio: 4 / 3.4; }
.mz-about__text { max-width: 60ch; }
.mz-about:not(:has(.mz-dc__photo)) { grid-template-columns: 1fr; }

/* Software cards */
.mz-swgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.mz-sw { background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-lg); overflow: hidden; display: flex; flex-direction: column; transition: border-color .2s, transform .3s var(--mz-ease); }
.mz-sw:hover { border-color: var(--mz-border-strong); transform: translateY(-3px); }
.mz-sw__img { position: relative; display: block; aspect-ratio: 16 / 9; background: var(--mz-surface-2); overflow: hidden; }
.mz-sw__img img { width: 100%; height: 100%; object-fit: cover; }
.mz-sw__img .mz-tag { position: absolute; top: .75rem; inset-inline-start: .75rem; }
.mz-sw__body { padding: 1.1rem 1.2rem 1.25rem; display: flex; flex-direction: column; gap: .25rem; flex: 1; }
.mz-sw__body h3 { font-size: 1.05rem; margin: 0; }
.mz-sw__body h3 a { color: var(--mz-heading-color); text-decoration: none; }
.mz-sw__price { margin: auto 0 0; padding-top: .6rem; }
.mz-sw__price b { font-family: var(--mz-font-mono); font-size: 1.15rem; color: var(--mz-heading-color); }
.mz-sw__price small { color: var(--mz-muted-color); }

/* Reviews extras */
.mz-review__ava { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--mz-primary-subtle); color: var(--mz-primary-text); font-weight: 700; flex: none; }
.mz-score { text-decoration: none; color: inherit; }
.mz-scores { grid-template-columns: 1fr; }
.quote-stars { position: relative; display: inline-flex; }
.quote-stars-fill { position: absolute; inset: 0; overflow: hidden; white-space: nowrap; color: var(--mz-amber); }
.quote-stars-base { color: var(--mz-border-strong); white-space: nowrap; }
.mz-reviews--grid { grid-template-columns: 1fr; }
.mz-reviews--grid .mz-reviews__rail { grid-auto-flow: row; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); overflow: visible; }

/* Posts */
.mz-post__ph { display: grid; place-items: center; width: 100%; height: 100%; min-height: 110px; font-size: 1.8rem; color: var(--mz-faint-color); background: var(--mz-surface-3); }
.mz-post--lead .mz-post__ph { min-height: 260px; }
.mz-post h3 a { color: var(--mz-heading-color); text-decoration: none; }
.mz-post.is-news { grid-template-columns: 48px 1fr; }
.mz-post__badge { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--mz-primary-subtle); color: var(--mz-primary-text); font-size: 1.1rem; }
.mz-postgrid { display: grid; gap: 1.25rem; }
.mz-postgrid--grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.mz-postgrid--grid .mz-post__img { aspect-ratio: 16 / 10; display: block; margin-bottom: 1rem; }
.mz-postgrid--grid .mz-post h3 { font-size: 1.1rem; }
.mz-postgrid--grid .mz-post p:not(.mz-post__meta) { color: var(--mz-muted-color); font-size: .92rem; margin: .4rem 0 0; }
.mz-postgrid--list { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 0 2rem; }
.mz-postgrid--list .mz-post { padding: 1.1rem 0; border-bottom: 1px solid var(--mz-border-strong); }
.mz-postgrid--list .mz-post h3 { font-size: 1.05rem; margin: 0; }

/* Logos marquee */
.mz-logos { padding: 2.5rem 0; }
.mz-logos .mz-marquee { margin: 0; }
.mz-marquee__logo { display: inline-flex; align-items: center; padding: 1.2rem 2.4rem; border-inline-end: 1px solid var(--mz-border-color); }
.mz-marquee__logo img { height: 34px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .65; transition: filter .3s, opacity .3s; }
.mz-marquee__logo:hover img { filter: none; opacity: 1; }
[data-bs-theme="dark"] .mz-marquee__logo img { filter: grayscale(1) invert(1); }

/* Custom block */
.mz-custom__body > :last-child { margin-bottom: 0; }

/* Footer extras */
.mz-footer__brand p { color: var(--mz-on-ink-muted); }
.mz-footer__brand p a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.mz-footer__tools { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }
.mz-footer__tools .mz-social { margin: 0; }
.mz-footer .mz-mode-switch { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12); }
.mz-footer .mz-mode-switch button { color: var(--mz-on-ink-muted); }
.mz-footer .mz-mode-switch button.active { background: var(--mz-primary); color: #fff; }
.mz-footer .mz-chip-btn { color: var(--mz-on-ink); border: 1px solid rgba(255,255,255,.12); height: 36px; }
.mz-footer__col h2 { font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; color: #fff; margin-bottom: 1.1rem; font-weight: 700; }
.mz-footer__col a { display: block; padding: .3rem 0; color: var(--mz-on-ink-muted); transition: color .2s; }
.mz-footer__col a:hover { color: #fff; }
.mz-pay li { display: inline-flex; align-items: center; gap: .35rem; }
.mz-pay li .bi, .mz-pay li .fa-brands { font-size: .95rem; }
.mz-legal__status { display: inline-flex; align-items: center; gap: .45rem; }
.mz-legal__status .mz-status__dot { background: #5aa9ff; }
.mz-legal__status .mz-status__dot::after { border-color: #5aa9ff; }
.mz-powered { margin: 1rem 0 0; font-size: .78rem; text-align: center; opacity: .7; }
.mz-powered a { color: inherit; text-decoration: underline; }
.mz-newsletter { max-width: 400px; }
.mz-newsletter__label { font-size: .85rem; color: #fff; font-weight: 600; margin-bottom: .5rem; }
.mz-newsletter__row { display: flex; gap: .4rem; padding: 5px; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.mz-newsletter__row input { flex: 1; min-width: 0; border: 0; background: transparent; color: #fff; padding: 0 .75rem; outline: 0; }
.mz-newsletter__row input::placeholder { color: var(--mz-on-ink-muted); }
.mz-newsletter__row .mz-btn { height: 40px; padding: 0 .9rem; }
.mz-footer .mz-newsletter__btn-text { display: none; }
.mz-newsletter .form-check-label { font-size: .78rem; color: var(--mz-on-ink-muted); }
.mz-newsletter .form-check-label a { color: #fff; }
.mz-newsletter .form-check-input { background-color: transparent; border-color: rgba(255,255,255,.3); }
.mz-newsletter__ok { margin: .75rem 0 0; font-size: .9rem; font-weight: 600; color: #7fb8ff; display: flex; gap: .4rem; }
.mz-nl-band { padding: 3rem 0; }
.mz-nl-band__panel { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: center; padding: 2.5rem; border-radius: var(--mz-radius-xl); background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-nl-band__panel h2 { color: #fff; }

/* Scroll-top (default.js adds .show) + floating button positions */
.mz-totop.scroll-top { position: fixed; z-index: 1020; bottom: 1.25rem; inset-inline-end: 1.25rem; opacity: 0; visibility: hidden; }
.mz-totop.scroll-top.show { opacity: 1; visibility: visible; transform: none; }
.mz-fab--end { inset-inline-start: auto; inset-inline-end: 1.25rem; bottom: 5rem; }

/* Responsive for this section */
@media (max-width: 1199.98px) {
    .mz-featwrap { grid-template-columns: 1fr; gap: 2rem; }
    .mz-featwrap__intro { position: static; }
    .mz-split { grid-template-columns: 1fr; padding: 2rem; }
    }
@media (max-width: 767.98px) {
    .mz-split { padding: 1.5rem; gap: 2rem; }
    .mz-slide--photo, .mz-slide.no-media { padding-inline-end: 1.25rem; }
    .mz-stage--wide .mz-slide { min-height: 0; }
    .mz-nl-band__panel { grid-template-columns: 1fr; padding: 1.5rem; }
    .mz-stage__arrow { bottom: .75rem; }
}

@media (max-width: 419.98px) {
    .mz-topbar .mz-status span:not(.mz-status__dot) { display: none; }
    .mz-topbar__right { gap: .15rem; }
}

/* 24. Modernize Manager sections
   -------------------------------------------------------------------------- */
.mz-dc.is-single, .mz-why__grid.is-single, .mz-faqwrap.is-single { grid-template-columns: minmax(0, 1fr); }
.mz-steps { grid-template-columns: repeat(var(--mz-steps, 3), minmax(0, 1fr)); }
.mz-bannerwrap { padding-block: clamp(1.5rem, 1rem + 2vw, 3rem); }
.mz-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(--mz-radius-xl); }
.mz-banner__text, .mz-banner__actions { position: relative; z-index: 1; }
.mz-banner__text { max-width: 640px; }
.mz-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; }
.mz-banner p { margin: 0; opacity: .85; }
.mz-banner .mz-kicker { margin-bottom: .6rem; }
.mz-banner__actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.mz-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mz-banner--ink { background: var(--mz-ink); color: var(--mz-on-ink); }
.mz-banner--ink h2 span, .mz-banner--paper h2 span { color: var(--mz-primary); }
.mz-banner--ink .mz-kicker { color: var(--mz-primary); }
.mz-banner--flame { background: var(--mz-primary); color: #1a0c05; }
.mz-banner--flame h2 span { color: #fff; }
.mz-banner--flame .mz-kicker { color: #1a0c05; }
.mz-banner--flame .mz-btn--primary { --_bg: var(--mz-ink); --_fg: #fff; }
.mz-banner--flame .mz-btn--light { --_bg: transparent; --_bd: rgba(26,12,5,.4); --_fg: #1a0c05; }
.mz-banner--paper { background: var(--mz-surface-bg); border: 1px solid var(--mz-border-color); color: var(--mz-heading-color); }
.mz-banner--paper .mz-btn--light { --_bg: transparent; --_bd: var(--mz-border-strong); --_fg: var(--mz-heading-color); }
.mz-banner--accent { background: var(--mz-accent); color: #fff; }
.mz-banner--accent .mz-kicker { color: #fff; }
.mz-banner--accent .mz-btn--primary { --_bg: #fff; --_fg: var(--mz-accent); }
.mz-banner--photo { background: var(--mz-ink); color: #fff; min-height: 320px; }
.mz-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)); }
.mz-banner--photo .mz-kicker { color: var(--mz-primary); }
.mz-banner:not(.mz-banner--photo) .mz-banner__img { opacity: .15; }
@media (max-width: 767.98px) {
    .mz-steps { grid-template-columns: 1fr; }
    .mz-banner__actions { width: 100%; }
    .mz-banner__actions .mz-btn { flex: 1; }
}

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

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

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

/* 25. Client area — horizontal navigation (client_nav = topbar)
   -------------------------------------------------------------------------- */
.mz-topnav { position: sticky; top: 0; z-index: 1020; background: var(--mz-surface-bg); border-bottom: 1px solid var(--mz-border-color); }
.mz-topnav__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 56px; }
.mz-topnav .client-subnav-nav { display: flex; align-items: center; gap: .15rem; list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.mz-topnav .client-subnav-nav::-webkit-scrollbar { display: none; }
.mz-topnav .client-subnav-link { display: inline-flex; align-items: center; gap: .45rem; height: 40px; padding: 0 .85rem; border: 0; border-radius: var(--mz-radius-sm); background: none; font-weight: 600; font-size: .9rem; color: var(--mz-muted-color); white-space: nowrap; text-decoration: none; position: relative; }
.mz-topnav .client-subnav-link:hover { background: var(--mz-surface-2); color: var(--mz-heading-color); }
.mz-topnav .client-subnav-link.active { color: var(--mz-heading-color); }
.mz-topnav .client-subnav-link.active::after { content: ""; position: absolute; inset-inline: .85rem; bottom: -8px; height: 2px; border-radius: 2px; background: var(--mz-primary); }
.mz-topnav .client-subnav-link .bi { color: var(--mz-primary-text); }
.mz-topnav .client-subnav-badge { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--mz-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(--mz-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(--mz-heading-color); --bs-btn-bg: var(--mz-surface-2); --bs-btn-hover-bg: var(--mz-primary-subtle); --bs-btn-active-bg: var(--mz-primary-subtle); }
.btn-secondary { --bs-btn-bg: var(--mz-ink); --bs-btn-border-color: var(--mz-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(--mz-on-ink); --bs-btn-border-color: var(--mz-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(--mz-radius-card); --bs-card-inner-border-radius: calc(var(--mz-radius-card) - 1px); }
.card-header { background: transparent; border-bottom-color: var(--mz-border-color); font-weight: 700; }
.hover-lift { transition: transform .3s var(--mz-ease), border-color .2s, box-shadow .3s; }
.hover-lift:hover { transform: translateY(-3px); border-color: var(--mz-border-strong); box-shadow: var(--mz-shadow); }
.form-control, .form-select { border-color: var(--mz-border-color); background-color: var(--mz-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(--mz-primary); box-shadow: 0 0 0 .2rem rgba(var(--mz-primary-rgb), .15); }
.form-label { font-weight: 600; font-size: .86rem; color: var(--mz-heading-color); margin-bottom: .35rem; }
.form-check-input:checked { background-color: var(--mz-primary); border-color: var(--mz-primary); }
.form-check-input:focus { border-color: var(--mz-primary); box-shadow: 0 0 0 .2rem rgba(var(--mz-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(--mz-surface-2); border-color: var(--mz-border-color); }
.icon-disc { border-radius: var(--mz-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(--mz-border-color); --bs-nav-tabs-link-active-bg: transparent; --bs-nav-tabs-link-active-border-color: transparent transparent var(--mz-primary); --bs-nav-tabs-link-hover-border-color: transparent; --bs-nav-tabs-border-radius: 0; }
.nav-tabs .nav-link { font-weight: 600; color: var(--mz-muted-color); border-width: 0 0 2px; margin-bottom: -1px; }
.nav-tabs .nav-link.active { color: var(--mz-heading-color); }
.nav-pills { --bs-nav-pills-border-radius: var(--mz-radius-sm); --bs-nav-pills-link-active-bg: var(--mz-ink); --bs-nav-pills-link-active-color: #fff; }
[data-bs-theme="dark"] .nav-pills { --bs-nav-pills-link-active-bg: var(--mz-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(--mz-border-color); --bs-table-hover-bg: color-mix(in srgb, var(--mz-surface-2) 60%, transparent); }
.table > thead th { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mz-faint-color); font-weight: 700; }
.dropdown-menu { --bs-dropdown-border-color: var(--mz-border-color); --bs-dropdown-border-radius: var(--mz-radius-card); --bs-dropdown-link-active-bg: var(--mz-primary-subtle); --bs-dropdown-link-active-color: var(--mz-primary-text); box-shadow: var(--mz-shadow-lg); }
.modal-content { border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-lg); }
.alert { --bs-alert-border-radius: var(--mz-radius-card); }
.accordion { --bs-accordion-active-bg: var(--mz-primary-subtle); --bs-accordion-active-color: var(--mz-heading-color); --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem rgba(var(--mz-primary-rgb), .15); }
.pagination { --bs-pagination-active-bg: var(--mz-ink); --bs-pagination-active-border-color: var(--mz-ink); --bs-pagination-border-radius: var(--mz-radius-sm); }
.progress { --bs-progress-bar-bg: var(--mz-primary); }
.link-arrow { font-weight: 600; }

/* Page hero (all inner pages): ink band with the Modernize glow + grid */
.page-hero { background-color: var(--mz-ink); isolation: isolate; }
.page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(620px 300px at 85% 10%, rgba(var(--mz-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(--mz-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(--mz-primary); font-weight: 600; }
.page-hero .breadcrumb-item a { color: var(--mz-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 { --mz-chrome-bg: var(--mz-ink); }

/* 27. Sign-in pages (layouts/auth.tpl)
   -------------------------------------------------------------------------- */
.mz-auth-stage { background-color: var(--mz-ink); overflow: hidden; isolation: isolate; }
.mz-auth-stage--ink::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(520px 420px at 78% 72%, rgba(var(--mz-primary-rgb), .38), transparent 70%), radial-gradient(420px 320px at 10% 10%, rgba(var(--mz-accent-rgb), .18), transparent 70%); }
.mz-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%); }
.mz-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(--mz-primary-rgb), .9); opacity: .9; }
.mz-auth-stage__ring::after { content: ""; position: absolute; inset: 60px; border-radius: 50%; border: 1px dashed rgba(255,255,255,.25); }
.mz-auth-stage .auth-stage-inner { color: #fff; }
.mz-auth-stage .auth-stage-title { color: #fff; font-size: clamp(2rem, 1.3rem + 2vw, 3rem); letter-spacing: -.045em; line-height: 1.02; }
.mz-auth-stage .auth-stage-text, .mz-auth-stage .auth-stage-foot { color: var(--mz-on-ink-muted); }
.mz-auth-stage .auth-stage-foot a { color: #fff; }
.mz-auth-points { list-style: none; padding: 0; margin: 1.6rem 0 0; display: grid; gap: .7rem; }
.mz-auth-points li { display: flex; align-items: center; gap: .75rem; color: #fff; font-weight: 500; font-size: .95rem; }
.mz-auth-points i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: var(--mz-radius-sm); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); color: var(--mz-primary); font-size: 1rem; flex: none; }
.auth-form { background-color: var(--mz-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(--mz-radius-sm) !important; }

/* 28. Client dashboard (views/account/dashboard*.tpl)
   -------------------------------------------------------------------------- */
.dash { --dash-tile-radius: var(--mz-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(--mz-primary-rgb), .42), transparent 70%), var(--mz-ink);
    color: #fff; border: 1px solid rgba(255,255,255,.06); border-radius: var(--mz-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(--mz-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(--mz-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(--mz-primary); box-shadow: none; }
.dash-btn-light:hover { background: var(--mz-primary-hover, var(--mz-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(--mz-on-ink-muted); }
.dash-balance-value { font-family: var(--mz-font-mono); letter-spacing: -.04em; }
.dash-stat { box-shadow: none; }
.dash-stat:hover { box-shadow: none; transform: translateY(-2px); border-color: var(--mz-border-strong); }
.dash-stat::after { content: ""; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 3px; background: var(--mz-primary); transform: scaleY(0); transform-origin: bottom; transition: transform .3s var(--mz-ease); }
.dash-stat:hover::after { transform: scaleY(1); }
.dash-stat-watermark { display: none; }
.dash-stat-ico { border-radius: var(--mz-radius-sm); }
.dash-stat-label { font-size: .9rem; color: var(--mz-muted-color); }
.dash-stat-value { font-family: var(--mz-font-mono); font-size: 2rem; letter-spacing: -.05em; }
.dash-panel { box-shadow: none; border-radius: var(--mz-radius-card); }
.dash-panel-title { font-weight: 800; letter-spacing: -.02em; }
.dash-panel-link { color: var(--mz-primary-text); }
.dash-alert { border-radius: var(--mz-radius-card); }

/* 29. Client navigation (sidebar + topbar)
   -------------------------------------------------------------------------- */
.client-sidebar-link.active { background-color: rgba(var(--mz-primary-rgb), .14); }
.client-sidebar-link.active:before, .client-sidebar-link:has(.client-sidebar-badge):after { background-color: var(--mz-primary); }
.client-sidebar-badge { background-color: var(--mz-primary); color: #fff; }
.client-sidebar-link .bi { transition: color .2s; }
.client-sidebar-link.active .bi, .client-sidebar-link:hover .bi { color: var(--mz-primary); }
.client-topbar { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: var(--mz-body-bg); border-bottom: 1px solid var(--mz-border-color); }
body[data-client-nav] { background-color: var(--mz-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(--mz-border-color); border-radius: var(--mz-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(--mz-border-strong); }
.list-tile-watermark { display: none; }
.list-tile-ico { border-radius: var(--mz-radius-sm); }
.list-tile-value { font-family: var(--mz-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(--mz-ink); border-color: var(--mz-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(--mz-on-ink-muted); }
.list-page .list-tile.is-active .list-tile-ico { background: rgba(255,255,255,.1); color: var(--mz-primary); }
.list-page .list-tile.is-active .list-tile-sub { color: var(--mz-primary); }
[data-bs-theme="dark"] .list-page .list-tile.is-active { background: var(--mz-surface-3, #22252a); border-color: var(--mz-primary); }
.list-toolbar { border: 1px solid var(--mz-border-color); border-radius: var(--mz-radius-card); }
.list-rows > .list-item, .list-rows > article, .list-row-card { border-radius: var(--mz-radius-card); }
.announcement { border-radius: var(--mz-radius-card); }
.list-item { border: 1px solid var(--mz-border-color); box-shadow: none; }
.list-item:hover { box-shadow: none; border-color: var(--mz-border-strong); }
.mz-compare th.mz-compare__idx { font-family: var(--mz-font-mono); font-size: .72rem; font-weight: 600; color: var(--mz-faint-color); letter-spacing: .04em; }

/* 31. Secondary colour neutralised: WStyle page sheets blend --mz-secondary into gradients and
   accents; Modernize keeps those spots on the ink/primary pair so no mixed hues appear.
   The site-wide brand secondary stays available as --mz-brand-secondary. */
:root {
    --mz-brand-secondary: var(--mz-secondary);
}
body {
    --mz-secondary: var(--mz-ink);
    --mz-secondary-rgb: 18, 20, 23;
    --mz-secondary-subtle: var(--mz-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(--mz-ink);
    background-image: radial-gradient(420px 360px at 100% 100%, rgba(var(--mz-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(--mz-primary); --bs-btn-border-color: var(--mz-primary); --bs-btn-color: #fff; --bs-btn-hover-bg: var(--mz-primary-hover); --bs-btn-hover-border-color: var(--mz-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(--mz-primary); }
body[data-client-nav="topbar"] .client-topbar { display: flex; position: sticky; top: 0; z-index: 1030; box-shadow: none; padding-inline: max(1rem, calc((100vw - 1320px) / 2 + .75rem)); }
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"] .mz-topnav { top: var(--client-topbar-h, 3.75rem); }
@media (max-width: 575.98px) { body[data-client-nav="topbar"] .client-quickactions { display: none !important; } }
.mz-countdown b { font-variant-numeric: tabular-nums; min-width: 2ch; text-align: center; }
.mz-countdown__over { display: block; font-size: .85rem; font-weight: 600; color: var(--mz-on-ink-muted); padding: .45rem 0; }
.mz-countdown__over[hidden], .mz-countdown[hidden] { display: none; }
.mz-ctop-back { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; white-space: nowrap; }
@media (max-width: 767.98px) { .mz-ctop-back span { display: none; } .mz-ctop-back { padding-inline: .6rem; } }
@media (max-width: 767.98px) { .mz-ctop-locale__label { display: none; } .mz-ctop-locale .locale-toggle .bi { margin: 0 !important; } .mz-ctop-locale .locale-toggle { padding-inline: .6rem; } }