/* Tokyo print edition: rounded display type, uncoated paper and three spot inks. */
@font-face {
  font-family:"KX Pop Display";
  src:url("/assets/tokyo-pop-display.woff2") format("woff2");
  font-style:normal; font-weight:850; font-display:swap;
}
:root {
  --ink:#1a2546; --pine:#202f62; --forest:#2847b1; --navy:#1c2b51;
  --deep:#192748; --blue:#2948ae; --muted:#4d5365; --paper:#fffbef;
  --gold:#ffe26b; --lemon:#ffe26b; --tomato:#ef6245; --cobalt:#2948ae;
  --cream:#fff6e4; --sky:#e9f1ff; --line:#c8c9ce; --inkline:#263454;
  --display:"KX Pop Display","Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;
  --font-number:"KX Pop Display",Arial,sans-serif;
}
body {color:var(--ink);background:var(--paper)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {outline:3px solid #ec8c26;outline-offset:3px}
.site-header {background:#fffdf4;border-bottom:2px solid var(--inkline)}
.site-header .brand-img {width:143px}
.edition {display:inline-block;background:var(--lemon);border:1.5px solid var(--inkline);border-radius:6px 14px 6px 14px;padding:3px 11px;font:850 13px/1.5 var(--display);letter-spacing:.04em;transform:rotate(-3deg)}
.header-icon:hover,.chapter-menu-panel a:hover {background:#e7efff}
.chapter-menu-panel {border:2px solid var(--inkline);border-radius:0 0 12px 12px;box-shadow:4px 5px 0 #1a25461c}
.menu-number {color:var(--cobalt)}
/* One poster, with the headline and the illustrations on the same paper. */
.tk-cover {background:#fdf5e2;color:var(--ink);border-bottom:2px solid var(--inkline)}
.tk-cover::before,.tk-cover::after {content:none}
.tk-broadsheet {width:min(1360px,100%);margin:auto;max-width:none;min-height:0;display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,1.16fr);gap:8px;align-items:center;padding:clamp(28px,3.1vw,47px) clamp(32px,5.5vw,84px) 30px}
.tk-copy {position:relative;z-index:1;padding:0}
.tk-locale {color:var(--ink);font-size:clamp(13px,1.1vw,16px);gap:11px;font-weight:750}
.tk-locale span {display:inline-block;background:var(--ink);color:#fff8de;border-radius:100px;padding:6px 12px 5px;font:850 13px/1 var(--display);letter-spacing:.12em}
.tk-locale b {width:28px;background:var(--inkline);height:2px}
.tk-copy h1 {font-family:var(--display);font-weight:850;color:var(--ink);font-size:clamp(58px,6.7vw,99px);line-height:1.15;letter-spacing:-.061em;margin:17px 0 19px}
.tk-copy h1>span {display:block;white-space:nowrap}
.tk-copy h1 em {position:relative;isolation:isolate;color:#c84632}
.tk-copy h1 em::after {content:"";position:absolute;z-index:-1;left:-.035em;right:-.012em;bottom:.04em;height:.33em;background:var(--lemon);transform:rotate(-2deg);border-radius:3px 45% 2px 2px}
.tk-lede {font-size:clamp(14px,1.16vw,18px);font-weight:600;line-height:1.82;color:#28324b}
.tk-primary,.tk-secondary,.btn,.works-open,.sim-shell .sim-consult-link {
  border:2px solid var(--inkline);border-radius:11px;box-shadow:3px 3px 0 var(--inkline);
  font-weight:750;line-height:1.5;text-decoration:none;
}
.tk-primary {color:#fff;background:var(--cobalt);margin-top:25px;min-height:54px;padding:11px 17px 11px 23px;gap:27px;font-size:16px}
.tk-primary span {display:grid;place-items:center;border-radius:100%;height:27px;width:27px;background:var(--lemon);color:var(--ink);font:750 19px/1 Arial}
.tk-primary:hover,.btn:hover,.works-open:hover {background:#193483;color:#fff}
.pop-hero-art {position:relative;align-self:stretch;display:flex;min-width:0;flex-direction:column;justify-content:center}
.pop-frames {position:relative;width:100%;aspect-ratio:1.51;isolation:isolate}
.pop-frame {position:absolute;inset:0;opacity:0;transition:opacity .5s ease;pointer-events:none}
.pop-frame.is-current {opacity:1;z-index:1}
.pop-frames img {height:100%;width:100%;object-fit:contain}
.pop-hero-art {mix-blend-mode:multiply}
.pop-frames {mask-image:linear-gradient(to right,transparent,#000 4%,#000 99%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 96%,transparent);mask-composite:intersect}
.scene-controls {display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:4px 0 0}
.scene-controls>div {display:flex;gap:1px;padding:2px;background:#fff9eb;border:1.5px solid var(--inkline);border-radius:999px}
.scene-controls button {border:0;min-height:34px;line-height:1.2;font-weight:700;font-size:12px;padding:5px 13px;background:transparent;color:var(--ink);cursor:pointer;border-radius:999px}
.scene-controls [aria-pressed=true] {background:var(--ink);color:#fffefa}
.scene-controls .scene-pause {width:38px;height:38px;padding:9px;border:1.5px solid var(--inkline);background:#fff8e4;display:grid;place-items:center}
.scene-pause svg {width:16px;height:16px}
.scene-pause .play-icon,.scene-pause[data-paused=true] .pause-icon {display:none}
.scene-pause[data-paused=true] .play-icon {display:block}
.hero-shortcuts {background:#fff9e9;border-bottom:2px solid var(--inkline)}
.shortcut-inner {width:min(1180px,calc(100% - 88px));border-inline:2px solid var(--inkline)}
.hero-shortcuts a {color:var(--ink);min-height:71px;font:850 clamp(16px,1.4vw,21px)/1.3 var(--display);gap:13px}
.hero-shortcuts a:first-child {background:var(--lemon)}
.hero-shortcuts a+a {background:#deebff;border-left:2px solid var(--inkline)}
.hero-shortcuts a:hover {filter:brightness(.96)}
.hero-shortcuts a::after {content:"↘";font:700 19px/1 Arial;color:var(--ink)}
/* Big chapter labels and restrained body copy make the page easy to scan. */
.chapter-section {--chapter-color:var(--lemon)}
#strengths {background:#fffdf3}
#trust {background:#eaf1ff;--chapter-color:#bcd4ff}
#subsidy {background:#fff1dc;--chapter-color:#ffb398}
#simulation {background:#fffdf3;--chapter-color:var(--lemon)}
#flow {background:#edf3fc;--chapter-color:#bcd4ff}
#company {background:#fffdf3;--chapter-color:#fac4b4}
#contact {background:var(--cobalt);--chapter-color:var(--lemon)}
.chapter-section>.chapter-bar {padding-top:clamp(38px,4vw,60px)}
.chapter-bar .chapter-title {
  padding:0 0 13px;gap:13px;border-bottom:2px solid var(--inkline);color:var(--ink);
  font:850 clamp(25px,2.9vw,43px)/1.32 var(--display);letter-spacing:-.035em;
}
.chapter-bar .chapter-number {
  flex:none;display:grid;place-items:center;min-width:43px;height:35px;padding:0 8px;border:1.6px solid var(--inkline);
  background:var(--chapter-color);color:var(--ink);border-radius:8px 13px 8px 13px;transform:rotate(-4deg);
  font:850 18px/1 var(--display);letter-spacing:.015em;
}
.chapter-slash {display:none}
.chapter-bar+.wrap,#subsidy .chapter-bar+.wrap {padding-top:clamp(23px,3vw,40px)}
.chapter-section .chapter-lead,.tk-section-intro h3,.scope-comparison h3,.cashflow h4,.ward-title h4,.contact-intro .chapter-lead,.company-credentials h3 {
  font-family:var(--display);font-weight:850;letter-spacing:-.035em;text-wrap:pretty;
}
.chapter-section .chapter-lead,.tk-section-intro h3 {font-size:clamp(28px,3.1vw,47px);line-height:1.42}
#strengths .chapter-lead {color:var(--ink)}
.strength-intro-copy p,.section-head>p,.tk-section-intro>p {color:var(--muted);font-size:15px}
.strength-review {padding:13px 20px;border:2px solid var(--inkline);border-radius:22px 7px 22px 7px;background:#fff;box-shadow:5px 5px 0 var(--lemon);color:var(--ink);gap:4px 16px}
.strength-review-score {font:850 clamp(65px,7.8vw,116px)/1 var(--display);letter-spacing:-.085em;color:var(--cobalt)}
.strength-review-stars {fill:#c87a12}
.strength-review-count,.strength-review-count small {color:var(--ink)}
#strengths .strength-facts {border-block:2px solid var(--inkline)}
.strength-record strong {color:var(--cobalt);font-family:var(--display);font-size:clamp(38px,4.3vw,63px);font-weight:850}
.scope-comparison h3 {color:var(--ink)}
.scope-comparison thead th {background:#e9eeff;color:var(--ink);border-color:#bdc6dd}
.scope-comparison thead th:nth-child(2) {background:var(--cobalt);color:white}
.scope-comparison tbody td:nth-child(2) {color:var(--ink);background:#fff2b9;border-color:#d9c991}
.scope-comparison td:nth-child(2) .scope-symbol {color:var(--cobalt)}
.scope-key,.scope-key-icon,.scope-comparison tbody th {color:var(--ink)}
.maker-line {border-color:#abb5c5}
/* Facility drawings describe each category; the adjacent names and counts are the project records. */
.works-featured {gap:19px}
.clinic-examples.works-featured>article,.clinic-examples.works-grid>article {
  background:white;border:2px solid var(--inkline);border-radius:16px;padding:13px;box-shadow:4px 4px 0 #c3d1ed;
}
.clinic-examples .pop-case-art {position:relative;display:grid;place-items:center;width:100%;overflow:hidden;border-radius:8px!important;background:#fff5e0;aspect-ratio:1.95;margin:0 0 12px}
.clinic-examples .pop-case-art img {height:100%;width:100%;object-fit:contain;mix-blend-mode:multiply}
.works-featured>article>span,.works-grid>article>span {color:#495770;font-size:12px;font-weight:700}
.clinic-examples h3 {font:850 clamp(19px,1.6vw,25px)/1.43 var(--display);color:var(--ink)}
.clinic-count {padding:12px 0;border-block:1.5px solid #b3c0d5}
.clinic-count strong {font:850 clamp(39px,3.4vw,53px)/1.14 var(--display);color:var(--cobalt)}
.works-dialog {border:2px solid var(--inkline);border-radius:18px}
.works-dialog-header {background:var(--cobalt)}
.works-dialog-header h2 {font:850 25px/1.4 var(--display)}
.works-open {background:var(--cobalt);color:white;font-family:inherit}
.works-filters button[aria-pressed=true] {background:var(--cobalt);border-color:var(--inkline)}
/* Programme conditions stay in text; colour marks the pre- and post-work application timing. */
.metro-programme {background:#fffdf7;color:var(--ink);border:2px solid var(--inkline);box-shadow:5px 5px 0 #f3bda3;border-radius:17px;gap:0 clamp(24px,4vw,58px)}
.area-label {display:inline-block;color:var(--ink);background:var(--lemon);padding:3px 10px;font-size:13px;border-radius:5px}
.metro-summary h4 {font:850 clamp(22px,2.05vw,32px)/1.47 var(--display);letter-spacing:-.035em;color:var(--ink)}
.metro-summary>p:not(.area-label),.metro-options p {color:var(--muted)}
.metro-options {border-color:#b7c1cd}
.metro-options>div+div,.metro-dates,.metro-details {border-color:#b7c1cd}
.metro-options>div>span {color:var(--ink);font-size:14px;font-weight:700}
.metro-options strong {color:var(--cobalt);font:850 clamp(36px,3.2vw,50px)/1.18 var(--display)}
.metro-options small {color:var(--ink);font-size:clamp(14px,1.25vw,19px)}
.metro-dates b,.source-pair a,.metro-details summary,.tax-note summary {color:var(--cobalt)}
.metro-dates {font-size:14px}
.ward-title h4,.cashflow h4 {font-size:clamp(23px,2.2vw,34px)}
.ward {border:2px solid var(--inkline);border-top-width:6px;border-radius:14px;background:#fffdf8;--phase:#ffe0cb;border-top-color:#d26443}
.ward:is(#minato,#tama) {--phase:#dbe8ff;border-top-color:#425cb9}
.ward-head h5 {font:850 clamp(26px,2.5vw,35px)/1.3 var(--display);color:var(--ink)}
.ward-head span {color:var(--ink);background:var(--phase);border:0;border-radius:100px;padding:4px 10px;font-size:12px}
.ward-program {color:var(--muted);font-size:13px}
.ward-rate>b,.ward-rate strong {font-family:var(--display);font-weight:850}
.ward-rate>b {font-size:clamp(39px,3.9vw,59px);color:var(--cobalt)}
.ward-rate strong {font-size:clamp(24px,2.3vw,35px);color:var(--ink)}
.ward .source-pair {font-size:13px}
.source-pair a {text-decoration-color:#99a7d2}
.cashflow {border-top:2px solid var(--inkline)}
.tk-secondary {background:var(--lemon);color:var(--ink)}
/* Calculator: inputs, regular pricing and grant scenarios have distinct visual roles. */
.sim-form,.sim-result {border:2px solid var(--inkline);border-radius:15px}
.sim-form {background:#fff}
.sim-series {color:var(--ink);font-family:var(--display);font-weight:850;font-size:20px}
.sim-series small {font:500 13px/1.6 sans-serif}
.field label,.inquiry-form label {color:var(--ink);font-size:14px}
input,select,textarea {border-color:#9ca9be;border-radius:7px;color:var(--ink)}
.btn {background:var(--cobalt);color:white;font-size:15px}
.sim-standard-result {background:#e7efff;color:var(--ink)}
.sim-shell .sim-standard-result .sim-panel-title,.result-total {color:var(--ink)}
.sim-shell .sim-panel-title {font:850 clamp(21px,2vw,29px)/1.4 var(--display)}
.result-total {font-family:var(--display);font-size:clamp(35px,3.6vw,55px);font-weight:850;overflow-wrap:anywhere}
.sim-result.grant-estimate {background:var(--cobalt);color:#fff}
.grant-scenario {border:1.5px solid var(--inkline);border-radius:11px;background:#fffdf3;padding:17px}
.grant-scenario h4 {font:850 17px/1.5 var(--display)}
.grant-scenario dd {font:850 clamp(20px,1.7vw,26px)/1.45 var(--display);color:var(--ink)}
.grant-scenario dl>div:last-child dd {color:var(--cobalt);font-size:clamp(21px,1.95vw,30px)}
.grant-scenario dd small {display:block;color:var(--muted);font:600 12px/1.5 sans-serif;margin-top:3px}
.grant-scenario dl>div:last-child {border-color:#cdd2dd}
.grant-basis strong {font-family:var(--display);font-size:25px;color:var(--lemon)}
.grant-timing,.grant-assumptions,.grant-basis,.sim-grant-note,.grant-sources,.grant-basis small {color:#fff}
.sim-shell .sim-consult-link {background:var(--lemon);color:var(--ink);border-color:var(--inkline)}
#flow .flow-grid {--flow-accent:#bd4b39;gap:14px 18px}
#flow .flow-step {background:#fffdf8;border:1.5px solid var(--inkline);border-radius:12px;padding:16px;align-items:center;grid-template-columns:64px 1fr}
#flow .flow-pictogram {width:57px;height:57px;color:#2948ae}
#flow .flow-copy h3,.flow-resources-head h3 {font:850 clamp(19px,1.7vw,25px)/1.45 var(--display);color:var(--ink)}
#flow .flow-step-number,.flow-guide button,.flow-faq summary::after {color:#2b469d}
.flow-faq details {border-color:#b9c6db}
.flow-faq summary {font-size:16px}
.company-panel>div {position:relative;background:#fff5d9;border:2px solid var(--inkline);border-radius:16px;padding:22px;overflow:hidden}
.company-panel .company-official-logo {background:white;border-radius:8px}
.team-tools {float:right;width:clamp(110px,15vw,215px);margin:12px 0 0 10px}
.team-tools img {width:100%;height:auto;mix-blend-mode:multiply}
.company-credentials h3 {color:var(--ink);font-size:24px}
.company-credentials li {break-inside:avoid}
.company-facts>div {border-top-color:#bdc4d3}
#contact .chapter-title {color:#fff;border-color:#fff8e4}
#contact .chapter-number {color:var(--ink);border-color:var(--inkline)}
#contact .chapter-lead {color:#fffdf3}
.contact-free-note,.contact-lead,.response-caveat {color:#fff}
.contact-call {border-color:#c1cefc}
.contact-call strong {font-family:var(--display);font-weight:850;letter-spacing:.01em}
.response-guide>div {display:grid;gap:3px}
.response-guide>div>span {color:#f3f4ff;font-size:13px}
.response-guide>div>strong {font:850 20px/1.45 var(--display);color:var(--lemon)}
.contact-print {overflow:hidden;margin-top:16px;border-radius:15px;border:2px solid var(--inkline);background:var(--cream)}
.contact-print img {width:100%;height:clamp(175px,18vw,290px);object-fit:cover;object-position:50% 42%}
.inquiry-form {border:2px solid var(--inkline);border-radius:16px;background:#fffdf5;box-shadow:5px 5px 0 var(--inkline)}
.footer,.mobile-cta {background:var(--ink)}
.mobile-cta a {font-family:var(--display);font-weight:850}
#preview-dialog,.dial-options {border:2px solid var(--inkline);border-radius:15px}
.dial-actions .dial-retry {background:var(--lemon);border-color:var(--inkline)}
@media (min-width:761px) and (max-width:980px) {
  .tk-broadsheet {padding-inline:28px;grid-template-columns:minmax(0,.97fr) minmax(0,1fr);gap:0}
  .tk-copy h1 {font-size:clamp(54px,7.1vw,70px)}
  .scene-controls button {padding-inline:9px}
  .strength-review {padding:10px 13px}
  .team-tools {float:none;width:125px;margin:10px auto}
}
@media(max-width:760px) {
  .site-header .brand-img {width:102px}
  .edition {font-size:11px;padding:2px 8px;border-radius:5px 11px 5px 11px}
  .tk-broadsheet {display:grid;grid-template-columns:minmax(0,1fr);padding:21px 0 14px;gap:6px}
  .tk-copy {padding:0 18px}
  .tk-locale {gap:8px;font-size:12px}.tk-locale b {width:19px}.tk-locale span {font-size:10px;padding:4px 9px}
  .tk-copy h1 {font-size:clamp(43px,11.8vw,71px);margin:11px 0 12px;line-height:1.12}
  .tk-lede {font-size:14px;line-height:1.65}
  .tk-primary {min-height:44px;margin-top:13px;padding:7px 10px 7px 15px;gap:16px;font-size:14px}
  .tk-primary span {width:24px;height:24px;font-size:16px}
  .pop-hero-art {width:100%;padding:0 8px}
  .pop-frames {aspect-ratio:1.95;max-height:285px}
  .pop-frames img {object-fit:contain}
  .scene-controls {justify-content:center;margin-top:2px}
  .scene-controls button {font-size:11px;min-height:34px;padding:4px 10px}
  .scene-controls .scene-pause {width:36px;height:36px;padding:8px}
  .shortcut-inner {width:100%;border-inline:0}
  .hero-shortcuts a {min-height:54px;font-size:clamp(13px,3.55vw,17px);gap:5px}
  .hero-shortcuts a::after {font-size:14px}
  .chapter-section>.chapter-bar {padding-top:32px}
  .chapter-bar .chapter-title {font-size:clamp(20px,5.5vw,30px);gap:9px;padding-bottom:10px}
  .chapter-bar .chapter-number {min-width:33px;height:27px;padding:0 5px;font-size:14px;border-radius:6px 9px 6px 9px}
  .chapter-section .chapter-lead,.tk-section-intro h3 {font-size:clamp(24px,6.5vw,33px)}
  .section-head>p,.tk-section-intro>p,.strength-intro-copy p {font-size:14px}
  .strength-review {padding:9px 14px;gap:3px 16px}
  .strength-review-score {font-size:64px}
  .strength-record strong {font-size:clamp(32px,8.3vw,43px)}
  .clinic-examples.works-featured {padding:0 7px 7px 0}
  .clinic-examples.works-featured>article {padding:10px;flex-basis:84%}
  .clinic-examples.works-grid>article {padding:10px;grid-template-columns:85px minmax(0,1fr);gap:0 10px}
  .clinic-examples.works-grid article:nth-child(n) .case-photo {height:108px}
  .clinic-examples.works-grid h3 {font-size:18px}
  .clinic-examples .pop-case-art {aspect-ratio:1.85}
  .metro-options {padding-left:0}
  .metro-summary h4 {font-size:23px}
  .metro-options strong {font-size:37px}
  .ward .source-pair {gap:5px 10px}
  #flow .flow-grid {grid-template-columns:1fr}
  #flow .flow-step {grid-template-columns:49px minmax(0,1fr);gap:10px;padding:12px}
  #flow .flow-pictogram {width:43px;height:43px}
  .company-panel>div {padding:16px}
  .team-tools {width:105px;margin:12px -2px 4px 7px}
  .contact-print img {height:auto;aspect-ratio:2;object-position:center 40%}
  .sim-shell .sim-panel-title {font-size:23px}
  .result-total {font-size:clamp(35px,9vw,46px)}
}
@media(max-width:355px) {
  .tk-copy {padding-inline:14px}
  .tk-lede {font-size:13px}
  .hero-shortcuts a {font-size:12px}
  .team-tools {width:88px}
}
@media(prefers-reduced-motion:reduce) {.pop-frame {transition:none}}
.pop-hero-art {mix-blend-mode:normal}
