/* ===== アーカイブ／検索結果 共通スタイル（is_archive/is_search 等で自動読込） =====
   ブログ一覧(home.php)と同じエディトリアル＋サイドバーの体裁に統一。 */

/* --- 土台（定期的な光源で背景の単調さ回避） --- */
.arch-wrap{padding:120px 0 60px;background-color:var(--void);background-image:
  radial-gradient(700px 700px at 92% 16%, rgba(232,32,144,.18), transparent 58%),
  radial-gradient(640px 640px at 4% 44%, rgba(30,200,222,.15), transparent 58%),
  radial-gradient(700px 700px at 94% 72%, rgba(245,133,42,.14), transparent 58%),
  radial-gradient(640px 640px at 6% 96%, rgba(122,52,192,.22), transparent 60%)}
.arch-wrap .mw{max-width:1180px}
.arch-wrap::before{display:none!important}

/* --- パンくず --- */
.arch-wrap .crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0 0 20px;font-size:.76rem}
.arch-wrap .crumbs li{color:var(--soft-2)}
.arch-wrap .crumbs li:not(:last-child)::after{content:"\203a";margin-left:8px;color:var(--mut)}
.arch-wrap .crumbs a{color:var(--pink)}
.arch-wrap .crumbs a:hover{color:#fff}

/* --- ヘッダー --- */
.arch-head{margin-bottom:30px}
.arch-head .eng{display:block;color:var(--pink);margin-bottom:10px}
.arch-title{font-family:var(--min);font-weight:700;color:#fff;font-size:clamp(1.6rem,3.4vw,2.3rem);letter-spacing:.06em;line-height:1.5}
.arch-desc{margin-top:14px;color:var(--soft-2);font-size:.88rem;line-height:1.9;max-width:760px}
.arch-count{display:inline-block;margin-top:14px;font-family:var(--cor);font-style:italic;color:var(--soft-2);font-size:.85rem}
.arch-empty{color:var(--soft-2);font-size:.92rem;line-height:1.95;padding:20px 0}

/* --- 2カラム（本文＋サイドバー） --- */
.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.blog-main{min-width:0}
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}

/* --- カード（ブログ一覧と共通の見た目） --- */
.bcard{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(198,168,222,.16);transition:transform .4s,border-color .4s,box-shadow .4s}
.bcard:hover{transform:translateY(-5px);border-color:rgba(255,98,166,.5);box-shadow:0 16px 34px rgba(232,32,144,.24)}
.bcard-img{position:relative;display:block;aspect-ratio:16/11;overflow:hidden}
.bcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.bcard:hover .bcard-img img{transform:scale(1.06)}
.bcard-cat{position:absolute;top:12px;left:12px;font-size:.6rem;letter-spacing:.06em;padding:4px 11px;border-radius:20px;background:rgba(20,8,32,.68);color:#fff;border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.bcard-b{padding:15px 17px 18px;display:flex;flex-direction:column;gap:6px}
.bcard-date{font-family:var(--cor);font-style:italic;color:var(--pink);font-size:.8rem}
.bcard-title{font-family:var(--min);color:#fff;font-size:.94rem;line-height:1.55;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* --- サイドバー --- */
.blog-side{display:flex;flex-direction:column;gap:24px;position:sticky;top:96px}
.side-box{background:rgba(255,255,255,.04);border:1px solid rgba(198,168,222,.16);border-radius:12px;padding:20px 20px 22px}
.side-cocoblog{background:linear-gradient(150deg,rgba(122,52,192,.24),rgba(232,32,144,.16));border-color:rgba(255,98,166,.32)}
.side-h{font-family:var(--min);color:#fff;font-size:1rem;font-weight:600;letter-spacing:.06em;margin-bottom:14px;padding-bottom:11px;border-bottom:1px solid rgba(198,168,222,.16)}
.side-note{color:var(--soft-2);font-size:.8rem;line-height:1.85;margin-bottom:14px}
.side-link{display:inline-flex;align-items:center;gap:5px;color:var(--pink);font-size:.82rem;letter-spacing:.03em;font-weight:600;line-height:1.6;transition:color .25s}
.side-link:hover{color:#fff}
.side-search{display:flex;gap:8px}
.side-search input{flex:1;min-width:0;background:rgba(0,0,0,.28);border:1px solid rgba(198,168,222,.3);border-radius:30px;padding:10px 16px;color:#fff;font-family:var(--jp);font-size:.82rem}
.side-search input::placeholder{color:var(--mut)}
.side-search input:focus{outline:none;border-color:var(--pink)}
.side-search button{flex:none;width:42px;height:42px;border:none;border-radius:50%;background:var(--hot);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:filter .25s}
.side-search button:hover{filter:brightness(1.08)}
.side-list{list-style:none;margin:0;padding:0}
.side-list li{margin:0;border-bottom:1px solid rgba(198,168,222,.1)}
.side-list li:last-child{border-bottom:0}
.side-list a{display:block;padding:9px 4px;color:var(--soft-2);font-size:.84rem;transition:color .25s,padding .25s}
.side-list a:hover{color:var(--pink);padding-left:9px}
.side-cat li{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--mut);font-size:.74rem}
.side-cat li a{flex:1;padding:9px 0;border:0}
.side-cat li a:hover{padding-left:6px}
.side-cat li.is-current a{color:var(--pink);font-weight:700}

/* --- ページャー --- */
.pager .page-numbers.current{background:var(--hot);border-color:transparent;color:#fff}
.pager a.page-numbers:hover{border-color:var(--pink);color:#fff}

/* --- CTA（共通の予約バナー） --- */
.hubcta{position:relative;text-align:center;padding:0;background:#2A1150 url('../img/flower-shizuku.jpg') center/cover}
.hubcta::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(106,44,176,.74) 0%,rgba(232,32,144,.6) 40%,rgba(47,182,230,.56) 68%,rgba(245,133,42,.66) 100%)}
.hubcta .mw{position:relative;z-index:1;padding:78px 40px}
.hubcta .eng{color:rgba(255,255,255,.9);display:block;margin-bottom:14px}
.hubcta h2{font-family:var(--min);font-weight:700;color:#fff;font-size:clamp(1.4rem,3vw,2.1rem);line-height:1.7;letter-spacing:.06em;margin:0 0 12px;text-shadow:0 2px 16px rgba(0,0,0,.25)}
.hubcta p{color:rgba(255,255,255,.92);font-size:.82rem;margin-bottom:28px;letter-spacing:.04em}
.hubcta .book{background:#fff;color:#8A1E5A}
.hubcta .book:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.34)}

/* --- レスポンシブ --- */
@media(max-width:980px){
  .blog-layout{grid-template-columns:1fr;gap:44px}
  .blog-side{position:static;top:auto}
}
@media(max-width:760px){
  .arch-wrap{padding:96px 0 52px}
  .blog-grid{grid-template-columns:1fr}
  .hubcta .mw{padding:62px 24px}
}

/* --- スマホ横はみ出し対策：長い英単語/URLの折り返し＋サイドバーの最小幅 --- */
.blog-side{min-width:0}
.blog-grid,.blog-main{min-width:0}
.bcard-title,.arch-title,.arch-desc,.side-link,.side-list a,.side-note{overflow-wrap:anywhere;word-break:break-word}
