@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Noto+Sans+JP:wght@400;500;700&family=Yomogi&display=swap');
:root{--board:#193f3c;--paper:#f6f1dc;--mint:#d5e3d6;--coral:#ef765f;--yellow:#f3d87d;--line:#86a799}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--board);font-family:'Noto Sans JP',sans-serif;font-size:16px;line-height:1.85}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:.3em}
a:focus-visible,summary:focus-visible{outline:3px solid var(--coral);outline-offset:5px}
.wrap{width:min(1120px,calc(100% - 48px));margin:auto}
.eyebrow{font:12px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.hand{font-family:Yomogi,'Noto Sans JP',sans-serif;font-weight:400}
.site-header{border-bottom:1px solid #b2c1b5}
.header-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font:30px Yomogi,sans-serif;white-space:nowrap}
.logo span{color:var(--coral)}
.logo img{display:block;width:180px;height:auto}
.nav{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;font-size:15px}
.nav a[aria-current=page]{text-decoration:underline;text-decoration-color:var(--coral);text-decoration-thickness:3px;text-underline-offset:8px}
.nav .contact-link{border:1px solid var(--board);padding:5px 12px}
.hero{position:relative;background:var(--board);color:var(--paper);overflow:hidden}
.hero-inner{min-height:540px;padding:80px 0 90px;position:relative;z-index:1}
.hero h1,.page-hero h1{font:clamp(42px,6vw,76px)/1.28 Yomogi,'Noto Sans JP',sans-serif;letter-spacing:-.035em;margin:22px 0}
.hero h1 em{font-style:normal;color:var(--yellow)}
.hero p{max-width:690px;color:#e0e9e0;font-size:17px;line-height:2.1}
.chalk-mark{position:absolute;width:480px;height:480px;border:3px dashed var(--line);border-radius:49% 51% 44% 56%;right:-85px;top:36px;transform:rotate(-9deg);pointer-events:none}
.chalk-mark:after{content:'✳';position:absolute;left:110px;top:70px;color:var(--coral);font:160px Yomogi,sans-serif}
.page-hero{background:var(--board);color:var(--paper);padding:74px 0 82px}
.page-hero h1{font-size:clamp(40px,5.2vw,62px);margin:18px 0}
.page-hero p{max-width:760px;color:#e0e9e0;font-size:17px;line-height:2}
.section{padding:82px 0}
.section h2{font:clamp(34px,4.2vw,48px)/1.45 Yomogi,'Noto Sans JP',sans-serif;margin:10px 0 24px}
.section p{max-width:760px}
.section-lead{font-size:18px;line-height:2}
.split{display:grid;grid-template-columns:.65fr 1.35fr;gap:64px}
.mint{background:var(--mint)}
.dark{background:var(--board);color:var(--paper)}
.dark p{color:#e0e9e0}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:32px}
.feature{background:var(--paper);border:2px dashed var(--line);padding:28px;min-height:220px}
.feature:nth-child(2){transform:rotate(1deg)}
.feature h3{font:26px/1.5 Yomogi,'Noto Sans JP',sans-serif;margin:14px 0}
.feature p{margin:0;color:#435d54}
.text-link{display:inline-block;border-bottom:2px solid currentColor;padding-bottom:3px;font-family:Yomogi,'Noto Sans JP',sans-serif;font-size:18px}
.row-list{margin-top:30px;border-bottom:1px dashed var(--line)}
.row{display:grid;grid-template-columns:76px 1fr 1.4fr;gap:24px;align-items:start;padding:24px 0;border-top:1px dashed var(--line)}
.row-number{color:#b14d3f;font:24px Yomogi,sans-serif}
.row h3{font-size:20px;line-height:1.5;margin:0}
.row p{margin:0;color:#3d5c53}
.service{padding:62px 0;border-bottom:1px dashed var(--line)}
.service:last-child{border-bottom:0}
.service-head{display:flex;align-items:baseline;gap:22px}
.service-head span{color:#b14d3f;font:26px Yomogi,sans-serif}
.service h2{margin:0 0 12px}
.service .examples{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.examples div{padding:18px;border-top:2px dashed var(--line)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:28px}
.step{border-top:2px dashed var(--line);padding-top:16px}
.step b{display:block;font-size:19px;margin:9px 0}
.step p{font-size:15px;margin:0}
.details{margin:24px 0 0;border-top:1px dashed var(--line)}
.details div{display:grid;grid-template-columns:190px 1fr;gap:20px;border-bottom:1px dashed var(--line);padding:20px 0}
.details dt{font-weight:700}.details dd{margin:0}
.cta{background:var(--coral);text-align:center;padding:64px 24px}
.cta h2{font:clamp(32px,4vw,44px)/1.4 Yomogi,sans-serif;margin:8px 0 24px}
.site-footer{background:var(--board);color:var(--paper);padding:32px 0;font-size:14px}
.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-inner nav{display:flex;gap:12px 24px;flex-wrap:wrap}
@media(max-width:760px){.header-inner{padding:16px 0;align-items:flex-start;flex-direction:column}.nav{gap:8px 18px}.hero-inner{min-height:510px;padding:62px 0}.chalk-mark{width:260px;height:260px;right:-85px;top:285px}.chalk-mark:after{font-size:90px;left:58px;top:43px}.hero p{max-width:570px}.split,.feature-grid,.steps{grid-template-columns:1fr}.split{gap:16px}.section{padding:62px 0}.feature:nth-child(2){transform:none}.feature{min-height:0}.row{grid-template-columns:54px 1fr;gap:8px 16px}.row p{grid-column:2}.service .examples{grid-template-columns:1fr}.details div{grid-template-columns:1fr;gap:2px}.page-hero{padding:58px 0}}
@media(max-width:430px){.wrap{width:min(100% - 32px,1120px)}.nav{font-size:14px}.hero h1{font-size:42px}.hero p,.page-hero p{font-size:16px}.chalk-mark{opacity:.45}}