:root{--ink:#08263d;--blue:#075c86;--aqua:#41c8d5;--pale:#eaf6f7;--white:#fff;--line:#c9dde3;--max:1120px;--shadow:0 24px 70px rgba(5,45,70,.15)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{margin:0;color:var(--ink);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:2;background:#f8fbfc}
img{display:block;max-width:100%}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;min-height:82px;padding:12px max(24px,calc((100vw - var(--max))/2));background:rgba(248,251,252,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(8,38,61,.1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1.1}
.brand b{display:block;font-size:17px;letter-spacing:.08em}
.brand small{display:block;margin-top:6px;font-family:Arial,sans-serif;font-size:10px;letter-spacing:.14em}
.brand-mark{position:relative;width:44px;height:44px;border-radius:50%;background:var(--ink);overflow:hidden;flex:none}
.brand-mark:before,.brand-mark:after,.brand-mark i{content:"";position:absolute;left:6px;width:33px;height:10px;border:2px solid var(--aqua);border-color:var(--aqua) transparent transparent transparent;border-radius:50%}
.brand-mark:before{top:18px;transform:rotate(-6deg)}
.brand-mark:after{top:25px;transform:rotate(7deg)}
.brand-mark i{top:11px;border-color:white transparent transparent transparent}
.site-header nav{display:flex;gap:24px}
.site-header nav a{text-decoration:none;font-size:14px;font-weight:700;letter-spacing:.04em}
.site-header nav a:hover{color:var(--blue)}
.menu-button{display:none;border:1px solid var(--line);background:white;color:var(--ink);padding:9px 12px;border-radius:4px;font:inherit}
.hero{position:relative;overflow:hidden;background:var(--ink)}
.hero>img{position:relative;width:100%;height:auto;object-fit:contain}
.eyebrow{margin:0 0 14px!important;color:var(--aqua);font-family:Arial,sans-serif;font-weight:700;letter-spacing:.22em}
.section{max-width:var(--max);margin:auto;padding:100px 36px}
.section p{font-size:1rem;margin:1.35em 0}
.lead{font-size:clamp(1.25rem,2.6vw,1.8rem)!important;line-height:1.8;font-weight:700;border-left:5px solid var(--aqua);padding-left:28px;margin-bottom:70px!important}
.intro h2,.media h2,.report>h2{font-size:clamp(1.75rem,3.5vw,2.9rem);line-height:1.5;margin:2.2em 0 .8em}
.wide,.project-image{margin:56px 0;box-shadow:var(--shadow)}
.wide img,.project-image img{width:100%}
.source-diagram{width:min(768px,100%);margin:50px auto}
.source-diagram img{width:100%;height:auto;object-fit:contain}
.plate{width:min(540px,100%);margin:50px auto}
.island{max-width:none;padding-left:max(36px,calc((100vw - var(--max))/2));padding-right:max(36px,calc((100vw - var(--max))/2));background:#fff}
.island.alt{background:var(--pale)}
.section-title{display:flex;align-items:center;gap:22px}
.section-title>span{font-family:Arial,sans-serif;font-size:4rem;line-height:1;color:var(--aqua);font-weight:200}
.section-title p{margin:0;color:var(--blue);font-family:Arial,sans-serif;font-size:.78rem;letter-spacing:.2em;font-weight:700}
.section-title h2{margin:5px 0 0;font-size:2.5rem;line-height:1.2}
.caption{font-size:1.2rem!important;font-weight:700}
.media{text-align:center}
.movie-links{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:42px}
.movie-links a{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;background:var(--ink);color:white;text-decoration:none;font-family:Arial,sans-serif;letter-spacing:.08em}
.movie-links a:hover{background:var(--blue)}
.movie-links span{font-size:.75rem;color:var(--aqua)}
.message{display:grid;grid-template-columns:220px 1fr;gap:64px;border-top:1px solid var(--line)}
.portrait img{width:180px;height:180px;object-fit:cover;border-radius:50%;box-shadow:0 0 0 10px white,0 0 0 11px var(--line)}
.message h2{margin:0 0 42px;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.65}
.signature{text-align:right;font-weight:700;letter-spacing:.1em}
.report{max-width:880px}
.report-date{font-weight:700}
.external{display:inline-block;background:var(--blue);color:white;text-decoration:none;padding:13px 20px}
.report h3{margin-top:54px;font-size:1.4rem}
.supporters{margin-top:55px;padding:26px 32px;background:white;border-top:4px solid var(--aqua);box-shadow:var(--shadow)}
.supporters h3{margin-top:0}
.supporters dl{margin:0}
.supporters dl div{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:12px 0;border-top:1px solid var(--line)}
.supporters dt,.supporters dd{margin:0}
footer{background:var(--ink);color:white;text-align:center;padding:65px 24px}
.footer-brand{justify-content:center}
.footer-brand .brand-mark{background:white}
.footer-brand .brand-mark:before,.footer-brand .brand-mark:after{border-color:var(--aqua) transparent transparent transparent}
.footer-brand .brand-mark i{border-color:var(--ink) transparent transparent transparent}
footer>p{color:#b9d3dd;letter-spacing:.1em}
footer>small{color:#86a8b5}
.office-credit{display:flex;flex-direction:column;gap:4px;margin-top:24px;color:#86a8b5;font-size:.78rem;line-height:1.7}
.office-credit a{color:#b9d3dd;text-underline-offset:3px}
.office-credit a:hover{color:#fff}
 @media(max-width:820px){.site-header{min-height:72px}
.site-header nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:white;border-bottom:1px solid var(--line);padding:10px 24px 18px}
.site-header nav.open{display:flex}
.site-header nav a{padding:12px 0;border-bottom:1px solid #e7f0f2}
.menu-button{display:block}
.section{padding:72px 24px}
.movie-links{grid-template-columns:1fr}
.message{grid-template-columns:1fr;gap:38px}
.portrait img{width:140px;height:140px}
.supporters dl div{grid-template-columns:1fr;gap:0}
.brand b{font-size:14px}
.brand small{font-size:8px}
.brand-mark{width:38px;height:38px}
.section-title>span{font-size:3rem}
}