:root {
    --ink: #27352e;
    --muted: #6e7871;
    --green: #40594b;
    --green-dark: #2f4438;
    --green-soft: #e7eee8;
    --rose: #c98377;
    --rose-soft: #f4e4df;
    --sand: #d6b98c;
    --sand-soft: #f5eddf;
    --paper: #fffefa;
    --canvas: #fbfaf7;
    --line: #e8e5de;
    --serif: 'Playfair Display', Georgia, serif;
    --sans: 'DM Sans', system-ui, sans-serif;
    --shadow: 0 28px 80px rgba(40, 56, 47, .13);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; overflow-x: hidden; background: var(--canvas); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.skip-link { position: fixed; z-index: 1000; top: 8px; left: 8px; padding: 10px 14px; border-radius: 8px; background: white; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.site-header { position: fixed; z-index: 100; top: 0; right: 0; left: 0; height: 82px; border-bottom: 1px solid transparent; transition: height .25s, background .25s, border-color .25s, box-shadow .25s; }
.site-header.scrolled { height: 70px; border-color: rgba(226, 224, 216, .8); background: rgba(251, 250, 247, .9); box-shadow: 0 8px 30px rgba(39,53,46,.04); backdrop-filter: blur(18px); }
.nav-shell { display: flex; width: min(1180px, calc(100% - 40px)); height: 100%; align-items: center; justify-content: space-between; margin: auto; }
.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #526e5d, #31483b); color: white; font: 600 15px var(--serif); box-shadow: 0 7px 18px rgba(49,68,58,.17); }
.brand strong, .brand small { display: block; }
.brand strong { font: 600 16px/1.1 var(--serif); }
.brand small { margin-top: 4px; color: var(--muted); font-size: 7px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 34px; color: #58645d; font-size: 13px; font-weight: 600; }
.site-nav > a { transition: color .2s; }
.site-nav > a:hover { color: var(--green); }
.site-nav .nav-demo { display: inline-flex; min-height: 43px; align-items: center; gap: 8px; padding: 0 18px; border-radius: 12px; background: var(--green); color: white; box-shadow: 0 8px 20px rgba(48,68,57,.14); transition: background .2s, transform .2s; }
.site-nav .nav-demo:hover { background: var(--green-dark); color: white; transform: translateY(-1px); }
.menu-toggle { display: none; width: 42px; height: 42px; align-items: center; justify-content: center; flex-direction: column; gap: 4px; border: 1px solid var(--line); border-radius: 11px; background: white; }
.menu-toggle > span:not(.sr-only) { width: 17px; height: 1.5px; background: var(--ink); transition: transform .2s, opacity .2s; }
.menu-toggle[aria-expanded=true] > span:first-child { transform: translateY(5.5px) rotate(45deg); }
.menu-toggle[aria-expanded=true] > span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded=true] > span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

.hero { position: relative; display: grid; min-height: 820px; grid-template-columns: minmax(360px, .82fr) minmax(560px, 1.18fr); align-items: center; gap: 55px; overflow: hidden; padding: 142px max(40px, calc((100vw - 1180px)/2)) 85px; }
.hero:before { position: absolute; inset: 0; z-index: -3; background-image: radial-gradient(rgba(55,76,64,.07) .65px, transparent .65px); background-size: 20px 20px; mask-image: linear-gradient(90deg, black, transparent 55%); content: ''; }
.hero-glow { position: absolute; z-index: -2; border-radius: 50%; filter: blur(3px); pointer-events: none; }
.glow-one { top: 100px; right: -180px; width: 660px; height: 660px; background: radial-gradient(circle, rgba(222,204,179,.42), rgba(231,238,232,.2) 57%, transparent 70%); }
.glow-two { bottom: 20px; left: -230px; width: 520px; height: 520px; background: radial-gradient(circle, rgba(244,228,223,.43), transparent 68%); }
.hero-copy { position: relative; z-index: 3; max-width: 575px; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; color: #92695f; font-size: 10px; font-weight: 700; letter-spacing: 2.1px; text-transform: uppercase; }
.eyebrow > span { display: inline-block; width: 24px; height: 1px; background: currentColor; }
.hero h1, .section-heading h2, .workspace-copy h2, .benefit-copy h2, .cta h2 { margin: 0; font: 600 clamp(48px, 5.3vw, 73px)/1.07 var(--serif); letter-spacing: -2.2px; }
.hero h1 em, .section-heading h2 em, .workspace-copy h2 em, .benefit-copy h2 em, .cta h2 em { color: var(--rose); font-weight: 600; }
.hero-lead { max-width: 530px; margin: 28px 0 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 12px; margin-top: 34px; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 16px; padding: 0 23px; border: 1px solid transparent; border-radius: 13px; font-size: 13px; font-weight: 700; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--green); color: white; box-shadow: 0 12px 25px rgba(48,68,57,.17); }
.button-primary:hover { background: var(--green-dark); box-shadow: 0 15px 30px rgba(48,68,57,.22); }
.button-ghost { border-color: #deddd6; background: rgba(255,255,255,.5); }
.button-ghost:hover { background: white; box-shadow: 0 10px 24px rgba(40,56,47,.06); }
.hero-proof { display: flex; gap: 22px; margin-top: 24px; color: #78817c; font-size: 10px; }
.hero-proof span { display: flex; align-items: center; gap: 7px; }
.hero-proof i { display: grid; width: 17px; height: 17px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 9px; font-style: normal; font-weight: 700; }

.hero-product { position: relative; z-index: 2; width: 690px; justify-self: start; perspective: 1800px; }
.dashboard-window { position: relative; z-index: 2; overflow: hidden; border: 1px solid rgba(216,216,208,.9); border-radius: 20px; background: var(--paper); box-shadow: 0 45px 100px rgba(39,53,46,.18), 0 4px 20px rgba(39,53,46,.08); transform: rotateY(-5deg) rotateX(1deg); transform-origin: left center; }
.window-bar { display: flex; height: 60px; align-items: center; gap: 10px; padding: 0 19px; border-bottom: 1px solid var(--line); }
.mini-brand { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--green); color: white; font: 600 10px var(--serif); }
.window-title { flex: 1; }
.window-title b, .window-title small { display: block; }.window-title b { font: 600 10px var(--serif); }.window-title small { margin-top: 2px; color: var(--muted); font-size: 6px; }
.window-avatar { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 9px; background: var(--rose-soft); color: #9b645a; font-size: 7px; font-weight: 700; }
.dashboard-body { display: grid; min-height: 438px; grid-template-columns: 54px 1fr; }
.mock-sidebar { display: flex; align-items: center; flex-direction: column; gap: 17px; padding-top: 25px; border-right: 1px solid var(--line); background: #fbfaf7; }
.mock-sidebar i { position: relative; width: 17px; height: 17px; border: 1.5px solid #abb2ad; border-radius: 5px; }
.mock-sidebar i.active { background: var(--green); border-color: var(--green); box-shadow: 0 0 0 6px var(--green-soft); }
.mock-sidebar i:nth-child(2) { border-radius: 50%; }.mock-sidebar i:nth-child(4) { border-radius: 50% 50% 5px 5px; }
.mock-content { padding: 25px 25px 22px; background: #f9f8f4; }
.mock-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.mock-heading span small, .mock-heading span b { display: block; }.mock-heading span small { margin-bottom: 3px; color: #9b7065; font-size: 6px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; }.mock-heading span b { font: 600 19px var(--serif); }
.mock-heading > i { padding: 8px 11px; border-radius: 7px; background: var(--green); color: white; font-size: 7px; font-style: normal; font-weight: 700; }
.next-card { position: relative; display: flex; min-height: 104px; align-items: flex-end; justify-content: space-between; overflow: hidden; padding: 18px 21px; border-radius: 13px; background: linear-gradient(120deg, #344a3d, #617565); color: white; }
.next-card:after { position: absolute; top: -55px; right: -30px; width: 160px; height: 160px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; box-shadow: 0 0 0 24px rgba(255,255,255,.03); content: ''; }
.next-card span { position: relative; z-index: 1; }.next-card small, .next-card b, .next-card em { display: block; }.next-card small { margin-bottom: 8px; color: rgba(255,255,255,.72); font-size: 6px; font-weight: 700; letter-spacing: .6px; }.next-card small i { display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #dda89e; }.next-card b { font: 600 17px var(--serif); }.next-card em { margin-top: 3px; color: rgba(255,255,255,.7); font-size: 7px; font-style: normal; }.next-card > strong { position: relative; z-index: 1; font: 600 15px var(--serif); }
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); margin: 11px 0; border: 1px solid var(--line); border-radius: 11px; background: white; }
.metric-row > span { display: flex; align-items: center; gap: 8px; padding: 11px; }.metric-row > span + span { border-left: 1px solid var(--line); }.metric-row > span > i { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; background: var(--green-soft); color: var(--green); font-size: 8px; font-style: normal; font-weight: 700; }.metric-row > span:nth-child(2) > i { background: var(--rose-soft); color: #9c665d; }.metric-row > span:nth-child(3) > i { background: var(--sand-soft); color: #8d7147; }.metric-row small, .metric-row b { display: block; }.metric-row small { color: var(--muted); font-size: 6px; }.metric-row b { margin-top: 2px; color: var(--ink); font-size: 9px; }
.mock-lower { display: grid; grid-template-columns: 1.5fr .8fr; gap: 10px; }
.schedule-card, .activity-card { border: 1px solid var(--line); border-radius: 11px; background: white; }
.schedule-card { padding: 12px; }.card-title { display: flex; align-items: center; justify-content: space-between; padding-bottom: 7px; }.card-title b { font: 600 10px var(--serif); }.card-title small { color: var(--green); font-size: 6px; font-weight: 700; }.schedule-card p { display: grid; min-height: 39px; grid-template-columns: 32px 3px 1fr auto; align-items: center; gap: 8px; margin: 0; border-top: 1px solid var(--line); }.schedule-card time { font-size: 6px; font-weight: 700; }.schedule-card p > i { width: 3px; height: 22px; border-radius: 3px; background: #74917b; }.schedule-card p > i.rose { background: var(--rose); }.schedule-card p > i.sand { background: var(--sand); }.schedule-card p span b, .schedule-card p span small { display: block; }.schedule-card p span b { font-size: 7px; }.schedule-card p span small { margin-top: 2px; color: var(--muted); font-size: 6px; }.schedule-card p em { color: var(--muted); font-size: 5px; font-style: normal; }
.activity-card { padding: 13px; }.activity-card > b { font: 600 10px var(--serif); }.activity-card > small { color: #66806d; font-size: 6px; font-weight: 700; }.bars { display: flex; height: 73px; align-items: flex-end; gap: 5px; margin: 14px 0 8px; border-bottom: 1px solid var(--line); }.bars i { width: 100%; height: var(--h); border-radius: 3px 3px 0 0; background: #dfe8e1; }.bars i:nth-child(5), .bars i:nth-child(7) { background: var(--green); }
.product-orbit { position: absolute; z-index: -1; border: 1px solid rgba(72,96,82,.11); border-radius: 50%; }.orbit-one { top: -90px; right: -55px; width: 430px; height: 430px; }.orbit-two { right: -120px; bottom: -105px; width: 310px; height: 310px; }
.floating-note { position: absolute; z-index: 5; border: 1px solid rgba(225,223,216,.9); background: rgba(255,254,250,.94); box-shadow: 0 18px 45px rgba(39,53,46,.14); backdrop-filter: blur(10px); }
.note-booked { right: -31px; bottom: 53px; display: flex; align-items: center; gap: 10px; padding: 12px 15px; border-radius: 12px; animation: float 5s ease-in-out infinite; }.note-booked > span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 11px; }.note-booked b, .note-booked small { display: block; }.note-booked b { font-size: 9px; }.note-booked small { margin-top: 3px; color: var(--muted); font-size: 6px; }
.note-revenue { top: 76px; left: -40px; min-width: 116px; padding: 13px 15px; border-radius: 12px; animation: float 6s ease-in-out -2s infinite; }.note-revenue small, .note-revenue b { display: block; }.note-revenue small { color: var(--muted); font-size: 7px; }.note-revenue b { margin-top: 3px; font: 600 17px var(--serif); }.note-revenue em { position: absolute; right: 13px; bottom: 15px; color: #557461; font-size: 7px; font-style: normal; font-weight: 700; }
@keyframes float { 50% { transform: translateY(-7px); } }
.scroll-cue { position: absolute; bottom: 32px; left: 50%; display: flex; align-items: center; gap: 10px; color: #8a928d; font-size: 8px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; transform: translateX(-50%); }.scroll-cue span { position: relative; width: 1px; height: 28px; overflow: hidden; background: #dadbd5; }.scroll-cue span:after { position: absolute; top: -10px; left: 0; width: 1px; height: 10px; background: var(--green); animation: scroll 2s infinite; content: ''; } @keyframes scroll { to { transform: translateY(40px); } }

.trust-strip { padding: 27px 30px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,254,250,.6); text-align: center; }.trust-strip p { margin: 0 0 15px; color: #939a95; font-size: 8px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }.trust-strip div { display: flex; align-items: center; justify-content: center; gap: 29px; }.trust-strip span { color: #68736c; font: 600 13px var(--serif); }.trust-strip i { width: 3px; height: 3px; border-radius: 50%; background: var(--rose); }
.section { width: min(1120px, calc(100% - 40px)); margin: auto; padding: 125px 0; }
.section-heading { max-width: 690px; }.section-heading h2, .workspace-copy h2, .benefit-copy h2, .cta h2 { font-size: clamp(38px, 4.4vw, 57px); letter-spacing: -1.5px; }.section-heading > p:last-child { max-width: 540px; margin: 24px 0 0; color: var(--muted); font-size: 15px; line-height: 1.75; }
.feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 55px; }.feature-card { position: relative; min-height: 325px; overflow: hidden; padding: 34px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,254,250,.8); transition: transform .25s, box-shadow .25s, border-color .25s; }.feature-card:after { position: absolute; top: -70px; right: -70px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle, rgba(232,238,232,.85), transparent 70%); content: ''; }.feature-card:hover { border-color: #dadbd3; box-shadow: 0 22px 50px rgba(39,53,46,.08); transform: translateY(-5px); }.feature-icon { position: relative; z-index: 1; display: grid; width: 50px; height: 50px; place-items: center; margin-bottom: 37px; border-radius: 15px; }.feature-icon svg { width: 22px; }.feature-icon.sage { background: var(--green-soft); color: var(--green); }.feature-icon.rose { background: var(--rose-soft); color: #9c6258; }.feature-icon.sand { background: var(--sand-soft); color: #8d7046; }.feature-icon.lilac { background: #ede8f0; color: #795f83; }.feature-card > small { position: absolute; top: 36px; right: 34px; z-index: 1; color: #aeb4af; font: 600 12px var(--serif); }.feature-card h3 { max-width: 390px; margin: 0; font: 600 25px/1.25 var(--serif); }.feature-card p { max-width: 410px; margin: 17px 0 24px; color: var(--muted); font-size: 13px; line-height: 1.65; }.feature-card a, .text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--green); font-size: 11px; font-weight: 700; }.feature-card a span, .text-link span { transition: transform .2s; }.feature-card a:hover span, .text-link:hover span { transform: translateX(4px); }

.workspace { overflow: hidden; background: var(--green-dark); color: white; }.workspace-inner { display: grid; min-height: 720px; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 75px; }.eyebrow.light { color: #d6aa9f; }.workspace-copy h2 { color: white; }.workspace-copy h2 em, .cta h2 em { color: #dda99d; }.workspace-copy > p:not(.eyebrow) { margin: 25px 0 32px; color: rgba(255,255,255,.64); font-size: 14px; line-height: 1.75; }.workspace-copy ul { margin: 0 0 30px; padding: 0; list-style: none; }.workspace-copy li { display: flex; align-items: center; gap: 13px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.09); }.workspace-copy li > span { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: rgba(255,255,255,.1); color: #e0afa4; font-size: 9px; }.workspace-copy li b, .workspace-copy li small { display: block; }.workspace-copy li b { font-size: 11px; }.workspace-copy li small { margin-top: 3px; color: rgba(255,255,255,.48); font-size: 9px; }.text-link.light { color: white; }
.calendar-mock { position: relative; width: 720px; overflow: visible; padding: 25px 24px 0; border-radius: 19px; background: #fffefa; color: var(--ink); box-shadow: 0 35px 75px rgba(11,22,16,.3); transform: rotate(1deg); }.calendar-top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 20px; }.calendar-top span small, .calendar-top span b { display: block; }.calendar-top small { color: #9b7065; font-size: 7px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }.calendar-top b { margin-top: 4px; font: 600 17px var(--serif); }.calendar-top > i { padding: 7px 16px; border: 1px solid var(--line); border-radius: 8px; font-size: 7px; font-style: normal; font-weight: 700; }.calendar-days { display: grid; grid-template-columns: 45px repeat(5, 1fr); padding-left: 45px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.calendar-days span { display: grid; min-height: 56px; place-items: center; align-content: center; gap: 4px; border-left: 1px solid var(--line); }.calendar-days small { color: var(--muted); font-size: 6px; font-weight: 700; }.calendar-days b { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; font-size: 9px; }.calendar-days .today b { background: var(--green); color: white; }.calendar-grid { position: relative; display: grid; height: 385px; grid-template-columns: 45px repeat(5, 1fr); overflow: hidden; }.times { display: grid; grid-template-rows: repeat(7, 55px); }.times span { padding-top: 8px; color: #a3aaa5; font-size: 6px; }.day-lines { border-left: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent 0, transparent 54px, var(--line) 55px); }.booking { position: absolute; width: 103px; padding: 8px 9px; border-left: 3px solid #738f79; border-radius: 7px; background: #e5ede6; }.booking b, .booking small { display: block; white-space: nowrap; }.booking b { font-size: 7px; }.booking small { margin-top: 3px; color: var(--muted); font-size: 6px; }.booking-one { top: 39px; left: 53px; height: 66px; }.booking-two { top: 82px; left: 166px; height: 96px; border-color: var(--rose); background: var(--rose-soft); }.booking-three { top: 191px; left: 394px; height: 68px; border-color: var(--sand); background: var(--sand-soft); }.booking-four { top: 249px; left: 508px; height: 84px; border-color: #907b9a; background: #eee9f0; }.calendar-float { position: absolute; right: -23px; bottom: 32px; display: flex; align-items: center; gap: 12px; min-width: 205px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: 0 18px 40px rgba(20,33,26,.17); }.calendar-float > span { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px; background: var(--rose-soft); color: #955f56; font: 600 17px var(--serif); }.calendar-float small, .calendar-float b { display: block; }.calendar-float small { color: var(--muted); font-size: 7px; }.calendar-float b { margin-top: 3px; font-size: 8px; }

.benefits { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 100px; }.benefit-visual { position: relative; min-height: 490px; border-radius: 34% 66% 55% 45% / 45% 35% 65% 55%; background: linear-gradient(145deg, var(--rose-soft), #f6eee6); }.client-card, .preference-card, .visit-card { position: absolute; border: 1px solid var(--line); background: rgba(255,254,250,.96); box-shadow: 0 24px 55px rgba(52,57,52,.11); }.client-main { top: 74px; left: 35px; display: grid; width: 430px; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; padding: 23px; border-radius: 17px; }.client-avatar { display: grid; width: 53px; height: 53px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font: 600 15px var(--serif); }.client-card small { color: #9b7065; font-size: 6px; font-weight: 700; letter-spacing: 1px; }.client-card h3 { margin: 5px 0 3px; font: 600 18px var(--serif); }.client-card p { margin: 0; color: var(--muted); font-size: 7px; }.client-card em { align-self: start; padding: 5px 8px; border-radius: 10px; background: var(--green-soft); color: var(--green); font-size: 6px; font-style: normal; font-weight: 700; }.preference-card { top: 187px; right: 8px; width: 325px; padding: 21px; border-radius: 16px; }.preference-card > small { color: #9b7065; font-size: 7px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; }.preference-card p { margin: 10px 0 15px; color: var(--muted); font: 600 13px/1.5 var(--serif); }.preference-card div { display: flex; gap: 6px; }.preference-card span { padding: 5px 8px; border-radius: 12px; background: var(--sand-soft); color: #826943; font-size: 6px; font-weight: 700; }.visit-card { bottom: 62px; left: 58px; display: flex; align-items: center; gap: 12px; padding: 15px 19px; border-radius: 14px; }.visit-card > span { font: 600 29px var(--serif); }.visit-card small, .visit-card b { display: block; }.visit-card small { color: var(--muted); font-size: 7px; }.visit-card b { margin-top: 3px; font-size: 8px; }.visual-flower { position: absolute; right: 32px; bottom: 42px; color: rgba(187,119,106,.2); font-size: 72px; }.benefit-copy > p:not(.eyebrow) { margin: 25px 0 35px; color: var(--muted); font-size: 15px; line-height: 1.8; }.benefit-stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.benefit-stats span { padding: 21px 0; }.benefit-stats span + span { padding-left: 25px; border-left: 1px solid var(--line); }.benefit-stats b, .benefit-stats small { display: block; }.benefit-stats b { font: 600 18px var(--serif); }.benefit-stats small { margin-top: 5px; color: var(--muted); font-size: 8px; }

.process { padding-top: 85px; }.section-heading.centered { margin: auto; text-align: center; }.section-heading.centered .eyebrow { justify-content: center; }.section-heading.centered > p:last-child { margin-right: auto; margin-left: auto; }.steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 70px; margin-top: 65px; }.steps:before { position: absolute; top: 51px; right: 15%; left: 15%; border-top: 1px dashed #cfd3cd; content: ''; }.steps article { position: relative; text-align: center; }.steps article > span { position: absolute; top: 7px; left: calc(50% + 34px); color: #a7ada9; font: 600 9px var(--serif); }.steps i { position: relative; display: grid; width: 72px; height: 72px; place-items: center; margin: 15px auto 24px; border: 8px solid var(--canvas); border-radius: 50%; background: var(--green-soft); color: var(--green); font-style: normal; box-shadow: 0 0 0 1px #dce3dd; }.steps article:nth-child(2) i { background: var(--rose-soft); color: #9b6258; box-shadow: 0 0 0 1px #ead6d1; }.steps article:nth-child(3) i { background: var(--sand-soft); color: #8a6b41; box-shadow: 0 0 0 1px #e8ddca; }.steps svg { width: 23px; }.steps h3 { margin: 0 0 12px; font: 600 20px var(--serif); }.steps p { max-width: 250px; margin: auto; color: var(--muted); font-size: 12px; line-height: 1.65; }

.cta { position: relative; display: grid; min-height: 530px; place-items: center; overflow: hidden; margin: 30px 22px 0; border-radius: 27px; background: linear-gradient(125deg, #30463a, #4b6655); color: white; text-align: center; }.cta:before, .cta:after { position: absolute; width: 470px; height: 470px; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; content: ''; box-shadow: 0 0 0 55px rgba(255,255,255,.02), 0 0 0 110px rgba(255,255,255,.015); }.cta:before { top: -340px; left: -80px; }.cta:after { right: -200px; bottom: -360px; }.cta-inner { position: relative; z-index: 2; padding: 70px 20px; }.cta .eyebrow { justify-content: center; }.cta h2 { color: white; }.cta-inner > p:not(.eyebrow) { margin: 25px auto 0; color: rgba(255,255,255,.64); font-size: 14px; }.centered-actions { justify-content: center; }.button-light { background: white; color: var(--green-dark); }.button-outline { border-color: rgba(255,255,255,.23); color: white; }.button-outline:hover { background: rgba(255,255,255,.07); }.cta-flower { position: absolute; color: rgba(255,255,255,.035); font-size: 180px; }.flower-left { bottom: -35px; left: 6%; }.flower-right { top: -35px; right: 7%; }
.footer { width: min(1120px, calc(100% - 40px)); margin: auto; padding: 70px 0 28px; }.footer-main { display: grid; grid-template-columns: .9fr 1.1fr 1fr; gap: 60px; align-items: start; }.footer-brand { align-self: start; }.footer-main > p { max-width: 340px; margin: 2px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }.footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }.footer-links div { display: grid; gap: 10px; }.footer-links b { margin-bottom: 6px; font: 600 14px var(--serif); }.footer-links a { color: var(--muted); font-size: 10px; }.footer-links a:hover { color: var(--green); }.footer-bottom { display: flex; justify-content: space-between; margin-top: 55px; padding-top: 22px; border-top: 1px solid var(--line); color: #919894; font-size: 8px; letter-spacing: .3px; }

.reveal { opacity: 0; transform: translateY(25px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }.reveal[data-delay="1"] { transition-delay: .12s; }.reveal[data-delay="2"] { transition-delay: .22s; }.reveal[data-delay="3"] { transition-delay: .32s; }.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 1100px) {
    .hero { min-height: 760px; grid-template-columns: .85fr 1.15fr; gap: 30px; padding-right: 24px; padding-left: 35px; }
    .hero-product { width: 610px; }
    .workspace-inner { gap: 45px; }.calendar-mock { width: 650px; }
    .benefits { gap: 50px; }.client-main { width: 390px; }
}

@media (max-width: 900px) {
    .site-nav { position: fixed; top: 69px; right: 15px; left: 15px; display: grid; gap: 3px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,254,250,.98); box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translateY(-12px); transition: opacity .2s, transform .2s; }.site-nav.open { opacity: 1; pointer-events: auto; transform: none; }.site-nav > a { padding: 13px 12px; border-radius: 9px; }.site-nav .nav-demo { margin-top: 5px; }.menu-toggle { display: flex; }
    .hero { min-height: 1100px; grid-template-columns: 1fr; align-content: center; gap: 75px; padding: 130px 30px 100px; text-align: center; }.hero-copy { margin: auto; }.hero .eyebrow, .hero-actions, .hero-proof { justify-content: center; }.hero-product { width: min(690px, 90vw); justify-self: center; text-align: left; }.dashboard-window { transform: rotateY(0) rotateX(0); }.scroll-cue { display: none; }
    .workspace-inner { grid-template-columns: 1fr; gap: 60px; }.workspace-copy { max-width: 560px; }.calendar-mock { width: 100%; }
    .benefits { grid-template-columns: 1fr; gap: 65px; }.benefit-visual { width: min(560px, 100%); margin: auto; }.benefit-copy { max-width: 630px; }
    .footer-main { grid-template-columns: 1fr 1fr; }.footer-links { grid-column: 1 / -1; }
}

@media (max-width: 650px) {
    .nav-shell, .section, .footer { width: min(100% - 30px, 1120px); }.site-header { height: 70px; }.brand small { display: none; }
    .hero { min-height: auto; gap: 55px; padding: 112px 20px 80px; }.hero h1 { font-size: clamp(41px, 12vw, 57px); letter-spacing: -1.5px; }.hero h1 br { display: none; }.hero-lead { font-size: 15px; }.hero-actions { align-items: stretch; flex-direction: column; }.button { width: 100%; }.hero-proof { align-items: center; flex-direction: column; gap: 9px; }
    .hero-product { width: 720px; margin-right: -260px; transform: scale(.72); transform-origin: left center; }.hero-product-wrap { height: 380px; }.note-revenue { left: 0; }.note-booked { right: 20px; }
    .trust-strip div { flex-wrap: wrap; gap: 13px 20px; }.trust-strip span { font-size: 11px; }
    .section { padding: 85px 0; }.section-heading h2, .workspace-copy h2, .benefit-copy h2, .cta h2 { font-size: 39px; }.section-heading h2 br, .workspace-copy h2 br, .benefit-copy h2 br, .cta h2 br { display: none; }
    .feature-grid { grid-template-columns: 1fr; margin-top: 38px; }.feature-card { min-height: 300px; padding: 27px; }.feature-card > small { top: 29px; right: 27px; }
    .workspace-inner { min-height: auto; padding-top: 85px; padding-bottom: 85px; }.calendar-mock { width: 700px; transform: scale(.7); transform-origin: left top; }.calendar-mock:after { display: block; height: 310px; content: ''; }.calendar-float { right: 10px; }
    .benefit-visual { min-height: 420px; }.client-main { top: 55px; left: 2%; width: 96%; }.preference-card { top: 175px; right: 0; width: 88%; }.visit-card { bottom: 45px; left: 4%; }.visual-flower { display: none; }.benefit-stats { gap: 0; }
    .process { padding-top: 45px; }.steps { grid-template-columns: 1fr; gap: 35px; }.steps:before { display: none; }.steps p { max-width: 300px; }
    .cta { min-height: 520px; margin: 15px 10px 0; border-radius: 20px; }.cta-inner { padding-right: 23px; padding-left: 23px; }.centered-actions { flex-direction: column; }
    .footer { padding-top: 55px; }.footer-main { grid-template-columns: 1fr; gap: 27px; }.footer-links { grid-column: auto; }.footer-bottom { align-items: flex-start; flex-direction: column; gap: 8px; }
}

@media (max-width: 390px) { .hero-product { margin-right: -290px; transform: scale(.66); }.benefit-visual { min-height: 440px; }.preference-card { width: 94%; }.benefit-stats { grid-template-columns: 1fr; }.benefit-stats span + span { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *:before, *:after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }.reveal { opacity: 1; transform: none; } }
