/* ============================================================
   Main CSS — 非クリティカル（非ブロック読み込み）
   Below the fold / インタラクション / 詳細スタイル
   ============================================================ */

/* === Type Nav (フロントページ) === */
.fb-type-nav{padding:48px 0 32px}
.fb-type-nav__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.fb-type-card{display:flex;flex-direction:column;align-items:center;padding:32px 24px;background:#fff;border-radius:12px;border:2px solid #e8e8ef;text-align:center;transition:border-color .2s,box-shadow .2s}
.fb-type-card:hover{border-color:#c0392b;box-shadow:0 4px 20px hsla(0,0%,0%,.06)}
.fb-type-card__icon{font-size:2.5rem;margin-bottom:12px}
.fb-type-card__name{font-size:1.05rem;font-weight:700;color:#1a1a2e;margin-bottom:4px}
.fb-type-card__count{font-size:.8rem;color:#6b7280}

/* === Section === */
.fb-section{padding:56px 0}
.fb-section--alt{background:#f0f1f5}
.fb-section__header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:28px;gap:16px}
.fb-section__title{font-family:'Noto Serif JP',serif;font-size:1.5rem;font-weight:700;color:#1a1a2e;letter-spacing:.02em}
.fb-section__more{font-size:.875rem;font-weight:600;color:#c0392b;white-space:nowrap}
.fb-section__more:hover{text-decoration:underline}

/* === Card 詳細スタイル === */
.fb-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e8e8ef;transition:box-shadow .2s,transform .2s}
.fb-card:hover{box-shadow:0 8px 30px hsla(0,0%,0%,.08);transform:translateY(-2px)}
.fb-card__link{display:block;color:inherit}
.fb-card__image{position:relative;aspect-ratio:16/9;overflow:hidden;background:#e8e8ef}
.fb-card__image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.fb-card:hover .fb-card__image img{transform:scale(1.03)}
.fb-card__badge{position:absolute;top:12px;left:12px}
.fb-card__body{padding:20px}
.fb-card__title{font-size:1.05rem;font-weight:700;line-height:1.5;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fb-card__interviewee{font-size:.8rem;color:#6b7280;margin-bottom:8px;line-height:1.6}
.fb-card__name{font-weight:600;color:#1a1a2e}
.fb-card__position,.fb-card__company{display:block}
.fb-card__excerpt{font-size:.85rem;color:#4b5563;line-height:1.7;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fb-card__meta{display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:#9ca3af;gap:8px}
.fb-card__industry{background:#f3f4f6;padding:2px 8px;border-radius:4px}
.fb-card__read-more{font-weight:600;color:#c0392b}

/* --- Featured Card --- */
.fb-card--featured{grid-column:1/-1}
.fb-card__link--featured{display:grid;grid-template-columns:1fr 1fr}
.fb-card__image--featured{aspect-ratio:auto;min-height:280px}
.fb-card__body--featured{padding:32px;display:flex;flex-direction:column;justify-content:center}
.fb-card__title--featured{font-family:'Noto Serif JP',serif;font-size:1.4rem}
.fb-card__quote{font-style:italic;color:#4b5563;font-size:.9rem;line-height:1.7;margin-bottom:12px;padding-left:16px;border-left:3px solid #c0392b}

/* === Archive Header === */
.fb-archive-header{padding:40px 0 24px;border-bottom:1px solid #e8e8ef;margin-bottom:32px}
.fb-archive-header__title{font-family:'Noto Serif JP',serif;font-size:1.75rem;font-weight:700;margin-bottom:8px}
.fb-archive-header__description{font-size:.95rem;color:#6b7280;line-height:1.7}

/* === Filter Nav === */
.fb-filter-nav{margin-bottom:32px;display:flex;flex-direction:column;gap:12px}
.fb-filter-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fb-filter-group__label{font-size:.8rem;font-weight:600;color:#6b7280;margin-right:4px}
.fb-filter-tag{display:inline-block;padding:6px 14px;font-size:.8rem;border:1px solid #d1d5db;border-radius:20px;color:#4b5563;transition:all .15s}
.fb-filter-tag:hover,.fb-filter-tag.is-active{background:#c0392b;border-color:#c0392b;color:#fff}
.fb-filter-tag__count{font-size:.7rem;opacity:.7}

/* === Breadcrumb === */
.fb-breadcrumb{background:#f9fafb;border-bottom:1px solid #e8e8ef;padding:12px 0}
.fb-breadcrumb__list{display:flex;flex-wrap:wrap;gap:4px;font-size:.8rem;color:#9ca3af}
.fb-breadcrumb__list li:not(:last-child)::after{content:"/";margin-left:4px;color:#d1d5db}
.fb-breadcrumb__list a{color:#6b7280;transition:color .15s}
.fb-breadcrumb__list a:hover{color:#c0392b}

/* === Interview Single === */

/* Profile Card */
.fb-profile-card{display:flex;gap:24px;background:hsla(0,0%,100%,.08);border:1px solid hsla(0,0%,100%,.12);border-radius:12px;padding:24px;margin:24px 0}
.fb-profile-card__photo{flex-shrink:0;width:160px;border-radius:10px;overflow:hidden}
.fb-profile-card__photo img{width:100%;height:100%;object-fit:cover}
.fb-profile-card__info{flex:1}
.fb-profile-card__name{font-family:'Noto Serif JP',serif;font-size:1.25rem;font-weight:700;margin-bottom:4px}
.fb-profile-card__title{font-size:.9rem;color:hsla(0,0%,100%,.8);margin-bottom:2px}
.fb-profile-card__company{font-size:.85rem;margin-bottom:12px}
.fb-profile-card__company a{color:#e94560;text-decoration:underline}
.fb-profile-card__details{display:flex;flex-wrap:wrap;gap:16px}
.fb-detail{display:flex;flex-direction:column;gap:1px}
.fb-detail__label{font-size:.7rem;color:hsla(0,0%,100%,.6);text-transform:uppercase;letter-spacing:.05em}
.fb-detail__value{font-size:.85rem;font-weight:600}

/* Interview Hero */
.fb-interview-hero{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);color:#fff;padding:48px 0 56px}
.fb-interview-hero__type{margin-bottom:16px}
.fb-interview-hero__title{font-family:'Noto Serif JP',serif;font-size:clamp(1.5rem,3vw,2.25rem);font-weight:700;line-height:1.4;margin-bottom:16px}
.fb-interview-hero__quote{margin:20px 0;padding:16px 24px;border-left:4px solid #e94560;font-style:italic;font-size:1.05rem;line-height:1.7;color:hsla(0,0%,100%,.85)}

/* Interview Meta */
.fb-interview-meta{display:flex;gap:16px;font-size:.85rem;color:hsla(0,0%,100%,.6);margin-top:20px}

/* Interview Body */
.fb-interview-body{font-size:1rem;line-height:1.9;color:#2d3748}
.fb-interview-body h2{font-family:'Noto Serif JP',serif;font-size:1.35rem;font-weight:700;margin:48px 0 16px;padding-bottom:8px;border-bottom:2px solid #e8e8ef;color:#1a1a2e}
.fb-interview-body h3{font-size:1.15rem;font-weight:700;margin:32px 0 12px;color:#1a1a2e}
.fb-interview-body p{margin-bottom:20px}
.fb-interview-body blockquote{margin:24px 0;padding:20px 24px;background:#fef9f0;border-left:4px solid #c0392b;border-radius:0 8px 8px 0;font-style:italic;color:#4b5563}
.fb-interview-body ul,.fb-interview-body ol{margin:16px 0 20px 24px}
.fb-interview-body li{margin-bottom:8px}
.fb-interview-body ol{list-style:decimal}
.fb-interview-body ul{list-style:disc}
.fb-interview-body strong{color:#1a1a2e}
.fb-interview-body a{color:#c0392b;text-decoration:underline;text-underline-offset:2px}

/* Interview Footer (tags, share) */
.fb-interview-footer{margin-top:48px;padding-top:32px;border-top:1px solid #e8e8ef}
.fb-tag-group{margin-bottom:16px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fb-tag-group__label{font-size:.8rem;font-weight:600;color:#6b7280}
.fb-tag{display:inline-block;padding:4px 12px;font-size:.78rem;background:#f3f4f6;border-radius:4px;color:#4b5563;transition:background .15s}
.fb-tag:hover{background:#e8e8ef}

/* Share */
.fb-share{display:flex;align-items:center;gap:10px;margin-top:20px}
.fb-share__label{font-size:.8rem;font-weight:600;color:#6b7280}
.fb-share__btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;font-size:.85rem;font-weight:700;transition:all .2s}
.fb-share__btn--x{background:#1a1a2e;color:#fff}
.fb-share__btn--x:hover{background:#333}
.fb-share__btn--facebook{background:#1877f2;color:#fff}
.fb-share__btn--facebook:hover{background:#1565c0}
.fb-share__btn--linkedin{background:#0077b5;color:#fff}
.fb-share__btn--linkedin:hover{background:#005f8d}

/* === Related === */
.fb-related{padding:56px 0;background:#f0f1f5}
.fb-related__title{font-family:'Noto Serif JP',serif;font-size:1.35rem;font-weight:700;margin-bottom:24px}
.fb-related__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}

/* === Sidebar === */
.fb-sidebar .fb-widget{margin-bottom:28px;background:#fff;border-radius:10px;border:1px solid #e8e8ef;padding:20px}
.fb-widget__title{font-size:.9rem;font-weight:700;color:#1a1a2e;margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid #c0392b}
.fb-sidebar-nav__link{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:.85rem;color:#4b5563;border-bottom:1px solid #f3f4f6;transition:color .15s}
.fb-sidebar-nav__link:hover{color:#c0392b}
.fb-sidebar-nav__count{font-size:.75rem;color:#9ca3af}

/* Popular List Widget */
.fb-popular-list__item{margin-bottom:12px}
.fb-popular-list__item a{display:flex;gap:12px;align-items:center}
.fb-popular-list__thumb{flex-shrink:0;width:64px;height:36px;border-radius:4px;overflow:hidden}
.fb-popular-list__thumb img{width:100%;height:100%;object-fit:cover}
.fb-popular-list__name{display:block;font-size:.8rem;font-weight:600;color:#1a1a2e;line-height:1.4}
.fb-popular-list__company{display:block;font-size:.7rem;color:#9ca3af}

/* === Topic Cloud === */
.fb-topic-cloud{display:flex;flex-wrap:wrap;gap:8px}
.fb-topic-tag{display:inline-block;padding:6px 14px;font-size:.82rem;background:#fff;border:1px solid #d1d5db;border-radius:20px;color:#4b5563;transition:all .15s}
.fb-topic-tag:hover{background:#c0392b;border-color:#c0392b;color:#fff}
.fb-topic-tag--sm{padding:4px 10px;font-size:.75rem}

/* === Industry Grid === */
.fb-industry-grid{display:flex;flex-wrap:wrap;gap:10px}
.fb-industry-tag{display:inline-flex;align-items:center;gap:4px;padding:8px 16px;font-size:.85rem;background:#fff;border:1px solid #d1d5db;border-radius:8px;color:#4b5563;transition:all .15s}
.fb-industry-tag:hover{border-color:#c0392b;color:#c0392b}
.fb-industry-tag__count{font-size:.75rem;color:#9ca3af}

/* === CTA === */
.fb-cta{background:linear-gradient(135deg,#c0392b 0%,#a93226 100%);color:#fff;padding:64px 0;text-align:center}
.fb-cta__title{font-family:'Noto Serif JP',serif;font-size:1.5rem;font-weight:700;margin-bottom:12px}
.fb-cta__text{font-size:.95rem;color:hsla(0,0%,100%,.85);line-height:1.7;margin-bottom:28px}

/* === Pagination === */
.fb-pagination{margin-top:40px;text-align:center}
.fb-pagination .page-numbers{display:inline-flex;gap:0;list-style:none}
.fb-pagination .page-numbers li{margin:0}
.fb-pagination .page-numbers a,.fb-pagination .page-numbers span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 8px;font-size:.85rem;border:1px solid #d1d5db;border-radius:6px;margin:0 2px;color:#4b5563;transition:all .15s}
.fb-pagination .page-numbers a:hover{background:#f3f4f6}
.fb-pagination .page-numbers .current{background:#c0392b;border-color:#c0392b;color:#fff}

/* === Empty State === */
.fb-empty{text-align:center;padding:80px 20px}
.fb-empty h1{font-size:4rem;font-weight:800;color:#e8e8ef;margin-bottom:8px}
.fb-empty h2{font-size:1.35rem;font-weight:700;margin-bottom:12px}
.fb-empty p{font-size:.95rem;color:#6b7280;margin-bottom:24px}
.fb-empty__actions{display:flex;gap:12px;justify-content:center}

/* === Page Content === */
.fb-page-header{padding:40px 0 24px}
.fb-page-header__title{font-family:'Noto Serif JP',serif;font-size:1.75rem;font-weight:700}
.fb-page-body{font-size:1rem;line-height:1.9;color:#2d3748}
.fb-page-body h2{font-size:1.35rem;font-weight:700;margin:40px 0 16px;color:#1a1a2e}
.fb-page-body p{margin-bottom:20px}

/* === Footer === */
.fb-footer{background:#1a1a2e;color:#fff;padding:40px 0}
.fb-footer__widgets{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px;margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid hsla(0,0%,100%,.1)}
.fb-footer__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
.fb-footer__copyright{font-size:.85rem;color:hsla(0,0%,100%,.7)}
.fb-footer__credit{font-size:.75rem;color:hsla(0,0%,100%,.4)}
.fb-footer-nav{display:flex;gap:16px}
.fb-footer-nav .menu-item a{font-size:.8rem;color:hsla(0,0%,100%,.6);transition:color .15s}
.fb-footer-nav .menu-item a:hover{color:#fff}

.fb-footer-widget__title{font-size:.85rem;font-weight:700;margin-bottom:12px;color:hsla(0,0%,100%,.9)}

/* === Utility === */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* === Search Form === */
.search-form{display:flex;gap:8px;max-width:400px;margin:0 auto}
.search-form .search-field{flex:1;padding:10px 16px;border:1px solid #d1d5db;border-radius:8px;font-size:.9rem}
.search-form .search-submit{padding:10px 20px;background:#c0392b;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer}
.search-form .search-submit:hover{background:#a93226}

/* === Responsive (Below the fold) === */
@media(max-width:768px){
    .fb-card__link--featured{grid-template-columns:1fr}
    .fb-card__image--featured{min-height:200px}
    .fb-card__body--featured{padding:20px}
    .fb-profile-card{flex-direction:column;align-items:center;text-align:center}
    .fb-profile-card__photo{width:120px;height:120px;border-radius:50%}
    .fb-profile-card__details{justify-content:center}
    .fb-section{padding:36px 0}
    .fb-type-nav{padding:32px 0 24px}
    .fb-filter-group{flex-wrap:wrap}
    .fb-related__grid{grid-template-columns:1fr}
    .fb-footer__bottom{flex-direction:column;text-align:center}
    .fb-cta{padding:40px 0}
    .fb-archive-header{padding:24px 0 16px}
    .fb-empty{padding:48px 20px}
    .fb-empty h1{font-size:2.5rem}
}

@media(max-width:480px){
    .fb-container{padding:0 16px}
    .fb-card__body{padding:16px}
    .fb-card__title{font-size:.95rem}
}

/* === Print === */
@media print{
    .fb-header,.fb-footer,.fb-sidebar,.fb-breadcrumb,.fb-share,.fb-related,.fb-cta,.fb-filter-nav{display:none!important}
    .fb-layout{grid-template-columns:1fr!important}
    body{color:#000;background:#fff}
    .fb-interview-hero{background:#fff!important;color:#000!important;padding:20px 0}
}
