:root {
  --navy:#0c2b52; --navy-2:#153f76; --ink:#1c1d2b; --paper:#fdf8ee;
  --paper-2:#fffcf5; --paper-3:#fef4d8; --line:#d8bf93; --gold:#b87c14;
  --blue:#1a5fb4; --green:#277a48; --orange:#c55000; --muted:#75664f;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; color:var(--ink); background:var(--paper);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  line-height:1.75; -webkit-font-smoothing:antialiased;
}
a { color:inherit; }
.site-header {
  position:sticky; top:0; z-index:20; background:rgba(9,31,61,.96);
  border-bottom:1px solid rgba(240,201,106,.35); backdrop-filter:blur(12px);
}
.header-inner {
  width:min(1080px,calc(100% - 32px)); min-height:72px; margin:auto;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand img { display:block; width:210px; max-height:54px; object-fit:contain; }
.site-nav { display:flex; align-items:center; gap:4px; }
.site-nav a { padding:10px 12px; color:#fff; font-size:13px; font-weight:700; text-decoration:none; border-radius:8px; }
.site-nav a:hover,.site-nav a[aria-current="page"] { background:rgba(255,255,255,.12); }
.nav-cta { background:linear-gradient(135deg,#d99a24,#b87c14)!important; }
.hero {
  padding:72px 20px 64px; text-align:center; color:#fff;
  background:radial-gradient(circle at 50% 0,rgba(61,123,199,.45),transparent 48%),linear-gradient(155deg,#091f3d,#153f76);
}
.eyebrow { margin:0 0 10px; color:#f0c96a; font-size:13px; font-weight:800; letter-spacing:.12em; }
.hero h1 { margin:0; font-family:"Noto Serif JP",serif; font-size:clamp(30px,6vw,52px); line-height:1.3; }
.hero p { max-width:680px; margin:18px auto 0; color:rgba(255,255,255,.82); }
.page-shell { width:min(960px,calc(100% - 32px)); margin:0 auto; padding:56px 0 80px; }
.lead { max-width:720px; margin:0 auto 44px; text-align:center; color:var(--muted); }
.section { margin-top:56px; }
.section h2 { margin:0 0 20px; color:var(--navy); font-family:"Noto Serif JP",serif; font-size:clamp(23px,4vw,32px); }
.section h2::after { content:""; display:block; width:42px; height:3px; margin-top:10px; background:var(--gold); }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.card {
  padding:24px; background:#fff; border:1px solid #e7d8bd; border-radius:14px;
  box-shadow:0 8px 24px rgba(12,43,82,.07);
}
.card h3 { margin:0 0 8px; color:var(--navy); font-size:18px; }
.card p { margin:0; color:var(--muted); font-size:14px; }
.step-list { display:grid; gap:14px; counter-reset:step; }
.step {
  position:relative; padding:20px 22px 20px 72px; background:#fff;
  border:1px solid #e7d8bd; border-radius:12px;
}
.step::before {
  counter-increment:step; content:counter(step); position:absolute; left:20px; top:20px;
  width:34px; height:34px; display:grid; place-items:center; color:#fff;
  background:var(--navy); border-radius:50%; font-weight:800;
}
.step strong { display:block; color:var(--navy); }
.step span { color:var(--muted); font-size:14px; }
.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; }
.price-card { display:flex; flex-direction:column; padding:26px; background:#fff; border:1px solid #e7d8bd; border-radius:16px; box-shadow:0 8px 24px rgba(12,43,82,.07); }
.price-card.recommended { border:2px solid var(--gold); transform:translateY(-6px); }
.badge { align-self:flex-start; padding:3px 10px; color:#fff; background:var(--gold); border-radius:999px; font-size:11px; font-weight:800; }
.price-card h2 { margin:10px 0 2px; color:var(--navy); font-size:21px; }
.price { margin:14px 0; color:var(--navy); font-size:32px; font-weight:900; }
.price small { font-size:13px; }
.price-card ul { flex:1; margin:0 0 22px; padding-left:20px; color:var(--muted); font-size:14px; }
.button {
  display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:11px 22px;
  color:#fff; background:linear-gradient(135deg,var(--navy-2),var(--navy)); border-radius:9px;
  font-weight:800; text-decoration:none; box-shadow:0 4px 0 #06172d;
}
.button.gold { color:#14243a; background:linear-gradient(135deg,#f0c96a,#d99a24); box-shadow:0 4px 0 #8a5b0c; }
.button.secondary { color:var(--navy); background:#fff; border:1px solid var(--line); box-shadow:none; }
.cta-box { margin-top:56px; padding:34px; text-align:center; background:var(--paper-3); border:1px solid var(--line); border-radius:16px; }
.cta-box h2 { margin:0 0 8px; color:var(--navy); font-family:"Noto Serif JP",serif; }
.cta-box p { margin:0 0 20px; color:var(--muted); }
.faq { display:grid; gap:12px; }
details { background:#fff; border:1px solid #e7d8bd; border-radius:12px; }
summary { padding:18px 52px 18px 20px; color:var(--navy); font-weight:800; cursor:pointer; list-style:none; position:relative; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"＋"; position:absolute; right:20px; }
details[open] summary::after { content:"−"; }
.answer { padding:0 20px 20px; color:var(--muted); font-size:14px; }
.contact-card { max-width:680px; margin:auto; padding:34px; text-align:center; background:#fff; border:1px solid #e7d8bd; border-radius:16px; box-shadow:0 8px 24px rgba(12,43,82,.07); }
.email { display:inline-block; margin:8px 0 16px; color:var(--blue); font-size:clamp(19px,5vw,28px); font-weight:800; text-decoration:none; }
.site-footer { padding:38px 20px; color:rgba(255,255,255,.7); background:#081a34; text-align:center; font-size:12px; }
.footer-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; margin-bottom:16px; }
.footer-nav a { text-decoration:none; }
@media (max-width:760px) {
  .header-inner { min-height:62px; }
  .brand img { width:170px; }
  .site-nav a:not(.nav-cta) { display:none; }
  .hero { padding:54px 20px 50px; }
  .page-shell { padding-top:40px; }
  .card-grid,.price-grid { grid-template-columns:1fr; }
  .price-card.recommended { transform:none; }
}
