/* Recordo product guides: quiet editorial framing around real product screens. */
.seo-page { background: var(--warm-sand); color: var(--charcoal); }
.seo-page * { box-sizing: border-box; }
.seo-page main { padding-top: 82px; }
.seo-page .container { max-width: 1200px; }
.seo-page a:focus-visible,.seo-page summary:focus-visible { outline: 3px solid #176d78; outline-offset: 4px; }
.seo-hero { padding: clamp(48px,6vw,84px) 0 clamp(64px,7vw,100px); background: radial-gradient(circle at 75% 20%,rgba(94,196,198,.12),transparent 45%),radial-gradient(circle at 5% 80%,rgba(193,122,91,.08),transparent 40%),var(--warm-sand); overflow: hidden; }
.seo-hero-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 60px; align-items: center; }
.seo-kicker { display: inline-block; font: 600 .85rem/1.5 var(--font-display); letter-spacing: .01em; color: #22656c; }
.seo-hero h1,.seo-section h2,.seo-end h2 { font-family: var(--font-display); font-weight: 600; color: var(--charcoal); }
.seo-hero h1 { max-width: 830px; margin: 18px 0 24px; font-size: clamp(2.5rem,5vw,4rem); letter-spacing: -.03em; line-height: 1.1; overflow-wrap: break-word; }
.seo-hero-copy > h1:first-child { margin-top: 0; }
.seo-lede { max-width: 680px; font-size: 1.25rem; line-height: 1.6; color: var(--gray-600); }
.seo-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 30px; }
.seo-button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 16px 32px; border-radius: 50px; background: var(--cyan-primary); color: white!important; font: 600 1rem/1.25 var(--font-body); text-decoration: none; box-shadow: 0 8px 24px rgba(94,196,198,.25); transition: background .4s var(--ease-gentle),transform .4s var(--ease-gentle),box-shadow .4s var(--ease-gentle); }
.seo-button:hover { background: var(--cyan-light); transform: translateY(-3px); box-shadow: 0 12px 32px rgba(94,196,198,.35); }
.seo-text-link,.seo-page main a:not(.seo-button) { color: #175f69; text-underline-offset: 4px; }
.seo-text-link { font-size: .98rem; font-weight: 600; }
.seo-product-shot { min-width: 0; margin: 0; text-align: center; }
.seo-shot-frame { display: inline-block; width: min(100%,260px); padding: 5px; border: 1px solid #333; border-radius: 48px; background: #1a1a1e; box-shadow: 0 40px 80px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.08); transform: none; }
.seo-shot-frame img { display: block; width: 100%; height: auto; border-radius: 43px; }
.seo-product-shot figcaption { max-width: 520px; margin: 24px auto 0; color: var(--gray-700); font-size: .82rem; line-height: 1.55; }
.seo-hero-wide .seo-hero-grid { grid-template-columns: 1fr; gap: 48px; }
.seo-hero-wide .seo-hero-copy { max-width: 870px; }
.seo-hero-wide .seo-shot-frame { display: block; width: 100%; max-width: none; overflow: hidden; contain: paint; padding: 27px 0 0; border: 1px solid rgba(148,163,184,.28); border-radius: 18px; background: white; box-shadow: 0 28px 70px rgba(15,23,42,.16); }
.seo-hero-wide .seo-shot-frame::before { content: ''; position: absolute; inset: 0 0 auto; display: block; height: 27px; border-bottom: 1px solid var(--gray-200); background: radial-gradient(circle at 15px 13px,#d6d9de 0 3px,transparent 4px),radial-gradient(circle at 27px 13px,#d6d9de 0 3px,transparent 4px),radial-gradient(circle at 39px 13px,#d6d9de 0 3px,transparent 4px),#f8fafc; }
.seo-hero-wide .seo-shot-frame { position: relative; }
.seo-hero-wide .seo-shot-frame img { border: 0; border-radius: 0; }
.seo-hero-wide .seo-product-shot figcaption { margin-top: 24px; }
.seo-adhd-daily-planner .seo-hero-grid { grid-template-columns: minmax(0,1fr) minmax(0,520px); gap: 48px; }
.seo-adhd-daily-planner .seo-hero-copy { max-width: none; }
.seo-adhd-daily-planner .seo-product-shot { width: 100%; }
.seo-adhd-reminders .seo-hero-grid { grid-template-columns: minmax(0,1fr); gap: 48px; }
.seo-adhd-reminders .seo-hero-copy { max-width: 870px; }
.seo-adhd-reminders .seo-product-shot { width: min(100%,820px); margin-inline: auto; }
.seo-muse-connector .seo-hero-grid { grid-template-columns: minmax(0,1fr) minmax(0,560px); }
.seo-muse-connector .seo-product-shot { width: 100%; }
.seo-section { padding: clamp(64px,7vw,100px) 0; }
.seo-section h2,.seo-end h2 { margin: 14px 0 20px; font-size: clamp(2.25rem,4vw,3.5rem); letter-spacing: -.02em; line-height: 1.2; overflow-wrap: anywhere; }
.seo-section p,.seo-end p { color: #43535e; font-size: 1rem; line-height: 1.8; }
.seo-section-intro { max-width: 790px; }
.seo-workflow { background: var(--cyan-pale); }
.seo-flow-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 46px; border-top: 1px solid #cdded8; border-bottom: 1px solid #cdded8; }
.seo-flow-row article { padding: 32px 36px 34px 0; }
.seo-flow-row article+article { padding-left: 36px; border-left: 1px solid #cdded8; }
.seo-flow-row article>span,.seo-setup-steps li>span { color: #a2603f; font: 700 .78rem/1.5 var(--font-display); letter-spacing: .1em; }
.seo-flow-row h3,.seo-setup-steps h3 { margin: 16px 0 8px; font: 600 1.26rem/1.34 var(--font-display); color: #2b3943; }
.seo-flow-row p,.seo-setup-steps p { font-size: .93rem; }
.seo-detail { background: var(--warm-cream); }
.seo-detail-grid { display: grid; grid-template-columns: 150px minmax(0,760px); gap: 30px; align-items: start; }
.seo-detail-marker { color: #b9744b; font-size: 6rem; line-height: .9; }
.seo-detail .seo-text-link { display: inline-block; margin-top: 18px; }
.seo-faq { background: white; }
.seo-narrow { max-width: 820px!important; }
.seo-faq .seo-kicker { margin-bottom: 4px; }
.seo-faq details { padding: 22px 0; border-bottom: 1px solid #dbe2df; }
.seo-faq details:first-of-type { border-top: 1px solid #dbe2df; }
.seo-faq summary { display: flex; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; font: 600 1.05rem/1.5 var(--font-display); }
.seo-faq summary::-webkit-details-marker { display: none; }
.seo-faq summary::after { content: '+'; flex: none; color: #277b7e; font-size: 1.3rem; }
.seo-faq details[open] summary::after { content: '−'; }
.seo-faq details p { max-width: 680px; margin-top: 14px; }
.seo-setup { background: var(--cyan-pale); }
.seo-setup-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 25px; list-style: none; padding: 0; margin: 38px 0; }
.seo-setup-steps li { padding-top: 22px; border-top: 3px solid #80b7b1; }
.seo-end { padding: 72px 0; background: var(--cyan-pale); }
.seo-end-grid { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 40px; align-items: center; }
.seo-end p { max-width: 650px; }
.seo-end-links { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.seo-end-links a:not(.seo-button) { font-size: .9rem; }
@media(max-width:800px) { .seo-hero-grid,.seo-end-grid { grid-template-columns: minmax(0,1fr); } .seo-hero-copy { min-width: 0; } .seo-hero-phone .seo-product-shot { justify-self: center; } .seo-flow-row,.seo-setup-steps { grid-template-columns: 1fr; } .seo-flow-row article,.seo-flow-row article+article { padding: 24px 0; border-left: 0; border-bottom: 1px solid #cdded8; } .seo-flow-row article:last-child { border-bottom: 0; } .seo-detail-grid { grid-template-columns: 1fr; gap: 10px; } .seo-detail-marker { font-size: 4rem; } .seo-setup-steps { gap: 25px; } }
@media(max-width:960px) { .seo-adhd-daily-planner .seo-hero-grid { grid-template-columns: minmax(0,1fr); } .seo-adhd-daily-planner .seo-product-shot { max-width: 520px; margin-inline: auto; } }
@media(max-width:960px) { .seo-muse-connector .seo-hero-grid { grid-template-columns: minmax(0,1fr); } .seo-muse-connector .seo-product-shot { max-width: 560px; margin-inline: auto; } }
@media(max-width:480px) { .seo-page .container { padding-left: 20px; padding-right: 20px; } .seo-page main { padding-top: 76px; } .seo-hero { padding: 42px 0 67px; } .seo-shot-frame { width: min(100%,260px); } .seo-product-shot figcaption,.seo-hero-wide .seo-product-shot figcaption { margin-top: 24px; } .seo-end { padding: 58px 0; } }
@media(max-width:350px) { .seo-page nav .logo span { display: none; } }
@media(prefers-reduced-motion:reduce) { .seo-button { transition: none; } }
@media (max-width: 480px) {
  /* Show a readable slice of the actual web UI, starting with the task area. */
  .seo-hero-wide .seo-shot-frame { overflow: hidden; }
  .seo-hero-wide .seo-shot-frame img { width: 180%; max-width: none; }
  .seo-adhd-daily-planner .seo-shot-frame img { width: 100%; }
  .seo-adhd-reminders .seo-shot-frame img { width: 100%; }
  .seo-muse-connector .seo-shot-frame img { width: 100%; }
}

/* Daily planner + reminders: second paragraph in the detail block. */
.seo-adhd-daily-planner .seo-detail p + p,.seo-adhd-reminders .seo-detail p + p { margin-top: 16px; }
.seo-adhd-daily-planner .seo-setup-steps h3,.seo-adhd-reminders .seo-setup-steps h3 { margin-top: 0; }