/* Cohesive marketing, workspace and onboarding surfaces. */
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.home-body { background: #f8f7f3; }
.home-body::before, .admin-body::before, .setup-body::before { display: none; }
.home-width { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }
.home-nav { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 22px; border-block-end: 1px solid #e5e0e7; }
.home-logo .brand-logo { width: 118px; }
.home-nav-links { display: flex; gap: 32px; }
.home-nav a { text-decoration: none; font-size: .82rem; font-weight: 580; }
.home-language { padding: 10px; }
.home-nav .btn { min-height: 44px; }
.home-hero { display: grid; grid-template-columns: 1.07fr 1fr; gap: 54px; align-items: center; padding-block: 74px 84px; }
.home-kicker { display: inline-flex; align-items: center; gap: 9px; font-size: .73rem; font-weight: 600; color: #65546d; }
.home-kicker i { width: 8px; height: 8px; border-radius: 50%; background: #967443; box-shadow: 0 0 0 5px #eee6d8; }
.home-hero h1 { font-size: clamp(2.8rem, 4.45vw, 4.5rem); line-height: 1.17; font-weight: 680; letter-spacing: -.06em; margin-block: 23px; }
[dir=rtl] .home-hero h1 { font-size: clamp(2.5rem, 4.1vw, 4rem); line-height: 1.4; letter-spacing: normal; }
.home-hero h1 span { display: block; color: #8b679d; }
.home-lede { max-width: 520px; color: #716779; font-size: 1rem; line-height: 1.9; }
.home-hero-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-block-start: 30px; }
.home-hero-actions .btn { min-height: 56px; font-size: .8rem; }
.home-text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--brand); font-size: .78rem; font-weight: 620; text-decoration: none; border: 0; padding: 10px 0; cursor: pointer; background: none; }
.home-text-link .icon { width: 17px; }
.home-reassurance { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-block-start: 22px; font-size: .68rem; color: #74697a; }
.home-reassurance .icon { width: 15px; color: var(--ok); }
.home-stage { position: relative; padding: 24px 20px 28px; isolation: isolate; scroll-margin-top: 20px; }
.home-orbit { position: absolute; z-index: -1; inset: 0; border-radius: 48% 48% 30% 30%; background: #ebe5ee; border: 1px solid #e3d9e7; transform: rotate(-6deg); }
.demo-window { overflow: hidden; position: relative; border: 1px solid #ded4e2; border-radius: 20px; background: #fff; box-shadow: 0 28px 65px #3a164e18, 0 3px 8px #3a164e06; transform: rotate(2deg); }
[dir=rtl] .demo-window { transform: rotate(-2deg); }
.demo-chrome { display: flex; justify-content: space-between; align-items: center; padding: 13px 16px; border-block-end: 1px solid #eee9f0; color: #7b7181; font-size: .6rem; }
.demo-chrome .icon { width: 14px; }
.demo-chrome i { width: 6px; height: 6px; border-radius: 50%; background: #dbd1e0; }
.demo-brand { display: flex; align-items: center; gap: 14px; padding: 24px; background: #f5f1f7; }
.demo-brand-icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 17px; color: #fff; background: #4a1d5a; }
.home-overline { font-size: .64rem; font-weight: 650; color: #84728c; }
.demo-brand h2 { font-size: 1.25rem; margin-block: 2px; }
.demo-brand p { color: #75677d; font-size: .6rem; }
.demo-content { padding: 22px 25px; }
.demo-progress { display: flex; align-items: center; gap: 8px; margin-block-end: 23px; }
.demo-progress > span { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid #dfd6e4; border-radius: 50%; color: #796483; font-size: .63rem; }
.demo-progress > span:nth-of-type(2) { background: #4a1d5a; color: #fff; border-color: #4a1d5a; }
.demo-progress .is-done { color: var(--ok); background: #edf6f1; border-color: #edf6f1; }
.demo-progress .icon { width: 12px; }
.demo-progress > i { height: 1px; flex: 1; background: #eae3ee; }
.demo-content h3 { font-size: 1rem; margin-block-end: 7px; }
.demo-content .muted { font-size: .7rem; }
.demo-times { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-block: 20px 8px; }
.demo-times button { min-height: 46px; border: 1px solid #dbcee2; color: #4a1d5a; background: #fff; border-radius: 10px; font-size: .83rem; font-weight: 600; cursor: pointer; transition: background 150ms, color 150ms, border-color 150ms; }
.demo-times button[aria-pressed=true] { background: #4a1d5a; color: #fff; border-color: #4a1d5a; }
.demo-result { display: flex; align-items: center; gap: 10px; padding: 12px; background: #edf6f1; border-radius: 12px; margin-block-start: 15px; animation: swap-in 180ms var(--ease); }
.demo-check { color: #276a52; }
.demo-result strong { font-size: .75rem; }
.demo-result p, .demo-explanation { font-size: .68rem; color: #64716b; }
.demo-explanation { margin-block-start: 10px; }
.demo-caption { display: flex; gap: 6px; justify-content: center; align-items: center; padding: 12px; border-block-start: 1px solid #eee8f1; color: #7b6c83; font-size: .58rem; }
.demo-caption .icon { width: 13px; }
.home-floating-note { display: flex; align-items: center; gap: 12px; position: absolute; inset-inline-end: -12px; inset-block-end: 5px; border: 1px solid #e3dbe7; border-radius: 14px; background: #fff; padding: 14px 20px; box-shadow: 0 12px 30px #34114212; }
.home-floating-note > span { display: grid; place-items: center; width: 34px; height: 34px; background: #e8f5ee; color: #337357; border-radius: 50%; }
.home-floating-note .icon { width: 18px; }
.home-floating-note strong, .home-floating-note small { display: block; font-size: .7rem; }
.home-floating-note small { font-size: .6rem; color: #807087; }
.home-local { display: flex; align-items: center; gap: 22px; padding: 27px 32px; background: #ede9e1; border-radius: 16px; }
.home-local h2 { font-size: .9rem; white-space: nowrap; }
.home-local p { color: #766e66; font-size: .78rem; max-width: 680px; }
.home-local-mark { color: #8c7454; }
.home-local-type { margin-inline-start: auto; font-size: 2rem; color: #9a886e; font-weight: 650; }
.home-section { padding-block: 92px; scroll-margin-top: 20px; }
.home-section-heading { max-width: 650px; margin-block-end: 34px; }
.home-section-heading h2 { font-size: clamp(1.8rem, 2.6vw, 2.7rem); letter-spacing: -.04em; margin-block: 12px; }
[dir=rtl] .home-section-heading h2 { letter-spacing: normal; }
.home-section-heading p { color: #7b6d82; font-size: .9rem; }
.home-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.home-feature { padding: 26px; border: 1px solid #e5dfe8; border-radius: 18px; background: #fffdfb; }
.home-feature-top { display: flex; justify-content: space-between; align-items: center; margin-block-end: 32px; }
.home-feature-top > span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #f1eaf4; color: #704482; }
.home-feature-top bdi { color: #a898af; font-size: .65rem; }
.home-feature h3 { font-size: 1.1rem; margin-block-end: 10px; }
.home-feature p { font-size: .82rem; line-height: 1.9; color: #776b7e; }
.home-workspace { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; background: #eee9f1; padding: 55px; border-radius: 26px; scroll-margin-top: 20px; }
.home-workspace h2 { font-size: clamp(1.7rem, 2.7vw, 2.6rem); white-space: pre-line; margin-block: 15px 20px; }
.home-workspace-copy > p { font-size: .85rem; color: #776981; line-height: 1.9; }
.home-workspace ul { list-style: none; padding: 0; display: grid; gap: 13px; margin-block: 25px; }
.home-workspace li { display: flex; gap: 10px; align-items: center; font-size: .74rem; }
.home-workspace li .icon { width: 16px; flex: 0 0 16px; color: #6a4979; }
.home-workspace .btn { width: fit-content; font-size: .78rem; }
.home-agenda-preview { padding: 26px; background: #fffdfb; border: 1px solid #e0d7e6; border-radius: 18px; box-shadow: 0 20px 45px #3811440c; }
.home-agenda-preview h3 { margin-block: 18px 4px; font-size: 1.4rem; }
.home-agenda-list { margin-block: 22px; display: grid; gap: 10px; }
.home-agenda-item { display: flex; align-items: center; gap: 13px; border: 1px solid #e9e2ed; border-radius: 12px; padding: 16px 12px; }
.home-agenda-item:nth-child(2) { background: #f2edf5; border-color: #cdb9d7; }
.home-agenda-item bdi { font-size: .7rem; font-weight: 650; }
.agenda-preview-icon { color: #8c7198; }
.agenda-preview-icon .icon { width: 18px; }
.home-agenda-item strong, .home-agenda-item small { display: block; font-size: .7rem; }
.home-agenda-item small { color: #877291; font-size: .6rem; }
.home-agenda-footer { display: flex; align-items: center; gap: 8px; color: #638270; font-size: .6rem; }
.home-agenda-footer .icon { width: 16px; }
.home-faq { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; }
.home-faq details { border-block-end: 1px solid #ddd4e2; }
.home-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 23px; cursor: pointer; font-size: .9rem; font-weight: 550; }
.home-faq summary > span { font-size: 1.3rem; color: #9a87a3; transition: transform 180ms; }
.home-faq details[open] summary > span { transform: rotate(45deg); }
.home-faq details p { color: #7a6b82; font-size: .85rem; padding-block-end: 22px; }
.home-closing { text-align: center; background: #3c194b; border-radius: 24px; padding: 58px 24px; color: #fff; margin-block-end: 45px; }
.home-closing .home-kicker { color: #d6bc9b; }
.home-closing h2 { margin-block: 15px; font-size: clamp(1.8rem, 3vw, 3rem); }
.home-closing p { color: #c9b8d0; font-size: .9rem; }
.home-closing .btn { display: inline-flex; width: auto; background: #f2e5d3; color: #472151; border-color: #f2e5d3; margin-block-start: 25px; }
.home-body footer.numoo, .setup-body footer.numoo { margin-inline-start: 0; }
/* Business workspace */
.admin-body { background: #f6f5f8; }
.admin-nav-bottom { display: none; }
.workspace-heading { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-block-end: 30px; }
.workspace-heading h1 { font-size: clamp(1.7rem, 2.5vw, 2.3rem); margin-block: 8px; font-weight: 650; }
.workspace-heading p { font-size: .82rem; color: var(--muted); }
.workspace-heading .btn { width: auto; flex-shrink: 0; font-size: .8rem; }
.workspace-heading > div { min-width: 0; flex: 1; }
.workspace-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin-block-end: 25px; }
.workspace-metric { display: flex; align-items: center; gap: 17px; background: #fff; border: 1px solid #e9e4ed; padding: 22px; border-radius: 16px; }
.metric-icon { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; color: #87619b; background: #f3edf7; border-radius: 14px; }
.metric-icon.is-mint { color: #4d8c72; background: #ecf6f0; }
.metric-icon.is-gold { color: #ad8645; background: #faf3e5; }
.metric-icon .icon { width: 21px; }
.workspace-metric strong, .workspace-metric div > span { display: block; }
.workspace-metric strong { font-size: 1.9rem; font-weight: 630; line-height: 1.2; font-variant-numeric: tabular-nums; }
.workspace-metric div > span { font-size: .68rem; color: var(--muted); margin-block-start: 6px; }
.workspace-layout { display: grid; grid-template-columns: minmax(0,1fr) 270px; gap: 22px; align-items: start; }
.agenda-panel { border: 1px solid #e6e0ea; border-radius: 18px; background: #fff; min-width: 0; overflow: hidden; }
.agenda-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 20px 22px 10px; }
.agenda-heading h2 { font-size: 1.05rem; }
.agenda-heading .btn-icon { min-height: 36px; width: 36px; background: #f8f6fa; }
.agenda-datebar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 5px 18px 14px; border-block-end: 1px solid #f0ecf3; }
.agenda-datebar .daynav { border: 0; box-shadow: none; background: none; padding: 0; margin: 0; min-height: 44px; flex: 1; gap: 8px; }
.agenda-datebar .daynav strong { font-size: .8rem; }
.agenda-datebar .daynav .btn { background: none; border: 0; }
.agenda-date-form { display: flex; gap: 4px; }
.agenda-date-form input { min-height: 40px; padding: 7px; width: 140px; font-size: .73rem; border: 1px solid #e6dfeb; border-radius: 9px; background: #fcfbfd; }
.agenda-date-form .btn { min-height: 40px; width: 36px; }
.agenda-tools { display: flex; gap: 10px; padding: 18px 20px 5px; }
.agenda-search { position: relative; flex: 1; margin: 0; min-width: 0; }
.agenda-search > .icon { position: absolute; inset-inline-start: 12px; top: 15px; width: 16px; color: #9b8ca5; }
.agenda-search input { padding-inline-start: 37px; font-size: .72rem; min-height: 44px; background: #faf9fc; border: 1px solid #e8e2ed; border-radius: 10px; }
.agenda-tools select { width: 160px; min-height: 44px; font-size: .69rem; border: 1px solid #e8e2ed; border-radius: 10px; background-color: #faf9fc; }
.agenda-filters { display: flex; gap: 6px; overflow-x: auto; padding: 12px 20px 18px; }
.agenda-filters button { display: flex; align-items: center; justify-content: center; gap: 6px; flex-shrink: 0; min-height: 40px; font-size: .68rem; border-radius: 9px; border: 1px solid transparent; background: none; color: #82728c; padding-inline: 12px; cursor: pointer; transition: background 150ms, color 150ms; }
.agenda-filters button[aria-pressed=true] { color: #512860; border-color: #e8ddee; background: #f2ecf6; font-weight: 650; }
.agenda-filters button > span { border-radius: 5px; padding: 1px 5px; background: #e7dbee; font-size: .6rem; }
.agenda-booking { display: flex; gap: 14px; align-items: center; padding: 19px 21px; border-block-start: 1px solid #f0ecf3; text-decoration: none; color: var(--ink); transition: background 150ms; }
.agenda-time { display: flex; flex-direction: column; gap: 2px; padding-inline-end: 13px; border-inline-end: 2px solid #dac9e4; flex-shrink: 0; }
.agenda-time strong { font-size: .82rem; }
.agenda-time > span { font-size: .65rem; color: #9a8da2; }
.agenda-avatar { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; background: #f1eaf5; color: #896397; border-radius: 12px; font-size: .8rem; }
.agenda-person { flex: 1; min-width: 0; }
.agenda-person > strong { display: block; font-size: .8rem; overflow-wrap: anywhere; }
.agenda-person > span { display: block; font-size: .68rem; color: #8b7b96; margin-block-start: 3px; }
.agenda-person .agenda-phone { font-size: .6rem; color: #918498; }
.agenda-status { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.agenda-status .tag { font-size: .6rem; white-space: normal; }
.agenda-status small { font-size: .57rem; color: #8b7c93; }
.agenda-booking .direction-icon { width: 14px; flex-basis: 14px; }
.agenda-booking[data-status=completed] .agenda-time { border-color: #9ec6b3; }
.agenda-booking[data-attention=true] .agenda-time { border-color: #d4b476; }
.tag-warn { background: #fbf3e1; color: #886422; }
.agenda-footnote { display: flex; justify-content: space-between; gap: 10px; padding: 14px 20px; border-block-start: 1px solid #eee8f2; font-size: .6rem; color: #8a7b93; }
.workspace-aside { display: grid; gap: 17px; }
.next-appointment { position: relative; overflow: hidden; background: #442053; color: #fff; border-radius: 18px; padding: 24px; }
.next-appointment::after { content: ''; position: absolute; width: 150px; height: 150px; border: 1px solid #ffffff10; border-radius: 50%; inset-inline-end: -75px; top: -70px; box-shadow: 0 0 0 25px #ffffff04; pointer-events: none; }
.next-appointment .eyebrow { color: #d4bb94; font-size: .64rem; }
.next-appointment .eyebrow .icon { width: 15px; }
.next-appointment h2 { font-size: 1rem; margin-block: 16px 6px; }
.next-appointment p { color: #c5b3ce; font-size: .75rem; }
.next-appointment .next-time { color: #fff; font-size: 2.5rem; line-height: 1.2; margin-block-start: 26px; }
.next-appointment .next-addons { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-block: 4px 0; color: #f3e7d4; font-size: .78rem; }
.next-appointment .next-addons .icon { width: 14px; flex: none; }
.next-appointment .btn { margin-block-start: 22px; min-height: 44px; font-size: .72rem; background: #f3e7d4; color: #472450; border-color: #f3e7d4; }
.next-empty-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #ffffff0d; color: #d6bf9e; margin-block-start: 25px; }
.week-panel { padding: 22px; background: #fff; border: 1px solid #e6e0ea; border-radius: 17px; }
.week-panel h2 { font-size: .85rem; margin-block-end: 18px; }
.week-panel > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-block: 12px; border-block-start: 1px solid #f2edf5; }
.week-panel > div > span { font-size: .67rem; color: #8b7a95; }
.week-panel strong { font-size: .9rem; font-variant-numeric: tabular-nums; }
.attention-note { display: flex; gap: 10px; padding: 16px; background: #faf5e9; border: 1px solid #ede0c5; border-radius: 14px; color: #897042; }
.attention-note > .icon { width: 16px; flex: 0 0 16px; margin-block-start: 4px; }
.attention-note strong { font-size: .72rem; }
.attention-note p { font-size: .65rem; line-height: 1.8; margin-block-start: 5px; }
.admin-body .card { background: #fff; box-shadow: 0 2px 6px #351b3d03; border-color: #e8e2ed; }
.admin-body .wrap-admin > .admin-page-header { padding-block: 10px 18px; margin-block-end: 22px; border-block-end: 1px solid #e7dfec; }
/* Onboarding: a real identity preview alongside the existing server forms. */
.setup-layout { display: grid; grid-template-columns: minmax(0,560px) minmax(0,400px); gap: 80px; width: min(1100px, calc(100% - 64px)); margin-inline: auto; align-items: start; }
.setup-layout .wizard-shell { padding-inline: 0; }
.setup-companion { padding-block: 65px 40px; position: sticky; top: 0; }
.setup-companion > h2 { font-size: 1.55rem; margin-block: 12px; }
.setup-preview-lede { font-size: .78rem; color: var(--muted); line-height: 1.9; margin-block-end: 25px; }
.setup-phone { border: 1px solid #ddd2e4; border-radius: 25px; background: #fff; overflow: hidden; box-shadow: 0 16px 40px #3c1a4c0d; }
.setup-phone-chrome { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; font-size: .62rem; color: #8d7997; }
.setup-phone-chrome > span { width: 6px; height: 6px; background: #b09a82; border-radius: 50%; }
.setup-phone-brand { padding: 23px; background: var(--biz-accent); color: var(--biz-accent-ink); text-align: center; }
.setup-preview-mark { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: #ffffff20; margin: 0 auto 12px; }
.setup-preview-mark img { width: 100%; height: 100%; object-fit: contain; border-radius: 14px; }
.setup-phone-brand h3 { font-size: 1.15rem; overflow-wrap: anywhere; }
.setup-phone-brand p { font-size: .7rem; margin-block-start: 7px; overflow-wrap: anywhere; }
.setup-phone-content { padding: 22px; }
.setup-phone-content h3 { font-size: .85rem; margin-block: 9px 17px; }
.preview-service { display: flex; align-items: center; gap: 10px; padding: 14px; border: 1px solid #e9e1ee; border-radius: 14px; }
.preview-service > span { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; background: #f2edf5; color: #90769e; flex-shrink: 0; }
.preview-service .icon { width: 17px; }
.preview-service > div { flex: 1; min-width: 0; }
.preview-service strong, .preview-service small { display: block; font-size: .7rem; overflow-wrap: anywhere; }
.preview-service small { font-size: .58rem; color: #9987a3; }
.preview-payment { display: flex; gap: 6px; align-items: center; justify-content: center; margin-block-start: 20px; font-size: .62rem; color: #817087; }
.preview-payment .icon { width: 14px; }
.setup-readiness { margin-block-start: 25px; }
.setup-readiness h3 { font-size: .8rem; margin-block-end: 12px; }
.setup-readiness > a { display: flex; align-items: center; gap: 10px; min-height: 45px; text-decoration: none; color: #786780; font-size: .73rem; }
.setup-readiness small { margin-inline-start: auto; font-size: .6rem; color: #887a91; }
.readiness-icon { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: #eee8f2; color: #a18eac; }
.readiness-icon.is-ready { background: #e5f1e9; color: #4e8969; }
.readiness-icon .icon { width: 12px; }
@media (hover:hover) {
  .demo-times button:hover { background: #f1eaf5; border-color: #9370a5; }
  .demo-times button[aria-pressed=true]:hover { background: #4a1d5a; }
  .agenda-booking:hover { background: #faf7fc; }
}
@media (min-width:1100px) {
  /* Full-height panel: it scrolls on its own when the menu is taller than a
     short laptop viewport, so the bottom links are never cut off. */
  .admin-nav { inset: 0 auto 0 0; inset-inline-start: 0; inset-inline-end: auto; width: 236px; border: 0; border-inline-end: 1px solid #e6dfeb; border-radius: 0; background: #fff; box-shadow: none; padding: 16px 17px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .admin-brand { padding-block-end: 14px; }
  .admin-menu-panel { gap: 4px; margin-block-start: 14px; }
  .admin-menu-panel a { font-size: .77rem; border-radius: 10px; min-height: 40px; }
  .admin-menu-panel a.on { color: #fff; background: #4a1d5a; box-shadow: 0 4px 10px #4a1d5a10; }
  .admin-nav-bottom { display: grid; gap: 4px; order: 3; margin-block-start: auto; padding-block-start: 14px; border-block-start: 1px solid #eee8f2; }
  .admin-nav-bottom .btn { justify-content: flex-start; min-height: 40px; padding-block: 6px; font-size: .73rem; background: none; border: 0; box-shadow: none; }
  .admin-nav-bottom form .btn { color: #91819a; }
  .admin-body .wrap-admin { margin-inline-start: 236px; margin-inline-end: 0; padding: 36px clamp(22px,3vw,46px); }
  .admin-body footer.numoo { margin-inline-start: 236px; }
}
@media (max-width:1350px) and (min-width:1100px) { .workspace-layout { grid-template-columns: minmax(0,1fr) 230px; gap: 15px; } .agenda-avatar { display: none; } .agenda-tools { flex-wrap: wrap; } .agenda-tools select { width: 100%; } }
@media (max-width:1099px) { .workspace-layout { grid-template-columns: minmax(0,1fr) 250px; } .wrap-admin { max-width: 1100px; } .admin-nav-bottom { display: none; } .setup-layout { gap: 40px; } }
@media (max-width:850px) {
  .home-hero { gap: 35px; padding-block: 45px; } .home-hero h1 { font-size: 2.6rem; } .home-lede { font-size: .85rem; } .home-nav-links { display: none; }
  .home-workspace { gap: 30px; padding: 30px; } .home-faq { gap: 35px; } .home-feature { padding: 20px; } .home-floating-note { inset-inline-end: -5px; padding: 12px; }
  .workspace-layout { grid-template-columns: 1fr; } .workspace-aside { grid-template-columns: 1fr 1fr; } .workspace-aside > .btn { grid-column: 1/-1; } .workspace-metric { padding: 17px; gap: 12px; }
  .setup-layout { grid-template-columns: 1fr; width: min(600px, calc(100% - 40px)); gap: 5px; } .setup-companion { position: static; padding-block-start: 25px; border-block-start: 1px solid var(--line); } .setup-layout .wizard-shell { max-width: none; } .setup-phone { max-width: 380px; margin-inline: auto; }
}
@media (max-width:640px) {
  .home-width { width: calc(100% - 36px); } .home-nav { padding-block: 16px; gap: 10px; } .home-logo .brand-logo { width: 92px; } .home-nav .cluster { gap: 3px; } .home-nav .btn { padding-inline: 11px; font-size: .7rem; } .home-nav .btn .icon { display: none; } .home-language { font-size: .68rem !important; padding: 10px 6px; }
  .home-hero { grid-template-columns: 1fr; gap: 35px; padding-block: 40px 50px; } .home-hero h1 { font-size: 3rem; max-width: 500px; } [dir=rtl] .home-hero h1 { font-size: 2.65rem; } .home-kicker { font-size: .62rem; } .home-lede { font-size: .9rem; }
  .home-hero-actions { gap: 12px; margin-block-start: 25px; } .home-hero-actions .btn { width: 100%; } .home-hero-actions .home-text-link { margin-inline: auto; } .home-reassurance { justify-content: center; font-size: .61rem; } .home-stage { padding: 15px 13px 26px; max-width: 450px; width: 100%; margin-inline: auto; } .home-floating-note { inset-inline-end: 0; }
  .home-local { padding: 22px; flex-wrap: wrap; gap: 12px; } .home-local p { font-size: .74rem; } .home-local-type { display: none; }
  .home-section { padding-block: 55px; } .home-feature-grid { grid-template-columns: 1fr; gap: 12px; } .home-feature-top { margin-block-end: 18px; } .home-feature h3 { font-size: 1rem; }
  .home-workspace { grid-template-columns: 1fr; padding: 27px 20px; gap: 30px; } .home-agenda-preview { padding: 20px; } .home-faq { grid-template-columns: 1fr; gap: 0; } .home-faq .home-section-heading { margin-block-end: 8px; } .home-closing { padding-block: 40px; }
  .workspace-heading { align-items: flex-start; flex-direction: column; margin-block-end: 23px; gap: 16px; } .workspace-heading .btn { width: 100%; } .workspace-heading h1 { font-size: 1.7rem; } .workspace-heading p { font-size: .75rem; }
  .workspace-metrics { gap: 8px; } .workspace-metric { padding: 14px 8px; text-align: center; justify-content: center; } .metric-icon { display: none; } .workspace-metric strong { font-size: 1.6rem; } .workspace-metric div > span { font-size: .57rem; }
  .workspace-aside { grid-template-columns: 1fr; } .agenda-tools { padding-inline: 12px; flex-wrap: wrap; } .agenda-search { flex-basis: 100%; } .agenda-tools select { width: 100%; } .agenda-filters { padding-inline: 12px; gap: 3px; } .agenda-filters button { padding-inline: 8px; font-size: .61rem; } .agenda-heading { padding-inline: 15px; }
  .agenda-booking { gap: 10px; padding: 16px 12px; } .agenda-avatar, .agenda-booking .direction-icon { display: none; } .agenda-person > strong { font-size: .74rem; } .agenda-person > span { font-size: .61rem; } .agenda-time { padding-inline-end: 9px; } .agenda-time strong { font-size: .73rem; } .agenda-status { max-width: 88px; } .agenda-status .tag { font-size: .54rem; padding-inline: 7px; }
  .agenda-datebar { padding-inline: 10px; } .agenda-datebar .daynav { flex-basis: 100%; } .agenda-date-form { flex: 1; } .agenda-date-form input { width: 100%; } .agenda-footnote { font-size: .52rem; padding-inline: 13px; }
}
@media print { .admin-nav-bottom, .agenda-tools, .agenda-filters, .agenda-date-form, .workspace-heading > .btn { display: none !important; } .workspace-layout { display: block; } .admin-body .wrap-admin { margin: 0; } }
.workspace-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-block-start: 30px; padding-block-start: 16px; border-block-start: 1px solid var(--line); }
.workspace-footer .btn { background: none; border: 0; box-shadow: none; font-size: .72rem; color: var(--muted); }
@media (min-width: 1100px) { .workspace-footer > a { visibility: hidden; } }
@media print { .workspace-footer { display: none !important; } }
/* Benefit-led product story: practical examples and a transparent calculator. */
.value-problems { padding-block: 70px 45px; }
.value-problems > h2 { font-size: clamp(1.6rem,2.5vw,2.5rem); margin-block-end: 28px; }
.value-problem-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.value-problem-grid article { border-inline-start: 2px solid #d6c5b2; padding-inline-start: 22px; }
.value-problem-grid article > span { color: #a08666; }
.value-problem-grid h3 { font-size: 1rem; margin-block: 18px 10px; }
.value-problem-grid p { font-size: .82rem; color: #796d80; line-height: 1.9; }
.value-calculator { display: grid; grid-template-columns: 1.2fr 1fr; gap: 50px; align-items: center; padding: 40px; border: 1px solid #e2d8e7; border-radius: 22px; background: #fffdfb; }
.value-calculator h2 { font-size: 1.65rem; margin-block: 12px; }
.value-calculator p { color: #796980; font-size: .8rem; }
.value-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-block-start: 18px; }
.value-inputs label { font-size: .7rem; }
.value-inputs input { margin-block-start: 9px; background: #faf7fc; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.value-result { padding: 35px; border-radius: 18px; background: #452052; color: #e9dcef; }
.value-result > span { font-size: .76rem; }
.value-result > p { color: #fff; font-size: clamp(2.5rem,4vw,4rem); line-height: 1.4; margin-block: 18px; font-weight: 620; }
.value-result p small { font-size: 1rem; color: #d4bb9a; }
.value-result > small { font-size: .66rem; color: #d9c9df; }
.value-result-line { display: block; height: 1px; background: #ffffff20; margin-block-end: 18px; }
.growth-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.growth-card { padding: 28px; border: 1px solid #e4dce9; border-radius: 18px; background: #fffdfb; }
.growth-card h3 { margin-block: 24px 12px; font-size: 1.1rem; }
.growth-card p { font-size: .81rem; line-height: 1.9; color: #78687f; }
.growth-icon { color: #805d93; }
.growth-status { font-size: .6rem; padding: 6px 9px; border-radius: 7px; background: #f1eae0; color: #796446; }
.growth-status.is-ready { background: #e9f3ed; color: #3e7257; }
@media(min-width:641px) { .home-hero-actions .btn { width: auto; } }
@media(max-width:700px) { .value-problem-grid, .value-calculator, .growth-grid { grid-template-columns: 1fr; } .value-calculator { padding: 25px; gap: 25px; } .value-problems { padding-block-start: 45px; } .value-problem-grid { gap: 25px; } .value-result { padding: 25px; } }
.business-insights { margin-block-start: 25px; padding: 26px; border: 1px solid #e5deea; border-radius: 20px; background: #fff; }
.insight-heading { display: flex; gap: 20px; justify-content: space-between; align-items: flex-start; }
.insight-heading h2 { font-size: 1.3rem; margin-block: 7px; }
.insight-heading p { color: #786681; font-size: .76rem; }
.insight-heading .tag { white-space: normal; }
.insight-body { display: grid; grid-template-columns: 1fr 240px; gap: 35px; margin-block-start: 28px; align-items: center; }
.week-chart { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 12px; align-items: end; }
.week-chart-day { display: flex; flex-direction: column; align-items: center; gap: 7px; text-decoration: none; min-width: 0; border-radius: 8px; }
.week-chart-day > strong { color: #725281; font-size: .76rem; }
.week-chart-day > span:not(.week-chart-track) { color: #776480; font-size: .57rem; }
.week-chart-day small { font-size: .55rem; color: #96859f; }
.week-chart-track { display: flex; width: 100%; height: 125px; align-items: flex-end; background: #f8f5fa; border-radius: 8px; overflow: hidden; }
.week-chart-track i { width: 100%; height: var(--bar-height); min-height: 2px; background: #d4c2df; border-radius: 8px 8px 0 0; }
.week-chart-day.is-current .week-chart-track i { background: #6a3c7d; }
.week-chart-day:hover .week-chart-track { background: #eee6f3; }
.insight-values { display: grid; gap: 16px; border-inline-start: 1px solid #eee6f2; padding-inline-start: 25px; }
.insight-values div > span, .insight-values strong, .insight-values small { display: block; }
.insight-values div > span { color: #8a7495; font-size: .68rem; }
.insight-values strong { font-size: 1.5rem; margin-block: 4px; }
.insight-values small { color: #a07c60; font-size: .62rem; }
.insight-values > p { color: #8c7b96; font-size: .62rem; }
.customer-initial { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 15px; background: #f1e9f6; color: #805991; font-size: 1.1rem; }
.customer-card > div { flex: 1; min-width: 0; }
@media(max-width:700px) { .business-insights { padding: 20px 15px; } .insight-heading { flex-direction: column; } .insight-body { grid-template-columns: 1fr; gap: 25px; } .insight-values { border-inline-start: 0; padding-inline-start: 0; border-block-start: 1px solid #eee6f2; padding-block-start: 20px; } .week-chart { gap: 7px; } .week-chart-track { height: 95px; } }

.home-link-example { padding: clamp(24px, 4vw, 48px); border: 1px solid var(--line); border-radius: 28px; background: var(--card-solid); text-align: center; }
.home-link-example > span { display: block; color: var(--muted); font-size: .875rem; }
.home-link-example > bdi { display: block; margin-block: 18px; font-size: clamp(1.1rem, 4vw, 2rem); font-weight: 700; color: var(--brand); overflow-wrap: anywhere; }
.home-link-example > p { max-width: 660px; margin-inline: auto; line-height: 1.9; color: var(--muted); }

.identity-settings { scroll-margin-top: 24px; padding: 24px; margin-block-end: 24px; border: 1px solid var(--line); border-radius: 22px; background: var(--bg); }
.identity-settings h2 { margin-block-end: 8px; }
.identity-settings > .field { margin-block-start: 20px; }
.admin-body .days-people { margin-block-end: 24px; flex-wrap: wrap; }

@media (max-width:1099px) { .identity-settings { scroll-margin-top: 100px; } }

/* Brand studio: a familiar upload action, with a tangible local preview. */
.logo-dropzone { position:relative; display:flex; align-items:center; gap:22px; padding:28px; border:2px dashed #cbb8d5; border-radius:22px; background:#faf7fc; cursor:pointer; transition:background 150ms,border-color 150ms; }
.logo-dropzone:focus-within,.logo-dropzone.is-dragging { outline:3px solid #cab1d8; outline-offset:4px; border-color:var(--brand); background:#f0e7f5; }
.logo-dropzone:has(input:disabled) { cursor:default; opacity:.65; }
.logo-dropzone > span:last-of-type { display:grid; gap:8px; }
.logo-dropzone strong { font-size:1.05rem; color:var(--ink); }
.logo-dropzone small { color:var(--muted); }
.logo-dropzone input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:inherit; }
.logo-upload-art { position:relative; flex:0 0 76px; height:76px; display:grid; place-items:center; border-radius:20px; background:white; border:1px solid var(--line); color:var(--brand); }
.logo-upload-art .icon { width:30px; height:30px; }
.logo-upload-art img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:6px; border-radius:20px; background:white; }
[data-logo-status] { overflow-wrap:anywhere; margin-top:12px; }
.brand-picker { display:grid; gap:18px; padding-block:24px; border-block-start:1px solid var(--line); }
.brand-swatches { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.brand-swatches button { display:grid; justify-items:center; gap:10px; padding:12px 6px; border:2px solid transparent; border-radius:14px; background:var(--bg); color:var(--ink); cursor:pointer; font-size:.8rem; }
.brand-swatches button[aria-pressed=true] { border-color:var(--brand); background:#f3ecf7; }
.brand-swatches button span { width:32px; height:32px; border-radius:50%; background:var(--swatch); box-shadow:inset 0 0 0 1px #0001; }
.brand-reset { display:flex; align-items:center; gap:10px; }
.brand-reset input { width:20px; height:20px; margin:0; }
.brand-live-preview.color-preview { display:grid; gap:16px; padding:24px; border:1px solid var(--biz-accent-line); border-radius:20px; background:var(--biz-accent-soft); }
.brand-live-preview > div { display:flex; gap:10px; }
.brand-live-preview small,.brand-live-preview p { color:var(--muted); font-size:.8rem; }
.demo-progress > span:nth-of-type(2) { background:white; color:#887291; border-color:#ded3e4; }
.demo-progress > span.is-current { background:#4a1d5a; color:white; border-color:#4a1d5a; }
.demo-progress > span.is-done { background:#edf6f1; color:#276a52; border-color:#edf6f1; }
.demo-services { display:grid; gap:10px; margin-block:18px; }
.demo-services button { display:flex; align-items:center; gap:12px; text-align:start; padding:16px; border:1px solid #dbcee2; border-radius:14px; background:white; color:#4a1d5a; cursor:pointer; }
.demo-services button > span { display:grid; gap:6px; flex:1; }
.demo-services small { color:#776b7e; }
.demo-content .btn-primary { margin-block-start:16px; }
.demo-content label { font-size:.75rem; margin-block:14px 8px; }
.demo-selection,.demo-safety { font-size:.72rem; line-height:1.7; color:#776b7e; }
.demo-safety { padding-block-start:16px; border-block-start:1px solid #eee8f1; margin-top:18px; }
.demo-content [hidden] { display:none!important; }
@media(max-width:600px) { .brand-swatches { grid-template-columns:repeat(3,minmax(0,1fr)); } .logo-dropzone { padding:20px; gap:14px; } .logo-upload-art { flex-basis:56px; height:56px; } }

.location-options { display:flex; flex-wrap:wrap; gap:14px; }.location-options label { display:flex; align-items:center; gap:10px; padding:16px 20px; border:1px solid var(--line); border-radius:16px; cursor:pointer; }.location-options input { width:20px; height:20px; margin:0; }.location-options label:has(:checked) { background:#f3ecf7; border-color:var(--brand); }[data-location-panel][hidden] { display:none!important; }
#location { min-width:0; border:1px solid #e5ddea; border-radius:20px; padding:24px; scroll-margin-top:90px; }
#location legend { padding-inline:8px; }
/* Selected-service offers: shared card rhythm, usable in either direction. */
.discount-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-block:20px}
.discount-stats>div{padding:18px;border:1px solid var(--line);border-radius:18px;display:grid;gap:4px}
.discount-stats strong{font-size:1.7rem}.discount-stats span{font-size:.8rem;color:var(--muted)}
.discount-principle{display:flex;gap:12px;align-items:center;margin-block:20px;padding:16px;border-radius:16px;background:var(--accent-soft)}
.discount-principle p{margin:0}.discount-principle svg{flex-shrink:0}
.discount-card h2{margin-block:10px;font-size:1.25rem}.discount-value{font-size:1.5rem;text-align:end}.discount-value small{display:block;font-size:.75rem;font-weight:400}
.discount-service-tags,.discount-presets{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-block:16px}
.discount-actions{display:flex;align-items:start;gap:16px;margin-block-start:20px}
.discount-actions>details{min-width:0}.discount-actions summary{min-height:44px;cursor:pointer;font-weight:600;padding-block:10px}
.discount-empty{text-align:center;padding:30px}.discount-service-picker{display:grid;gap:6px;max-height:320px;overflow:auto}
.discount-service-picker .check-row{margin:0;padding:12px;border:1px solid var(--line);border-radius:12px;gap:10px}
.discount-service-picker bdi{margin-inline-start:auto;white-space:nowrap;font-size:.8rem}
.discount-preview{padding:20px;border-radius:18px;background:var(--accent-soft);margin-block:20px}
.discount-preview-row{display:flex;justify-content:space-between;gap:12px;padding-block:12px;border-bottom:1px solid var(--line)}
.discount-preview-row>span:last-child{text-align:end}.discount-preview-row small{display:block}.discount-preview-row del{opacity:.65;font-size:.8rem}
.discount-schedule{margin-block:20px}.discount-schedule summary{display:flex;gap:8px;align-items:center;cursor:pointer;min-height:44px;font-weight:600}
.offer-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--accent);font-size:.85rem;margin-block:8px}.offer-note del{color:var(--muted)}
.offer-note[hidden]{display:none}
@media(max-width:600px){.discount-page-header{flex-direction:column;align-items:stretch}.discount-page-header>.btn{align-self:flex-start}.discount-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.discount-actions{flex-direction:column}.discount-actions>details{width:100%}.discount-preview-row{font-size:.85rem}}

.profile-link-settings{margin-block:24px;scroll-margin-top:30px}.profile-link-heading{display:flex;gap:16px;align-items:flex-start}.profile-link-heading h2{margin:0 0 6px}.profile-link-heading p{max-width:620px}.profile-link-emblem{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:16px;background:#f2eaf6;color:#603579}.profile-link-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.profile-link-fields label{display:flex;align-items:center;gap:8px}.profile-link-fields .icon{width:18px;height:18px}.profile-custom-link{min-width:0;padding:18px;border:1px solid var(--border,#ded2e4);border-radius:16px}.profile-custom-link legend{font-size:.8rem;color:var(--muted);padding-inline:8px}.profile-custom-link>.field{margin-top:16px}.profile-link-save{display:flex;flex-wrap:wrap;gap:12px}.business-profile-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-block:20px}.business-profile-links a{display:inline-flex;align-items:center;gap:8px;border:1px solid currentColor;border-radius:999px;padding:10px 14px;text-decoration:none}.business-profile-links .icon{width:18px;height:18px}@media(max-width:600px){.profile-link-fields{grid-template-columns:1fr}.profile-link-heading{gap:12px}}