:root{--ink:#15172b;--blue:#4c63ab;--text:#3d4160;--line:#e2e5ee;--g:clamp(16px,3.2vw,48px)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font-family:"Google Sans",system-ui,sans-serif;font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:var(--blue)}
.ltr{direction:ltr;unicode-bidi:isolate}
.skip{position:fixed;top:-60px;right:16px;z-index:100;background:var(--ink);color:#fff;padding:12px 18px;font-weight:600;border-radius:0 0 10px 10px;text-decoration:none;transition:top .2s}
.skip:focus{top:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
footer :focus-visible,.lhead :focus-visible{outline-color:#fff}
.top{display:flex;align-items:center;gap:20px;height:80px;max-width:1320px;margin:0 auto;padding:0 var(--g)}
.top .home img{height:30px;display:block}
.top .btn{margin-inline-start:auto}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 22px;border-radius:999px;font:600 16px/1 "Google Sans",system-ui,sans-serif;background:var(--ink);color:#fff;text-decoration:none;border:2px solid var(--ink);transition:background .2s}
.btn:hover{background:var(--blue);border-color:var(--blue)}
.btn svg{width:20px;height:20px}
.lhead{background:var(--ink);color:#fff;padding:clamp(56px,8vw,110px) var(--g);position:relative;overflow:hidden}
.lhead::after{content:"";position:absolute;width:clamp(160px,24vw,340px);aspect-ratio:1;background:var(--blue);border-radius:0 0 100% 0;top:0;left:0}
.lhead .in{max-width:1320px;margin:0 auto;position:relative;z-index:1}
.lbl{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:#c9d1ec;margin-bottom:22px}
.lbl a{color:#fff}
.lhead h1{margin:0;font-size:clamp(44px,7.4vw,112px);font-weight:700;letter-spacing:-.035em;line-height:.95;max-width:10em}
.lhead p{margin:24px 0 0;color:#c9d1ec;font-size:15px}
main{max-width:1320px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--g) clamp(64px,8vw,120px);display:grid;grid-template-columns:minmax(0,260px) minmax(0,780px);gap:clamp(32px,6vw,96px);justify-content:start}
.toc{position:sticky;top:24px;align-self:start;border-top:4px solid var(--ink);padding-top:16px;font-size:15px}
.toc b{display:block;margin-bottom:10px}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:t}
.toc li{counter-increment:t;padding:5px 0}
.toc li::before{content:counter(t,decimal-leading-zero) "  ";color:var(--blue);font-weight:700;font-size:13px}
.toc a{color:var(--text);text-decoration:none}
.toc a:hover{color:var(--ink);text-decoration:underline}
article h2{font-size:clamp(24px,2.4vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.15;margin:56px 0 14px;padding-top:16px;border-top:4px solid var(--ink)}
article h2:first-child{margin-top:0}
article h3{font-size:19px;margin:28px 0 8px}
article p,article li{color:var(--text)}
article p{margin:0 0 14px}
article ul{margin:0 0 16px;padding-inline-start:22px}
article li{margin-bottom:8px}
article li::marker{color:var(--blue)}
article strong{color:var(--ink)}
.box{background:#f4f5f9;border-inline-start:6px solid var(--blue);padding:18px 22px;margin:20px 0}
.box p:last-child{margin:0}
footer{background:var(--ink);color:#c4c8da;padding:40px var(--g);font-size:15px}
footer .in-w{max-width:1320px;margin:0 auto;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
footer img{height:30px;display:block}
footer .bf{color:#fff;font-weight:500;letter-spacing:.06em}
footer .sp{margin-inline-start:auto;display:flex;gap:22px;align-items:center;flex-wrap:wrap}
footer a{color:#fff;text-decoration:none;border-bottom:2px solid var(--blue);padding-bottom:2px}
footer a[aria-current]{border-color:#fff}
@media (max-width:860px){
  main{grid-template-columns:1fr}
  .toc{position:static}
}
@media (max-width:560px){
  body{font-size:16px}
  .top .btn span{display:none}
  .top .btn{padding:0 14px}
  footer .sp{margin-inline-start:0;width:100%}
}
@media (prefers-reduced-motion:reduce){.skip,.btn{transition:none}}