:root{
  --brand:#e3643a; /* accent orange */
  --brand-dark:#c3502f;
  --bg:#ffffff;
  --ink:#1a1a1a;
  --muted:#6b7280;
  --line:#e5e7eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; color:var(--ink); background:var(--bg); line-height:1.7}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1100px, 92%); margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:auto}

/* Header */
.site-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px; padding:12px 0}
.logo{display:inline-flex;align-items:center}
.logo img{height:36px;width:auto}
.nav-toggle{display:none}
.nav-list{display:flex;gap:20px;list-style:none;margin:0;padding:0;align-items:center}
.nav-list a{padding:8px 6px;color:#444}
.nav-list .btn-small{background:var(--brand); color:#fff; padding:8px 12px; border-radius:6px}

/* Hero */
.hero{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.75)}
.hero-content{position:relative;color:#fff;text-align:center;padding:80px 0}
.eyebrow{letter-spacing:.1em;text-transform:uppercase;font-size:.85rem;opacity:.9}
.hero h1{font-family:Montserrat, system-ui, sans-serif; font-size:clamp(28px, 4.2vw, 46px); line-height:1.25; margin:.4em 0}
.lead{opacity:.9}
.hero-actions{display:flex;gap:12px;justify-content:center;margin-top:18px;flex-wrap:wrap}
.scroll-down{position:absolute;left:50%;bottom:18px;translate:-50% 0;width:20px;height:20px;border-bottom:2px solid #fff;border-right:2px solid #fff;rotate:45deg;opacity:.8}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:8px;font-weight:600;border:2px solid transparent;transition:.2s ease}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark)}
.btn-outline{background:transparent;color:#fff;border-color:#fff}
.btn-outline:hover{background:#ffffff1a}
.btn-line{background:#06c755;color:#fff}
.btn-block{display:block;width:100%}

/* Strip */
.strip{padding:16px 0;background:#f8fafc;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.strip-inner{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}

/* Sections */
.section{padding:64px 0}
.section h2{font-family:Montserrat, system-ui, sans-serif; font-size:clamp(22px,3.2vw,32px); margin:0 0 12px}
.section-lead{color:var(--muted); margin-bottom:24px}

/* Cards & grids */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.card-media{aspect-ratio:16/9}
.bg-cover{background-size:cover;background-position:center}
.card-body{padding:14px}
.card h3{margin:0 0 6px;font-size:1.1rem}

/* Guides */
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.guide{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff;position:relative}
.guide h3{margin:0}
.guide-link{color:var(--brand);font-weight:600}
.guide:hover{box-shadow:0 6px 20px #0000000d; transform:translateY(-2px); transition:.2s}

/* Prices */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.price-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;padding:16px;display:flex;flex-direction:column;gap:10px}
.price-title{background:#eee;padding:10px 12px;border-radius:8px;font-weight:700}
.price-value{font-family:Montserrat,system-ui,sans-serif;font-weight:800;font-size:28px}
.price-value span{font-weight:600;font-size:.8em;color:var(--muted);margin-right:8px}
.price-note{color:var(--muted);margin:0 0 6px}

/* Banners */
.banner{position:relative;min-height:260px;display:grid;place-items:center;color:#fff;text-align:center;overflow:hidden}
.banner-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.7)}
.banner-content{position:relative;padding:56px 0}

/* News */
.news-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.news-list li{display:flex;gap:16px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);background:#fff}
.news-list li:last-child{border-bottom:none}
.news-list time{color:var(--muted);min-width:96px}
.news-list a{color:#1f2937}

/* Blog */
.post .post-title{margin:0 0 6px}
.post .post-meta{color:var(--muted);margin:0}

/* Footer */
.site-footer{background:#111;color:#ddd;padding:36px 0}
.footer-brand{display:flex;gap:18px;align-items:center}
.footer-brand img{height:32px}
.footer-meta{margin-top:16px;color:#aaa}

/* Responsive */
@media (max-width: 960px){
  .grid-3, .price-grid, .guide-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  .grid-3, .price-grid, .guide-grid{grid-template-columns:1fr}
  .nav-toggle{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);padding:8px 10px;border-radius:8px}
  .nav-list{position:absolute;inset:60px 0 auto;flex-direction:column;gap:0;background:#fff;border-bottom:1px solid var(--line);padding:6px 0;display:none}
  .nav-list.open{display:flex}
}

