:root { --blue:#335aca; --blue-dark:#23449f; --ink:#151515; --text:#424242; --light:#f4f6fb; --line:#d6d6d6; --sky:#6fa4f3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:#fff; color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; font-size:15px; line-height:1.9; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
a:hover { opacity:.85; }
h1,h2,h3,h4,p { margin:0; }
h1,h2,h3,h4 { font-weight:700; line-height:1.55; letter-spacing:-.035em; }
img { display:block; }
a:focus-visible,summary:focus-visible,input:focus-visible+label { outline:3px solid #335aca; outline-offset:5px; }
.container { width:min(1180px,calc(100% - 80px)); margin-inline:auto; }
.narrow { max-width:880px; }
.mobile-only { display:none; }
.skip { position:absolute; z-index:20; left:15px; top:-80px; padding:10px; background:white; }
.skip:focus { top:10px; }
.site-header { position:sticky; z-index:10; top:0; background:#fff; border-bottom:1px solid var(--line); }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:25px; height:88px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-weight:800; font-size:27px; line-height:1; letter-spacing:-.02em; color:#1c2c53; }
.header-inner nav { display:flex; gap:25px; font-size:13px; font-weight:600; }
.header-inner nav a:hover { color:var(--blue); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:25px; min-height:55px; min-width:193px; padding:13px 23px; background:var(--blue); color:#fff; border:1px solid var(--blue); border-radius:4px; font-size:14px; font-weight:700; }
.button span { font-size:24px; font-weight:400; line-height:1; }
.button:hover { background:var(--blue-dark); opacity:1; }
.button-small { min-width:0; min-height:43px; padding:8px 16px; font-size:12px; gap:15px; }
.button-outline { background:#fff; color:var(--blue); }
.button-outline:hover { background:#edf3ff; }
.announcement { display:flex; justify-content:center; align-items:center; gap:16px; padding:8px 20px; color:white; background:#fff; font-size:12px; font-weight:600; }
.announcement-tag { background:white; color:var(--blue); border-radius:20px; padding:0 13px; font-size:11px; font-style:italic; line-height:2; }
.announcement>span:last-child { margin-left:8px; }
.hero { position:relative; overflow:hidden; background:#fff; }
.hero-inner { position:relative; display:grid; grid-template-columns:1fr 1.12fr; gap:33px; align-items:center; padding-block:70px 80px; }
.hero-category { color:var(--blue); font-size:15px; font-weight:700; margin-bottom:18px; }
.hero h1 { font-size:clamp(38px,3.8vw,52px); line-height:1.65; color:#141c2b; font-weight:800; letter-spacing:-.06em; white-space:nowrap; }
.hero h1 span { color:var(--blue); }
.hero-description { margin:24px 0 28px; color:#404b61; font-size:15px; line-height:2; }
.hero-actions { display:flex; gap:12px; }
.hero-actions .button { padding-inline:19px; min-width:180px; font-size:13px; gap:17px; }
.hero-note { font-size:10px; color:#626d83; margin-top:17px; }
.hero-art { position:relative; min-width:0; padding-block:16px 84px; }
.event { display:inline-block; flex-shrink:0; width:15px; height:15px; border:1.5px solid #7996d3; border-radius:50%; background:white; }
.event-end { border-width:3px; }
.connected-band { padding:31px 0; border-bottom:1px solid var(--line); background:white; text-align:center; }
.connected-band p { font-size:15px; color:#53617b; }
.connected-band strong { color:#273c66; }
.connected-items { display:flex; justify-content:center; align-items:center; gap:24px; margin-top:14px; color:#335aca; font-size:18px; font-weight:700; }
.connected-items i { color:#a0b1d7; font-size:15px; font-weight:400; font-style:normal; }
.section { padding-block:85px; }
.section-label { text-align:center; font-size:14px; font-weight:700; color:var(--blue); margin-bottom:13px; }
.section-title { text-align:center; font-size:36px; line-height:1.6; letter-spacing:-.04em; color:#172137; }
.section-title span { color:var(--blue); }
.section-description { text-align:center; font-size:14px; color:#58637a; margin-top:22px; line-height:2; }
.challenge { background:#fff; }
.challenge .section-title { font-size:30px; }
.challenge-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; margin-top:38px; }
.challenge-grid article { text-align:center; background:#fff; border:1px solid #e3e9f5; border-radius:8px; padding:25px 16px 28px; }
.challenge-grid h3 { font-size:19px; margin-bottom:12px; }
.challenge-grid p { font-size:13px; color:var(--text); }
.figure-note { text-align:center; font-size:10px; color:#78849a; margin-top:19px; }
.features { background:#fff; }
.feature-row { display:grid; grid-template-columns:1fr 1fr; gap:65px; align-items:center; margin-top:65px; }
.feature-row.reverse .feature-visual { order:2; }
.feature-row.reverse .feature-copy { order:1; }
.feature-visual { position:relative; padding:48px 25px 50px; background:#fff; min-height:320px; border-radius:10px; display:flex; flex-direction:column; justify-content:center; }
.illustration-window { border:1px solid #c7c7c7; background:white; border-radius:8px; }
.illustration-top { display:flex; align-items:center; gap:21px; padding:12px 15px; border-bottom:1px solid #e4eafa; font-size:12px; }
.illustration-lane { padding:15px 16px 28px; }
.illustration-lane>span { font-size:8px; color:#585858; }
.illustration-track { display:flex; align-items:center; gap:10px; margin-top:19px; justify-content:center; }
.illustration-track>span { padding:12px 9px; font-size:10px; background:#fff; border:1px solid #a8a8a8; border-radius:5px; white-space:nowrap; }
.illustration-track>span.highlight { background:#eaf1ff; border-color:#567bcb; }
.illustration-track>b { color:#a6b9df; font-weight:400; font-size:15px; }
.illustration-bottom { display:flex; justify-content:center; gap:10px; padding:11px; border-top:1px solid #e7ecf7; }
.illustration-bottom>span { background:#f0f4fd; font-size:9px; padding:2px 12px; color:#587cc4; border-radius:3px; }
.visual-tag { margin-top:22px; text-align:center; font-size:12px; font-weight:600; color:#5172b5; }
.feature-number { color:var(--blue); font-size:46px; font-weight:700; letter-spacing:-.04em; line-height:1.2; display:flex; align-items:center; gap:20px; margin-bottom:16px; }
.feature-number>span { font-size:13px; font-weight:600; letter-spacing:.01em; }
.feature-copy h3 { font-size:27px; line-height:1.7; margin-bottom:19px; }
.feature-copy em { font-style:normal; color:var(--blue); }
.feature-copy>p:not(.feature-number) { color:var(--text); font-size:14px; line-height:2; }
.manual-card { background:#fff; border-radius:7px; padding:22px 26px; border:1px solid #c7c7c7; max-width:340px; width:100%; align-self:center; }
.card-overline { font-size:10px; color:#585858; margin-bottom:9px; }
.manual-card h4 { font-size:18px; margin-bottom:20px; }
.manual-step { display:flex; gap:12px; align-items:center; margin-bottom:13px; }
.manual-step>span { border:1px solid #c2d2f4; width:22px; height:22px; display:grid; place-items:center; background:#edf2ff; color:var(--blue); font-size:10px; border-radius:3px; }
.manual-step p { font-size:11px; color:#303030; }
.manual-source { font-size:9px; color:#585858; margin-top:18px; padding-top:12px; border-top:1px solid #e3eaf7; }
.manual-source strong { font-weight:500; color:#335aca; margin-left:15px; }
.visual-manual { padding-block:26px; }
.evidence-card { background:white; border-radius:8px; border:1px solid #c7c7c7; padding:20px; }
.evidence-head { display:flex; gap:10px; align-items:center; color:var(--blue); margin-bottom:14px; }
.evidence-head h4 { font-size:14px; color:#151515; }
.evidence-line { display:flex; gap:10px; align-items:flex-start; border-top:1px solid #e4ebf8; padding-top:15px; margin-top:15px; }
.evidence-line strong { font-size:10px; color:#303030; display:block; }
.evidence-line p { font-size:9px; color:#666; margin-top:4px; }
.evidence-line>span:last-child:not(:first-child) { font-size:13px; color:#7e9bd6; margin-left:auto; }
.confirmed,.unresolved { display:inline-block; font-size:9px; padding:2px 6px; color:#4f71b9; background:#eaf1ff; border-radius:3px; white-space:nowrap; }
.unresolved { background:#fff4d9; color:#9d7c3d; }
.section-footnote { font-size:10px; text-align:center; color:#76829a; margin-top:43px; }
.start-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:50px; list-style:none; padding:0; margin:45px 0 0; }
.start-grid li { text-align:center; position:relative; }
.start-grid li:not(:last-child):after { content:"›"; color:#b4c6ed; font-size:39px; position:absolute; right:-31px; top:70px; }
.start-number { color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.04em; }
.start-grid h3 { font-size:19px; margin-bottom:13px; }
.start-grid p { font-size:12px; color:var(--text); }
.scenes { background:#fff; }
.scene-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; margin-top:37px; }
.scene-grid article { background:#fff; border:1px solid #e3e8f3; border-radius:7px; overflow:hidden; }
.scene-text { padding:25px; }
.scene-text>span { color:#6f82a8; font-size:11px; }
.scene-text h3 { font-size:20px; color:#284b9f; margin:8px 0 14px; }
.scene-text p { color:var(--text); font-size:13px; }
.demo-box { max-width:980px; margin:37px auto 0; background:white; border:1px solid #c7c7c7; border-radius:8px; padding:0 30px 28px; }
.demo-heading { display:flex; align-items:center; justify-content:space-between; padding:20px 0; border-bottom:1px solid #e4eaf5; font-size:17px; font-weight:700; }
.example-badge { font-size:9px; color:#666; background:#f0f4fb; padding:3px 10px; border-radius:3px; font-weight:400; }
.demo-tabs { margin-top:18px; }
.demo-tabs input { position:absolute; width:1px; height:1px; opacity:0; }
.demo-tabs label { display:inline-block; padding:10px 22px; cursor:pointer; font-size:13px; color:#505050; border-bottom:2px solid transparent; margin-right:13px; }
.demo-tabs input:checked+label { color:var(--blue); border-color:var(--blue); font-weight:700; }
.demo-tabs label:hover { background:#f0f5ff; }
.demo-panels { min-height:226px; padding:28px 0 0; }
.demo-panel { display:none; }
.demo-tabs:has(#view-flow:checked) .panel-flow,.demo-tabs:has(#view-manual:checked) .panel-manual,.demo-tabs:has(#view-evidence:checked) .panel-evidence { display:block; }
.demo-process { display:flex; justify-content:center; align-items:center; gap:35px; padding:20px 0; }
.demo-process>span { border:1px solid #a8a8a8; border-radius:5px; padding:16px 19px; font-size:12px; text-align:center; position:relative; }
.demo-process>span.selected { background:#eaf1ff; border-color:#5479c9; color:#335aca; }
.demo-process>span small { display:block; font-size:9px; color:#585858; margin-top:5px; }
.demo-process>span:after,.demo-process>.event:first-child:after { content:"→"; position:absolute; left:calc(100% + 11px); top:26px; font-size:15px; color:#99b2e0; }
.demo-process>.event:first-child { position:relative; }
.demo-process>.event:first-child:after { top:-9px; }
.demo-panel>p { border-top:1px solid #e4eaf6; padding-top:15px; margin-top:22px; font-size:12px; color:#555; }
.panel-manual h3 { font-size:19px; color:#335487; }
.panel-manual ol { color:#596d92; font-size:13px; margin:12px 0 0; padding-left:20px; }
.demo-evidence { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.demo-evidence>div { background:#fff; border:1px solid #e0e8f7; padding:20px; border-radius:5px; }
.demo-evidence h3 { margin:10px 0; font-size:14px; color:#151515; }
.demo-evidence p { font-size:12px; color:#666; }
.faq-section { background:#fff; }
.faq-list { margin-top:33px; }
.faq-list details { border-bottom:1px solid #dae3f3; background:white; margin-bottom:12px; border-radius:5px; padding:0 25px; }
.faq-list summary { position:relative; font-size:14px; font-weight:600; cursor:pointer; padding:19px 25px 19px 0; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary>span { color:var(--blue); font-size:21px; font-weight:600; margin-right:13px; }
.faq-list summary:after { content:"＋"; position:absolute; right:0; color:#335aca; }
.faq-list details[open] summary:after { content:"−"; }
.faq-list details p { padding:0 18px 22px 35px; font-size:13px; color:#5c6c88; }
.closing { padding-block:68px; background:#fff; color:white; text-align:center; }
.closing-label { font-size:24px; font-weight:800; letter-spacing:-.02em; color:#c3d7ff; }
.closing h2 { font-size:38px; margin:15px 0 19px; }
.closing>.container>p:not(.closing-label) { font-size:14px; color:#e0e9ff; }
.coming-badge { display:inline-block; background:#ffffff1c; border:1px solid #99b5ed; color:white; border-radius:4px; font-size:12px; padding:6px 19px; margin-top:24px; }
.closing .closing-note { font-size:11px!important; margin:11px 0 26px; color:#c9dcfc; }
.button-white { background:white; color:var(--blue); border-color:white; }
.button-white:hover { background:#e8f0ff; }
.site-footer { background:#fff; }
.footer-main { display:flex; flex-wrap:wrap; align-items:center; gap:20px; padding:37px 0; }
.footer-main>.brand { font-size:23px; }
.footer-main>p { font-size:11px; color:#7483a1; }
.footer-links { display:flex; gap:22px; margin-left:auto; font-size:11px; color:#657594; }
.footer-bottom { border-top:1px solid #dfe6f1; display:flex; justify-content:space-between; gap:25px; padding:20px 0; font-size:10px; color:#666; }
.footer-bottom small { font-size:10px; }
.document { width:min(760px,calc(100% - 40px)); margin:auto; padding-block:65px; }
.document h1 { font-size:32px; margin-bottom:20px; }
.document h2 { font-size:21px; margin:32px 0 12px; }
.document p,.document li { color:var(--text); font-size:14px; }
.document a { color:var(--blue); text-decoration:underline; }
.document .updated { font-size:12px; }
.wrap { width:min(1180px,calc(100% - 80px)); margin:auto; }
.header { display:flex; height:88px; align-items:center; justify-content:space-between; gap:25px; border-bottom:1px solid var(--line); }
.footer { display:flex; align-items:center; justify-content:space-between; padding-block:28px; border-top:1px solid var(--line); font-size:12px; }
.document .eyebrow { font-size:11px; color:var(--blue); }

.announcement { background:#fff; color:#343434; border-bottom:1px solid #ddd; padding-block:8px; }
.announcement-tag { color:#335aca; background:transparent; padding:0; font-style:normal; border-radius:0; }
.hero { background:#2854c5; color:#fff; }
.hero-inner { padding-block:62px 64px; }
.hero-category,.hero h1,.hero h1 span { color:#fff; }
.hero h1 { line-height:1.5; }
.hero-description { color:#fff; }
.hero-note { color:#e5eafb; }
.hero-actions .button { background:#fff; color:#234baa; border-color:#fff; }
.hero-actions .button-outline { background:transparent; color:#fff; border-color:#c6d1ef; }
.hero-actions .button:hover { background:#dfe7fa; color:#234baa; }
.hero-art { padding:0; margin:0; min-width:0; }
.process-sheet { background:#fff; color:#151515; border:1px solid #173c98; }
.sheet-heading { display:flex; justify-content:space-between; gap:16px; align-items:center; border-bottom:1px solid #bcbcbc; padding:22px; }
.sheet-heading p { font-size:16px; font-weight:700; }
.sheet-heading>span { font-size:11px; color:#555; white-space:nowrap; }
.sheet-body { display:grid; grid-template-columns:1fr 1.25fr; gap:24px; padding:30px 22px; }
.sheet-flow { list-style:none; margin:0; padding:0; }
.sheet-flow li { border:1px solid #aaa; padding:16px 12px; margin-bottom:27px; position:relative; }
.sheet-flow li:last-child { margin-bottom:0; }
.sheet-flow li:not(:last-child):after { content:""; position:absolute; height:28px; width:1px; background:#777; top:100%; left:50%; }
.sheet-flow li>span { display:block; font-size:10px; color:#555; line-height:1.4; margin-bottom:6px; }
.sheet-flow li strong { font-size:12px; white-space:nowrap; }
.sheet-flow li.current { background:#335aca; color:#fff; border-color:#335aca; }
.sheet-flow li.current>span { color:#fff; }
.sheet-detail { border-left:1px solid #aaa; padding-left:22px; }
.sheet-label { color:#335aca; font-size:10px; font-weight:700; margin-bottom:8px; }
.sheet-detail h2 { font-size:18px; line-height:1.5; margin-bottom:18px; letter-spacing:-.02em; }
.sheet-detail ol { padding-left:17px; margin:0; font-size:11px; color:#303030; }
.sheet-detail li { margin-bottom:10px; }
.sheet-source { border-top:1px solid #aaa; padding-top:18px; margin-top:23px; }
.sheet-source p { font-size:9px; color:#555; margin-bottom:5px; }
.sheet-source strong { font-size:10px; font-weight:500; }
.sheet-bottom { border-top:1px solid #bcbcbc; padding:11px 22px; font-size:11px; color:#333; }
.hero-art figcaption { font-size:9px; text-align:right; color:#d9e4ff; margin-top:12px; }
.challenge-grid article { border:0; border-top:2px solid #335aca; border-radius:0; text-align:left; padding:22px 0; }
.challenge-grid h3 { color:#151515; }
.challenge-grid p { color:#424242; }
.about { border-top:1px solid #ddd; }
.features { border-top:1px solid #ddd; }
.feature-row { padding-block:20px 45px; border-bottom:1px solid #ddd; margin-top:45px; }
.feature-visual { border-radius:0; padding-inline:0; }
.feature-copy>p:not(.feature-number),.section-description { color:#424242; }
.illustration-window,.manual-card,.evidence-card,.demo-box { border-radius:0; }
.illustration-track>span.highlight,.demo-process>span.selected { background:#335aca; color:#fff; border-color:#335aca; }
.demo-process>span.selected small { color:#fff; }
.illustration-bottom>span { background:none; color:#333; padding:0 10px; }
.visual-tag { color:#333; font-weight:500; }
.manual-step>span { border:0; background:none; color:#335aca; }
.confirmed { background:none; color:#335aca; padding:0; font-weight:700; }
.unresolved { background:none; color:#735316; padding:0; font-weight:700; }
.start-grid h3 { margin-top:16px; }
.start-grid li:not(:last-child):after { display:none; }
.scene-grid article { border:0; border-top:2px solid #335aca; border-radius:0; }
.scene-text { padding:22px 0; }
.scene-text>span { color:#555; }
.scene-text h3 { color:#151515; }
.scene-text p { color:#424242; }
.scenes,.start-section,.demo-section,.faq-section { border-top:1px solid #ddd; }
.faq-list details { border-radius:0; border-bottom:1px solid #bbb; margin:0; padding-inline:0; }
.faq-list details p { color:#424242; }
.example-badge { background:none; padding:0; }
.demo-evidence>div { border:0; border-left:2px solid #335aca; border-radius:0; }
.closing { background:#2854c5; }
.coming-badge { background:none; border-radius:0; }
.site-footer { background:#fff; }

@media(max-width:1100px) {
.container,.wrap { width:calc(100% - 56px); }
.header-inner nav { gap:16px; font-size:12px; }
.hero-inner { gap:24px; grid-template-columns:1fr 1fr; padding-block:58px 70px; }
.hero h1 { font-size:42px; }
.hero-category { font-size:12px; }
.hero-description { font-size:13px; }
.hero-actions .button { min-width:0; font-size:12px; padding:12px 17px; gap:14px; }
.feature-row { gap:40px; }
.feature-copy h3 { font-size:23px; }
.illustration-track { gap:6px; }
.illustration-track>span { font-size:9px; padding:10px 6px; }
.feature-visual { padding-inline:19px; }
.scene-text { padding:21px; }
.scene-text h3 { font-size:18px; }
.footer-links { gap:15px; }

}
@media(max-width:860px) {
.header-inner nav { display:none; }
.hero h1 { font-size:34px; }
.hero-actions { flex-direction:column; align-items:flex-start; gap:9px; }
.hero-actions .button { min-width:208px; min-height:46px; justify-content:space-between; }
.hero-inner { grid-template-columns:.95fr 1.05fr; gap:20px; }
.hero-description br { display:none; }
.feature-row { gap:27px; }
.feature-copy h3 { font-size:21px; }
.feature-copy>p:not(.feature-number) { font-size:12px; }
.feature-visual { padding-inline:14px; }
.illustration-track { gap:4px; }
.illustration-track>span { padding-inline:4px; font-size:8px; }
.feature-number { font-size:40px; }
.scene-grid { gap:15px; }
.scene-text { padding:18px; }
.scene-text h3 { font-size:16px; }
.scene-text p { font-size:12px; }
.demo-process { gap:24px; }
.demo-process>span { font-size:11px; padding:14px; }
.demo-process>span:after,.demo-process>.event:first-child:after { left:calc(100% + 5px); }

}
@media(max-width:700px) {
html { scroll-padding-top:82px; }
.container,.wrap { width:calc(100% - 40px); }
.mobile-only { display:block; }
.desktop-only { display:none; }
.header-inner,.header { height:72px; gap:15px; }
.brand { font-size:23px; gap:8px; }
.brand img { width:30px; height:30px; }
.button-small { min-height:37px; padding:7px 10px; font-size:10px; gap:8px; }
.button-small span { font-size:17px; }
.announcement { gap:8px; font-size:9px; padding:8px 10px; }
.announcement-tag { font-size:9px; padding-inline:9px; }
.announcement>span:last-child { margin-left:0; }
.hero-inner { grid-template-columns:1fr; padding-block:36px 53px; gap:32px; }
.hero-category { font-size:11px; margin-bottom:15px; }
.hero h1 { font-size:clamp(33px,8.7vw,52px); line-height:1.65; }
.hero-description { font-size:13px; margin:20px 0 22px; max-width:470px; }
.hero-description br { display:block; }
.hero-actions { flex-direction:row; gap:9px; }
.hero-actions .button { font-size:11px; min-width:0; min-height:46px; padding:10px 12px; gap:13px; }
.hero-actions .button span { font-size:19px; }
.hero-note { font-size:9px; margin-top:13px; }
.hero-art { width:100%; max-width:540px; margin:auto; padding:0 0 68px; }
.connected-band { padding-block:24px; }
.connected-band p { font-size:12px; }
.connected-items { gap:10px; font-size:12px; margin-top:12px; }
.connected-items i { font-size:10px; }
.section { padding-block:54px; }
.section-label { font-size:12px; margin-bottom:13px; }
.section-title { font-size:27px; line-height:1.6; }
.section-description { font-size:12px; margin-top:18px; }
.challenge .section-title { font-size:23px; }
.challenge-grid { grid-template-columns:1fr; gap:14px; margin-top:29px; }
.challenge-grid article { padding:23px 18px; }
.challenge-grid h3 { font-size:18px; margin-bottom:9px; }
.challenge-grid p { font-size:12px; }
.figure-note { font-size:9px; margin-top:15px; }
.feature-row { grid-template-columns:1fr; gap:25px; margin-top:40px; }
.feature-row.reverse .feature-visual,.feature-row.reverse .feature-copy { order:initial; }
.feature-row .feature-copy { order:1; }
.feature-row .feature-visual { order:2; }
.feature-row.reverse .feature-copy { order:1; }
.feature-row.reverse .feature-visual { order:2; }
.feature-number { font-size:34px; margin-bottom:13px; gap:14px; }
.feature-number>span { font-size:11px; }
.feature-copy h3 { font-size:23px; margin-bottom:14px; }
.feature-copy>p:not(.feature-number) { font-size:12px; }
.feature-visual { padding:32px 16px; min-height:250px; }
.illustration-track { gap:5px; }
.illustration-track>span { font-size:8px; padding:10px 5px; }
.illustration-lane { padding-inline:10px; }
.illustration-track>b { font-size:12px; }
.illustration-track .event { width:12px; height:12px; }
.visual-tag { font-size:11px; margin-top:17px; }
.manual-card { max-width:280px; padding:20px; }
.manual-card h4 { font-size:16px; }
.manual-step p { font-size:10px; }
.evidence-card { padding:16px; }
.evidence-head h4 { font-size:12px; }
.evidence-line { gap:8px; }
.evidence-line strong { font-size:9px; }
.evidence-line p { font-size:8px; }
.section-footnote { font-size:9px; text-align:left; margin-top:25px; }
.start-section .section-title>span,.scenes .section-title>span { display:block; }
.start-grid { grid-template-columns:1fr; gap:28px; margin-top:29px; }
.start-grid li:not(:last-child):after { display:none; }
.start-grid h3 { font-size:18px; }
.start-grid p { font-size:12px; }
.scene-grid { grid-template-columns:1fr; gap:20px; margin-top:27px; }
.scene-text { padding:23px; }
.scene-text h3 { font-size:20px; }
.scene-text p { font-size:12px; }
.demo-box { margin-top:27px; padding:0 17px 22px; }
.demo-heading { font-size:14px; padding-block:17px; }
.example-badge { font-size:8px; padding-inline:7px; }
.demo-tabs label { padding:9px 8px; margin-right:3px; font-size:10px; }
.demo-panels { padding-top:20px; min-height:330px; }
.demo-process { flex-direction:column; gap:22px; padding:4px 0 10px; }
.demo-process>span { padding:10px 18px; width:180px; font-size:11px; }
.demo-process>span small { font-size:8px; margin-top:2px; }
.demo-process>span:after { content:"↓"; left:50%; top:calc(100% + 2px); font-size:12px; }
.demo-process>.event:first-child:after { content:"↓"; left:0; top:12px; font-size:12px; }
.demo-panel>p { font-size:11px; padding-top:13px; }
.panel-manual h3 { font-size:18px; }
.panel-manual ol { font-size:12px; }
.demo-evidence { grid-template-columns:1fr; gap:13px; }
.demo-evidence>div { padding:15px; }
.demo-evidence h3 { font-size:12px; }
.demo-evidence p { font-size:11px; }
.faq-list { margin-top:25px; }
.faq-list details { padding-inline:17px; }
.faq-list summary { font-size:12px; padding-block:17px; }
.faq-list summary>span { font-size:17px; margin-right:8px; }
.faq-list details p { font-size:12px; padding-left:24px; }
.closing { padding-block:48px; }
.closing-label { font-size:22px; }
.closing h2 { font-size:30px; margin:15px 0; }
.closing>.container>p:not(.closing-label) { font-size:12px; }
.closing .closing-note { font-size:10px!important; }
.closing .button { min-height:48px; font-size:12px; }
.footer-main { gap:17px 14px; padding-block:28px; }
.footer-main>.brand { font-size:22px; }
.footer-main>p { font-size:10px; }
.footer-links { width:100%; margin-left:0; font-size:10px; gap:18px; }
.footer-bottom { font-size:9px; padding-block:18px; }
.footer-bottom small { font-size:9px; }
.document { padding-block:40px; }
.document h1 { font-size:25px; }
.document h2 { font-size:19px; }
.document p,.document li { font-size:13px; }
.header>a:last-child { font-size:11px; }

}
@media(max-width:370px) {
.container,.wrap { width:calc(100% - 32px); }
.hero h1 { font-size:31px; }
.hero-category { font-size:10px; }
.hero-actions .button { font-size:10px; padding-inline:10px; gap:10px; }
.announcement { font-size:8px; gap:6px; }
.section-title { font-size:24px; }
.challenge .section-title { font-size:21px; }
.illustration-track { gap:3px; }
.illustration-track>span { font-size:7px; }
.feature-copy h3 { font-size:21px; }
.connected-items { gap:8px; font-size:11px; }

}
@media(prefers-reduced-motion:reduce) {
html { scroll-behavior:auto; }
 }


@media(max-width:1100px) {
 .sheet-heading { padding:18px; }
 .sheet-heading p { font-size:13px; }
 .sheet-body { padding:23px 17px; gap:17px; grid-template-columns:1fr 1.2fr; }
 .sheet-detail { padding-left:17px; }
 .sheet-detail h2 { font-size:16px; }
 .sheet-flow li { padding:13px 9px; }
 .sheet-flow li strong { font-size:10px; }
 .sheet-detail ol { font-size:10px; }
}
@media(max-width:860px) and (min-width:701px) {
 .sheet-body { grid-template-columns:1fr; }
 .sheet-flow { display:flex; gap:9px; }
 .sheet-flow li { flex:1; margin:0; padding:10px 5px; }
 .sheet-flow li strong { white-space:normal; font-size:9px; }
 .sheet-flow li:not(:last-child):after { display:none; }
 .sheet-detail { border:0; border-top:1px solid #aaa; padding:17px 0 0; }
}
@media(max-width:700px) {
 .hero-art { padding:0; margin:0; }
 .hero-inner { gap:28px; }
 .sheet-heading { padding:17px 15px; }
 .sheet-heading p { font-size:12px; }
 .sheet-heading>span { font-size:9px; }
 .sheet-body { padding:23px 15px; gap:18px; grid-template-columns:1fr 1.25fr; }
 .sheet-flow li { padding:15px 7px; }
 .sheet-flow li strong { font-size:10px; white-space:normal; }
 .sheet-detail { padding-left:14px; }
 .sheet-detail h2 { font-size:14px; }
 .sheet-detail ol { font-size:10px; }
 .sheet-source { margin-top:15px; padding-top:14px; }
 .sheet-source strong { font-size:9px; }
 .sheet-bottom { padding:10px 15px; font-size:10px; }
 .hero-art figcaption { font-size:8px; }
 .feature-visual { padding-inline:0; }
 .scene-text { padding-inline:0; }
 .challenge-grid article { padding-inline:0; }
}
