/* Extend Readlet's existing dark, system-type design. */
:root { --bg-body:#08090b; --bg-card:#17181b; --text-secondary:#a2a3ab; --accent-blue:#75b7f3; --accent-blue-hover:#92c8fa; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { overflow-x:clip; }
button { font:inherit; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #75b7f3; outline-offset:5px; }
.skip-link { position:fixed; top:12px; left:16px; padding:12px 20px; background:#f5f5f7; color:#121316; z-index:200; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.nav-wrapper { background:rgba(8,9,11,.86); }
nav { height:60px; }
.nav-download { opacity:1; border-radius:100px; padding:7px 15px; background:#eceef1; color:#17181b; }
.hero { padding:132px 0 42px; }
.hero-eyebrow { font-size:13px; font-weight:500; letter-spacing:.01em; color:#c2c5cc; margin-bottom:26px; }
.hero-title { font-size:clamp(44px,6vw,76px); letter-spacing:-.055em; line-height:1.06; font-weight:600; background:none; -webkit-text-fill-color:unset; color:#f5f5f7; }
.hero-title span { color:#92969f; }
.hero-subtitle { font-size:20px; line-height:1.5; margin-top:24px; max-width:650px; }
.cta-group { margin:30px 0 14px; align-items:center; }
.btn { min-height:48px; padding:12px 24px; font-size:15px; transition:background-color .2s,color .2s,transform .2s; }
.btn:active:not([aria-disabled]) { transform:scale(.98); }
.btn-primary { background:#8dc4f5; color:#10263b; }
.btn-link { font-weight:400; }
.hero-footnote { font-size:12px; color:#9a9da6; }
.hero-image-wrapper { margin-top:64px; border-radius:16px; box-shadow:0 24px 90px rgba(0,0,0,.3); transform:none; }
.hero-image-wrapper img { display:block; width:100%; height:auto; }
.section-index { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding-top:30px; padding-bottom:44px; }
.section-index a { display:flex; justify-content:space-between; gap:8px; color:#b4b7bf; font-size:13px; padding:18px 0; border-top:1px solid #2c2e33; }
.section-index a:hover { color:#fff; }
.section-index span { color:#75b7f3; }
.grid-section { padding-top:72px; }
.section-label { letter-spacing:.01em; font-size:13px; font-weight:600; color:#aeb4bf; text-transform:none; }
.section-title { letter-spacing:-.04em; }
.card-title { letter-spacing:-.03em; }
.story-copy h2 { letter-spacing:-.045em; }
.story-points li { color:#adafb7; }
.story-link { min-height:44px; align-items:center; }
.platform-note { margin-top:12px; font-size:13px; }
.companion-note { align-items:start; }
.companion-note .story-link { white-space:nowrap; }
.translation-story { margin-top:130px; gap:70px; }
.translation-visual { padding:28px 32px 22px; background:#e6e6e2; color:#282a2b; border-radius:22px; overflow:hidden; }
.demo-heading { display:flex; justify-content:space-between; gap:12px; font-size:11px; letter-spacing:0; color:#626666; }
.demo-heading span:last-child { letter-spacing:0; }
.language-switch { display:flex; gap:3px; padding:4px; background:#d4d6d2; border-radius:30px; margin:25px auto; width:fit-content; }
.language-switch button { border:0; background:transparent; color:#454944; padding:8px 12px; border-radius:30px; font-size:11px; cursor:pointer; }
.language-switch button[aria-pressed=true] { background:#fff; color:#292c2a; box-shadow:0 1px 4px #8883; }
.translated-paper { background:#fafaf6; min-height:300px; padding:34px 30px 19px; box-shadow:0 6px 20px #5551; }
.paper-kicker { display:block; font-size:10px; letter-spacing:.01em; color:#787d72; margin-bottom:35px; }
.translated-paper h3 { font-family:Georgia,serif; font-size:31px; font-weight:400; line-height:1.15; letter-spacing:-.04em; color:#303c2b; }
.translated-paper p { font-family:Georgia,serif; font-size:14px; line-height:1.6; color:#5d6656; margin-top:21px; }
.paper-rule { border-top:1px solid #cfd5c9; margin-top:27px; }
.paper-page { display:block; text-align:right; font-size:9px; margin-top:10px; color:#67705e; }
.translation-visual .demo-caption { font-size:10px; line-height:1.5; color:#5d625b; margin:15px 0 0; }
.document-details { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; margin:100px 0 70px; }
.document-details article { border-top:1px solid #34363b; padding-top:20px; }
.document-details h3 { font-size:22px; line-height:1.25; margin:4px 0 13px; max-width:245px; letter-spacing:-.035em; }
.document-details p { font-size:14px; }
.plus-section { padding:120px 0; background:#f1f2f0; color:#202225; }
.plus-layout { display:grid; grid-template-columns:1.15fr 1fr; gap:100px; align-items:center; }
.plus-section .section-label { color:#606970; }
.plus-intro h2 { font-size:clamp(36px,4.2vw,53px); line-height:1.08; letter-spacing:-.045em; margin:22px 0; }
.plus-intro h2 span { color:#777c80; }
.plus-intro p { font-size:17px; color:#666b70; margin-bottom:24px; }
.plus-section .story-link { color:#28699e; }
.plus-details { border-left:1px solid #cfd3d4; padding-left:65px; }
.plus-wordmark { font-size:32px; letter-spacing:-.045em; font-weight:600; }
.plus-wordmark sup { color:#286fa7; font-size:23px; vertical-align:super; margin-left:2px; }
.plus-details .plus-price { color:#24292d; font-size:32px; letter-spacing:-.045em; margin:24px 0 9px; }
.plus-price span { font-size:17px; letter-spacing:0; color:#767c80; }
.plus-details p { color:#62686b; font-size:15px; }
.plus-divider { width:42px; border-top:1px solid #babfc2; margin:28px 0; }
.plus-details .trial-detail { font-size:14px; color:#42494e; }
.plus-details .ownership-detail { font-size:12px; margin-top:16px; max-width:310px; }
.downloads-section { padding:112px 0 100px; }
.download-heading { text-align:center; }
.download-heading img { display:block; margin:0 auto 28px; border-radius:18px; }
.download-heading .section-label { display:block; }
.download-heading h2 { font-size:clamp(35px,4.6vw,54px); line-height:1.1; letter-spacing:-.045em; margin:20px 0; }
.download-heading h2 span { color:#92969f; }
.download-heading p { font-size:17px; }
.download-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:48px; }
.download-card { border:1px solid #303339; border-radius:20px; padding:36px; background:#14161a; }
.platform-icon { width:36px; height:36px; stroke:#b7bdc7; fill:none; stroke-width:1.35; margin-bottom:18px; }
.windows-icon { fill:#b7bdc7; stroke:none; }
.download-card h3 { font-size:24px; letter-spacing:-.03em; }
.download-card .platform-spec { font-size:12px; color:#939ba7; margin-top:6px; }
.download-card .platform-description { font-size:15px; margin:22px 0 28px; min-height:48px; max-width:340px; }
.download-button { width:100%; text-align:center; }
.download-button[aria-disabled=true] { background:#262a30; color:#a2a8b2; cursor:default; }
.download-meta { font-size:11px; min-height:34px; margin:13px 0 0; color:#9bA2ad; line-height:1.5; }
.release-status { font-size:12px; text-align:center; margin:20px auto 0; max-width:630px; }
.release-retry { display:block; background:transparent; color:#8dc4f5; border:0; padding:10px 20px; margin:6px auto; cursor:pointer; font-size:13px; }
[hidden] { display:none !important; }
.other-downloads { display:flex; justify-content:center; flex-wrap:wrap; gap:22px; font-size:13px; margin-top:32px; }
.other-downloads a { color:#8dc4f5; min-height:32px; }
.other-downloads span { flex-basis:100%; text-align:center; color:#929aa5; font-size:12px; }
.download-faq { max-width:780px; margin:66px auto 0; }
.download-faq details { border-top:1px solid #2d3137; padding:20px 0; }
.download-faq summary { cursor:pointer; font-size:16px; font-weight:500; list-style:none; position:relative; padding-right:36px; }
.download-faq summary::-webkit-details-marker { display:none; }
.download-faq summary:after { content:'+'; position:absolute; right:0; color:#919aaa; }
.download-faq details[open] summary:after { content:'−'; }
.download-faq p { font-size:14px; max-width:680px; padding:18px 20px 0 0; }
.fade-in { opacity:1; transform:none; }
/* Content remains readable without JavaScript or when motion is disabled. */
.motion-ready .fade-in { opacity:0; transform:translateY(16px); transition:opacity .65s ease,transform .65s ease; }
.motion-ready .fade-in.visible { opacity:1; transform:none; }
@media(max-width:767px) {
  .hero { padding-top:112px; } .hero-title { font-size:48px; } .hero-subtitle { font-size:17px; }
  .hero-eyebrow { font-size:12px; } .hero-image-wrapper { margin-top:40px; border-radius:10px; }
  .cta-group { gap:8px; flex-wrap:wrap; } .wide-only { display:none; }
  .section-index { gap:20px; padding-bottom:20px; } .section-index a { font-size:11px; }
  .translation-story { margin-top:80px; gap:32px; } .translation-visual { padding:22px; }
  .document-details { grid-template-columns:1fr; gap:30px; margin:65px 0; }
  .document-details h3 { max-width:none; margin:2px 0 12px; }
  .plus-section { padding:72px 0; } .plus-layout { grid-template-columns:1fr; gap:45px; }
  .plus-details { border-left:0; border-top:1px solid #cfd3d4; padding:30px 0 0; }
  .downloads-section { padding:72px 0; } .download-grid { grid-template-columns:1fr; gap:16px; }
  .download-card { padding:28px; } .download-card .platform-description { min-height:0; }
  .companion-note .story-link { white-space:normal; }
}
@media(max-width:400px) { .hero-title { font-size:41px; } .section-index { grid-template-columns:1fr; gap:0; } .section-index a { font-size:13px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none !important; transition:none !important; } .hero-title,.hero-subtitle,.cta-group,.hero-badge,.fade-in,.motion-ready .fade-in { opacity:1; transform:none; } }

.hero-title,.hero-subtitle,.cta-group,.hero-image-wrapper { animation:none; opacity:1; }

.showcase-section { background:var(--bg-body); }
.product-story.translation-story { grid-template-columns:1fr 1fr; gap:64px; min-height:0; background:none; border:0; box-shadow:none; border-radius:0; overflow:visible; }
.translation-story .story-copy { padding:0; }
.translation-story .story-copy h2 { font-size:clamp(34px,3.7vw,46px); }
.translation-story .story-copy > p { font-size:17px; }
@media(max-width:900px) { .product-story.translation-story { grid-template-columns:1fr; gap:36px; } .translation-visual { max-width:600px; width:100%; } }

@media(min-width:768px) and (max-width:1050px) { .plus-layout { gap:45px; } .plus-details { padding-left:34px; } }
.value-section,footer { background:var(--bg-body); }
.value-prop p { color:var(--text-secondary); }
.privacy-shield svg { color:#9fb5c8; filter:none; }
.privacy-ring { animation:none; border-color:#6f839333; }
.privacy-ring:nth-child(2) { border-color:#6f839322; }
@media(min-width:768px) { .value-props { grid-template-columns:1fr 1fr; gap:40px 56px; } }
.value-prop { border-top:1px solid #2c2e33; padding-top:22px; }
.value-prop h3 { letter-spacing:-.025em; }

.privacy-visual::before { background:none; }

/* The agent story is about capability parity, so the actions themselves are the visual. */
.agent-story { grid-template-columns:minmax(300px,1fr) minmax(0,1fr); background:#101215; box-shadow:none; }
.agent-story .story-copy h2 { font-size:clamp(32px,2.9vw,42px); text-wrap:balance; }
.agent-story .story-copy .agent-undo { margin-top:20px; font-size:15px; line-height:1.6; color:#9aa2ad; }
.agent-actions { flex-direction:column; justify-content:center; align-items:flex-start; padding:56px 42px; }
.action-ledger { width:100%; max-width:520px; }
.action-ledger > div { display:grid; grid-template-columns:152px 1fr; gap:22px; padding:17px 0; border-top:1px solid #2c2f35; }
.action-ledger > div:last-child { border-bottom:1px solid #2c2f35; }
.action-ledger dt { font-size:13px; font-weight:500; line-height:1.5; color:#aeb4bf; }
.action-ledger dd { font-size:15px; line-height:1.5; color:#dcdee3; }
.action-note { max-width:520px; margin-top:22px; font-size:13px; line-height:1.6; color:#949da8; }
.agent-connections { display:grid; grid-template-columns:1fr 1fr; column-gap:70px; row-gap:30px; padding:44px 0 0; margin-bottom:100px; }
.agent-connections article { border-top:1px solid #30353c; padding-top:26px; }
.agent-connections h3 { font-size:30px; font-weight:500; letter-spacing:-.035em; margin:16px 0; }
.agent-connections p { font-size:16px; line-height:1.65; max-width:470px; }
.agent-connections .connection-detail { font-size:12px; color:#9aa2ad; margin-top:18px; line-height:1.65; }
.connection-detail a { color:#a7c8e4; text-decoration:underline; text-underline-offset:3px; }
.agent-connections .connections-footnote { grid-column:1 / -1; max-width:none; font-size:12px; color:#939ca7; }
.connection-heading { display:flex; align-items:center; gap:14px; }
.connection-logo { display:block; flex:0 0 auto; width:28px; height:28px; object-fit:contain; }
.connection-logo.apple-logo { width:26px; }
.download-card-top { display:flex; align-items:center; justify-content:space-between; min-height:38px; margin-bottom:22px; }
.platform-logo { display:block; object-fit:contain; flex-shrink:0; }
.beta-label { display:inline-block; padding:4px 10px; border:1px solid #495057; border-radius:7px; color:#b8c0c9; font-size:11px; font-weight:500; line-height:1.4; }
.beta-note { max-width:640px; margin:26px auto 0; text-align:center; font-size:13px; line-height:1.6; color:#a2aab5; }
.beta-note + .release-status { margin-top:8px; }
@media(min-width:901px) and (max-width:1100px) { .agent-story .story-copy { padding:42px 30px; } .agent-actions { padding:42px 30px; } .action-ledger > div { grid-template-columns:132px 1fr; gap:18px; } }
@media(max-width:767px) { .agent-connections { grid-template-columns:1fr; gap:32px; padding-top:28px; margin-bottom:70px; } .agent-connections h3 { font-size:28px; } }
@media(max-width:900px) { .agent-story { grid-template-columns:1fr; } .agent-actions { padding:14px 34px 40px; } }
@media(max-width:560px) { .agent-actions { padding:10px 24px 34px; } .action-ledger > div { grid-template-columns:1fr; gap:5px; padding:15px 0; } }