:root { --ink:#183353; --muted:#596d85; --blue:#245bd7; --blue-soft:#edf3ff; --line:#dce4ee; --surface:#edf2f8; --green:#187451; --red:#ad403a; --white:#fff; font-family:"Malgun Gothic","Apple SD Gothic Neo",sans-serif; color:var(--ink); font-synthesis:none; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:var(--white); font-size:15px; line-height:1.7; word-break:keep-all; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:wait; opacity:.5; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #6592ef; outline-offset:4px; }
button,input,select,textarea { border-radius:7px; }
input,select,textarea { min-width:0; }
h1,h2,h3,h4,p { margin-top:0; }
h1,h2,h3,h4 { line-height:1.4; }
[hidden] { display:none!important; }
.wrap { width:min(1160px,calc(100% - 64px)); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:16px; top:-60px; z-index:20; background:var(--ink); color:white; padding:10px 18px; }
.skip-link:focus { top:12px; }
.site-header { min-height:90px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:25px; font-weight:800; letter-spacing:-1.4px; }
.brand svg { width:34px; height:34px; }
nav { display:flex; align-items:center; gap:32px; font-size:13px; font-weight:700; }
nav a:hover,.text-link:hover { color:var(--blue); }
.nav-contact { border:1px solid var(--line); padding:9px 17px; border-radius:6px; }
.hero { padding-block:68px 64px; display:grid; grid-template-columns:minmax(0,1.7fr) minmax(240px,.8fr); align-items:center; gap:60px; }
.intro { font-size:14px; color:var(--blue); font-weight:700; margin-bottom:16px; }
h1 { font-size:clamp(36px,4.2vw,56px); font-weight:800; letter-spacing:-3px; line-height:1.22; margin-bottom:25px; }
.hero-copy { color:var(--muted); font-size:16px; line-height:1.85; margin-bottom:28px; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:25px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:7px; font-size:13px; font-weight:700; padding:12px 19px; line-height:1.7; text-align:center; }
.primary { color:white; background:var(--blue); }
.primary:hover { background:#1947b3; }
.secondary { color:var(--ink); background:white; border-color:#c7d4e4; }
.secondary:hover { background:#f3f6fb; }
.text-link { font-size:13px; font-weight:700; border-bottom:1px solid #aebbd0; padding-block:4px; }
.pilot-note { border-left:3px solid #d8e4f8; padding:8px 0 8px 30px; }
.availability { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--blue); font-weight:700; margin-bottom:21px; }
.availability>span { width:7px; height:7px; border-radius:50%; background:var(--blue); }
.pilot-note h2 { font-size:21px; letter-spacing:-.8px; margin-bottom:15px; line-height:1.55; }
.pilot-note p { font-size:13px; color:var(--muted); margin-bottom:16px; }
.pilot-note .quiet { margin-bottom:0; font-size:11px; }
.section-title { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.section-title h2 { font-size:24px; letter-spacing:-1px; margin-bottom:8px; }
.section-title p { margin:0; font-size:13px; color:var(--muted); }
.sample-tag { display:inline-flex; align-items:center; color:#405879; background:var(--surface); border:1px solid var(--line); padding:5px 10px; border-radius:4px; white-space:nowrap; font-size:11px; font-weight:700; }
.workbench { border:1px solid #cdd9e8; border-radius:14px; overflow:hidden; box-shadow:0 20px 55px #1833530b; }
.bench-header { min-height:76px; background:var(--ink); color:white; padding:15px 28px; display:flex; align-items:center; gap:12px; }
.workspace-symbol { display:grid; place-items:center; height:36px; width:36px; background:#ffffff16; color:#dfebff; border:1px solid #ffffff25; border-radius:8px; font-size:20px; }
.bench-header strong { display:block; font-size:13px; }
.bench-header div>span { display:block; color:#c0cde0; font-size:10px; margin-top:3px; }
.browser-only { margin-left:auto; color:#c0cde0; font-size:11px; }
.bench-controls { display:flex; justify-content:space-between; align-items:center; padding:25px 28px 12px; gap:20px; }
.scenario-group { display:flex; padding:4px; background:var(--surface); border-radius:8px; gap:4px; }
.scenario-group button { border:0; background:transparent; padding:9px 17px; color:#516780; font-size:12px; font-weight:700; border-radius:5px; }
.scenario-group button[aria-pressed="true"] { background:white; color:var(--blue); box-shadow:0 1px 4px #18335317; }
.scenario-description { font-size:12px; color:var(--muted); padding-inline:29px; margin:0 0 24px; min-height:21px; }
.journey { display:grid; grid-template-columns:minmax(0,1.1fr) 70px minmax(0,1fr); padding:0 28px; align-items:stretch; }
.website-pane { border:1px solid var(--line); border-radius:9px; overflow:hidden; background:#fafbfd; }
.window-bar { display:flex; align-items:center; gap:8px; background:#f0f3f8; border-bottom:1px solid var(--line); padding:11px 13px; color:#64788f; font-size:9px; }
.window-dots { color:#bac6d5; font-size:8px; letter-spacing:1px; white-space:nowrap; }
.example-label { margin-left:auto; white-space:nowrap; }
.mock-form { max-width:350px; padding:20px 28px 14px; margin:auto; }
.mock-site-name { color:#738299; font-size:10px; }
.mock-form h3 { margin:6px 0 17px; font-size:15px; letter-spacing:-.4px; }
.mock-field { margin-bottom:10px; }
.mock-field>span { display:block; font-size:10px; color:#697b92; margin-bottom:4px; }
.mock-field>p { background:white; border:1px solid var(--line); border-radius:4px; padding:8px 10px; font-size:10px; line-height:1.7; margin:0; color:#6b7e94; }
.mock-submit { font-size:11px; text-align:center; color:#e3eaf3; background:#687e9a; padding:8px; border-radius:4px; margin-top:13px; }
.mock-submit[data-state="done"] { background:var(--green); color:white; }
.mock-submit[data-state="failed"] { background:var(--red); color:white; }
.pane-status { text-align:center; font-size:10px; color:var(--muted); margin:8px 0 0; min-height:17px; }
.journey-connector { align-self:center; text-align:center; color:#8095b2; }
.journey-connector>span { display:block; font-size:36px; line-height:1.4; }
.journey-connector small { font-size:9px; }
.inbox-pane { border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.inbox-heading { display:flex; align-items:center; gap:10px; padding:17px 20px; border-bottom:1px solid var(--line); }
.inbox-heading svg { width:19px; height:19px; stroke:#5d7799; stroke-width:1.6; fill:none; }
.inbox-heading strong { font-size:12px; }
.inbox-heading>span { margin-left:auto; font-size:10px; color:var(--muted); }
.inbox-content { display:flex; align-items:center; flex-direction:column; justify-content:center; padding:25px 22px; min-height:271px; text-align:center; }
.empty-inbox { display:grid; gap:6px; width:116px; margin-bottom:23px; }
.empty-inbox span { height:14px; background:#edf1f7; border:1px solid #e2e8f1; border-radius:3px; }
.empty-inbox span:nth-child(2) { margin-inline:8px; }
.empty-inbox span:nth-child(3) { margin-inline:17px; }
.inbox-content[data-tone="healthy"] .empty-inbox span:first-child { border-color:#93c6b2; background:#e5f3ed; }
.inbox-content[data-tone="failed"] .empty-inbox span:first-child { border-color:#dcb5b1; background:#faeae8; }
.inbox-content h3 { font-size:15px; margin-bottom:8px; }
.inbox-content p { font-size:11px; color:var(--muted); margin:0; white-space:pre-line; }
.flow-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:22px 28px; margin:0; gap:20px; }
.flow-track li { display:flex; gap:10px; align-items:center; padding:13px 16px; background:#f4f6fa; border-radius:6px; }
.step-icon { display:grid; place-items:center; width:25px; height:25px; flex-shrink:0; border:1px solid #cbd6e4; border-radius:50%; color:#66809e; font-size:10px; }
.flow-track strong { display:block; font-size:11px; }
.step-caption { display:block; color:var(--muted); font-size:10px; margin-top:2px; }
.flow-track li[data-state="done"] { background:#edf6f1; }
.flow-track li[data-state="done"] .step-icon { color:var(--green); border-color:#a1c6b6; }
.flow-track li[data-state="active"] { background:var(--blue-soft); }
.flow-track li[data-state="active"] .step-icon { color:var(--blue); border-color:var(--blue); }
.flow-track li[data-state="failed"] { background:#fbefed; }
.flow-track li[data-state="failed"] .step-icon { color:var(--red); border-color:#d5a39d; }
.result-box { margin:0 28px 25px; background:var(--blue-soft); padding:21px 24px; border-left:3px solid #91ace4; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.result-kicker { margin:0 0 5px; font-size:10px; font-weight:700; color:#506d9f; }
.result-box h3 { font-size:16px; letter-spacing:-.4px; margin-bottom:6px; }
.result-box p:last-child { font-size:11px; margin:0; color:var(--muted); }
.result-box[data-tone="failed"] { background:#fbf2f0; border-color:#c17970; }
.result-box[data-tone="healthy"] { background:#eff7f3; border-color:#74ad95; }
.result-box .button { white-space:nowrap; font-size:11px; }
.records-header { display:flex; justify-content:space-between; align-items:center; padding:0 28px 12px; gap:20px; }
.records-header h3 { font-size:13px; margin:0; }
.records-header>div { display:flex; gap:15px; }
.text-button { font-size:11px; padding:5px 0; border:0; background:none; color:var(--blue); }
.text-button:hover { text-decoration:underline; }
.text-button:disabled { cursor:default; }
.records-grid { display:grid; grid-template-columns:1.15fr 1fr; margin:0 28px; border-top:1px solid var(--line); }
.records-grid>section { padding:14px 0; }
.records-grid>section+section { border-left:1px solid var(--line); margin-left:24px; padding-left:24px; }
.record-list { max-height:220px; overflow-y:auto; }
.empty-record { font-size:11px; color:var(--muted); margin:0; padding-block:7px; }
.event-section h4 { font-size:10px; color:var(--muted); margin:0 0 5px; }
.run-record { display:flex; align-items:center; gap:12px; padding:8px 0; border-bottom:1px solid #eff2f7; font-size:11px; }
.run-record:last-child { border:0; }
.run-number { font-size:10px; color:var(--muted); white-space:nowrap; }
.run-result { font-weight:700; }
.run-record small { margin-left:auto; font-size:10px; color:var(--muted); }
.event-record { font-size:11px; padding:7px 0; display:flex; align-items:flex-start; gap:9px; }
.event-dot { display:inline-block; height:6px; width:6px; border-radius:50%; margin-top:7px; background:var(--red); flex-shrink:0; }
.event-dot[data-kind="recovery"] { background:var(--green); }
.event-record small { font-size:10px; color:var(--muted); margin-left:7px; white-space:nowrap; }
.demo-footnote { padding:14px 28px; background:#f7f9fc; border-top:1px solid var(--line); color:#667c95; font-size:10px; margin:0; }
.notice { color:var(--red); padding:20px; border:1px solid #e0b5ac; }
.scope { padding-block:84px; }
.benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px; margin:36px 0 47px; }
.benefit-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:7px; color:var(--blue); background:var(--blue-soft); font-size:23px; font-weight:400; margin-bottom:18px; }
.benefits h3 { font-size:18px; letter-spacing:-.5px; margin-bottom:11px; }
.benefits p { font-size:13px; color:var(--muted); margin:0; line-height:1.85; }
.scope-detail { display:grid; grid-template-columns:1fr 1fr; gap:60px; background:#f4f7fb; padding:30px 34px; border-radius:8px; }
.scope-detail h3 { font-size:18px; margin-bottom:10px; }
.scope-detail p { font-size:12px; color:var(--muted); line-height:1.85; margin:0; }
.scope-detail dl { margin:0; font-size:12px; }
.scope-detail dl>div { display:flex; justify-content:space-between; gap:20px; padding:10px 0; border-bottom:1px solid var(--line); }
.scope-detail dl>div:last-child { border:0; }
.scope-detail dt { color:var(--muted); white-space:nowrap; }
.scope-detail dd { margin:0; font-weight:700; text-align:right; }
.faq { margin-top:35px; }
details { border-bottom:1px solid var(--line); padding:18px 0; }
summary { cursor:pointer; font-size:13px; font-weight:700; padding-right:20px; }
details p { color:var(--muted); font-size:12px; max-width:820px; margin:14px 0 3px; }
.inquiry-section { background:#eef3fb; padding-block:70px; border-top:1px solid #e2e9f4; }
.inquiry-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:start; }
.inquiry-intro { padding-top:18px; }
.inquiry-intro .intro { font-size:12px; }
.inquiry-intro h2 { font-size:40px; line-height:1.3; letter-spacing:-2px; margin-bottom:22px; }
.inquiry-intro>p:not(.intro) { font-size:13px; color:var(--muted); line-height:1.85; }
.inquiry-intro ol { padding-left:20px; font-size:12px; line-height:2.6; margin:27px 0; }
.inquiry-intro .privacy-note { max-width:325px; font-size:10px!important; color:#687b95!important; border-top:1px solid #d6e0ef; padding-top:18px; }
.inquiry-form-panel { background:white; border:1px solid #dce5f1; border-radius:11px; padding:30px; }
fieldset { border:0; margin:0; padding:0; min-width:0; }
label { display:flex; flex-direction:column; gap:7px; font-size:12px; font-weight:700; margin-bottom:17px; }
input,select,textarea { background:#fff; border:1px solid #cfd9e6; width:100%; padding:10px 11px; color:var(--ink); font-size:12px; font-weight:400; }
select { height:43px; }
textarea { resize:vertical; line-height:1.7; }
input::placeholder,textarea::placeholder { color:#8291a5; opacity:1; }
.form-pair { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.optional { font-size:10px; font-weight:400; color:var(--muted); margin-top:-3px; }
.full-width { width:100%; }
.field-error { font-size:11px; color:var(--red); margin:0 0 10px; }
.field-error:empty { display:none; }
.contact-status { color:var(--muted); font-size:10px; margin:13px 0 0; text-align:center; }
.request-preview { border-top:1px solid var(--line); margin-top:25px; padding-top:25px; }
.request-preview h3 { font-size:16px; margin-bottom:10px; }
.request-notice { font-size:11px; color:#815828; background:#fcf5e9; padding:10px 12px; border-radius:4px; }
.request-headers { font-size:11px; margin:18px 0; }
.request-headers>div { display:grid; grid-template-columns:70px 1fr; gap:12px; margin-bottom:7px; }
.request-headers dt { color:var(--muted); }
.request-headers dd { margin:0; overflow-wrap:anywhere; }
.request-preview textarea { background:#f8fafd; font-size:11px; }
.request-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:13px; }
.request-actions .button { font-size:11px; flex:1; white-space:nowrap; }
.copy-status { color:var(--muted); font-size:10px; margin:12px 0 0; }
.sample-report { margin-top:30px; padding:32px; border:1px solid var(--line); border-radius:9px; }
.report-top { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:25px; }
.report-top .sample-tag { margin-bottom:14px; }
.report-top h2 { font-size:23px; margin-bottom:8px; }
.report-top p:not(.sample-tag) { color:var(--muted); font-size:12px; margin:0; }
.report-stats { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); margin-bottom:20px; padding-block:20px; }
.report-stats>div { padding-inline:20px; border-right:1px solid var(--line); }
.report-stats>div:first-child { padding-left:0; }
.report-stats>div:last-child { border:0; }
.report-stats span { font-size:11px; color:var(--muted); display:block; }
.report-stats strong { font-size:27px; }
.report-table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:11px; text-align:left; }
th,td { padding:12px 9px; border-bottom:1px solid var(--line); white-space:nowrap; }
th { color:var(--muted); font-weight:700; background:#f5f8fc; }
.report-note { color:var(--muted); font-size:10px; margin:16px 0 0; }
.site-footer { display:flex; align-items:center; justify-content:space-between; min-height:110px; gap:20px; }
.site-footer .brand { font-size:21px; }
.site-footer p { color:var(--muted); font-size:12px; margin:0; margin-right:auto; }
.site-footer>span { color:var(--muted); font-size:10px; }
@media (max-width:1000px) {
  .hero { gap:30px; grid-template-columns:1.7fr 1fr; }
  .pilot-note { padding-left:20px; }
  .pilot-note h2 { font-size:18px; }
  .inquiry-layout { gap:45px; }
  .benefits { gap:30px; }
  .scope-detail { gap:30px; }
  .window-bar { font-size:8px; padding:11px 8px; gap:5px; }
  .example-label { display:none; }
}
@media (max-width:760px) {
  .wrap { width:calc(100% - 36px); }
  .site-header { min-height:75px; gap:15px; }
  .brand { font-size:22px; gap:7px; }
  .brand svg { width:29px; height:29px; }
  nav { gap:15px; font-size:11px; }
  nav a[href="#scope"] { display:none; }
  .nav-contact { padding:7px 10px; }
  .hero { display:block; padding-block:42px; }
  h1 { font-size:40px; letter-spacing:-2.4px; }
  .intro { font-size:12px; }
  .hero-copy { font-size:13px; line-height:1.9; }
  .hero-actions { gap:18px; }
  .hero-actions .button { font-size:12px; padding:11px 13px; }
  .text-link { font-size:11px; }
  .pilot-note { margin-top:35px; padding:4px 0 4px 17px; }
  .pilot-note h2 { font-size:15px; display:none; }
  .pilot-note p { font-size:11px; margin:8px 0; }
  .pilot-note br { display:none; }
  .availability { font-size:11px; margin-bottom:4px; }
  .pilot-note .quiet { font-size:10px; }
  .section-title { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:18px; }
  .section-title h2 { font-size:20px; letter-spacing:-1px; }
  .section-title p { font-size:12px; }
  .sample-tag { font-size:10px; }
  .workbench { border-radius:9px; }
  .bench-header { padding:14px 16px; min-height:70px; }
  .browser-only { max-width:70px; text-align:right; font-size:9px; }
  .bench-controls { padding:18px 15px 12px; flex-wrap:wrap; gap:13px; }
  .scenario-group { width:100%; }
  .scenario-group button { flex:1; padding:8px; font-size:11px; }
  #run-demo { width:100%; padding:10px; font-size:12px; }
  .scenario-description { padding-inline:17px; margin-bottom:19px; font-size:11px; }
  .journey { padding:0 16px; grid-template-columns:1fr; }
  .mock-form { padding:18px 22px 14px; max-width:none; }
  .mock-form h3 { font-size:14px; }
  .mock-field>p { font-size:11px; }
  .window-bar { font-size:8px; padding-inline:12px; }
  .journey-connector { display:flex; align-items:center; justify-content:center; gap:12px; height:45px; }
  .journey-connector>span { transform:rotate(90deg); font-size:27px; }
  .inbox-content { min-height:155px; padding:20px; }
  .empty-inbox { width:84px; gap:4px; margin-bottom:14px; }
  .empty-inbox span { height:9px; }
  .inbox-content h3 { font-size:14px; }
  .inbox-content p { font-size:10px; }
  .inbox-heading { padding:12px 15px; }
  .flow-track { padding:18px 16px; gap:7px; }
  .flow-track li { padding:10px 7px; display:block; }
  .step-icon { margin-bottom:8px; height:22px; width:22px; }
  .flow-track strong { font-size:10px; }
  .step-caption { font-size:9px; }
  .result-box { margin:0 16px 22px; padding:16px; flex-direction:column; align-items:flex-start; gap:15px; }
  .result-box h3 { font-size:14px; }
  .result-box p:last-child { font-size:10px; }
  .result-box .button { white-space:normal; }
  .records-header { padding:0 16px 12px; gap:12px; }
  .records-header h3 { font-size:12px; }
  .records-header>div { gap:12px; }
  .text-button { font-size:10px; }
  .records-grid { grid-template-columns:1fr; margin:0 16px; }
  .records-grid>section+section { padding-left:0; margin-left:0; border-left:0; border-top:1px solid var(--line); }
  .demo-footnote { padding:13px 16px; font-size:9px; }
  .scope { padding-block:50px; }
  .benefits { grid-template-columns:1fr; gap:28px; margin:30px 0; }
  .benefits article { display:grid; grid-template-columns:37px 1fr; column-gap:13px; }
  .benefit-icon { grid-row:1/3; margin:0; }
  .benefits h3 { font-size:16px; margin-bottom:8px; }
  .benefits p { font-size:12px; }
  .scope-detail { padding:23px 20px; grid-template-columns:1fr; gap:18px; }
  .scope-detail h3 { font-size:16px; }
  .scope-detail p,.scope-detail dl { font-size:11px; }
  .faq { margin-top:22px; }
  summary { font-size:12px; }
  details p { font-size:11px; }
  .inquiry-section { padding-block:38px; }
  .inquiry-layout { grid-template-columns:1fr; gap:25px; }
  .inquiry-intro { padding-top:0; }
  .inquiry-intro h2 { font-size:33px; }
  .inquiry-intro h2 br { display:none; }
  .inquiry-intro ol { margin:20px 0; }
  .inquiry-intro .privacy-note { max-width:none; }
  .inquiry-form-panel { padding:21px 18px; }
  .form-pair { gap:12px; }
  input,select,textarea { font-size:16px; }
  .form-pair select { font-size:12px; }
  .request-preview textarea { font-size:12px; }
  .sample-report { padding:22px 16px; }
  .report-top { flex-direction:column; }
  .report-top h2 { font-size:21px; }
  .report-stats>div { padding-inline:10px; }
  .report-stats strong { font-size:24px; }
  .report-stats span { font-size:10px; }
  .site-footer { min-height:100px; flex-wrap:wrap; justify-content:flex-start; gap:9px 20px; padding-block:23px; }
  .site-footer p { font-size:11px; }
  .site-footer>span { width:100%; }
}
@media (max-width:360px) { h1 { font-size:35px; } .hero-actions { gap:13px; } .form-pair { grid-template-columns:1fr; gap:0; } .request-actions { flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print {
  body { color:#183353; font-size:11px; }
  .site-header,.hero,.experience,.scope,.inquiry-section,.site-footer,.skip-link { display:none!important; }
  #sample-report { display:block!important; width:100%; margin:0; padding:0; border:0; border-radius:0; }
  #print-report { display:none!important; }
  .report-top { flex-direction:row; }
  .report-table-wrap { overflow:visible; }
  .report-stats,.report-top,tr { break-inside:avoid; }
  @page { size:A4; margin:18mm; }
}
