/* The home page asks for a small first step. Detailed explanations have their own pages. */
:root{--ink:#233c45;--muted:#50656b;--paper:#fafbf9;--sage:#eaf0eb;--line:#cbd6d1;--green:#456b59;--max:1120px}
*{box-sizing:border-box}
html{scroll-behavior:auto}
.story-site{margin:0;background:var(--paper);color:var(--ink);font-family:"BIZ UDPGothic","Yu Gothic",Meiryo,sans-serif;font-size:18px;line-height:1.85;letter-spacing:.025em}
.story-site h1,.story-site h2,.story-site h3,.story-site p,.story-site figure{margin:0}
.story-site h1,.story-site h2,.story-site h3{font-feature-settings:"palt";letter-spacing:.035em;line-height:1.5}
.story-site a{color:inherit;text-decoration:none}
.story-site button{font:inherit;cursor:pointer}
.story-site img{display:block;width:100%;height:auto}
.shell{max-width:var(--max);width:calc(100% - 80px);margin-inline:auto}
.story-site a:focus-visible,.story-detail a:focus-visible,.story-site button:focus-visible{outline:3px solid #52699b;outline-offset:5px}
.story-site section[id],.story-site nav[id],.story-site article[id]{scroll-margin-top:100px}
.story-site .skip,.story-detail .skip{position:fixed;left:16px;top:-100px;z-index:100;background:var(--ink);color:white;padding:12px 20px}
.story-site .skip:focus,.story-detail .skip:focus{top:10px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.review-label{padding:3px 20px;background:#edf0f4;font-size:14px;color:#52616b;text-align:center;line-height:1.7}
.story-site .header,.story-detail .header{position:sticky;top:0;z-index:30;background:rgba(250,251,249,.98);border-bottom:1px solid var(--line)}
.story-site .header-inner,.story-detail .header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:80px}
.story-site .brand,.story-detail .brand{display:inline-flex;flex-direction:column;flex-shrink:0;line-height:1.1;color:var(--ink)}
.story-site .brand>span,.story-detail .brand>span{font-family:Georgia,"Times New Roman",serif;font-size:36px;letter-spacing:-.04em}
.story-site .brand-dot,.story-detail .brand-dot{color:var(--green)}
.story-site .brand small,.story-detail .brand small{font-family:"BIZ UDPGothic","Yu Gothic",Meiryo,sans-serif;font-size:14px;font-weight:700;letter-spacing:.02em;margin-top:6px}
.story-site .header nav,.story-detail .header nav{display:flex;align-items:center;gap:28px;font-size:16px;font-weight:700}
.story-site .header nav>a,.story-detail .header nav>a{padding:10px 0;line-height:1.7}
.story-site .header nav>a:hover,.story-detail .header nav>a:hover{text-decoration:underline;text-underline-offset:6px}
.story-site .header .nav-contact,.story-detail .header .nav-contact{background:var(--ink);color:white;border-radius:6px;padding:12px 22px;min-height:50px}
.story-site .menu-toggle,.story-detail .menu-toggle{display:none}
.story-site .story-button,.story-detail .story-button{display:inline-flex;align-items:center;justify-content:center;padding:15px 28px;min-height:58px;background:var(--ink);border:1px solid var(--ink);border-radius:6px;color:white;font-size:18px;font-weight:700;line-height:1.7}
.story-site .story-button:hover,.story-detail .story-button:hover{background:#3b5660}
.story-site .story-button:active,.story-detail .story-button:active{background:#142d36}
.story-link{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:48px;padding:10px 0;border-bottom:1px solid #94a99c;font-size:17px;font-weight:700;line-height:1.7}
.story-link:hover{text-decoration:underline;text-underline-offset:5px}
.story-link>span{font-size:22px}
.story-hero{display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:64px;padding-block:52px 58px}
.audience{font-size:16px;font-weight:700;color:var(--muted);line-height:1.8}
.story-hero h1{font-size:clamp(40px,4.45vw,56px);margin-block:22px 26px;line-height:1.48}
.hero-pain{font-size:21px;line-height:1.85}
.story-hero .hero-help{font-size:18px;line-height:1.85;margin-top:17px;color:var(--muted)}
.story-hero .story-button{margin-top:28px}
.work-scenes{display:grid;grid-template-columns:1.05fr .85fr;gap:14px;align-items:start}
.work-scene{position:relative;overflow:hidden}
.work-scene img{height:374px;object-fit:cover}
.factory-scene img{object-position:34% center}
.studio-scene{margin-top:65px}
.studio-scene img{height:309px;object-position:55% center}
.work-scene>span{position:absolute;left:0;right:0;bottom:0;background:rgba(22,43,36,.8);color:white;font-size:20px;font-weight:700;padding:14px 17px}
.work-scenes figcaption{grid-column:1/-1;font-size:14px;color:var(--muted);line-height:1.8}
.quick-offers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.quick-offers>a{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:82px;font-size:18px;font-weight:700;padding:20px 22px}
.quick-offers>a:first-child{padding-left:0}
.quick-offers>a:last-child{padding-right:0}
.quick-offers>a+a{border-left:1px solid var(--line)}
.quick-offers>a:hover{text-decoration:underline;text-underline-offset:6px}
.quick-offers>a>span{font-size:24px;font-weight:400}
.change-section{padding-block:76px 74px}
.story-section-heading{display:flex;justify-content:space-between;align-items:end;gap:36px;margin-bottom:38px}
.story-section-heading h2{font-size:42px}
.story-section-heading>p{font-size:18px;color:var(--muted);padding-bottom:6px}
.change-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px}
.change-grid>*{min-width:0}
.example-label{font-size:16px;color:var(--muted);margin-bottom:13px!important}
.change-example h3{font-size:27px;line-height:1.65;margin-bottom:24px;min-height:90px}
.change-visual{padding:24px;background:#edf2ed;min-height:348px;display:flex;flex-direction:column}
.before-note{display:flex;gap:22px;align-items:center}
.before-note>span{color:#5b6a5d;font-size:16px;border-right:1px solid #aebeb1;padding-right:18px}
.before-note p{font-size:20px;line-height:1.65}
.change-arrow{display:block;text-align:center;font-size:28px;color:#456b59;line-height:1.4;margin:8px 0}
.simple-orders{background:white;border-top:3px solid #456b59;padding:16px 18px;margin-top:auto}
.simple-orders>p{font-size:17px;font-weight:700;display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px!important}
.simple-orders>p>span{font-size:14px;font-weight:400;color:var(--muted)}
.simple-orders>div{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:14px 0;border-top:1px solid var(--line);font-size:16px}
.simple-orders strong{font-weight:700;font-size:16px}
.simple-orders b{font-size:14px;font-weight:400;padding:3px 7px;background:#f6edda;color:#705220;border-radius:3px;white-space:nowrap}
.simple-orders b.ready{color:#345943;background:#e8f1e7}
.lesson-visual{background:#edf0f7}
.lesson-visual .change-arrow{color:#566b8b}
.lesson-steps{display:flex;list-style:none;padding:0;margin:14px 0 0;background:white;min-height:91px;align-items:center;justify-content:space-evenly;gap:8px;border-top:3px solid #647a9c}
.lesson-steps li{font-size:21px;font-weight:700;line-height:1.65}
.lesson-steps li+li:before{content:'›';font-size:24px;color:#91a0b7;padding-right:16px}
.lesson-result{font-size:17px;margin-top:17px!important;text-align:center}
.change-example .story-link{width:100%;margin-top:14px}
.example-disclosure{font-size:16px;color:var(--muted);line-height:1.8;margin-top:20px!important}
.sample-shortcut{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line);margin-top:35px;padding-top:28px;font-size:18px}
.sample-shortcut strong{display:inline-flex;align-items:center;gap:25px;font-size:18px}
.sample-shortcut:hover strong{text-decoration:underline;text-underline-offset:6px}
.origin-section{background:var(--sage);padding-block:64px}
.origin-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.origin-inner img{aspect-ratio:1.45;object-fit:cover}
.origin-inner figcaption{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.8}
.origin-inner h2{font-size:38px;margin-block:16px 22px}
.origin-inner>div>p:not(.audience){font-size:20px;line-height:1.95}
.origin-inner .story-link{margin-top:20px}
.home-philosophy{text-align:center;padding-block:70px}
.home-philosophy h2{font-size:43px;margin:18px 0 23px}
.home-philosophy>p:not(.audience){font-size:20px;line-height:1.9}
.home-philosophy .story-link{margin-top:24px}
.home-consult{background:var(--ink);color:white;text-align:center;padding-block:68px}
.home-consult h2{font-size:36px;line-height:1.65}
.home-consult p{font-size:20px;margin-top:22px;line-height:1.8}
.home-consult .story-button{color:var(--ink);background:white;border-color:white;margin-top:27px;padding-inline:38px}
.home-consult .story-button:hover{background:#e5ede7}
.home-consult .consult-reassurance{font-size:16px;margin-top:18px;color:#e2eae7}
.plain-contact{display:inline-block;text-decoration:underline!important;text-underline-offset:5px;font-size:16px;padding:10px;margin-top:5px}
.story-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:25px;padding-block:34px 24px}
.story-footer nav{display:flex;flex-wrap:wrap;gap:14px 26px;font-size:16px}
.story-footer nav a{padding-block:8px;min-height:44px}
.story-footer nav a:hover{text-decoration:underline;text-underline-offset:5px}
.story-footer>small{font-size:14px;width:100%;text-align:right;color:var(--muted)}
.photo-credit{font-size:14px;color:var(--muted);padding-bottom:24px;line-height:1.9}
.photo-credit a{text-decoration:underline;text-underline-offset:4px}
/* Chosen detail pages retain readable, structured explanations. */
.story-detail .shell{max-width:1120px}
.story-detail .detail-intro{padding-block:38px 34px;border-bottom:1px solid var(--line)}
.story-detail .detail-intro .back-link{display:inline-block;font-size:16px;text-decoration:underline;text-underline-offset:5px;margin-bottom:28px;padding-block:5px}
.story-detail .detail-intro>p{font-size:18px;color:var(--muted)}
.story-detail .detail-intro h1{font-size:40px;line-height:1.6;margin:14px 0 20px;max-width:26em}
.story-detail .detail-intro>p:last-child{max-width:42em}
.story-detail .section,.story-detail .philosophy-section{padding-block:56px}
.story-detail .detail-next{border-top:1px solid var(--line);text-align:center;padding-block:50px}
.story-detail .detail-next h2{font-size:28px;margin-bottom:24px}
.story-detail .contact-copy h2{font-size:36px}
.story-detail .story-footer nav{font-size:16px}
.story-detail .story-footer .brand>span{font-size:36px}
.story-detail .workflow-toolbar{top:80px}
.story-site .origin-inner>*{min-width:0}
.story-detail .fax-checks{grid-template-columns:1fr;gap:18px}
.story-detail .fax-checks .fax-illustration{display:block;width:min(100%,280px);height:auto;justify-self:center;aspect-ratio:1;object-fit:contain}
@media(max-width:1050px){
 .story-site .header nav,.story-detail .header nav{gap:20px;font-size:15px}
 .story-hero{gap:35px}
 .story-hero h1{font-size:44px}
 .hero-pain{font-size:20px}
 .work-scene img{height:345px}
 .studio-scene img{height:280px}
 .work-scene>span{font-size:18px;padding:14px 12px}
 .change-grid{gap:28px}
 .change-example h3{font-size:25px}
 .change-visual{padding:20px}
 .simple-orders{padding:14px}
 .simple-orders>div{gap:8px;font-size:15px}
 .lesson-steps li{font-size:18px}
 .lesson-steps li+li:before{padding-right:10px}
 .origin-inner{gap:40px}
 .origin-inner h2{font-size:32px}
}
@media(max-width:850px){
 .shell{width:calc(100% - 48px)}
 .story-site .header-inner,.story-detail .header-inner{min-height:76px}
 .story-site .menu-toggle,.story-detail .menu-toggle{display:flex;align-items:center;gap:9px;background:none;border:1px solid #9aaea5;border-radius:4px;color:var(--ink);padding:10px 12px;min-height:48px;font-size:16px}
 .story-site .menu-icon,.story-detail .menu-icon{display:block;width:16px;height:8px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
 .story-site .header nav,.story-detail .header nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;background:var(--paper);padding:14px 24px 22px;font-size:17px;border-bottom:1px solid var(--line)}
 .story-site .header nav.is-open,.story-detail .header nav.is-open{display:flex}
 .story-site .header nav>a,.story-detail .header nav>a{padding:14px 5px;border-bottom:1px solid var(--line);min-height:48px}
 .story-site .header .nav-contact,.story-detail .header .nav-contact{margin-top:13px;padding:12px 18px;text-align:center}
 .story-hero{grid-template-columns:1fr 1fr;gap:24px;padding-block:38px 42px}
 .story-hero h1{font-size:37px}
 .hero-pain{font-size:19px}
 .story-hero .hero-help{font-size:17px}
 .work-scenes{grid-template-columns:1fr;gap:10px}
 .factory-scene img{height:185px;object-position:35% 55%}
 .studio-scene{margin-top:0}
 .studio-scene img{height:155px}
 .work-scene>span{padding:7px 14px;font-size:18px}
 .work-scenes figcaption{font-size:14px}
 .quick-offers>a{font-size:16px;padding:16px;gap:10px}
 .story-section-heading h2{font-size:36px}
 .change-grid{grid-template-columns:1fr;gap:38px}
 .change-example{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
 .change-example .example-label{grid-column:1;margin:0 0 12px!important}
 .change-example h3{grid-column:1;font-size:24px;min-height:0;margin:0 0 18px}
 .change-example .change-visual{grid-column:2;grid-row:1/4;min-height:300px}
 .change-example .story-link{grid-column:1;font-size:16px;align-self:end}
 .simple-orders>p{display:block}
 .simple-orders>p>span{display:block}
 .simple-orders>div{grid-template-columns:1fr auto}
 .simple-orders>div>span{grid-row:2;font-size:14px}
 .simple-orders>div>b{grid-column:2;grid-row:1/3}
 .lesson-steps{display:block;padding:12px 18px;min-height:0;margin-top:0}
 .lesson-steps li{font-size:20px}
 .lesson-steps li+li{border-top:1px solid #d1d8e5;margin-top:6px;padding-top:6px}
 .lesson-steps li+li:before{display:none}
 .lesson-result{text-align:left;font-size:16px}
 .origin-inner{gap:30px}
 .origin-inner h2{font-size:29px}
 .origin-inner>div>p:not(.audience){font-size:18px}
 .home-philosophy h2{font-size:38px}
 .home-consult h2{font-size:30px}
 .story-detail .workflow-toolbar{top:76px}
}
@media(max-width:620px){
 .story-site{font-size:18px}
 .shell,.story-detail .shell{width:calc(100% - 40px)}
 .story-site .header-inner,.story-detail .header-inner{gap:16px;min-height:74px}
 .story-site .brand>span,.story-detail .brand>span{font-size:30px}
 .story-site .brand small,.story-detail .brand small{font-size:14px}
 .review-label{font-size:14px}
 .story-hero{grid-template-columns:1fr;gap:28px;padding-block:28px 30px}
 .audience{font-size:16px}
 .story-hero h1{font-size:clamp(31px,9.6vw,43px);margin-block:17px 20px;line-height:1.5;letter-spacing:.02em}
 .hero-pain{font-size:20px;line-height:1.85}
 .story-hero .hero-help{font-size:18px;margin-top:14px;line-height:1.85}
 .wide-only{display:none}
 .story-hero .story-button{margin-top:23px;min-height:58px;width:100%;font-size:18px}
 .work-scenes{grid-template-columns:1.05fr .95fr;gap:10px}
 .factory-scene img,.studio-scene img{height:180px}
 .studio-scene{margin-top:24px}
 .work-scene>span{padding:9px 11px;font-size:18px;line-height:1.6}
 .work-scenes figcaption{font-size:14px;line-height:1.8}
 .quick-offers{grid-template-columns:1fr}
 .quick-offers>a,.quick-offers>a:first-child,.quick-offers>a:last-child{padding:17px 0;font-size:18px;min-height:62px}
 .quick-offers>a+a{border-left:0;border-top:1px solid var(--line)}
 .change-section{padding-block:44px 48px}
 .story-section-heading{display:block;margin-bottom:30px}
 .story-section-heading h2{font-size:32px}
 .story-section-heading>p{font-size:18px;margin-top:16px;padding:0}
 .change-grid{gap:38px}
 .change-example{display:block}
 .change-example .example-label{margin-bottom:12px!important;font-size:16px}
 .change-example h3{font-size:26px;line-height:1.65;margin-bottom:20px}
 .change-visual{padding:20px;min-height:0}
 .before-note p{font-size:21px}
 .change-arrow{margin-block:8px}
 .simple-orders{margin:0;padding:16px}
 .simple-orders>p{font-size:18px;display:block;margin-bottom:10px!important}
 .simple-orders>p>span{display:block;font-size:14px}
 .simple-orders>div{padding-block:12px;grid-template-columns:1fr auto;gap:4px 10px;font-size:16px}
 .simple-orders strong{font-size:17px}
 .simple-orders>div>span{grid-row:2;font-size:16px}
 .simple-orders>div>b{grid-column:2;grid-row:1/3;font-size:16px}
 .lesson-steps{padding:12px 18px;margin-top:2px}
 .lesson-steps li{font-size:23px;line-height:1.7}
 .lesson-result{font-size:18px;margin-top:14px!important;text-align:left}
 .change-example .story-link{font-size:17px;width:100%;margin-top:13px}
 .example-disclosure{font-size:16px;margin-top:22px!important}
 .sample-shortcut{display:block;margin-top:28px;padding-top:23px;font-size:18px}
 .sample-shortcut>span{display:block;margin-bottom:9px}
 .sample-shortcut strong{font-size:18px;gap:16px;line-height:1.8}
 .origin-section{padding-block:38px 42px}
 .origin-inner{grid-template-columns:1fr;gap:28px}
 .origin-inner img{aspect-ratio:1.5}
 .origin-inner figcaption{font-size:14px}
 .origin-inner h2{font-size:31px;margin-block:15px 18px}
 .origin-inner>div>p:not(.audience){font-size:19px;line-height:1.9}
 .origin-inner>div>p br{display:none}
 .origin-inner .story-link{margin-top:16px;font-size:18px}
 .home-philosophy{padding-block:45px;text-align:left}
 .home-philosophy h2{font-size:34px;margin-block:16px 20px}
 .home-philosophy>p:not(.audience){font-size:19px}
 .home-philosophy .story-link{font-size:16px;gap:14px;margin-top:18px}
 .home-consult{padding-block:42px}
 .home-consult h2{font-size:27px;line-height:1.75;text-align:left}
 .home-consult p{font-size:19px;text-align:left;margin-top:17px}
 .home-consult .story-button{width:100%;font-size:18px;margin-top:23px;padding-inline:14px}
 .home-consult .consult-reassurance{font-size:16px;text-align:left}
 .home-consult .plain-contact{font-size:16px;text-align:left;padding:8px 0;margin-top:8px}
 .story-footer{display:block;padding-block:28px 20px}
 .story-footer nav{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;font-size:16px;margin-top:25px}
 .story-footer>small{display:block;text-align:left;margin-top:22px;font-size:14px}
 .photo-credit{font-size:14px;padding-bottom:20px}
 .story-detail .detail-intro{padding-block:24px 30px}
 .story-detail .detail-intro .back-link{margin-bottom:22px}
 .story-detail .detail-intro h1{font-size:30px;line-height:1.6}
 .story-detail .detail-intro>p{font-size:18px}
 .story-detail .section,.story-detail .philosophy-section{padding-block:42px}
 .story-detail .detail-next{padding-block:35px}
 .story-detail .detail-next h2{font-size:26px;text-align:left}
 .story-detail .detail-next .story-button{font-size:18px;width:100%}
 .story-detail .story-footer nav{font-size:16px}
 .story-detail .contact-copy h2{font-size:31px}
 .story-detail .workflow-toolbar{top:74px}
}
@media(prefers-reduced-motion:reduce){.story-site *,.story-detail *{transition:none!important;animation:none!important}}
