/* NAOMI dark studio. Canonical palette and font assets belong to landing.css. */
.dark-home { --motion-ease: cubic-bezier(.16,1,.3,1); --hero-soft: #181A23; --accent-soft: #242938; background: var(--bg); }
.dark-home .header { background: #0D0D0DD9; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.dark-home .nav { min-height: 82px; gap: 28px; }
.dark-home .nav-links { font-size: 14px; gap: 25px; }
.dark-home .brand img { width: 172px; }
.dark-home .brand span { font-size: 12px; }
.dark-home .button { min-height: 54px; font-size: 16px; padding-inline: 24px; border-radius: 12px; transition: background .2s, box-shadow .2s, transform .2s; }
.dark-home .button:hover { box-shadow: 0 5px 26px #B6C2FF16; transform: translateY(-2px); }
.dark-home .button:active { transform: none; }
.dark-home .button-small { min-height: 44px; font-size: 14px; padding-inline: 17px; }
.dark-home .link-action { font-size: 15px; gap: 9px; }
.dark-home .link-action svg { width: 20px; height: 20px; }
.dark-home .eyebrow { font-size: 13px; letter-spacing: .05em; }
.header-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--brand); transform: scaleX(var(--page-progress,0)); transform-origin: left; pointer-events: none; }
/* One thesis, then one whole work surface. */
.studio-hero { padding-block: 56px 48px; }
.hero-top { display: grid; grid-template-columns: 1.48fr 1fr; gap: 54px; align-items: start; margin-bottom: 38px; }
.hero-thesis { min-width: 0; }
.hero-kicker { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 14px; line-height: 1.5; margin-bottom: 23px; }
.hero-kicker svg { width: 18px; height: 18px; color: var(--brand); }
.studio-hero h1 { font-size: clamp(42px,5.5vw,74px); letter-spacing: -.06em; line-height: 1.07; margin: 0; }
.studio-hero h1 span { color: var(--brand); }
.hero-definition { font-size: 22px; line-height: 1.35; color: var(--ink); font-weight: 500; padding-top: 4px; }
.hero-lead { font-size: 16px; line-height: 1.65; color: var(--muted); margin-top: 13px; max-width: 420px; }
.hero-actions { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 20px; margin-top: 22px; }
.hero-actions .link-action { font-size: 14px; }
.hero-actions .link-action svg { color: var(--brand); width: 16px; height: 16px; }
.hero-terms { font-size: 13px; color: var(--muted); margin-top: 11px; }
.hero-terms strong { color: var(--ink); font-weight: 500; }
.workbench-perspective { perspective: 1400px; }
.workbench { position: relative; isolation: isolate; border: 1px solid #343743; border-radius: 24px; background: radial-gradient(700px circle at calc(50% + var(--bench-x,0) * 20%) calc(30% + var(--bench-y,0) * 20%), #4E598714, transparent 70%), #131416; box-shadow: 0 25px 60px #0004; overflow: hidden; transform: rotateX(calc(var(--bench-y,0) * -1.25deg)) rotateY(calc(var(--bench-x,0) * 1.25deg)); transition: transform .4s var(--motion-ease); }
.workbench-top { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 0 25px; min-height: 66px; border-bottom: 1px solid var(--line); }
.workbench-top > p { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--muted); line-height: 1.5; }
.live-mark { width: 7px; height: 7px; border: 1px solid var(--brand); border-radius: 50%; box-shadow: 0 0 12px #B6C2FF40; flex: none; }
.preview-tabs { display: flex; gap: 22px; align-self: stretch; }
.preview-tabs button { position: relative; min-height: 54px; padding: 9px 2px; border: 0; background: none; color: var(--muted); font-size: 15px; font-weight: 500; }
.preview-tabs button::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--brand); transform: scaleX(0); transition: transform .3s var(--motion-ease); }
.preview-tabs button[aria-selected=true] { color: var(--ink); }
.preview-tabs button[aria-selected=true]::after { transform: scaleX(1); }
.preview-tabs button:hover:not(:disabled) { color: var(--brand); }
.preview-tabs button:focus-visible { outline-offset: -4px; border-radius: 5px; }
.preview-tabs button:disabled { cursor: default; }
.preview-panel { display: grid; grid-template-columns: 1fr 84px 1.12fr; min-height: 306px; align-items: center; padding: 24px 25px; gap: 0; }
.prompt-side { min-width: 0; padding: 5px 12px 5px 8px; }
.prompt-label { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 14px; }
.prompt-label svg { width: 20px; height: 20px; color: var(--brand); }
.prompt-text { font-size: 20px; line-height: 1.45; color: var(--ink); margin-top: 17px; min-height: 112px; max-width: 460px; }
.prompt-tip { font-size: 13px; color: var(--muted); margin-top: 13px; line-height: 1.6; min-height: 42px; }
.flow-label { display: flex; align-items: center; gap: 8px; color: var(--brand); font-size: 13px; line-height: 1.5; margin-top: 14px; }
.flow-label svg { width: 16px; height: 16px; }
.flow-thread { min-width: 0; display: grid; place-items: center; padding-inline: 8px; }
.flow-thread svg { width: 68px; height: 150px; overflow: visible; }
.thread-base { stroke: #363C55; stroke-width: 1; }
.thread-ink { stroke: var(--brand); stroke-width: 1.5; }
.flow-thread circle { stroke: var(--brand); fill: #B6C2FF; }
.output-side { height: 264px; min-width: 0; border-radius: 17px; position: relative; isolation: isolate; overflow: hidden; }
.travel-output img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; z-index: -2; }
.travel-output::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#0F1A2DEB,#0F1A2D80 55%,#0F1A2D10); z-index: -1; }
.output-content { position: relative; padding: 24px 25px; height: 100%; }
.output-label { display: flex; align-items: center; gap: 8px; color: #D4D8E5; font-size: 12px; line-height: 1.5; margin-bottom: 16px; }
.output-label svg { width: 17px; height: 17px; }
.output-side h2 { color: #F3F5FA; font-size: 31px; line-height: 1.15; letter-spacing: -.045em; margin: 0; }
.route-output { display: flex; flex-wrap: wrap; gap: 7px 18px; max-width: 380px; margin-top: 20px; color: #D0D9E8; font-size: 12px; line-height: 1.5; }
.route-output span { display: inline-flex; align-items: center; gap: 7px; }
.route-output span::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--brand); }
.menu-output { background: #252822; }
.menu-output .output-label { color: #C7D1BC; }
.menu-plate { position: absolute; right: -31px; top: -25px; color: #CAD6B5; opacity: .18; transform: rotate(-17deg); }
.menu-plate svg { width: 240px; height: 240px; stroke-width: .8; }
.menu-plate path { fill: #95AF77; stroke: none; }
.menu-preview { display: grid; gap: 11px; margin-top: 21px; }
.menu-preview > div { display: grid; grid-template-columns: 65px 1fr; gap: 10px; font-size: 12px; line-height: 1.5; }
.menu-preview span { color: #B7C1AE; }
.menu-preview b { font-weight: 400; color: #DCE3D5; }
.project-output { background: linear-gradient(125deg,#272B44,#191D2C); }
.project-preview { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 22px; font-size: 12px; color: #CDD3ED; }
.project-preview > span { display: flex; align-items: center; gap: 7px; }
.project-preview svg { width: 17px; height: 17px; color: var(--brand); }
.workbench-foot { display: flex; justify-content: space-between; align-items: start; gap: 30px; margin-top: 17px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.workbench-foot p:last-child { display: flex; align-items: center; gap: 7px; flex: none; color: var(--ink); }
.workbench-foot svg { width: 15px; height: 15px; color: var(--brand); }
/* Sequential start; numbers describe actual steps, with no card grid. */
.how-section { padding-block: 78px 82px; background: #141416; border-block: 1px solid var(--line); }
.section-heading { max-width: 780px; }
.section-label { display: flex; align-items: center; gap: 9px; color: var(--brand); font-size: 13px; letter-spacing: .02em; margin-bottom: 20px; line-height: 1.5; }
.section-label svg { width: 20px; height: 20px; }
.section-heading h2 { font-size: clamp(35px,4.2vw,54px); line-height: 1.12; letter-spacing: -.05em; }
.section-heading h2 > span { color: var(--muted); }
.section-heading > p:last-child { font-size: 18px; line-height: 1.7; color: var(--muted); max-width: 740px; margin-top: 24px; }
.how-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 45px; margin-top: 53px; }
.how-steps article { min-width: 0; border-top: 1px solid #36363E; padding-top: 22px; }
.how-step-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.how-step-top > span { color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.how-step-top svg { width: 31px; height: 31px; color: var(--brand); stroke-width: 1.25; }
.how-steps h3 { font-size: 25px; line-height: 1.25; margin-bottom: 17px; }
.how-steps p { font-size: 16px; line-height: 1.7; color: var(--muted); max-width: 350px; }
.how-steps .link-action { color: var(--ink); margin-top: 18px; }
.step-note { display: block; font-size: 13px; color: var(--brand); margin-top: 20px; line-height: 1.7; }
/* Two broad editorial scenes, each with one dominant visual and a request list. */
.usecases { padding-block: 86px 76px; }
.cases-heading { max-width: none; }
.audience-links { display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 31px; }
.audience-links a { display: flex; align-items: center; gap: 11px; min-height: 44px; font-size: 17px; font-weight: 500; }
.audience-links svg { color: var(--brand); width: 22px; height: 22px; }
.audience-links a > span { color: var(--muted); margin-left: 6px; }
.audience-links a:hover { color: var(--brand); }
.audience-links button {
 display: inline-flex; align-items: center; justify-content: center; gap: 10px;
 min-height: 54px; padding: 13px 20px; border: 1px solid var(--line); border-radius: 14px;
 background: var(--surface); color: var(--muted); font: 500 17px/1.4 Onest,Arial,sans-serif;
 transition: color .2s, background .2s, border-color .2s;
}
.audience-links button svg { color: currentColor; }
.audience-links button[aria-selected=true] { color: var(--ink); background: var(--brand-tint); border-color: var(--brand-line); }
.audience-links button:hover:not(:disabled) { color: var(--brand); border-color: var(--brand-line); }
.audience-links button:disabled { cursor: default; }
.audience-stage[data-audience-ready] { display: grid; isolation: isolate; }
.audience-stage[data-audience-ready] .audience-panel { grid-area: 1 / 1; align-self: start; }
.audience-stage[data-audience-ready] .audience-panel:not(.is-current) { visibility: hidden; pointer-events: none; }
.audience-stage[aria-busy=true] { pointer-events: none; }
.audience-stage[data-audience-ready] .audience-panel:not(.is-current) .material { animation: none; }
.usecase-row { display: grid; grid-template-columns: 1fr 1fr; gap: 75px; align-items: center; padding-block: 62px; border-bottom: 1px solid var(--line); scroll-margin-top: 96px; }
.usecase-copy { min-width: 0; }
.usecase-copy .section-label { margin-bottom: 18px; }
.usecase-copy h3 { font-size: 41px; line-height: 1.14; letter-spacing: -.045em; }
.usecase-copy > p:not(.section-label) { font-size: 17px; color: var(--muted); line-height: 1.7; margin-top: 21px; max-width: 520px; }
.case-requests { margin-top: 30px; }
.case-requests details { border-top: 1px solid var(--line); }
.case-requests details:last-child { border-bottom: 1px solid var(--line); }
.case-requests summary { display: flex; align-items: center; gap: 13px; list-style: none; min-height: 67px; font-size: 16px; font-weight: 500; line-height: 1.5; padding-block: 13px; }
.case-requests summary::-webkit-details-marker { display: none; }
.case-requests summary svg { width: 23px; height: 23px; color: var(--muted); stroke-width: 1.35; }
.case-requests summary > span { margin-left: auto; color: var(--muted); font-weight: 400; font-size: 24px; transition: transform .25s; }
.case-requests details[open] summary { color: var(--brand); }
.case-requests details[open] summary svg { color: var(--brand); }
.case-requests details[open] summary > span { transform: rotate(45deg); }
.case-requests summary:hover { color: var(--brand); }
.case-requests details > p { font-size: 15px; line-height: 1.8; color: var(--muted); padding: 0 22px 23px 36px; }
.personal-visual { height: 480px; min-width: 0; position: relative; isolation: isolate; overflow: hidden; border-radius: 24px; border: 1px solid #333B4B; }
.personal-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 58% 50%; z-index: -2; }
.personal-visual::before { content: ''; position: absolute; inset: 0; background: linear-gradient(#0A11271F 20%,#0A1127DB); z-index: -1; }
.personal-visual-copy { position: absolute; left: 33px; right: 33px; bottom: 31px; color: #F0F3FA; }
.personal-visual-copy > span { font-size: 13px; color: #CBD4E7; }
.personal-visual-copy > p { font: 500 30px/1.24 'Golos Text',Arial,sans-serif; letter-spacing: -.035em; margin-top: 13px; }
.personal-visual-copy > div { display: flex; align-items: center; gap: 10px; padding-top: 19px; border-top: 1px solid #CCD4F23D; margin-top: 25px; font-size: 14px; color: #DAE1F0; }
.personal-visual-copy svg { color: var(--brand); width: 22px; height: 22px; }
.business-visual { position: relative; isolation: isolate; min-width: 0; height: 450px; background: radial-gradient(ellipse at 45% 45%,#444B773D,transparent 68%); }
.business-orbit { position: absolute; inset: 0; z-index: -1; }
.business-orbit svg { width: 100%; height: 100%; stroke-width: .8; }
.orbit-line { stroke: #737FAD60; }
.orbit-inner { stroke: #B6C2FF45; stroke-dasharray: 5 7; }
.idea-core { display: flex; align-items: center; gap: 10px; position: absolute; left: 37%; top: 41%; padding: 13px 17px; border: 1px solid #696F90; border-radius: 40px; background: #23263B; color: var(--ink); font-size: 14px; box-shadow: 0 0 60px #B6C2FF0B; }
.idea-core svg { width: 22px; height: 22px; color: var(--brand); }
.material { position: absolute; display: flex; align-items: start; gap: 14px; padding: 25px 25px 30px; border: 1px solid #414658; border-radius: 14px; background: linear-gradient(145deg,#242631,#191A20); box-shadow: 0 10px 45px #0003; }
.material > svg { color: var(--brand); width: 24px; height: 24px; }
.material span { font-size: 12px; color: var(--muted); display: block; margin-bottom: 10px; }
.material b { font: 500 23px/1.2 'Golos Text',Arial,sans-serif; letter-spacing: -.035em; }
.material-plan { top: 15px; left: 24px; width: 285px; transform: rotate(-5deg); }
.material-slide { right: 0; top: 186px; width: 272px; transform: rotate(4deg); }
.material-page { left: 12px; bottom: 15px; width: 297px; transform: rotate(-3deg); }
.case-disclosure { font-size: 13px; color: var(--muted); margin-top: 24px; line-height: 1.8; }
/* Real, published media remains distinct from authored examples. */
.dark-home .demonstration { padding-block: 80px 67px; background: #141416; }
.dark-home .demo-head { gap: 55px; align-items: start; }
.dark-home .demo-head h2 { font-size: 48px; line-height: 1.1; }
.dark-home .demo-head > p { font-size: 17px; }
.dark-home .demo-tabs { margin-top: 34px; }
.dark-home .demo-tabs button { min-height: 54px; font-size: 14px; }
.dark-home .demo-story { border-radius: 18px; }
.dark-home .demo-description { min-height: 135px; }
.dark-home .demo-description h3 { font-size: 26px; }
.dark-home .demo-description p { font-size: 16px; }
.dark-home .demo-note, .dark-home .demo-disclosure { font-size: 13px; }
.start-strip { display: grid; grid-template-columns: 1.3fr 1fr; gap: 100px; align-items: center; padding-block: 88px 67px; }
.start-strip h2 { font-size: 44px; line-height: 1.15; }
.start-strip > div > p:last-child { font-size: 17px; line-height: 1.7; color: var(--muted); margin-top: 24px; max-width: 530px; }
.start-strip aside { border-left: 1px solid var(--line); padding-left: 38px; }
.start-strip aside > span { font-size: 14px; color: var(--muted); }
.start-strip aside > strong { display: block; font: 500 65px/1.1 'Golos Text',Arial,sans-serif; letter-spacing: -.05em; color: var(--brand); margin: 13px 0 18px; }
.start-strip aside p { font-size: 14px; line-height: 1.8; color: var(--muted); max-width: 360px; }
.dark-home .downloads { padding-block: 24px 77px; }
.dark-home .downloads .section-head { max-width: 760px; }
.dark-home .downloads .section-head h2 { font-size: 44px; }
.dark-home .download-grid { gap: 22px; }
.dark-home .download-card { display: flex; flex-direction: column; padding: 27px; border-radius: 18px; }
.dark-home .download-card h3 { font-size: 28px; margin-top: 20px; }
.dark-home .download-card > p { min-height: 80px; font-size: 13px; line-height: 1.8; margin-bottom: 23px; }
.dark-home .download-card > .download-link, .download-platform-actions { margin-top: auto; }
.download-platform-actions { display: grid; gap: 11px; }
.dark-home .download-card .button { min-height: 54px; width: 100%; padding-inline: 10px; font-size: 14px; }
.dark-home .download-card .install-help { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; font-size: 13px; }
.dark-home .os-status, .dark-home .download-after { font-size: 13px; }
.dark-home .faq { padding-block: 12px 72px; }
.dark-home .faq summary { min-height: 64px; font-size: 17px; }
.dark-home .faq details p { font-size: 16px; }
.studio-final { padding-block: 82px 86px; text-align: center; border-top: 1px solid var(--line); background: radial-gradient(ellipse at 50% 100%,#353B601F,transparent 70%),#111113; }
.studio-final .section-label { justify-content: center; }
.studio-final h2 { font-size: clamp(40px,6.6vw,79px); line-height: 1.04; letter-spacing: -.06em; }
.studio-final h2 > span { color: var(--brand); }
.studio-final p:not(.section-label) { font-size: 18px; line-height: 1.7; color: var(--muted); margin: 25px auto 30px; max-width: 640px; }
/* Choreography is finite and describes the move from request to material. */
.motion-ready .hero-kicker { animation: studio-arrive .6s var(--motion-ease) both; }
.motion-ready .hero-thesis h1 { animation: studio-arrive .8s var(--motion-ease) .06s both; }
.motion-ready .hero-explanation { animation: studio-arrive .8s var(--motion-ease) .13s both; }
.motion-ready .workbench-perspective { animation: studio-arrive .95s var(--motion-ease) .2s both; }
.motion-ready .preview-panel.is-active .prompt-text { animation: studio-arrive .45s var(--motion-ease) both; }
.motion-ready .preview-panel.is-active .thread-ink { stroke-dasharray: 1; animation: studio-thread .9s var(--motion-ease) .08s both; }
.motion-ready .preview-panel.is-active .output-content { animation: studio-arrive .6s var(--motion-ease) .15s both; }
.motion-ready .motion-enter { transition: opacity .65s var(--motion-ease), transform .65s var(--motion-ease); }
.motion-ready .motion-enter:not(.is-revealed) { opacity: 0; transform: translateY(20px); }
.motion-ready .motion-enter:focus-within { opacity: 1; transform: none; }
.motion-ready .business-visual.is-revealed .material-plan { animation: material-plan-in .85s var(--motion-ease) both; }
.motion-ready .business-visual.is-revealed .material-slide { animation: material-slide-in .85s var(--motion-ease) .12s both; }
.motion-ready .business-visual.is-revealed .material-page { animation: material-page-in .85s var(--motion-ease) .24s both; }
.motion-paused [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
.motion-paused .workbench { transform: none !important; transition: none !important; }
.motion-paused .header-progress { transform: scaleX(0); }
.motion-paused .studio-hero *, .motion-paused .material { animation: none !important; }
@keyframes studio-arrive { from { opacity: 0; transform: translateY(13px); } to { opacity: 1; transform: translateY(0); } }
@keyframes studio-thread { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes material-plan-in { from { opacity: 0; transform: translateY(24px) rotate(-9deg); } to { opacity: 1; transform: rotate(-5deg); } }
@keyframes material-slide-in { from { opacity: 0; transform: translateY(24px) rotate(8deg); } to { opacity: 1; transform: rotate(4deg); } }
@keyframes material-page-in { from { opacity: 0; transform: translateY(24px) rotate(-7deg); } to { opacity: 1; transform: rotate(-3deg); } }
@media (max-width:1100px) {
 .dark-home .nav { gap: 20px; }
 .dark-home .nav-links { gap: 17px; font-size: 13px; }
 .dark-home .brand img { width: 150px; }
 .hero-top { grid-template-columns: 1.34fr 1fr; gap: 35px; }
 .studio-hero h1 { font-size: 57px; }
 .hero-definition { font-size: 21px; }
 .hero-actions { gap: 9px 16px; }
 .prompt-text { font-size: 18px; }
 .preview-panel { grid-template-columns: 1fr 64px 1.08fr; }
 .flow-thread svg { width: 50px; }
 .output-side h2 { font-size: 28px; }
 .usecase-row { gap: 45px; }
 .usecase-copy h3 { font-size: 36px; }
 .material { padding: 21px; }
 .material-plan { width: 247px; }
 .material-slide { width: 230px; }
 .material-page { width: 250px; }
 .material b { font-size: 21px; }
 .start-strip { gap: 65px; }
}
@media (max-width:900px) {
 .dark-home .brand span { display: none; }
 .dark-home .brand img { width: 140px; }
 .studio-hero { padding-top: 39px; }
 .hero-top { grid-template-columns: 1fr; gap: 29px; }
 .studio-hero h1 { font-size: 64px; }
 .hero-explanation { display: grid; grid-template-columns: 1fr 1.2fr; column-gap: 32px; }
 .hero-definition { grid-row: 1 / 3; }
 .hero-lead { margin-top: 0; max-width: none; }
 .hero-actions { grid-column: 2; margin-top: 16px; }
 .hero-terms { grid-column: 2; }
 .preview-panel { grid-template-columns: 1fr 42px 1.08fr; padding: 19px; }
 .workbench-top { padding-inline: 19px; }
 .workbench-top > p { font-size: 12px; max-width: 300px; }
 .preview-tabs { gap: 15px; }
 .prompt-side { padding-left: 0; }
 .prompt-text { font-size: 17px; min-height: 125px; }
 .prompt-tip { min-height: 60px; font-size: 12px; }
 .flow-label { font-size: 12px; }
 .flow-thread { padding: 0; }
 .flow-thread svg { width: 33px; }
 .output-content { padding: 23px 20px; }
 .output-side { height: 281px; }
 .output-side h2 { font-size: 26px; }
 .route-output { margin-top: 18px; gap: 6px; }
 .how-steps { gap: 30px; }
 .how-steps h3 { font-size: 22px; }
 .how-steps p { font-size: 15px; }
 .usecase-row { gap: 32px; }
 .usecase-copy h3 { font-size: 31px; }
 .usecase-copy > p:not(.section-label) { font-size: 16px; }
 .case-requests summary { font-size: 15px; gap: 9px; }
 .case-requests details > p { font-size: 14px; padding-left: 0; }
 .personal-visual { height: 485px; }
 .personal-visual-copy { left: 24px; right: 24px; }
 .personal-visual-copy > p { font-size: 25px; }
 .business-visual { height: 410px; }
 .material-plan { width: 214px; left: 12px; }
 .material-slide { width: 207px; top: 170px; }
 .material-page { width: 228px; }
 .material b { font-size: 18px; }
 .material span { font-size: 11px; }
 .material > svg { width: 19px; height: 19px; }
 .idea-core { left: 31%; font-size: 12px; }
 .dark-home .demo-head h2 { font-size: 39px; }
 .dark-home .demo-head { gap: 30px; }
 .dark-home .demo-head > p { font-size: 16px; }
 .start-strip { gap: 42px; }
 .start-strip h2 { font-size: 36px; }
 .start-strip aside { padding-left: 29px; }
 .dark-home .download-card { padding: 23px; }
 .dark-home .download-card .button { font-size: 12px; }
}
@media (max-width:700px) {
 .dark-home .nav { min-height: 68px; }
 .dark-home .nav-links { top: 68px; }
 .dark-home .nav-links a { font-size: 16px; }
 .dark-home .brand img { width: 148px; }
 .studio-hero { padding-block: 30px 35px; }
 .hero-top { gap: 24px; margin-bottom: 27px; }
 .hero-kicker { font-size: 13px; margin-bottom: 20px; }
 .studio-hero h1 { font-size: clamp(35px,8.9vw,53px); line-height: 1.1; }
 .hero-explanation { display: block; }
 .hero-definition { font-size: 20px; padding: 0; }
 .hero-lead { font-size: 16px; margin-top: 13px; line-height: 1.6; }
 .hero-actions { gap: 9px 20px; margin-top: 20px; }
 .hero-actions .button { flex: 0 0 100%; width: 100%; }
 .hero-actions .link-action { font-size: 13px; }
 .hero-terms { font-size: 12px; margin-top: 8px; }
 .workbench { border-radius: 18px; }
 .workbench-top { flex-direction: column; align-items: stretch; gap: 3px; padding: 15px 20px 0; }
 .workbench-top > p { font-size: 12px; max-width: none; }
 .preview-tabs { justify-content: space-between; gap: 15px; }
 .preview-tabs button { font-size: 15px; min-height: 51px; flex: 1; }
 .preview-panel { grid-template-columns: 1fr; min-height: 610px; padding: 21px 18px 18px; }
 .prompt-side { padding: 0 3px; }
 .prompt-label { font-size: 13px; }
 .prompt-text { min-height: 135px; margin-top: 14px; font-size: 18px; line-height: 1.45; }
 .prompt-tip { min-height: 42px; font-size: 12px; margin-top: 4px; }
 .flow-label { font-size: 12px; margin-top: 10px; margin-bottom: 23px; }
 .flow-thread { display: none; }
 .output-side { height: 288px; border-radius: 13px; }
 .output-content { padding: 22px; }
 .output-side h2 { font-size: 29px; }
 .route-output { font-size: 12px; gap: 6px 15px; margin-top: 18px; }
 .workbench-foot { display: block; margin-top: 13px; font-size: 12px; }
 .workbench-foot p:last-child { margin-top: 10px; }
 .how-section { padding-block: 53px; }
 .section-label { font-size: 13px; margin-bottom: 18px; }
 .section-heading h2 { font-size: 35px; }
 .section-heading > p:last-child { font-size: 17px; margin-top: 21px; }
 .how-steps { grid-template-columns: 1fr; gap: 35px; margin-top: 35px; }
 .how-step-top { margin-bottom: 19px; }
 .how-steps h3 { font-size: 25px; }
 .how-steps p { font-size: 16px; max-width: none; }
 .how-steps .link-action { margin-top: 12px; }
 .step-note { margin-top: 14px; }
 .usecases { padding-block: 54px; }
 .audience-links { gap: 15px; display: grid; margin-top: 27px; }
 .audience-links a { font-size: 17px; }
 .audience-links[role=tablist] { display: grid; grid-template-columns: 1fr 1.5fr; gap: 9px; }
 .audience-links button { font-size: 15px; padding: 12px 10px; min-height: 58px; }
 .audience-links button svg { display: none; }
 .usecase-row { grid-template-columns: 1fr; gap: 30px; padding-block: 43px; scroll-margin-top: 88px; }
 .usecase-copy h3 { font-size: 33px; }
 .usecase-copy > p:not(.section-label) { font-size: 17px; margin-top: 19px; }
 .case-requests { margin-top: 27px; }
 .case-requests summary { font-size: 16px; }
 .case-requests details > p { font-size: 15px; }
 .personal-visual { height: 380px; border-radius: 19px; }
 .personal-visual-copy { bottom: 24px; }
 .personal-visual-copy > p { font-size: 27px; }
 .personal-visual-copy > div { font-size: 13px; }
 .business-visual { order: 2; height: 390px; }
 .material-plan { width: 234px; left: 5px; }
 .material-slide { width: 223px; top: 162px; right: 0; }
 .material-page { width: 257px; left: 4px; bottom: 1px; }
 .material { padding: 23px; }
 .idea-core { top: 34%; left: 35%; }
 .case-disclosure { font-size: 12px; }
 .dark-home .demonstration { padding-block: 53px; }
 .dark-home .demo-head { display: block; }
 .dark-home .demo-head h2 { font-size: 35px; }
 .dark-home .demo-head > p { margin-top: 21px; }
 .dark-home .demo-tabs { grid-template-columns: 1fr 1fr; }
 .dark-home .demo-tabs button { font-size: 13px; }
 .dark-home .demo-description { min-height: 190px; }
 .dark-home .demo-note, .dark-home .demo-disclosure { font-size: 12px; }
 .start-strip { grid-template-columns: 1fr; gap: 30px; padding-block: 53px 31px; }
 .start-strip h2 { font-size: 35px; }
 .start-strip aside { padding: 25px 0 0; border-left: 0; border-top: 1px solid var(--line); }
 .start-strip aside > strong { font-size: 57px; }
 .start-strip aside p { max-width: none; }
 .dark-home .downloads { padding-block: 23px 49px; }
 .dark-home .downloads .section-head h2 { font-size: 33px; }
 .dark-home .download-card { padding: 25px; }
 .dark-home .download-card > p { min-height: 0; }
 .dark-home .download-card .button { font-size: 14px; }
 .dark-home .faq { padding-block: 0 49px; }
 .dark-home .faq summary { font-size: 16px; }
 .studio-final { padding-block: 51px 56px; }
 .studio-final h2 { font-size: 45px; }
 .studio-final p:not(.section-label) { font-size: 17px; margin-top: 20px; }
}
@media (max-width:360px) {
 .dark-home .brand img { width: 38px; }
 .studio-hero h1 { font-size: 32px; }
 .hero-actions { display: block; }
 .hero-actions .button { width: 100%; }
 .hero-actions .link-action { margin-top: 10px; }
 .hero-terms { font-size: 11px; }
 .prompt-text { font-size: 17px; min-height: 150px; }
 .prompt-tip { min-height: 62px; }
 .preview-panel { min-height: 641px; }
 .output-content { padding: 20px; }
 .output-side h2 { font-size: 26px; }
 .route-output { font-size: 11px; }
 .material-plan { width: 212px; }
 .material-slide { width: 201px; }
 .material-page { width: 224px; }
 .material b { font-size: 17px; }
 .idea-core { left: 28%; }
}
@media (prefers-reduced-motion:reduce) {
 .dark-home *, .dark-home *::before, .dark-home *::after { animation: none !important; transition: none !important; }
 .dark-home [data-reveal] { opacity: 1 !important; transform: none !important; }
 .dark-home .workbench { transform: none !important; }
 .dark-home .header-progress { display: none; }
}