:root { --ink:#07152c; --blue:#265cff; --cyan:#4ce3ff; --paper:#f5f8ff; --line:#d7e0f2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans JP","Hiragino Sans",sans-serif; line-height:1.8; }
a { color:inherit; }
.hero { min-height:92vh; display:grid; place-items:center; padding:72px 22px; color:white; background:radial-gradient(circle at 82% 12%,#2168ff 0,transparent 30%),linear-gradient(145deg,#061226,#102b60); }
.hero__inner { width:min(1080px,100%); }
.eyebrow { color:var(--cyan); font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
h1 { margin:.2em 0; font-size:clamp(42px,7vw,86px); line-height:1.06; letter-spacing:-.04em; }
.lead { max-width:720px; font-size:clamp(18px,2.3vw,25px); color:#dce8ff; }
.hero__actions,.cta { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin-top:32px; }
.button { appearance:none; border:0; border-radius:12px; padding:17px 26px; background:linear-gradient(135deg,var(--cyan),#72ffcf); color:#03213b; font-size:18px; font-weight:900; cursor:pointer; box-shadow:0 12px 32px #00163766; }
.button:disabled { opacity:.55; cursor:not-allowed; }
.button--secondary { background:white; border:1px solid var(--line); box-shadow:none; }
.count { font-variant-numeric:tabular-nums; font-size:20px; font-weight:900; color:var(--cyan); }
.section { padding:88px 22px; }
.section__inner { width:min(980px,100%); margin:auto; }
.section h2 { font-size:clamp(30px,4.5vw,52px); line-height:1.25; margin:0 0 28px; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.card { padding:28px; border:1px solid var(--line); border-radius:18px; background:white; box-shadow:0 16px 42px #36558712; }
.card b { display:block; color:var(--blue); font-size:18px; }
.dark { color:white; background:var(--ink); }
.offer-box { padding:clamp(28px,6vw,64px); border-radius:28px; background:white; color:var(--ink); }
.price { font-size:clamp(42px,7vw,72px); font-weight:900; line-height:1; }
.price small { font-size:18px; }
.nav { position:fixed; z-index:10; top:0; left:0; right:0; padding:14px 22px; background:#061226dd; color:white; backdrop-filter:blur(12px); }
.nav__inner { width:min(1080px,100%); margin:auto; display:flex; justify-content:space-between; align-items:center; }
.nav a { text-decoration:none; font-weight:800; }
.note { color:#6c7891; font-size:14px; }
footer { padding:35px 22px; text-align:center; color:#67758e; }
@media (max-width:760px) { .grid{grid-template-columns:1fr}.hero{min-height:auto;padding-top:110px}.section{padding:64px 20px}.nav__inner span{display:none} }