/* SAS Clinic ERP 2.0
   Clean interface layer. This file intentionally loads after app.css and owns
   the visual language: minimal, compact, practical and premium. */

:root {
    --erp-bg: #f6f8f8;
    --erp-surface: #ffffff;
    --erp-surface-soft: #fbfcfd;
    --erp-line: #e5eaf1;
    --erp-line-strong: #d5dde8;
    --erp-text: #111827;
    --erp-muted: #667085;
    --erp-subtle: #98a2b3;
    --erp-primary: #17201f;
    --erp-accent: #2f6fed;
    --erp-success: #12a594;
    --erp-danger: #e6536b;
    --erp-warning: #c56b22;
    --erp-radius-sm: 10px;
    --erp-radius: 14px;
    --erp-radius-lg: 18px;
    --erp-shadow: 0 1px 2px rgba(17, 24, 39, 0.04), 0 12px 28px rgba(17, 24, 39, 0.045);
    --erp-shadow-strong: 0 1px 2px rgba(17, 24, 39, 0.06), 0 20px 44px rgba(17, 24, 39, 0.075);
    --erp-sidebar: 232px;
    --erp-sidebar-closed: 72px;
    --erp-focus: 0 0 0 3px rgba(91, 92, 246, 0.13);
}

/* Brand palette override. Source of truth for the ERP visual system. */
:root {
    --erp-bg: #f8fafc;
    --erp-surface: #ffffff;
    --erp-surface-soft: #f1f5f9;
    --erp-hover: #ecfdf5;
    --erp-line: #e2e8f0;
    --erp-line-strong: #cbd5e1;
    --erp-text: #0f172a;
    --erp-muted: #64748b;
    --erp-subtle: #94a3b8;
    --erp-primary: #0f766e;
    --erp-primary-hover: #115e59;
    --erp-primary-active: #134e4a;
    --erp-accent: #14b8a6;
    --erp-primary-soft: #99f6e4;
    --erp-secondary: #ccfbf1;
    --erp-success: #10b981;
    --erp-danger: #ef4444;
    --erp-warning: #f59e0b;
    --erp-sidebar-bg: #0f172a;
    --erp-sidebar-hover: #1e293b;
    --erp-sidebar-active: #134e4a;
    --erp-sidebar-text: #cbd5e1;
    --erp-focus: 0 0 0 3px rgba(20, 184, 166, 0.18);
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
    background: var(--erp-bg) !important;
}

body {
    margin: 0;
    color: var(--erp-text);
    background:
        radial-gradient(circle at 4% 0%, rgba(18, 165, 148, 0.08), transparent 28rem),
        radial-gradient(circle at 100% 0%, rgba(47, 111, 237, 0.06), transparent 30rem),
        var(--erp-bg) !important;
    font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif !important;
    font-size: 14px;
    line-height: 1.45;
    letter-spacing: 0 !important;
}

button,
input,
select,
textarea {
    font: inherit !important;
    letter-spacing: 0 !important;
}

a {
    color: inherit;
    text-decoration: none;
}

.app-shell {
    display: grid !important;
    grid-template-columns: var(--erp-sidebar) minmax(0, 1fr) !important;
    min-height: 100vh;
    transition: grid-template-columns 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

body.sidebar-collapsed .app-shell {
    grid-template-columns: var(--erp-sidebar-closed) minmax(0, 1fr) !important;
}

.sidebar {
    position: sticky !important;
    top: 0;
    width: var(--erp-sidebar);
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    border-right: 1px solid var(--erp-line) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    padding: 18px 12px !important;
    box-shadow: none !important;
    backdrop-filter: blur(16px);
    transition: width 260ms cubic-bezier(0.22, 1, 0.36, 1), padding 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

body.sidebar-collapsed .sidebar {
    width: var(--erp-sidebar-closed);
    padding: 16px 10px !important;
}

.brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    min-height: 56px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    padding: 0 !important;
}

.sidebar-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 24px !important;
}

.brand:hover {
    background: transparent !important;
}

.brand-mark {
    width: 38px !important;
    height: 38px !important;
    flex: 0 0 38px;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #3f6df6, #13b8a6) !important;
    color: #fff;
    font-size: 14px;
    font-weight: 720;
    box-shadow: 0 12px 24px rgba(19, 184, 166, 0.14) !important;
}

.brand-title {
    color: var(--erp-text) !important;
    font-size: 14px !important;
    font-weight: 720 !important;
    line-height: 1.1;
}

.brand-subtitle {
    margin-top: 3px;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 480 !important;
}

body.sidebar-collapsed .brand {
    width: 48px !important;
    min-height: 48px !important;
    justify-content: center !important;
}

body.sidebar-collapsed .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 10px !important;
    margin-bottom: 22px !important;
}

body.sidebar-collapsed .brand > span:not(.brand-logo-mark) {
    display: none !important;
}

.sidebar-toggle {
    width: 100%;
    min-height: 34px !important;
    margin: 0 0 12px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: var(--erp-radius-sm) !important;
    background: var(--erp-surface) !important;
    color: #596579 !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    font-weight: 620 !important;
    box-shadow: none !important;
    outline: none !important;
}

.sidebar-toggle:hover {
    border-color: var(--erp-line-strong) !important;
    transform: none !important;
}

.sidebar-toggle:focus-visible {
    box-shadow: var(--erp-focus) !important;
}

.sidebar-toggle-icon {
    display: inline-grid;
    place-items: center;
    transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.sidebar-toggle-icon svg {
    width: 16px;
    height: 16px;
}

body.sidebar-collapsed .sidebar-toggle {
    width: 42px;
    min-width: 42px;
    padding: 0 !important;
}

body.sidebar-collapsed .sidebar-toggle {
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
}

body.sidebar-collapsed .sidebar-toggle-icon {
    transform: rotate(180deg);
}

body.sidebar-collapsed .sidebar-toggle-text {
    display: none !important;
}

.nav {
    display: grid !important;
    gap: 3px !important;
}

.nav-label {
    margin: 15px 10px 6px !important;
    color: var(--erp-subtle) !important;
    font-size: 9px !important;
    font-weight: 720 !important;
    letter-spacing: 0.055em !important;
    text-transform: uppercase;
}

.nav a,
.nav-locked {
    min-height: 38px !important;
    display: flex !important;
    align-items: center;
    gap: 9px !important;
    border: 1px solid transparent !important;
    border-radius: var(--erp-radius-sm) !important;
    color: #4b5565 !important;
    padding: 5px 8px !important;
    font-size: 13px !important;
    font-weight: 620 !important;
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.nav a:hover {
    background: #f4f6f8 !important;
    color: var(--erp-text) !important;
    transform: none !important;
}

.nav a.active {
    border-color: #e3e7ff !important;
    background: #f0f2ff !important;
    color: #3730a3 !important;
    box-shadow: none !important;
}

.nav-icon {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: inline-grid !important;
    place-items: center;
    border-radius: 9px !important;
    background: transparent !important;
    color: currentColor;
    font-size: 0 !important;
}

.nav a.active .nav-icon {
    background: #ffffff !important;
}

.nav-icon svg {
    width: 17px !important;
    height: 17px !important;
}

body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .nav-text,
body.sidebar-collapsed .nav a small,
body.sidebar-collapsed .nav-locked small {
    display: none !important;
}

body.sidebar-collapsed .nav {
    justify-items: center;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 44px;
    min-height: 42px !important;
    justify-content: center;
    padding: 0 !important;
}

body.sidebar-collapsed .nav-icon {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
}

.main {
    min-width: 0;
    width: 100%;
    max-width: none !important;
    padding: 20px clamp(18px, 2.2vw, 28px) !important;
    background: transparent !important;
}

.topbar {
    min-height: 68px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: var(--erp-radius) !important;
    background: var(--erp-surface) !important;
    padding: 14px 18px !important;
    box-shadow: var(--erp-shadow) !important;
}

.topbar h1 {
    margin: 0;
    color: var(--erp-text) !important;
    font-size: clamp(21px, 1.7vw, 27px) !important;
    font-weight: 720 !important;
    line-height: 1.12;
}

.eyebrow,
.metric-card span,
.chart-header span,
th,
.v2-kpi-strip span,
.v2-health-card > span {
    color: var(--erp-subtle) !important;
    font-size: 10px !important;
    font-weight: 680 !important;
    letter-spacing: 0.055em !important;
    text-transform: uppercase;
}

.notes,
.metric-card small,
.chart-card small,
.control-list small,
.detail-list dt,
.v2-kpi-strip small {
    color: var(--erp-muted) !important;
    font-size: 13px !important;
    font-weight: 480 !important;
    line-height: 1.5;
}

.panel,
.metric-card,
.chart-card,
.builder-card,
.form-card,
.auth-panel,
.table-wrap,
.room-analytics-card,
.room-config-card,
.platform-service-card,
.control-list a,
.v2-kpi-strip article,
.auth-copy,
.auth-login-card {
    border: 1px solid var(--erp-line) !important;
    border-radius: var(--erp-radius) !important;
    background: var(--erp-surface) !important;
    box-shadow: var(--erp-shadow) !important;
}

.panel {
    padding: 18px !important;
}

.panel-heading {
    gap: 8px !important;
    margin-bottom: 14px !important;
}

.panel-heading h2 {
    margin: 0;
    color: var(--erp-text) !important;
    font-size: clamp(18px, 1.35vw, 22px) !important;
    font-weight: 700 !important;
    line-height: 1.16;
}

.metric-grid,
.v2-kpi-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)) !important;
    gap: 12px !important;
}

.metric-card,
.v2-kpi-strip article {
    min-height: 100px !important;
    padding: 16px !important;
}

.metric-card strong,
.v2-kpi-strip strong {
    display: block;
    color: var(--erp-text) !important;
    font-size: clamp(25px, 2.2vw, 34px) !important;
    font-weight: 720 !important;
    line-height: 1.08;
}

.button,
.table-action,
.icon-button,
.segmented-control a,
.user-badge {
    min-height: 36px !important;
    border: 1px solid var(--erp-line-strong) !important;
    border-radius: var(--erp-radius-sm) !important;
    background: var(--erp-surface) !important;
    color: var(--erp-text) !important;
    padding: 0 13px !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    box-shadow: none !important;
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.button:hover,
.table-action:hover,
.icon-button:hover,
.segmented-control a:hover {
    border-color: #bfc8d6 !important;
    transform: none !important;
}

.button.primary,
.table-action.primary,
.segmented-control a.active {
    border-color: var(--erp-primary) !important;
    background: var(--erp-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(17, 24, 39, 0.12) !important;
}

.button.compact,
.table-action,
.icon-button {
    min-height: 34px !important;
}

.user-menu {
    gap: 8px !important;
}

.user-badge {
    min-width: 170px !important;
    padding: 8px 12px !important;
}

.user-badge strong {
    color: var(--erp-text);
    font-size: 13px !important;
    font-weight: 680 !important;
}

.user-badge small {
    color: var(--erp-muted) !important;
    font-size: 12px !important;
    font-weight: 480 !important;
}

input,
select,
textarea {
    min-height: 38px !important;
    border: 1px solid var(--erp-line-strong) !important;
    border-radius: var(--erp-radius-sm) !important;
    background: #fff !important;
    color: var(--erp-text) !important;
    padding: 8px 11px !important;
    font-size: 14px !important;
    font-weight: 480 !important;
    outline: 0 !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--erp-accent) !important;
    box-shadow: var(--erp-focus) !important;
}

label {
    color: #485568;
    font-size: 12px;
    font-weight: 650;
}

.badge {
    min-height: 22px;
    border: 1px solid var(--erp-line) !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    color: #475467 !important;
    padding: 3px 8px !important;
    font-size: 11px !important;
    font-weight: 650 !important;
}

.dashboard-grid,
.work-grid,
.platform-dashboard-grid,
.v2-platform-shell,
.v2-command-grid,
.v2-analytics-grid,
.dashboard-operations-grid {
    gap: 14px !important;
}

.v2-command-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 310px !important;
}

.v2-revenue-layout {
    display: grid !important;
    grid-template-columns: 220px minmax(0, 1fr) !important;
    gap: 14px !important;
}

.v2-analytics-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.v2-ring,
.donut-chart {
    width: 122px !important;
    height: 122px !important;
}

.v2-line-chart-card .real-chart {
    min-height: 210px !important;
}

.ranked-bars {
    gap: 8px !important;
}

.ranked-bars div {
    min-height: 28px !important;
}

.ranked-bars span,
.ranked-bars strong {
    font-size: 12px !important;
}

.ranked-bars i,
.progress-track,
.v2-progress-stack i {
    height: 7px !important;
    border-radius: 999px !important;
}

.status-row {
    min-height: 32px !important;
    border-radius: 999px !important;
    padding: 6px 10px !important;
}

.control-list {
    gap: 9px !important;
}

.control-list a {
    padding: 13px !important;
}

.control-list strong {
    color: var(--erp-text);
    font-size: 14px !important;
    font-weight: 680 !important;
}

.empty-state {
    min-height: 92px !important;
    border-radius: var(--erp-radius) !important;
    background: var(--erp-surface-soft) !important;
    font-weight: 580 !important;
}

.is-guest .app-shell {
    grid-template-columns: 80px minmax(0, 1fr) !important;
}

.is-guest .sidebar {
    width: 80px;
    padding: 18px 14px !important;
}

.is-guest .brand {
    justify-content: center;
}

.is-guest .brand > span:not(.brand-mark) {
    display: none !important;
}

.main:has(.auth-experience) {
    min-height: 100vh;
    display: grid;
    align-items: center;
    padding: clamp(20px, 4vw, 42px) !important;
}

.main:has(.auth-experience) .topbar {
    display: none !important;
}

.auth-minimal {
    width: min(980px, 100%);
    display: grid !important;
    grid-template-columns: minmax(260px, 0.85fr) minmax(320px, 1fr);
    gap: 16px;
    margin: 0 auto;
}

.auth-copy,
.auth-login-card {
    padding: clamp(22px, 3vw, 34px) !important;
}

.auth-copy {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.auth-copy h2 {
    max-width: 430px;
    margin: 0 0 12px;
    color: var(--erp-text);
    font-size: clamp(26px, 2.7vw, 38px);
    font-weight: 650;
    line-height: 1.08;
}

.auth-copy p:not(.eyebrow) {
    max-width: 430px;
    margin: 0;
    color: var(--erp-muted);
    font-size: 14px;
    line-height: 1.55;
}

.auth-login-card {
    gap: 14px !important;
}

.auth-login-card h2 {
    margin: 0;
    color: var(--erp-text);
    font-size: 22px !important;
    font-weight: 650 !important;
}

.auth-login-card .button.primary {
    width: 100%;
    min-height: 42px !important;
}

.auth-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 24px;
}

.auth-highlights span {
    min-height: 30px;
    border: 1px solid var(--erp-line);
    border-radius: 999px;
    background: var(--erp-surface-soft);
    color: #485568;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 620;
}

.form-link {
    color: #5b5cf6 !important;
    font-size: 13px !important;
    font-weight: 620 !important;
}

.main:has(.calendar-focus-shell) {
    padding: 10px 12px !important;
}

.main:has(.calendar-focus-shell) .topbar {
    display: none !important;
}

.calendar-focus-toolbar {
    position: sticky !important;
    top: 10px;
    z-index: 20;
    min-height: 56px;
    grid-template-columns: minmax(250px, 1fr) auto auto !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: var(--erp-radius) !important;
    background: var(--erp-surface) !important;
    padding: 8px 10px !important;
    box-shadow: var(--erp-shadow) !important;
}

.calendar-hero-title {
    display: block !important;
    color: var(--erp-text) !important;
    font-size: clamp(22px, 1.65vw, 28px) !important;
    font-weight: 620 !important;
}

.calendar-focus-title,
.calendar-focus-toolbar h2:not(.calendar-hero-title) {
    display: none !important;
}

.calendar-focus-toolbar .button,
.calendar-focus-toolbar .icon-button {
    min-height: 38px !important;
    min-width: 38px !important;
    border-radius: var(--erp-radius-sm) !important;
}

.pro-calendar {
    --minute-height: clamp(0.9px, 0.112vh, 1.08px) !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    min-height: calc(100vh - 150px) !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: var(--erp-radius) !important;
    background: var(--erp-surface) !important;
    box-shadow: var(--erp-shadow) !important;
}

.pro-calendar-axis,
.pro-calendar-column {
    grid-template-rows: 46px minmax(0, 1fr) !important;
}

.pro-calendar-corner,
.pro-calendar-column-head {
    min-height: 46px !important;
    background: var(--erp-surface-soft) !important;
    padding: 8px 10px !important;
}

.pro-calendar-column-head strong {
    font-size: 13px !important;
    font-weight: 680 !important;
}

.pro-calendar-column-head span {
    font-size: 11px !important;
    font-weight: 480 !important;
}

.pro-calendar-axis-body span {
    color: #5f6b7a !important;
    font-size: 11px !important;
    font-weight: 560 !important;
}

.pro-calendar .calendar-event {
    min-height: 36px !important;
    border-radius: 11px !important;
    background: #fff !important;
    box-shadow: 0 8px 18px rgba(17, 24, 39, 0.06) !important;
}

.pro-calendar .calendar-event strong {
    font-size: 11px !important;
    font-weight: 680 !important;
}

.pro-calendar .calendar-event small,
.pro-calendar .calendar-event .event-time {
    font-size: 10px !important;
}

/* Public commercial landing */
.commercial-landing {
    min-height: 100vh;
    margin: 0;
    color: var(--erp-text);
    background:
        radial-gradient(circle at 18% 10%, rgba(47, 111, 237, 0.10), transparent 28%),
        radial-gradient(circle at 82% 4%, rgba(18, 165, 148, 0.10), transparent 26%),
        linear-gradient(180deg, #fbfcfd 0%, #f4f7f8 100%);
    font-family: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.commercial-landing * {
    box-sizing: border-box;
}

.landing-nav,
.landing-hero,
.landing-section {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}

.landing-nav {
    position: sticky;
    top: 14px;
    z-index: 30;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 22px;
    padding: 12px;
    margin-top: 14px;
    border: 1px solid rgba(213, 221, 232, 0.9);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 18px 46px rgba(17, 24, 39, 0.08);
    backdrop-filter: blur(18px);
}

.landing-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--erp-text);
    text-decoration: none;
}

.landing-brand span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.02em;
    background: linear-gradient(135deg, #17201f 0%, #2f6fed 52%, #12a594 100%);
    box-shadow: 0 14px 28px rgba(47, 111, 237, 0.18);
}

.landing-brand strong {
    font-size: 15px;
    font-weight: 760;
}

.landing-nav-links {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.landing-nav-links a,
.landing-link-button {
    padding: 10px 12px;
    border: 0;
    border-radius: 12px;
    color: var(--erp-muted);
    background: transparent;
    font: inherit;
    font-size: 14px;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
    transition: color 160ms ease, background 160ms ease;
}

.landing-nav-links a:hover,
.landing-link-button:hover {
    color: var(--erp-text);
    background: #f2f5f8;
}

.landing-nav-actions,
.landing-hero-actions,
.landing-tour-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.landing-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 14px;
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
}

.landing-button:hover {
    transform: translateY(-1px);
}

.landing-button.primary {
    border-color: var(--erp-primary);
    color: #fff;
    background: var(--erp-primary);
    box-shadow: 0 18px 36px rgba(17, 24, 39, 0.18);
}

.landing-button.secondary {
    color: var(--erp-text);
    background: rgba(255, 255, 255, 0.78);
}

.landing-button.large {
    min-height: 48px;
    padding-inline: 22px;
}

.landing-button.full {
    width: 100%;
}

.landing-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.78fr);
    gap: 28px;
    align-items: center;
    padding: 72px 0 34px;
}

.landing-eyebrow {
    margin: 0 0 10px;
    color: var(--erp-subtle);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-hero h1 {
    max-width: 780px;
    margin: 0;
    color: var(--erp-text);
    font-size: clamp(42px, 7vw, 82px);
    line-height: 0.94;
    letter-spacing: -0.04em;
}

.landing-lead {
    max-width: 690px;
    margin: 24px 0 0;
    color: var(--erp-muted);
    font-size: clamp(18px, 2vw, 22px);
    line-height: 1.55;
}

.landing-hero-actions {
    margin-top: 30px;
    flex-wrap: wrap;
}

.landing-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.landing-proof span,
.landing-module-strip span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid rgba(213, 221, 232, 0.9);
    border-radius: 999px;
    color: #344054;
    background: rgba(255, 255, 255, 0.68);
    font-size: 13px;
    font-weight: 700;
}

.landing-product-card,
.landing-section,
.landing-access-card {
    border: 1px solid rgba(213, 221, 232, 0.9);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 24px 70px rgba(17, 24, 39, 0.09);
    backdrop-filter: blur(14px);
}

.landing-product-card {
    overflow: hidden;
    border-radius: 30px;
}

.landing-product-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px;
    border-bottom: 1px solid var(--erp-line);
}

.landing-product-top span {
    color: var(--erp-muted);
    font-weight: 700;
}

.landing-product-top strong {
    font-size: 22px;
}

.landing-calendar-preview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 310px;
    background: linear-gradient(#eef3f8 1px, transparent 1px);
    background-size: 100% 44px;
}

.landing-calendar-preview div {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px 12px;
    border-right: 1px solid var(--erp-line);
}

.landing-calendar-preview div:last-child {
    border-right: 0;
}

.landing-calendar-preview strong {
    padding-bottom: 10px;
    font-size: 14px;
}

.landing-calendar-preview span {
    display: block;
    overflow: hidden;
    padding: 10px 12px;
    border: 1px solid #cbd8ff;
    border-left: 4px solid #5b50f2;
    border-radius: 12px;
    color: var(--erp-text);
    background: #fff;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-shadow: 0 10px 24px rgba(47, 111, 237, 0.08);
}

.landing-metric-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--erp-line);
}

.landing-metric-row div {
    padding: 18px;
    background: #fff;
}

.landing-metric-row small {
    display: block;
    color: var(--erp-muted);
    font-size: 12px;
    font-weight: 700;
}

.landing-metric-row strong {
    display: block;
    margin-top: 4px;
    font-size: 26px;
}

.landing-section {
    padding: 30px;
    margin-top: 24px;
    border-radius: 30px;
}

.landing-section-heading {
    display: grid;
    gap: 8px;
    max-width: 760px;
}

.landing-section-heading h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.05;
    letter-spacing: -0.03em;
}

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 26px;
}

.landing-feature-grid article {
    padding: 22px;
    border: 1px solid var(--erp-line);
    border-radius: 22px;
    background: var(--erp-surface-soft);
}

.landing-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 13px;
    color: var(--erp-accent);
    background: #edf3ff;
    font-size: 12px;
    font-weight: 800;
}

.landing-feature-grid h3,
.landing-access-copy h3 {
    margin: 18px 0 8px;
    font-size: 20px;
}

.landing-feature-grid p,
.landing-access-copy p {
    margin: 0;
    color: var(--erp-muted);
    line-height: 1.55;
}

.landing-guide-grid {
    display: grid;
    grid-template-columns: 1.25fr repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 26px;
}

.landing-guide-grid article,
.landing-plan-card {
    position: relative;
    display: grid;
    gap: 12px;
    min-height: 210px;
    padding: 22px;
    border: 1px solid var(--erp-line);
    border-radius: 24px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
    box-shadow: 0 16px 40px rgba(17, 24, 39, 0.05);
}

