:root{--navy:#071d35;--navy-light:#12395f;--blue:#1587d4;--sky:#eaf7ff;--sky-2:#f5fbff;--text:#172231;--muted:#667587;--border:#dce6ef;--white:#fff;--max-width:1180px;--shadow:0 12px 34px #08243f14}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text);background:var(--white);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans JP,sans-serif;line-height:1.75}a{color:inherit;text-decoration:none}img{max-width:100%}.container{width:min(calc(100% - 40px), var(--max-width));margin:0 auto}.site-header{z-index:50;border-bottom:1px solid var(--border);backdrop-filter:blur(12px);background:#fffffff5;position:sticky;top:0}.header-inner{width:min(calc(100% - 40px), var(--max-width));justify-content:space-between;align-items:center;gap:32px;min-height:76px;margin:auto;display:flex}.brand{color:var(--navy);align-items:center;gap:11px;display:flex}.brand-mark{background:var(--navy);color:#fff;border-radius:12px;place-items:center;width:42px;height:42px;font-size:21px;display:grid}.brand strong{font-size:19px;line-height:1.15;display:block}.brand small{color:var(--muted);letter-spacing:.08em;margin-top:3px;font-size:10px;display:block}.main-nav{align-items:center;gap:25px;font-size:14px;font-weight:600;display:flex}.main-nav a:hover{color:var(--blue)}.hero{color:#fff;background:radial-gradient(circle at 80% 40%,#3ab5ff42,#0000 32%),linear-gradient(135deg,#06192d 0%,#0b3357 58%,#126ca3 100%);align-items:center;min-height:560px;display:flex}.hero-content{width:min(calc(100% - 40px), var(--max-width));margin:auto;padding:90px 0}.hero-badge,.eyebrow{letter-spacing:.17em;color:var(--blue);font-size:12px;font-weight:800}.hero-badge{color:#bce7ff;border:1px solid #ffffff40;border-radius:999px;margin-bottom:21px;padding:7px 12px;display:inline-block}.hero h1{letter-spacing:-.04em;max-width:760px;margin:0;font-size:clamp(42px,7vw,76px);line-height:1.12}.hero h1 span{color:#7ed3ff}.hero p{color:#dcecff;max-width:660px;margin:27px 0 0;font-size:17px}.hero-buttons{flex-wrap:wrap;gap:14px;margin-top:38px;display:flex}.button{border-radius:9px;justify-content:center;align-items:center;min-height:49px;padding:0 23px;font-weight:700;display:inline-flex}.button.primary{color:#fff;background:#28a9ee}.button.secondary{color:#fff;border:1px solid #ffffff6b}.button.white{color:var(--navy);background:#fff}.section{padding:82px 0}.soft-section{background:var(--sky-2)}.section-heading{justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px;display:flex}.section-heading h2{color:var(--navy);margin:7px 0 0;font-size:clamp(27px,4vw,38px);line-height:1.25}.category-grid{grid-template-columns:repeat(5,1fr);gap:16px;display:grid}.category-card{border:1px solid var(--border);background:#fff;border-radius:16px;min-height:220px;padding:25px;transition:transform .2s,box-shadow .2s}.category-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}.category-card-icon{font-size:31px}.category-card h3{color:var(--navy);margin:15px 0 7px;font-size:19px}.category-card p{color:var(--muted);margin:0;font-size:13px}.category-more{color:var(--blue);margin-top:16px;font-size:12px;font-weight:700;display:block}.article-grid{grid-template-columns:repeat(3,1fr);gap:22px;display:grid}.article-card{border:1px solid var(--border);background:#fff;border-radius:15px;transition:transform .2s,box-shadow .2s;overflow:hidden}.article-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}.article-card a{height:100%;padding:25px;display:block}.article-category{background:var(--sky);color:#10679c;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:700;display:inline-flex}.article-card h3{color:var(--navy);margin:15px 0 9px;font-size:19px;line-height:1.5}.article-card p{color:var(--muted);margin:0;font-size:14px}.article-meta{color:#8a96a3;margin-top:19px;font-size:12px}.category-hero{text-align:center;background:linear-gradient(#edf9ff,#fff);padding:75px 0}.category-icon{font-size:44px}.category-hero h1{color:var(--navy);margin:10px 0;font-size:43px}.category-hero p{color:var(--muted);margin:0}.article-shell{width:min(100% - 40px,900px);margin:0 auto;padding:35px 0 90px}.breadcrumbs{color:var(--muted);flex-wrap:wrap;gap:8px;margin-bottom:30px;font-size:12px;display:flex}.breadcrumbs a:hover{color:var(--blue)}.article-header{border-bottom:1px solid var(--border);padding-bottom:32px}.article-header h1{color:var(--navy);letter-spacing:-.025em;margin:16px 0;font-size:clamp(32px,5vw,47px);line-height:1.35}.article-lead{color:var(--muted);font-size:16px}.article-dates{color:#8995a2;gap:20px;margin-top:20px;font-size:12px;display:flex}.article-content{padding-top:27px;font-size:16px}.article-content h2{border-bottom:3px solid var(--blue);color:var(--navy);margin:58px 0 20px;padding-bottom:12px;font-size:27px}.article-content h3{color:var(--navy);margin:38px 0 14px;font-size:21px}.article-content p{margin:18px 0}.article-content ul,.article-content ol{margin:20px 0;padding-left:27px}.article-content li{margin:8px 0}.article-content a{color:var(--blue);text-decoration:underline}.article-content blockquote{border-left:4px solid var(--blue);background:var(--sky-2);margin:28px 0;padding:15px 20px}.empty-state{border:1px dashed var(--border);text-align:center;color:var(--muted);border-radius:14px;padding:55px}.beginner-section{background:var(--navy);color:#fff;padding:68px 0}.beginner-inner{justify-content:space-between;align-items:center;gap:35px;display:flex}.beginner-inner h2{margin:8px 0;font-size:34px}.beginner-inner p{color:#c9d8e8;max-width:720px;margin:0}.eyebrow.light{color:#7ed3ff}.site-footer{color:#fff;background:#051525;padding:45px 0}.footer-inner{width:min(calc(100% - 40px), var(--max-width));justify-content:space-between;gap:30px;margin:auto;display:flex}.footer-inner p{color:#9db0c2}.copyright{font-size:12px}@media (width<=1000px){.category-grid{grid-template-columns:repeat(3,1fr)}.article-grid{grid-template-columns:repeat(2,1fr)}.main-nav{display:none}}@media (width<=650px){.container,.header-inner,.hero-content,.footer-inner,.article-shell{width:min(calc(100% - 28px), var(--max-width))}.hero{min-height:500px}.hero-content{padding:65px 0}.hero h1{font-size:43px}.section{padding:58px 0}.category-grid,.article-grid{grid-template-columns:1fr}.category-card{min-height:unset}.beginner-inner,.footer-inner{flex-direction:column;align-items:flex-start}.article-header h1{font-size:31px}}.footer-links{flex-wrap:wrap;justify-content:center;gap:10px 20px;margin-top:18px;font-size:13px;display:flex}.footer-links a{color:inherit;opacity:.78}.footer-links a:hover{opacity:1;text-decoration:underline}
