:root{color-scheme:light;font-family:Avenir Next,Trebuchet MS,Gill Sans,sans-serif;--display-font: "Avenir Next Condensed", "Futura Condensed ExtraBold", "Arial Narrow", "Impact", sans-serif;--body-font: "Avenir Next", "Trebuchet MS", "Gill Sans", sans-serif;--bg-top: #fff8e9;--bg-mid: #ffeab8;--bg-bottom: #ffd96e;--ink: #111111;--ink-muted: #3b404a;--ink-soft: #646b77;--accent: #0c1523;--accent-soft: #83e7ff;--accent-warm: #ffd399;--paper: rgba(255, 249, 239, .86);--paper-strong: rgba(255, 248, 234, .96);--panel-border: #1d2430;--line-soft: rgba(29, 36, 48, .1);--shadow-lg: 0 26px 60px rgba(12, 21, 35, .14);--shadow-md: 0 16px 32px rgba(12, 21, 35, .1);--offset-shadow-lg: 10px 10px 0 rgba(12, 21, 35, .82);--offset-shadow-md: 7px 7px 0 rgba(12, 21, 35, .78);--offset-shadow-sm: 5px 5px 0 rgba(12, 21, 35, .72);--radius-xl: 34px;--radius-lg: 28px;--radius-md: 20px;--radius-pill: 999px;--max-width: 1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;font-family:var(--body-font);color:var(--ink);background:radial-gradient(circle at top,rgba(255,255,255,.8),transparent 28rem),radial-gradient(circle at 88% 18%,rgba(255,255,240,.46),transparent 17rem),radial-gradient(circle at 22% 82%,rgba(255,241,189,.28),transparent 20rem),linear-gradient(120deg,rgba(132,230,255,.1),transparent 28%),linear-gradient(180deg,var(--bg-top) 0%,var(--bg-mid) 48%,var(--bg-bottom) 100%)}a{color:inherit}img,svg{display:block;max-width:100%}::selection{background:#ffddabc2}.skip-link{position:absolute;left:20px;top:-48px;z-index:50;padding:12px 16px;border-radius:14px;background:var(--accent);color:#fff8eb;text-decoration:none}.skip-link:focus{top:18px}.site-shell{position:relative;width:min(calc(100% - 32px),var(--max-width));margin:0 auto;padding:26px 0 44px}.ambient{position:fixed;inset:auto;pointer-events:none;border-radius:999px;filter:blur(42px);opacity:.44}.ambient-a{top:72px;right:max(4vw,calc((100vw - var(--max-width)) / 3));width:17rem;height:17rem;background:#fffcf4b8}.ambient-b{bottom:96px;left:max(2vw,calc((100vw - var(--max-width)) / 4));width:18rem;height:18rem;background:#80e7ff2e}.hero,.section,.site-footer{position:relative;z-index:1}.brand,.footer-brand{display:inline-flex;align-items:center;gap:14px;min-width:0;text-decoration:none}.brand-copy,.footer-brand span{display:grid;gap:2px}.brand-copy strong{font-size:.98rem;line-height:1.1}.brand-copy span{color:var(--ink-soft);font-size:.82rem}.brand-glyph{position:relative;display:inline-grid;place-items:center;width:52px;height:52px;flex-shrink:0;border-radius:18px;background:linear-gradient(180deg,#101c2d,#07101a);box-shadow:inset 0 1px #ffffff14,var(--offset-shadow-sm),0 12px 28px #0c152329;overflow:hidden}.brand-glyph-small{width:38px;height:38px;border-radius:14px}.brand-glyph-glow,.brand-glyph-orb,.brand-glyph-sheen{position:absolute;display:grid;place-items:center}.brand-glyph-glow{width:76%;height:76%;border-radius:50%;background:radial-gradient(circle,#81e5ffd1,#81e5ff33 38%,#81e5ff00 72%);filter:blur(8px)}.brand-glyph-orb{width:52%;height:52%;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fffffff5,#effafff5 18%,#a9f0fff0 42%,#66d3ffe6 72%,#214781eb);box-shadow:inset -8px -10px 16px #0c15233d,0 12px 18px #040a1438}.brand-glyph-sheen{top:28%;left:31%;width:26%;height:12%;border-radius:999px;background:#ffffffbd;filter:blur(1.6px);transform:rotate(-20deg)}.hero{padding:4px 0 22px}.hero-top-space{height:48px}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:44px;align-items:center}.hero-copy{max-width:34rem}.eyebrow,.section-kicker,.step-eyebrow{margin:0;color:var(--ink-muted);font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.hero-title{margin:12px 0 0;display:inline-flex;align-items:baseline;flex-wrap:nowrap;font-family:var(--display-font);font-size:clamp(3.8rem,8vw,6.1rem);line-height:.88;letter-spacing:-.07em;text-transform:uppercase;color:var(--ink);white-space:nowrap}.hero-title-word{display:block}.hero-title-to{display:inline-block;margin-left:.18em;margin-right:.08em;padding-right:0}.hero-title-video{display:inline-block;padding:.04em .2em .12em;border-radius:20px;background:linear-gradient(180deg,#101c2d,#07101a);color:#fff8eb;box-shadow:8px 8px #76dff7f0,0 14px 32px #0c152329}.hero-text,.section-copy,.step-card p,.faq-item p,.footer-meta{color:var(--ink-muted);line-height:1.65}.hero-text{max-width:33ch;margin:18px 0 0;font-size:1.04rem}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 22px;border-radius:var(--radius-pill);border:2px solid var(--accent);font-weight:700;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease}.button:hover,.feature-card:hover,.faq-item:hover,.footer-links a:hover{transform:translateY(-1px)}.button-primary{background:linear-gradient(180deg,#101c2d,#07101a);color:#fff8eb;box-shadow:var(--offset-shadow-md),0 18px 36px #0c152329}.button-secondary{background:#fff9efcc;color:var(--ink-muted);box-shadow:var(--offset-shadow-sm),0 14px 28px #0c152314}.button-icon{width:1rem;height:1rem;fill:currentColor}.format-pill{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid rgba(19,23,32,.08);background:#fffbf3ad;color:var(--ink-muted);font-size:.92rem}.hero-stage{position:relative}.scene-frame{position:relative;min-height:520px;border-radius:var(--radius-xl);border:3px solid var(--panel-border);background:linear-gradient(180deg,#ffffff8a,#fff7e9ad),var(--paper);box-shadow:var(--offset-shadow-lg),var(--shadow-lg);overflow:hidden}.scene-frame:before{content:"";position:absolute;inset:24px;border-radius:28px;background:radial-gradient(circle at 82% 18%,rgba(131,231,255,.18),transparent 12rem),radial-gradient(circle at 14% 84%,rgba(255,221,158,.44),transparent 12rem)}.scene-frame:after{content:"";position:absolute;inset:26px;border-radius:28px;border:2px dashed rgba(29,36,48,.12)}.mockup-card{position:absolute;overflow:hidden;border-radius:24px;border:3px solid var(--panel-border);background:linear-gradient(180deg,var(--paper-strong) 0%,rgba(255,244,224,.96) 100%);box-shadow:var(--offset-shadow-md),var(--shadow-md)}.scene-editor{top:48px;left:34px;width:min(58%,312px);transform:rotate(-2deg)}.scene-preview{top:78px;right:34px;width:min(52%,276px);transform:rotate(1.8deg)}.scene-export{right:66px;bottom:42px;width:min(56%,304px);transform:rotate(-1.6deg)}.mockup-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:42px;padding:0 16px;background:#101b2c;color:#fff3dd}.mockup-controls{display:inline-flex;gap:8px}.mockup-controls span{width:8px;height:8px;border-radius:50%;background:#fff7ebe6}.mockup-label{margin-left:auto;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.editor-lines,.export-stack{display:grid;gap:10px;padding:18px}.editor-lines{min-height:212px}.code-line{color:#516172;font-family:SF Mono,IBM Plex Mono,JetBrains Mono,monospace;font-size:.82rem;white-space:nowrap}.code-line-strong{color:var(--ink)}.code-line-indent{padding-left:18px}.token-angle{color:#0b6f8d}.token-attr{color:#82521f}.token-value{color:#8a3b32}.preview-canvas{position:relative;min-height:226px;isolation:isolate;background:#0c1523}.checkerboard{position:absolute;inset:0;background-image:linear-gradient(45deg,rgba(255,255,255,.08) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.08) 75%,rgba(255,255,255,.08)),linear-gradient(45deg,rgba(255,255,255,.08) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.08) 75%,rgba(255,255,255,.08));background-position:0 0,12px 12px;background-size:24px 24px}.preview-radial,.preview-core,.preview-ring,.preview-wave{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.preview-radial{border-radius:50%}.preview-radial-a{width:176px;height:176px;background:radial-gradient(circle,#83e7ffb8,#83e7ff00 68%);filter:blur(8px)}.preview-radial-b{width:224px;height:224px;background:radial-gradient(circle,#ffd3996b,#ffd39900 74%);filter:blur(14px)}.preview-ring{width:148px;height:148px;border:3px solid rgba(131,231,255,.78);border-radius:50%;box-shadow:0 0 0 6px #ffd69614}.preview-core{width:78px;height:78px;border-radius:50%;background:radial-gradient(circle at 50% 36%,#ffffffeb,#7de6ff2e 70%);box-shadow:0 0 36px #83e7ff47}.preview-wave{width:176px;height:78px;border-top:2px solid rgba(255,211,153,.82);border-radius:50%;transform-origin:center}.preview-wave-a{transform:translate(-50%,-50%) rotate(14deg)}.preview-wave-b{transform:translate(-50%,-50%) rotate(-24deg)}.format-row{display:flex;flex-wrap:wrap;gap:8px}.format-pill{min-height:32px;padding:0 12px;font-size:.78rem}.format-pill-active{background:#101b2c;color:#fff3dd}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--ink-muted);font-size:.92rem}.toggle{display:inline-flex;align-items:center;width:46px;padding:3px;border-radius:999px;background:#131b2c24}.toggle span{width:18px;height:18px;border-radius:50%;background:#fffdf8;box-shadow:0 2px 6px #0c152329}.toggle-on{justify-content:flex-end;background:#0c1523db}.progress-track{position:relative;height:8px;border-radius:999px;background:#0c152314;overflow:hidden}.progress-fill{display:block;width:68%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#80e7ff,#ffd399)}.export-button{display:grid;place-items:center;min-height:42px;border-radius:16px;background:linear-gradient(180deg,#101c2d,#07101a);color:#fff8eb;font-weight:700}.section{margin-top:88px}.section-heading{max-width:46rem;margin-bottom:28px}.section-heading h2,.step-card h3,.faq-item summary{margin:0;color:var(--ink)}.section-heading h2{margin-top:10px;font-size:clamp(2.1rem,5vw,3.35rem);line-height:.98;letter-spacing:-.06em}.section-heading-compact h2{font-size:clamp(1.9rem,4.4vw,2.8rem)}.section-copy{margin:14px 0 0;max-width:none}.workflow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.step-card{display:grid;gap:18px;min-height:100%;padding:22px;border-radius:var(--radius-lg);border:3px solid var(--panel-border);background:linear-gradient(180deg,#ffffffa8,#fff7e9c2),var(--paper);box-shadow:var(--offset-shadow-md),var(--shadow-md);animation:card-rise .7s ease both}.step-card .mockup-card{position:relative;inset:auto;width:100%;min-height:0;box-shadow:none}.step-card .editor-lines{min-height:192px}.step-card .preview-canvas{min-height:200px}.step-card h3{margin-top:8px;font-size:1.42rem;line-height:1.04;letter-spacing:-.04em}.step-card p{margin:10px 0 0}.feature-section{display:grid;gap:18px}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.feature-card{--feature-tilt: 0deg;display:grid;gap:10px;padding:20px;border-radius:24px;border:3px solid var(--panel-border);background:linear-gradient(180deg,#ffffffb8,#fff7e9d1),var(--paper);box-shadow:var(--offset-shadow-md),var(--shadow-md);transform:translateY(0) rotate(var(--feature-tilt));transition:transform .16s ease,box-shadow .16s ease}.feature-card:nth-child(2n){--feature-tilt: -.8deg}.feature-card:nth-child(odd){--feature-tilt: .8deg}.feature-card:hover{transform:translateY(-2px) rotate(0);box-shadow:9px 9px #0c1523d1,0 18px 36px #0c15231f}.feature-index,.feature-meta{display:inline-flex;align-items:center;width:fit-content;min-height:30px;padding:0 12px;border-radius:var(--radius-pill);border:2px solid var(--panel-border);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.feature-index{background:linear-gradient(180deg,#101c2d,#07101a);color:#fff8eb}.feature-card h3{margin:0;font-size:1.22rem;line-height:1.05;letter-spacing:-.03em}.feature-card p{margin:0;color:var(--ink-muted);line-height:1.55}.feature-meta{background:#fff8e8eb;color:var(--ink-muted)}.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.faq-item{align-self:start;padding:20px 22px;border-radius:var(--radius-md);border:3px solid var(--panel-border);background:linear-gradient(180deg,#fff9,#fff7e9b8),var(--paper);box-shadow:var(--offset-shadow-sm),0 12px 30px #0c152317}.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none;font-size:1.06rem;font-weight:700;line-height:1.2}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";flex-shrink:0;color:var(--ink-soft);font-size:1.2rem}.faq-item[open] summary:after{content:"–"}.faq-item p{margin:12px 0 0}.site-footer{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:16px 22px;margin-top:88px;padding:26px 0 12px;border-top:2px solid var(--line-soft)}.footer-links{display:flex;flex-wrap:wrap;gap:14px}.footer-links a{text-decoration:none;font-weight:600}.footer-meta{justify-self:end;margin:0}@keyframes card-rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes halo-drift{0%,to{transform:translate(-50%,-50%) scale(.96)}50%{transform:translate(-50%,-50%) scale(1.05)}}@keyframes ring-spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.preview-radial-a,.preview-core{animation:halo-drift 5.4s ease-in-out infinite}.preview-ring{animation:ring-spin 14s linear infinite}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:1080px){.hero-grid{grid-template-columns:1fr}.hero-copy{max-width:100%}.hero-text{max-width:46ch}.hero-stage{max-width:620px}.feature-grid,.workflow-grid,.faq-grid{grid-template-columns:1fr}}@media(max-width:760px){.site-shell{width:min(calc(100% - 22px),var(--max-width));padding-top:16px}.site-footer{grid-template-columns:1fr;justify-items:start}.hero-title{font-size:clamp(2.2rem,11vw,4rem)}.hero-actions{flex-direction:column;align-items:stretch}.button{width:100%}.scene-frame{min-height:540px}.scene-editor,.scene-preview,.scene-export{width:auto;transform:none}.scene-editor{top:24px;left:18px;right:68px}.scene-preview{top:168px;left:72px;right:18px}.scene-export{right:22px;left:40px;bottom:20px}.footer-meta{justify-self:start}}
