@import url('./atmosphere.css');
@font-face { font-family: Manrope; src: url('./assets/manrope.ttf') format('truetype'); font-style: normal; font-weight: 200 800; font-display: swap; }
:root { --ink:#442239; --heading:#30133d; --muted:#513a4d; --edge:#d3b5c8; --paper:#fffaf7ed; --accent:#8750cb; --pink:#f9d6e4; }
* { box-sizing:border-box; }
html { background:var(--pink); scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; background:var(--pink); color:var(--ink); font:400 16px/1.7 Manrope,Arial,sans-serif; font-synthesis:none; }
body>header, body>main, body>footer { position:relative; z-index:1; }
a { color:inherit; text-underline-offset:4px; }
button { font:inherit; color:inherit; cursor:pointer; }
:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
::selection { background:#edbfd5; color:var(--heading); }
h1,h2,h3 { color:var(--heading); font-family:Manrope,Arial,sans-serif; font-weight:650; letter-spacing:-.045em; line-height:1.12; text-wrap:balance; }
h1,h2,h3,p { margin-top:0; }
.wrap,.shell { width:min(1220px,calc(100% - 96px)); margin-inline:auto; }
.skip-link,.skip { position:fixed; top:12px; left:12px; transform:translateY(-180%); z-index:120; background:#fff8fb; color:var(--ink); padding:12px 18px; }
.skip-link:focus,.skip:focus { transform:none; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:26px; padding-block:25px; border-bottom:1px solid #44223925; }
.wordmark { display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:27px; letter-spacing:-.065em; text-decoration:none; white-space:nowrap; }
.wordmark img { width:32px; height:32px; flex:none; }
.site-header nav { display:flex; align-items:center; flex-wrap:wrap; gap:24px; font-size:14px; font-weight:600; }
.site-header nav a { text-decoration:none; min-height:44px; display:inline-flex; align-items:center; }
.site-header a:hover { color:#683795; }
.login,.button { border:1px solid var(--ink); border-radius:30px; padding:11px 19px; font-weight:650; font-size:14px; min-height:44px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.button { background:var(--ink); color:#fff8fb; }
.button:hover { background:var(--heading); color:white; }
.login:hover,.button-light:hover { background:var(--ink); color:#fff8fb!important; }
.button-light { background:transparent; color:var(--ink); }
.hero { display:grid; grid-template-columns:1.25fr .85fr; gap:42px 80px; align-items:center; padding-block:74px 48px; }
h1 { font-size:clamp(48px,6vw,82px); line-height:1.05; letter-spacing:-.065em; margin-bottom:29px; }
h1 span { display:block; }
.hero-description { max-width:42ch; color:var(--muted); font-size:19px; line-height:1.7; margin-bottom:25px; }
.stage { font-size:13px; color:var(--muted); margin:17px 0 0; }
.stage>span { display:none; }
.flower-stage { text-align:center; }
.hook-flower { display:block; width:min(100%,340px); margin:auto; border:0; padding:0; background:transparent; position:relative; border-radius:50%; }
.hook-flower img { display:block; width:100%; height:auto; transition:transform .45s ease; }
.hook-flower:hover img { transform:rotate(14deg); }
.flower-label { display:inline-block; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#fff8fb; font-size:12px; font-weight:700; pointer-events:none; }
#flower-help { margin:17px 0 0; color:var(--muted); font-size:13px; }
.hero-art { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--edge); background:var(--paper); border-radius:8px 38px 8px 8px; overflow:hidden; }
.idea-note,.script-note { padding:30px 36px; }
.script-note { border-left:1px solid var(--edge); }
.note-tag { display:block; font-size:13px; font-weight:650; color:var(--muted); margin-bottom:18px; }
.idea-note p,.script-note p { font-size:clamp(21px,2.3vw,28px); font-weight:600; letter-spacing:-.035em; line-height:1.45; white-space:pre-line; margin-bottom:18px; }
.note-foot,.example { font-size:12px; color:var(--muted); display:block; }
.hook-picker { grid-column:1/-1; border-top:1px solid var(--edge); padding:15px 24px; display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.hook-picker>span { margin-right:15px; font-size:13px; }
.hook-picker button,.view-buttons button { background:transparent; border:1px solid transparent; border-radius:24px; padding:9px 15px; min-height:44px; color:var(--muted); font-size:13px; }
.hook-picker button:hover,.view-buttons button:hover { background:#f4dce8; }
.hook-picker button[aria-pressed=true],.view-buttons button[aria-pressed=true] { background:#f4dce8; border-color:var(--edge); color:var(--heading); font-weight:650; }
.platform-strip { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding-block:22px; border-block:1px solid #44223925; font-size:13px; color:var(--muted); }
.platform-strip p { margin:0; }.platform-strip p span { margin-inline:10px; }
.workflow,.reading { padding-block:82px; }
h2 { font-size:clamp(34px,4vw,51px); margin-bottom:20px; }
.section-heading { display:grid; grid-template-columns:1.2fr 1fr; gap:70px; align-items:end; margin-bottom:45px; }
.section-heading>p { color:var(--muted); max-width:44ch; margin-bottom:7px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-bottom:48px; }
.steps article { border-top:1px solid var(--edge); padding:25px 0; }
.step-number { display:block; color:#683795; font-size:16px; font-weight:650; margin-bottom:17px; }
.step-art { width:100%; height:70px; margin-bottom:16px; fill:none; stroke:#8750cb; stroke-width:1.3; }
.art-guide { stroke:#d3b5c8; }.art-beacon { fill:#8750cb; }.art-accent { stroke:#683795; }
h3 { font-size:26px; margin-bottom:17px; }
.steps p { color:var(--muted); font-size:15px; margin-bottom:17px; }
.steps .detail { font-size:13px; color:#683795; border-top:1px solid #44223925; padding-top:17px; margin-bottom:0; }
.product-preview { border:1px solid var(--edge); background:var(--paper); border-radius:8px 38px 8px 8px; overflow:hidden; }
.preview-top { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:21px 26px; }
.preview-top p { margin:0; font-weight:650; }
.view-buttons { display:flex; flex-wrap:wrap; gap:5px; }
figure { margin:0; }figure a,figure img { display:block; }figure img { width:100%; height:auto; }
figcaption { font-size:13px; color:var(--muted); padding:19px 26px; border-top:1px solid var(--edge); }
noscript p { padding-inline:26px; }
.claude-section { padding-block:70px; background:var(--paper); border-block:1px solid var(--edge); }
.claude-layout,.about { display:grid; grid-template-columns:1fr 1fr; gap:90px; }
.claude-layout>div>p { color:var(--muted); max-width:46ch; }
.claude-details article+article { margin-top:30px; }
.claude-details h3 { font-size:23px; }.claude-details p { color:var(--muted); font-size:15px; }
.review-note { border-top:1px solid var(--edge); padding-top:24px; font-size:13px!important; }
.about { padding-block:80px; }.about p { color:var(--muted); }
.reading { padding-top:0; }.reading-links { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.reading-links>a { display:block; border-block-start:1px solid var(--edge); padding-block:25px; text-decoration:none; }.reading-links h3 { font-size:27px; }.reading-links p { color:var(--muted); font-size:15px; }
.reading-links>a:hover h3 { color:#683795; text-decoration:underline; text-underline-offset:6px; }
.text-link { display:inline-block; font-weight:600; font-size:14px; margin-top:12px; }
.closing { border-top:1px solid var(--edge); padding-block:42px 65px; display:flex; justify-content:space-between; gap:25px; align-items:center; }.closing h2 { margin:0; font-size:40px; }.closing>a { font-weight:650; }
.site-footer { background:var(--paper); border-top:1px solid var(--edge); padding-block:46px 85px; }
.footer-inner { display:grid; grid-template-columns:1.1fr .7fr 1fr 1fr; gap:35px; }
.footer-intro p { font-size:14px; max-width:23ch; margin-top:19px; margin-bottom:16px; }
.footer-intro>a:last-child { font-size:14px; overflow-wrap:anywhere; }
.site-footer nav { display:flex; flex-direction:column; align-items:start; gap:13px; }
.site-footer h2 { font-size:15px; letter-spacing:0; margin:3px 0 6px; font-weight:700; }
.site-footer nav a { font-size:13px; line-height:1.6; text-decoration:none; }.site-footer nav a:hover { text-decoration:underline; }
.footer-signoff { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--edge); padding-top:25px; font-size:12px; color:var(--muted); }
.bloom-motion-toggle { position:fixed; right:18px; bottom:18px; z-index:110; border:1px solid #d3b5c8; border-radius:24px; padding:10px 15px; background:#fff8fb; color:#513a4d; font:600 12px/1.4 Manrope,Arial,sans-serif; min-height:44px; cursor:pointer; }
.bloom-motion-toggle:disabled { cursor:default; }
@media(max-width:950px) { .wrap,.shell { width:calc(100% - 56px); }.hero { gap:35px; }h1 { font-size:61px; }.site-header nav { gap:16px; font-size:13px; }.section-heading,.claude-layout,.about { gap:40px; }.steps,.reading-links { gap:24px; }.footer-inner { grid-template-columns:1fr 1fr; gap:35px 55px; } }
@media(max-width:700px) { .wrap,.shell { width:calc(100% - 40px); }.site-header { flex-wrap:wrap; padding-block:19px; gap:12px; }.wordmark { font-size:26px; }.site-header nav { width:100%; justify-content:space-between; gap:6px; font-size:12px; }.site-header .login { font-size:12px; padding:8px 12px; }.hero { grid-template-columns:1fr; padding-block:40px 34px; gap:27px; }h1 { font-size:clamp(45px,10.5vw,66px); }.hero-description { font-size:17px; }.hook-flower { width:220px; }.flower-stage { display:flex; align-items:center; gap:20px; }.flower-label { font-size:10px; }#flower-help { max-width:13ch; text-align:left; margin:0; }.hero-art { display:block; }.idea-note,.script-note { padding:25px; }.script-note { border-left:0; border-top:1px solid var(--edge); }.hook-picker { padding:16px; gap:4px; }.hook-picker>span { width:100%; margin:0 0 5px; }.hook-picker button { padding-inline:12px; }.platform-strip { font-size:12px; }.platform-strip p span { margin-inline:5px; }.workflow,.reading { padding-block:50px; }.reading { padding-top:0; }.section-heading,.claude-layout,.about,.steps,.reading-links { display:block; }.section-heading>p { margin-top:24px; }.section-heading { margin-bottom:28px; }.steps article { padding-block:25px; }.steps h3 { font-size:26px; }.step-art { display:none; }.preview-top { display:block; padding:18px; }.preview-top>p { margin-bottom:14px; }.view-buttons { justify-content:space-between; }.view-buttons button { padding-inline:13px; }figcaption { padding:18px; }.claude-section { padding-block:45px; }.claude-details { margin-top:30px; }.about { padding-block:50px; }.reading-links>a { padding-block:23px; }.closing { display:block; padding-block:35px 50px; }.closing h2 { font-size:34px; margin-bottom:20px; }.site-footer { padding-block:35px 85px; }.footer-inner { gap:35px 22px; }.footer-intro { grid-column:1/-1; }.footer-signoff { font-size:11px; }.bloom-motion-toggle { right:12px; bottom:12px; } }
@media(max-width:390px) { .site-header nav { font-size:11px; }.site-header .login { font-size:11px; padding-inline:9px; }.hero-art p { font-size:21px; }.hook-flower { width:190px; }.flower-stage { gap:14px; }.view-buttons button { font-size:12px; padding-inline:9px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.hook-flower img { transition:none; } }
@media print { bloom-atmosphere,.bloom-motion-toggle,.site-header,.site-footer { display:none; }html,body { background:white; } }

.pricing { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:72px; padding-block:76px; }
.pricing-label { font-size:14px; font-weight:650; margin-bottom:18px; }
.pricing-intro>p:last-child { max-width:38ch; color:var(--muted); }
.pricing-plan { padding:34px; border:1px solid var(--edge); border-radius:8px 38px 8px 8px; background:var(--paper); }
.pricing-plan h3 { font-size:23px; margin-bottom:20px; }
.plan-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:12px; margin-bottom:5px; }
.plan-price strong { font-size:clamp(48px,5vw,64px); font-weight:650; line-height:1; letter-spacing:-.06em; color:var(--heading); }
.plan-price span { font-size:16px; }
.plan-billing { font-size:12px; margin-bottom:27px; color:var(--muted); }
.pricing-plan ul { list-style:none; padding:0; margin:0 0 26px; }
.pricing-plan li { padding:12px 0; border-top:1px solid var(--edge); font-size:14px; line-height:1.6; }
.pricing-plan .button { width:100%; }
.pricing-plan .plan-note { font-size:12px; line-height:1.7; margin:18px 0 0; color:var(--muted); }
@media(max-width:800px) { .pricing { grid-template-columns:1fr; gap:28px; padding-block:50px; }.pricing-plan { padding:26px; max-width:580px; }.site-header nav { flex-wrap:wrap; } }