.tot-page{--tot-deep:#39283e}
.tot-intro{padding:60px 0 64px;background:radial-gradient(ellipse at 85% 40%,#e9deeb 0,transparent 56%),var(--paper);overflow:hidden}
.tot-intro-grid{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:64px}
.tot-intro h1{font-size:clamp(50px,6vw,78px);color:var(--plum);margin-bottom:20px}
.tot-tagline{font:clamp(30px,3.4vw,44px)/1.2 Georgia,serif;letter-spacing:-.02em;margin-bottom:24px}
.tot-intro .lead{max-width:520px}
.tot-platforms{font-size:16px;margin:22px 0 0;color:var(--muted)}.tot-platforms span{font-size:14px}
.tot-reader{position:relative;margin:0;display:grid;justify-items:center;gap:18px;isolation:isolate}
.tot-reader-backdrop{position:absolute;inset:8% -6% 12%;background:linear-gradient(145deg,#6f4775,#302239);border-radius:50% 50% 38% 38%;z-index:-1}
.tot-reader .tot-phone{width:266px;box-shadow:0 24px 48px #25112840;transform:rotate(2deg)}
.tot-reader figcaption{text-align:center;font-size:17px;color:var(--plum);font-weight:600}.tot-reader figcaption span{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:2px}
.tot-study{background:#fff}.tot-section-heading{max-width:760px;margin-bottom:38px}.tot-section-heading h2{margin-bottom:14px}
.tot-feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.tot-feature{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column}
.tot-feature-copy{padding:30px 32px 8px}.tot-feature h3{font-size:32px}.tot-feature p{color:var(--muted);font-size:18px}.tot-feature .eyebrow{font-size:11px;margin-bottom:14px}
.tot-screenshot{position:relative;display:block;margin:0 28px;height:360px;overflow:hidden;border-radius:14px 14px 0 0;box-shadow:0 4px 22px #30283412;margin-top:auto;background:#e8e4dc}
.tot-screenshot img{width:100%;height:100%;object-fit:cover;object-position:center 25%}.tot-feature:first-child .tot-screenshot img{object-position:center 65%}.tot-screenshot span{position:absolute;bottom:16px;left:16px;right:16px;text-align:center;background:#fff;color:var(--plum);border:1px solid var(--line);border-radius:8px;padding:10px;font-size:14px;font-weight:650;box-shadow:0 4px 20px #30283418}
.tot-notes{display:flex;gap:22px;align-items:center;border-top:1px solid var(--line);margin-top:40px;padding-top:30px}.tot-notes-number{color:var(--plum);font-size:40px}.tot-notes h3{font-size:28px;margin-bottom:10px}.tot-notes p{color:var(--muted);margin:0;max-width:830px}
.tot-listen{background:var(--tot-deep);color:white}.tot-listen-grid{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:60px}.tot-listen .eyebrow{color:var(--gold)}.tot-listen .lead{color:#e8dfe9}.tot-listen figure{margin:0}.tot-listen img{border-radius:12px;box-shadow:0 20px 40px #140c1b44}.tot-listen figcaption{font-size:14px;text-align:center;color:#e0d0e3;margin-top:16px}
.tot-about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px}.tot-about p:last-child{margin-bottom:0}
.tot-community{background:#eee7ef;border-top:1px solid var(--line)}.tot-community-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:36px}.tot-community-copy{display:flex;align-items:center;gap:20px}.tot-community h2{font-size:29px;margin-bottom:8px}.tot-community p{margin:0;font-size:17px;color:var(--muted)}.tot-facebook-mark{display:grid;place-items:center;color:#1877f2;flex-shrink:0}.tot-facebook-mark svg{width:42px;height:42px}.facebook-icon{display:block;flex-shrink:0}.tot-community .button{flex-shrink:0;border-color:#c9b6cb}.tot-community .button svg{color:#1877f2}
@media(max-width:920px){.tot-intro-grid{gap:28px}.tot-reader .tot-phone{width:230px}.tot-listen-grid,.tot-about-grid{gap:32px}.tot-community-inner{align-items:flex-start;flex-direction:column}}
@media(max-width:650px){.tot-intro{padding:40px 0}.tot-intro-grid,.tot-feature-grid,.tot-listen-grid,.tot-about-grid{grid-template-columns:1fr;gap:32px}.tot-intro .app-label img{width:56px;height:56px}.tot-intro .eyebrow{font-size:10px}.tot-intro h1{font-size:52px}.tot-tagline{font-size:32px}.tot-reader{margin-top:8px}.tot-reader .tot-phone{width:245px}.tot-reader-backdrop{inset:8% 0 12%}.tot-feature-copy{padding:24px 24px 6px}.tot-feature h3{font-size:29px}.tot-screenshot{height:320px;margin-inline:20px}.tot-notes{gap:12px;align-items:flex-start}.tot-notes-number{font-size:28px}.tot-notes h3{font-size:26px}.tot-community-copy{align-items:flex-start;gap:16px}.tot-community h2{font-size:27px}.tot-community .button{width:100%}.tot-about h2{margin-bottom:0}}