.landing-guide-grid article.is-featured {
    background:
        radial-gradient(circle at 88% 8%, rgba(18, 165, 148, 0.14), transparent 28%),
        linear-gradient(145deg, #111827 0%, #1f2937 100%);
    color: #fff;
}

.landing-guide-grid span,
.landing-plan-kicker {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.landing-guide-grid article.is-featured span,
.landing-guide-grid article.is-featured p {
    color: rgba(255, 255, 255, 0.72);
}

.landing-guide-grid h3,
.landing-plan-card h3 {
    margin: 0;
    font-size: 21px;
    letter-spacing: -0.02em;
}

.landing-guide-grid p,
.landing-plan-card p {
    margin: 0;
    color: var(--erp-muted);
    line-height: 1.5;
}

.landing-pricing-section {
    background:
        radial-gradient(circle at 94% 8%, rgba(47, 111, 237, 0.09), transparent 28%),
        rgba(255, 255, 255, 0.86);
}

.landing-billing-toggle {
    display: inline-flex;
    gap: 6px;
    padding: 6px;
    margin-top: 22px;
    border: 1px solid var(--erp-line);
    border-radius: 16px;
    background: #f2f5f8;
}

.landing-billing-toggle button {
    min-height: 38px;
    padding: 0 16px;
    border: 0;
    border-radius: 12px;
    color: var(--erp-muted);
    background: transparent;
    font: inherit;
    font-size: 14px;
    font-weight: 780;
    cursor: pointer;
    transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.landing-billing-toggle button.is-active {
    color: var(--erp-text);
    background: #fff;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.08);
}

.landing-billing-toggle small {
    display: inline-block;
    margin-left: 6px;
    color: var(--erp-accent);
    font-size: 11px;
    font-weight: 850;
}

.landing-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 22px;
}

.landing-plan-card {
    min-height: 360px;
    align-content: start;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.landing-plan-card:hover,
.landing-plan-card.is-selected {
    border-color: rgba(47, 111, 237, 0.36);
    box-shadow: 0 22px 58px rgba(47, 111, 237, 0.12);
    transform: translateY(-2px);
}

.landing-plan-price {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--erp-line);
}

.landing-plan-price strong {
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1;
    letter-spacing: -0.04em;
}

.landing-plan-price small,
.landing-plan-annual {
    color: var(--erp-muted);
    font-size: 13px;
    font-weight: 700;
}

.landing-plan-annual {
    min-height: 20px;
}

.landing-plan-card ul {
    display: grid;
    gap: 9px;
    padding: 0;
    margin: 2px 0 6px;
    list-style: none;
}

.landing-plan-card li {
    position: relative;
    padding-left: 20px;
    color: #344054;
    font-size: 14px;
    font-weight: 680;
}

.landing-plan-card li::before {
    content: "";
    position: absolute;
    top: 0.55em;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--erp-accent);
}

.landing-selected-plan {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid rgba(47, 111, 237, 0.18);
    border-radius: 16px;
    background: #f5f8ff;
}

.landing-selected-plan span {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.landing-selected-plan strong {
    font-size: 16px;
}

.landing-selected-plan small {
    grid-column: 2;
    color: var(--erp-muted);
    font-size: 13px;
    font-weight: 760;
}

.landing-modules {
    background: #111827;
}

.landing-modules .landing-eyebrow,
.landing-modules h2 {
    color: #fff;
}

.landing-module-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}

.landing-module-strip span {
    border-color: rgba(255, 255, 255, 0.14);
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.landing-access-section {
    margin-bottom: 52px;
}

.landing-access {
    display: grid;
    grid-template-columns: 0.78fr 1fr;
    gap: 24px;
    align-items: start;
    margin-top: 26px;
}

.landing-access-copy {
    padding-top: 10px;
}

.landing-access-copy h3 {
    margin-top: 0;
    font-size: 26px;
    letter-spacing: -0.02em;
}

.landing-errors {
    display: grid;
    gap: 4px;
    margin-top: 18px;
    padding: 14px;
    border: 1px solid #ffd6a8;
    border-radius: 16px;
    color: #9a3412;
    background: #fff7ed;
    font-size: 14px;
}

.landing-access-card {
    padding: 16px;
    border-radius: 24px;
}

.landing-tabs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 6px;
    border-radius: 16px;
    background: #f1f5f8;
}

.landing-tabs button {
    min-height: 42px;
    border: 0;
    border-radius: 12px;
    color: var(--erp-muted);
    background: transparent;
    font: inherit;
    font-weight: 780;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.landing-tabs button.is-active {
    color: var(--erp-text);
    background: #fff;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.08);
}

.landing-form {
    display: none;
    gap: 14px;
    margin-top: 16px;
}

.landing-form.is-active {
    display: grid;
}

.landing-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.landing-form label {
    display: grid;
    gap: 8px;
    color: #475467;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.landing-form input {
    width: 100%;
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 14px;
    color: var(--erp-text);
    background: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    outline: 0;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.landing-form input:focus {
    border-color: rgba(47, 111, 237, 0.65);
    box-shadow: 0 0 0 4px rgba(47, 111, 237, 0.12);
}

.landing-check {
    display: flex !important;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.landing-check input {
    width: 16px;
    min-height: 16px;
}

.landing-tour[hidden] {
    display: none;
}

.landing-tour-backdrop {
    position: fixed;
    inset: 0;
    z-index: 70;
    background: rgba(17, 24, 39, 0.28);
    backdrop-filter: blur(4px);
}

.landing-tour-panel {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 80;
    width: min(420px, calc(100% - 48px));
    padding: 22px;
    border: 1px solid var(--erp-line);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(17, 24, 39, 0.24);
    animation: landingPanelIn 220ms ease both;
}

.landing-tour-panel h2 {
    margin: 0 0 8px;
    font-size: 24px;
    letter-spacing: -0.02em;
}

.landing-tour-panel p:not(.landing-eyebrow) {
    margin: 0;
    color: var(--erp-muted);
    line-height: 1.55;
}

.landing-tour-actions {
    justify-content: flex-end;
    margin-top: 22px;
}

.is-tour-active {
    position: relative;
    z-index: 75;
    outline: 3px solid rgba(47, 111, 237, 0.32);
    outline-offset: 8px;
}

.admin-task-shell,
.stats-shell,
.team-shell {
    display: grid;
    gap: 18px;
}

.task-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.task-hero h2 {
    margin: 0 0 8px;
    font-size: clamp(26px, 3vw, 38px);
    letter-spacing: -0.03em;
}

.task-hero-actions,
.inline-actions,
.centered-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.task-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.task-card {
    display: grid;
    gap: 8px;
    min-height: 150px;
    padding: 20px;
    border: 1px solid var(--erp-line);
    border-radius: 24px;
    color: var(--erp-text);
    background: #fff;
    text-decoration: none;
    box-shadow: 0 14px 36px rgba(17, 24, 39, 0.06);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.task-card:hover {
    transform: translateY(-2px);
    border-color: #cbd8ff;
    box-shadow: 0 20px 44px rgba(17, 24, 39, 0.09);
}

.task-card span,
.catalog-summary span {
    color: var(--erp-subtle);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.task-card strong {
    font-size: 40px;
    line-height: 1;
}

.task-card small {
    color: var(--erp-muted);
    font-size: 14px;
    line-height: 1.35;
}

.task-card.is-high {
    border-color: #fed7aa;
    background: #fff7ed;
}

.task-card.is-medium {
    border-color: #fde68a;
    background: #fffbeb;
}

.task-card.is-ok {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.admin-work-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
    gap: 18px;
}

.compact-list {
    display: grid;
    gap: 10px;
}

.compact-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 58px;
    padding: 12px 14px;
    border: 1px solid var(--erp-line);
    border-radius: 16px;
    color: var(--erp-text);
    background: var(--erp-surface-soft);
    text-decoration: none;
}

.compact-list strong {
    display: block;
    font-size: 15px;
}

.compact-list small {
    display: block;
    margin-top: 3px;
    color: var(--erp-muted);
    font-size: 13px;
}

.compact-list b {
    white-space: nowrap;
}

.admin-filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(160px, 0.8fr)) auto auto;
    gap: 10px;
    align-items: end;
    padding: 14px;
    margin: 16px 0;
    border: 1px solid var(--erp-line);
    border-radius: 20px;
    background: var(--erp-surface-soft);
}

.billing-term-editor {
    display: grid;
    gap: 12px;
}

.billing-term-editor article {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 140px 140px minmax(160px, 0.8fr) auto;
    gap: 10px;
    align-items: end;
    padding: 14px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: var(--erp-surface-soft);
}

.billing-term-editor label {
    display: grid;
    gap: 6px;
    color: var(--erp-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.billing-term-editor input {
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.billing-term-editor .term-toggle {
    display: flex;
    min-height: 40px;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 12px;
    background: #fff;
    text-transform: none;
    letter-spacing: 0;
}

.billing-term-editor .term-toggle input {
    min-height: auto;
}

.customer-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.customer-summary-grid article {
    display: grid;
    gap: 8px;
    min-height: 104px;
    padding: 18px;
    border: 1px solid var(--erp-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--erp-shadow);
}

.customer-summary-grid span {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.customer-summary-grid strong {
    font-size: 32px;
    line-height: 1;
}

.customer-filter-bar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    margin-bottom: 14px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: var(--erp-surface-soft);
}

.customer-filter-bar label {
    display: grid;
    gap: 6px;
    color: var(--erp-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-filter-bar input {
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.room-analytics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 14px;
}

.room-analytics-card {
    overflow: hidden;
    padding: 18px !important;
}

.room-analytics-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.room-analytics-head strong {
    display: block;
    font-size: 18px;
}

.room-analytics-head small,
.room-score small {
    color: var(--erp-muted);
    font-size: 13px;
    font-weight: 650;
}

.room-score {
    min-width: 86px;
    text-align: right;
}

.room-score strong {
    font-size: 34px;
    line-height: 1;
}

.room-day-strip {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 16px;
}

.room-day-strip div {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.room-day-strip span,
.room-day-strip small {
    overflow: hidden;
    color: var(--erp-muted);
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.room-day-strip i,
.hour-occupancy-list i {
    display: block;
    overflow: hidden;
    height: 8px;
    border-radius: 999px;
    background: #e7edf4;
}

.room-day-strip b,
.hour-occupancy-list b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2f6fed, #12a594);
}

.room-heatmap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.room-heatmap span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border: 1px solid var(--erp-line);
    border-radius: 999px;
    background: #eefbf7;
    color: #047857;
    font-size: 13px;
    font-weight: 800;
}

.room-heatmap span.is-medium {
    background: #fff7ed;
    color: #c2410c;
}

.room-heatmap span.is-full {
    background: #fff1f2;
    color: #be123c;
}

.room-config-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 14px;
}

.room-config-card {
    display: grid;
    gap: 14px;
    padding: 18px !important;
}

.room-config-meta,
.room-resource-list small {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.room-config-meta span,
.room-resource-list span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 0 11px;
    border: 1px solid var(--erp-line);
    border-radius: 999px;
    background: var(--erp-surface-soft);
    color: var(--erp-muted);
    font-size: 12px;
    font-weight: 800;
}

.admin-filter-bar label {
    display: grid;
    gap: 6px;
    color: var(--erp-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.admin-filter-bar input,
.admin-filter-bar select {
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 12px;
    background: #fff;
    color: var(--erp-text);
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.platform-module-overview {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--erp-line);
}

.module-chip-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.module-chip-grid article,
.team-card {
    display: grid;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: var(--erp-surface-soft);
}

.module-chip-grid strong,
.team-card h3 {
    margin: 0;
    font-size: 17px;
}

.module-chip-grid small,
.module-chip-grid p,
.team-card p {
    margin: 0;
    color: var(--erp-muted);
    font-size: 13px;
    line-height: 1.4;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.team-card dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.team-card dl div {
    padding: 10px;
    border-radius: 14px;
    background: #fff;
}

.team-card dt {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}

.team-card dd {
    margin: 4px 0 0;
    font-size: 14px;
    font-weight: 800;
}

.landing-compact-section {
    padding-block: 24px;
}

.admin-task-form {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) minmax(170px, 0.9fr) 140px 130px auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    margin-bottom: 14px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: var(--erp-surface-soft);
}

.admin-task-form label {
    display: grid;
    gap: 6px;
    color: var(--erp-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.admin-task-form input,
.admin-task-form select {
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--erp-line-strong);
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 650;
}

.task-list {
    display: grid;
    gap: 9px;
}

.task-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--erp-line);
    border-radius: 16px;
    background: #fff;
}

.task-list strong {
    display: block;
    font-size: 15px;
}

.task-list small {
    display: block;
    margin-top: 3px;
    color: var(--erp-muted);
    font-size: 13px;
}

.task-calendar-mini {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 16px;
}

.task-calendar-mini article {
    display: grid;
    gap: 4px;
    min-height: 88px;
    padding: 10px;
    border: 1px solid var(--erp-line);
    border-radius: 16px;
    background: var(--erp-surface-soft);
}

.task-calendar-mini span {
    color: var(--erp-muted);
    font-size: 12px;
    font-weight: 800;
}

.task-calendar-mini strong {
    font-size: 24px;
}

.task-calendar-mini small {
    overflow: hidden;
    color: var(--erp-muted);
    font-size: 11px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.task-calendar-full {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 10px;
}

.task-calendar-full article {
    display: grid;
    gap: 10px;
    min-height: 142px;
    padding: 12px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: var(--erp-surface-soft);
}

.task-calendar-full article.is-today {
    border-color: rgba(47, 111, 237, 0.42);
    background: #f5f8ff;
}

.task-calendar-full header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.task-calendar-full header span {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}

.task-calendar-full header strong {
    font-size: 22px;
}

.task-calendar-full div {
    display: grid;
    gap: 6px;
    align-content: start;
}

.task-calendar-full a {
    display: grid;
    gap: 2px;
    padding: 8px;
    border: 1px solid var(--erp-line);
    border-radius: 12px;
    color: var(--erp-text);
    background: #fff;
    text-decoration: none;
}

.task-calendar-full a strong {
    overflow: hidden;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.task-calendar-full a small,
.task-calendar-full .muted {
    color: var(--erp-muted);
    font-size: 11px;
}

.stats-main-grid,
.owner-main-grid,
.billing-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 18px;
}

.company-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.company-stat-grid article {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--erp-line);
    border-radius: 20px;
    background: var(--erp-surface-soft);
}

.company-stat-grid h3 {
    margin: 10px 0 4px;
    font-size: 18px;
}

.company-stat-grid p {
    margin: 0;
    color: var(--erp-muted);
}

.company-stat-grid dl,
.team-card dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.company-stat-grid dl div,
.team-card dl div {
    padding: 10px;
    border-radius: 14px;
    background: #fff;
}

.company-stat-grid dt {
    color: var(--erp-subtle);
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
}

.company-stat-grid dd {
    margin: 4px 0 0;
    font-size: 13px;
    font-weight: 800;
}

.company-insight-list {
    display: grid;
    gap: 10px;
}

.company-insight-row {
    display: grid;
    grid-template-columns: minmax(260px, 1.15fr) minmax(360px, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--erp-line);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.04);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.company-insight-row:hover {
    transform: translateY(-1px);
    border-color: rgba(15, 118, 110, 0.24);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.07);
}

.company-insight-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.company-insight-main h3 {
    margin: 0;
    overflow: hidden;
    color: #0f172a;
    font-size: 17px;
    font-weight: 760;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.company-insight-main p {
    margin: 3px 0 0;
    color: #64748b;
    font-size: 13px;
    font-weight: 560;
}

.company-insight-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.company-insight-metrics span {
    display: grid;
    gap: 3px;
    min-height: 54px;
    padding: 9px 11px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
}

.company-insight-metrics small {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 820;
    letter-spacing: 0.05em;
    line-height: 1;
    text-transform: uppercase;
}

.company-insight-metrics strong {
    overflow: hidden;
    color: #0f172a;
    font-size: 14px;
    font-weight: 780;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #bbf7d0;
    border-radius: 999px;
    background: #dcfce7;
    color: #166534;
    font-size: 12px;
    font-weight: 760;
}

.status-pill.is-trial {
    border-color: #fde68a;
    background: #fef3c7;
    color: #92400e;
}

.status-pill.is-suspended,
.status-pill.is-inactive {
    border-color: #fecaca;
    background: #fee2e2;
    color: #991b1b;
}

.owner-simple-dashboard,
.billing-dashboard {
    display: grid;
    gap: 18px;
}

.owner-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.owner-kpi-grid article {
    display: grid;
    gap: 7px;
    min-height: 126px;
    padding: 18px;
    border: 1px solid var(--erp-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.06);
}

.owner-kpi-grid span,
.owner-billing-strip span {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.owner-kpi-grid strong {
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1;
}

.owner-kpi-grid small {
    color: var(--erp-muted);
    font-size: 13px;
}

.owner-billing-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 14px;
    align-items: center;
}

.owner-billing-strip div {
    display: grid;
    gap: 5px;
}

.owner-billing-strip strong {
    font-size: 22px;
}

.compact-table table th,
.compact-table table td {
    padding-block: 11px;
}

.sidebar-toggle {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    justify-content: center !important;
}

.sidebar-toggle .sidebar-toggle-icon {
    margin: 0 !important;
}

.nav-lock-icon {
    display: inline-flex !important;
    width: 24px !important;
    height: 24px !important;
    align-items: center;
    justify-content: center;
}

.nav-lock-icon svg {
    width: 20px;
    height: 20px;
}

.pro-calendar-axis-body span {
    display: flex !important;
    align-items: flex-start !important;
    height: 22px !important;
    transform: translateY(-6px) !important;
}

.pro-calendar .calendar-event {
    align-items: center !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 8px !important;
}

/* Fase 32: agenda operativa limpia, estilo calendario profesional. */
.main:has(.calendar-focus-shell) {
    background: #f6f8fb !important;
}

.calendar-focus-shell {
    display: grid !important;
    gap: 10px !important;
}

.calendar-focus-toolbar {
    top: 8px !important;
    min-height: 52px !important;
    grid-template-columns: minmax(220px, 1fr) auto auto !important;
    gap: 10px !important;
    border-radius: 18px !important;
    padding: 8px !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08) !important;
}

.calendar-focus-toolbar .eyebrow {
    display: none !important;
}

.calendar-hero-title {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    margin: 0 !important;
    font-size: clamp(20px, 1.8vw, 27px) !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
}

.calendar-hero-title span {
    color: var(--erp-muted) !important;
    font-size: 0.74em !important;
    font-weight: 560 !important;
}

.calendar-nav,
.calendar-actions {
    gap: 6px !important;
}

.calendar-focus-toolbar .button,
.calendar-focus-toolbar .icon-button,
.calendar-focus-toolbar .segmented-control a {
    min-height: 36px !important;
    min-width: 36px !important;
    border-radius: 13px !important;
    padding-inline: 13px !important;
    font-size: 13px !important;
    font-weight: 720 !important;
}

.calendar-filter-drawer {
    width: fit-content !important;
    min-width: 112px !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05) !important;
}

.calendar-filter-drawer[open] {
    width: 100% !important;
}

.pro-calendar {
    --minute-height: clamp(1px, 0.112vh, 1.18px) !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    min-height: calc(100vh - 118px) !important;
    max-height: calc(100vh - 118px) !important;
    overflow: auto !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07) !important;
}

.pro-calendar-axis,
.pro-calendar-column {
    grid-template-rows: 54px minmax(0, 1fr) !important;
}

.pro-calendar-corner,
.pro-calendar-column-head {
    position: sticky !important;
    top: 0 !important;
    z-index: 5 !important;
    min-height: 54px !important;
    border-bottom: 1px solid #dde6f0 !important;
    background: rgba(248, 250, 252, 0.96) !important;
    backdrop-filter: blur(16px) !important;
}

.pro-calendar-column-head {
    display: grid !important;
    align-content: center !important;
    gap: 3px !important;
}

.pro-calendar-corner {
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

.pro-calendar-axis-body {
    background: #fff !important;
}

.pro-calendar-axis-body span {
    height: calc(60 * var(--minute-height)) !important;
    align-items: flex-start !important;
    justify-content: center !important;
    transform: translateY(-1px) !important;
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

.pro-calendar-lane {
    background-color: #fff !important;
    background-image:
        linear-gradient(to bottom, rgba(148, 163, 184, 0.2) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(226, 232, 240, 0.72) 1px, transparent 1px) !important;
    background-size: 100% calc(60 * var(--minute-height)), 100% calc(15 * var(--minute-height)) !important;
}

.calendar-closed-block {
    background: rgba(241, 245, 249, 0.82) !important;
    background-image: repeating-linear-gradient(135deg, rgba(203, 213, 225, 0.22), rgba(203, 213, 225, 0.22) 10px, transparent 10px, transparent 20px) !important;
}

.calendar-closed-block span {
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

.pro-calendar .calendar-event {
    min-height: 26px !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-content: center !important;
    border: 1px solid color-mix(in srgb, var(--event-color) 32%, #dbe4f0) !important;
    border-left: 4px solid var(--event-color) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    padding: 5px 7px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08) !important;
}

.pro-calendar .calendar-event .event-time {
    display: inline-flex !important;
    min-width: 44px !important;
    height: 24px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    background: #eef4ff !important;
    color: #344054 !important;
    font-size: 11px !important;
    font-weight: 760 !important;
}

.pro-calendar .calendar-event strong {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 760 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.pro-calendar .calendar-event small {
    display: none !important;
}

.event-payment {
    min-height: 22px !important;
    border-radius: 999px !important;
    padding: 2px 7px !important;
    font-size: 11px !important;
    font-weight: 760 !important;
}

.event-payment.is-pending {
    color: #b45309 !important;
    background: #fff7ed !important;
}

.event-payment.is-paid {
    color: #047857 !important;
    background: #ecfdf5 !important;
}

.simple-occupancy-list,
.simple-agenda-summary {
    display: grid !important;
    gap: 10px !important;
}

.simple-occupancy-list div,
.simple-agenda-summary article {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px !important;
    padding: 9px 10px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
}

.simple-occupancy-list span,
.simple-agenda-summary span {
    color: #475569 !important;
    font-size: 13px !important;
    font-weight: 760 !important;
}

.simple-occupancy-list strong,
.simple-agenda-summary strong {
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 780 !important;
}

.simple-occupancy-list small,
.simple-agenda-summary small {
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

/* Fase 33: correcciones de proporcion, tareas y calendario interno. */
.admin-task-form {
    grid-template-columns: minmax(0, 1.25fr) minmax(150px, 0.8fr) 150px 150px auto !important;
    overflow: hidden !important;
}

.admin-task-form > * {
    min-width: 0 !important;
}

.admin-task-form .button {
    width: 100% !important;
    min-width: 92px !important;
}

.nav-label {
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: 0.08em !important;
}

.sidebar-toggle {
    position: absolute !important;
    top: 92px !important;
    right: -18px !important;
    z-index: 30 !important;
    border-color: #d7e0ea !important;
    background: #111827 !important;
    color: #fff !important;
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18) !important;
}

.sidebar-toggle:hover {
    background: #0f766e !important;
}

body.sidebar-collapsed .sidebar-toggle {
    right: -17px !important;
}

.task-calendar-shell {
    display: grid;
    gap: 12px;
}

.task-calendar-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
}

.task-calendar-toolbar h2 {
    margin: 0;
    color: var(--erp-text);
    font-size: clamp(24px, 2.6vw, 34px);
    font-weight: 650;
    letter-spacing: 0;
}

.task-calendar-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.task-calendar-actions .button,
.task-calendar-actions .icon-button,
.task-calendar-actions .segmented-control a {
    min-height: 38px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 720 !important;
}

.task-calendar-month {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    padding: 0;
    background: #dbe4f0;
}

.task-calendar-month article {
    min-height: 112px;
    padding: 10px;
    background: #fff;
}

.task-calendar-month article.is-muted {
    background: #f8fafc;
}

.task-calendar-month article.is-today {
    background: #eff6ff;
}

.task-calendar-month header,
.task-calendar-time article header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.task-calendar-month header strong,
.task-calendar-time article header strong {
    color: #111827;
    font-size: 14px;
}

.task-calendar-month article > div {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}

.task-calendar-month a,
.task-calendar-item {
    position: relative;
    display: grid;
    gap: 2px;
    padding: 8px 9px;
    border: 1px solid #d8e1ee;
    border-left: 4px solid #635bff;
    border-radius: 10px;
    background: #fff;
    color: #111827;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.task-calendar-month a strong,
.task-calendar-item strong {
    overflow: hidden;
    font-size: 12px;
    font-weight: 760;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-calendar-month a small,
.task-calendar-item small {
    color: #64748b;
    font-size: 11px;
    font-weight: 650;
}

.task-calendar-time {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    min-height: calc(100vh - 230px);
    padding: 0;
    overflow: auto;
}

.task-calendar-time aside {
    display: grid;
    grid-template-rows: 48px repeat(13, 56px);
    background: #fff;
    border-right: 1px solid #dbe4f0;
}

.task-calendar-time aside strong {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 6px;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.task-calendar-time-columns {
    display: grid;
    grid-template-columns: repeat(var(--task-days), minmax(170px, 1fr));
}

.task-calendar-time article {
    min-width: 0;
    border-right: 1px solid #dbe4f0;
}

.task-calendar-time article header {
    min-height: 48px;
    padding: 8px 12px;
    border-bottom: 1px solid #dbe4f0;
    background: #f8fafc;
}

.task-calendar-time article.is-today header {
    background: #eff6ff;
}

.task-day-lane {
    position: relative;
    display: grid;
    grid-template-rows: repeat(13, 56px);
    min-height: 728px;
    background:
        linear-gradient(to bottom, rgba(148, 163, 184, 0.28) 1px, transparent 1px),
        #fff;
    background-size: 100% 56px;
}

.task-day-lane > div:not(.task-all-day-stack) {
    border-bottom: 1px solid #eef2f7;
}

.task-all-day-stack {
    position: absolute;
    inset: 12px 12px auto;
    display: grid;
    gap: 8px;
    max-width: min(430px, calc(100% - 24px));
}

.task-all-day-stack > span,
.task-calendar-month .muted {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 650;
}

.task-calendar-item.is-high {
    border-left-color: #ef4444;
}

.task-calendar-item.is-low {
    border-left-color: #14b8a6;
}

.status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-content: start !important;
}

.status-row {
    min-height: 74px !important;
    border-radius: 18px !important;
    background: #f8fafc !important;
}

.status-row strong {
    font-size: 26px !important;
}

.centered-actions,
.platform-actions {
    justify-content: center !important;
    align-items: center !important;
}

.platform-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.platform-actions .table-action {
    min-width: 94px !important;
    justify-content: center !important;
}

.pro-calendar-column-head {
    overflow: visible !important;
}

.pro-calendar-column-head strong,
.pro-calendar-column-head span {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.company-show-v2 > .form-actions.section-gap,
.company-show-v2 > .metric-grid {
    display: none !important;
}

.company-command {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
    margin-bottom: 14px !important;
}

.company-command h2 {
    margin: 0 !important;
    color: var(--erp-text) !important;
    font-size: clamp(24px, 2.2vw, 32px) !important;
    font-weight: 720 !important;
    letter-spacing: 0 !important;
}

.company-command-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

.company-command-actions .button,
.company-command-actions .stripe-muted {
    min-height: 38px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 740 !important;
}

.stripe-muted {
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid #fed7aa;
    color: #9a3412;
    background: #fff7ed;
}

.company-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.company-overview-grid article {
    display: grid;
    gap: 8px;
    min-height: 126px;
    padding: 18px;
    border: 1px solid var(--erp-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.company-overview-grid span {
    color: var(--erp-subtle);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.company-overview-grid strong {
    overflow: hidden;
    color: var(--erp-text);
    font-size: clamp(22px, 2.4vw, 31px);
    font-weight: 760;
    line-height: 1.06;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.company-overview-grid small {
    color: var(--erp-muted);
    font-size: 13px;
    font-weight: 580;
}

.commercial-landing {
    background: linear-gradient(180deg, #fbfcfd 0%, #f4f7f8 100%) !important;
}

.landing-nav {
    width: min(1120px, calc(100% - 48px)) !important;
    border-radius: 20px !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08) !important;
}

.landing-hero {
    width: min(1120px, calc(100% - 48px)) !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.72fr) !important;
    gap: 42px !important;
    padding: 76px 0 26px !important;
}

.landing-hero h1 {
    max-width: 720px !important;
    font-size: clamp(44px, 6vw, 76px) !important;
    line-height: 0.96 !important;
    letter-spacing: -0.035em !important;
}

.landing-lead {
    max-width: 620px !important;
    font-size: clamp(17px, 1.55vw, 20px) !important;
}

.landing-proof {
    display: none !important;
}

.landing-product-card {
    border-radius: 28px !important;
    box-shadow: 0 30px 70px rgba(15, 23, 42, 0.11) !important;
}

.landing-section {
    width: min(1120px, calc(100% - 48px)) !important;
    border-radius: 26px !important;
    padding: 28px !important;
}

.landing-guide-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.landing-guide-grid article {
    min-height: 190px !important;
    border-radius: 22px !important;
}

.landing-feature-grid,
.landing-compact-section,
.landing-modules:not(.landing-compact-section) {
    display: none !important;
}

.landing-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.landing-plan-card {
    border-radius: 24px !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07) !important;
}

.landing-access {
    grid-template-columns: minmax(0, 0.72fr) minmax(360px, 1fr) !important;
}

.landing-access-copy {
    align-self: center !important;
}

.landing-access-copy h3 {
    font-size: clamp(30px, 3.8vw, 48px) !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;
}

@media (max-width: 1180px) {
    .admin-task-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .admin-task-form .button {
        grid-column: 1 / -1;
    }

    .task-calendar-toolbar {
        grid-template-columns: 1fr;
    }

    .task-calendar-actions {
        justify-content: flex-start;
    }

    .task-calendar-month {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Clinc unified polish pass: jade premium, compact commerce and scalable admin tables. */
:root {
    --clinc-primary: #0f766e;
    --clinc-primary-hover: #115e59;
    --clinc-primary-soft: #ccfbf1;
    --clinc-primary-line: #99f6e4;
    --clinc-ink: #0f172a;
    --clinc-muted: #64748b;
    --clinc-bg: #f8fafc;
    --clinc-panel: #ffffff;
    --clinc-border: #dbe7ef;
}

.landing-vertical-general {
    --landing-accent: var(--clinc-primary) !important;
    --landing-soft: var(--clinc-primary-soft) !important;
    --landing-dark: var(--clinc-ink) !important;
}

.landing-nav {
    max-width: min(1760px, calc(100vw - 32px)) !important;
    min-height: 74px !important;
    padding: .8rem 1rem !important;
    border-radius: 28px !important;
}

.landing-brand img {
    width: 138px !important;
    height: auto !important;
    object-fit: contain !important;
}

.landing-nav-links {
    gap: clamp(1.4rem, 4vw, 4.8rem) !important;
}

.landing-nav-actions {
    gap: .7rem !important;
    margin-left: auto !important;
}

.landing-button,
.landing-link-button,
.button,
.table-action {
    letter-spacing: 0 !important;
}

.landing-button.primary,
.landing-button.secondary,
.landing-button.large {
    border-radius: 18px !important;
    min-height: 54px !important;
    padding: 0 1.55rem !important;
}

.landing-button.primary {
    background: var(--clinc-primary) !important;
    border-color: var(--clinc-primary) !important;
    color: #fff !important;
    box-shadow: 0 18px 34px rgba(15, 118, 110, .18) !important;
}

.landing-button.secondary {
    background: #fff !important;
    border-color: #cbd5e1 !important;
    color: var(--clinc-ink) !important;
}

.landing-link-button {
    color: #475569 !important;
}

.landing-commercial-hero {
    max-width: min(1760px, calc(100vw - 48px)) !important;
    min-height: calc(100svh - 130px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(420px, .82fr) !important;
    gap: clamp(2rem, 5vw, 5rem) !important;
    align-items: center !important;
    padding: clamp(2rem, 5vw, 4rem) 1rem clamp(1.5rem, 3vw, 2.4rem) !important;
    overflow: hidden !important;
}

.landing-hero-copy {
    max-width: 900px !important;
}

.landing-hero-copy h1 {
    font-size: clamp(4.2rem, 7.2vw, 8.6rem) !important;
    line-height: .94 !important;
    max-width: 950px !important;
    margin-bottom: 1.4rem !important;
}

.landing-lead {
    max-width: 880px !important;
    font-size: clamp(1.2rem, 1.55vw, 1.65rem) !important;
    line-height: 1.42 !important;
    color: #475569 !important;
}

.landing-sector-proof,
.landing-sector-section,
.landing-sector-choice {
    display: none !important;
}

.landing-theme-note {
    max-width: 760px !important;
    margin-top: .75rem !important;
    color: #64748b !important;
    font-size: 1rem !important;
}

.landing-hero-actions {
    gap: .9rem !important;
    margin-top: 1.8rem !important;
}

.landing-product-peek {
    width: min(100%, 680px) !important;
    justify-self: center !important;
    min-height: 0 !important;
    max-height: min(720px, calc(100svh - 170px)) !important;
    padding: clamp(1.5rem, 2vw, 2.2rem) !important;
    border-radius: 34px !important;
    background:
        radial-gradient(circle at 92% 5%, rgba(20, 184, 166, .34), transparent 34%),
        linear-gradient(145deg, #0f172a, #0f3f3a) !important;
    overflow: hidden !important;
}

.landing-product-peek > strong {
    display: block !important;
    font-size: clamp(2rem, 3vw, 3.65rem) !important;
    line-height: .98 !important;
    max-width: 620px !important;
    margin: 1.1rem 0 1rem !important;
}

.peek-window {
    height: clamp(280px, 37svh, 410px) !important;
    border-radius: 28px !important;
    overflow: hidden !important;
}

.peek-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: minmax(160px, 1.25fr) minmax(90px, .75fr) !important;
    gap: .8rem !important;
    height: calc(100% - 38px) !important;
    padding: .85rem !important;
}

.peek-agenda {
    grid-column: 1 / -1 !important;
    min-height: 0 !important;
}

.peek-calendar {
    min-height: 145px !important;
    overflow: hidden !important;
}

.peek-clients,
.peek-chart {
    min-height: 92px !important;
    overflow: hidden !important;
}

.peek-people span:nth-child(n+2) {
    display: none !important;
}

.peek-micro-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .7rem !important;
    margin-top: 1rem !important;
}

.peek-micro-tabs button {
    min-width: 0 !important;
    border-radius: 16px !important;
    color: rgba(255,255,255,.88) !important;
    border-color: rgba(255,255,255,.18) !important;
    background: rgba(255,255,255,.08) !important;
}

.peek-micro-tabs button.is-active {
    background: rgba(204, 251, 241, .18) !important;
    border-color: rgba(153, 246, 228, .55) !important;
    color: #fff !important;
}

.peek-micro-tabs small {
    display: none !important;
}

.landing-service-tour,
.landing-pricing-section,
#acceso {
    max-width: min(1760px, calc(100vw - 48px)) !important;
    border-radius: 30px !important;
    padding: clamp(1.6rem, 3vw, 3rem) !important;
}

.landing-section-heading h2 {
    font-size: clamp(3rem, 5vw, 5.6rem) !important;
    line-height: .98 !important;
}

.landing-billing-toggle {
    width: fit-content !important;
    max-width: 100% !important;
    padding: .35rem !important;
    border-radius: 18px !important;
    background: #f1f5f9 !important;
    border: 1px solid #dbe7ef !important;
}

.landing-billing-toggle button {
    min-height: 48px !important;
    border-radius: 14px !important;
    color: #475569 !important;
    background: transparent !important;
}

.landing-billing-toggle button small {
    color: inherit !important;
    opacity: .85 !important;
}

.landing-billing-toggle button.is-active {
    background: var(--clinc-primary) !important;
    color: #fff !important;
    box-shadow: 0 14px 28px rgba(15, 118, 110, .18) !important;
}

.landing-plan-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    overflow: visible !important;
}

.landing-plan-card {
    min-width: 0 !important;
    border-radius: 28px !important;
}

.landing-plan-card .landing-button {
    margin-top: auto !important;
}

.landing-guide-drawer {
    position: fixed !important;
    z-index: 10000 !important;
    inset: auto 32px 32px auto !important;
    width: min(520px, calc(100vw - 40px)) !important;
    max-height: min(760px, calc(100svh - 64px)) !important;
    overflow: auto !important;
    border-radius: 28px !important;
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(18px) !important;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .2) !important;
    transition: opacity .22s ease, transform .22s ease !important;
}

.landing-guide-drawer[hidden] {
    display: none !important;
}

.landing-guide-drawer::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
}

.landing-guide-progress {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .6rem !important;
}

.landing-guide-progress button,
.landing-guide-actions .landing-button {
    min-height: 46px !important;
}

.landing-guide-progress button.is-active {
    background: var(--clinc-primary-soft) !important;
    color: #0f766e !important;
}

/* Register flow: no horizontal scroll, legal as modal, payment after value. */
body:has(.register-builder-v3) {
    background: radial-gradient(circle at 0 0, rgba(204, 251, 241, .45), transparent 32%), #f8fafc !important;
}

@media (min-width: 1100px) {
    body:has(.register-builder-v3) {
        overflow: hidden !important;
    }

    .main:has(.register-builder-v3) {
        min-height: 100svh !important;
        height: 100svh !important;
        overflow: hidden !important;
        padding: 12px !important;
    }

    .register-builder-v3 {
        height: calc(100svh - 24px) !important;
        max-width: 1720px !important;
        grid-template-columns: minmax(300px, .34fr) minmax(0, 1fr) !important;
        gap: 16px !important;
        margin: 0 auto !important;
        overflow: hidden !important;
    }

    .register-builder-v3 .register-builder-copy {
        min-height: 0 !important;
        padding: clamp(1.4rem, 2vw, 2.2rem) !important;
        align-content: center !important;
    }

    .register-builder-v3 .register-builder-copy img {
        width: 156px !important;
    }

    .register-builder-v3 .register-builder-copy h2 {
        font-size: clamp(2.4rem, 3.2vw, 4rem) !important;
        line-height: 1.05 !important;
    }

    .register-builder-v3 .register-builder-copy p {
        font-size: clamp(1rem, 1.3vw, 1.35rem) !important;
        line-height: 1.45 !important;
    }

    .register-builder-form.is-wizard {
        height: 100% !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-rows: auto minmax(0, 1fr) auto auto !important;
        padding: 14px !important;
        gap: 10px !important;
        overflow: hidden !important;
    }

    .register-wizard-progress {
        grid-template-columns: repeat(auto-fit, minmax(86px, 1fr)) !important;
        gap: 6px !important;
        padding: 7px !important;
        border-radius: 24px !important;
    }

    .register-wizard-progress button {
        min-height: 48px !important;
        padding: 5px !important;
        border-radius: 18px !important;
    }

    .register-builder-form.is-wizard .register-section.is-active {
        height: 100% !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: clamp(1rem, 1.5vw, 1.5rem) !important;
    }

    .register-form-grid,
    .register-term-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .register-plan-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .register-extra-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        max-height: 100% !important;
        overflow: hidden !important;
    }

    .register-plan-card,
    .register-extra-card,
    .register-term-card {
        min-height: 0 !important;
    }

    .legal-consent-compact .legal-consent-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .legal-consent-compact .legal-consent-card {
        min-height: 0 !important;
        padding: 1rem !important;
    }

    .register-submit-row {
        min-height: 68px !important;
        padding: .7rem .9rem !important;
        border-radius: 22px !important;
    }
}

.register-term-card input:checked + span,
.register-extra-card input:checked + span {
    border-color: var(--clinc-primary-line) !important;
    background: #ecfdf5 !important;
    color: var(--clinc-ink) !important;
}

.register-term-card input:checked + span strong,
.register-term-card input:checked + span small,
.register-extra-card input:checked + span strong,
.register-extra-card input:checked + span small {
    color: var(--clinc-ink) !important;
}

.legal-modal {
    position: fixed !important;
    inset: 0 !important;
    display: grid !important;
    place-items: center !important;
    z-index: 10050 !important;
    padding: 26px !important;
    background: rgba(15, 23, 42, .46) !important;
    backdrop-filter: blur(16px) !important;
}

.legal-modal[hidden] {
    display: none !important;
}

.legal-modal-panel {
    position: relative !important;
    inset: auto !important;
    width: min(980px, calc(100vw - 52px)) !important;
    max-height: min(780px, calc(100svh - 52px)) !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
}

.legal-modal-panel .legal-scroll-box {
    overflow: auto !important;
    min-height: 0 !important;
}

/* Platform companies: scalable table and calmer company management. */
.company-index-v3 {
    display: grid !important;
    gap: 1rem !important;
}

.company-filter-bar {
    grid-template-columns: minmax(260px, 1.4fr) minmax(180px, .8fr) minmax(220px, 1fr) auto auto !important;
    align-items: end !important;
}

.company-table-shell {
    overflow: auto !important;
    border: 1px solid var(--clinc-border) !important;
    border-radius: 24px !important;
    background: #fff !important;
}

.company-table {
    width: 100% !important;
    min-width: 1060px !important;
    border-collapse: collapse !important;
}

.company-table th {
    background: #f1f5f9 !important;
    color: #64748b !important;
    font-size: .76rem !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    text-align: left !important;
    padding: .95rem 1rem !important;
}

.company-table td {
    padding: .9rem 1rem !important;
    border-top: 1px solid #e2e8f0 !important;
    color: var(--clinc-ink) !important;
    vertical-align: middle !important;
}

.company-table tbody tr:hover {
    background: #ecfdf5 !important;
}

.company-cell-main {
    display: flex !important;
    align-items: center !important;
    gap: .75rem !important;
}

.company-cell-main span:last-child,
.company-table td {
    min-width: 0 !important;
}

.company-cell-main strong,
.company-table strong {
    color: var(--clinc-ink) !important;
}

.company-table small {
    display: block !important;
    color: #64748b !important;
    margin-top: .2rem !important;
}

.status-dot {
    width: 12px !important;
    height: 12px !important;
    border-radius: 999px !important;
    flex: 0 0 auto !important;
    background: #94a3b8 !important;
}

.status-dot.is-success { background: #10b981 !important; }
.status-dot.is-warning { background: #f59e0b !important; }
.status-dot.is-danger { background: #ef4444 !important; }

.status-pill.is-success {
    background: #dcfce7 !important;
    color: #166534 !important;
}

.status-pill.is-warning {
    background: #fef3c7 !important;
    color: #92400e !important;
}

.status-pill.is-danger {
    background: #fee2e2 !important;
    color: #991b1b !important;
}

.company-plan-pill {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 30px !important;
    padding: 0 .75rem !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    font-weight: 800 !important;
}

.company-row-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .45rem !important;
    white-space: nowrap !important;
}

.company-row-actions form {
    margin: 0 !important;
}

.company-row-actions .table-action {
    min-height: 38px !important;
    min-width: 98px !important;
    border-radius: 12px !important;
    padding: 0 .85rem !important;
}

.company-row-actions .table-action.primary {
    background: var(--clinc-primary) !important;
    color: #fff !important;
    border-color: var(--clinc-primary) !important;
}

.company-show-v3 {
    display: grid !important;
    gap: 1rem !important;
}

.company-command {
    display: flex !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    align-items: center !important;
}

.company-command-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: .55rem !important;
}

.company-command-actions form {
    margin: 0 !important;
}

.company-command-actions .button {
    min-width: 98px !important;
}

.company-health-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.company-health-grid article {
    background: #fff !important;
    border: 1px solid var(--clinc-border) !important;
    border-radius: 24px !important;
    padding: 1.1rem !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .05) !important;
}

.company-health-grid span {
    display: block !important;
    color: #94a3b8 !important;
    font-size: .78rem !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    letter-spacing: .06em !important;
}

.company-health-grid strong {
    display: block !important;
    margin-top: .45rem !important;
    font-size: clamp(1.55rem, 2vw, 2.2rem) !important;
    color: var(--clinc-ink) !important;
}

.company-health-grid small {
    color: #64748b !important;
}

.company-health-grid article.is-success { border-color: #86efac !important; background: #f0fdf4 !important; }
.company-health-grid article.is-warning { border-color: #fde68a !important; background: #fffbeb !important; }
.company-health-grid article.is-danger { border-color: #fecaca !important; background: #fef2f2 !important; }

.company-manager-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr) !important;
    gap: 1rem !important;
    align-items: start !important;
}

.company-subscription-simple,
.company-users-simple {
    display: grid !important;
    gap: 1rem !important;
}

.company-subscription-controls {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: .8rem !important;
}

.company-payment-strip {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .7rem !important;
}

.company-payment-strip span,
.module-mini-card {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: .85rem !important;
}

.company-payment-strip small,
.module-mini-card small {
    display: block !important;
    color: #64748b !important;
    font-weight: 700 !important;
}

.company-payment-strip b,
.module-mini-card strong {
    color: var(--clinc-ink) !important;
}

.module-mini-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .65rem !important;
}

.module-mini-card {
    display: flex !important;
    align-items: center !important;
    gap: .65rem !important;
    cursor: pointer !important;
}

.module-mini-card input {
    width: 18px !important;
    height: 18px !important;
    accent-color: var(--clinc-primary) !important;
}

.module-mini-card.is-enabled {
    border-color: var(--clinc-primary-line) !important;
    background: #ecfdf5 !important;
}

.company-user-list {
    display: grid !important;
    gap: .75rem !important;
}

.company-user-list article {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: .75rem !important;
    align-items: center !important;
    padding: .8rem !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 18px !important;
    background: #fff !important;
}

.company-user-list article em {
    grid-column: 2 / -1 !important;
    font-style: normal !important;
    color: #64748b !important;
    font-size: .88rem !important;
}

.user-avatar {
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 14px !important;
    background: var(--clinc-primary-soft) !important;
    color: #134e4a !important;
    font-weight: 900 !important;
}

.role-pill {
    min-height: 30px !important;
    padding: 0 .7rem !important;
    border-radius: 999px !important;
    background: #f1f5f9 !important;
    color: #334155 !important;
    font-size: .82rem !important;
    font-weight: 800 !important;
}

/* Do not let old vertical experiments make the ERP unreadable. */
body[class*="vertical-"] .main,
body[class*="vertical-"] main,
body[class*="vertical-"] .panel,
body[class*="vertical-"] .calendar-focus-shell,
body[class*="vertical-"] .calendar-shell,
body[class*="vertical-"] .owner-dashboard-v2 {
    background: var(--clinc-bg) !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .panel,
body[class*="vertical-"] .metric-card,
body[class*="vertical-"] .owner-kpi-card,
body[class*="vertical-"] .calendar-focus-header,
body[class*="vertical-"] .calendar-focus-grid {
    background: #fff !important;
    border-color: var(--clinc-border) !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .button.primary,
body[class*="vertical-"] .table-action.primary {
    background: var(--clinc-primary) !important;
    border-color: var(--clinc-primary) !important;
    color: #fff !important;
}

@media (max-width: 1180px) {
    .landing-commercial-hero,
    .company-manager-grid,
    .company-health-grid {
        grid-template-columns: 1fr !important;
    }

    .landing-product-peek {
        max-height: none !important;
    }

    .company-filter-bar,
    .company-subscription-controls,
    .company-payment-strip,
    .module-mini-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Final lock - unified Clinc jade system, Stripe-first stats and compact conversion flow. */
:root {
    --clinc-jade: #0f766e;
    --clinc-jade-hover: #115e59;
    --clinc-jade-soft: #ccfbf1;
    --clinc-bg: #f8fafc;
    --clinc-soft-bg: #f1f5f9;
    --clinc-card: #ffffff;
    --clinc-ink: #0f172a;
    --clinc-muted: #64748b;
    --clinc-border: #dbe7ef;
}

body[class*="vertical-"] {
    --vertical-accent: var(--clinc-jade) !important;
    --vertical-soft: var(--clinc-jade-soft) !important;
    --vertical-dark: var(--clinc-ink) !important;
    --vertical-surface: var(--clinc-card) !important;
    --vertical-bg: var(--clinc-bg) !important;
    --vertical-surface-soft: var(--clinc-soft-bg) !important;
    --vertical-text: var(--clinc-ink) !important;
    --vertical-muted: var(--clinc-muted) !important;
    --vertical-sidebar: #0f172a !important;
    background: var(--clinc-bg) !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .main {
    background:
        radial-gradient(circle at 0% 0%, rgba(20, 184, 166, 0.12), transparent 26rem),
        linear-gradient(135deg, #f8fafc 0%, #eefdfa 100%) !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .topbar,
body[class*="vertical-"] .metric-card,
body[class*="vertical-"] .panel,
body[class*="vertical-"] .card,
body[class*="vertical-"] .dashboard-card,
body[class*="vertical-"] .owner-panel,
body[class*="vertical-"] .invoice-panel,
body[class*="vertical-"] .company-show-v2 > section,
body[class*="vertical-"] .calendar-focus-shell,
body[class*="vertical-"] .support-admin-card,
body[class*="vertical-"] .settings-panel,
body[class*="vertical-"] .task-card {
    background: var(--clinc-card) !important;
    border: 1px solid var(--clinc-border) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08) !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .topbar h1,
body[class*="vertical-"] h1,
body[class*="vertical-"] h2,
body[class*="vertical-"] h3,
body[class*="vertical-"] .metric-card strong,
body[class*="vertical-"] .metric-card span,
body[class*="vertical-"] .dashboard-card strong,
body[class*="vertical-"] .dashboard-card span {
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] p,
body[class*="vertical-"] small,
body[class*="vertical-"] .notes,
body[class*="vertical-"] .metric-card small,
body[class*="vertical-"] .eyebrow {
    color: var(--clinc-muted) !important;
}

body[class*="vertical-"] .button.primary,
body[class*="vertical-"] button[type="submit"].button,
body[class*="vertical-"] .nav a.active,
body[class*="vertical-"] .nav-locked.active {
    background: var(--clinc-jade) !important;
    border-color: var(--clinc-jade) !important;
    color: #ffffff !important;
}

body[class*="vertical-"] .button.primary:hover,
body[class*="vertical-"] button[type="submit"].button:hover {
    background: var(--clinc-jade-hover) !important;
    border-color: var(--clinc-jade-hover) !important;
}

body[class*="vertical-"] .nav a.active .nav-icon,
body[class*="vertical-"] .nav-locked.active .nav-icon {
    background: rgba(255, 255, 255, 0.13) !important;
    color: #ccfbf1 !important;
}

body[class*="vertical-"] input:focus,
body[class*="vertical-"] select:focus,
body[class*="vertical-"] textarea:focus {
    border-color: #14b8a6 !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.18) !important;
}

body[class*="vertical-"] .calendar-focus-shell,
body[class*="vertical-"] .pro-calendar,
body[class*="vertical-"] .calendar-grid,
body[class*="vertical-"] .calendar-column,
body[class*="vertical-"] .calendar-day-lane,
body[class*="vertical-"] .calendar-time-rail {
    background: #ffffff !important;
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .calendar-time-rail strong,
body[class*="vertical-"] .calendar-column header strong,
body[class*="vertical-"] .calendar-event strong {
    color: var(--clinc-ink) !important;
}

body[class*="vertical-"] .calendar-event {
    background: #ffffff !important;
    border-color: rgba(15, 118, 110, 0.22) !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important;
}

.stats-shell .revenue-headline {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: end !important;
    gap: 0.25rem 1rem !important;
}

.stats-shell .revenue-headline small {
    grid-column: 1 / -1 !important;
    color: var(--clinc-muted) !important;
    font-size: 0.82rem !important;
}

.company-show-v2 > .metric-grid {
    display: none !important;
}

.company-command {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 1rem !important;
}

.company-command h2 {
    font-size: clamp(1.8rem, 2.6vw, 2.6rem) !important;
    line-height: 1 !important;
}

.company-command-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 0.65rem !important;
}

.company-command-actions .button,
.company-command-actions button {
    min-width: 118px !important;
    justify-content: center !important;
}

.company-stripe-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.65fr) auto !important;
    align-items: center !important;
    gap: 1rem !important;
}

.subscription-console {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.45fr) !important;
}

.contract-services-panel .contract-service-grid {
    max-height: 360px !important;
    overflow-y: auto !important;
    padding-right: 0.25rem !important;
}

.commercial-landing {
    --landing-accent: var(--clinc-jade) !important;
    --landing-soft: var(--clinc-jade-soft) !important;
    --landing-dark: var(--clinc-ink) !important;
    --landing-text: var(--clinc-ink) !important;
    --landing-muted: var(--clinc-muted) !important;
    overflow-x: hidden !important;
}

body.commercial-landing .landing-nav {
    width: min(1760px, calc(100% - 32px)) !important;
    min-height: 72px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    gap: clamp(1rem, 3vw, 3rem) !important;
    align-items: center !important;
}

body.commercial-landing .landing-nav-links {
    justify-content: center !important;
}

body.commercial-landing .landing-nav-actions {
    justify-content: flex-end !important;
}

body.commercial-landing .landing-commercial-hero {
    width: min(1760px, calc(100% - 48px)) !important;
    min-height: calc(100dvh - 116px) !important;
    padding: clamp(22px, 4vw, 56px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(420px, 0.78fr) !important;
    align-items: center !important;
    gap: clamp(2rem, 4vw, 5rem) !important;
    overflow: hidden !important;
}

body.commercial-landing .landing-commercial-hero .landing-hero-copy {
    max-width: 900px !important;
}

body.commercial-landing .landing-commercial-hero h1 {
    max-width: 900px !important;
    font-size: clamp(3.7rem, 5.2vw, 6.15rem) !important;
    line-height: 0.94 !important;
    letter-spacing: 0 !important;
}

body.commercial-landing .landing-commercial-hero .landing-lead {
    max-width: 930px !important;
    font-size: clamp(1.15rem, 1.35vw, 1.5rem) !important;
    line-height: 1.48 !important;
}

body.commercial-landing .landing-button.primary,
body.commercial-landing .landing-button.primary.large,
body.commercial-landing .landing-hero-actions .landing-button.primary {
    background: var(--clinc-jade) !important;
    border-color: var(--clinc-jade) !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-button.secondary,
body.commercial-landing .landing-link-button {
    background: #ffffff !important;
    color: var(--clinc-ink) !important;
    border-color: #cbd5e1 !important;
    box-shadow: none !important;
}

body.commercial-landing .landing-product-peek {
    height: min(620px, calc(100dvh - 155px)) !important;
    min-height: 500px !important;
    max-height: 620px !important;
    padding: clamp(22px, 2.2vw, 34px) !important;
    border-radius: 42px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 90% 8%, rgba(20, 184, 166, 0.34), transparent 16rem),
        linear-gradient(145deg, #0f172a 0%, #123f3b 100%) !important;
}

body.commercial-landing .landing-product-peek > strong {
    font-size: clamp(2rem, 2.55vw, 3.25rem) !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
}

body.commercial-landing .landing-product-peek > small {
    display: block !important;
    max-width: 100% !important;
    font-size: clamp(0.92rem, 1vw, 1.05rem) !important;
    line-height: 1.45 !important;
    color: rgba(255, 255, 255, 0.82) !important;
}

body.commercial-landing .peek-window {
    height: 292px !important;
    overflow: hidden !important;
}

body.commercial-landing .peek-grid {
    grid-template-rows: minmax(0, 1fr) 72px !important;
}

body.commercial-landing .peek-micro-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    transform: none !important;
}

body.commercial-landing .peek-micro-tabs button {
    min-width: 0 !important;
    color: rgba(255, 255, 255, 0.88) !important;
}

body.commercial-landing .peek-micro-tabs button.is-active,
body.commercial-landing .peek-micro-tabs button:hover {
    background: rgba(20, 184, 166, 0.22) !important;
    border-color: rgba(153, 246, 228, 0.62) !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-guide-drawer[hidden] {
    display: none !important;
}

body.commercial-landing .landing-guide-drawer {
    position: fixed !important;
    z-index: 12000 !important;
    right: clamp(18px, 3vw, 42px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: min(520px, calc(100vw - 32px)) !important;
    max-height: calc(100dvh - 42px) !important;
    overflow: auto !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid var(--clinc-border) !important;
    border-radius: 32px !important;
    box-shadow: 0 34px 90px rgba(15, 23, 42, 0.24) !important;
    filter: none !important;
    backdrop-filter: blur(18px) !important;
}

body.commercial-landing.guide-open::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 11990 !important;
    background: rgba(15, 23, 42, 0.22) !important;
    backdrop-filter: blur(3px) !important;
}

.register-builder {
    width: min(1680px, calc(100% - 28px)) !important;
    height: calc(100dvh - 28px) !important;
    max-height: calc(100dvh - 28px) !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-columns: minmax(340px, 0.36fr) minmax(0, 1fr) !important;
    gap: 1.25rem !important;
}

.register-builder-copy {
    min-height: 0 !important;
    height: 100% !important;
    padding: clamp(26px, 3vw, 56px) !important;
    justify-content: center !important;
}

.register-builder-copy h2 {
    font-size: clamp(2.6rem, 3.25vw, 4.2rem) !important;
    line-height: 1.05 !important;
}

.register-builder-copy p {
    max-width: 420px !important;
}

.register-builder-form.is-wizard {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto auto !important;
}

.register-wizard-progress {
    min-height: 78px !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}

.register-builder-form.is-wizard .register-section {
    min-height: 0 !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: clamp(1rem, 2vw, 1.75rem) !important;
}

.register-section.compact {
    min-height: 0 !important;
}

.register-theme-step {
    display: grid !important;
    grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.82fr) !important;
    gap: 1.1rem !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.register-theme-step .vertical-style-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    overflow: hidden !important;
}

.vertical-style-card {
    min-height: 148px !important;
    padding: 1.25rem !important;
    border-color: var(--clinc-border) !important;
    background: linear-gradient(145deg, #ffffff, #f8fafc) !important;
}

.vertical-style-card::after {
    background: rgba(20, 184, 166, 0.12) !important;
}

.vertical-style-card:has(input:checked) {
    border-color: var(--clinc-jade) !important;
    background: linear-gradient(145deg, #ecfdf5, #ffffff) !important;
    box-shadow: 0 18px 42px rgba(15, 118, 110, 0.12) !important;
}

.vertical-style-swatch {
    background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
}

.register-theme-preview {
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-color: rgba(15, 118, 110, 0.22) !important;
}

.register-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    overflow: hidden !important;
}

.register-plan-grid .plan-card {
    min-height: 0 !important;
    padding: 1.4rem !important;
}

.legal-consent-compact .legal-consent-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.legal-consent-compact .legal-consent-card {
    min-height: 0 !important;
    padding: 1.35rem !important;
}

.legal-short-copy {
    max-height: 8.8rem !important;
    overflow: hidden !important;
}

.legal-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 20000 !important;
    display: grid !important;
    place-items: center !important;
    padding: 1.25rem !important;
    background: rgba(15, 23, 42, 0.34) !important;
    backdrop-filter: blur(16px) !important;
}

.legal-modal[hidden] {
    display: none !important;
}

.legal-modal-panel {
    width: min(1000px, calc(100vw - 40px)) !important;
    height: min(760px, calc(100dvh - 40px)) !important;
    max-height: calc(100dvh - 40px) !important;
    overflow: hidden !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    background: #ffffff !important;
    border: 1px solid var(--clinc-border) !important;
    border-radius: 28px !important;
    box-shadow: 0 34px 100px rgba(15, 23, 42, 0.28) !important;
}

.legal-modal-panel .legal-scroll-box {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.auth-premium {
    min-height: calc(100dvh - 2rem) !important;
    max-height: calc(100dvh - 2rem) !important;
    overflow: hidden !important;
    grid-template-columns: minmax(420px, 0.95fr) minmax(420px, 0.8fr) !important;
    align-items: center !important;
    gap: clamp(1.5rem, 3vw, 3.5rem) !important;
    padding: clamp(1rem, 2.5vw, 2.5rem) !important;
}

.auth-premium-copy,
.auth-premium-card {
    min-height: 0 !important;
    height: auto !important;
}

.auth-premium-copy {
    padding: clamp(2rem, 4vw, 4rem) !important;
}

.auth-premium-copy img {
    width: clamp(150px, 11vw, 220px) !important;
    height: auto !important;
    object-fit: contain !important;
}

.auth-premium-copy h2 {
    font-size: clamp(3.4rem, 5vw, 6.2rem) !important;
    line-height: 0.96 !important;
}

.auth-premium-card {
    padding: clamp(2rem, 3.2vw, 3.6rem) !important;
}

.auth-premium-card input {
    min-height: 58px !important;
}

@media (max-width: 1280px) {
    body.commercial-landing .landing-commercial-hero {
        grid-template-columns: 1fr !important;
        height: auto !important;
        min-height: auto !important;
        overflow: visible !important;
    }

    body.commercial-landing .landing-product-peek {
        height: auto !important;
        min-height: 0 !important;
    }

    .register-builder,
    .auth-premium {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        grid-template-columns: 1fr !important;
    }
}

/* Final palette application */
body {
    background:
        radial-gradient(circle at 4% 0%, rgba(20, 184, 166, 0.10), transparent 28rem),
        var(--erp-bg) !important;
}

.sidebar {
    border-right-color: rgba(15, 23, 42, 0.72) !important;
    background: var(--erp-sidebar-bg) !important;
}

.brand-title {
    color: #ffffff !important;
}

.brand-subtitle,
.nav-label {
    color: var(--erp-sidebar-text) !important;
}

.brand-mark {
    background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
}

.nav a,
.nav-locked {
    color: var(--erp-sidebar-text) !important;
}

.nav a:hover {
    background: var(--erp-sidebar-hover) !important;
    color: #ffffff !important;
}

.nav a.active {
    border-color: rgba(153, 246, 228, 0.2) !important;
    background: var(--erp-sidebar-active) !important;
    color: var(--erp-sidebar-active-text, #ffffff) !important;
}

.nav a.active .nav-icon {
    background: rgba(255, 255, 255, 0.12) !important;
}

.button.primary,
.landing-button.primary,
.table-action.primary,
button.primary {
    border-color: var(--erp-primary) !important;
    background: var(--erp-primary) !important;
    color: #ffffff !important;
}

.button.primary:hover,
.landing-button.primary:hover,
.table-action.primary:hover {
    border-color: var(--erp-primary-hover) !important;
    background: var(--erp-primary-hover) !important;
}

.button.primary:active,
.landing-button.primary:active,
.table-action.primary:active {
    border-color: var(--erp-primary-active) !important;
    background: var(--erp-primary-active) !important;
}

.button.ghost,
.table-action,
.segmented-control a {
    border-color: var(--erp-line-strong) !important;
    background: #ffffff !important;
    color: var(--erp-text) !important;
}

.button.ghost:hover,
.table-action:hover,
.segmented-control a:hover {
    background: var(--erp-hover) !important;
    color: var(--erp-primary-active) !important;
}

.segmented-control a.active,
.button.secondary {
    border-color: var(--erp-secondary) !important;
    background: var(--erp-secondary) !important;
    color: var(--erp-primary-active) !important;
}

.button.warning,
.table-action.warning {
    border-color: var(--erp-warning) !important;
    background: var(--erp-warning) !important;
    color: #ffffff !important;
}

.button.danger,
.table-action.danger {
    border-color: var(--erp-danger) !important;
    background: var(--erp-danger) !important;
    color: #ffffff !important;
}

input,
select,
textarea {
    border-color: var(--erp-line-strong) !important;
    background: #ffffff !important;
}

input::placeholder,
textarea::placeholder {
    color: var(--erp-subtle) !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--erp-accent) !important;
    box-shadow: var(--erp-focus) !important;
    outline: none !important;
}

table thead,
.pro-calendar-column-head,
.pro-calendar-corner {
    background: var(--erp-surface-soft) !important;
}

table tr:hover td {
    background: var(--erp-hover) !important;
}

table th,
table td {
    border-color: var(--erp-line) !important;
}

.badge,
.event-payment.is-paid,
.badge.is-success {
    border-color: #bbf7d0 !important;
    background: #dcfce7 !important;
    color: #166534 !important;
}

.event-payment.is-pending,
.badge.warning,
.status-row.is-warning {
    border-color: #fde68a !important;
    background: #fef3c7 !important;
    color: #92400e !important;
}

.badge.danger,
.is-blocked .badge,
.event-payment.is-cancelled {
    border-color: #fecaca !important;
    background: #fee2e2 !important;
    color: #991b1b !important;
}

.pro-calendar .calendar-event {
    --event-color: var(--erp-accent);
}

.pro-calendar .calendar-event[data-status*="completed"] {
    --event-color: var(--erp-success);
}

.pro-calendar .calendar-event[data-status*="cancelled"] {
    --event-color: var(--erp-danger);
}

.pro-calendar .calendar-event[data-payment-status="pending"] {
    --event-color: var(--erp-warning);
}

.calendar-column.is-today,
.pro-calendar-column.is-today .pro-calendar-column-head,
.task-calendar-month article.is-today,
.task-calendar-time article.is-today header {
    background: #ccfbf1 !important;
}

.shared-line-chart,
.chart-panel,
.landing-calendar-preview {
    background: var(--erp-bg) !important;
}

.line-chart path,
.line-chart polyline,
svg [stroke="#635bff"],
svg [stroke="#111827"] {
    stroke: var(--erp-accent) !important;
}

/* Premium color concept cleanup: calm slate + teal, no purple active states. */
.sidebar-toggle {
    top: 104px !important;
    right: -14px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 54px !important;
    min-height: 54px !important;
    border: 2px solid rgba(153, 246, 228, 0.55) !important;
    border-radius: 16px 0 0 16px !important;
    background: #0b1220 !important;
    color: #ffffff !important;
    box-shadow: 0 12px 30px rgba(2, 6, 23, 0.32) !important;
}

.sidebar-toggle:hover {
    border-color: #99f6e4 !important;
    background: #134e4a !important;
}

body.sidebar-collapsed .sidebar-toggle {
    right: -14px !important;
}

.sidebar-toggle-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.nav a.active {
    border-color: rgba(20, 184, 166, 0.38) !important;
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.88), rgba(19, 78, 74, 0.92)) !important;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(153, 246, 228, 0.08), 0 10px 22px rgba(15, 118, 110, 0.18) !important;
}

.nav a.active .nav-icon {
    background: rgba(153, 246, 228, 0.16) !important;
    color: #ccfbf1 !important;
}

.nav a.active .nav-icon svg,
.nav a.active svg {
    color: #ccfbf1 !important;
    stroke: currentColor !important;
}

.nav a:hover .nav-icon {
    background: rgba(153, 246, 228, 0.10) !important;
    color: #99f6e4 !important;
}

.team-card {
    border-left: 4px solid var(--employee-color, #14B8A6) !important;
}

.employee-color-dot {
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-right: 8px;
    border: 2px solid rgba(255, 255, 255, 0.95);
    border-radius: 999px;
    background: var(--employee-color, #14B8A6);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--employee-color, #14B8A6) 28%, transparent);
    vertical-align: middle;
}

input[type="color"] {
    min-height: 42px !important;
    padding: 4px !important;
    cursor: pointer;
}

/* Final sidebar correction: internal toggle and no purple residue. */
.sidebar {
    background: linear-gradient(180deg, #0f172a 0%, #111827 100%) !important;
}

.sidebar-toggle,
body.sidebar-collapsed .sidebar-toggle {
    position: static !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    border: 1px solid rgba(153, 246, 228, 0.34) !important;
    border-radius: 14px !important;
    background: rgba(15, 118, 110, 0.18) !important;
    color: #ccfbf1 !important;
    box-shadow: none !important;
}

.sidebar-toggle:hover,
body.sidebar-collapsed .sidebar-toggle:hover {
    border-color: rgba(153, 246, 228, 0.72) !important;
    background: rgba(15, 118, 110, 0.42) !important;
}

.sidebar .nav a.active,
.sidebar .nav a[aria-current="page"] {
    border-color: rgba(153, 246, 228, 0.32) !important;
    background: #134e4a !important;
    color: #ffffff !important;
}

.sidebar .nav a.active .nav-icon,
.sidebar .nav a[aria-current="page"] .nav-icon {
    background: rgba(153, 246, 228, 0.16) !important;
    color: #99f6e4 !important;
}

.sidebar .nav a.active .nav-icon svg,
.sidebar .nav a.active svg,
.sidebar .nav a[aria-current="page"] svg {
    color: #99f6e4 !important;
    stroke: #99f6e4 !important;
}

.sidebar .nav a:hover .nav-icon svg {
    color: #ccfbf1 !important;
    stroke: #ccfbf1 !important;
}

.sidebar .nav-icon svg [stroke],
.sidebar .nav a.active .nav-icon svg [stroke] {
    stroke: currentColor !important;
}

.sidebar .nav-icon svg [fill]:not([fill="none"]) {
    fill: currentColor !important;
}

.sidebar .nav a.active * {
    --tw-text-opacity: 1 !important;
}

body.sidebar-collapsed .brand-mark {
    width: 42px !important;
    height: 42px !important;
    flex-basis: 42px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
}

body.sidebar-collapsed .sidebar-toggle {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
}

body.sidebar-collapsed .nav {
    gap: 7px !important;
    padding-top: 8px !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 44px !important;
    min-height: 44px !important;
    border-radius: 13px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 30px !important;
    height: 30px !important;
    flex-basis: 30px !important;
    border-radius: 10px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 20px !important;
    height: 20px !important;
}

body.sidebar-collapsed .sidebar-toggle-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.task-calendar-create {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 0.9fr) 150px 140px auto;
    gap: 10px;
    align-items: end;
    padding: 14px;
}

.task-calendar-create[hidden] {
    display: none !important;
}

.task-calendar-create label {
    display: grid;
    gap: 6px;
    color: var(--erp-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.task-calendar-create input,
.task-calendar-create select,
.task-calendar-create textarea {
    min-height: 40px;
    border-radius: 12px;
}

.admin-task-form textarea,
.task-calendar-create textarea {
    width: 100%;
    border: 1px solid var(--erp-border);
    background: #ffffff;
    color: var(--erp-ink);
    padding: 10px 12px;
    resize: vertical;
    line-height: 1.35;
}

.admin-task-form textarea:focus,
.task-calendar-create textarea:focus {
    outline: 2px solid rgba(20, 184, 166, 0.22);
    border-color: #14b8a6;
}

.admin-task-form .is-wide,
.task-calendar-create .is-wide {
    grid-column: 1 / -2;
}

.task-list article p,
.task-calendar-month a em,
.task-calendar-item em {
    display: block;
    margin: 4px 0 0;
    color: var(--erp-muted);
    font-size: 12px;
    font-style: normal;
    line-height: 1.35;
}

@media (max-width: 900px) {
    .task-calendar-create {
        grid-template-columns: 1fr;
    }
}

/* Clinc final logo lockup: use the recortados as real images, no CSS cropping. */
.sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 56px !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 42px !important;
}

.sidebar .brand {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 178px !important;
    height: 64px !important;
    min-height: 64px !important;
    overflow: visible !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    position: static !important;
    display: block !important;
    width: 166px !important;
    height: 58px !important;
    overflow: visible !important;
}

.sidebar .brand-logo-mark {
    position: static !important;
    display: none !important;
    width: 48px !important;
    height: 48px !important;
    overflow: visible !important;
    border-radius: 0 !important;
}

.sidebar .brand-logo-full img,
.sidebar .brand-logo-mark img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.sidebar .sidebar-toggle {
    width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    border: 1px solid rgba(153, 246, 228, 0.48) !important;
    border-radius: 18px !important;
    background: rgba(19, 78, 74, 0.72) !important;
    color: #e0fdfa !important;
    box-shadow: inset 0 0 0 4px rgba(20, 184, 166, 0.10), 0 14px 32px rgba(2, 6, 23, 0.18) !important;
}

.sidebar .sidebar-toggle:hover {
    border-color: rgba(153, 246, 228, 0.72) !important;
    background: rgba(15, 118, 110, 0.72) !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin-bottom: 34px !important;
}

body.sidebar-collapsed .sidebar .brand {
    justify-content: center !important;
    width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
}

body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

/* LAST RULE - Clinc logo exact proportions. Do not place another sidebar logo rule below this. */
.sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: 120px 46px !important;
    align-items: center !important;
    justify-content: start !important;
    gap: 42px !important;
    margin: 0 0 40px !important;
}

.sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 120px !important;
    height: 52px !important;
    min-width: 120px !important;
    min-height: 52px !important;
    overflow: visible !important;
    padding: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    display: block !important;
    width: 120px !important;
    height: 42px !important;
    min-width: 120px !important;
    overflow: visible !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    overflow: visible !important;
}

.sidebar .brand-logo-full img,
.sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.sidebar .sidebar-toggle {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    border-radius: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 34px !important;
}

body.sidebar-collapsed .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

/* EXACT USER REFERENCE - sidebar open/collapsed proportions. Keep this as the last sidebar rule. */
:root {
    --erp-sidebar: 264px;
    --erp-sidebar-closed: 88px;
}

.sidebar {
    padding: 16px 10px !important;
}

body.sidebar-collapsed .sidebar {
    padding: 16px 14px !important;
}

.sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: 122px 46px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    margin: 0 0 56px !important;
}

.sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    display: block !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 42px !important;
}

.sidebar .brand-logo-full img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
}

.sidebar .sidebar-toggle,
body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    border-radius: 14px !important;
}

.sidebar .sidebar-toggle-icon svg,
body.sidebar-collapsed .sidebar .sidebar-toggle-icon svg {
    width: 18px !important;
    height: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 48px !important;
}

body.sidebar-collapsed .sidebar .brand {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
    min-height: 60px !important;
    justify-content: center !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* Final logo dimensions: keep collapse button fixed; only size the logo containers. */
body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark {
    display: block !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* Current finishing pass: light-logo landing and collapsed sidebar rhythm. */
.landing-brand span {
    width: 184px !important;
    min-width: 184px !important;
    height: 52px !important;
    overflow: visible !important;
}

.landing-brand span img {
    width: 184px !important;
    height: 52px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.auth-premium-copy img {
    width: min(206px, 56%) !important;
    height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-value-path {
    align-self: end !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}

.landing-value-path span {
    min-height: 78px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid rgba(203, 213, 225, .78) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .76) !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    padding: 1rem !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .05) !important;
}

body.sidebar-collapsed .nav {
    gap: 8px !important;
    justify-items: center !important;
    padding-top: 2px !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 18.5px !important;
    height: 18.5px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 20px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -13px !important;
}

@media (max-width: 980px) {
    .landing-value-path {
        grid-template-columns: 1fr !important;
    }
}

/* Fase 37 final: landing comercial premium y ritmo de sidebar contraida. */
body.commercial-landing {
    background:
        radial-gradient(circle at 14% 18%, rgba(20, 184, 166, .16), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(15, 118, 110, .08), transparent 28%),
        linear-gradient(180deg, #f8fafc 0%, #f1f5f9 48%, #ffffff 100%) !important;
    color: #0f172a !important;
}

.landing-nav {
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: 74px !important;
    padding: 10px 14px !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .82) !important;
    border: 1px solid rgba(203, 213, 225, .8) !important;
    box-shadow: 0 22px 70px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(22px) !important;
}

.landing-brand {
    min-width: 190px !important;
}

.landing-brand span,
.landing-brand span img {
    width: 186px !important;
    height: 48px !important;
}

.landing-nav-links {
    gap: clamp(1.25rem, 4vw, 3.2rem) !important;
}

.landing-nav-links a,
.landing-link-button {
    font-size: .96rem !important;
    color: #475569 !important;
}

.landing-commercial-hero {
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: calc(100vh - 118px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, .62fr) !important;
    align-items: center !important;
    gap: clamp(2.5rem, 7vw, 7rem) !important;
    padding: clamp(72px, 9vw, 136px) 0 clamp(42px, 7vw, 92px) !important;
}

.landing-commercial-hero .landing-hero-copy {
    max-width: 900px !important;
}

.landing-commercial-hero h1 {
    max-width: 900px !important;
    margin: 0 !important;
    font-size: clamp(4.4rem, 8.4vw, 8.4rem) !important;
    line-height: .88 !important;
    letter-spacing: 0 !important;
    font-weight: 850 !important;
}

.landing-commercial-hero .landing-lead {
    max-width: 760px !important;
    margin-top: 1.6rem !important;
    font-size: clamp(1.15rem, 1.6vw, 1.55rem) !important;
    line-height: 1.55 !important;
    color: #475569 !important;
}

.landing-hero-actions {
    gap: .9rem !important;
    margin-top: 2.2rem !important;
}

.landing-button {
    border-radius: 18px !important;
    min-height: 48px !important;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease !important;
}

.landing-button.primary {
    background: #0f766e !important;
    color: #ffffff !important;
    box-shadow: 0 18px 42px rgba(15, 118, 110, .18) !important;
}

.landing-button.primary:hover {
    background: #115e59 !important;
    transform: translateY(-1px) !important;
}

.landing-button.secondary {
    background: rgba(255, 255, 255, .82) !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

.landing-button.large {
    min-height: 58px !important;
    padding-inline: 1.55rem !important;
    font-size: 1.02rem !important;
}

.landing-demo-card {
    position: relative !important;
    overflow: hidden !important;
    min-height: 520px !important;
    border-radius: 36px !important;
    padding: clamp(28px, 4vw, 48px) !important;
    background:
        linear-gradient(145deg, rgba(15, 23, 42, .96), rgba(17, 94, 89, .92)),
        #0f172a !important;
    color: #ffffff !important;
    border: 1px solid rgba(153, 246, 228, .24) !important;
    box-shadow: 0 32px 90px rgba(15, 23, 42, .22) !important;
}

.landing-demo-card::before {
    content: "" !important;
    position: absolute !important;
    inset: -28% -20% auto auto !important;
    width: 320px !important;
    height: 320px !important;
    border-radius: 999px !important;
    background: radial-gradient(circle, rgba(20, 184, 166, .32), transparent 65%) !important;
    pointer-events: none !important;
}

.landing-demo-kicker {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 32px !important;
    padding: .3rem .7rem !important;
    border-radius: 999px !important;
    background: rgba(204, 251, 241, .12) !important;
    border: 1px solid rgba(153, 246, 228, .22) !important;
    color: #99f6e4 !important;
    font-size: .72rem !important;
    font-weight: 850 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.landing-demo-card strong {
    position: relative !important;
    display: block !important;
    max-width: 420px !important;
    margin-top: 1.25rem !important;
    font-size: clamp(2.2rem, 4vw, 4rem) !important;
    line-height: .96 !important;
    letter-spacing: 0 !important;
}

.landing-demo-card > div {
    position: relative !important;
    display: grid !important;
    gap: .75rem !important;
    margin: 2.2rem 0 !important;
}

.landing-demo-card p {
    display: grid !important;
    grid-template-columns: 92px 1fr !important;
    gap: .9rem !important;
    align-items: start !important;
    margin: 0 !important;
    padding: .95rem 0 !important;
    border-bottom: 1px solid rgba(203, 213, 225, .16) !important;
    color: rgba(255, 255, 255, .72) !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
}

.landing-demo-card p b {
    color: #ffffff !important;
    font-size: .95rem !important;
}

.landing-demo-card small {
    position: relative !important;
    display: block !important;
    max-width: 360px !important;
    color: rgba(255, 255, 255, .66) !important;
    line-height: 1.55 !important;
}

.landing-guide-section {
    width: min(1500px, calc(100% - 48px)) !important;
    margin-top: -10px !important;
}

.landing-section-heading {
    max-width: 860px !important;
}

.landing-section-heading h2 {
    font-size: clamp(2.4rem, 5vw, 5.8rem) !important;
    line-height: .95 !important;
    letter-spacing: 0 !important;
}

.landing-sales-path {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.landing-sales-path article,
.landing-sales-path article.is-featured {
    grid-column: auto !important;
    min-height: 300px !important;
    padding: 1.65rem !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .84) !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    box-shadow: 0 22px 62px rgba(15, 23, 42, .06) !important;
}

.landing-sales-path article:nth-child(1) {
    background: linear-gradient(160deg, rgba(204, 251, 241, .82), rgba(255, 255, 255, .9)) !important;
    border-color: rgba(20, 184, 166, .32) !important;
}

.landing-sales-path span {
    color: #0f766e !important;
}

.landing-sales-path h3 {
    margin-top: 2.2rem !important;
    font-size: clamp(1.55rem, 2vw, 2.35rem) !important;
    line-height: 1 !important;
}

.landing-sales-path p {
    margin-top: 1rem !important;
    color: #475569 !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
}

.landing-pricing-section,
.landing-access-section {
    width: min(1500px, calc(100% - 48px)) !important;
}

.landing-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.1rem !important;
}

.landing-plan-card {
    border-radius: 30px !important;
    padding: 1.5rem !important;
    background: rgba(255, 255, 255, .9) !important;
    border: 1px solid rgba(203, 213, 225, .8) !important;
    box-shadow: 0 18px 58px rgba(15, 23, 42, .06) !important;
}

.landing-tour-backdrop {
    background: rgba(15, 23, 42, .16) !important;
    backdrop-filter: blur(5px) !important;
}

.landing-tour-panel {
    right: clamp(18px, 5vw, 72px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: min(440px, calc(100vw - 36px)) !important;
    border-radius: 30px !important;
    padding: 1.55rem !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .22) !important;
}

.is-tour-active {
    outline: 2px solid rgba(20, 184, 166, .34) !important;
    outline-offset: 8px !important;
    border-radius: 32px !important;
}

body.sidebar-collapsed .sidebar {
    overflow: hidden !important;
}

body.sidebar-collapsed .nav {
    gap: 9px !important;
    justify-items: center !important;
    padding-top: 0 !important;
    transform: translateY(-4px) !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 43px !important;
    min-width: 43px !important;
    height: 43px !important;
    min-height: 43px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 33px !important;
    min-width: 33px !important;
    height: 33px !important;
    flex-basis: 33px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 19.5px !important;
    height: 19.5px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 24px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -16px !important;
}

@media (max-width: 1120px) {
    .landing-commercial-hero,
    .landing-sales-path,
    .landing-plan-grid {
        grid-template-columns: 1fr !important;
    }

    .landing-commercial-hero {
        min-height: auto !important;
        padding-top: 46px !important;
    }

    .landing-demo-card {
        min-height: auto !important;
    }
}

@media (max-width: 760px) {
    .landing-nav,
    .landing-commercial-hero,
    .landing-guide-section,
    .landing-pricing-section,
    .landing-access-section {
        width: min(100% - 24px, 1500px) !important;
    }

    .landing-brand {
        min-width: 140px !important;
    }

    .landing-brand span,
    .landing-brand span img {
        width: 136px !important;
        height: 38px !important;
    }

    .landing-commercial-hero h1 {
        font-size: clamp(3.25rem, 15vw, 5rem) !important;
    }

    .landing-demo-card p {
        grid-template-columns: 1fr !important;
    }
}

/* TRUE FINAL OVERRIDES - keep these after legacy blocks. */
body.is-guest .app-shell {
    display: block !important;
    min-height: 100vh !important;
}

body.is-guest .sidebar,
body.is-guest .topbar {
    display: none !important;
}

body.is-guest .main {
    min-height: 100vh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(22px, 4vw, 56px) !important;
    background: linear-gradient(115deg, rgba(204, 251, 241, .48) 0%, rgba(248, 250, 252, .9) 36%, #ffffff 100%) !important;
}

.auth-premium {
    width: min(1120px, 100%) !important;
    min-height: min(680px, calc(100vh - 72px)) !important;
    display: grid !important;
    grid-template-columns: minmax(0, .92fr) minmax(360px, .78fr) !important;
    align-items: stretch !important;
    gap: clamp(18px, 3vw, 32px) !important;
    margin: 0 auto !important;
}

.auth-premium-copy,
.auth-premium-card {
    border: 1px solid rgba(203, 213, 225, .92) !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .9) !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .08) !important;
}

.auth-premium-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    overflow: hidden !important;
    padding: clamp(30px, 4vw, 56px) !important;
    background: linear-gradient(145deg, #ffffff 0%, #f0fdfa 58%, #eef2ff 100%) !important;
}

.auth-premium-copy img {
    width: min(198px, 52%) !important;
    height: 56px !important;
    object-fit: contain !important;
    object-position: left center !important;
    margin: 0 0 clamp(42px, 8vh, 96px) !important;
}

.auth-premium-copy h2 {
    max-width: 680px !important;
    color: #0f172a !important;
    font-size: clamp(2.55rem, 5.3vw, 5.2rem) !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: .96 !important;
    margin: 0 !important;
}

.auth-premium-card {
    align-self: center !important;
    padding: clamp(28px, 4vw, 48px) !important;
}

.landing-brand {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 180px !important;
}

.landing-brand span {
    width: 176px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.landing-brand span img {
    width: 176px !important;
    height: 50px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-product-top,
.landing-calendar-preview,
.landing-metric-row,
.legacy-hidden {
    display: none !important;
}

.landing-pricing-section .landing-section-heading h2 {
    font-size: 0 !important;
}

.landing-pricing-section .landing-section-heading h2::before {
    content: "Planes claros para empezar pequeno y crecer sin cambiar de sistema.";
    display: block;
    color: #0f172a;
    font-size: clamp(2rem, 4vw, 4rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

body.sidebar-collapsed .sidebar {
    height: 100vh !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    padding-top: 12px !important;
    padding-bottom: 8px !important;
}

body.sidebar-collapsed .sidebar::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

body.sidebar-collapsed .nav {
    gap: 7px !important;
    padding-top: 0 !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 39px !important;
    min-width: 39px !important;
    height: 39px !important;
    min-height: 39px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 29px !important;
    min-width: 29px !important;
    height: 29px !important;
    flex-basis: 29px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 17px !important;
    height: 17px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 18px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -12px !important;
    width: 36px !important;
    opacity: .45 !important;
}

.support-admin-row {
    grid-template-columns: 188px minmax(0, 1fr) 184px !important;
    min-height: 70px !important;
    padding: .85rem 1rem !important;
}

.support-admin-row .support-ticket-number {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 188px !important;
    min-height: 40px !important;
    border-radius: 999px !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
    font-size: .86rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    padding: .55rem .8rem !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-main small {
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
    min-width: 0 !important;
}

.support-admin-row .support-ticket-main time {
    color: #64748b !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .6rem !important;
}

.support-admin-row .support-ticket-meta small {
    display: inline-flex !important;
    align-items: center !important;
    gap: .35rem !important;
    min-width: 64px !important;
    color: #64748b !important;
    font-size: .82rem !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta small::before {
    content: "" !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    background: #94a3b8 !important;
}

.support-admin-row .support-ticket-meta small.is-viewed::before {
    background: #0f766e !important;
}

@media (max-width: 980px) {
    .auth-premium {
        min-height: auto !important;
        grid-template-columns: 1fr !important;
    }
}

/* UX final polish - login, landing, support rows and collapsed sidebar. */
body.is-guest .app-shell {
    display: block !important;
    min-height: 100vh !important;
}

body.is-guest .sidebar,
body.is-guest .topbar {
    display: none !important;
}

body.is-guest .main {
    min-height: 100vh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(22px, 4vw, 56px) !important;
    background:
        linear-gradient(115deg, rgba(204, 251, 241, .48) 0%, rgba(248, 250, 252, .9) 36%, #ffffff 100%) !important;
}

.auth-premium {
    width: min(1120px, 100%) !important;
    min-height: min(680px, calc(100vh - 72px)) !important;
    display: grid !important;
    grid-template-columns: minmax(0, .92fr) minmax(360px, .78fr) !important;
    align-items: stretch !important;
    gap: clamp(18px, 3vw, 32px) !important;
    margin: 0 auto !important;
}

.auth-premium-copy,
.auth-premium-card {
    border: 1px solid rgba(203, 213, 225, .92) !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .9) !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .08) !important;
}

.auth-premium-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    overflow: hidden !important;
    padding: clamp(30px, 4vw, 56px) !important;
    background:
        linear-gradient(145deg, #ffffff 0%, #f0fdfa 58%, #eef2ff 100%) !important;
}

.auth-premium-copy img {
    width: min(198px, 52%) !important;
    height: 56px !important;
    object-fit: contain !important;
    object-position: left center !important;
    margin: 0 0 clamp(42px, 8vh, 96px) !important;
}

.auth-premium-copy h2 {
    max-width: 680px !important;
    color: #0f172a !important;
    font-size: clamp(2.55rem, 5.3vw, 5.2rem) !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: .96 !important;
    margin: 0 !important;
}

.auth-premium-copy p:not(.eyebrow) {
    max-width: 560px !important;
    color: #475569 !important;
    font-size: clamp(1rem, 1.22vw, 1.16rem) !important;
    line-height: 1.65 !important;
}

.auth-premium-card {
    align-self: center !important;
    padding: clamp(28px, 4vw, 48px) !important;
}

.auth-premium-card h2 {
    font-size: clamp(2rem, 3vw, 2.55rem) !important;
    letter-spacing: 0 !important;
}

.auth-premium-card input {
    min-height: 54px !important;
    border-radius: 16px !important;
}

.auth-premium-card .button.primary {
    min-height: 56px !important;
    border-radius: 16px !important;
    background: #0f766e !important;
}

.commercial-landing {
    background: linear-gradient(180deg, #f8fafc 0%, #eefdfa 48%, #ffffff 100%) !important;
}

.landing-nav {
    width: min(1320px, calc(100% - 40px)) !important;
    min-height: 78px !important;
    display: flex !important;
    align-items: center !important;
    border-radius: 28px !important;
    padding: 10px 14px 10px 22px !important;
    background: rgba(255, 255, 255, .88) !important;
    backdrop-filter: blur(18px) !important;
}

.landing-brand {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 180px !important;
    text-decoration: none !important;
}

.landing-brand span {
    width: 176px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.landing-brand span img {
    width: 176px !important;
    height: 50px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-hero {
    min-height: calc(100vh - 118px) !important;
    align-items: center !important;
    padding-top: clamp(58px, 8vh, 104px) !important;
    padding-bottom: clamp(42px, 7vh, 86px) !important;
}

.landing-hero h1 {
    max-width: 1040px !important;
    color: #0f172a !important;
    font-size: clamp(3.6rem, 7.8vw, 7.4rem) !important;
    letter-spacing: 0 !important;
    line-height: .92 !important;
}

.landing-lead {
    max-width: 720px !important;
    color: #475569 !important;
    font-size: clamp(1.08rem, 1.55vw, 1.32rem) !important;
}

.legacy-hidden {
    display: none !important;
}

.landing-product-card {
    min-height: 460px !important;
    display: grid !important;
    place-items: center !important;
    gap: 1rem !important;
    text-align: center !important;
    border-color: rgba(153, 246, 228, .72) !important;
    background:
        linear-gradient(160deg, rgba(255, 255, 255, .96) 0%, rgba(240, 253, 250, .88) 54%, rgba(248, 250, 252, .96) 100%) !important;
}

.landing-product-top,
.landing-calendar-preview,
.landing-metric-row {
    display: none !important;
}

.landing-product-card::before {
    content: "" !important;
    display: block !important;
    width: min(188px, 46vw) !important;
    aspect-ratio: 1 !important;
    background: url("/images/logo_clinc_mark.png") center / contain no-repeat !important;
    filter: drop-shadow(0 26px 42px rgba(15, 118, 110, .18)) !important;
}

.landing-product-card::after {
    content: "La demo privada ensena el flujo completo sin exponer la herramienta publica." !important;
    max-width: 390px !important;
    color: #475569 !important;
    font-size: 1.06rem !important;
    font-weight: 750 !important;
    line-height: 1.45 !important;
}

.landing-sales-path article {
    min-height: 190px !important;
    border-color: rgba(203, 213, 225, .85) !important;
}

.landing-pricing-section .landing-section-heading h2 {
    font-size: 0 !important;
}

.landing-pricing-section .landing-section-heading h2::before {
    content: "Planes claros para empezar pequeno y crecer sin cambiar de sistema.";
    display: block;
    color: #0f172a;
    font-size: clamp(2rem, 4vw, 4rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
}

body.sidebar-collapsed .sidebar {
    height: 100vh !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    padding-top: 12px !important;
    padding-bottom: 8px !important;
}

body.sidebar-collapsed .sidebar::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

body.sidebar-collapsed .nav {
    gap: 7px !important;
    padding-top: 0 !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 39px !important;
    min-width: 39px !important;
    height: 39px !important;
    min-height: 39px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 29px !important;
    min-width: 29px !important;
    height: 29px !important;
    flex-basis: 29px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 17px !important;
    height: 17px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 18px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -12px !important;
    width: 36px !important;
    opacity: .45 !important;
}

.support-admin-row {
    grid-template-columns: 188px minmax(0, 1fr) 184px !important;
    min-height: 70px !important;
    padding: .85rem 1rem !important;
}

.support-admin-row .support-ticket-number {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 188px !important;
    min-height: 40px !important;
    border-radius: 999px !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
    font-size: .86rem !important;
    font-weight: 950 !important;
    letter-spacing: .01em !important;
    line-height: 1 !important;
    padding: .55rem .8rem !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-main {
    min-width: 0 !important;
}

.support-admin-row .support-ticket-main small {
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
    min-width: 0 !important;
}

.support-admin-row .support-ticket-main time {
    color: #64748b !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .6rem !important;
}

.support-admin-row .support-ticket-meta .badge {
    min-width: 88px !important;
    justify-content: center !important;
}

.support-admin-row .support-ticket-meta small {
    display: inline-flex !important;
    align-items: center !important;
    gap: .35rem !important;
    min-width: 64px !important;
    color: #64748b !important;
    font-size: .82rem !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta small::before {
    content: "" !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    background: #94a3b8 !important;
}

.support-admin-row .support-ticket-meta small.is-viewed::before {
    background: #0f766e !important;
}

@media (max-width: 980px) {
    .auth-premium {
        min-height: auto !important;
        grid-template-columns: 1fr !important;
    }

    .auth-premium-copy {
        min-height: auto !important;
    }
}

@media (max-width: 760px) {
    .landing-nav {
        width: calc(100% - 24px) !important;
        min-height: auto !important;
    }

    .landing-brand {
        min-width: 126px !important;
    }

    .landing-brand span,
    .landing-brand span img {
        width: 126px !important;
        height: 42px !important;
    }

    .support-admin-row {
        grid-template-columns: 1fr !important;
    }
}

/* Premium login, commercial landing and compact collapsed sidebar */
body.is-guest .app-shell {
    display: block !important;
    min-height: 100vh !important;
}

body.is-guest .sidebar {
    display: none !important;
}

body.is-guest .main {
    min-height: 100vh !important;
    padding: clamp(22px, 4vw, 48px) !important;
}

.auth-premium {
    min-height: calc(100vh - 96px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 480px);
    align-items: center;
    gap: clamp(28px, 5vw, 80px);
    width: min(1180px, 100%);
    margin: 0 auto;
}

.auth-premium-copy {
    display: grid;
    gap: 1.1rem;
}

.auth-premium-copy img {
    display: block;
    width: min(220px, 48vw);
    height: auto;
    object-fit: contain;
    margin-bottom: 1.2rem;
}

.auth-premium-copy h2 {
    max-width: 760px;
    color: #0f172a;
    font-size: clamp(2.8rem, 7vw, 6.2rem);
    font-weight: 880;
    letter-spacing: -0.035em !important;
    line-height: .93;
    margin: 0;
}

.auth-premium-copy p:not(.eyebrow) {
    max-width: 620px;
    color: #64748b;
    font-size: clamp(1.05rem, 1.5vw, 1.28rem);
    line-height: 1.65;
    margin: 0;
}

.auth-premium-card {
    border-radius: 28px !important;
    padding: clamp(1.4rem, 3vw, 2.3rem) !important;
    box-shadow: 0 30px 70px rgba(15, 23, 42, .10) !important;
}

.auth-premium-card h2 {
    font-size: 2rem !important;
    letter-spacing: -0.02em !important;
}

.auth-premium-card input {
    min-height: 52px !important;
    border-radius: 16px !important;
}

.auth-premium-card .button.primary {
    min-height: 54px !important;
    border-radius: 16px !important;
    background: #0f766e !important;
}

.landing-nav {
    width: min(1180px, calc(100% - 40px)) !important;
    min-height: 74px !important;
    border-radius: 28px !important;
    padding: 10px 14px !important;
}

.landing-brand span {
    width: 154px !important;
    height: 48px !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}

.landing-brand span img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-hero {
    min-height: 72vh !important;
    padding-top: clamp(60px, 9vh, 120px) !important;
}

.landing-hero h1 {
    max-width: 980px !important;
    font-size: clamp(3.3rem, 8vw, 7.8rem) !important;
    letter-spacing: -0.055em !important;
    line-height: .9 !important;
}

.landing-lead {
    max-width: 680px !important;
    font-size: clamp(1.08rem, 1.5vw, 1.34rem) !important;
}

.landing-product-card {
    min-height: 380px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    border-color: rgba(153, 246, 228, .7) !important;
    background:
        radial-gradient(circle at 50% 35%, rgba(20, 184, 166, .18), transparent 9rem),
        radial-gradient(circle at 38% 38%, rgba(124, 58, 237, .16), transparent 8rem),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

.landing-product-card::before {
    content: "" !important;
    display: block !important;
    width: min(180px, 42vw) !important;
    aspect-ratio: 1 !important;
    background: url("/images/logo_clinc_mark.png") center / contain no-repeat !important;
    filter: drop-shadow(0 24px 40px rgba(15, 118, 110, .18)) !important;
}

.landing-product-card::after {
    content: "La experiencia completa se muestra en una visita guiada privada." !important;
    display: block !important;
    max-width: 360px !important;
    color: #64748b !important;
    font-size: 1.05rem !important;
    font-weight: 760 !important;
    line-height: 1.45 !important;
}

.landing-product-top,
.landing-calendar-preview,
.landing-metric-row {
    display: none !important;
}

.landing-sales-path article {
    min-height: 210px !important;
}

body.sidebar-collapsed .sidebar {
    overflow: hidden !important;
    scrollbar-width: none !important;
    padding-top: 12px !important;
    padding-bottom: 10px !important;
}

body.sidebar-collapsed .sidebar::-webkit-scrollbar {
    display: none !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    margin-bottom: 34px !important;
    gap: 14px !important;
}

body.sidebar-collapsed .nav {
    gap: 9px !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 40px !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 30px !important;
    height: 30px !important;
    flex-basis: 30px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 17px !important;
    height: 17px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 18px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -12px !important;
}

.support-admin-row {
    grid-template-columns: 176px minmax(0, 1fr) 176px !important;
    min-height: 70px !important;
}

.support-admin-row .support-ticket-number {
    white-space: nowrap !important;
    border-radius: 999px !important;
    font-size: .88rem !important;
    line-height: 1 !important;
}

.support-admin-row .support-ticket-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .55rem !important;
}

.support-admin-row .support-ticket-meta small {
    white-space: nowrap !important;
}

@media (max-width: 980px) {
    .auth-premium {
        grid-template-columns: 1fr;
    }

    .auth-premium-copy h2 {
        font-size: clamp(2.5rem, 12vw, 4.5rem);
    }
}

@media (max-width: 760px) {
    .landing-nav {
        width: calc(100% - 24px) !important;
    }

    .landing-brand span {
        width: 108px !important;
    }
}

/* Final compact fixes: ticket rows and collapsed sidebar no-scroll. */
body.sidebar-collapsed .sidebar {
    overflow: hidden !important;
}

body.sidebar-collapsed .nav {
    gap: 12px !important;
    padding-top: 0 !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 42px !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 4px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 18px !important;
    height: 18px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 20px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -13px !important;
}

.support-admin-row {
    grid-template-columns: 170px minmax(0, 1fr) 180px !important;
    min-height: 72px !important;
    padding: .9rem 1rem !important;
}

.support-admin-row .support-ticket-number {
    align-self: center !important;
    width: 100% !important;
    max-width: 170px !important;
    border-radius: 999px !important;
    font-size: .9rem !important;
    letter-spacing: .01em !important;
    line-height: 1 !important;
    padding: .72rem .8rem !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .55rem !important;
}

.support-admin-row .support-ticket-meta .badge {
    min-width: 86px !important;
    justify-content: center !important;
    padding: .45rem .75rem !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta small {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 64px !important;
    color: #64748b !important;
    font-size: .82rem !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.support-admin-row .support-ticket-meta small::before {
    content: "" !important;
    display: inline-block !important;
    width: 7px !important;
    height: 7px !important;
    margin-right: .35rem !important;
    border-radius: 999px !important;
    background: #94a3b8 !important;
}

.support-admin-row .support-ticket-meta small.is-viewed::before {
    background: #0f766e !important;
}

.pro-calendar .calendar-event[data-is-completed="true"] {
    cursor: default;
}

.pro-calendar .calendar-event[data-is-completed="true"] .event-resize-handle {
    display: none;
}

/* Premium compact operational modules: billing, rooms, dashboard and team. */
.billing-dashboard {
    display: grid !important;
    gap: 16px !important;
}

.billing-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 16px !important;
}

.billing-grid-secondary {
    grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1.28fr) !important;
}

.billing-chart-wide {
    grid-template-columns: 1fr !important;
}

.billing-fused-panel .apex-chart {
    min-height: 280px !important;
}

.billing-chart-totals {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

.billing-chart-totals span {
    min-width: 142px !important;
    padding: 10px 12px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 15px !important;
    background: var(--erp-surface-soft) !important;
}

.billing-chart-totals small {
    display: block !important;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

.billing-chart-totals strong {
    display: block !important;
    margin-top: 3px !important;
    color: var(--erp-text) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.billing-visual-panel,
.pending-payment-panel,
.invoice-table-panel {
    min-height: 0 !important;
}

.panel-total {
    color: var(--erp-text) !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

.billing-visual-panel .real-chart {
    min-height: 210px !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

.apex-chart {
    min-height: 220px !important;
    overflow: hidden !important;
    border: 1px solid rgba(226, 232, 240, 0.72) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 12% 12%, rgba(20, 184, 166, 0.10), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

.apex-chart.is-rendered + .real-chart {
    display: none !important;
}

.apexcharts-tooltip,
.apexcharts-xaxistooltip {
    border: 1px solid var(--erp-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.12) !important;
}

.apexcharts-tooltip-title {
    border-bottom: 1px solid var(--erp-line) !important;
    background: #f8fafc !important;
    color: var(--erp-text) !important;
    font-weight: 850 !important;
}

.pending-payment-panel {
    max-height: 430px !important;
}

.pending-payment-scroll {
    max-height: 288px !important;
    overflow-y: auto !important;
    padding-right: 6px !important;
}

.pending-payment-scroll a {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.pending-payment-scroll strong,
.pending-payment-scroll small {
    white-space: nowrap !important;
}

.pending-payment-scroll span {
    min-width: 0 !important;
}

.available-hours-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.available-hours-grid a {
    display: grid !important;
    gap: 3px !important;
    padding: 14px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 100%) !important;
    color: var(--erp-text) !important;
    text-decoration: none !important;
}

.available-hours-grid span {
    color: var(--erp-primary) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.available-hours-grid strong {
    font-size: 26px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.available-hours-grid small {
    color: var(--erp-muted) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.room-simple-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 14px !important;
}

.room-clarity-card {
    gap: 14px !important;
    min-height: auto !important;
}

.room-clarity-summary {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.room-clarity-summary span {
    display: grid !important;
    gap: 2px !important;
    padding: 10px !important;
    border-radius: 14px !important;
    background: var(--erp-surface-soft) !important;
}

.room-clarity-summary b {
    color: var(--erp-text) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

.room-clarity-summary small {
    overflow: hidden !important;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.room-simple-slots {
    align-items: center !important;
    gap: 8px !important;
}

.room-simple-slots small {
    flex-basis: 100% !important;
}

.team-availability-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 10px !important;
    margin: 14px 0 !important;
}

.team-availability-strip article {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 12px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 16px !important;
    background: #ffffff !important;
}

.team-availability-strip strong {
    display: block !important;
    overflow: hidden !important;
    color: var(--erp-text) !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.team-availability-strip small {
    color: var(--erp-muted) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.team-availability-strip p {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 0 !important;
}

.team-availability-strip b {
    padding: 6px 9px !important;
    border-radius: 999px !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

@media (max-width: 1100px) {
    .billing-grid,
    .billing-grid-secondary {
        grid-template-columns: 1fr !important;
    }
}

/* Company cards final polish: equal actions and clean Spanish labels. */
.company-preview-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 10px !important;
}

.company-preview-actions form {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}

.company-preview-actions .table-action,
.company-preview-actions button.table-action {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-align: center !important;
}

@media (max-width: 780px) {
    .company-preview-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Contracted services: compact commercial view, advanced fields only on demand. */
.contract-services-panel {
    overflow: visible !important;
}

.contract-service-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)) !important;
    gap: 12px !important;
}

.contract-service-card {
    display: grid !important;
    gap: 12px !important;
    padding: 14px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05) !important;
}

.contract-service-main {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.contract-service-main strong {
    display: block !important;
    color: var(--erp-text) !important;
    font-size: 15px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
}

.contract-service-main small,
.contract-service-note {
    color: var(--erp-muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.contract-service-facts {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.contract-service-facts span {
    min-width: 0 !important;
    padding: 9px !important;
    border-radius: 13px !important;
    background: var(--erp-surface-soft) !important;
}

.contract-service-facts small {
    display: block !important;
    margin-bottom: 4px !important;
    color: var(--erp-muted) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

.contract-service-facts b {
    overflow: hidden !important;
    display: block !important;
    color: var(--erp-text) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.contract-service-note {
    margin: 0 !important;
    padding-top: 2px !important;
}

.contract-service-editor,
.manual-service-add {
    border-top: 1px solid var(--erp-line) !important;
    padding-top: 10px !important;
}

.contract-service-editor summary,
.manual-service-add summary {
    cursor: pointer !important;
    color: var(--erp-primary) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    list-style: none !important;
}

.contract-service-editor summary::-webkit-details-marker,
.manual-service-add summary::-webkit-details-marker {
    display: none !important;
}

.contract-service-editor form {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 12px !important;
}

.contract-service-editor .wide-field {
    grid-column: span 2 !important;
}

.contract-service-editor .button {
    align-self: end !important;
    min-height: 42px !important;
}

.manual-service-add {
    margin-top: 16px !important;
}

.manual-service-add .form-panel {
    gap: 12px !important;
    margin-top: 12px !important;
}

.manual-service-add .button {
    width: min(220px, 100%) !important;
}

@media (max-width: 900px) {
    .contract-service-editor form,
    .contract-service-facts {
        grid-template-columns: 1fr !important;
    }

    .contract-service-editor .wide-field {
        grid-column: auto !important;
    }
}

/* Collapsed logo visual scale: the source PNG has internal transparent padding. */
body.sidebar-collapsed .sidebar .brand,
body.is-guest.sidebar-collapsed .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
    min-height: 60px !important;
    overflow: visible !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark {
    display: grid !important;
    place-items: center !important;
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
    overflow: visible !important;
    transform: translateX(3px) !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img {
    width: 60px !important;
    max-width: none !important;
    height: 60px !important;
    object-fit: contain !important;
    transform: scale(1.68) !important;
    transform-origin: center center !important;
}

/* Collapsed sidebar polish: keep primary dashboard access visually separated. */
body.sidebar-collapsed .nav > a:first-of-type {
    position: relative !important;
    margin-bottom: 24px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: -16px !important;
    width: 28px !important;
    height: 1px !important;
    border-radius: 999px !important;
    background: rgba(203, 213, 225, 0.22) !important;
    transform: translateX(-50%) !important;
}

/* Open sidebar logo only. Collapsed logo is approved and must not be changed. */
body:not(.sidebar-collapsed) .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 48px !important;
    min-height: 48px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body:not(.sidebar-collapsed) .sidebar .brand > span.brand-logo-full {
    position: static !important;
    display: block !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 42px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body:not(.sidebar-collapsed) .sidebar .brand > span.brand-logo-full img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: none !important;
}

body:not(.sidebar-collapsed) .sidebar .brand > span.brand-logo-mark {
    display: none !important;
}

/* Open sidebar navigation sizing. Logo and collapse button are intentionally untouched. */
body:not(.sidebar-collapsed) {
    --erp-sidebar: 270px;
}

body:not(.sidebar-collapsed) .sidebar {
    padding-inline: 14px !important;
}

body:not(.sidebar-collapsed) .nav {
    gap: 8px !important;
}

body:not(.sidebar-collapsed) .nav-label {
    margin: 8px 12px 2px !important;
    font-size: 12px !important;
    letter-spacing: 0.08em !important;
}

body:not(.sidebar-collapsed) .nav a,
body:not(.sidebar-collapsed) .nav-locked {
    grid-template-columns: 44px minmax(0, 1fr) 30px !important;
    min-height: 48px !important;
    padding: 6px 10px !important;
    border-radius: 13px !important;
}

body:not(.sidebar-collapsed) .nav-icon {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
    border-radius: 11px !important;
}

body:not(.sidebar-collapsed) .nav-icon svg {
    width: 20px !important;
    height: 20px !important;
}

body:not(.sidebar-collapsed) .nav-text {
    font-size: 15px !important;
    font-weight: 740 !important;
}

/* Sidebar open compact pass: smaller components, logo and collapse button unchanged. */
body:not(.sidebar-collapsed) {
    --erp-sidebar: 262px;
}

body:not(.sidebar-collapsed) .sidebar {
    padding-inline: 12px !important;
}

body:not(.sidebar-collapsed) .nav {
    gap: 6px !important;
}

body:not(.sidebar-collapsed) .nav-label {
    margin: 7px 10px 1px !important;
    font-size: 11.5px !important;
    letter-spacing: 0.075em !important;
}

body:not(.sidebar-collapsed) .nav a,
body:not(.sidebar-collapsed) .nav-locked {
    grid-template-columns: 40px minmax(0, 1fr) 28px !important;
    min-height: 44px !important;
    padding: 5px 9px !important;
    border-radius: 12px !important;
}

body:not(.sidebar-collapsed) .nav-icon {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
    border-radius: 10px !important;
}

body:not(.sidebar-collapsed) .nav-icon svg {
    width: 18px !important;
    height: 18px !important;
}

body:not(.sidebar-collapsed) .nav-text {
    font-size: 14px !important;
    font-weight: 730 !important;
}

.task-calendar-month article,
.task-calendar-time article header {
    cursor: pointer;
}

.task-calendar-month article,
.task-calendar-time article {
    position: relative;
}

.task-day-open {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.task-calendar-month header,
.task-calendar-month article > div,
.task-calendar-time article header,
.task-day-lane {
    position: relative;
    z-index: 2;
}

.task-calendar-month .task-calendar-item,
.task-all-day-stack .task-calendar-item,
.task-more-badge {
    position: relative;
    z-index: 3;
}

.task-calendar-month article:hover,
.task-calendar-time article header:hover {
    background: #ecfdf5 !important;
}

.task-calendar-month article.has-tasks {
    background: #fafffe;
}

.task-more-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    min-height: 26px !important;
    padding: 4px 10px !important;
    border: 1px solid #99f6e4 !important;
    border-radius: 999px !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    box-shadow: none !important;
}

.task-more-badge {
    position: absolute !important;
    top: 6px !important;
    right: 6px !important;
    display: inline-grid !important;
    place-items: center !important;
    min-width: 24px !important;
    height: 22px !important;
    padding: 0 7px !important;
    border: 1px solid #99f6e4 !important;
    border-radius: 999px !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.task-calendar-item:has(.task-more-badge) strong {
    padding-right: 34px !important;
}

.task-calendar-month .task-calendar-item,
.task-all-day-stack .task-calendar-item {
    border-left-color: #0f766e;
}

.task-calendar-month .task-calendar-item.is-high,
.task-all-day-stack .task-calendar-item.is-high {
    border-left-color: #ef4444;
}

.task-calendar-month .task-calendar-item.is-low,
.task-all-day-stack .task-calendar-item.is-low {
    border-left-color: #14b8a6;
}

/* LOGO ONLY LOCK - button dimensions/placement above are fixed; this only corrects logo rendering. */
.sidebar .brand-logo-full img,
.sidebar .brand-logo-mark img,
.is-guest .sidebar .brand-logo-full img,
.is-guest .sidebar .brand-logo-mark img {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

.sidebar .brand > span.brand-logo-full,
.is-guest .sidebar .brand > span.brand-logo-full {
    display: block !important;
}

.sidebar .brand > span.brand-logo-mark,
.is-guest .sidebar .brand > span.brand-logo-mark {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-full,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark {
    position: static !important;
    display: block !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Sidebar final proportion lock: collapse button keeps the collapsed reference size in every state. */
.sidebar .sidebar-head {
    grid-template-columns: 112px 46px !important;
    gap: 38px !important;
    align-items: center !important;
    justify-content: start !important;
    margin: 0 0 40px !important;
}

.sidebar .brand {
    width: 112px !important;
    min-width: 112px !important;
    height: 52px !important;
    min-height: 52px !important;
}

.sidebar .brand-logo-full,
.is-guest .sidebar .brand-logo-full {
    display: block !important;
    width: 112px !important;
    min-width: 112px !important;
    height: 39px !important;
}

.sidebar .brand-logo-mark,
.is-guest .sidebar .brand-logo-mark {
    display: none !important;
}

.sidebar .sidebar-toggle,
body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

.sidebar .sidebar-toggle-icon svg,
body.sidebar-collapsed .sidebar .sidebar-toggle-icon svg {
    width: 18px !important;
    height: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 34px !important;
}

body.sidebar-collapsed .sidebar .brand,
body.is-guest.sidebar-collapsed .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* Sidebar identity correction: smaller wordmark, more air, visible mark when collapsed. */
.sidebar .sidebar-head {
    grid-template-columns: 112px 56px !important;
    gap: 20px !important;
}

.sidebar .brand,
.is-guest .sidebar .brand {
    width: 112px !important;
    min-width: 112px !important;
}

.sidebar .brand > span.brand-logo-full,
.is-guest .sidebar .brand > span.brand-logo-full {
    display: block !important;
    width: 112px !important;
    min-width: 112px !important;
    height: 39px !important;
}

.sidebar .brand > span.brand-logo-mark,
.is-guest .sidebar .brand > span.brand-logo-mark {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand,
body.is-guest.sidebar-collapsed .sidebar .brand {
    width: 52px !important;
    min-width: 52px !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-full,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark {
    display: block !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* ABSOLUTE FINAL - sidebar logo proportions. Content width is 208px: 120 logo + 56 button + 10 gap. */
.sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: 120px 46px !important;
    align-items: center !important;
    justify-content: start !important;
    gap: 42px !important;
    margin: 0 0 40px !important;
}

.sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 120px !important;
    height: 52px !important;
    min-width: 120px !important;
    min-height: 52px !important;
    overflow: visible !important;
    padding: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    display: block !important;
    width: 120px !important;
    height: 42px !important;
    min-width: 120px !important;
    overflow: visible !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    overflow: visible !important;
}

.sidebar .brand-logo-full img,
.sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.sidebar .sidebar-toggle {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    border-radius: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 34px !important;
}

body.sidebar-collapsed .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

/* FINAL SIZE TUNE - keep Clinc readable without colliding with the collapse button. */
.sidebar .sidebar-head {
    grid-template-columns: minmax(0, 1fr) 56px !important;
    gap: 12px !important;
    margin: 0 0 42px !important;
}

.sidebar .brand {
    display: flex !important;
    width: 128px !important;
    height: 52px !important;
    min-height: 52px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.sidebar .brand-logo-full {
    display: block !important;
    width: 122px !important;
    height: 42px !important;
}

.sidebar .sidebar-toggle {
    width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    border-radius: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 34px !important;
}

body.sidebar-collapsed .sidebar .brand {
    display: flex !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 42px !important;
    height: 42px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

/* Company cards sizing: calmer, tighter and easier to scan. */
.company-index-v2 {
    padding: 22px !important;
}

.company-index-v2 .admin-filter-bar {
    gap: 10px !important;
    margin-top: 14px !important;
    padding: 14px !important;
    border-radius: 20px !important;
}

.company-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 16px !important;
}

.company-preview-card {
    gap: 13px !important;
    min-height: auto !important;
    padding: 16px !important;
    border-radius: 20px !important;
}

.company-preview-head {
    min-height: 52px !important;
}

.company-preview-head h3 {
    margin-top: 8px !important;
    font-size: 19px !important;
    line-height: 1.15 !important;
}

.company-preview-head > strong {
    min-width: 104px !important;
    text-align: right !important;
    font-size: 17px !important;
}

.company-preview-card .status-pill {
    min-width: 84px !important;
    justify-content: center !important;
    padding: 7px 12px !important;
    font-size: 12px !important;
}

.company-preview-metrics {
    grid-template-columns: repeat(4, minmax(72px, 1fr)) !important;
    gap: 7px !important;
}

.company-preview-metrics span {
    min-height: 66px !important;
    padding: 9px !important;
    border-radius: 13px !important;
}

.company-preview-metrics small {
    font-size: 10px !important;
    letter-spacing: 0.03em !important;
}

.company-preview-metrics b {
    font-size: 14px !important;
    line-height: 1.15 !important;
}

.company-preview-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.company-preview-actions form {
    min-width: 0 !important;
}

.company-preview-actions .table-action {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    border-radius: 12px !important;
}

.company-command {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 16px !important;
    padding: 20px !important;
}

.company-command h2 {
    font-size: clamp(28px, 3vw, 36px) !important;
    line-height: 1.05 !important;
}

.company-command-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    max-width: 640px !important;
}

.company-command-actions .button,
.company-command-actions .stripe-muted {
    min-height: 42px !important;
    border-radius: 12px !important;
}

@media (min-width: 1500px) {
    .company-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1100px) {
    .company-preview-metrics,
    .company-preview-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .company-command {
        grid-template-columns: 1fr !important;
    }

    .company-command-actions {
        justify-content: flex-start !important;
    }
}

/* Final brand lockup sizing: one logo per sidebar state. */
.sidebar .brand-logo-full {
    display: block !important;
    width: min(150px, 100%) !important;
    height: 52px !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
}

.sidebar .brand-logo-full img {
    object-fit: contain !important;
    object-position: left center !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img {
    object-fit: cover !important;
    object-position: center !important;
}

.sidebar .brand {
    overflow: hidden !important;
}

.sidebar .brand:hover {
    background: transparent !important;
}

@keyframes landingPanelIn {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 1280px) {
    :root {
        --erp-sidebar: 216px;
    }

    .v2-command-grid,
    .work-grid,
    .platform-dashboard-grid,
    .admin-work-grid,
    .stats-main-grid,
    .owner-main-grid,
    .billing-grid {
        grid-template-columns: 1fr !important;
    }

    .v2-revenue-layout,
    .task-grid {
        grid-template-columns: 1fr !important;
    }

    .v2-analytics-grid,
    .team-grid,
    .module-chip-grid,
    .company-stat-grid,
    .customer-summary-grid,
    .owner-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .admin-filter-bar,
    .admin-task-form,
    .customer-filter-bar,
    .owner-billing-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .app-shell,
    body.sidebar-collapsed .app-shell,
    .is-guest .app-shell {
        display: block !important;
    }

    .sidebar,
    body.sidebar-collapsed .sidebar,
    .is-guest .sidebar {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        padding: 12px !important;
    }

    .nav {
        grid-template-columns: repeat(auto-fit, minmax(42px, 1fr));
    }

    .auth-minimal,
    .v2-analytics-grid,
    .team-grid,
    .module-chip-grid,
    .company-stat-grid,
    .company-insight-row,
    .customer-summary-grid,
    .owner-kpi-grid,
    .room-day-strip,
    .task-calendar-mini,
    .task-calendar-full {
        grid-template-columns: 1fr !important;
    }

    .task-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-filter-bar,
    .admin-task-form,
    .billing-term-editor article,
    .customer-filter-bar,
    .owner-billing-strip {
        grid-template-columns: 1fr;
    }

    .auth-copy h2 {
        font-size: 30px;
    }

    .topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .landing-nav {
        grid-template-columns: 1fr;
    }

    .landing-nav-links,
    .landing-nav-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .landing-hero,
    .landing-access,
    .landing-feature-grid,
    .landing-guide-grid,
    .landing-plan-grid {
        grid-template-columns: 1fr;
    }

    .landing-product-card {
        max-width: 760px;
    }
}

@media (max-width: 640px) {
    .company-insight-main,
    .company-insight-metrics {
        grid-template-columns: 1fr;
    }

    .status-pill {
        justify-self: start;
    }

    .landing-nav,
    .landing-hero,
    .landing-section {
        width: min(100% - 24px, 1180px);
    }

    .landing-nav-links {
        display: none;
    }

    .landing-hero {
        padding-top: 46px;
    }

    .landing-product-card,
    .landing-section {
        border-radius: 22px;
    }

    .landing-section {
        padding: 22px;
    }

    .landing-calendar-preview {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .landing-calendar-preview div {
        border-right: 0;
        border-bottom: 1px solid var(--erp-line);
    }

    .landing-metric-row,
    .landing-form-grid,
    .landing-selected-plan {
        grid-template-columns: 1fr;
    }

    .landing-selected-plan small {
        grid-column: auto;
    }

    .landing-tour-panel {
        right: 12px;
        bottom: 12px;
        width: calc(100% - 24px);
    }
}

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

/* Clinc sidebar identity: crop the supplied presentation PNGs inside fixed UI lockups. */
.sidebar .sidebar-head {
    grid-template-columns: minmax(0, 1fr) 56px !important;
    gap: 14px !important;
    align-items: center !important;
    margin: 0 0 42px !important;
}

.sidebar .brand {
    position: relative !important;
    display: block !important;
    width: 174px !important;
    height: 74px !important;
    min-height: 74px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full,
.sidebar .brand-logo-mark {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    display: block !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
}

.sidebar .brand-logo-full img {
    position: absolute !important;
    width: 306px !important;
    max-width: none !important;
    height: auto !important;
    left: -66px !important;
    top: -62px !important;
    object-fit: initial !important;
    object-position: initial !important;
}

.sidebar .brand-logo-mark img {
    position: absolute !important;
    width: 162px !important;
    max-width: none !important;
    height: auto !important;
    left: -59px !important;
    top: -31px !important;
    object-fit: initial !important;
    object-position: initial !important;
}

.sidebar .sidebar-toggle {
    width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    border: 1px solid rgba(153, 246, 228, 0.48) !important;
    border-radius: 18px !important;
    background: rgba(19, 78, 74, 0.72) !important;
    color: #e0fdfa !important;
    box-shadow: inset 0 0 0 4px rgba(20, 184, 166, 0.10), 0 14px 32px rgba(2, 6, 23, 0.18) !important;
}

.sidebar .sidebar-toggle:hover {
    border-color: rgba(153, 246, 228, 0.72) !important;
    background: rgba(15, 118, 110, 0.72) !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin-bottom: 34px !important;
}

body.sidebar-collapsed .sidebar .brand {
    width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
}

body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 15px !important;
}

/* Polish pass: Clinc identity, proportional locks, compact cards and simple panels. */
.brand-logo-full {
    display: block !important;
    width: 136px !important;
    height: 44px !important;
    overflow: hidden !important;
}

.brand-logo-full img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.brand-logo-mark {
    display: none !important;
    width: 42px !important;
    height: 42px !important;
    overflow: hidden !important;
    border-radius: 14px !important;
}

.brand-logo-mark img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

body.sidebar-collapsed .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .brand-logo-mark {
    display: block !important;
}

.landing-brand span {
    display: inline-grid !important;
    place-items: center !important;
    overflow: hidden !important;
}

.landing-brand span img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.nav a,
.nav-locked {
    grid-template-columns: 38px minmax(0, 1fr) 34px !important;
    min-height: 48px !important;
    padding: 6px 10px !important;
}

.nav-icon {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
}

.nav-icon svg {
    width: 20px !important;
    height: 20px !important;
}

.nav-lock-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border: 1px solid rgba(153, 246, 228, 0.45) !important;
    border-radius: 999px !important;
    background: rgba(204, 251, 241, 0.94) !important;
    color: #0f766e !important;
}

.nav-lock-icon svg {
    width: 15px !important;
    height: 15px !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    grid-template-columns: 1fr !important;
    width: 44px !important;
    min-height: 44px !important;
    padding: 5px !important;
}

body.sidebar-collapsed .nav-lock-icon {
    display: none !important;
}

.employee-color-field input[type="color"] {
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    margin-bottom: 10px !important;
}

.employee-color-palette {
    display: grid !important;
    grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.employee-color-swatch {
    aspect-ratio: 1 !important;
    min-height: 34px !important;
    border: 2px solid #ffffff !important;
    border-radius: 12px !important;
    background: var(--employee-preset) !important;
    box-shadow: 0 0 0 1px var(--erp-line), 0 8px 18px rgba(15, 23, 42, 0.08) !important;
    cursor: pointer !important;
    transition: transform 160ms ease, box-shadow 160ms ease !important;
}

.employee-color-swatch:hover,
.employee-color-swatch[aria-pressed="true"] {
    transform: translateY(-1px) !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.22), 0 12px 22px rgba(15, 23, 42, 0.12) !important;
}

.company-card-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: 14px !important;
    margin-top: 18px !important;
}

.company-preview-card {
    display: grid !important;
    gap: 16px !important;
    padding: 18px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: var(--erp-shadow-soft) !important;
}

.company-preview-card.is-success {
    border-color: rgba(20, 184, 166, 0.24) !important;
}

.company-preview-card.is-warning {
    border-color: rgba(245, 158, 11, 0.28) !important;
}

.company-preview-card.is-danger {
    border-color: rgba(239, 68, 68, 0.28) !important;
}

.company-preview-head,
.company-preview-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

.company-preview-head h3 {
    margin: 10px 0 0 !important;
    color: var(--erp-text) !important;
    font-size: 20px !important;
    font-weight: 850 !important;
}

.company-preview-head > strong {
    color: var(--erp-text) !important;
    font-size: 18px !important;
    font-weight: 850 !important;
}

.company-preview-metrics {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.company-preview-metrics span {
    display: grid !important;
    gap: 4px !important;
    min-width: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 14px !important;
    background: var(--erp-surface-soft) !important;
}

.company-preview-metrics small {
    overflow: hidden !important;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    text-overflow: ellipsis !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.company-preview-metrics b {
    overflow: hidden !important;
    color: var(--erp-text) !important;
    font-size: 15px !important;
    font-weight: 850 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.company-preview-actions {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
}

.company-preview-actions .table-action {
    min-width: 112px !important;
    justify-content: center !important;
}

.task-modal,
.appointment-popover {
    position: fixed !important;
    inset: 0 !important;
    z-index: 80 !important;
    display: grid !important;
    place-items: center !important;
    padding: 20px !important;
    background: rgba(15, 23, 42, 0.30) !important;
    backdrop-filter: blur(10px) !important;
}

.task-modal[hidden],
.appointment-popover[hidden] {
    display: none !important;
}

.task-modal-card,
.popover-panel {
    width: min(100%, 620px) !important;
    max-height: calc(100vh - 40px) !important;
    overflow: auto !important;
    padding: 22px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.22) !important;
}

.task-modal-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin: 18px 0 0 !important;
}

.task-panel-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.panel-subsection {
    margin-top: 18px !important;
}

.panel-subsection h3 {
    margin: 0 0 10px !important;
    color: var(--erp-text) !important;
    font-size: 16px !important;
    font-weight: 850 !important;
}

.appointment-popover-head {
    display: grid !important;
    gap: 8px !important;
    margin-bottom: 16px !important;
}

.appointment-popover-head h2 {
    margin: 0 !important;
    color: var(--erp-text) !important;
    font-size: 24px !important;
    font-weight: 850 !important;
}

.appointment-popover-head span {
    justify-self: start !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    background: #ecfdf5 !important;
    color: #115e59 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.appointment-popover-summary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-bottom: 18px !important;
}

.appointment-popover-summary article {
    padding: 12px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 16px !important;
    background: var(--erp-surface-soft) !important;
}

.appointment-popover-summary small {
    display: block !important;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    text-transform: uppercase !important;
}

.appointment-popover-summary strong {
    display: block !important;
    margin-top: 4px !important;
    color: var(--erp-text) !important;
    font-size: 15px !important;
    font-weight: 850 !important;
}

.appointment-action-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.room-simple-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
    gap: 14px !important;
}

.room-simple-card {
    display: grid !important;
    gap: 14px !important;
    padding: 18px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: var(--erp-shadow-soft) !important;
}

.room-simple-head,
.room-simple-stats {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.room-simple-head strong {
    display: block !important;
    color: var(--erp-text) !important;
    font-size: 20px !important;
    font-weight: 850 !important;
}

.room-simple-head small,
.room-simple-stats small {
    color: var(--erp-muted) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.room-simple-score {
    text-align: right !important;
}

.room-simple-score strong {
    font-size: 34px !important;
    line-height: 1 !important;
}

.room-simple-meter {
    overflow: hidden !important;
    height: 9px !important;
    border-radius: 999px !important;
    background: #e2e8f0 !important;
}

.room-simple-meter span {
    display: block !important;
    height: 100% !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg, #14b8a6, #0f766e) !important;
}

.room-simple-stats span {
    display: grid !important;
    flex: 1 !important;
    gap: 2px !important;
    padding: 10px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 14px !important;
    background: var(--erp-surface-soft) !important;
}

.room-simple-stats strong {
    color: var(--erp-text) !important;
    font-size: 18px !important;
    font-weight: 850 !important;
}

.room-simple-week {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    align-items: end !important;
    gap: 7px !important;
    height: 54px !important;
}

.room-simple-week > span {
    display: flex !important;
    align-items: end !important;
    overflow: hidden !important;
    height: 100% !important;
    border-radius: 999px !important;
    background: #e2e8f0 !important;
}

.room-simple-week i {
    display: block !important;
    width: 100% !important;
    border-radius: inherit !important;
    background: #14b8a6 !important;
}

.room-simple-week .is-full i {
    background: #ef4444 !important;
}

.room-simple-week .is-medium i {
    background: #f59e0b !important;
}

.room-simple-slots {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.room-simple-slots small {
    width: 100% !important;
    color: var(--erp-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    text-transform: uppercase !important;
}

.room-simple-slots span {
    padding: 7px 12px !important;
    border: 1px solid #99f6e4 !important;
    border-radius: 999px !important;
    background: #ecfdf5 !important;
    color: #0f766e !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.revenue-headline {
    display: flex !important;
    align-items: baseline !important;
    gap: 10px !important;
    margin: 4px 0 14px !important;
}

.revenue-headline strong {
    color: var(--erp-text) !important;
    font-size: 32px !important;
    font-weight: 900 !important;
}

.revenue-headline span {
    color: var(--erp-muted) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.billing-health-list {
    display: grid !important;
    gap: 12px !important;
}

.billing-health-list article {
    display: grid !important;
    gap: 8px !important;
    padding: 12px !important;
    border: 1px solid var(--erp-line) !important;
    border-radius: 16px !important;
    background: var(--erp-surface-soft) !important;
}

.billing-health-list div {
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

.billing-health-list span {
    color: var(--erp-muted) !important;
    font-weight: 800 !important;
}

.billing-health-list strong {
    color: var(--erp-text) !important;
    font-size: 22px !important;
    font-weight: 900 !important;
}

.billing-health-list i {
    overflow: hidden !important;
    height: 8px !important;
    border-radius: 999px !important;
    background: #e2e8f0 !important;
}

.billing-health-list b {
    display: block !important;
    height: 100% !important;
    border-radius: inherit !important;
    background: #14b8a6 !important;
}

.billing-health-list .is-danger b {
    background: #ef4444 !important;
}

.billing-health-list .is-soft b {
    background: #f59e0b !important;
}

.billing-health-list .is-muted b {
    background: #94a3b8 !important;
}

@media (max-width: 900px) {
    .company-preview-metrics,
    .appointment-popover-summary,
    .task-modal-form {
        grid-template-columns: 1fr !important;
    }
}

/* FINAL SIDEBAR LOCKUP - exact user reference. */
:root {
    --erp-sidebar: 264px;
    --erp-sidebar-closed: 88px;
}

.sidebar {
    padding: 16px 10px !important;
}

body.sidebar-collapsed .sidebar {
    padding: 16px 14px !important;
}

.sidebar .sidebar-head {
    display: grid !important;
    grid-template-columns: 122px 46px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    margin: 0 0 56px !important;
}

.sidebar .brand {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    background: transparent !important;
}

.sidebar .brand-logo-full {
    display: block !important;
    width: 122px !important;
    min-width: 122px !important;
    height: 42px !important;
}

.sidebar .brand-logo-full img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.sidebar .brand-logo-mark {
    display: none !important;
}

.sidebar .sidebar-toggle,
body.sidebar-collapsed .sidebar .sidebar-toggle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    border-radius: 14px !important;
}

.sidebar .sidebar-toggle-icon svg,
body.sidebar-collapsed .sidebar .sidebar-toggle-icon svg {
    width: 18px !important;
    height: 18px !important;
}

body.sidebar-collapsed .sidebar .sidebar-head {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    margin: 0 0 48px !important;
}

body.sidebar-collapsed .sidebar .brand {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
    min-height: 60px !important;
    justify-content: center !important;
}

body.sidebar-collapsed .sidebar .brand-logo-full {
    display: none !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark {
    display: block !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand-logo-mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* TRUE EOF LOGO LOCK - keep button untouched, correct logo dimensions only. */

/* Support tickets */
.support-shell {
    display: grid;
    gap: 1.25rem;
}

.support-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.support-hero h2 {
    font-size: clamp(1.8rem, 3vw, 3rem);
    line-height: 1;
    margin: .25rem 0 .5rem;
}

.support-stats {
    display: flex;
    gap: .75rem;
}

.support-stats span,
.support-read-state {
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 1.25rem;
    background: #f8fafc;
    padding: .9rem 1rem;
}

.support-stats strong {
    display: block;
    color: #0f172a;
    font-size: 1.9rem;
    line-height: 1;
}

.support-stats small,
.support-read-state small,
.support-ticket-row small,
.support-admin-row small,
.support-side-card dt {
    color: #64748b;
    font-weight: 800;
}

.support-grid,
.support-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 1.25rem;
}

.support-detail-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
}

.support-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px;
    gap: .85rem;
}

.support-form .is-wide,
.support-form textarea,
.support-form .button {
    grid-column: 1 / -1;
}

.support-form label,
.support-filter-bar label {
    color: #475569;
    display: grid;
    gap: .4rem;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.support-form input,
.support-form select,
.support-form textarea,
.support-filter-bar input,
.support-filter-bar select {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 1rem;
    background: #fff;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 700;
    padding: .85rem 1rem;
    text-transform: none;
}

.support-form textarea {
    min-height: 150px;
    resize: vertical;
}

.support-ticket-list,
.support-admin-list {
    display: grid;
    gap: .75rem;
}

.support-ticket-row,
.support-admin-row {
    display: grid;
    align-items: center;
    gap: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 1.1rem;
    background: #fff;
    color: #0f172a;
    padding: 1rem;
    text-decoration: none;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.support-ticket-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.support-admin-row {
    grid-template-columns: 150px minmax(0, 1fr) auto;
}

.support-ticket-row:hover,
.support-admin-row:hover {
    border-color: #99f6e4;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
    transform: translateY(-1px);
}

.support-ticket-row strong,
.support-admin-row strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.support-ticket-row em {
    display: block;
    color: #64748b;
    font-style: normal;
    font-weight: 700;
}

.support-ticket-meta {
    display: grid;
    justify-items: end;
    gap: .35rem;
}

.support-ticket-number {
    border-radius: 999px;
    background: #ccfbf1;
    color: #134e4a;
    font-weight: 950;
    padding: .6rem .8rem;
    text-align: center;
}

.support-filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(180px, .7fr) minmax(160px, .5fr) auto auto;
    gap: .75rem;
    align-items: end;
    border: 1px solid #e2e8f0;
    border-radius: 1.25rem;
    background: #f8fafc;
    margin-bottom: 1rem;
    padding: 1rem;
}

.support-read-state {
    display: grid;
    gap: .25rem;
    margin: 1rem 0;
}

.support-read-state strong {
    color: #0f766e;
}

.support-message {
    white-space: pre-wrap;
    border: 1px solid #e2e8f0;
    border-radius: 1.25rem;
    background: #fff;
    color: #0f172a;
    font-size: 1rem;
    line-height: 1.7;
    margin: 1rem 0;
    padding: 1.1rem;
}

.support-message.is-admin {
    background: #ecfdf5;
    border-color: #99f6e4;
}

.support-message small {
    display: block;
    color: #0f766e;
    font-weight: 900;
    margin-bottom: .45rem;
    text-transform: uppercase;
}

.support-side-card dl {
    display: grid;
    gap: .75rem;
    margin: 1rem 0 0;
}

.support-side-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: .75rem;
}

.support-side-card dd {
    color: #0f172a;
    font-weight: 900;
    text-align: right;
}

.support-ticket-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
    gap: 1.25rem;
    align-items: start;
}

.support-admin-detail-card {
    overflow: hidden;
}

.support-ticket-topline,
.support-ticket-titlebar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.support-ticket-topline {
    margin-bottom: 1rem;
}

.support-ticket-titlebar {
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 1.1rem;
}

.support-ticket-titlebar h2 {
    color: #0f172a;
    font-size: clamp(1.75rem, 3vw, 2.7rem);
    line-height: 1.05;
    margin: .25rem 0 .35rem;
}

.support-ticket-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0;
}

.support-ticket-facts span {
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    background: #f8fafc;
    padding: .8rem .9rem;
}

.support-ticket-facts small {
    display: block;
    color: #64748b;
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .05em;
    margin-bottom: .35rem;
    text-transform: uppercase;
}

.support-ticket-facts strong {
    display: block;
    color: #0f172a;
    font-size: .98rem;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.support-thread {
    display: grid;
    gap: .85rem;
    margin-top: .5rem;
}

.support-thread-item {
    border: 1px solid #e2e8f0;
    border-radius: 1.25rem;
    background: #fff;
    padding: 1rem;
}

.support-thread-item header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .75rem;
}

.support-thread-item header span {
    color: #0f172a;
    font-weight: 950;
}

.support-thread-item header time {
    color: #64748b;
    font-size: .82rem;
    font-weight: 800;
    white-space: nowrap;
}

.support-thread-item p {
    color: #334155;
    font-size: 1.02rem;
    line-height: 1.65;
    margin: 0;
    white-space: pre-wrap;
}

.support-thread-item.is-client {
    border-color: #99f6e4;
    background: linear-gradient(180deg, #ffffff 0%, #f0fdfa 100%);
}

.support-thread-item.is-system {
    background: #f8fafc;
}

.support-thread-item.is-admin {
    border-color: #ccfbf1;
    background: #ecfdf5;
}

.support-resolution-card {
    position: sticky;
    top: 1.25rem;
}

.support-resolution-card .support-form {
    grid-template-columns: 1fr;
}

.support-resolution-card .support-form label {
    min-width: 0;
}

.support-resolution-card .support-form select {
    min-height: 3.2rem;
}

.support-resolution-card .support-form textarea {
    min-height: 9rem;
}

@media (max-width: 1100px) {
    .support-grid,
    .support-detail-grid,
    .support-ticket-workspace {
        grid-template-columns: 1fr;
    }

    .support-filter-bar {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .support-hero,
    .support-stats {
        align-items: stretch;
        flex-direction: column;
    }

    .support-form,
    .support-filter-bar,
    .support-admin-row,
    .support-ticket-row,
    .support-ticket-facts {
        grid-template-columns: 1fr;
    }

    .support-ticket-meta {
        justify-items: start;
    }
}

/* LAST UI LOCK - active after all inherited sidebar, landing and support blocks. */
body.is-guest .app-shell {
    display: block !important;
    min-height: 100vh !important;
}

body.is-guest .sidebar,
body.is-guest .topbar {
    display: none !important;
}

body.is-guest .main {
    min-height: 100vh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(22px, 4vw, 56px) !important;
    background: linear-gradient(115deg, rgba(204, 251, 241, .48) 0%, rgba(248, 250, 252, .9) 36%, #ffffff 100%) !important;
}

.landing-brand {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 180px !important;
}

.landing-brand span {
    width: 176px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.landing-brand span img {
    width: 176px !important;
    height: 50px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.legacy-hidden,
.landing-product-top,
.landing-calendar-preview,
.landing-metric-row {
    display: none !important;
}

body.sidebar-collapsed .sidebar {
    height: 100vh !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    padding-top: 12px !important;
    padding-bottom: 8px !important;
}

body.sidebar-collapsed .sidebar::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

body.sidebar-collapsed .nav {
    gap: 7px !important;
    padding-top: 0 !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 39px !important;
    min-width: 39px !important;
    height: 39px !important;
    min-height: 39px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 29px !important;
    min-width: 29px !important;
    height: 29px !important;
    flex-basis: 29px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 17px !important;
    height: 17px !important;
}
body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark {
    display: block !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img,
body.is-guest.sidebar-collapsed .sidebar .brand > span.brand-logo-mark img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}
/* EOF active lock: landing dark logo and collapsed sidebar rhythm. */
.landing-brand span {
    width: 184px !important;
    min-width: 184px !important;
    height: 52px !important;
    overflow: visible !important;
}

.landing-brand span img {
    width: 184px !important;
    height: 52px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.auth-premium-copy img {
    width: min(206px, 56%) !important;
    height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-value-path {
    align-self: end !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}

.landing-value-path span {
    min-height: 78px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid rgba(203, 213, 225, .78) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .76) !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    padding: 1rem !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .05) !important;
}

body.sidebar-collapsed .nav {
    gap: 8px !important;
    justify-items: center !important;
    padding-top: 2px !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 18.5px !important;
    height: 18.5px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 20px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -13px !important;
}

@media (max-width: 980px) {
    .landing-value-path {
        grid-template-columns: 1fr !important;
    }
}

/* TRUE EOF LOCK - commercial landing 2.0 and collapsed sidebar final rhythm. */
body.commercial-landing {
    background:
        radial-gradient(circle at 14% 18%, rgba(20, 184, 166, .16), transparent 30%),
        radial-gradient(circle at 88% 12%, rgba(15, 118, 110, .08), transparent 28%),
        linear-gradient(180deg, #f8fafc 0%, #f1f5f9 48%, #ffffff 100%) !important;
    color: #0f172a !important;
}

.landing-nav {
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: 74px !important;
    padding: 10px 14px !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .82) !important;
    border: 1px solid rgba(203, 213, 225, .8) !important;
    box-shadow: 0 22px 70px rgba(15, 23, 42, .08) !important;
    backdrop-filter: blur(22px) !important;
}

.landing-brand {
    min-width: 190px !important;
}

.landing-brand span,
.landing-brand span img {
    width: 186px !important;
    height: 48px !important;
}

.landing-commercial-hero {
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: calc(100vh - 118px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, .62fr) !important;
    align-items: center !important;
    gap: clamp(2.5rem, 7vw, 7rem) !important;
    padding: clamp(72px, 9vw, 136px) 0 clamp(42px, 7vw, 92px) !important;
}

.landing-commercial-hero .landing-hero-copy {
    max-width: 900px !important;
}

.landing-commercial-hero h1 {
    max-width: 900px !important;
    margin: 0 !important;
    font-size: clamp(4.4rem, 8.4vw, 8.4rem) !important;
    line-height: .88 !important;
    letter-spacing: 0 !important;
    font-weight: 850 !important;
}

.landing-commercial-hero .landing-lead {
    max-width: 760px !important;
    margin-top: 1.6rem !important;
    font-size: clamp(1.15rem, 1.6vw, 1.55rem) !important;
    line-height: 1.55 !important;
    color: #475569 !important;
}

.landing-demo-card {
    position: relative !important;
    overflow: hidden !important;
    min-height: 520px !important;
    border-radius: 36px !important;
    padding: clamp(28px, 4vw, 48px) !important;
    background:
        linear-gradient(145deg, rgba(15, 23, 42, .96), rgba(17, 94, 89, .92)),
        #0f172a !important;
    color: #ffffff !important;
    border: 1px solid rgba(153, 246, 228, .24) !important;
    box-shadow: 0 32px 90px rgba(15, 23, 42, .22) !important;
}

.landing-demo-card::before {
    content: "" !important;
    position: absolute !important;
    inset: -28% -20% auto auto !important;
    width: 320px !important;
    height: 320px !important;
    border-radius: 999px !important;
    background: radial-gradient(circle, rgba(20, 184, 166, .32), transparent 65%) !important;
    pointer-events: none !important;
}

.landing-demo-kicker {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 32px !important;
    padding: .3rem .7rem !important;
    border-radius: 999px !important;
    background: rgba(204, 251, 241, .12) !important;
    border: 1px solid rgba(153, 246, 228, .22) !important;
    color: #99f6e4 !important;
    font-size: .72rem !important;
    font-weight: 850 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.landing-demo-card strong {
    position: relative !important;
    display: block !important;
    max-width: 420px !important;
    margin-top: 1.25rem !important;
    font-size: clamp(2.2rem, 4vw, 4rem) !important;
    line-height: .96 !important;
    letter-spacing: 0 !important;
}

.landing-demo-card > div {
    position: relative !important;
    display: grid !important;
    gap: .75rem !important;
    margin: 2.2rem 0 !important;
}

.landing-demo-card p {
    display: grid !important;
    grid-template-columns: 92px 1fr !important;
    gap: .9rem !important;
    align-items: start !important;
    margin: 0 !important;
    padding: .95rem 0 !important;
    border-bottom: 1px solid rgba(203, 213, 225, .16) !important;
    color: rgba(255, 255, 255, .72) !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
}

.landing-demo-card p b {
    color: #ffffff !important;
    font-size: .95rem !important;
}

.landing-demo-card small {
    position: relative !important;
    display: block !important;
    max-width: 360px !important;
    color: rgba(255, 255, 255, .66) !important;
    line-height: 1.55 !important;
}

.landing-guide-section,
.landing-service-tour,
.landing-pricing-section,
.landing-access-section {
    width: min(1500px, calc(100% - 48px)) !important;
}

.landing-section-heading {
    max-width: 860px !important;
}

.landing-section-heading h2 {
    font-size: clamp(2.4rem, 5vw, 5.8rem) !important;
    line-height: .95 !important;
    letter-spacing: 0 !important;
}

.landing-sales-path {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.landing-sales-path article,
.landing-sales-path article.is-featured {
    grid-column: auto !important;
    min-height: 300px !important;
    padding: 1.65rem !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .84) !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    box-shadow: 0 22px 62px rgba(15, 23, 42, .06) !important;
}

.landing-sales-path article:nth-child(1) {
    background: linear-gradient(160deg, rgba(204, 251, 241, .82), rgba(255, 255, 255, .9)) !important;
    border-color: rgba(20, 184, 166, .32) !important;
}

.landing-sales-path span {
    color: #0f766e !important;
}

.landing-sales-path h3 {
    margin-top: 2.2rem !important;
    font-size: clamp(1.55rem, 2vw, 2.35rem) !important;
    line-height: 1 !important;
}

.landing-sales-path p {
    margin-top: 1rem !important;
    color: #475569 !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
}

.landing-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.1rem !important;
}

.landing-plan-card {
    border-radius: 30px !important;
    padding: 1.5rem !important;
    background: rgba(255, 255, 255, .9) !important;
    border: 1px solid rgba(203, 213, 225, .8) !important;
    box-shadow: 0 18px 58px rgba(15, 23, 42, .06) !important;
}

.landing-tour-backdrop {
    background: rgba(15, 23, 42, .16) !important;
    backdrop-filter: blur(5px) !important;
}

.landing-tour-panel {
    right: clamp(18px, 5vw, 72px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: min(440px, calc(100vw - 36px)) !important;
    border-radius: 30px !important;
    padding: 1.55rem !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .22) !important;
}

.is-tour-active {
    outline: 2px solid rgba(20, 184, 166, .34) !important;
    outline-offset: 8px !important;
    border-radius: 32px !important;
}

body.sidebar-collapsed .sidebar {
    overflow: hidden !important;
}

body.sidebar-collapsed .nav {
    gap: 9px !important;
    justify-items: center !important;
    padding-top: 0 !important;
    transform: translateY(-4px) !important;
}

body.sidebar-collapsed .nav a,
body.sidebar-collapsed .nav-locked {
    width: 43px !important;
    min-width: 43px !important;
    height: 43px !important;
    min-height: 43px !important;
    padding: 3px !important;
}

body.sidebar-collapsed .nav-icon {
    width: 33px !important;
    min-width: 33px !important;
    height: 33px !important;
    flex-basis: 33px !important;
}

body.sidebar-collapsed .nav-icon svg {
    width: 19.5px !important;
    height: 19.5px !important;
}

body.sidebar-collapsed .nav > a:first-of-type {
    margin-bottom: 24px !important;
}

body.sidebar-collapsed .nav > a:first-of-type::after {
    bottom: -16px !important;
}

@media (max-width: 1120px) {
    .landing-commercial-hero,
    .landing-sales-path,
    .landing-plan-grid {
        grid-template-columns: 1fr !important;
    }

    .landing-commercial-hero {
        min-height: auto !important;
        padding-top: 46px !important;
    }

    .landing-demo-card {
        min-height: auto !important;
    }
}

@media (max-width: 760px) {
    .landing-nav,
    .landing-commercial-hero,
    .landing-guide-section,
    .landing-pricing-section,
    .landing-access-section {
        width: min(100% - 24px, 1500px) !important;
    }

    .landing-brand {
        min-width: 140px !important;
    }

    .landing-brand span,
    .landing-brand span img {
        width: 136px !important;
        height: 38px !important;
    }

    .landing-commercial-hero h1 {
        font-size: clamp(3.25rem, 15vw, 5rem) !important;
    }

    .landing-demo-card p {
        grid-template-columns: 1fr !important;
    }
}

/* TRUE EOF LOCK - subtle product preview in commercial demo. */
.landing-product-peek {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 1.35rem !important;
}

.landing-product-peek .peek-topline {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
}

.landing-product-peek .peek-topline small {
    color: rgba(255, 255, 255, .62) !important;
    font-size: .82rem !important;
    font-weight: 800 !important;
    letter-spacing: .02em !important;
}

.landing-product-peek > strong {
    max-width: 520px !important;
    font-size: clamp(2rem, 3.4vw, 3.5rem) !important;
}

.peek-window {
    position: relative !important;
    z-index: 1 !important;
    overflow: hidden !important;
    min-height: 280px !important;
    border-radius: 28px !important;
    padding: 1rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .08)),
        rgba(15, 23, 42, .42) !important;
    border: 1px solid rgba(203, 213, 225, .18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 26px 58px rgba(0, 0, 0, .18) !important;
}

.peek-window::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, .09) 42%, transparent 72%) !important;
    transform: translateX(-72%) !important;
    animation: peek-sheen 5.6s ease-in-out infinite !important;
    pointer-events: none !important;
}

.peek-window-bar {
    display: flex !important;
    gap: .42rem !important;
    margin-bottom: .9rem !important;
}

.peek-window-bar span {
    width: .48rem !important;
    height: .48rem !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .28) !important;
}

.peek-grid {
    display: grid !important;
    grid-template-columns: 1.18fr .82fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: .75rem !important;
    margin: 0 !important;
}

.peek-grid section {
    position: relative !important;
    min-height: 112px !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    padding: .9rem !important;
    background: rgba(255, 255, 255, .9) !important;
    color: #0f172a !important;
    border: 1px solid rgba(203, 213, 225, .25) !important;
}

.peek-agenda {
    grid-row: span 2 !important;
}

.peek-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .75rem !important;
    margin-bottom: .75rem !important;
}

.peek-heading span {
    color: #64748b !important;
    font-size: .72rem !important;
    font-weight: 850 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.peek-heading b {
    color: #0f766e !important;
    font-size: .82rem !important;
}

.peek-calendar {
    position: relative !important;
    display: grid !important;
    grid-template-rows: repeat(4, 1fr) !important;
    gap: .55rem !important;
    min-height: 192px !important;
    padding-left: 2rem !important;
}

.peek-hour {
    position: relative !important;
    display: block !important;
    border-top: 1px solid #e2e8f0 !important;
    color: #94a3b8 !important;
    font-size: .7rem !important;
    font-weight: 800 !important;
}

.peek-hour::before {
    content: attr(class) !important;
    display: none !important;
}

.peek-appointment {
    position: absolute !important;
    left: 2.1rem !important;
    right: .1rem !important;
    display: flex !important;
    align-items: center !important;
    min-height: 40px !important;
    padding: 0 .8rem !important;
    border-radius: 14px !important;
    background: #ecfdf5 !important;
    border-left: 4px solid #14b8a6 !important;
    color: #134e4a !important;
    font-size: .78rem !important;
    font-style: normal !important;
    font-weight: 900 !important;
    box-shadow: 0 14px 28px rgba(15, 118, 110, .14) !important;
    animation: peek-float 4.8s ease-in-out infinite !important;
}

.peek-appointment.is-one {
    top: 38px !important;
}

.peek-appointment.is-two {
    top: 128px !important;
    border-left-color: #8b5cf6 !important;
    background: #f5f3ff !important;
    color: #4c1d95 !important;
    animation-delay: .7s !important;
}

.peek-people {
    display: grid !important;
    gap: .52rem !important;
}

.peek-people span {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    min-height: 32px !important;
    padding: .34rem .55rem .34rem 2rem !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: .82rem !important;
    font-weight: 850 !important;
}

.peek-people span::before {
    content: "" !important;
    position: absolute !important;
    left: .52rem !important;
    width: .82rem !important;
    height: .82rem !important;
    border-radius: 999px !important;
    background: var(--worker) !important;
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--worker) 18%, transparent) !important;
}

.peek-chart {
    min-height: 122px !important;
}

.peek-bars {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    align-items: end !important;
    gap: .55rem !important;
    min-height: 72px !important;
}

.peek-bars span {
    display: block !important;
    height: var(--bar) !important;
    min-height: 18px !important;
    border-radius: 999px 999px 8px 8px !important;
    background: linear-gradient(180deg, #14b8a6, #0f766e) !important;
    animation: peek-grow 3.8s ease-in-out infinite !important;
    transform-origin: bottom !important;
}

.peek-bars span:nth-child(2) {
    animation-delay: .22s !important;
}

.peek-bars span:nth-child(3) {
    animation-delay: .42s !important;
}

.peek-bars span:nth-child(4) {
    animation-delay: .64s !important;
}

@keyframes peek-sheen {
    0%, 46% {
        transform: translateX(-76%);
    }
    82%, 100% {
        transform: translateX(78%);
    }
}

@keyframes peek-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-3px);
    }
}

@keyframes peek-grow {
    0%, 100% {
        transform: scaleY(.86);
        opacity: .86;
    }
    50% {
        transform: scaleY(1);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .peek-window::after,
    .peek-appointment,
    .peek-bars span {
        animation: none !important;
    }
}

@media (max-width: 760px) {
    .peek-grid {
        grid-template-columns: 1fr !important;
    }

    .peek-agenda {
        grid-row: auto !important;
    }
}

/* TRUE EOF LOCK - compact product peek after inherited card rules. */
.landing-product-peek {
    min-height: 620px !important;
    max-height: 720px !important;
    padding: clamp(24px, 3vw, 36px) !important;
    gap: 1rem !important;
}

.landing-product-peek > .peek-topline,
.landing-product-peek > .peek-window {
    margin: 0 !important;
}

.landing-product-peek > .peek-topline {
    display: flex !important;
}

.landing-product-peek > .peek-window {
    display: block !important;
}

.landing-product-peek > strong {
    margin-top: .2rem !important;
    font-size: clamp(1.9rem, 2.8vw, 3.1rem) !important;
}

.peek-window {
    min-height: 286px !important;
    padding: .9rem !important;
}

.peek-grid {
    gap: .62rem !important;
}

.peek-grid section {
    min-height: 96px !important;
    padding: .78rem !important;
}

.peek-calendar {
    min-height: 164px !important;
    gap: .42rem !important;
}

.peek-appointment {
    min-height: 34px !important;
}

.peek-appointment.is-one {
    top: 34px !important;
}

.peek-appointment.is-two {
    top: 112px !important;
}

.landing-product-peek > small {
    margin-top: .1rem !important;
}

/* TRUE EOF LOCK - balanced preview layout for narrow hero card. */
.landing-product-peek {
    min-height: 640px !important;
    max-height: 660px !important;
}

.peek-window {
    min-height: 330px !important;
}

.peek-grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto !important;
}

.peek-agenda {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
}

.peek-grid section {
    min-height: 88px !important;
}

.peek-calendar {
    min-height: 132px !important;
}

.peek-appointment.is-one {
    top: 30px !important;
}

.peek-appointment.is-two {
    top: 90px !important;
}

.peek-bars {
    min-height: 50px !important;
}

/* TRUE EOF LOCK - compact no-scroll login. */
body.is-guest .main {
    min-height: 100dvh !important;
    padding: clamp(10px, 1.8vw, 22px) !important;
    overflow: hidden !important;
    place-items: center !important;
}

.auth-premium {
    width: min(1480px, 100%) !important;
    max-height: calc(100dvh - 28px) !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(460px, .86fr) minmax(420px, .66fr) !important;
    align-items: center !important;
    gap: clamp(1rem, 2.8vw, 2rem) !important;
}

.auth-premium-copy,
.auth-premium-card {
    min-height: 0 !important;
    max-height: calc(100dvh - 44px) !important;
    border-radius: 28px !important;
}

.auth-premium-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: clamp(.8rem, 1.5vw, 1.15rem) !important;
    padding: clamp(2rem, 4vw, 4rem) !important;
}

.auth-premium-copy img {
    width: min(166px, 46%) !important;
    height: 44px !important;
    margin-bottom: clamp(1.2rem, 3vw, 2.6rem) !important;
}

.auth-premium-copy h2 {
    max-width: 700px !important;
    font-size: clamp(3.1rem, 5.4vw, 5.65rem) !important;
    line-height: .91 !important;
    letter-spacing: 0 !important;
}

.auth-premium-copy p:not(.eyebrow) {
    max-width: 620px !important;
    font-size: clamp(1rem, 1.18vw, 1.22rem) !important;
    line-height: 1.45 !important;
}

.auth-premium-card {
    width: min(100%, 590px) !important;
    justify-self: center !important;
    padding: clamp(2rem, 3.4vw, 3.25rem) !important;
    gap: 1rem !important;
}

.auth-premium-card h2 {
    font-size: clamp(2.1rem, 3vw, 3.05rem) !important;
    line-height: 1 !important;
}

.auth-premium-card input {
    min-height: 54px !important;
    border-radius: 18px !important;
}

.auth-premium-card .button.primary {
    min-height: 54px !important;
    border-radius: 18px !important;
}

.auth-premium-card .notes {
    margin-top: .35rem !important;
}

@media (max-width: 1120px) {
    body.is-guest .main {
        overflow: auto !important;
        padding: 18px !important;
    }

    .auth-premium {
        grid-template-columns: 1fr !important;
        max-height: none !important;
    }

    .auth-premium-copy {
        display: none !important;
    }
}

/* TRUE EOF LOCK - client registration configurator and visible Stripe controls. */
.register-builder {
    width: min(1480px, 100%);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(300px, .42fr) minmax(0, 1fr);
    gap: 1.1rem;
    align-items: start;
}

.register-builder-copy,
.register-builder-form,
.register-section,
.company-stripe-card {
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 26px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 55px rgba(15, 23, 42, .08);
}

.register-builder-copy {
    position: sticky;
    top: 1rem;
    min-height: 520px;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    background: linear-gradient(145deg, #ffffff 0%, #f0fdfa 52%, #eef2ff 100%);
}

.register-builder-copy img {
    width: 156px;
    height: auto;
    margin-bottom: 1.4rem;
}

.register-builder-copy h2 {
    max-width: 560px;
    font-size: clamp(2.4rem, 4vw, 4.2rem);
    line-height: .94;
    letter-spacing: 0;
}

.register-builder-copy p {
    max-width: 520px;
    color: #64748b;
    font-size: 1.05rem;
    line-height: 1.6;
}

.register-builder-form {
    padding: clamp(1rem, 2vw, 1.4rem);
    display: grid;
    gap: .85rem;
}

.register-section {
    padding: clamp(1rem, 2vw, 1.35rem);
    display: grid;
    gap: 1rem;
    box-shadow: none;
}

.register-section.compact {
    grid-template-columns: minmax(180px, .28fr) 1fr;
    align-items: center;
}

.register-section h2 {
    font-size: clamp(1.35rem, 1.8vw, 1.8rem);
    line-height: 1.05;
    margin: .1rem 0 0;
}

.register-form-grid,
.register-plan-grid,
.register-term-grid,
.register-extra-grid {
    display: grid;
    gap: .75rem;
}

.register-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.register-form-grid label:last-child {
    grid-column: span 2;
}

.register-heading-row,
.register-submit-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.register-heading-row > strong {
    min-width: 220px;
    padding: .9rem 1.05rem;
    border-radius: 18px;
    background: #ecfdf5;
    color: #134e4a;
    text-align: center;
    font-size: 1.05rem;
}

.register-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.register-plan-card,
.register-term-card,
.register-extra-card {
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.register-plan-card input,
.register-term-card input,
.register-extra-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.register-plan-card > span,
.register-term-card > span {
    min-height: 172px;
    padding: 1rem;
    border: 1px solid #dbe4ef;
    border-radius: 22px;
    display: grid;
    gap: .65rem;
    background: #f8fafc;
}

.register-plan-card input:checked + span,
.register-term-card input:checked + span {
    border-color: #14b8a6;
    background: linear-gradient(145deg, #ecfdf5, #ffffff);
    box-shadow: 0 18px 42px rgba(20, 184, 166, .16);
}

.register-plan-card small,
.register-term-card small,
.register-extra-card small {
    color: #64748b;
    font-weight: 700;
}

.register-plan-card strong {
    font-size: 1.35rem;
}

.register-plan-card em {
    font-style: normal;
    font-size: 1.6rem;
    font-weight: 900;
    color: #0f172a;
}

.register-plan-card b {
    color: #64748b;
    font-weight: 600;
    line-height: 1.35;
}

.register-term-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.register-term-card > span {
    min-height: 86px;
}

.register-extra-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.register-extra-card {
    position: relative;
    min-height: 92px;
    padding: .95rem 1rem;
    border: 1px solid #dbe4ef;
    border-radius: 20px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .75rem;
    align-items: center;
    background: #ffffff;
}

.register-extra-card.is-selected {
    border-color: #14b8a6;
    background: #ecfdf5;
}

.register-extra-card.is-included {
    border-color: #ccfbf1;
    background: #f0fdfa;
}

.register-extra-card.is-included::after {
    content: "Incluido";
    position: absolute;
    top: .75rem;
    right: .85rem;
    padding: .25rem .55rem;
    border-radius: 999px;
    background: #ccfbf1;
    color: #134e4a;
    font-size: .72rem;
    font-weight: 900;
}

.register-extra-card strong {
    display: block;
    margin-bottom: .18rem;
}

.register-extra-card em {
    font-style: normal;
    color: #0f766e;
    font-weight: 900;
    padding-right: .2rem;
}

.register-submit-row {
    padding: 1rem;
    border-radius: 22px;
    background: #0f172a;
    color: #fff;
}

.register-submit-row small {
    display: block;
    margin-top: .2rem;
    color: #cbd5e1;
}

.register-submit-row .button {
    min-width: 220px;
}

.company-stripe-card {
    display: grid;
    grid-template-columns: minmax(260px, .82fr) minmax(360px, 1fr) auto;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
    padding: clamp(1rem, 2vw, 1.4rem);
    border-color: rgba(20, 184, 166, .28);
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 58%, #ecfdf5 100%);
}

.company-stripe-copy h2 {
    margin: .12rem 0;
    font-size: clamp(1.6rem, 2.4vw, 2.5rem);
    line-height: 1;
}

.company-stripe-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}

.company-stripe-summary span {
    min-height: 82px;
    padding: .85rem;
    border: 1px solid #dbe4ef;
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
}

.company-stripe-summary small {
    display: block;
    margin-bottom: .3rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 900;
    font-size: .72rem;
}

.company-stripe-summary strong {
    font-size: .98rem;
}

.company-stripe-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    justify-content: flex-end;
}

.stripe-muted {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: .7rem .9rem;
    border-radius: 16px;
    background: #fef3c7;
    color: #92400e;
    font-weight: 900;
}

.landing-register-route {
    padding: 1rem;
    border: 1px solid #dbe4ef;
    border-radius: 18px;
    display: grid;
    gap: .35rem;
    background: #f8fafc;
}

.landing-register-route strong {
    color: #0f172a;
}

.landing-register-route span {
    color: #64748b;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .register-builder,
    .company-stripe-card {
        grid-template-columns: 1fr;
    }

    .register-builder-copy {
        position: static;
        min-height: 0;
    }

    .company-stripe-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 860px) {
    .register-form-grid,
    .register-plan-grid,
    .register-term-grid,
    .register-extra-grid,
    .company-stripe-summary {
        grid-template-columns: 1fr;
    }

    .register-form-grid label:last-child {
        grid-column: auto;
    }

    .register-section.compact,
    .register-heading-row,
    .register-submit-row {
        display: grid;
    }
}

/* TRUE EOF LOCK - final polish for login brand, Stripe card and commercial agenda preview. */
.auth-premium-copy img {
    width: clamp(220px, 18vw, 310px) !important;
    height: auto !important;
    max-height: 82px !important;
    object-fit: contain !important;
    object-position: left center !important;
    margin-bottom: clamp(1.5rem, 3vw, 2.8rem) !important;
}

.company-stripe-card {
    position: relative !important;
    grid-template-columns: minmax(300px, .78fr) minmax(420px, 1fr) minmax(210px, auto) !important;
    overflow: hidden !important;
}

.company-stripe-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 7px;
    background: linear-gradient(180deg, #14b8a6, #0f766e);
}

.company-stripe-copy {
    position: relative;
    padding-left: .45rem;
}

.company-stripe-copy .eyebrow {
    color: #0f766e !important;
}

.company-stripe-summary span {
    position: relative;
    min-height: 96px !important;
    display: grid;
    align-content: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.company-stripe-summary span:first-child {
    border-color: rgba(20, 184, 166, .32);
    background: linear-gradient(145deg, #ecfdf5, #ffffff);
}

.company-stripe-summary strong {
    color: #0f172a;
    font-size: 1.05rem !important;
    line-height: 1.18;
}

.company-stripe-actions .button {
    min-width: 176px;
    justify-content: center;
}

.peek-calendar {
    grid-template-rows: repeat(4, 30px) !important;
    gap: .46rem !important;
    min-height: 152px !important;
    padding-left: 2.65rem !important;
    padding-top: .15rem !important;
}

.peek-hour {
    height: 30px !important;
    line-height: 30px !important;
    font-size: .76rem !important;
    overflow: visible !important;
}

.peek-hour::after {
    content: "";
    position: absolute;
    left: 2.15rem;
    right: 0;
    top: 0;
    height: 1px;
    background: #e2e8f0;
}

.peek-appointment {
    left: 4.35rem !important;
    min-height: 38px !important;
    padding: 0 1rem !important;
}

.peek-appointment.is-one {
    top: 39px !important;
}

.peek-appointment.is-two {
    top: 94px !important;
}

@media (max-width: 1180px) {
    .company-stripe-card {
        grid-template-columns: 1fr !important;
    }
}

/* TRUE EOF LOCK - immersive commercial tour and interactive product peek. */
.landing-tour-backdrop {
    background:
        radial-gradient(circle at 18% 18%, rgba(20, 184, 166, .18), transparent 28%),
        rgba(15, 23, 42, .48) !important;
    backdrop-filter: blur(10px) !important;
}

.landing-tour-panel {
    width: min(430px, calc(100vw - 28px)) !important;
    padding: 1.15rem !important;
    border-radius: 26px !important;
    border: 1px solid rgba(203, 213, 225, .72) !important;
    box-shadow: 0 28px 90px rgba(15, 23, 42, .24) !important;
    background: rgba(255, 255, 255, .94) !important;
}

.landing-tour-progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .45rem;
    margin-bottom: .9rem;
}

.landing-tour-progress button {
    height: 8px;
    border: 0;
    border-radius: 999px;
    color: transparent;
    background: #e2e8f0;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}

.landing-tour-progress button.is-active {
    background: linear-gradient(90deg, #0f766e, #14b8a6);
    transform: scaleY(1.6);
    box-shadow: 0 10px 24px rgba(20, 184, 166, .25);
}

.landing-tour-panel h2 {
    margin-top: .2rem !important;
    font-size: clamp(1.65rem, 2.5vw, 2.25rem) !important;
    line-height: 1.02 !important;
}

.landing-tour-panel [data-tour-body] {
    color: #64748b !important;
    line-height: 1.55 !important;
}

.landing-tour-points {
    display: grid;
    gap: .5rem;
    margin: .95rem 0 1rem;
    padding: 0;
    list-style: none;
}

.landing-tour-points li {
    position: relative;
    min-height: 40px;
    padding: .65rem .75rem .65rem 2rem;
    border: 1px solid #dbe4ef;
    border-radius: 16px;
    background: #f8fafc;
    color: #0f172a;
    font-weight: 800;
}

.landing-tour-points li::before {
    content: "";
    position: absolute;
    left: .72rem;
    top: 50%;
    width: .55rem;
    height: .55rem;
    border-radius: 999px;
    background: #14b8a6;
    transform: translateY(-50%);
    box-shadow: 0 0 0 5px rgba(20, 184, 166, .12);
}

.landing-tour-actions {
    display: grid !important;
    grid-template-columns: auto auto 1fr;
    gap: .55rem !important;
}

.landing-tour-actions [data-tour-next] {
    justify-self: stretch;
}

.landing-tour-actions [data-tour-prev][hidden] {
    display: none !important;
}

.commercial-landing .is-tour-active {
    position: relative;
    outline: 2px solid rgba(20, 184, 166, .42);
    outline-offset: 10px;
    border-radius: 34px;
    transition: outline-color .25s ease, transform .25s ease;
}

.peek-micro-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
    margin-top: .2rem;
}

.peek-micro-tabs button {
    min-height: 64px;
    padding: .65rem;
    border: 1px solid rgba(203, 213, 225, .24);
    border-radius: 18px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .82);
    text-align: left;
    font-weight: 900;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.peek-micro-tabs button small {
    display: block;
    margin-top: .18rem;
    color: rgba(203, 213, 225, .75);
    font-size: .72rem;
    line-height: 1.25;
}

.peek-micro-tabs button:hover,
.peek-micro-tabs button.is-active {
    transform: translateY(-2px);
    border-color: rgba(153, 246, 228, .55);
    background: rgba(20, 184, 166, .18);
}

.landing-product-peek[data-peek-mode="agenda"] .peek-agenda,
.landing-product-peek[data-peek-mode="team"] .peek-team,
.landing-product-peek[data-peek-mode="clients"] .peek-clients,
.landing-product-peek[data-peek-mode="billing"] .peek-chart {
    transform: translateY(-2px);
    border-color: rgba(20, 184, 166, .65) !important;
    box-shadow: 0 18px 38px rgba(20, 184, 166, .16) !important;
}

.peek-grid section {
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, opacity .22s ease !important;
}

.landing-product-peek[data-peek-mode="team"] .peek-agenda,
.landing-product-peek[data-peek-mode="clients"] .peek-agenda,
.landing-product-peek[data-peek-mode="billing"] .peek-agenda {
    opacity: .86;
}

@media (max-width: 760px) {
    .landing-tour-actions {
        grid-template-columns: 1fr !important;
    }

    .peek-micro-tabs {
        grid-template-columns: 1fr !important;
    }
}

/* TRUE EOF LOCK - commercial product tour 3 phases and tour overlay stability. */
.landing-tour[hidden] {
    display: none !important;
}

.landing-tour {
    position: fixed !important;
    inset: 0 !important;
    z-index: 9999 !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(1rem, 3vw, 2rem) !important;
    pointer-events: auto !important;
}

.landing-tour-backdrop {
    position: absolute !important;
    inset: 0 !important;
}

.landing-tour-panel {
    position: relative !important;
    z-index: 1 !important;
    max-height: calc(100dvh - 2rem) !important;
    overflow: auto !important;
}

body.tour-open {
    overflow: hidden !important;
}

.peek-clients .peek-client-list {
    gap: .55rem !important;
}

.peek-client-list span {
    display: grid !important;
    gap: .08rem !important;
    padding: .46rem .62rem .46rem 1.8rem !important;
}

.peek-client-list span b {
    color: #0f172a;
    font-size: .78rem;
    line-height: 1.05;
}

.peek-client-list span small {
    color: #64748b;
    font-size: .62rem;
    line-height: 1.1;
}

.landing-service-tour {
    display: grid;
    gap: clamp(1rem, 2vw, 1.35rem);
}

.service-tour-shell {
    display: grid;
    grid-template-columns: minmax(260px, .74fr) minmax(0, 1.26fr);
    gap: clamp(.9rem, 2vw, 1.25rem);
    align-items: stretch;
}

.service-tour-steps {
    display: grid;
    gap: .72rem;
}

.service-tour-steps button {
    width: 100%;
    min-height: 94px;
    padding: .95rem 1rem;
    border: 1px solid #dbe4ef;
    border-radius: 24px;
    background: rgba(255, 255, 255, .88);
    color: #0f172a;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
    transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}

.service-tour-steps button:hover,
.service-tour-steps button.is-active {
    transform: translateY(-2px);
    border-color: rgba(20, 184, 166, .48);
    background: linear-gradient(135deg, #ecfdf5, #ffffff);
    box-shadow: 0 20px 45px rgba(15, 118, 110, .12);
}

.service-tour-steps span {
    display: inline-flex;
    margin-bottom: .4rem;
    color: #0f766e;
    font-weight: 900;
    font-size: .78rem;
    letter-spacing: .08em;
}

.service-tour-steps strong {
    display: block;
    color: #0f172a;
    font-size: 1.05rem;
    line-height: 1.1;
}

.service-tour-steps small {
    display: block;
    margin-top: .3rem;
    color: #64748b;
    line-height: 1.35;
}

.service-tour-stage {
    position: relative;
    min-height: 360px;
    border: 1px solid #dbe4ef;
    border-radius: 30px;
    background:
        radial-gradient(circle at 82% 10%, rgba(20, 184, 166, .14), transparent 30%),
        linear-gradient(145deg, #ffffff, #f8fafc);
    box-shadow: 0 22px 58px rgba(15, 23, 42, .08);
    overflow: hidden;
}

.service-tour-stage article {
    display: none;
    grid-template-columns: minmax(250px, .76fr) minmax(300px, 1fr);
    gap: 1.15rem;
    align-items: center;
    min-height: 360px;
    padding: clamp(1rem, 2.4vw, 1.75rem);
}

.service-tour-stage article.is-active {
    display: grid;
}

.service-tour-stage h3 {
    margin: .2rem 0 .55rem;
    color: #0f172a;
    font-size: clamp(1.9rem, 3vw, 3rem);
    line-height: .98;
}

.service-tour-stage p:not(.landing-eyebrow) {
    color: #64748b;
    font-size: 1rem;
    line-height: 1.55;
    max-width: 42rem;
}

.service-visual {
    min-height: 260px;
    border: 1px solid #dbe4ef;
    border-radius: 26px;
    background: rgba(255, 255, 255, .9);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 18px 36px rgba(15, 23, 42, .08);
}

.service-calendar-visual {
    display: grid;
    grid-template-columns: 64px 1fr;
    grid-auto-rows: 58px;
    gap: .55rem;
    padding: 1.1rem;
}

.service-hour {
    display: flex;
    align-items: center;
    color: #94a3b8;
    font-weight: 900;
}

.service-card,
.service-free {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    padding: .72rem .85rem;
    border-radius: 18px;
    font-weight: 900;
}

.service-card small,
.service-free {
    color: #64748b;
    font-size: .78rem;
}

.service-card.is-teal {
    border: 1px solid rgba(20, 184, 166, .32);
    background: #ecfdf5;
    color: #0f766e;
}

.service-card.is-green {
    border: 1px solid rgba(15, 118, 110, .32);
    background: #f0fdfa;
    color: #134e4a;
}

.service-free {
    border: 1px dashed #cbd5e1;
    background: #f8fafc;
}

.service-client-visual {
    display: grid;
    gap: .8rem;
    align-content: center;
    padding: 1.1rem;
}

.service-client-visual span {
    display: grid;
    gap: .24rem;
    padding: .9rem 1rem;
    border: 1px solid #dbe4ef;
    border-radius: 18px;
    background: #ffffff;
}

.service-client-visual b {
    color: #0f172a;
}

.service-client-visual small {
    color: #64748b;
    font-weight: 800;
}

.service-business-visual {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .8rem;
    align-content: center;
    padding: 1.1rem;
}

.service-business-visual div {
    min-height: 118px;
    display: grid;
    align-content: end;
    gap: .35rem;
    padding: .9rem;
    border: 1px solid #dbe4ef;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.service-business-visual small {
    color: #64748b;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: .72rem;
}

.service-business-visual b {
    color: #0f172a;
    font-size: clamp(1.4rem, 2.6vw, 2.2rem);
    line-height: 1;
}

.service-business-visual > span {
    grid-column: 1 / -1;
    height: 88px;
    border-radius: 24px;
    background:
        linear-gradient(90deg, rgba(20, 184, 166, .92) 0 48%, rgba(15, 118, 110, .24) 48% 72%, rgba(245, 158, 11, .28) 72% 100%),
        #f8fafc;
    box-shadow: inset 0 0 0 1px rgba(203, 213, 225, .7);
}

@media (max-width: 980px) {
    .service-tour-shell,
    .service-tour-stage article {
        grid-template-columns: 1fr;
    }

    .service-tour-stage article {
        min-height: auto;
    }
}

@media (max-width: 720px) {
    .service-tour-steps {
        grid-template-columns: 1fr;
    }

    .service-business-visual {
        grid-template-columns: 1fr;
    }
}

/* TRUE EOF LOCK - landing review polish: readable, aligned and smooth. */
html {
    scroll-behavior: smooth !important;
}

.landing-nav {
    display: grid !important;
    grid-template-columns: auto minmax(320px, 1fr) auto !important;
    align-items: center !important;
    gap: clamp(1rem, 3vw, 2.5rem) !important;
}

.landing-nav-links {
    justify-content: center !important;
}

.landing-nav-actions {
    justify-self: end !important;
    display: flex !important;
    justify-content: flex-end !important;
    min-width: max-content !important;
}

.landing-button {
    min-height: 54px !important;
    padding: 0 1.3rem !important;
    border-radius: 20px !important;
    font-size: .98rem !important;
    line-height: 1 !important;
}

.landing-button.large {
    min-height: 58px !important;
    padding: 0 1.55rem !important;
}

.landing-commercial-hero,
.landing-service-tour,
.landing-guide-section,
.landing-pricing-section,
.landing-access-section {
    scroll-margin-top: 112px !important;
}

.landing-commercial-hero {
    grid-template-columns: minmax(0, .92fr) minmax(470px, .78fr) !important;
    gap: clamp(2rem, 4vw, 4.5rem) !important;
}

.landing-product-peek {
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: clamp(22px, 2.6vw, 32px) !important;
    gap: .8rem !important;
}

.landing-product-peek > div {
    margin: 0 !important;
}

.landing-product-peek > strong {
    max-width: 500px !important;
    margin-top: .05rem !important;
    font-size: clamp(1.55rem, 2.25vw, 2.35rem) !important;
    line-height: 1 !important;
}

.peek-window {
    min-height: 252px !important;
    padding: .78rem !important;
    border-radius: 24px !important;
}

.peek-window-bar {
    margin-bottom: .58rem !important;
}

.peek-grid {
    gap: .52rem !important;
    grid-template-rows: 170px 112px !important;
}

.peek-grid section {
    min-height: 78px !important;
    padding: .68rem !important;
    border-radius: 17px !important;
}

.peek-clients,
.peek-chart {
    max-height: 112px !important;
}

.peek-client-list span:nth-child(3) {
    display: none !important;
}

.peek-calendar {
    min-height: 114px !important;
    padding-left: 2.45rem !important;
}

.peek-hour {
    height: 24px !important;
    line-height: 24px !important;
}

.peek-appointment {
    left: 3.85rem !important;
    min-height: 30px !important;
    font-size: .74rem !important;
}

.peek-appointment.is-one {
    top: 28px !important;
}

.peek-appointment.is-two {
    top: 76px !important;
}

.peek-client-list span {
    min-height: 30px !important;
    padding-top: .36rem !important;
    padding-bottom: .36rem !important;
}

.peek-bars {
    min-height: 44px !important;
}

.landing-product-peek > small {
    max-width: 520px !important;
    color: rgba(255, 255, 255, .8) !important;
    font-size: .9rem !important;
}

.peek-micro-tabs {
    gap: .45rem !important;
}

.peek-micro-tabs button {
    min-height: 54px !important;
    padding: .55rem .62rem !important;
    border-radius: 16px !important;
}

.peek-micro-tabs button small {
    font-size: .66rem !important;
}

.landing-sales-path article:nth-child(1) h3,
.landing-sales-path article:nth-child(1) p {
    color: #0f172a !important;
}

.landing-sales-path span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 32px !important;
    border-radius: 999px !important;
    background: rgba(20, 184, 166, .12) !important;
    color: #0f766e !important;
    font-size: .78rem !important;
    letter-spacing: .08em !important;
}

.landing-sales-path article:nth-child(1) {
    background: linear-gradient(160deg, rgba(204, 251, 241, .72), rgba(255, 255, 255, .96)) !important;
}

.landing-plan-grid {
    align-items: stretch !important;
}

.landing-plan-card {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100% !important;
}

.landing-plan-card .landing-button {
    margin-top: auto !important;
}

.landing-plan-card ul {
    margin-bottom: 1.25rem !important;
}

.landing-tour {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: grid !important;
    place-items: center !important;
    padding: 24px !important;
    isolation: isolate !important;
}

.landing-tour[hidden] {
    display: none !important;
}

.landing-tour-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 0 !important;
    background:
        radial-gradient(circle at 70% 16%, rgba(20, 184, 166, .16), transparent 30%),
        rgba(15, 23, 42, .38) !important;
    backdrop-filter: blur(8px) saturate(1.05) !important;
}

.landing-tour-panel {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    z-index: 20 !important;
    width: min(460px, calc(100vw - 32px)) !important;
    max-height: calc(100dvh - 48px) !important;
    overflow: auto !important;
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
    transform-style: flat !important;
}

.landing-tour-panel h2,
.landing-tour-panel [data-tour-body],
.landing-tour-points li {
    text-shadow: none !important;
}

.landing-tour-actions {
    align-items: center !important;
}

.landing-tour-actions .landing-button {
    min-height: 48px !important;
    border-radius: 16px !important;
}

@media (max-width: 980px) {
    .landing-nav {
        grid-template-columns: 1fr !important;
    }

    .landing-nav-links,
    .landing-nav-actions {
        justify-self: stretch !important;
        justify-content: center !important;
    }
}

/* TRUE EOF LOCK - landing guided demo v2: non-blocking commercial assistant. */
.commercial-landing .is-tour-active {
    outline: 1px solid rgba(20, 184, 166, .45) !important;
    outline-offset: 10px !important;
    box-shadow: 0 22px 70px rgba(15, 118, 110, .13) !important;
    transition: outline-color .28s ease, box-shadow .28s ease !important;
}

.landing-tour {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: block !important;
    padding: 0 !important;
    pointer-events: none !important;
    isolation: isolate !important;
}

.landing-tour[hidden] {
    display: none !important;
}

.landing-tour-backdrop {
    display: none !important;
    background: transparent !important;
    backdrop-filter: none !important;
    pointer-events: none !important;
}

.landing-tour-panel {
    position: fixed !important;
    right: clamp(18px, 3vw, 42px) !important;
    bottom: clamp(18px, 3vw, 42px) !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: min(410px, calc(100vw - 28px)) !important;
    max-height: calc(100dvh - 36px) !important;
    overflow: auto !important;
    padding: 1rem !important;
    z-index: 2 !important;
    pointer-events: auto !important;
    border: 1px solid rgba(203, 213, 225, .9) !important;
    border-radius: 28px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(248, 250, 252, .96)) !important;
    box-shadow: 0 26px 80px rgba(15, 23, 42, .18), 0 0 0 1px rgba(255, 255, 255, .72) inset !important;
    backdrop-filter: blur(18px) saturate(1.05) !important;
}

body.tour-open {
    overflow: auto !important;
}

.landing-tour-progress {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: .38rem !important;
    margin-bottom: .85rem !important;
}

.landing-tour-progress button {
    min-height: 34px !important;
    border: 1px solid #dbe4ef !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    color: #64748b !important;
    font-size: .78rem !important;
    font-weight: 900 !important;
    cursor: pointer !important;
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease !important;
}

.landing-tour-progress button:hover,
.landing-tour-progress button.is-active {
    transform: translateY(-1px) !important;
    border-color: rgba(20, 184, 166, .45) !important;
    background: #ccfbf1 !important;
    color: #134e4a !important;
}

.landing-tour-panel .landing-eyebrow {
    margin: 0 0 .32rem !important;
    color: #0f766e !important;
    font-size: .72rem !important;
    letter-spacing: .09em !important;
}

.landing-tour-panel h2 {
    margin: 0 0 .5rem !important;
    color: #0f172a !important;
    font-size: clamp(1.35rem, 2vw, 1.75rem) !important;
    line-height: 1.05 !important;
    text-shadow: none !important;
}

.landing-tour-panel [data-tour-body] {
    margin: 0 0 .8rem !important;
    color: #475569 !important;
    font-size: .96rem !important;
    line-height: 1.45 !important;
    text-shadow: none !important;
}

.landing-tour-points {
    display: grid !important;
    gap: .42rem !important;
    margin: 0 0 .95rem !important;
    padding: 0 !important;
    list-style: none !important;
}

.landing-tour-points li {
    position: relative !important;
    padding: .58rem .7rem .58rem 2rem !important;
    border: 1px solid rgba(20, 184, 166, .18) !important;
    border-radius: 16px !important;
    background: rgba(236, 253, 245, .78) !important;
    color: #334155 !important;
    font-size: .88rem !important;
    line-height: 1.25 !important;
    text-shadow: none !important;
}

.landing-tour-points li::before {
    content: "" !important;
    position: absolute !important;
    left: .78rem !important;
    top: 50% !important;
    width: .5rem !important;
    height: .5rem !important;
    border-radius: 999px !important;
    background: #14b8a6 !important;
    transform: translateY(-50%) !important;
}

.landing-tour-actions {
    display: grid !important;
    grid-template-columns: auto auto 1fr !important;
    gap: .5rem !important;
    align-items: center !important;
}

.landing-tour-actions .landing-button {
    min-height: 44px !important;
    padding: 0 .9rem !important;
    border-radius: 16px !important;
    font-size: .88rem !important;
}

.landing-tour-actions [data-tour-next] {
    justify-self: stretch !important;
}

.landing-tour-actions [data-tour-prev][hidden] {
    display: none !important;
}

.landing-tour-actions [data-tour-prev][hidden] + [data-tour-next],
.landing-tour-actions [data-tour-next]:first-child {
    grid-column: auto !important;
}

@media (max-width: 760px) {
    .landing-tour-panel {
        right: 12px !important;
        bottom: 12px !important;
        width: calc(100vw - 24px) !important;
        border-radius: 24px !important;
    }

    .landing-tour-actions {
        grid-template-columns: 1fr 1fr !important;
    }

    .landing-tour-actions [data-tour-next] {
        grid-column: 1 / -1 !important;
    }
}

/* TRUE EOF LOCK - guided demo v3: bottom sales dock, landing stays visible. */
.landing-tour-panel {
    left: 50% !important;
    right: auto !important;
    bottom: clamp(14px, 2vw, 24px) !important;
    top: auto !important;
    width: min(980px, calc(100vw - 40px)) !important;
    max-height: min(34dvh, 260px) !important;
    padding: .9rem !important;
    transform: translateX(-50%) !important;
    display: grid !important;
    grid-template-columns: minmax(220px, .8fr) minmax(320px, 1.4fr) auto !important;
    grid-template-areas:
        "progress content actions" !important;
    column-gap: .95rem !important;
    align-items: center !important;
    border-radius: 26px !important;
}

.landing-tour-progress {
    grid-area: progress !important;
    margin: 0 !important;
    align-self: stretch !important;
    grid-template-columns: repeat(4, 1fr) !important;
}

.landing-tour-panel .landing-eyebrow,
.landing-tour-panel h2,
.landing-tour-panel [data-tour-body],
.landing-tour-points {
    grid-area: content !important;
}

.landing-tour-panel .landing-eyebrow {
    align-self: start !important;
    margin-top: .12rem !important;
}

.landing-tour-panel h2 {
    margin-top: 1.15rem !important;
    font-size: clamp(1.18rem, 1.65vw, 1.45rem) !important;
}

.landing-tour-panel [data-tour-body] {
    margin-top: 3rem !important;
    margin-bottom: 0 !important;
    max-width: 52rem !important;
    font-size: .9rem !important;
    line-height: 1.35 !important;
}

.landing-tour-points {
    display: none !important;
}

.landing-tour-actions {
    grid-area: actions !important;
    grid-template-columns: 1fr !important;
    width: 190px !important;
}

.landing-tour-actions .landing-button {
    width: 100% !important;
    min-height: 40px !important;
    border-radius: 14px !important;
}

.landing-tour-actions [data-tour-close] {
    order: 3 !important;
}

.landing-tour-actions [data-tour-prev] {
    order: 2 !important;
}

.landing-tour-actions [data-tour-next] {
    order: 1 !important;
}

.commercial-landing .is-tour-active {
    outline-offset: 6px !important;
    box-shadow: 0 18px 48px rgba(15, 118, 110, .1) !important;
}

@media (max-width: 920px) {
    .landing-tour-panel {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "progress"
            "content"
            "actions" !important;
        max-height: calc(100dvh - 24px) !important;
    }

    .landing-tour-progress {
        min-height: 36px !important;
    }

    .landing-tour-panel [data-tour-body] {
        margin-top: 3.1rem !important;
    }

    .landing-tour-actions {
        width: 100% !important;
        grid-template-columns: 1fr 1fr 1fr !important;
    }
}

/* TRUE EOF LOCK - landing 2.1: quieter sales page and minimal guided bar. */
.commercial-landing {
    overflow-x: hidden !important;
}

.landing-nav {
    width: min(1480px, calc(100vw - 48px)) !important;
    min-height: 70px !important;
    padding: .75rem 1rem !important;
    gap: clamp(1.1rem, 4vw, 4rem) !important;
}

.landing-brand span {
    width: 148px !important;
    height: 46px !important;
    overflow: visible !important;
}

.landing-brand span img {
    width: 148px !important;
    height: 46px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-nav-links {
    gap: clamp(1.4rem, 4vw, 4.2rem) !important;
}

.landing-nav-links a,
.landing-link-button {
    color: #475569 !important;
    font-size: .96rem !important;
    font-weight: 800 !important;
}

.landing-nav-actions {
    gap: .72rem !important;
}

.landing-nav-actions .landing-button,
.landing-nav-actions .landing-link-button {
    min-height: 48px !important;
    border-radius: 18px !important;
    padding: 0 1.05rem !important;
}

.landing-commercial-hero {
    min-height: calc(100dvh - 112px) !important;
    grid-template-columns: minmax(0, .9fr) minmax(430px, .72fr) !important;
    align-items: center !important;
    padding-top: clamp(2rem, 5vw, 4rem) !important;
}

.landing-hero h1 {
    max-width: 820px !important;
    font-size: clamp(4rem, 7.4vw, 8.4rem) !important;
    line-height: .9 !important;
    letter-spacing: -.035em !important;
}

.landing-lead {
    max-width: 820px !important;
    color: #475569 !important;
    font-size: clamp(1.02rem, 1.25vw, 1.28rem) !important;
    line-height: 1.55 !important;
}

.landing-section-heading h2 {
    max-width: 980px !important;
    font-size: clamp(2.2rem, 4.4vw, 5.4rem) !important;
    line-height: .96 !important;
    letter-spacing: -.03em !important;
}

.landing-section-heading p:not(.landing-eyebrow) {
    color: #475569 !important;
}

.service-tour-shell {
    grid-template-columns: minmax(220px, .48fr) minmax(0, 1fr) !important;
}

.service-tour-steps {
    gap: .58rem !important;
}

.service-tour-steps button {
    min-height: 78px !important;
    padding: .78rem .9rem !important;
    border-radius: 20px !important;
}

.service-tour-steps strong {
    font-size: .98rem !important;
}

.service-tour-steps small {
    font-size: .78rem !important;
}

.service-tour-stage {
    min-height: 300px !important;
    border-radius: 26px !important;
}

.service-tour-stage article {
    min-height: 300px !important;
    grid-template-columns: minmax(230px, .72fr) minmax(280px, 1fr) !important;
}

.service-tour-stage h3 {
    font-size: clamp(1.9rem, 3.4vw, 4rem) !important;
    line-height: .96 !important;
}

.service-tour-stage p:not(.landing-eyebrow) {
    max-width: 38rem !important;
    font-size: .98rem !important;
    color: #475569 !important;
}

.landing-guide-grid article,
.landing-plan-card {
    border-radius: 26px !important;
}

.landing-tour-panel {
    left: 50% !important;
    right: auto !important;
    bottom: 18px !important;
    width: min(760px, calc(100vw - 44px)) !important;
    max-height: 128px !important;
    min-height: 104px !important;
    padding: .72rem !important;
    display: grid !important;
    grid-template-columns: 146px minmax(0, 1fr) 180px !important;
    grid-template-areas: "progress content actions" !important;
    gap: .72rem !important;
    align-items: center !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 18px 52px rgba(15, 23, 42, .18) !important;
}

.landing-tour-progress {
    grid-area: progress !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: .35rem !important;
}

.landing-tour-progress button {
    min-height: 32px !important;
    padding: 0 !important;
    font-size: .72rem !important;
}

.landing-tour-panel .landing-eyebrow {
    grid-area: content !important;
    margin: -.1rem 0 0 !important;
    align-self: start !important;
    font-size: .68rem !important;
}

.landing-tour-panel h2 {
    grid-area: content !important;
    margin: 1.1rem 0 0 !important;
    align-self: start !important;
    font-size: 1.08rem !important;
    line-height: 1.05 !important;
}

.landing-tour-panel [data-tour-body] {
    grid-area: content !important;
    margin: 2.55rem 0 0 !important;
    align-self: start !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    color: #64748b !important;
    font-size: .82rem !important;
    line-height: 1.28 !important;
}

.landing-tour-points {
    display: none !important;
}

.landing-tour-actions {
    grid-area: actions !important;
    width: 180px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .42rem !important;
}

.landing-tour-actions .landing-button {
    min-height: 38px !important;
    padding: 0 .65rem !important;
    border-radius: 14px !important;
    font-size: .8rem !important;
}

.landing-tour-actions [data-tour-close] {
    order: 2 !important;
}

.landing-tour-actions [data-tour-prev] {
    order: 1 !important;
}

.landing-tour-actions [data-tour-next] {
    order: 3 !important;
    grid-column: 1 / -1 !important;
}

@media (max-width: 860px) {
    .landing-commercial-hero,
    .service-tour-shell,
    .service-tour-stage article {
        grid-template-columns: 1fr !important;
    }

    .landing-tour-panel {
        width: calc(100vw - 24px) !important;
        max-height: none !important;
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "progress"
            "content"
            "actions" !important;
    }

    .landing-tour-actions {
        width: 100% !important;
    }
}

/* TRUE EOF LOCK - landing 2.2: calmer commercial scale. */
.landing-section-heading h2 {
    font-size: clamp(2rem, 3.4vw, 4.1rem) !important;
    line-height: 1 !important;
    max-width: 820px !important;
}

.landing-service-tour {
    padding-top: clamp(1.4rem, 3vw, 2.4rem) !important;
}

.service-tour-shell {
    grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr) !important;
    gap: .9rem !important;
}

.service-tour-stage h3 {
    font-size: clamp(1.65rem, 2.65vw, 3.15rem) !important;
    line-height: 1.02 !important;
    max-width: 360px !important;
}

.service-tour-stage article {
    padding: clamp(1rem, 1.8vw, 1.35rem) !important;
    gap: .85rem !important;
}

.service-visual {
    min-height: 220px !important;
}

.service-calendar-visual {
    grid-auto-rows: 48px !important;
}

.landing-tour-panel {
    left: auto !important;
    right: 20px !important;
    bottom: 20px !important;
    width: min(440px, calc(100vw - 32px)) !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    grid-template-areas:
        "progress content"
        "actions actions" !important;
    padding: .72rem !important;
    gap: .58rem .68rem !important;
}

.landing-tour-progress {
    grid-template-columns: repeat(2, 1fr) !important;
    align-self: center !important;
}

.landing-tour-progress button {
    min-height: 28px !important;
    font-size: .68rem !important;
}

.landing-tour-panel .landing-eyebrow {
    margin-top: 0 !important;
}

.landing-tour-panel h2 {
    margin-top: .98rem !important;
    font-size: 1rem !important;
}

.landing-tour-panel [data-tour-body] {
    margin-top: 2.28rem !important;
    -webkit-line-clamp: 1 !important;
    font-size: .78rem !important;
}

.landing-tour-actions {
    width: 100% !important;
    grid-template-columns: 1fr 1fr 1.35fr !important;
}

.landing-tour-actions [data-tour-next] {
    grid-column: auto !important;
}

.landing-tour-actions .landing-button {
    min-height: 36px !important;
}

@media (max-width: 720px) {
    .landing-tour-panel {
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
    }
}

/* Commercial/legal acceptance flow. Keep this explicit: Clinc is a service, not a boxed program. */
.legal-consent-section {
    gap: 1.1rem !important;
}

.legal-consent-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .8fr);
    gap: 1rem;
}

.legal-consent-card {
    border: 1px solid var(--border);
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    padding: 1rem;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .06);
    display: grid;
    gap: .85rem;
}

.legal-consent-card:first-child,
.support-terms-card {
    grid-column: 1 / -1;
}

.legal-consent-card > div:first-child {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.legal-consent-card strong {
    color: var(--ink);
    font-size: 1rem;
}

.legal-consent-card small,
.legal-short-copy {
    color: var(--muted);
    line-height: 1.55;
}

.legal-scroll-box {
    max-height: 245px;
    overflow: auto;
    border: 1px solid #dbe7ef;
    border-radius: 18px;
    background: #ffffff;
    padding: .9rem 1rem;
    color: #334155;
    line-height: 1.6;
}

.legal-scroll-box.compact {
    max-height: 170px;
}

.legal-scroll-box p {
    margin: 0 0 .8rem;
}

.legal-scroll-box p:last-child {
    margin-bottom: 0;
}

.legal-scroll-box.is-read {
    border-color: rgba(20, 184, 166, .7);
    box-shadow: inset 0 0 0 1px rgba(20, 184, 166, .14);
}

.legal-check {
    display: flex;
    align-items: flex-start;
    gap: .72rem;
    border: 1px solid #dbe7ef;
    border-radius: 16px;
    background: #f8fafc;
    padding: .78rem .85rem;
    color: #334155;
    font-weight: 800;
    line-height: 1.45;
}

.legal-check input {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    margin-top: .1rem;
    accent-color: #0f766e;
}

.legal-check input:disabled + span {
    color: #94a3b8;
}

.support-terms-card.is-muted {
    opacity: .68;
}

.support-terms-card.is-required {
    border-color: rgba(20, 184, 166, .62);
    box-shadow: 0 18px 42px rgba(15, 118, 110, .12);
}

.support-choice-grid .register-extra-card.is-selected {
    border-color: rgba(15, 118, 110, .52);
    background: #ecfdf5;
}

.compact-support-terms {
    margin: .35rem 0 0;
}

.wide-field {
    grid-column: 1 / -1;
}

@media (max-width: 920px) {
    .legal-consent-grid {
        grid-template-columns: 1fr;
    }
}

/* Sectorized product layer. The SaaS core stays the same; these cards expose
   vertical style choices for onboarding and company settings. */
.vertical-style-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .8rem;
}

.vertical-style-grid.compact {
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.vertical-style-card {
    position: relative;
    display: grid;
    gap: .42rem;
    min-height: 148px;
    border: 1px solid color-mix(in srgb, var(--vertical-accent) 28%, #dbe7ef);
    border-radius: 22px;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--vertical-soft) 42%, #fff) 0%, #fff 70%),
        #fff;
    padding: .95rem;
    cursor: pointer;
    overflow: hidden;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.vertical-style-card::after {
    content: "";
    position: absolute;
    inset: auto -18px -28px auto;
    width: 86px;
    height: 86px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--vertical-accent) 18%, transparent);
    filter: blur(2px);
}

.vertical-style-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.vertical-style-card:has(input:checked) {
    border-color: var(--vertical-accent);
    box-shadow: 0 18px 42px color-mix(in srgb, var(--vertical-accent) 18%, transparent);
}

.vertical-style-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.vertical-style-swatch {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background:
        linear-gradient(135deg, var(--vertical-accent), color-mix(in srgb, var(--vertical-accent) 48%, #ffffff));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55);
}

.vertical-style-card strong {
    position: relative;
    z-index: 1;
    color: var(--erp-text);
    font-size: 1rem;
    line-height: 1.1;
}

.vertical-style-card small,
.vertical-style-card em {
    position: relative;
    z-index: 1;
    color: var(--erp-muted);
    font-style: normal;
    line-height: 1.35;
}

.vertical-style-card em {
    font-size: .84rem;
}

.landing-vertical-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    max-width: 760px;
    margin: 1.2rem 0 0;
}

.landing-vertical-strip span {
    border: 1px solid color-mix(in srgb, var(--vertical-accent) 34%, #dbe7ef);
    border-radius: 999px;
    background: color-mix(in srgb, var(--vertical-soft) 58%, #ffffff);
    color: #0f172a;
    padding: .55rem .78rem;
    font-size: .82rem;
    font-weight: 850;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
}

body[class*="vertical-"] .button.primary,
body[class*="vertical-"] .nav a.active,
body[class*="vertical-"] .nav-locked.active {
    background: var(--vertical-accent) !important;
    border-color: color-mix(in srgb, var(--vertical-accent) 70%, #ffffff) !important;
}

body[class*="vertical-"] .nav a.active .nav-icon,
body[class*="vertical-"] .nav-locked.active .nav-icon {
    background: color-mix(in srgb, var(--vertical-accent) 40%, #0f172a) !important;
}

body[class*="vertical-"] input:focus,
body[class*="vertical-"] select:focus,
body[class*="vertical-"] textarea:focus {
    border-color: var(--vertical-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--vertical-accent) 18%, transparent) !important;
}

/* Fase 41 - verticales reales: cada negocio cambia identidad completa, no solo el acento. */
body[class*="vertical-"] {
    --erp-bg: var(--vertical-bg);
    --erp-surface: var(--vertical-surface);
    --erp-surface-soft: var(--vertical-surface-soft);
    --erp-hover: color-mix(in srgb, var(--vertical-soft) 48%, #ffffff);
    --erp-primary: var(--vertical-accent);
    --erp-primary-hover: color-mix(in srgb, var(--vertical-accent) 82%, #000000);
    --erp-primary-active: color-mix(in srgb, var(--vertical-accent) 68%, #000000);
    --erp-accent: var(--vertical-accent);
    --erp-primary-soft: var(--vertical-soft);
    --erp-text: var(--vertical-text);
    --erp-muted: var(--vertical-muted);
    --erp-sidebar-bg: var(--vertical-sidebar);
    background:
        radial-gradient(circle at 6% 0%, color-mix(in srgb, var(--vertical-accent) 12%, transparent), transparent 30rem),
        radial-gradient(circle at 100% 4%, color-mix(in srgb, var(--vertical-soft) 34%, transparent), transparent 34rem),
        var(--vertical-bg) !important;
    color: var(--vertical-text) !important;
}

body[class*="vertical-"] .main {
    background:
        radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--vertical-accent) 9%, transparent), transparent 28rem),
        var(--vertical-bg) !important;
}

body[class*="vertical-"] .sidebar {
    background: linear-gradient(180deg, var(--vertical-sidebar), color-mix(in srgb, var(--vertical-sidebar) 88%, #000000)) !important;
    border-right-color: color-mix(in srgb, var(--vertical-accent) 30%, transparent) !important;
}

body[class*="vertical-"] .topbar,
body[class*="vertical-"] .metric-card,
body[class*="vertical-"] .panel,
body[class*="vertical-"] .card,
body[class*="vertical-"] .dashboard-card,
body[class*="vertical-"] .owner-panel,
body[class*="vertical-"] .invoice-panel,
body[class*="vertical-"] .company-show-v2 > section,
body[class*="vertical-"] .calendar-focus-shell,
body[class*="vertical-"] .support-admin-card,
body[class*="vertical-"] .register-section,
body[class*="vertical-"] .settings-panel {
    border-color: color-mix(in srgb, var(--vertical-accent) 20%, #dbe7ef) !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--vertical-surface) 94%, #ffffff), color-mix(in srgb, var(--vertical-surface-soft) 40%, var(--vertical-surface))) !important;
    box-shadow: 0 18px 42px color-mix(in srgb, var(--vertical-dark) 10%, transparent) !important;
}

body[class*="vertical-"] .button.primary,
body[class*="vertical-"] .landing-button.primary,
body[class*="vertical-"] button[type="submit"].button,
body[class*="vertical-"] .nav a.active {
    background: var(--vertical-accent) !important;
    border-color: color-mix(in srgb, var(--vertical-accent) 74%, #ffffff) !important;
    color: var(--vertical-button-text) !important;
}

body[class*="vertical-"] .button.primary:hover,
body[class*="vertical-"] button[type="submit"].button:hover {
    background: color-mix(in srgb, var(--vertical-accent) 84%, #000000) !important;
}

body.vertical-barbershop .topbar,
body.vertical-barbershop .metric-card,
body.vertical-barbershop .panel,
body.vertical-barbershop .card,
body.vertical-barbershop .dashboard-card,
body.vertical-barbershop .owner-panel,
body.vertical-barbershop .invoice-panel,
body.vertical-barbershop .company-show-v2 > section,
body.vertical-barbershop .calendar-focus-shell,
body.vertical-barbershop .support-admin-card,
body.vertical-barbershop .settings-panel {
    background: linear-gradient(180deg, #1e1e1e, #171717) !important;
    border-color: rgba(200, 169, 107, .28) !important;
    color: #f5f5f5 !important;
}

body.vertical-barbershop .topbar h1,
body.vertical-barbershop .metric-card strong,
body.vertical-barbershop .metric-card span,
body.vertical-barbershop h1,
body.vertical-barbershop h2,
body.vertical-barbershop h3 {
    color: #f5f5f5 !important;
}

body.vertical-barbershop .main p,
body.vertical-barbershop .main small,
body.vertical-barbershop .metric-card small,
body.vertical-barbershop .eyebrow {
    color: #d1d5db !important;
}

body.vertical-barbershop input,
body.vertical-barbershop select,
body.vertical-barbershop textarea {
    background: #111111 !important;
    border-color: rgba(200, 169, 107, .32) !important;
    color: #f5f5f5 !important;
}

body.vertical-hair_salon .sidebar {
    background: linear-gradient(180deg, #2a2a2a, #1f1a17) !important;
}

body.vertical-hair_salon .main {
    background:
        radial-gradient(circle at 0% 0%, rgba(216, 195, 165, .34), transparent 32rem),
        #faf8f5 !important;
}

body.vertical-physiotherapy .sidebar {
    background: linear-gradient(180deg, #172033, #0f1b2e) !important;
}

body.vertical-aesthetic_clinic .main {
    background:
        radial-gradient(circle at 98% 0%, rgba(220, 235, 255, .72), transparent 34rem),
        #fcfcfc !important;
}

body.vertical-aesthetic_clinic .topbar,
body.vertical-aesthetic_clinic .metric-card,
body.vertical-aesthetic_clinic .panel,
body.vertical-aesthetic_clinic .card {
    backdrop-filter: blur(18px) saturate(1.08);
}

/* Landing vertical demo: the commercial page changes sector before registration. */
.commercial-landing {
    --landing-accent: #d6b98c;
    --landing-soft: #eadbc8;
    --landing-dark: #222222;
    --landing-surface: #ffffff;
    --landing-text: #222222;
    --landing-muted: #6b625a;
    background:
        radial-gradient(circle at 0% 12%, color-mix(in srgb, var(--landing-soft) 58%, transparent), transparent 34rem),
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--landing-accent) 14%, transparent), transparent 28rem),
        #f8fafc !important;
    color: var(--landing-text) !important;
    transition: background 260ms ease, color 260ms ease;
}

.landing-nav,
.landing-section,
.landing-access-card,
.landing-plan-card {
    border-color: color-mix(in srgb, var(--landing-accent) 24%, #dbe7ef) !important;
}

.landing-button.primary,
.landing-billing-toggle button.is-active,
.landing-tabs button.is-active {
    background: var(--landing-accent) !important;
    border-color: color-mix(in srgb, var(--landing-accent) 78%, #ffffff) !important;
    color: var(--landing-button-text, #ffffff) !important;
}

.landing-vertical-barbershop {
    --landing-button-text: #111111;
}

.landing-vertical-beauty_center,
.landing-vertical-aesthetic_clinic {
    --landing-button-text: #161616;
}

.landing-vertical-selector {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    max-width: 840px;
    margin-top: 1.25rem;
}

.landing-vertical-selector button {
    min-height: 42px;
    border: 1px solid color-mix(in srgb, var(--vertical-accent) 36%, #dbe7ef);
    border-radius: 999px;
    background: color-mix(in srgb, var(--vertical-soft) 46%, #ffffff);
    color: #0f172a;
    padding: 0 .9rem;
    font-weight: 900;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.landing-vertical-selector button:hover,
.landing-vertical-selector button.is-active {
    transform: translateY(-1px);
    background: var(--vertical-accent);
    color: var(--landing-button-text, #ffffff);
    box-shadow: 0 16px 36px color-mix(in srgb, var(--vertical-accent) 22%, transparent);
}

.landing-sector-choice {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: fit-content;
    margin: 0 0 1rem;
    border: 1px solid color-mix(in srgb, var(--landing-accent) 24%, #dbe7ef);
    border-radius: 999px;
    background: color-mix(in srgb, var(--landing-soft) 32%, #ffffff);
    padding: .6rem .9rem;
}

.landing-sector-choice span,
.landing-sector-choice small {
    color: #64748b;
    font-size: .78rem;
    font-weight: 850;
}

.landing-sector-choice strong {
    color: #0f172a;
    font-size: .92rem;
}

.landing-product-peek,
.landing-demo-card {
    background:
        linear-gradient(160deg, color-mix(in srgb, var(--landing-dark) 92%, var(--landing-accent)), color-mix(in srgb, var(--landing-dark) 82%, #0f172a)) !important;
    border-color: color-mix(in srgb, var(--landing-accent) 36%, transparent) !important;
}

.peek-appointment.is-one {
    border-left-color: var(--landing-accent) !important;
}

.peek-appointment.is-two {
    border-left-color: color-mix(in srgb, var(--landing-accent) 70%, #8b5cf6) !important;
}

.peek-people span::before,
.peek-bars span {
    background: linear-gradient(180deg, color-mix(in srgb, var(--landing-accent) 84%, #ffffff), var(--landing-accent)) !important;
}

.service-tour-steps button.is-active,
.service-tour-steps button:hover {
    border-color: color-mix(in srgb, var(--landing-accent) 48%, #dbe7ef) !important;
    background: color-mix(in srgb, var(--landing-soft) 42%, #ffffff) !important;
}

/* Guided tour fix: no blurred full-screen veil; the assistant must stay above the page. */
.landing-tour {
    z-index: 2147483000 !important;
    pointer-events: none !important;
}

.landing-tour-backdrop {
    display: none !important;
}

.landing-tour-panel {
    z-index: 2147483001 !important;
    pointer-events: auto !important;
    border-color: color-mix(in srgb, var(--landing-accent) 26%, #dbe7ef) !important;
    box-shadow: 0 26px 80px rgba(15, 23, 42, .22) !important;
}

.landing-tour-progress button.is-active,
.landing-tour-progress button:hover {
    background: color-mix(in srgb, var(--landing-soft) 60%, #ffffff) !important;
    border-color: color-mix(in srgb, var(--landing-accent) 48%, #dbe7ef) !important;
    color: color-mix(in srgb, var(--landing-dark) 82%, var(--landing-accent)) !important;
}

/* Legal modal in onboarding: shorter checkout, full terms on demand. */
.legal-consent-compact .legal-consent-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.legal-consent-compact .legal-consent-card,
.legal-consent-compact .legal-consent-card:first-child,
.legal-consent-compact .support-terms-card {
    grid-column: auto;
    min-height: 210px;
}

.legal-consent-compact .legal-consent-card {
    align-content: start;
}

.legal-consent-compact .button.ghost {
    width: fit-content;
    min-height: 40px;
}

.legal-modal[hidden] {
    display: none !important;
}

.legal-modal {
    position: fixed;
    inset: 0;
    z-index: 2147482000;
    display: grid;
    place-items: center;
    padding: clamp(1rem, 3vw, 2rem);
}

.legal-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .42);
    backdrop-filter: blur(10px);
}

.legal-modal-panel {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1rem;
    width: min(860px, 100%);
    max-height: min(760px, calc(100dvh - 40px));
    border: 1px solid #dbe7ef;
    border-radius: 28px;
    background: #ffffff;
    padding: 1.1rem;
    box-shadow: 0 32px 92px rgba(15, 23, 42, .28);
}

.legal-modal-panel header,
.legal-modal-panel footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.legal-modal-panel h2 {
    margin: .1rem 0 0;
    color: #0f172a;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    line-height: 1.05;
}

.legal-modal-panel .legal-scroll-box {
    max-height: min(48dvh, 420px);
}

.legal-modal-panel footer small {
    color: #64748b;
    font-weight: 800;
}

.legal-modal-panel footer small.is-ready {
    color: #0f766e;
}

body.legal-modal-open {
    overflow: hidden;
}

@media (max-width: 980px) {
    .legal-consent-compact .legal-consent-grid {
        grid-template-columns: 1fr;
    }
}

/* Fase 42 - ajuste final de producto general, landing guiada, alta por pasos y calendario legible por sector. */
.commercial-landing {
    overflow-x: hidden !important;
}

.landing-nav {
    top: 14px !important;
    width: min(1500px, calc(100% - 40px)) !important;
    min-height: 74px !important;
    padding: .7rem .85rem !important;
}

.landing-brand span {
    width: 138px !important;
    height: 48px !important;
}

.landing-brand img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-nav-links {
    gap: clamp(1rem, 3vw, 3.2rem) !important;
}

.landing-nav-actions {
    margin-left: auto !important;
}

.landing-commercial-hero {
    width: min(1500px, calc(100% - 40px)) !important;
    min-height: auto !important;
    margin: clamp(1rem, 2vw, 1.8rem) auto 1.15rem !important;
    padding: clamp(1.35rem, 3vw, 3rem) !important;
    grid-template-columns: minmax(0, .95fr) minmax(360px, .68fr) !important;
    border-radius: 36px !important;
}

.landing-commercial-hero h1 {
    font-size: clamp(3.4rem, 6.6vw, 7.2rem) !important;
    line-height: .91 !important;
    max-width: 790px !important;
}

.landing-lead {
    max-width: 780px !important;
}

.landing-vertical-selector {
    max-width: 860px !important;
}

.landing-vertical-selector button {
    min-height: 38px !important;
    padding: 0 .82rem !important;
    font-size: .82rem !important;
}

.landing-product-peek {
    min-height: 620px !important;
    max-height: 720px !important;
    padding: clamp(1.25rem, 2.5vw, 2.4rem) !important;
    border-radius: 34px !important;
    overflow: hidden !important;
}

.landing-product-peek > strong {
    font-size: clamp(2rem, 3.8vw, 3.65rem) !important;
    line-height: .98 !important;
    max-width: 680px !important;
}

.peek-window {
    margin-top: 1.25rem !important;
    max-height: 420px !important;
    overflow: hidden !important;
}

.peek-grid {
    transform-origin: top center !important;
}

.landing-product-peek > small {
    display: block !important;
    margin-top: 1rem !important;
    color: rgba(255, 255, 255, .78) !important;
    font-size: .94rem !important;
    line-height: 1.45 !important;
}

.peek-micro-tabs {
    position: absolute !important;
    left: clamp(1.1rem, 2.4vw, 2.2rem) !important;
    right: clamp(1.1rem, 2.4vw, 2.2rem) !important;
    bottom: clamp(1rem, 2vw, 1.8rem) !important;
}

.landing-section {
    width: min(1500px, calc(100% - 40px)) !important;
    margin-inline: auto !important;
}

.landing-section-heading h2 {
    font-size: clamp(2.1rem, 3.7vw, 4.8rem) !important;
    max-width: 920px !important;
}

.landing-sector-cards article {
    cursor: pointer;
}

.landing-sector-cards article.is-featured {
    border-color: color-mix(in srgb, var(--vertical-accent) 70%, #dbe7ef) !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--vertical-soft) 44%, #ffffff), #ffffff) !important;
    box-shadow: 0 22px 46px color-mix(in srgb, var(--vertical-accent) 14%, transparent) !important;
}

.landing-guide-drawer[hidden] {
    display: none !important;
}

.landing-guide-drawer {
    position: fixed;
    z-index: 80;
    right: 24px;
    bottom: 24px;
    display: grid;
    gap: .82rem;
    width: min(430px, calc(100vw - 32px));
    border: 1px solid color-mix(in srgb, var(--landing-accent) 34%, #dbe7ef);
    border-radius: 28px;
    background: rgba(255, 255, 255, .96);
    color: #0f172a;
    padding: 1rem;
    box-shadow: 0 24px 74px rgba(15, 23, 42, .22);
    backdrop-filter: blur(18px) saturate(1.08);
}

.landing-guide-close {
    justify-self: end;
    min-height: 34px;
    border: 1px solid #dbe7ef;
    border-radius: 14px;
    background: #fff;
    color: #0f172a;
    padding: 0 .8rem;
    font-weight: 850;
    cursor: pointer;
}

.landing-guide-progress {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .45rem;
}

.landing-guide-progress button {
    min-height: 34px;
    border: 1px solid #dbe7ef;
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    font-weight: 900;
    cursor: pointer;
}

.landing-guide-progress button.is-active {
    border-color: color-mix(in srgb, var(--landing-accent) 56%, #dbe7ef);
    background: color-mix(in srgb, var(--landing-soft) 58%, #ffffff);
    color: color-mix(in srgb, var(--landing-dark) 78%, var(--landing-accent));
}

.landing-guide-drawer h2 {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.05;
}

.landing-guide-drawer p:not(.landing-eyebrow) {
    margin: 0;
    color: #475569;
    line-height: 1.45;
}

.landing-guide-drawer ul {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.landing-guide-drawer li {
    border: 1px solid color-mix(in srgb, var(--landing-accent) 24%, #dbe7ef);
    border-radius: 16px;
    background: color-mix(in srgb, var(--landing-soft) 36%, #ffffff);
    padding: .62rem .75rem;
    color: #334155;
    font-weight: 850;
}

.landing-guide-actions {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: .6rem;
}

.register-builder {
    max-width: 1240px !important;
    align-items: start !important;
}

.register-builder-copy {
    position: sticky !important;
    top: 1rem !important;
    min-height: 520px !important;
}

.register-builder-form.is-wizard {
    gap: 1rem !important;
}

.register-wizard-progress {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: .5rem;
    border: 1px solid #dbe7ef;
    border-radius: 24px;
    background: #f8fafc;
    padding: .55rem;
}

.register-wizard-progress button {
    min-height: 44px;
    border: 1px solid transparent;
    border-radius: 16px;
    background: transparent;
    color: #64748b;
    font-weight: 900;
    cursor: pointer;
}

.register-wizard-progress button.is-active {
    border-color: rgba(20, 184, 166, .42);
    background: #ecfdf5;
    color: #0f766e;
}

.register-builder-form.is-wizard .register-section {
    display: none !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    display: grid !important;
    animation: registerStepIn 220ms ease both;
}

.register-wizard-actions {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
}

.register-builder-form.is-wizard .register-submit-row {
    display: none !important;
}

.register-builder-form.is-wizard.is-final-step .register-submit-row {
    display: flex !important;
}

@keyframes registerStepIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.auth-premium {
    min-height: calc(100dvh - 120px) !important;
    grid-template-columns: minmax(320px, .8fr) minmax(360px, .62fr) !important;
    align-items: center !important;
    gap: clamp(1rem, 3vw, 2rem) !important;
    padding-block: clamp(1rem, 3vw, 2rem) !important;
}

.auth-premium-copy,
.auth-premium-card {
    min-height: 0 !important;
    border-radius: 32px !important;
}

.auth-premium-copy {
    padding: clamp(1.35rem, 3vw, 2.4rem) !important;
}

.auth-premium-copy img {
    width: 150px !important;
    height: 56px !important;
    object-fit: contain !important;
    object-position: left center !important;
    margin-bottom: clamp(1.3rem, 4vw, 3rem) !important;
}

.auth-premium-copy h2 {
    font-size: clamp(2.4rem, 5.4vw, 5.8rem) !important;
    line-height: .95 !important;
}

.auth-premium-card {
    padding: clamp(1.25rem, 3vw, 2.2rem) !important;
    gap: .9rem !important;
}

.auth-premium-card input {
    min-height: 54px !important;
}

body[class*="vertical-"] {
    --calendar-bg: #ffffff;
    --calendar-surface: #ffffff;
    --calendar-muted-bg: #f8fafc;
    --calendar-line: #dbe7ef;
    --calendar-text: #0f172a;
    --calendar-muted: #64748b;
    --calendar-closed-bg: repeating-linear-gradient(135deg, #f1f5f9 0 12px, #eaf0f6 12px 24px);
}

body.vertical-barbershop {
    --calendar-bg: #151515;
    --calendar-surface: #202020;
    --calendar-muted-bg: #262626;
    --calendar-line: rgba(200, 169, 107, .24);
    --calendar-text: #f8fafc;
    --calendar-muted: #d1d5db;
    --calendar-closed-bg: repeating-linear-gradient(135deg, rgba(200, 169, 107, .11) 0 12px, rgba(255, 255, 255, .05) 12px 24px);
}

body.vertical-barbershop .metric-card,
body.vertical-barbershop .dashboard-card {
    background: linear-gradient(180deg, #242424, #1b1b1b) !important;
    border-color: rgba(200, 169, 107, .28) !important;
    color: #f8fafc !important;
}

body.vertical-barbershop .metric-card strong,
body.vertical-barbershop .metric-card span,
body.vertical-barbershop .dashboard-card strong {
    color: #ffffff !important;
}

body.vertical-barbershop .metric-card small,
body.vertical-barbershop .dashboard-card small,
body.vertical-barbershop .dashboard-card p {
    color: #d1d5db !important;
}

.main:has(.calendar-focus-shell) {
    background: var(--calendar-bg) !important;
}

.calendar-focus-shell {
    background: var(--calendar-bg) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.calendar-focus-toolbar {
    min-height: 76px !important;
    background: var(--calendar-surface) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.calendar-focus-toolbar h2,
.calendar-focus-title,
.calendar-hero-title {
    color: var(--calendar-text) !important;
}

.calendar-filter-drawer {
    background: var(--calendar-surface) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.calendar-filter-drawer summary strong {
    background: color-mix(in srgb, var(--vertical-accent) 20%, var(--calendar-muted-bg)) !important;
    color: var(--calendar-text) !important;
}

.pro-calendar {
    --minute-height: 1.42px;
    background: var(--calendar-bg) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
    box-shadow: none !important;
}

.pro-calendar-axis,
.pro-calendar-column,
.pro-calendar-corner,
.pro-calendar-column-head {
    background: var(--calendar-surface) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.pro-calendar-corner,
.pro-calendar-column-head {
    min-height: 58px !important;
}

.pro-calendar-column-head strong {
    color: var(--calendar-text) !important;
    font-size: .95rem !important;
}

.pro-calendar-column-head span,
.pro-calendar-axis-body span {
    color: var(--calendar-muted) !important;
}

.pro-calendar-lane {
    background:
        linear-gradient(to bottom, var(--calendar-line) 1px, transparent 1px) 0 0 / 100% calc(var(--minute-height) * 60),
        linear-gradient(to bottom, color-mix(in srgb, var(--calendar-line) 55%, transparent) 1px, transparent 1px) 0 0 / 100% calc(var(--minute-height) * 15),
        var(--calendar-bg) !important;
    border-color: var(--calendar-line) !important;
}

.calendar-closed-block {
    background: var(--calendar-closed-bg) !important;
    border-color: color-mix(in srgb, var(--calendar-line) 70%, transparent) !important;
    color: var(--calendar-muted) !important;
}

.calendar-closed-block span {
    color: var(--calendar-muted) !important;
}

.pro-calendar .calendar-event {
    background: linear-gradient(180deg, color-mix(in srgb, var(--event-color) 9%, #ffffff), #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--event-color) 48%, #dbe7ef) !important;
    border-left: 5px solid var(--event-color) !important;
    color: #0f172a !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .10) !important;
}

body.vertical-barbershop .pro-calendar .calendar-event {
    background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .96)) !important;
    color: #111111 !important;
}

.pro-calendar .calendar-event strong,
.pro-calendar .calendar-event small {
    color: inherit !important;
}

.pro-calendar .calendar-event .event-time {
    color: #0f172a !important;
    background: #eef2f7 !important;
}

.event-payment.is-paid {
    background: #dcfce7 !important;
    color: #166534 !important;
}

.event-payment.is-pending {
    background: #fef3c7 !important;
    color: #92400e !important;
}

@media (max-width: 1100px) {
    .landing-commercial-hero,
    .auth-premium,
    .register-builder {
        grid-template-columns: 1fr !important;
    }

    .landing-product-peek {
        min-height: 560px !important;
    }

    .register-builder-copy {
        position: static !important;
        min-height: 0 !important;
    }
}

@media (max-width: 760px) {
    .landing-nav {
        width: calc(100% - 20px) !important;
    }

    .landing-nav-links {
        display: none !important;
    }

    .landing-commercial-hero,
    .landing-section {
        width: calc(100% - 20px) !important;
    }

    .landing-commercial-hero h1 {
        font-size: clamp(2.7rem, 14vw, 4rem) !important;
    }

    .register-wizard-progress {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* Fase 42 - estabilizacion comercial y visual por sector. No tocar sidebar/logo/collapse. */
.commercial-landing {
    overflow-x: hidden !important;
    background:
        radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--landing-soft) 54%, transparent), transparent 34rem),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 44%, #f8fafc 100%) !important;
}

.landing-tour,
.landing-tour-backdrop {
    display: none !important;
}

body.tour-open,
.commercial-landing.tour-open {
    overflow: auto !important;
}

.landing-nav {
    top: 14px !important;
    z-index: 120 !important;
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: 72px !important;
    padding: .72rem .9rem !important;
    border-radius: 26px !important;
    background: rgba(255, 255, 255, .88) !important;
    backdrop-filter: blur(18px) saturate(1.08) !important;
}

.landing-brand span {
    width: 156px !important;
    height: 42px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.landing-brand img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.landing-nav-links {
    margin-inline: auto !important;
    gap: clamp(1.35rem, 3vw, 4rem) !important;
}

.landing-nav-links a,
.landing-link-button {
    color: #475569 !important;
    font-size: .98rem !important;
    font-weight: 800 !important;
}

.landing-nav-actions {
    margin-left: 0 !important;
    justify-content: flex-end !important;
    gap: .62rem !important;
}

.landing-button,
.landing-link-button {
    border-radius: 18px !important;
    min-height: 48px !important;
    padding: 0 1.1rem !important;
}

.landing-commercial-hero {
    width: min(1500px, calc(100% - 48px)) !important;
    min-height: calc(100dvh - 122px) !important;
    margin: 22px auto 1.2rem !important;
    padding: clamp(1.4rem, 3vw, 3rem) !important;
    grid-template-columns: minmax(0, .92fr) minmax(380px, .68fr) !important;
    align-items: stretch !important;
    border-radius: 34px !important;
}

.landing-commercial-hero h1 {
    font-size: clamp(3.6rem, 6.2vw, 7.1rem) !important;
    line-height: .91 !important;
    max-width: 850px !important;
    letter-spacing: -.055em !important;
}

.landing-lead {
    max-width: 800px !important;
    color: #475569 !important;
    font-size: clamp(1.05rem, 1.55vw, 1.45rem) !important;
}

.landing-vertical-selector {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .55rem !important;
    max-width: 930px !important;
}

.landing-vertical-selector button {
    min-height: 40px !important;
    padding: 0 .95rem !important;
    border-radius: 999px !important;
    border-color: color-mix(in srgb, var(--vertical-accent) 42%, #dbe7ef) !important;
    background: rgba(255, 255, 255, .72) !important;
    color: #334155 !important;
    transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease !important;
}

.landing-vertical-selector button:hover,
.landing-vertical-selector button.is-active {
    transform: translateY(-1px) !important;
    background: color-mix(in srgb, var(--vertical-soft) 52%, #ffffff) !important;
    border-color: var(--vertical-accent) !important;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--vertical-accent) 16%, transparent) !important;
}

.landing-product-peek {
    min-height: 0 !important;
    height: min(680px, calc(100dvh - 156px)) !important;
    padding: clamp(1.2rem, 2.2vw, 2.2rem) !important;
    border-radius: 34px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 82% 10%, color-mix(in srgb, var(--landing-accent) 28%, transparent), transparent 18rem),
        linear-gradient(145deg, color-mix(in srgb, var(--landing-dark) 88%, #092f2b), color-mix(in srgb, var(--landing-dark) 74%, #0f766e)) !important;
}

.landing-product-peek > strong {
    display: block !important;
    max-width: 680px !important;
    font-size: clamp(2rem, 3.35vw, 3.35rem) !important;
    line-height: .98 !important;
}

.peek-window {
    margin-top: 1.05rem !important;
    max-height: min(410px, calc(100% - 210px)) !important;
    overflow: hidden !important;
}

.peek-micro-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: .6rem !important;
    bottom: 1rem !important;
}

.peek-micro-tabs button {
    min-height: 56px !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .08) !important;
    color: rgba(255, 255, 255, .88) !important;
}

.peek-micro-tabs button.is-active {
    background: color-mix(in srgb, var(--landing-accent) 32%, rgba(255, 255, 255, .12)) !important;
    border-color: color-mix(in srgb, var(--landing-accent) 70%, rgba(255, 255, 255, .24)) !important;
}

.landing-section {
    width: min(1500px, calc(100% - 48px)) !important;
    padding: clamp(1.55rem, 3vw, 2.7rem) !important;
    border-radius: 32px !important;
}

.landing-service-tour {
    display: grid !important;
    gap: 1.1rem !important;
}

.landing-section-heading h2 {
    font-size: clamp(2.4rem, 4.2vw, 5.1rem) !important;
    letter-spacing: -.045em !important;
    max-width: 990px !important;
}

.service-tour-shell {
    display: grid !important;
    grid-template-columns: minmax(260px, .52fr) minmax(0, 1fr) !important;
    gap: 1rem !important;
}

.service-tour-steps {
    display: grid !important;
    gap: .72rem !important;
}

.service-tour-steps button,
.service-tour-stage article {
    border-radius: 24px !important;
    transition: transform 220ms ease, opacity 220ms ease, border-color 220ms ease, background 220ms ease !important;
}

.service-tour-steps button {
    min-height: 112px !important;
    padding: 1rem !important;
    text-align: left !important;
}

.service-tour-steps button.is-active {
    background: color-mix(in srgb, var(--landing-soft) 54%, #ffffff) !important;
    border-color: color-mix(in srgb, var(--landing-accent) 72%, #dbe7ef) !important;
}

.service-tour-stage article {
    display: none !important;
    min-height: 450px !important;
    grid-template-columns: minmax(0, .8fr) minmax(320px, .7fr) !important;
    align-items: center !important;
    gap: 1.1rem !important;
    padding: clamp(1.25rem, 3vw, 2.1rem) !important;
}

.service-tour-stage article.is-active {
    display: grid !important;
}

.service-tour-stage h3 {
    max-width: 680px !important;
    font-size: clamp(2.4rem, 4.3vw, 5rem) !important;
    line-height: .94 !important;
}

.service-tour-stage p:not(.landing-eyebrow) {
    color: #475569 !important;
    font-size: clamp(1rem, 1.3vw, 1.28rem) !important;
}

.landing-guide-drawer {
    z-index: 2147483001 !important;
    right: 22px !important;
    bottom: 22px !important;
    width: min(440px, calc(100vw - 32px)) !important;
    border-radius: 26px !important;
    transform-origin: bottom right !important;
    animation: guideDrawerIn 240ms cubic-bezier(.2,.8,.2,1) both !important;
}

@keyframes guideDrawerIn {
    from { opacity: 0; transform: translateY(14px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.landing-guide-progress {
    grid-template-columns: repeat(3, 1fr) !important;
}

.register-builder {
    width: min(1380px, calc(100% - 32px)) !important;
    grid-template-columns: minmax(300px, .44fr) minmax(0, 1fr) !important;
    gap: 1rem !important;
}

.register-builder-copy {
    min-height: auto !important;
    padding: clamp(1rem, 2vw, 1.8rem) !important;
}

.register-builder-copy img {
    width: 162px !important;
    height: 46px !important;
    object-fit: contain !important;
    object-position: left center !important;
}

.register-builder-copy h2 {
    font-size: clamp(2rem, 3vw, 3.3rem) !important;
    line-height: 1 !important;
}

.register-builder-form.is-wizard {
    min-height: min(760px, calc(100dvh - 170px)) !important;
}

.register-wizard-progress {
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important;
    position: sticky !important;
    top: .65rem !important;
    z-index: 8 !important;
}

.register-wizard-progress button {
    display: grid !important;
    place-items: center !important;
    gap: .1rem !important;
}

.register-wizard-progress button span {
    font-size: .75rem !important;
    letter-spacing: .08em !important;
}

.register-wizard-progress button strong {
    font-size: .78rem !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    min-height: 360px !important;
}

.register-wizard-actions {
    position: sticky !important;
    bottom: .75rem !important;
    z-index: 8 !important;
    padding: .65rem !important;
    border: 1px solid #dbe7ef !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .9) !important;
    backdrop-filter: blur(14px) !important;
}

.auth-premium {
    min-height: calc(100dvh - 36px) !important;
    width: min(1420px, calc(100% - 34px)) !important;
    margin: 18px auto !important;
    grid-template-columns: minmax(340px, .82fr) minmax(360px, .62fr) !important;
}

.auth-premium-copy {
    max-height: calc(100dvh - 72px) !important;
    overflow: hidden !important;
}

.auth-premium-copy img {
    width: 176px !important;
    height: 54px !important;
}

.auth-premium-copy h2 {
    font-size: clamp(2.45rem, 4.8vw, 5.35rem) !important;
}

.auth-premium-copy p {
    max-width: 680px !important;
}

body[class*="vertical-"] {
    --calendar-bg: #f8fafc;
    --calendar-surface: #ffffff;
    --calendar-muted-bg: #f1f5f9;
    --calendar-line: #d7e3ee;
    --calendar-text: #0f172a;
    --calendar-muted: #64748b;
    --calendar-closed-bg: repeating-linear-gradient(135deg, #f3f6f9 0 12px, #e9eff5 12px 24px);
}

body.vertical-barbershop {
    --calendar-bg: #111111;
    --calendar-surface: #1e1e1e;
    --calendar-muted-bg: #171717;
    --calendar-line: rgba(200, 169, 107, .32);
    --calendar-text: #f5f5f5;
    --calendar-muted: #d6d3d1;
    --calendar-closed-bg: repeating-linear-gradient(135deg, rgba(200, 169, 107, .10) 0 12px, rgba(255, 255, 255, .045) 12px 24px);
}

.main:has(.calendar-focus-shell) {
    background: var(--calendar-bg) !important;
    color: var(--calendar-text) !important;
}

.calendar-focus-shell,
.calendar-focus-toolbar,
.calendar-filter-drawer,
.pro-calendar {
    background: var(--calendar-surface) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.calendar-focus-shell {
    padding: 1rem !important;
    border-radius: 24px !important;
}

.calendar-focus-toolbar {
    min-height: 72px !important;
    align-items: center !important;
    gap: .85rem !important;
}

.calendar-focus-toolbar .eyebrow,
.calendar-focus-toolbar h2:not(.calendar-hero-title):not(.calendar-focus-title) {
    display: none !important;
}

.calendar-hero-title {
    display: block !important;
    margin: 0 !important;
    color: var(--calendar-text) !important;
    font-size: clamp(1.65rem, 2.2vw, 2.55rem) !important;
    line-height: 1 !important;
}

.calendar-focus-toolbar .button,
.calendar-focus-toolbar .icon-button,
.calendar-focus-toolbar .segmented-control a {
    min-height: 48px !important;
    border-radius: 16px !important;
    color: var(--calendar-text) !important;
}

.calendar-focus-toolbar .button.primary {
    background: var(--vertical-accent, #0f766e) !important;
    color: var(--vertical-button-text, #ffffff) !important;
}

.calendar-filter-drawer {
    border-radius: 18px !important;
    margin-block: .8rem !important;
}

.calendar-filter-drawer:not([open]) {
    max-width: 150px !important;
}

.pro-calendar {
    --minute-height: 1.16px !important;
    height: min(70dvh, 800px) !important;
    min-height: 520px !important;
    overflow: auto !important;
    border-radius: 22px !important;
}

.pro-calendar-axis,
.pro-calendar-column,
.pro-calendar-corner,
.pro-calendar-column-head {
    background: var(--calendar-surface) !important;
    border-color: var(--calendar-line) !important;
    color: var(--calendar-text) !important;
}

.pro-calendar-corner,
.pro-calendar-column-head {
    min-height: 54px !important;
}

.pro-calendar-axis-body {
    background: var(--calendar-muted-bg) !important;
}

.pro-calendar-axis-body span {
    color: var(--calendar-muted) !important;
}

.pro-calendar-lane {
    background:
        linear-gradient(to bottom, var(--calendar-line) 1px, transparent 1px) 0 0 / 100% calc(var(--minute-height) * 60),
        linear-gradient(to bottom, color-mix(in srgb, var(--calendar-line) 58%, transparent) 1px, transparent 1px) 0 0 / 100% calc(var(--minute-height) * 15),
        var(--calendar-bg) !important;
}

.calendar-closed-block {
    background: var(--calendar-closed-bg) !important;
    color: var(--calendar-muted) !important;
}

.pro-calendar .calendar-event {
    min-height: 44px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--event-color) 8%, #ffffff), #ffffff) !important;
    color: #0f172a !important;
    border: 1px solid color-mix(in srgb, var(--event-color) 52%, #dbe7ef) !important;
    border-left: 5px solid var(--event-color) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .12) !important;
}

.pro-calendar .calendar-event strong,
.pro-calendar .calendar-event small,
.pro-calendar .calendar-event .event-meta {
    color: #0f172a !important;
}

.pro-calendar .calendar-event .event-time {
    background: #eef2f7 !important;
    color: #0f172a !important;
}

body.vertical-barbershop .dashboard-card,
body.vertical-barbershop .metric-card,
body.vertical-barbershop .panel-card,
body.vertical-barbershop .billing-summary-strip {
    background: linear-gradient(180deg, #242424, #1a1a1a) !important;
    border-color: rgba(200, 169, 107, .30) !important;
    color: #f5f5f5 !important;
}

body.vertical-barbershop .dashboard-card *,
body.vertical-barbershop .metric-card *,
body.vertical-barbershop .panel-card *,
body.vertical-barbershop .billing-summary-strip * {
    color: inherit !important;
}

body.vertical-barbershop .dashboard-card p,
body.vertical-barbershop .metric-card small,
body.vertical-barbershop .panel-card p {
    color: #d6d3d1 !important;
}

@media (max-width: 1180px) {
    .landing-commercial-hero,
    .service-tour-shell,
    .service-tour-stage article,
    .register-builder,
    .auth-premium {
        grid-template-columns: 1fr !important;
    }

    .landing-product-peek {
        height: auto !important;
        min-height: 620px !important;
    }
}

@media (max-width: 780px) {
    .landing-nav {
        width: calc(100% - 20px) !important;
        min-height: 64px !important;
    }

    .landing-nav-links {
        display: none !important;
    }

    .landing-nav-actions .landing-link-button {
        display: none !important;
    }

    .landing-commercial-hero,
    .landing-section {
        width: calc(100% - 20px) !important;
    }

    .landing-commercial-hero h1 {
        font-size: clamp(2.8rem, 14vw, 4.45rem) !important;
    }

    .register-wizard-progress {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .calendar-focus-toolbar {
        grid-template-columns: 1fr !important;
    }
}

/* Landing/register polish pass: landing sells the service generally; theme choice lives in the signup flow. */
.landing-commercial-hero {
    min-height: auto !important;
    padding: clamp(1.15rem, 2.1vw, 2.15rem) !important;
    grid-template-columns: minmax(0, .88fr) minmax(360px, .62fr) !important;
    align-items: center !important;
    overflow: visible !important;
    gap: clamp(1.25rem, 2.4vw, 2.6rem) !important;
}

.landing-commercial-hero h1 {
    font-size: clamp(3rem, 4.65vw, 5.65rem) !important;
    max-width: 820px !important;
    line-height: .94 !important;
    letter-spacing: -.045em !important;
}

.landing-sector-proof {
    display: none !important;
    flex-wrap: wrap !important;
    gap: .55rem !important;
    max-width: 940px !important;
}

.landing-sector-proof span {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid color-mix(in srgb, var(--vertical-accent) 34%, #dbe7ef) !important;
    border-radius: 999px !important;
    padding: 0 .95rem !important;
    background: color-mix(in srgb, var(--vertical-soft) 22%, #ffffff) !important;
    color: #334155 !important;
    font-weight: 750 !important;
}

.landing-theme-note {
    margin: .55rem 0 0 !important;
    max-width: 760px !important;
    color: #64748b !important;
    font-size: .98rem !important;
}

.landing-product-peek {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-self: center !important;
    padding: clamp(1rem, 1.7vw, 1.65rem) !important;
    border-radius: 30px !important;
}

.landing-product-peek > strong {
    font-size: clamp(1.65rem, 2.25vw, 2.45rem) !important;
    line-height: 1 !important;
}

.landing-product-peek > small {
    display: block !important;
    margin-top: .55rem !important;
    max-width: 560px !important;
    font-size: .9rem !important;
    color: rgba(255, 255, 255, .78) !important;
}

.peek-window {
    max-height: 300px !important;
    margin-top: .7rem !important;
    padding: .7rem !important;
}

.peek-micro-tabs {
    position: static !important;
    margin-top: .65rem !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.peek-micro-tabs button {
    min-height: 46px !important;
    border-radius: 14px !important;
    padding: .45rem .55rem !important;
    min-width: 0 !important;
    white-space: nowrap !important;
}

.peek-micro-tabs small {
    display: none !important;
}

.landing-hero-actions {
    margin-top: 1.1rem !important;
}

.landing-button.large {
    min-height: 54px !important;
    padding-inline: 1.35rem !important;
}

.peek-grid {
    gap: .65rem !important;
}

.peek-agenda {
    min-height: 158px !important;
}

.peek-clients,
.peek-chart {
    min-height: 70px !important;
}

.peek-people {
    gap: .4rem !important;
}

.peek-people span {
    min-height: 32px !important;
}

.peek-bars {
    min-height: 50px !important;
}

.landing-sector-choice {
    display: none !important;
}

.service-tour-steps button {
    color: #0f172a !important;
}

.service-tour-steps button.is-active,
.service-tour-steps button.is-active *,
.service-tour-steps button:hover,
.service-tour-steps button:hover * {
    color: #0f172a !important;
}

.service-tour-stage h3 {
    color: #0f172a !important;
}

.service-tour-stage article {
    min-height: 390px !important;
}

.landing-guide-drawer[hidden] {
    display: none !important;
}

.register-builder {
    width: min(1560px, calc(100% - 56px)) !important;
    grid-template-columns: minmax(380px, .54fr) minmax(0, 1fr) !important;
    align-items: stretch !important;
    min-height: min(690px, calc(100dvh - 36px)) !important;
    margin-block: 18px !important;
}

.register-builder-copy {
    padding: clamp(1.6rem, 2.6vw, 2.5rem) !important;
}

.register-builder-copy h2 {
    font-size: clamp(2.35rem, 3.4vw, 4.15rem) !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    min-height: min(430px, calc(100dvh - 244px)) !important;
}

.register-builder-form.is-wizard {
    min-height: min(690px, calc(100dvh - 36px)) !important;
    align-content: start !important;
}

.register-wizard-progress {
    gap: .45rem !important;
    padding: .55rem !important;
    border-radius: 24px !important;
}

.register-wizard-progress button {
    min-height: 48px !important;
    border-radius: 17px !important;
    padding: .35rem .5rem !important;
}

.register-wizard-actions {
    min-height: 54px !important;
    margin-top: .75rem !important;
    justify-content: space-between !important;
}

.register-wizard-actions .button,
.register-submit-row .button {
    min-height: 44px !important;
    border-radius: 14px !important;
}

.register-submit-row {
    padding: .75rem !important;
    border-radius: 18px !important;
}

.register-section.compact {
    padding: clamp(1rem, 1.6vw, 1.35rem) !important;
}

.register-theme-step {
    display: grid !important;
    grid-template-columns: minmax(360px, .86fr) minmax(360px, .9fr) !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

.register-theme-step .vertical-style-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.register-theme-preview {
    --theme-accent: #0f766e;
    --theme-soft: #ccfbf1;
    --theme-dark: #0f172a;
    --theme-surface: #ffffff;
    display: grid !important;
    gap: .85rem !important;
    min-height: 100% !important;
    padding: 1.15rem !important;
    border: 1px solid color-mix(in srgb, var(--theme-accent) 36%, #dbe7ef) !important;
    border-radius: 26px !important;
    background:
        radial-gradient(circle at 85% 12%, color-mix(in srgb, var(--theme-accent) 24%, transparent), transparent 11rem),
        linear-gradient(145deg, color-mix(in srgb, var(--theme-soft) 36%, #ffffff), #ffffff) !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, .08) !important;
}

.theme-preview-top {
    display: flex !important;
    justify-content: space-between !important;
    gap: .75rem !important;
}

.theme-preview-top span {
    color: color-mix(in srgb, var(--theme-accent) 82%, #0f172a) !important;
    font-size: .78rem !important;
    font-weight: 900 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

.theme-preview-top strong {
    max-width: 250px !important;
    text-align: right !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    line-height: 1.15 !important;
}

.theme-preview-board {
    display: grid !important;
    grid-template-columns: 72px 1fr !important;
    min-height: 250px !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    background: var(--theme-dark) !important;
    border: 1px solid color-mix(in srgb, var(--theme-accent) 44%, #ffffff) !important;
}

.theme-preview-sidebar {
    display: grid !important;
    align-content: start !important;
    gap: .7rem !important;
    padding: 1rem !important;
    background: color-mix(in srgb, var(--theme-dark) 84%, #000000) !important;
}

.theme-preview-sidebar span,
.theme-preview-sidebar i {
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--theme-accent) 70%, #ffffff) !important;
}

.theme-preview-sidebar i {
    opacity: .38 !important;
    background: #ffffff !important;
}

.theme-preview-content {
    display: grid !important;
    gap: .75rem !important;
    padding: 1rem !important;
    background: color-mix(in srgb, var(--theme-surface) 92%, #f8fafc) !important;
}

.theme-preview-header,
.theme-preview-metrics b,
.theme-preview-calendar {
    border: 1px solid #dbe7ef !important;
    background: #ffffff !important;
    border-radius: 16px !important;
}

.theme-preview-header {
    height: 42px !important;
}

.theme-preview-metrics {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: .5rem !important;
}

.theme-preview-metrics b {
    height: 46px !important;
}

.theme-preview-calendar {
    display: grid !important;
    grid-template-columns: 52px 1fr !important;
    gap: .45rem .6rem !important;
    padding: .75rem !important;
    align-items: center !important;
}

.theme-preview-calendar span {
    color: #64748b !important;
    font-weight: 850 !important;
}

.theme-preview-calendar em {
    min-height: 28px !important;
    padding: .35rem .7rem !important;
    border-left: 4px solid var(--theme-accent) !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--theme-accent) 12%, #ffffff) !important;
    color: #0f172a !important;
    font-style: normal !important;
    font-weight: 800 !important;
}

.register-theme-preview p {
    margin: 0 !important;
    color: #475569 !important;
    font-size: .96rem !important;
}

.legal-consent-compact .legal-consent-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .85rem !important;
}

.legal-consent-compact .legal-consent-card,
.legal-consent-compact .legal-consent-card:first-child,
.legal-consent-compact .support-terms-card {
    min-height: auto !important;
    padding: 1rem !important;
}

.legal-consent-card strong {
    font-size: 1.05rem !important;
    line-height: 1.15 !important;
}

.legal-short-copy {
    font-size: .93rem !important;
    line-height: 1.5 !important;
}

.legal-check {
    padding: .85rem !important;
    gap: .7rem !important;
}

.legal-check span {
    font-size: .82rem !important;
    line-height: 1.35 !important;
}

.legal-modal-panel {
    width: min(820px, calc(100vw - 32px)) !important;
}

@media (max-width: 1180px) {
    .register-theme-step {
        grid-template-columns: 1fr !important;
    }

    .legal-consent-compact .legal-consent-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Landing viewport lock: at 90-100% zoom the commercial hero must fit without hiding the message. */
.landing-commercial-hero {
    min-height: calc(100dvh - 116px) !important;
    max-height: calc(100dvh - 116px) !important;
    margin: 14px auto 1rem !important;
    padding: clamp(1rem, 1.45vw, 1.65rem) !important;
    grid-template-columns: minmax(0, .98fr) minmax(390px, .68fr) !important;
    gap: clamp(1.5rem, 3vw, 3.4rem) !important;
    overflow: hidden !important;
}

.landing-commercial-hero .landing-eyebrow {
    margin-bottom: .55rem !important;
    font-size: .74rem !important;
}

.landing-commercial-hero h1 {
    max-width: 760px !important;
    font-size: clamp(3.15rem, 4.35vw, 5.2rem) !important;
    line-height: .94 !important;
    letter-spacing: -.048em !important;
}

.landing-commercial-hero .landing-lead {
    max-width: 700px !important;
    margin-top: 1rem !important;
    font-size: clamp(1rem, 1.12vw, 1.25rem) !important;
    line-height: 1.42 !important;
}

.landing-theme-note {
    margin-top: .45rem !important;
    font-size: .9rem !important;
    line-height: 1.35 !important;
}

.landing-hero-actions {
    margin-top: .85rem !important;
    gap: .7rem !important;
}

.landing-button.large {
    min-height: 48px !important;
    padding-inline: 1.15rem !important;
    border-radius: 16px !important;
}

.landing-product-peek {
    max-height: 100% !important;
    overflow: hidden !important;
    padding: clamp(1rem, 1.55vw, 1.45rem) !important;
    gap: .75rem !important;
}

.landing-product-peek .peek-topline {
    margin-bottom: 0 !important;
}

.landing-product-peek > strong {
    max-width: 560px !important;
    font-size: clamp(1.55rem, 2vw, 2.25rem) !important;
    line-height: .98 !important;
}

.peek-window {
    max-height: 252px !important;
    min-height: 0 !important;
    margin-top: .4rem !important;
    padding: .62rem !important;
    border-radius: 22px !important;
}

.peek-window-bar {
    margin-bottom: .45rem !important;
}

.peek-grid {
    gap: .52rem !important;
}

.peek-grid section {
    border-radius: 16px !important;
}

.peek-agenda {
    min-height: 136px !important;
}

.peek-calendar {
    min-height: 100px !important;
}

.peek-appointment {
    min-height: 28px !important;
    padding: .35rem .65rem !important;
    font-size: .82rem !important;
}

.peek-hour {
    font-size: .78rem !important;
}

.peek-heading {
    margin-bottom: .42rem !important;
    font-size: .78rem !important;
}

.peek-clients,
.peek-chart {
    min-height: 62px !important;
    max-height: 82px !important;
    padding: .6rem !important;
}

.peek-people span {
    min-height: 28px !important;
}

.peek-people small {
    display: none !important;
}

.peek-bars {
    min-height: 38px !important;
    height: 38px !important;
}

.landing-product-peek > small {
    margin-top: .2rem !important;
    font-size: .82rem !important;
    line-height: 1.35 !important;
}

.peek-micro-tabs {
    margin-top: .45rem !important;
    gap: .45rem !important;
    overflow: visible !important;
}

.peek-micro-tabs button {
    min-height: 40px !important;
    padding: .4rem .55rem !important;
    border-radius: 13px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

@media (max-width: 1180px) {
    .landing-commercial-hero {
        max-height: none !important;
        grid-template-columns: 1fr !important;
        overflow: visible !important;
    }

    .landing-product-peek {
        max-height: none !important;
    }
}

/* Signup viewport lock: the account flow is stepped, so each step should fit like a panel. */
.register-builder {
    width: min(1500px, calc(100% - 40px)) !important;
    min-height: min(660px, calc(100dvh - 28px)) !important;
    max-height: calc(100dvh - 28px) !important;
    margin-block: 14px !important;
    grid-template-columns: minmax(330px, .45fr) minmax(0, 1fr) !important;
    overflow: hidden !important;
}

.register-builder-copy {
    padding: clamp(1.25rem, 2vw, 2rem) !important;
}

.register-builder-copy img {
    width: min(152px, 38%) !important;
    height: auto !important;
}

.register-builder-copy h2 {
    font-size: clamp(2rem, 3vw, 3.45rem) !important;
    line-height: 1.02 !important;
}

.register-builder-copy p {
    font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
    line-height: 1.45 !important;
}

.register-builder-form.is-wizard {
    min-height: 0 !important;
    max-height: calc(100dvh - 28px) !important;
    overflow: hidden !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    min-height: min(370px, calc(100dvh - 232px)) !important;
    max-height: calc(100dvh - 212px) !important;
    overflow: auto !important;
}

.register-section {
    padding: clamp(1.1rem, 1.7vw, 1.55rem) !important;
}

.register-section h2 {
    font-size: clamp(1.55rem, 2vw, 2.25rem) !important;
}

.register-form-grid {
    gap: .8rem !important;
}

.register-form-grid input,
.register-form-grid select,
.register-form-grid textarea,
.register-extra-card,
.register-plan-card,
.register-term-card {
    min-height: 48px !important;
}

.register-wizard-progress {
    min-height: 58px !important;
    padding: .45rem !important;
}

.register-wizard-progress button {
    min-height: 42px !important;
}

.register-wizard-progress button small {
    font-size: .74rem !important;
}

.register-wizard-actions {
    min-height: 48px !important;
    margin-top: .55rem !important;
}

/* Landing final art direction: one Clinc palette, compact hero, readable demo. */
.commercial-landing {
    --landing-accent: #0f766e !important;
    --landing-accent-strong: #115e59 !important;
    --landing-soft: #ccfbf1 !important;
    --landing-dark: #0f172a !important;
    --landing-text: #0f172a !important;
    --landing-muted: #475569 !important;
    background:
        radial-gradient(circle at 6% 18%, rgba(20, 184, 166, .14), transparent 24rem),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 46%, #f8fafc 100%) !important;
}

.landing-nav {
    border-color: #dbe7ef !important;
    background: rgba(255, 255, 255, .9) !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .08) !important;
}

.landing-nav-links a,
.landing-link-button {
    color: #334155 !important;
}

.landing-nav-links a:hover,
.landing-link-button:hover {
    color: #0f766e !important;
    background: #ecfdf5 !important;
}

.landing-button.primary,
.landing-button.secondary:hover,
.landing-button.primary.large {
    border-color: #0f766e !important;
    background: #0f766e !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(15, 118, 110, .16) !important;
}

.landing-button.primary:hover,
.landing-button.primary.large:hover {
    background: #115e59 !important;
    border-color: #115e59 !important;
    transform: translateY(-1px) !important;
}

.landing-button.secondary,
.landing-link-button {
    border-color: #cbd5e1 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

.landing-commercial-hero {
    width: min(1460px, calc(100% - 48px)) !important;
    min-height: calc(100dvh - 124px) !important;
    max-height: calc(100dvh - 124px) !important;
    margin-top: 12px !important;
    padding: clamp(1rem, 1.35vw, 1.5rem) !important;
    grid-template-columns: minmax(0, .92fr) minmax(420px, .62fr) !important;
    gap: clamp(1.35rem, 2.6vw, 3rem) !important;
}

.landing-commercial-hero .landing-hero-copy {
    align-self: center !important;
    max-width: 820px !important;
}

.landing-commercial-hero h1 {
    max-width: 760px !important;
    font-size: clamp(3rem, 4.1vw, 5.05rem) !important;
    line-height: .95 !important;
}

.landing-commercial-hero .landing-lead {
    max-width: 720px !important;
    font-size: clamp(1rem, 1.05vw, 1.2rem) !important;
}

.landing-theme-note {
    max-width: 680px !important;
    color: #64748b !important;
}

.landing-product-peek {
    height: min(570px, calc(100dvh - 154px)) !important;
    max-height: min(570px, calc(100dvh - 154px)) !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
    align-content: stretch !important;
    padding: clamp(1rem, 1.45vw, 1.35rem) !important;
    border: 1px solid rgba(153, 246, 228, .2) !important;
    background:
        radial-gradient(circle at 88% 8%, rgba(20, 184, 166, .24), transparent 15rem),
        linear-gradient(160deg, #0f172a 0%, #134e4a 100%) !important;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .18) !important;
}

.landing-product-peek > strong {
    max-width: 520px !important;
    font-size: clamp(1.55rem, 1.95vw, 2.15rem) !important;
    color: #ffffff !important;
}

.landing-demo-kicker {
    border-color: rgba(153, 246, 228, .42) !important;
    background: rgba(153, 246, 228, .12) !important;
    color: #99f6e4 !important;
}

.landing-product-peek .peek-topline small {
    color: rgba(255, 255, 255, .72) !important;
}

.peek-window {
    height: 100% !important;
    max-height: none !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    padding: .65rem !important;
    background: rgba(255, 255, 255, .13) !important;
    border-color: rgba(255, 255, 255, .16) !important;
}

.peek-grid {
    min-height: 0 !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr) !important;
    grid-template-rows: minmax(132px, 1fr) minmax(68px, .52fr) !important;
    gap: .55rem !important;
}

.peek-grid section {
    min-height: 0 !important;
    border-color: #dbe7ef !important;
    background: rgba(248, 250, 252, .96) !important;
}

.peek-agenda {
    grid-row: 1 / -1 !important;
}

.peek-calendar {
    min-height: 0 !important;
    height: 100% !important;
}

.peek-clients,
.peek-chart {
    min-height: 0 !important;
    max-height: none !important;
}

.peek-appointment.is-one {
    border-color: #14b8a6 !important;
    background: #ecfdf5 !important;
    color: #134e4a !important;
}

.peek-appointment.is-two {
    border-color: #0f766e !important;
    background: #f0fdfa !important;
    color: #115e59 !important;
}

.peek-heading b,
.peek-chart .peek-heading b {
    color: #0f766e !important;
}

.peek-bars span {
    background: linear-gradient(180deg, #14b8a6, #0f766e) !important;
}

.landing-product-peek > small {
    max-width: 620px !important;
    color: rgba(255, 255, 255, .8) !important;
}

.peek-micro-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .5rem !important;
    overflow: hidden !important;
}

.peek-micro-tabs button {
    min-height: 42px !important;
    border-color: rgba(255, 255, 255, .22) !important;
    background: rgba(255, 255, 255, .08) !important;
    color: rgba(255, 255, 255, .9) !important;
}

.peek-micro-tabs button:hover,
.peek-micro-tabs button.is-active {
    border-color: rgba(153, 246, 228, .62) !important;
    background: rgba(20, 184, 166, .22) !important;
    color: #ffffff !important;
}

.landing-service-tour .service-tour-steps button.is-active {
    border-color: rgba(15, 118, 110, .36) !important;
    background: #ecfdf5 !important;
    color: #0f172a !important;
}

@media (max-width: 1320px) {
    .landing-commercial-hero h1 {
        font-size: clamp(2.85rem, 5vw, 4.65rem) !important;
    }

    .landing-product-peek {
        height: min(540px, calc(100dvh - 154px)) !important;
    }
}

/* Landing finish lock: compact, single-palette commercial view at real browser zoom. */
body.commercial-landing {
    --landing-accent: #0f766e !important;
    --landing-accent-strong: #115e59 !important;
    --landing-soft: #ccfbf1 !important;
    --landing-dark: #0f172a !important;
    --landing-text: #0f172a !important;
    --landing-muted: #475569 !important;
}

body.commercial-landing .landing-button.primary,
body.commercial-landing .landing-button.primary.large,
body.commercial-landing .landing-hero-actions .landing-button.primary,
body.commercial-landing .landing-access-copy .landing-button.primary,
body.commercial-landing .landing-login-card .landing-button.primary {
    border-color: #0f766e !important;
    background: #0f766e !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(15, 118, 110, .16) !important;
}

body.commercial-landing .landing-button.primary:hover,
body.commercial-landing .landing-button.primary.large:hover,
body.commercial-landing .landing-hero-actions .landing-button.primary:hover,
body.commercial-landing .landing-access-copy .landing-button.primary:hover,
body.commercial-landing .landing-login-card .landing-button.primary:hover {
    border-color: #115e59 !important;
    background: #115e59 !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-button.secondary,
body.commercial-landing .landing-link-button {
    border-color: #cbd5e1 !important;
    background: #ffffff !important;
    color: #0f172a !important;
}

body.commercial-landing .landing-commercial-hero {
    width: min(1440px, calc(100% - 56px)) !important;
    min-height: min(590px, calc(100dvh - 132px)) !important;
    max-height: none !important;
    margin: 16px auto 1.25rem !important;
    padding: clamp(1.1rem, 1.7vw, 1.65rem) !important;
    grid-template-columns: minmax(0, .94fr) minmax(390px, .58fr) !important;
    gap: clamp(1.35rem, 2.7vw, 3rem) !important;
    align-items: center !important;
    overflow: visible !important;
}

body.commercial-landing .landing-commercial-hero h1 {
    max-width: 760px !important;
    font-size: clamp(2.95rem, 4vw, 4.9rem) !important;
    line-height: .96 !important;
}

body.commercial-landing .landing-commercial-hero .landing-lead {
    max-width: 720px !important;
    margin-top: .85rem !important;
    font-size: clamp(1rem, 1.05vw, 1.18rem) !important;
    line-height: 1.55 !important;
}

body.commercial-landing .landing-theme-note {
    margin-top: .55rem !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
}

body.commercial-landing .landing-hero-actions {
    margin-top: 1.25rem !important;
    gap: .8rem !important;
}

body.commercial-landing .landing-product-peek {
    height: clamp(455px, calc(100dvh - 172px), 515px) !important;
    min-height: 455px !important;
    max-height: 515px !important;
    padding: 1.15rem !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
    gap: .65rem !important;
    overflow: hidden !important;
    border-radius: 30px !important;
}

body.commercial-landing .landing-product-peek > strong {
    max-width: 470px !important;
    font-size: clamp(1.5rem, 1.8vw, 2rem) !important;
    line-height: 1 !important;
}

body.commercial-landing .landing-product-peek > small {
    margin: 0 !important;
    max-width: 580px !important;
    font-size: .78rem !important;
    line-height: 1.38 !important;
}

body.commercial-landing .peek-window {
    min-height: 0 !important;
    height: auto !important;
    padding: .58rem !important;
    border-radius: 24px !important;
}

body.commercial-landing .peek-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(160px, 1fr) 54px !important;
    gap: .5rem !important;
}

body.commercial-landing .peek-agenda {
    grid-row: auto !important;
    padding: .72rem !important;
}

body.commercial-landing .peek-clients {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: center !important;
    min-height: 54px !important;
    max-height: 54px !important;
    overflow: hidden !important;
    padding: .55rem .7rem !important;
}

body.commercial-landing .peek-clients .peek-client-list {
    display: none !important;
}

body.commercial-landing .peek-chart {
    display: none !important;
}

body.commercial-landing .peek-calendar {
    gap: .36rem !important;
}

body.commercial-landing .peek-row {
    grid-template-columns: 34px 1fr !important;
    gap: .55rem !important;
}

body.commercial-landing .peek-appointment {
    min-height: 34px !important;
    padding: .38rem .7rem !important;
    border-radius: 999px !important;
}

body.commercial-landing .peek-micro-tabs {
    margin-top: .05rem !important;
    gap: .45rem !important;
}

body.commercial-landing .peek-micro-tabs button {
    min-height: 38px !important;
    border-radius: 13px !important;
    color: rgba(255, 255, 255, .88) !important;
}

body.commercial-landing .peek-micro-tabs button.is-active,
body.commercial-landing .peek-micro-tabs button:hover {
    border-color: rgba(153, 246, 228, .58) !important;
    background: rgba(15, 118, 110, .86) !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-access-section {
    width: min(1440px, calc(100% - 56px)) !important;
    padding: clamp(1.3rem, 2vw, 2rem) !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, .92) !important;
}

body.commercial-landing .landing-access-section .landing-section-heading {
    max-width: 980px !important;
    margin-bottom: 1.35rem !important;
}

body.commercial-landing .landing-access-section .landing-section-heading h2 {
    max-width: 900px !important;
    font-size: clamp(2.1rem, 3.25vw, 4rem) !important;
    line-height: .98 !important;
    letter-spacing: -0.045em !important;
}

body.commercial-landing .landing-access {
    display: grid !important;
    grid-template-columns: minmax(300px, .64fr) minmax(420px, 1fr) !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

body.commercial-landing .landing-access-copy,
body.commercial-landing .landing-access-card {
    border: 1px solid #dbe7ef !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .06) !important;
}

body.commercial-landing .landing-access-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: .85rem !important;
    padding: clamp(1.2rem, 2vw, 1.65rem) !important;
}

body.commercial-landing .landing-access-copy h3 {
    margin: 0 !important;
    font-size: clamp(1.65rem, 2vw, 2.4rem) !important;
    line-height: 1 !important;
}

body.commercial-landing .landing-access-copy p {
    max-width: 520px !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
}

body.commercial-landing .landing-login-card {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .8rem !important;
    padding: clamp(1.2rem, 1.8vw, 1.6rem) !important;
}

body.commercial-landing .landing-login-card .landing-eyebrow,
body.commercial-landing .landing-login-card h3,
body.commercial-landing .landing-login-card .landing-errors,
body.commercial-landing .landing-login-card .landing-check,
body.commercial-landing .landing-login-card button {
    grid-column: 1 / -1 !important;
}

body.commercial-landing .landing-login-card h3 {
    margin: -.25rem 0 .25rem !important;
    font-size: 1.55rem !important;
}

body.commercial-landing .landing-login-card label {
    display: grid !important;
    gap: .38rem !important;
    margin: 0 !important;
    color: #475569 !important;
    font-size: .8rem !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
}

body.commercial-landing .landing-login-card input {
    min-height: 48px !important;
    border-radius: 15px !important;
}

body.commercial-landing .landing-login-card .landing-check {
    display: flex !important;
    align-items: center !important;
    gap: .55rem !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

body.commercial-landing .landing-guide-drawer {
    position: fixed !important;
    z-index: 9999 !important;
    top: 50% !important;
    right: clamp(1rem, 3vw, 4rem) !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: min(430px, calc(100vw - 32px)) !important;
    max-height: min(620px, calc(100dvh - 40px)) !important;
    overflow: auto !important;
    background: rgba(255, 255, 255, .96) !important;
    backdrop-filter: blur(18px) !important;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .26) !important;
}

body.commercial-landing.guide-open::before {
    z-index: 9998 !important;
}

@media (max-width: 1180px) {
    body.commercial-landing .landing-commercial-hero,
    body.commercial-landing .landing-access {
        grid-template-columns: 1fr !important;
        max-height: none !important;
    }

    body.commercial-landing .landing-product-peek {
        height: auto !important;
        max-height: none !important;
    }
}

/* Clinc unified jade system: one premium interface for every business vertical.
   Sector selection remains commercial/terminology, not a separate visual product. */
body[class*="vertical-"] {
    --erp-bg: #f8fafc !important;
    --erp-surface: #ffffff !important;
    --erp-surface-soft: #f1f5f9 !important;
    --erp-hover: #ecfdf5 !important;
    --erp-primary: #0f766e !important;
    --erp-primary-hover: #115e59 !important;
    --erp-primary-active: #134e4a !important;
    --erp-accent: #14b8a6 !important;
    --erp-primary-soft: #ccfbf1 !important;
    --erp-text: #0f172a !important;
    --erp-muted: #64748b !important;
    --erp-sidebar-bg: #0f172a !important;
    --vertical-accent: #0f766e !important;
    --vertical-soft: #ccfbf1 !important;
    --vertical-dark: #0f172a !important;
    --vertical-surface: #ffffff !important;
    --vertical-bg: #f8fafc !important;
    --vertical-surface-soft: #f1f5f9 !important;
    --vertical-text: #0f172a !important;
    --vertical-muted: #64748b !important;
    --vertical-sidebar: #0f172a !important;
    background:
        radial-gradient(circle at 4% 0%, rgba(20, 184, 166, .12), transparent 30rem),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 46%, #f8fafc 100%) !important;
    color: #0f172a !important;
}

body[class*="vertical-"] .main,
body.vertical-barbershop .main,
body.vertical-hair_salon .main,
body.vertical-aesthetic_clinic .main,
body.vertical-physiotherapy .main {
    background:
        radial-gradient(circle at 10% 0%, rgba(20, 184, 166, .08), transparent 28rem),
        #f8fafc !important;
    color: #0f172a !important;
}

body[class*="vertical-"] .topbar,
body[class*="vertical-"] .metric-card,
body[class*="vertical-"] .panel,
body[class*="vertical-"] .card,
body[class*="vertical-"] .dashboard-card,
body[class*="vertical-"] .owner-panel,
body[class*="vertical-"] .invoice-panel,
body[class*="vertical-"] .company-show-v2 > section,
body[class*="vertical-"] .calendar-focus-shell,
body[class*="vertical-"] .support-admin-card,
body[class*="vertical-"] .settings-panel,
body.vertical-barbershop .metric-card,
body.vertical-barbershop .panel,
body.vertical-barbershop .dashboard-card,
body.vertical-barbershop .owner-panel,
body.vertical-barbershop .invoice-panel {
    background: #ffffff !important;
    border-color: #dbe7ef !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .07) !important;
}

body[class*="vertical-"] h1,
body[class*="vertical-"] h2,
body[class*="vertical-"] h3,
body[class*="vertical-"] .topbar h1,
body[class*="vertical-"] .metric-card strong,
body[class*="vertical-"] .metric-card span,
body.vertical-barbershop h1,
body.vertical-barbershop h2,
body.vertical-barbershop h3,
body.vertical-barbershop .metric-card strong,
body.vertical-barbershop .metric-card span {
    color: #0f172a !important;
}

body[class*="vertical-"] p,
body[class*="vertical-"] small,
body[class*="vertical-"] .notes,
body[class*="vertical-"] .metric-card small,
body.vertical-barbershop p,
body.vertical-barbershop small,
body.vertical-barbershop .notes,
body.vertical-barbershop .metric-card small {
    color: #64748b !important;
}

body[class*="vertical-"] .button.primary,
body[class*="vertical-"] button[type="submit"].button,
body[class*="vertical-"] .nav a.active,
body[class*="vertical-"] .nav-locked.active {
    background: #0f766e !important;
    border-color: #0f766e !important;
    color: #ffffff !important;
}

body[class*="vertical-"] .button.primary:hover,
body[class*="vertical-"] button[type="submit"].button:hover {
    background: #115e59 !important;
    border-color: #115e59 !important;
}

body[class*="vertical-"] .nav a.active .nav-icon,
body[class*="vertical-"] .nav-locked.active .nav-icon {
    background: rgba(20, 184, 166, .22) !important;
    color: #ccfbf1 !important;
}

body[class*="vertical-"] input:focus,
body[class*="vertical-"] select:focus,
body[class*="vertical-"] textarea:focus {
    border-color: #14b8a6 !important;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, .16) !important;
}

/* Compact owner dashboard: practical first screen without forced scrolling on laptops. */
.owner-simple-dashboard {
    display: grid !important;
    gap: 1rem !important;
}

.owner-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: .9rem !important;
}

.owner-kpi-grid article {
    min-height: 106px !important;
    padding: 1rem !important;
    border-radius: 20px !important;
}

.owner-kpi-grid article strong {
    font-size: clamp(2rem, 3vw, 2.7rem) !important;
    line-height: .95 !important;
}

.owner-main-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.38fr) minmax(340px, .9fr) !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

.owner-main-grid > .panel {
    min-height: 268px !important;
    padding: 1.05rem !important;
}

.owner-main-grid .panel-heading {
    margin-bottom: .75rem !important;
}

.agenda-list-compact {
    max-height: 158px !important;
    overflow: auto !important;
}

.agenda-list-compact .empty-state {
    min-height: 126px !important;
}

.available-hours-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}

.available-hours-grid a {
    min-height: 84px !important;
    padding: .85rem !important;
    border-radius: 18px !important;
}

.owner-billing-strip {
    min-height: 96px !important;
    padding: 1rem 1.15rem !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto !important;
    gap: 1rem !important;
    align-items: center !important;
}

.owner-billing-strip .button {
    justify-self: end !important;
}

@media (max-width: 1180px) {
    .owner-kpi-grid,
    .owner-main-grid,
    .owner-billing-strip {
        grid-template-columns: 1fr 1fr !important;
    }

    .owner-billing-strip .button {
        justify-self: stretch !important;
    }
}

/* Landing cleanup: one jade direction, no clipped demo card at normal browser zoom. */
body.commercial-landing {
    --landing-accent: #0f766e !important;
    --landing-accent-strong: #115e59 !important;
    --landing-soft: #ccfbf1 !important;
    --landing-dark: #0f172a !important;
    --landing-text: #0f172a !important;
    --landing-muted: #475569 !important;
}

body.commercial-landing .landing-nav {
    min-height: 70px !important;
    padding: .55rem .85rem !important;
}

body.commercial-landing .landing-commercial-hero {
    min-height: auto !important;
    height: min(590px, calc(100dvh - 100px)) !important;
    max-height: none !important;
    width: min(1480px, calc(100% - 44px)) !important;
    margin: 12px auto 1rem !important;
    padding: clamp(1rem, 1.6vw, 1.6rem) !important;
    grid-template-columns: minmax(0, .98fr) minmax(400px, .72fr) !important;
    align-items: center !important;
    overflow: hidden !important;
}

body.commercial-landing .landing-commercial-hero h1 {
    max-width: 760px !important;
    font-size: clamp(3rem, 4.25vw, 5rem) !important;
    line-height: .95 !important;
}

body.commercial-landing .landing-commercial-hero .landing-lead {
    max-width: 760px !important;
    font-size: clamp(1rem, 1.08vw, 1.18rem) !important;
    line-height: 1.42 !important;
}

body.commercial-landing .landing-product-peek {
    width: 100% !important;
    height: min(480px, calc(100dvh - 150px)) !important;
    min-height: 420px !important;
    max-height: 480px !important;
    padding: 1rem !important;
    border-radius: 30px !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
    gap: .55rem !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 92% 4%, rgba(20, 184, 166, .28), transparent 14rem),
        linear-gradient(145deg, #0f172a, #134e4a) !important;
}

body.commercial-landing .landing-product-peek > strong {
    max-width: 590px !important;
    font-size: clamp(1.5rem, 2vw, 2.15rem) !important;
    line-height: 1 !important;
}

body.commercial-landing .landing-product-peek > small {
    margin: .2rem 0 0 !important;
    font-size: .82rem !important;
    line-height: 1.3 !important;
}

body.commercial-landing .peek-window {
    max-height: none !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
}

body.commercial-landing .peek-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(132px, 1fr) 52px !important;
}

body.commercial-landing .peek-agenda {
    min-height: 132px !important;
}

body.commercial-landing .peek-clients {
    min-height: 52px !important;
    max-height: 52px !important;
}

body.commercial-landing .peek-chart {
    display: none !important;
}

body.commercial-landing .peek-micro-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    overflow: hidden !important;
}

body.commercial-landing .peek-micro-tabs button {
    min-height: 38px !important;
    color: rgba(255, 255, 255, .86) !important;
    background: rgba(255, 255, 255, .08) !important;
    border-color: rgba(255, 255, 255, .18) !important;
}

body.commercial-landing .peek-micro-tabs button.is-active {
    background: #0f766e !important;
    border-color: #5eead4 !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-button.primary,
body.commercial-landing .landing-button.secondary:hover {
    background: #0f766e !important;
    border-color: #0f766e !important;
    color: #ffffff !important;
}

body.commercial-landing .landing-button.primary:hover {
    background: #115e59 !important;
    border-color: #115e59 !important;
}

/* Register wizard hard lock: no horizontal scroll, each step behaves as a compact card. */
.register-builder {
    width: min(1440px, calc(100% - 32px)) !important;
    height: calc(100dvh - 28px) !important;
    min-height: 620px !important;
    max-height: calc(100dvh - 28px) !important;
    margin: 14px auto !important;
    display: grid !important;
    grid-template-columns: minmax(280px, 32%) minmax(0, 1fr) !important;
    gap: 1rem !important;
    overflow: hidden !important;
}

.register-builder-copy {
    min-width: 0 !important;
    padding: clamp(1.2rem, 2vw, 1.8rem) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.register-builder-copy img {
    width: 138px !important;
    max-width: 54% !important;
}

.register-builder-copy h2 {
    font-size: clamp(2rem, 2.65vw, 3.3rem) !important;
    line-height: 1.04 !important;
}

.register-builder-copy p {
    max-width: 420px !important;
    font-size: .98rem !important;
    line-height: 1.48 !important;
}

.register-builder-form.is-wizard {
    min-width: 0 !important;
    height: 100% !important;
    max-height: none !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto auto auto !important;
    gap: .65rem !important;
    overflow: hidden !important;
    padding: clamp(.9rem, 1.25vw, 1.15rem) !important;
}

.register-wizard-progress {
    min-height: 52px !important;
    padding: .35rem !important;
    gap: .35rem !important;
    border-radius: 20px !important;
}

.register-wizard-progress button {
    min-width: 0 !important;
    min-height: 42px !important;
    padding: .25rem .35rem !important;
    border-radius: 15px !important;
}

.register-wizard-progress button span {
    font-size: .74rem !important;
}

.register-wizard-progress button strong {
    font-size: .78rem !important;
}

.register-builder-form.is-wizard .register-section {
    display: none !important;
}

.register-builder-form.is-wizard .register-section.is-active {
    display: grid !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    padding: clamp(1rem, 1.35vw, 1.25rem) !important;
    align-content: start !important;
}

.register-section *,
.register-builder-form * {
    min-width: 0 !important;
}

.register-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .7rem !important;
}

.register-form-grid label {
    gap: .35rem !important;
}

.register-form-grid input,
.register-form-grid select,
.register-form-grid textarea {
    min-height: 44px !important;
    border-radius: 14px !important;
}

.register-theme-step {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) !important;
    gap: .8rem !important;
}

.register-theme-step .vertical-style-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .65rem !important;
}

.vertical-style-card {
    min-height: 94px !important;
    padding: .85rem !important;
    border-color: #dbe7ef !important;
    background: #ffffff !important;
}

.vertical-style-card::after {
    opacity: .25 !important;
}

.vertical-style-card:has(input:checked) {
    border-color: #14b8a6 !important;
    background: #ecfdf5 !important;
    box-shadow: 0 16px 34px rgba(20, 184, 166, .14) !important;
}

.vertical-style-swatch {
    width: 34px !important;
    height: 34px !important;
    background: linear-gradient(135deg, #0f766e, #14b8a6) !important;
}

.vertical-style-card strong {
    font-size: .95rem !important;
}

.vertical-style-card small {
    display: none !important;
}

.register-theme-preview {
    --theme-accent: #0f766e !important;
    --theme-soft: #ccfbf1 !important;
    --theme-dark: #0f172a !important;
    min-height: 0 !important;
    padding: .9rem !important;
    gap: .6rem !important;
    background: linear-gradient(145deg, #ecfdf5, #ffffff) !important;
    border-color: #99f6e4 !important;
}

.theme-preview-top strong {
    max-width: 260px !important;
    font-size: .95rem !important;
}

.theme-preview-board {
    grid-template-columns: 58px 1fr !important;
    min-height: 202px !important;
}

.theme-preview-sidebar {
    gap: .5rem !important;
    padding: .75rem !important;
}

.theme-preview-sidebar span,
.theme-preview-sidebar i {
    width: 28px !important;
    height: 28px !important;
}

.theme-preview-content {
    gap: .5rem !important;
    padding: .7rem !important;
}

.theme-preview-header {
    height: 34px !important;
}

.theme-preview-metrics b {
    height: 36px !important;
}

.theme-preview-calendar {
    padding: .55rem !important;
    gap: .35rem .5rem !important;
}

.theme-preview-calendar em {
    min-height: 25px !important;
    padding: .28rem .55rem !important;
}

.register-plan-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .8rem !important;
    overflow: visible !important;
}

.register-plan-card {
    min-height: 236px !important;
    padding: 1rem !important;
}

.register-plan-card small,
.register-plan-card b {
    font-size: .76rem !important;
    line-height: 1.35 !important;
}

.register-plan-card strong {
    font-size: 1.3rem !important;
}

.register-plan-card em {
    font-size: clamp(1.45rem, 2vw, 2rem) !important;
}

.register-term-grid,
.register-extra-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}

.register-extra-card,
.register-term-card {
    min-height: 86px !important;
    padding: .85rem !important;
}

.register-extra-card small {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.legal-consent-compact .legal-consent-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .7rem !important;
}

.legal-consent-compact .legal-consent-card {
    min-height: 260px !important;
    padding: .9rem !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto auto !important;
}

.legal-short-copy {
    font-size: .82rem !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 5 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.legal-check {
    padding: .7rem !important;
}

.legal-check span {
    font-size: .76rem !important;
    line-height: 1.28 !important;
}

.legal-modal {
    z-index: 10000 !important;
}

.legal-modal-panel {
    position: fixed !important;
    inset: 28px !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
    border-radius: 28px !important;
}

.legal-modal-panel .legal-scroll-box {
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
}

.register-wizard-actions {
    margin: 0 !important;
    min-height: 50px !important;
    align-items: center !important;
}

.register-submit-row {
    min-height: 64px !important;
    margin: 0 !important;
    padding: .65rem .8rem !important;
    grid-template-columns: 1fr minmax(230px, .38fr) !important;
    align-items: center !important;
}

.register-submit-row .button {
    width: 100% !important;
    min-height: 44px !important;
}

.register-builder-form > .form-link {
    margin: 0 !important;
    line-height: 1 !important;
}

@media (max-width: 1180px) {
    .register-builder {
        height: auto !important;
        max-height: none !important;
        grid-template-columns: 1fr !important;
        overflow: visible !important;
    }

    .register-builder-form.is-wizard {
        height: auto !important;
    }

    .register-builder-form.is-wizard .register-section.is-active {
        overflow: visible !important;
    }

    .register-theme-step,
    .register-plan-grid,
    .register-term-grid,
    .register-extra-grid,
    .legal-consent-compact .legal-consent-grid,
    .owner-kpi-grid,
    .owner-main-grid,
    .owner-billing-strip {
        grid-template-columns: 1fr !important;
    }
}