:root {
  --forest-950: #062f29;
  --forest-900: #0b4036;
  --forest-800: #0d4b3e;
  --forest-700: #10634f;
  --forest-600: #17785f;
  --ink: #18352e;
  --muted: #66786f;
  --cream: #fbf8ef;
  --paper: #fffdf7;
  --canvas: #eee8da;
  --line: #dcd5c6;
  --gold: #f1b94b;
  --gold-deep: #b97b17;
  --coral: #d95b50;
  --blue: #4c91b6;
  --rose: #c54c7d;
  --green: #2aa76c;
  --violet: #7564ac;
  --shadow: 0 24px 70px rgba(9, 47, 39, .17);
  --display: Georgia, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; overflow-x: hidden; background: var(--cream); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
body::selection { background: rgba(241, 185, 75, .5); color: var(--forest-950); }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 1000; padding: 10px 14px; border-radius: 8px; background: white; color: var(--forest-900); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.section-shell { width: min(1180px, calc(100% - 44px)); margin-inline: auto; }

.site-header { position: absolute; inset: 0 0 auto; z-index: 100; color: white; }
.nav-wrap { width: min(1240px, calc(100% - 40px)); min-height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-inline: auto; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; font: 700 22px/1 var(--display); text-decoration: none; white-space: nowrap; }
.brand img { width: 46px; height: 46px; border-radius: 50%; box-shadow: 0 3px 14px rgba(0,0,0,.18); }
.site-menu { display: flex; align-items: center; gap: 28px; }
.site-menu > a { position: relative; color: rgba(255,255,255,.82); font-size: 14px; font-weight: 700; text-decoration: none; }
.site-menu > a:not(.nav-cta)::after { content: ""; position: absolute; inset: auto 0 -7px; height: 2px; border-radius: 9px; background: var(--gold); transform: scaleX(0); transition: transform .2s ease; }
.site-menu > a:hover, .site-menu > a:focus-visible { color: white; }
.site-menu > a:hover::after, .site-menu > a:focus-visible::after { transform: scaleX(1); }
.site-menu .nav-cta { min-height: 42px; display: inline-flex; align-items: center; gap: 9px; padding: 0 17px; border: 1px solid rgba(255,255,255,.28); border-radius: 99px; background: rgba(255,255,255,.08); color: white; }
.site-menu .nav-cta:hover { background: white; color: var(--forest-900); }
.menu-button { width: 46px; height: 46px; display: none; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(255,255,255,.08); color: white; }
.menu-lines { width: 20px; display: grid; gap: 4px; }
.menu-lines i { width: 100%; height: 2px; display: block; border-radius: 5px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }

.hero { position: relative; min-height: 840px; overflow: hidden; padding: 150px 0 100px; background: var(--forest-900); color: white; }
.hero::before { content: ""; position: absolute; width: 680px; height: 680px; top: -270px; right: -150px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 100px rgba(255,255,255,.025), 0 0 0 200px rgba(255,255,255,.018); }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, rgba(2,34,28,.4), transparent 48%), radial-gradient(circle at 10% 80%, rgba(241,185,75,.08), transparent 28%); }
.hero-texture { position: absolute; inset: 0; opacity: .24; background-image: repeating-linear-gradient(4deg, transparent 0 3px, rgba(255,255,255,.018) 4px 5px); }
.hero-inner { position: relative; z-index: 2; width: min(1240px, calc(100% - 44px)); display: grid; grid-template-columns: minmax(0, .82fr) minmax(580px, 1.18fr); align-items: center; gap: 64px; margin-inline: auto; }
.hero-copy { padding-bottom: 28px; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; color: #f5ca76; font-size: 12px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow > span { width: 30px; height: 2px; background: currentColor; }
.eyebrow.dark { color: var(--forest-700); }
.eyebrow.light { color: #f2c568; }
.hero h1 { max-width: 650px; margin: 0; font: 700 clamp(48px, 5.2vw, 76px)/.99 var(--display); letter-spacing: -.045em; text-wrap: balance; }
.hero h1 em { color: var(--gold); font-weight: 700; }
.hero-lede { max-width: 620px; margin: 28px 0 0; color: rgba(255,255,255,.76); font-size: 18px; line-height: 1.72; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 26px; margin-top: 34px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; border: 0; border-radius: 10px; padding: 0 22px; font-size: 15px; font-weight: 850; text-decoration: none; box-shadow: 0 12px 28px rgba(0,0,0,.14); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0,0,0,.2); }
.button-gold { background: var(--gold); color: #293c31; }
.button-gold:hover { background: #f6c65f; }
.button-forest { background: var(--forest-800); color: white; }
.text-link { display: inline-flex; align-items: center; gap: 8px; color: white; font-size: 14px; font-weight: 800; text-underline-offset: 5px; text-decoration-color: rgba(255,255,255,.35); }
.trust-list { display: flex; flex-wrap: wrap; gap: 11px 22px; margin: 31px 0 0; padding: 0; color: rgba(255,255,255,.66); font-size: 13px; list-style: none; }
.trust-list li { display: flex; align-items: center; gap: 7px; }
.trust-list span { width: 20px; height: 20px; display: inline-grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: var(--gold); font-size: 10px; }

.hero-product { position: relative; padding-top: 35px; filter: drop-shadow(0 35px 50px rgba(0,0,0,.24)); transform: rotate(1.1deg); }
.hero-tabs { position: absolute; z-index: 0; inset: 0 20px auto 35px; height: 58px; display: flex; align-items: start; gap: 7px; padding-left: 24px; }
.hero-tabs span { min-width: 90px; height: 58px; display: flex; align-items: center; justify-content: center; border-radius: 10px 10px 0 0; padding: 0 13px 12px; color: white; font: 700 12px var(--display); }
.tab-blue { background: var(--blue); }.tab-coral { background: var(--coral); }.tab-green { background: var(--green); }.tab-rose { background: var(--rose); }.tab-gold { background: #c9932e; }
.app-frame { position: relative; z-index: 1; overflow: hidden; border: 1px solid rgba(255,255,255,.35); border-radius: 16px; background: #f7f3e9; box-shadow: var(--shadow); }
.app-titlebar { height: 71px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; background: #105243; color: white; }
.mini-brand { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-size: 18px; }
.mini-brand img { width: 37px; height: 37px; border-radius: 50%; }
.app-tools { display: flex; gap: 8px; }
.app-tools span { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 10px; font-size: 18px; }
.app-body-preview { min-height: 410px; display: grid; grid-template-columns: 124px 1fr; }
.preview-sidebar { display: flex; flex-direction: column; align-items: stretch; gap: 17px; padding: 25px 17px 20px; border-right: 1px solid #ddd8cb; background: #ebe5d8; }
.mini-date { display: grid; place-items: center; padding: 10px; border: 1px solid #d7d0c1; border-radius: 12px; background: rgba(255,255,255,.6); color: var(--forest-800); }
.mini-date span { font-size: 9px; font-weight: 900; letter-spacing: .13em; }.mini-date strong { font: 700 34px/1 var(--display); }.mini-date small { font-size: 9px; }
.side-line { height: 7px; border-radius: 20px; background: rgba(13,75,62,.12); }.side-line.active { background: rgba(13,75,62,.55); }.side-line.short { width: 64%; }
.local-pill { margin-top: auto; color: #688078; font-size: 8px; font-weight: 800; white-space: nowrap; }
.local-pill::first-letter { color: var(--green); }
.preview-page { padding: 30px 31px; background-color: #fffdf7; background-image: linear-gradient(rgba(15,65,54,.025) 1px, transparent 1px); background-size: 100% 31px; }
.preview-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.preview-heading small, .paper-card small { color: #73817a; font-size: 8px; font-weight: 900; letter-spacing: .11em; }
.preview-heading h2 { margin: 2px 0 0; color: var(--forest-900); font: 700 25px var(--display); }
.weather-mark { color: var(--gold-deep); font-size: 30px; }
.today-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 13px; }
.paper-card { border: 1px solid #ded9ce; border-radius: 12px; background: rgba(255,255,255,.91); box-shadow: 0 6px 18px rgba(21,52,43,.06); }
.agenda-card { padding: 15px 16px; }
.agenda-card header { display: flex; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px solid #ece7dd; color: var(--forest-900); font: 700 13px var(--display); }
.agenda-card header b { color: #829087; font: 700 8px var(--sans); }
.agenda-item { display: grid; grid-template-columns: 42px 1fr; gap: 9px; padding: 12px 0; border-bottom: 1px solid #efebe2; }
.agenda-item:last-child { border-bottom: 0; }.agenda-item time { color: #9a792f; font-size: 9px; font-weight: 800; }.agenda-item strong, .agenda-item small { display: block; }.agenda-item strong { color: #314c42; font-size: 10px; }.agenda-item small { color: #87928c; font-size: 8px; }
.preview-stack { display: grid; gap: 10px; }
.focus-card-preview { padding: 14px; }.focus-card-preview strong { display: block; margin: 3px 0 10px; color: #344a41; font: 700 12px var(--display); }.focus-card-preview > span { color: #85918a; font-size: 8px; }
.progress { height: 5px; overflow: hidden; margin: 8px 0 7px; border-radius: 99px; background: #e8e5dc; }.progress i { width: 68%; height: 100%; display: block; border-radius: inherit; background: var(--gold); }
.grocery-card-preview, .birthday-card-preview { min-height: 69px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; }
.grocery-card-preview strong, .birthday-card-preview strong { display: block; color: #344a41; font: 700 11px var(--display); }.grocery-card-preview > span { padding: 4px 7px; border-radius: 99px; background: #e7f3eb; color: var(--forest-700); font-size: 8px; font-weight: 900; }.birthday-card-preview > span { color: var(--gold-deep); }.birthday-card-preview > b { color: var(--rose); font-size: 9px; }
.hero-note { position: absolute; z-index: 4; right: -23px; bottom: -41px; width: 172px; min-height: 128px; padding: 21px 20px; background: #f7da77; color: #57471f; box-shadow: 0 18px 35px rgba(0,0,0,.24); transform: rotate(-5deg); }
.hero-note::before { content: ""; position: absolute; top: -6px; left: 58px; width: 55px; height: 16px; background: rgba(255,255,255,.38); transform: rotate(3deg); }
.hero-note span, .hero-note strong { display: block; }.hero-note span { font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }.hero-note strong { margin-top: 7px; font: 700 16px/1.25 var(--display); }.hero-note i { width: 35px; height: 2px; display: block; margin-top: 14px; background: #a68532; }
.hero-ribbon { position: absolute; z-index: 3; inset: auto 0 0; height: 9px; display: grid; grid-template-columns: 1.3fr .9fr 1.1fr .8fr 1.2fr; }.hero-ribbon span:nth-child(1) { background: var(--blue); }.hero-ribbon span:nth-child(2) { background: var(--coral); }.hero-ribbon span:nth-child(3) { background: var(--green); }.hero-ribbon span:nth-child(4) { background: var(--rose); }.hero-ribbon span:nth-child(5) { background: var(--gold); }

.welcome-strip { min-height: 86px; display: flex; align-items: center; justify-content: center; gap: clamp(20px, 4vw, 58px); border-bottom: 1px solid var(--line); background: #fffcf4; color: #718078; font-size: 12px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.welcome-strip p { margin: 0; }.welcome-strip span { color: var(--gold-deep); font-size: 8px; }

.organize-section { padding: 128px 0 140px; }
.section-intro { max-width: 790px; margin-bottom: 58px; }
.section-intro h2, .tour-copy h2, .privacy-copy h2, .device-copy h2, .closing-inner h2 { margin: 0; font: 700 clamp(40px, 4.4vw, 61px)/1.04 var(--display); letter-spacing: -.035em; text-wrap: balance; }
.section-intro > p:last-child { max-width: 690px; margin: 23px 0 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.feature-card { position: relative; min-height: 410px; overflow: hidden; padding: 40px 42px 38px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: 0 12px 34px rgba(25,58,47,.055); transition: transform .25s ease, box-shadow .25s ease; }
.feature-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 7px; background: var(--accent); }
.feature-card:hover { transform: translateY(-5px); box-shadow: 0 20px 48px rgba(25,58,47,.1); }
.feature-calendar { --accent: var(--blue); }.feature-tasks { --accent: var(--coral); }.feature-people { --accent: var(--green); }.feature-notes { --accent: var(--gold); }
.feature-number { position: absolute; top: 31px; right: 34px; color: #b4aea0; font: 700 13px var(--display); }
.feature-icon { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 27px; border-radius: 15px; background: color-mix(in srgb, var(--accent) 14%, white); color: var(--accent); font: 800 16px var(--sans); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent); }
.check-icon { font-size: 27px; }.people-icon { border-radius: 50%; }.note-icon { font: 700 28px/1 var(--display); }
.feature-card h3 { margin: 0; color: var(--forest-900); font: 700 27px/1.15 var(--display); }
.feature-card > p { max-width: 490px; margin: 15px 0 23px; color: var(--muted); line-height: 1.7; }
.feature-card ul { display: grid; gap: 8px; margin: 0; padding: 0; color: #52665c; font-size: 14px; list-style: none; }
.feature-card li { display: flex; align-items: center; gap: 9px; }.feature-card li::before { content: ""; width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); }

.tour-section { overflow: hidden; padding: 122px 0 145px; background: var(--canvas); }
.tour-copy { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(290px, .7fr); align-items: end; gap: 70px; margin-bottom: 55px; }
.tour-copy > p { margin: 0 0 7px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.demo-wrap { position: relative; }
.binder-rings { position: absolute; z-index: 5; inset: 100px auto 55px -16px; width: 46px; display: flex; flex-direction: column; justify-content: space-around; }
.binder-rings i { position: relative; width: 46px; height: 15px; border: 3px solid #8b8275; border-radius: 99px; background: linear-gradient(#ddd7ca,#91887a 55%,#e9e3d7); box-shadow: 0 2px 4px rgba(0,0,0,.15); }
.binder-rings i::after { content: ""; position: absolute; right: -8px; top: 2px; width: 12px; height: 5px; border-radius: 50%; background: #6f685d; }
.demo-tabs { min-height: 62px; display: flex; align-items: end; gap: 7px; padding-left: 44px; overflow-x: auto; scrollbar-width: none; }
.demo-tabs::-webkit-scrollbar { display: none; }
.demo-tab { min-width: 125px; height: 54px; flex: 0 0 auto; border: 0; border-radius: 14px 14px 0 0; padding: 0 18px 7px; color: white; font: 700 15px var(--display); cursor: pointer; opacity: .82; transition: height .18s ease, opacity .18s ease; }
.demo-tab:hover, .demo-tab:focus-visible, .demo-tab.active { height: 62px; opacity: 1; }.demo-tab.today { background: var(--forest-700); }.demo-tab.calendar { background: var(--blue); }.demo-tab.tasks { background: var(--coral); }.demo-tab.contacts { background: var(--green); }.demo-tab.groceries { background: #c88f2b; }
.demo-book { position: relative; z-index: 2; min-height: 560px; overflow: hidden; border: 1px solid #d4ccbd; border-top: 7px solid var(--forest-700); border-radius: 5px 21px 21px 8px; background: var(--paper); box-shadow: 0 28px 65px rgba(43,54,48,.16); }
.demo-brandbar { min-height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 34px 0 49px; border-bottom: 1px solid #e5dfd3; background: #faf6ec; }
.demo-brandbar > div { display: flex; align-items: center; gap: 10px; color: var(--forest-900); font: 700 18px var(--display); }.demo-brandbar img { width: 38px; height: 38px; border-radius: 50%; }.demo-brandbar > span { display: flex; align-items: center; gap: 7px; color: #75847c; font-size: 12px; font-weight: 800; }.demo-brandbar > span i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(42,167,108,.11); }
.demo-panel { min-height: 480px; padding: 42px 52px 52px; background-color: #fffdf7; background-image: linear-gradient(rgba(15,65,54,.025) 1px, transparent 1px); background-size: 100% 32px; }
.panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 35px; padding-bottom: 24px; border-bottom: 1px solid #e6e0d5; }.panel-heading small { color: var(--forest-700); font-size: 11px; font-weight: 900; letter-spacing: .13em; }.panel-heading h3 { margin: 4px 0 0; color: var(--forest-900); font: 700 32px/1.1 var(--display); }.panel-action { min-height: 43px; display: inline-flex; align-items: center; border-radius: 9px; padding: 0 15px; background: var(--forest-700); color: white; font-size: 13px; font-weight: 800; white-space: nowrap; }
.panel-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 22px; }.timeline-list { overflow: hidden; border: 1px solid #ddd8cd; border-radius: 12px; background: rgba(255,255,255,.86); }.timeline-list article { min-height: 83px; display: grid; grid-template-columns: 64px 12px 1fr; align-items: center; gap: 13px; padding: 12px 22px; border-bottom: 1px solid #ebe6dc; }.timeline-list article:last-child { border-bottom: 0; }.timeline-list time { color: #8b7546; font-size: 13px; font-weight: 800; }.dot { width: 9px; height: 9px; display: block; border-radius: 50%; background: var(--green); }.dot.blue { background: var(--blue); }.dot.gold { background: var(--gold-deep); }.dot.rose { background: var(--rose); }.timeline-list strong, .timeline-list span { display: block; }.timeline-list strong { color: #324d42; font-size: 15px; }.timeline-list span { margin-top: 2px; color: #819088; font-size: 13px; }
.day-summary { min-height: 260px; padding: 30px; border: 1px solid #dfd5c1; border-radius: 13px; background: #fbf4df; }.day-summary > small { color: #9d792e; font-size: 10px; font-weight: 900; letter-spacing: .13em; }.day-summary h4 { margin: 9px 0 8px; color: #3f4a3e; font: 700 25px/1.15 var(--display); }.day-summary p { margin: 0; color: #77796c; font-size: 14px; }.progress.wide { height: 8px; margin: 28px 0 10px; }.day-summary > span { color: #8a8170; font-size: 12px; font-weight: 800; }
.view-switch { display: flex; overflow: hidden; border: 1px solid #d7d1c7; border-radius: 8px; }.view-switch span { padding: 7px 11px; border-right: 1px solid #ddd7cd; color: #65766d; font-size: 12px; font-weight: 800; }.view-switch span:first-child { background: var(--forest-700); color: white; }.view-switch span:last-child { border: 0; }
.calendar-demo { overflow: hidden; border: 1px solid #ded8cc; border-radius: 12px; background: rgba(255,255,255,.9); }.weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7,1fr); }.weekdays span { padding: 11px 5px; border-right: 1px solid #e7e1d6; background: #f2eee4; color: #74827a; font-size: 11px; font-weight: 900; text-align: center; text-transform: uppercase; }.calendar-days > span { position: relative; min-height: 65px; padding: 9px; border-top: 1px solid #e8e3d8; border-right: 1px solid #e8e3d8; color: #485e53; font-size: 12px; }.calendar-days .faded { color: #bbb8af; background: #faf8f2; }.calendar-days .current { background: #fff7dc; box-shadow: inset 0 0 0 2px var(--gold); font-weight: 900; }.event-bar { position: absolute; inset: 32px 7px auto; height: 6px; border-radius: 4px; background: var(--green); }.event-bar.blue { background: var(--blue); }.event-bar.gold { background: var(--gold); }.event-bar.rose { background: var(--rose); }.event-bar.green { background: var(--green); }
.task-demo { overflow: hidden; border: 1px solid #ded8cc; border-radius: 12px; background: rgba(255,255,255,.9); }.demo-check { width: 100%; min-height: 76px; display: grid; grid-template-columns: 27px minmax(0,1fr) auto; align-items: center; gap: 14px; border: 0; border-bottom: 1px solid #e9e4da; padding: 12px 20px; background: transparent; color: inherit; text-align: left; cursor: pointer; }.demo-check:last-child { border-bottom: 0; }.demo-check:hover { background: #f8faf7; }.demo-check > i { width: 23px; height: 23px; display: grid; place-items: center; border: 2px solid #91a197; border-radius: 7px; }.demo-check[aria-pressed="true"] > i { border-color: var(--forest-700); background: var(--forest-700); }.demo-check[aria-pressed="true"] > i::after { content: "✓"; color: white; font-size: 13px; font-style: normal; }.demo-check span, .demo-check strong, .demo-check small { display: block; }.demo-check strong { color: #314b40; font-size: 15px; }.demo-check small { margin-top: 3px; color: #839088; font-size: 12px; }.demo-check > b { border-radius: 99px; padding: 4px 9px; background: #edf3ef; color: #587064; font-size: 11px; }.demo-check.done strong { color: #929a95; text-decoration: line-through; }
.contact-demo { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }.contact-demo article { min-height: 225px; display: grid; grid-template-columns: 48px minmax(0,1fr); align-content: start; gap: 14px; padding: 22px; border: 1px solid #ded9ce; border-radius: 13px; background: rgba(255,255,255,.92); }.avatar { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #dcefe5; color: var(--forest-700); font-weight: 900; }.avatar.gold { background: #faedc9; color: #916721; }.avatar.rose { background: #f5e0e8; color: #9c3f67; }.contact-demo h4 { margin: 1px 0 6px; color: #304b40; font: 700 19px/1.15 var(--display); }.contact-demo .contact-link { display: block; margin-top: 0; color: var(--forest-700); font-size: 12px; font-weight: 800; overflow-wrap: anywhere; text-decoration: none; }.contact-demo small { display: block; margin-top: 12px; color: #887549; font-size: 12px; line-height: 1.45; }.contact-demo div > span:not(.contact-link) { display: block; margin-top: 17px; color: var(--forest-700); font-size: 11px; font-weight: 850; text-decoration: underline dotted; text-underline-offset: 4px; }
.grocery-demo { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }.grocery-demo article { overflow: hidden; border: 1px solid #ded8cc; border-radius: 13px; background: rgba(255,255,255,.9); }.grocery-demo article > header { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid #e9e3d9; background: #f2f7f3; }.grocery-demo header > span { color: var(--green); }.grocery-demo h4 { margin: 0; color: #324e42; font: 700 18px var(--display); }.grocery-demo header small { color: #7d8b83; font-size: 11px; }.grocery-demo .demo-check { min-height: 78px; grid-template-columns: 25px 1fr; }.grocery-demo .demo-check > b { display: none; }

.privacy-section { position: relative; overflow: hidden; padding: 145px 0; background: var(--forest-950); color: white; }.privacy-section::before { content: ""; position: absolute; inset: 0; opacity: .2; background-image: repeating-linear-gradient(4deg, transparent 0 3px, rgba(255,255,255,.02) 4px 5px); }.privacy-inner { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 110px; }.privacy-art { position: relative; min-height: 480px; display: grid; place-items: center; }.privacy-icon { position: relative; z-index: 2; width: min(320px, 72%); border-radius: 50%; box-shadow: 0 35px 80px rgba(0,0,0,.3); }.privacy-orbit { position: absolute; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }.privacy-orbit.one { width: 430px; height: 430px; }.privacy-orbit.two { width: 560px; height: 560px; }.privacy-orbit::before, .privacy-orbit::after { content: ""; position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 7px rgba(241,185,75,.1); }.privacy-orbit.one::before { top: 38px; left: 70px; }.privacy-orbit.one::after { right: 20px; bottom: 110px; background: var(--green); }.privacy-orbit.two::before { top: 55%; left: -5px; background: var(--blue); }.privacy-orbit.two::after { top: 15%; right: 50px; background: var(--rose); }
.privacy-seal { position: absolute; z-index: 3; right: 4%; bottom: 47px; width: 112px; height: 112px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: #f3bf52; color: #193b32; box-shadow: 0 15px 30px rgba(0,0,0,.22); transform: rotate(7deg); }.privacy-seal > span { font-size: 19px; }.privacy-seal strong { font: 700 18px var(--display); }.privacy-seal small { font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.privacy-copy h2 { max-width: 740px; }.privacy-copy > p:not(.eyebrow) { max-width: 680px; margin: 27px 0 38px; color: rgba(255,255,255,.7); font-size: 17px; line-height: 1.75; }.privacy-points { display: grid; gap: 0; border-top: 1px solid rgba(255,255,255,.14); }.privacy-points article { display: grid; grid-template-columns: 45px 1fr; gap: 18px; padding: 25px 0; border-bottom: 1px solid rgba(255,255,255,.14); }.privacy-points article > span { color: var(--gold); font: 700 12px var(--display); }.privacy-points h3 { margin: 0; color: white; font: 700 20px var(--display); }.privacy-points p { margin: 4px 0 0; color: rgba(255,255,255,.6); font-size: 14px; }

.devices-section { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: 80px; padding-top: 145px; padding-bottom: 155px; }.device-copy > p:not(.eyebrow) { max-width: 570px; margin: 25px 0 30px; color: var(--muted); font-size: 17px; line-height: 1.75; }.device-chips { display: flex; flex-wrap: wrap; gap: 9px; }.device-chips span { border: 1px solid #d4ded8; border-radius: 99px; padding: 7px 12px; background: #f4f8f5; color: var(--forest-700); font-size: 12px; font-weight: 850; }
.device-stage { position: relative; min-height: 500px; display: grid; place-items: center; }.device-stage::before { content: ""; position: absolute; width: 500px; height: 500px; border-radius: 50%; background: #e7eee9; }.laptop { position: relative; z-index: 1; width: min(560px, 92%); transform: translate(-18px, -15px) rotate(-1deg); }.laptop-screen { height: 330px; overflow: hidden; border: 9px solid #293731; border-bottom-width: 15px; border-radius: 14px 14px 8px 8px; background: #fffdf7; box-shadow: 0 30px 55px rgba(31,56,46,.2); }.laptop-base { position: relative; left: -7%; width: 114%; height: 17px; border-radius: 4px 4px 18px 18px; background: linear-gradient(#9b9c98,#d8d8d3 35%,#878a86); box-shadow: 0 10px 15px rgba(0,0,0,.16); }.device-appbar { height: 48px; display: flex; align-items: center; gap: 8px; padding: 0 14px; background: var(--forest-800); color: white; font: 700 12px var(--display); }.device-appbar img { width: 27px; height: 27px; border-radius: 50%; }.device-tabs { height: 34px; display: flex; align-items: end; gap: 5px; padding: 5px 12px 0; background: #eee7d8; }.device-tabs i { width: 58px; height: 27px; border-radius: 7px 7px 0 0; background: var(--blue); }.device-tabs i:nth-child(2) { background: var(--coral); }.device-tabs i:nth-child(3) { background: var(--green); }.device-tabs i:nth-child(4) { background: var(--rose); }.device-page { padding: 25px 28px; }.device-page > strong, .phone-page > strong { display: block; color: var(--forest-900); font: 700 25px var(--display); }.device-page > span, .phone-page > span { width: 70%; height: 7px; display: block; margin-top: 12px; border-radius: 10px; background: #dfe5e0; }.device-page > span.short { width: 42%; }.device-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-top: 23px; }.device-cards i { height: 94px; border: 1px solid #dcd8ce; border-radius: 9px; background: #faf8f1; box-shadow: 0 5px 12px rgba(0,0,0,.05); }
.phone { position: absolute; z-index: 3; right: 0; bottom: 2px; width: 178px; height: 360px; overflow: hidden; border: 7px solid #26332e; border-radius: 29px; background: #fffdf7; box-shadow: 0 28px 50px rgba(25,49,40,.28); transform: rotate(4deg); }.phone-speaker { position: absolute; z-index: 4; top: 6px; left: 50%; width: 48px; height: 5px; border-radius: 9px; background: #202824; transform: translateX(-50%); }.phone .device-appbar { height: 58px; padding-top: 6px; }.phone .device-tabs { height: 32px; padding-inline: 7px; }.phone .device-tabs i { width: 47px; height: 25px; }.phone-page { padding: 23px 16px; }.phone-page > strong { font-size: 22px; }.phone-page > span { width: 100%; height: 45px; margin-top: 10px; border: 1px solid #dfdbd1; background: #faf8f2; }.phone-nav { position: absolute; inset: auto 0 0; height: 44px; display: flex; align-items: center; justify-content: space-around; border-top: 1px solid #dfdbd2; background: #faf8f2; }.phone-nav i { width: 8px; height: 8px; border-radius: 50%; background: #77867e; }

.closing-section { padding: 32px 0 105px; }.closing-inner { min-height: 300px; display: grid; grid-template-columns: 170px 1fr auto; align-items: center; gap: 45px; overflow: hidden; border: 1px solid #decfae; border-radius: 24px; padding: 43px 54px; background: #f8e8b7; box-shadow: 0 20px 50px rgba(69,59,35,.1); }.closing-inner > img { width: 160px; opacity: .82; }.closing-inner h2 { max-width: 680px; font-size: clamp(36px,4vw,55px); }.closing-inner div > p:last-child { margin: 15px 0 0; color: #71684f; font-size: 16px; }.closing-inner .button { min-width: 155px; }
.site-footer { padding: 35px 0; border-top: 1px solid rgba(255,255,255,.1); background: var(--forest-950); color: white; }.footer-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 25px; }.footer-brand { font-size: 18px; }.footer-brand img { width: 36px; height: 36px; }.footer-inner p { margin: 0; color: rgba(255,255,255,.65); font-size: 13px; }.footer-note { justify-self: end; }

:focus-visible { outline: 3px solid #f2bb4d; outline-offset: 4px; }

@media (max-width: 1080px) {
  .site-menu { gap: 18px; }.site-menu > a { font-size: 13px; }
  .hero { min-height: 0; padding-bottom: 120px; }.hero-inner { grid-template-columns: 1fr; gap: 45px; }.hero-copy { max-width: 790px; }.hero h1 { max-width: 790px; }.hero-product { width: min(760px, 100%); margin: 0 auto; }
  .privacy-inner { gap: 55px; }.privacy-art { min-height: 430px; }.privacy-orbit.two { width: 470px; height: 470px; }.privacy-orbit.one { width: 370px; height: 370px; }
  .devices-section { grid-template-columns: 1fr; gap: 50px; }.device-copy { max-width: 760px; }.device-stage { width: min(720px,100%); margin-inline: auto; }
  .closing-inner { grid-template-columns: 130px 1fr; }.closing-inner > img { width: 125px; }.closing-inner .button { grid-column: 2; justify-self: start; }
}

@media (max-width: 820px) {
  html { scroll-padding-top: 74px; }.section-shell, .hero-inner { width: min(100% - 30px, 680px); }
  .nav-wrap { width: calc(100% - 28px); min-height: 74px; }.brand { font-size: 19px; }.brand img { width: 40px; height: 40px; }
  .menu-button { display: grid; }.site-menu { position: absolute; top: 68px; left: 14px; right: 14px; display: grid; gap: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; padding: 8px; background: #0b4438; box-shadow: 0 20px 45px rgba(0,0,0,.3); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .18s ease, transform .18s ease, visibility .18s; }.site-menu.open { opacity: 1; visibility: visible; transform: translateY(0); }.site-menu > a { min-height: 46px; display: flex; align-items: center; padding: 0 13px; font-size: 14px; }.site-menu > a::after { display: none; }.site-menu .nav-cta { margin-top: 5px; border-radius: 9px; }
  .menu-button[aria-expanded="true"] .menu-lines i:nth-child(1) { transform: translateY(6px) rotate(45deg); }.menu-button[aria-expanded="true"] .menu-lines i:nth-child(2) { opacity: 0; }.menu-button[aria-expanded="true"] .menu-lines i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .hero { padding: 124px 0 94px; }.hero h1 { font-size: clamp(43px, 12vw, 62px); }.hero-lede { font-size: 17px; }.trust-list { gap: 9px 17px; }
  .hero-product { padding-top: 30px; transform: none; }.hero-tabs { left: 7px; right: 7px; gap: 4px; padding-left: 8px; overflow: hidden; }.hero-tabs span { min-width: 88px; }.app-titlebar { height: 60px; padding: 0 16px; }.app-body-preview { grid-template-columns: 95px 1fr; }.preview-sidebar { padding: 18px 12px; }.preview-page { padding: 22px 20px; }.hero-note { right: 8px; bottom: -52px; }.today-grid { grid-template-columns: 1fr; }.preview-stack { grid-template-columns: repeat(3,1fr); }.focus-card-preview, .grocery-card-preview, .birthday-card-preview { min-height: 92px; }.app-body-preview { min-height: 500px; }
  .welcome-strip { min-height: 75px; gap: 13px; padding: 15px; text-align: center; }.welcome-strip p { font-size: 10px; }.welcome-strip span { display: none; }
  .organize-section { padding: 95px 0 105px; }.section-intro { margin-bottom: 38px; }.section-intro h2, .tour-copy h2, .privacy-copy h2, .device-copy h2 { font-size: clamp(38px, 10vw, 52px); }.feature-grid { grid-template-columns: 1fr; }.feature-card { min-height: 0; padding: 34px 30px; }
  .tour-section { padding: 92px 0 110px; }.tour-copy { grid-template-columns: 1fr; gap: 20px; margin-bottom: 38px; }.demo-wrap { width: calc(100% - 18px); margin-left: 18px; }.binder-rings { left: -20px; }.demo-tabs { padding-left: 21px; }.demo-tab { min-width: 105px; }.demo-book { min-height: 590px; }.demo-brandbar { padding: 0 21px 0 35px; }.demo-panel { padding: 32px 28px 38px; }.panel-layout { grid-template-columns: 1fr; }.day-summary { min-height: 210px; }.contact-demo { grid-template-columns: 1fr; }.contact-demo article { min-height: 0; }.grocery-demo { grid-template-columns: 1fr; }
  .privacy-section { padding: 100px 0; }.privacy-inner { grid-template-columns: 1fr; gap: 40px; }.privacy-art { min-height: 410px; order: 2; }.privacy-orbit.two { width: 420px; height: 420px; }.privacy-copy { order: 1; }
  .devices-section { padding-top: 100px; padding-bottom: 110px; }.device-stage { min-height: 450px; }.phone { right: 5%; }
  .closing-section { padding-bottom: 80px; }.closing-inner { grid-template-columns: 1fr; gap: 22px; padding: 35px 30px; }.closing-inner > img { display: none; }.closing-inner .button { grid-column: 1; }
  .footer-inner { grid-template-columns: 1fr; justify-items: center; text-align: center; }.footer-note { justify-self: center; }
}

@media (max-width: 560px) {
  .hero-actions { align-items: flex-start; flex-direction: column; }.hero-actions .button { width: 100%; }.trust-list { display: grid; }.hero-product { width: 108%; margin-left: -4%; }.hero-tabs span { min-width: 82px; font-size: 11px; }.hero-tabs span:nth-child(5) { display: none; }.mini-brand strong { font-size: 15px; }.app-tools span { width: 32px; height: 32px; }.app-body-preview { grid-template-columns: 1fr; min-height: 480px; }.preview-sidebar { display: none; }.preview-page { padding: 23px 17px 35px; }.preview-stack { grid-template-columns: 1fr 1fr; }.focus-card-preview { grid-column: 1 / -1; }.hero-note { display: none; }
  .welcome-strip { flex-direction: column; gap: 2px; padding-block: 17px; }
  .panel-heading { align-items: start; flex-direction: column; margin-bottom: 25px; padding-bottom: 18px; }.panel-heading h3 { font-size: 27px; }.panel-action { width: 100%; justify-content: center; }.demo-brandbar > span { font-size: 0; }.demo-brandbar > span i { display: block; }.demo-panel { padding: 27px 17px 32px; }.timeline-list article { grid-template-columns: 48px 10px 1fr; gap: 9px; padding: 10px 13px; }.view-switch { width: 100%; }.view-switch span { flex: 1; text-align: center; }.calendar-days > span { min-height: 54px; padding: 6px; }.weekdays span { font-size: 9px; }.demo-check { grid-template-columns: 25px minmax(0,1fr); padding-inline: 13px; }.demo-check > b { display: none; }.contact-demo article { padding: 17px; }.grocery-demo .demo-check { min-height: 72px; }
  .privacy-art { min-height: 330px; }.privacy-icon { width: 210px; }.privacy-orbit.one { width: 285px; height: 285px; }.privacy-orbit.two { width: 340px; height: 340px; }.privacy-seal { right: 1%; bottom: 15px; width: 95px; height: 95px; }
  .device-stage { min-height: 380px; }.device-stage::before { width: 350px; height: 350px; }.laptop { width: 108%; transform: translate(-6%, -20px); }.laptop-screen { height: 260px; }.device-page { padding: 18px; }.phone { right: -1%; bottom: 0; width: 145px; height: 295px; }.phone-page { padding: 17px 12px; }
}

/* Keep even the small product-tour details readable without zooming. */
.mini-date span,
.mini-date small,
.local-pill,
.preview-heading small,
.paper-card small,
.agenda-item time,
.agenda-item strong,
.agenda-item small,
.focus-card-preview > span,
.grocery-card-preview strong,
.birthday-card-preview strong,
.grocery-card-preview > span,
.birthday-card-preview > b,
.hero-note span,
.panel-heading small,
.day-summary > small,
.weekdays span,
.demo-check > b,
.contact-demo div > span:not(.contact-link),
.grocery-demo header small,
.privacy-seal small,
.welcome-strip p,
.hero-tabs span { font-size: 12px; }

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