
:root{
 --ink:#182330;--muted:#687481;--paper:#fffdfa;--soft:#f1f6fa;--line:#dce5ec;
 --navy:#173b5d;--blue:#367db8;--sky:#8bc4e7;--red:#c84b48;--gold:#d1a854;
 --dark:#102536;--white:#fff;--shadow:0 18px 50px rgba(21,40,58,.10)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.8}
a{text-decoration:none;color:inherit}.wrap{width:min(1180px,calc(100% - 40px));margin:auto}
header{position:sticky;top:0;z-index:30;background:rgba(255,253,250,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav{min-height:78px;display:flex;justify-content:space-between;align-items:center;gap:22px}
.brand{font-weight:900;letter-spacing:.04em;color:var(--navy)}.brand small{display:block;font-size:9px;letter-spacing:.15em;color:var(--muted);font-weight:800}
nav{display:flex;gap:16px;align-items:center;font-size:.88rem;font-weight:750}.nav-cta{padding:9px 14px;border-radius:999px;background:var(--navy);color:#fff}
.hero{padding:92px 0 78px;background:radial-gradient(circle at 80% 20%,rgba(139,196,231,.28),transparent 32%),linear-gradient(135deg,#fbfdff,#edf6fb 58%,#fff9ed)}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:center}
.eyebrow{font-size:.73rem;letter-spacing:.15em;text-transform:uppercase;font-weight:900;color:var(--blue)}
h1,h2,h3{line-height:1.1;letter-spacing:-.035em;margin:0 0 18px}h1{font-size:clamp(3rem,7vw,6rem)}h2{font-size:clamp(2.15rem,4.7vw,3.6rem)}h3{font-size:1.35rem}
.lead{font-size:1.18rem;color:var(--muted);max-width:830px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 17px;border-radius:999px;border:1px solid var(--line);font-weight:850}.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}.btn.red{background:var(--red);color:#fff;border-color:var(--red)}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow)}.hero-card p{color:var(--muted)}
section{padding:74px 0}.soft{background:var(--soft)}.dark{background:var(--dark);color:#fff}.dark p{color:#d8e1e8}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid6{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:23px;box-shadow:0 10px 28px rgba(0,0,0,.04)}.card p{color:var(--muted)}
.loop-step{background:#fff;border:1px solid var(--line);padding:18px;border-radius:16px;min-height:150px}.loop-step b{display:block;color:var(--red);margin-bottom:8px}
.then-now-next{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tnn{padding:26px;border-radius:20px;border:1px solid var(--line);background:#fff}.tnn strong{font-size:.78rem;letter-spacing:.14em;color:var(--blue)}.tnn.now{border-top:4px solid var(--red)}.tnn.next{border-top:4px solid var(--gold)}
.subhero{padding:74px 0 58px;background:linear-gradient(135deg,#fbfdff,#eef6fb)}.subhero h1{font-size:clamp(2.7rem,5.5vw,5rem)}
.quote{border-left:3px solid var(--gold);padding:18px 22px;background:#fffaf0;color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:26px}.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:25px}
.intern{background:#152f44;color:#fff}.intern p{color:#d5e2ea}.intern .btn{background:var(--gold);border-color:var(--gold);color:#121212}
footer{padding:40px 0 60px;border-top:1px solid var(--line);color:var(--muted);font-size:.88rem}.footer-grid{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap}
@media(max-width:960px){nav{display:none}.hero-grid,.grid2,.grid3,.grid6,.then-now-next,.split{grid-template-columns:1fr}}
