.page-hero::before{content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;background:radial-gradient(circle,rgba(89,190,240,.15) 0%,transparent 70%);pointer-events:none;}
.page-hero h1{font-size:36px;font-weight:900;letter-spacing:.06em;margin-bottom:8px;}
.page-hero .hero-lead{font-size:16px;opacity:.9;letter-spacing:.03em;font-weight:500;margin-bottom:0;}
.page-hero .breadcrumb{font-size:12px;opacity:.6;margin-bottom:16px;}
.page-hero .breadcrumb a:hover{opacity:1;}

/* CATEGORY FILTER */
.cat-filter{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:40px;}
.cat-btn{padding:10px 24px;border-radius:8px;border:1px solid var(--border);background:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:all .2s;font-family:'Noto Sans JP',sans-serif;color:var(--txt2);}
.cat-btn:hover{border-color:var(--green);color:var(--green);}
.cat-btn.active{background:var(--green);color:#fff;border-color:var(--green);}

/* BLOG GRID */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:48px;}
.blog-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 24px rgba(0,0,0,.06);border:1px solid var(--border);transition:transform .3s,box-shadow .3s;text-decoration:none;color:var(--txt);display:flex;flex-direction:column;}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 8px 32px rgba(0,0,0,.1);}
.blog-card-thumb{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--surface);}
.blog-card-body{padding:20px;display:flex;flex-direction:column;flex:1;}
.blog-card-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.blog-card-date{font-size:12px;color:var(--txt2);}
.blog-card-cat{font-size:11px;font-weight:700;padding:3px 10px;border-radius:4px;color:#fff;}
.blog-card-cat.is-news{background:var(--sky);}
.blog-card-cat.is-column{background:var(--green);}
.blog-card-title{font-size:15px;font-weight:700;line-height:1.7;margin-bottom:8px;flex:1;}
.blog-card-excerpt{font-size:13px;color:var(--txt2);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* PAGINATION */
.pagination{display:flex;justify-content:center;align-items:center;gap:4px;}
.pagination a,.pagination span{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none;transition:all .2s;}
.pagination a{color:var(--txt2);border:1px solid var(--border);background:#fff;}
.pagination a:hover{border-color:var(--green);color:var(--green);}
.pagination span.current{background:var(--green);color:#fff;border:1px solid var(--green);}
.pagination .prev,.pagination .next{width:auto;padding:0 16px;font-size:13px;}

/* CTA */
.cta-section{text-align:center;padding:72px 20px;background:var(--grad-vivid);color:#fff;position:relative;overflow:hidden;}
.cta-section::before{content:'';position:absolute;top:50%;left:50%;width:600px;height:600px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(89,190,240,.12) 0%,transparent 70%);pointer-events:none;}
.cta-section h2{font-size:26px;font-weight:900;margin-bottom:12px;position:relative;}
.cta-section p{font-size:15px;opacity:.85;margin-bottom:32px;position:relative;}
.cta-buttons{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;position:relative;}
.btn-cta-main{display:inline-block;background:var(--cta);color:#fff;border-radius:8px;padding:18px 52px;font-size:16px;font-weight:700;text-decoration:none;transition:background .3s,transform .2s;box-shadow:0 4px 24px rgba(234,47,35,.4);}
.btn-cta-main:hover{background:var(--cta-hover);transform:translateY(-2px);}
.btn-line{display:inline-block;background:var(--line);color:#fff;border-radius:8px;padding:18px 36px;font-size:16px;font-weight:700;text-decoration:none;transition:transform .2s;box-shadow:0 4px 20px rgba(6,199,85,.3);}
.btn-line:hover{transform:translateY(-2px);}

/* FLOATING */
.floating{position:fixed;bottom:24px;right:24px;z-index:999;display:flex;flex-direction:column;gap:8px;}
.fl-cta{background:var(--cta);color:#fff;border-radius:12px;padding:16px 28px;font-size:14px;font-weight:700;text-decoration:none;text-align:center;box-shadow:0 4px 24px rgba(234,47,35,.35);transition:background .3s,transform .2s;display:flex;align-items:center;gap:8px;}
.fl-cta:hover{background:var(--cta-hover);transform:translateY(-2px);}
.fl-cta::before{content:'';width:8px;height:8px;background:#fff;border-radius:50%;animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.4;}}
.fl-line{background:var(--line);color:#fff;border-radius:12px;padding:12px 24px;font-size:12px;font-weight:700;text-decoration:none;text-align:center;box-shadow:0 4px 20px rgba(6,199,85,.3);}

/* RESPONSIVE */

  .page-hero h1{font-size:24px;}
  .page-hero .hero-lead{font-size:14px;}

  .cat-filter{gap:6px;margin-bottom:28px;}
  .cat-btn{padding:8px 16px;font-size:12px;}

  .blog-grid{grid-template-columns:1fr;gap:16px;}
  .blog-card-body{padding:16px;}
  .blog-card-title{font-size:14px;}

  .pagination a,.pagination span{width:36px;height:36px;font-size:13px;}

  .cta-section{padding:48px 16px;}
  .cta-section h2{font-size:22px;}
  .cta-section p{font-size:14px;margin-bottom:24px;}
  .cta-buttons{flex-direction:column;gap:12px;max-width:320px;margin:0 auto;}
  .btn-cta-main,.btn-line{padding:16px 24px;font-size:15px;text-align:center;width:100%;}

  .floating{bottom:0;right:0;left:0;flex-direction:row;padding:10px 12px;background:#fff;border-top:1px solid var(--border);border-radius:0;gap:8px;}
  .fl-cta{flex:7;border-radius:8px;padding:14px;justify-content:center;font-size:13px;}
  .fl-line{flex:3;border-radius:8px;padding:14px;font-size:11px;}
  body{padding-bottom:64px;}
