:root{color-scheme:light;--paper:#f8fcfd;--ink:#142f3c;--muted:#46606b;--line:#c7dde4;--accent:#146680;--water:#e5f4f8;--wash:#eff8fa;--sans:"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans","Microsoft YaHei",sans-serif;--mono:"SFMono-Regular",Consolas,monospace}
html[lang="ja"]{--sans:"MS Mincho","ＭＳ 明朝","Hiragino Mincho ProN","Yu Mincho","Noto Serif CJK JP",serif;--mono:var(--sans)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans)}
a{color:inherit;text-decoration:none}
button,summary{font:inherit;cursor:pointer}
img{display:block;max-width:100%}
figure,p,h1,h2,h3,h4{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.shell{width:min(1440px,calc(100% - 112px));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:5;background:var(--paper);border-bottom:1px solid var(--line)}
.header-inner{width:min(1440px,calc(100% - 112px));min-height:86px;margin:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.brand{display:inline-flex;position:relative;align-items:center;justify-self:start}
/* Recolor the white lettering through its alpha mask, keeping the original red seal. */
.brand::before{content:"";position:absolute;inset:0;background:var(--ink);mask:url("assets/logo.png") center/contain no-repeat;clip-path:inset(0 0 0 23%);pointer-events:none}
.brand img{width:146px;height:auto;clip-path:inset(0 77% 0 0)}
.main-nav,.langs{display:flex;align-items:center}
.main-nav{gap:clamp(20px,3vw,46px);font-size:13px;font-weight:650;white-space:nowrap}
.main-nav a{transition:color .18s}
.main-nav a:hover{color:var(--accent)}
.langs{justify-self:end;gap:2px;border:1px solid var(--line);border-radius:100px;padding:3px}
.langs a{min-width:34px;height:31px;display:grid;place-items:center;border-radius:100px;font-size:11px;font-weight:750}
.langs a[aria-current]{background:var(--ink);color:white}
.langs a:not([aria-current]):hover{background:var(--water)}
.mobile-nav{display:none}
.hero-stage{background:linear-gradient(110deg,var(--paper),var(--water));border-bottom:1px solid var(--line)}
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(525px,69vh,820px);color:white;background:var(--ink);overflow:hidden}
.hero-photo{position:absolute;inset:0;z-index:-1}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:58% 53%}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#061b28e8 0%,#061c28b0 30%,#0b253338 65%,#0b25331c 100%),linear-gradient(0deg,#061b28a8,transparent 43%)}
.hero-copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(20px,2.8vw,38px);padding-block:clamp(70px,9vw,142px) clamp(66px,7vw,105px)}
.eyebrow,.number,.poster-index,.image-count,.archive-count{font:600 11px/1.3 var(--mono);letter-spacing:.13em}
.eyebrow{display:flex;align-items:center;gap:10px}
.hero .eyebrow{color:#d6f0f5}
.signal{width:36px;height:1px;display:inline-block;background:#a7d9e6}
.hero h1{font-size:clamp(52px,7.5vw,126px);line-height:1.03;letter-spacing:-.073em;font-weight:780;max-width:100%}
.hero h1 span{display:block}
.hero h1 span:last-child{color:#d7f0f5}
:lang(ja) .hero h1{font-size:clamp(42px,5.9vw,96px);letter-spacing:-.07em;line-height:1.1}
:lang(en) .hero h1{font-size:clamp(49px,7vw,110px);letter-spacing:-.073em;line-height:.99}
.hero-actions{display:flex;align-items:center;gap:clamp(18px,3vw,38px)}
.pill{display:inline-flex;align-items:center;gap:clamp(15px,2.2vw,33px);background:var(--paper);color:var(--ink);border:1px solid var(--paper);border-radius:100px;padding:11px 19px;font-size:13px;font-weight:720;transition:background .18s}
.pill:hover{background:#d4edf3}
.hero-more{font-size:13px;font-weight:720;padding-block:9px;border-bottom:1px solid #c1e5efa3}
.hero-more:hover{color:#d4edf3}
.hero-caption{position:absolute;inset:auto 0 24px;min-height:46px;display:flex;align-items:center;color:#e6f2f4;font:650 10px var(--mono);letter-spacing:.14em;pointer-events:none}
.hero-baseline{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:66px;font-size:12px;gap:12px}
.hero-baseline a{justify-self:end;display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;font-size:18px;line-height:1}
.hero-baseline span:first-child{font-weight:720}
.section{padding-block:clamp(65px,8vw,119px)}
.section-heading{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:11px 20px;padding-bottom:25px;border-bottom:1px solid var(--line);margin-bottom:clamp(30px,4vw,58px)}
.section-heading .eyebrow{grid-column:1/-1}
.section-heading h2{font-size:clamp(42px,5.9vw,86px);line-height:1.07;letter-spacing:-.062em}
.section-heading .eyebrow,.number{color:var(--accent)}
.about-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(30px,7vw,100px)}
.about-grid h3,.strengths h3{font-size:clamp(23px,3vw,36px);letter-spacing:-.045em;margin-bottom:15px}
.about-grid p,.service-body>p,.strengths p{color:var(--muted);max-width:67ch}
.about-grid p+p{margin-top:15px}
.vision{background:linear-gradient(140deg,#f8fdff,var(--water));border:1px solid var(--line);border-top:3px solid var(--accent);padding:clamp(24px,3vw,45px)}
.vision .eyebrow{margin-bottom:12px}
.strengths{margin-top:55px}
.strengths>div{display:grid;grid-template-columns:1fr 1fr;gap:0 35px}
.strengths article{border-top:1px solid var(--line);padding:20px 0;display:grid;grid-template-columns:39px 1fr;gap:8px}
.strengths .number{padding-top:7px}
.strengths h4{font-size:17px;margin-bottom:3px}
.service-section{background:var(--wash);border-block:1px solid var(--line)}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,42px);align-items:start}
.service{min-width:0;background:var(--paper);border:1px solid var(--line)}
.service-body{padding:clamp(22px,3vw,42px)}
.service-photo{aspect-ratio:16/9;position:relative;overflow:hidden;background:var(--water)}
.service-photo img{width:100%;height:100%;object-fit:cover}
.image-count{position:absolute;bottom:12px;left:12px;background:#142f3cdc;color:#fff;padding:8px 10px}
.service h3{font-size:clamp(25px,3vw,42px);line-height:1.17;letter-spacing:-.045em;margin:9px 0 13px}
.service-body .service-subtitle{font-size:12px;color:var(--accent);margin-bottom:10px}
.scope{border-top:1px solid var(--line);margin-top:18px}
.scope summary{padding-block:12px;font-weight:700;font-size:14px}
.scope ul{margin:0;padding:0 0 4px 18px;color:var(--muted);font-size:14px}
.scope li+li{margin-top:5px}
.posters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}
.posters button{display:block;width:100%;text-align:left;color:inherit;background:transparent;border:0;padding:0}
.posters img{width:100%;aspect-ratio:4/5.7;object-fit:contain;background:var(--wash);border:1px solid var(--line);border-radius:3px;transition:background .2s}
.posters button:hover img{background:var(--water)}
.featured-posters{gap:clamp(16px,2.7vw,40px)}
.featured-posters img{background:#e8f1f4;border:0;border-radius:0;box-shadow:0 16px 32px -25px #13374870}
.featured-posters .poster-index{margin-top:7px;padding-bottom:13px}
.poster-index{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:11px 1px 10px}
.poster-index span{font-size:15px;color:var(--accent)}
.archive{margin-top:30px}
.archive summary{display:flex;align-items:center;justify-content:space-between;font-weight:720;padding:15px 20px;list-style:none;border:1px solid var(--line);background:var(--wash)}
.archive summary:hover{background:var(--water)}
.archive summary::-webkit-details-marker,.mobile-nav summary::-webkit-details-marker{display:none}
.archive summary span{color:var(--accent);font-size:20px}
.archive[open] summary span{transform:rotate(180deg)}
.archive .posters{margin-top:26px}
.poster-dialog{background:var(--ink);color:white;border:1px solid var(--line);margin:auto;max-width:calc(100% - 24px);max-height:calc(100% - 24px);padding:40px 12px 12px}
.poster-dialog::backdrop{background:#0b2332df}
.poster-dialog img{max-height:82vh;object-fit:contain}
.poster-dialog form{position:absolute;right:5px;top:2px}
.poster-dialog button{background:transparent;color:white;border:0;font-size:28px;line-height:1.1;padding:4px 10px}
footer{background:var(--wash);border-top:1px solid var(--line)}
.footer-inner{padding-top:62px}
.footer-contact{padding-bottom:38px;font-size:14px}
.footer-contact p{margin:10px 0;color:var(--muted)}
address{display:grid;gap:4px;font-style:normal}
address a{width:max-content;max-width:100%;overflow-wrap:anywhere}
address a:hover{text-decoration:underline}
.footnote{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:15px 0 22px;color:var(--muted)}
@media(max-width:1050px){
.shell{width:calc(100% - 64px)}
.header-inner{width:calc(100% - 48px)}
}
@media(max-width:760px){
html{scroll-padding-top:74px}
.shell,.header-inner{width:calc(100% - 34px)}
.header-inner{min-height:60px;grid-template-columns:1fr auto auto;gap:10px}
.brand img{width:108px}
.main-nav{display:none}
.mobile-nav{display:block;position:relative}
.mobile-nav summary{list-style:none;width:35px;height:35px;display:grid;align-content:center;justify-items:center;gap:5px;border:1px solid var(--line);border-radius:50%}
.mobile-nav summary span{width:13px;height:1px;background:var(--ink)}
.mobile-nav nav{position:absolute;right:0;top:44px;min-width:160px;background:var(--paper);border:1px solid var(--line);padding:8px 14px;box-shadow:0 10px 24px #142f3c19}
.mobile-nav nav a{display:block;padding:7px 0;white-space:nowrap}
.langs a{min-width:28px;height:26px}
.hero{min-height:clamp(495px,77vh,630px)}
.hero-copy{padding-block:65px 71px;gap:21px}
.hero-photo img{object-position:62% 50%}
.hero-photo::after{background:linear-gradient(0deg,#061b28ef 0%,#061b28c2 34%,#061b283b 73%,#061b280f)}
.hero h1{font-size:clamp(38px,9.8vw,69px)}
:lang(en) .hero h1{font-size:clamp(36px,11vw,70px)}
:lang(ja) .hero h1{font-size:clamp(31px,7.1vw,54px)}
.hero-caption{bottom:16px;min-height:32px}
.hero-baseline{font-size:10px;grid-template-columns:1fr auto;min-height:45px}
.hero-baseline a{display:none}
.section{padding-block:59px}
.section-heading{grid-template-columns:1fr auto;row-gap:5px;padding-bottom:15px;margin-bottom:24px}
.about-grid,.service-grid{grid-template-columns:1fr;gap:24px}
.vision{padding:20px}
.strengths{margin-top:32px}
.strengths>div{grid-template-columns:1fr}
.strengths article{padding:14px 0}
.posters{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.footer-inner{padding-top:45px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
