@font-face { font-family:'Heebo'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/heebo-400.woff') format('woff'); }
@font-face { font-family:'Heebo'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/heebo-500.woff') format('woff'); }
@font-face { font-family:'Heebo'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/heebo-600.woff') format('woff'); }
@font-face { font-family:'Heebo'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/heebo-700.woff') format('woff'); }
@font-face { font-family:'Heebo'; font-style:normal; font-weight:800; font-display:swap; src:url('../fonts/heebo-800.woff') format('woff'); }
@font-face { font-family:'Heebo'; font-style:normal; font-weight:900; font-display:swap; src:url('../fonts/heebo-900.woff') format('woff'); }
:root { color-scheme:light; --navy:#073b91; --deep:#052d79; --yellow:#ffe000; --ink:#16365f; }
* { box-sizing:border-box; }
body { margin:0; background:#eef7ff; color:var(--ink); font-family:'Heebo',Arial,sans-serif; }
.site-head { background:linear-gradient(135deg,var(--deep),var(--navy)); border-bottom:6px solid var(--yellow); color:white; padding:20px clamp(18px,5vw,72px); display:flex; justify-content:space-between; align-items:center; gap:20px; }
.brand { color:var(--yellow); font-size:clamp(24px,4vw,34px); font-weight:900; text-decoration:none; }
.back-link { color:white; font-size:16px; font-weight:700; text-decoration:underline; text-underline-offset:4px; }
.page { width:min(1050px,calc(100% - 32px)); margin:36px auto 56px; }
.hero { padding:34px clamp(22px,5vw,56px); color:white; background:linear-gradient(125deg,#087bdd,#0751bc); border:4px solid white; border-radius:28px; box-shadow:0 8px 0 #064795; }
h1 { margin:0; color:var(--yellow); font-size:clamp(30px,5vw,48px); line-height:1.25; font-weight:900; }
.lead { margin:14px 0 0; font-size:18px; line-height:1.8; }
.contents { display:flex; flex-wrap:wrap; gap:10px; margin:25px 0; padding:18px; background:white; border:2px solid #c7e7ff; border-radius:18px; }
.contents a { display:inline-flex; align-items:center; min-height:40px; padding:7px 13px; border-radius:12px; background:#e8f5ff; color:var(--navy); font-weight:700; text-decoration:none; }
.contents a:hover,.contents a:focus-visible { background:var(--yellow); outline:2px solid var(--navy); outline-offset:2px; }
article { padding:clamp(22px,4vw,40px); background:white; border:1px solid #d4e8fa; border-radius:24px; box-shadow:0 8px 24px rgba(5,45,121,.08); }
section { scroll-margin-top:20px; margin-top:30px; }
h2 { margin:0 0 13px; color:var(--navy); font-size:clamp(23px,3.5vw,30px); line-height:1.35; font-weight:900; }
section p { margin:9px 0; font-size:17px; line-height:1.9; }
.clause { padding-right:14px; border-right:3px solid #59b9f5; }
strong { font-weight:800; }
.page-end { margin-top:24px; text-align:center; }
.page-end a { color:var(--navy); font-weight:800; }
footer { padding:17px; color:white; background:var(--navy); text-align:center; font-size:14px; font-weight:700; }
@media(max-width:600px) { .site-head { padding:15px 16px; } .back-link { font-size:14px; } .page { width:calc(100% - 20px); margin:20px auto 32px; } .hero { padding:25px 20px; border-radius:20px; } .lead { font-size:16px; } .contents { gap:8px; padding:13px; } .contents a { font-size:14px; padding:6px 9px; } article { padding:22px 17px; border-radius:18px; } section p { font-size:16px; } }