:root{
  --ink:#0E1116;
  --paper:#ECEEF1;
  --paper-pure:#F7F8F9;
  --signal:#1B45EE;
  --signal-tint:#D9E0FF;
  --flag:#DC2B22;
  --amber:#B8761A;
  --static:#5B6470;
  --line:rgba(14,17,22,0.12);
  --line-strong:rgba(14,17,22,0.22);
  --display:'Archivo',-apple-system,BlinkMacSystemFont,sans-serif;
  --body:'Newsreader',Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.mono{font-family:var(--mono);font-weight:500;letter-spacing:0.04em;text-transform:uppercase;font-size:0.72rem}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:50;background:rgba(236,238,241,0.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.head-row{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px}
.brand .mark{font-family:var(--display);font-weight:900;font-size:1.4rem;letter-spacing:-0.02em;color:var(--ink)}
.brand .mark b{color:var(--signal)}
.brand-tag{color:var(--static)}
.nav{display:flex;gap:26px;align-items:center}
.nav .nav-link{font-family:var(--mono);font-size:0.74rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--static);transition:color .15s}
.nav .nav-link:hover,.nav .nav-current{color:var(--ink)}
.nav-dropdown{position:relative;display:inline-block}
.nav-dropdown-btn{font-family:var(--mono);font-size:0.74rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--static);background:none;border:none;cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:5px;transition:color .15s}
.nav-dropdown-btn:hover,.nav-dropdown:hover .nav-dropdown-btn{color:var(--ink)}
.nav-dropdown-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;transition:transform .15s}
.nav-dropdown:hover .nav-dropdown-caret,.nav-dropdown.open .nav-dropdown-caret{transform:rotate(180deg)}
.nav-dropdown-menu{position:absolute;top:100%;right:0;margin-top:12px;min-width:210px;background:var(--paper);border:0.5px solid rgba(14,17,22,0.15);border-radius:8px;box-shadow:0 8px 24px rgba(14,17,22,0.12);padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .15s,transform .15s,visibility .15s;z-index:50}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu,.nav-dropdown.open .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-dropdown-menu::before{content:"";position:absolute;bottom:100%;left:0;right:0;height:12px}
.nav-dropdown-menu a{display:block;font-family:var(--mono);font-size:0.72rem;letter-spacing:0.03em;text-transform:uppercase;color:var(--static);padding:9px 12px;border-radius:5px;transition:background .12s,color .12s}
.nav-dropdown-menu a:hover{background:var(--paper-pure);color:var(--ink)}
.mobile-nav-label{display:block;font-size:0.68rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--static);opacity:0.6;margin-top:10px;padding-top:10px;border-top:0.5px solid rgba(14,17,22,0.12)}
.live{display:flex;align-items:center;gap:7px;color:var(--ink)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 0 rgba(27,69,238,.5);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(27,69,238,.5)}70%{box-shadow:0 0 0 8px rgba(27,69,238,0)}100%{box-shadow:0 0 0 0 rgba(27,69,238,0)}}
.menu-btn{display:none;font-family:var(--mono);font-size:0.74rem;text-transform:uppercase;background:none;border:1px solid var(--line-strong);padding:7px 12px;cursor:pointer;color:var(--ink)}
.mobile-nav{display:none;flex-direction:column;padding:12px 28px 20px;border-bottom:1px solid var(--line);background:var(--paper)}
.mobile-nav a{font-family:var(--mono);font-size:0.84rem;text-transform:uppercase;letter-spacing:0.03em;padding:11px 0;border-top:1px solid var(--line);color:var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;border-bottom:1px solid var(--line);min-height:280px;width:100%;overflow:hidden}
.hero-inner{position:relative;z-index:2;padding:32px 0 20px}
.eyebrow{color:var(--static);margin-bottom:26px;display:flex;flex-wrap:wrap;gap:8px}
.eyebrow span{color:var(--ink)}
.hero-h{font-family:var(--display);font-weight:800;letter-spacing:-0.03em;line-height:0.98;font-size:clamp(2.6rem,7vw,5.6rem);max-width:15ch}
.hero-h em{font-style:normal;color:var(--signal)}
.hero-sub{font-size:1.22rem;max-width:46ch;margin-top:24px;color:#2a3038}
.hero-cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap}
.btn{font-family:var(--mono);text-transform:uppercase;letter-spacing:0.04em;font-size:0.78rem;padding:13px 22px;border:1px solid var(--ink);cursor:pointer;transition:.15s;display:inline-block}
.btn-fill{background:var(--ink);color:var(--paper)}
.btn-fill:hover{background:var(--signal);border-color:var(--signal)}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}
#scope{position:absolute;top:18%;left:0;right:0;width:100%;height:50%;z-index:1;opacity:0.95;display:block}
@media(max-width:640px){#scope{top:28%;height:18%;opacity:0.9}}
@media(max-width:640px){
  .hero-sub{font-size:1rem}
  .btn{font-size:0.7rem;padding:10px 16px}
  .hero-cta{gap:10px;margin-top:24px}
}
@media(max-width:880px){
  .hero-inner{padding:44px 20px 28px}
  .site-foot .wrap{padding-left:20px;padding-right:20px}
  .foot-top{padding-top:40px;padding-bottom:30px}
  .foot-bottom{padding-top:18px;padding-bottom:18px}
  .subscribe .wrap{padding-left:20px;padding-right:20px}
  .sub-inner{padding-top:48px;padding-bottom:48px}
}
.hero-scope-label{position:absolute;right:28px;bottom:18px;z-index:2;color:var(--static);text-align:right;line-height:1.7}

/* ---------- section head ---------- */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:28px 0 16px;border-bottom:1px solid var(--ink);margin-bottom:24px}
.sec-head h2{font-family:var(--display);font-weight:800;letter-spacing:-0.02em;font-size:1.7rem}
.sec-head .mono{color:var(--static)}

/* ---------- lead ---------- */
.lead{display:grid;grid-template-columns:1.15fr 1fr;gap:46px;align-items:center;padding-bottom:32px}
.lead-visual{aspect-ratio:4/3;background:var(--ink);position:relative;overflow:hidden;display:block}
.lead-visual img{width:100%;height:100%;object-fit:cover}
#leadScope{width:100%;height:100%;display:block}
.lead-kicker{color:var(--signal);margin-bottom:16px}
.lead h3{font-family:var(--display);font-weight:800;letter-spacing:-0.02em;font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.02}
.lead p{margin-top:18px;color:#2a3038;font-size:1.08rem;max-width:48ch}
.lead-meta{margin-top:24px;display:flex;align-items:center;gap:18px;color:var(--static);flex-wrap:wrap}

/* ---------- claims / onder de loep ---------- */
.review{padding-bottom:32px}
.ruismeter-strip{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:14px 18px;margin-bottom:20px;background:var(--paper);border:0.5px solid rgba(14,17,22,0.12);border-radius:8px}
.ruismeter-strip-bar{flex:1;min-width:120px;position:relative;height:7px;border-radius:20px;background:linear-gradient(to right,#DC2B22,#B8761A 45%,#1B45EE)}
.ruismeter-strip-needle{position:absolute;top:50%;width:15px;height:15px;background:var(--paper);border:3px solid #B8761A;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,0.15);transform:translate(-50%,-50%);animation:ruisSweep 6s ease-in-out infinite alternate}
@keyframes ruisSweep{0%{left:8%;border-color:#DC2B22}45%{left:50%;border-color:#B8761A}100%{left:92%;border-color:#1B45EE}}
@media (prefers-reduced-motion:reduce){.ruismeter-strip-needle{animation:none;left:50%}}
.ruismeter-strip-labels{display:flex;gap:14px;font-size:0.7rem;color:var(--static);white-space:nowrap}
.ruismeter-strip-labels span{display:inline-flex;align-items:center;gap:5px}
.ruismeter-strip-labels i{width:8px;height:8px;border-radius:50%;display:inline-block}
.ruismeter-strip-text{flex-basis:100%;margin:0;font-size:0.78rem;color:var(--static);line-height:1.5}
.claims{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ink)}
.claim{padding:28px;border-right:1px solid var(--line);transition:background .15s}
.claim:last-child{border-right:none}
.claim:hover{background:var(--paper-pure)}
.verdict{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:600;font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;padding:5px 10px;margin-bottom:20px}
.verdict::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.v-signal{background:var(--signal-tint);color:var(--signal)}
.v-noise{background:#FBE2E0;color:var(--flag)}
.v-mixed{background:#F4E8D4;color:var(--amber)}
.claim q{font-family:var(--body);font-style:italic;font-size:1.18rem;display:block;line-height:1.35;quotes:"\201C" "\201D"}
.claim .ruling{margin-top:16px;color:#2a3038;font-size:0.98rem}
.claim .src{margin-top:18px;color:var(--static)}

/* ---------- feed ---------- */
.feed{padding-bottom:32px}
.feed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.post{background:var(--paper);padding:26px;display:flex;flex-direction:column;gap:14px;transition:background .15s;min-height:230px}
.post:hover{background:var(--paper-pure)}
.post .beat{color:var(--signal)}
.post h4{font-family:var(--display);font-weight:700;letter-spacing:-0.01em;font-size:1.24rem;line-height:1.1}
.post p{font-size:0.98rem;color:#2a3038;flex:1}
.post .pmeta{display:flex;justify-content:space-between;align-items:center;color:var(--static);border-top:1px solid var(--line);padding-top:14px;margin-top:4px}

/* ---------- beats ---------- */
.beats{padding-bottom:32px}
.beat-list{display:flex;flex-wrap:wrap;border-top:1px solid var(--ink)}
.beat-item{flex:1 1 33%;min-width:240px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:22px 24px;display:flex;align-items:baseline;justify-content:space-between;transition:background .15s}
.beat-item:hover{background:var(--paper-pure)}
.beat-item .name{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-0.01em}
.beat-item .count{color:var(--static)}

/* ---------- empty state ---------- */
.empty-state{padding:90px 28px;text-align:center}
.empty-state .mono{color:var(--static);margin-bottom:14px}
.empty-state h2{font-family:var(--display);font-weight:800;font-size:clamp(1.8rem,4vw,2.8rem);letter-spacing:-0.02em;max-width:18ch;margin:0 auto 16px}
.empty-state p{color:#2a3038;max-width:40ch;margin:0 auto}
.empty-line{color:var(--static);padding:40px 0;grid-column:1/-1}

/* ---------- subscribe ---------- */
.subscribe{background:var(--ink);color:var(--paper);margin-top:20px}
.sub-inner{padding:72px 0;display:grid;grid-template-columns:1.1fr 1fr;gap:50px;align-items:center}
.sub-inner h2{font-family:var(--display);font-weight:800;letter-spacing:-0.025em;font-size:clamp(2rem,4vw,3rem);line-height:1.0}
.sub-inner h2 em{font-style:normal;color:#7d97ff}
.skicker{color:#7d97ff;margin-bottom:20px}
.sub-inner p{color:#aab2bd;margin-top:18px;max-width:42ch}
.sub-form{display:flex;flex-direction:column;gap:12px}
.sub-form label{color:#aab2bd}
.form-row{display:flex;border:1px solid #2c333e}
.form-row input{flex:1;background:transparent;border:none;color:var(--paper);font-family:var(--mono);font-size:0.86rem;padding:16px 18px;outline:none}
.form-row input::placeholder{color:#5b6470}
.form-row button{background:var(--signal);color:#fff;border:none;font-family:var(--mono);text-transform:uppercase;letter-spacing:0.04em;font-size:0.78rem;padding:0 24px;cursor:pointer;transition:.15s}
.form-row button:hover{background:#fff;color:var(--ink)}
.fine{color:#5b6470;margin-top:4px}
.form-error{color:#ff8a80;min-height:1em}
.form-success{color:var(--signal);display:none;margin:4px 0 0;font-weight:500}
.subscribe form.success + .form-error{display:none}
.subscribe form.success ~ .form-success{display:block}
.subscribe form.success input,.subscribe form.success button{opacity:0.5;pointer-events:none}
.subscribe--inline{margin-top:60px}
.subscribe--inline .sub-inner{padding:56px 0}

/* ---------- post / single ---------- */
.post-full{padding-bottom:40px}
.post-head{padding-top:60px;text-align:center;max-width:760px}
.post-kicker{color:var(--signal);display:inline-block;margin-bottom:18px}
.post-verdict{margin-bottom:18px}
.post-title{font-family:var(--display);font-weight:800;letter-spacing:-0.025em;line-height:1.02;font-size:clamp(2.1rem,5vw,3.6rem)}
.post-standfirst{font-size:1.3rem;color:#2a3038;margin-top:22px;line-height:1.4}
.post-meta{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;color:var(--static);margin-top:26px}
.post-feature{margin:44px auto;max-width:1180px}
.post-feature img{width:100%}
.post-feature figcaption{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--static);text-align:center;padding:12px 28px 0}

/* post body (Ghost content) */
.gh-content{
  display:grid;
  grid-template-columns:[full-start] minmax(0,1fr) [wide-start] minmax(0,120px) [content-start] min(680px,100%) [content-end] minmax(0,120px) [wide-end] minmax(0,1fr) [full-end];
  font-size:1.2rem;line-height:1.62;
}
.gh-content > *{grid-column:content;margin-bottom:1.1rem}
.gh-content > .kg-width-wide{grid-column:wide}
.gh-content > .kg-width-full{grid-column:full}
.gh-content > .kg-width-wide img,.gh-content > .kg-width-full img{width:100%}
.gh-content h2{font-family:var(--display);font-weight:700;font-size:1.9rem;letter-spacing:-0.02em;margin-top:2.6rem;line-height:1.1}
.gh-content h3{font-family:var(--display);font-weight:700;font-size:1.4rem;margin-top:2rem}
.gh-content a{color:var(--signal);text-decoration:underline;text-underline-offset:3px}
.gh-content blockquote{border-left:3px solid var(--signal);padding-left:24px;font-style:italic;color:#2a3038;font-size:1.32rem}
.gh-content figure img{width:100%}
.gh-content figcaption{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--static);text-align:center;margin-top:10px}
.gh-content ul,.gh-content ol{padding-left:1.4em}
.gh-content li{margin-bottom:0.5rem}
.gh-content hr{border:none;border-top:1px solid var(--line-strong)}
.gh-content code{font-family:var(--mono);font-size:0.86em;background:rgba(14,17,22,0.06);padding:2px 6px}
.kg-bookmark-card,.kg-callout-card{margin-bottom:1.5rem}

.post-foot{max-width:680px;margin:48px auto 0;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.post-tags a{color:var(--static);margin-right:14px;text-transform:uppercase;font-size:0.72rem;letter-spacing:0.04em;font-family:var(--mono)}
.post-tags a:hover{color:var(--signal)}
.back-link{color:var(--static)}
.back-link:hover{color:var(--ink)}

/* ---------- archive / tag / author ---------- */
.archive-head{padding-top:30px}
.archive-desc{max-width:60ch;color:#2a3038;margin:-14px 0 30px;font-size:1.1rem}

/* ---------- error ---------- */
.error-page{padding:120px 28px;text-align:center}
.error-page .mono{color:var(--flag);margin-bottom:16px}
.error-page h1{font-family:var(--display);font-weight:800;font-size:clamp(2rem,5vw,3.4rem);letter-spacing:-0.02em;margin-bottom:14px}
.error-page p{color:#2a3038;margin-bottom:28px}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:var(--paper);border-top:1px solid #2c333e}
.foot-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding:56px 0 40px}
.foot-brand .mark{font-family:var(--display);font-weight:900;font-size:1.5rem;letter-spacing:-0.02em}
.foot-brand .mark b{color:#7d97ff}
.foot-brand p{color:#8c94a0;margin-top:14px;max-width:34ch;font-size:0.96rem}
.fcol h5{font-family:var(--mono);text-transform:uppercase;letter-spacing:0.05em;font-size:0.7rem;color:#5b6470;margin-bottom:16px}
.fcol a{display:block;color:#aab2bd;font-size:0.96rem;margin-bottom:10px;transition:color .15s}
.fcol .nav-link{font-family:var(--body);text-transform:none;letter-spacing:0}
.fcol a:hover{color:#fff}
.foot-bottom{border-top:1px solid #2c333e;padding:22px 0;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:#5b6470}
.foot-bottom .mono{color:#5b6470}
.disclaimer{color:#7a828d;font-style:italic;font-family:var(--body)}

/* ---------- pagination ---------- */
.pagination{max-width:1180px;margin:0 auto;padding:40px 28px 80px;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);text-transform:uppercase;font-size:0.74rem;letter-spacing:0.04em}
.pagination a{color:var(--signal)}
.pagination .page-number{color:var(--static)}

/* ---------- responsive ---------- */
@media(max-width:880px){
  .nav{display:none}
  .menu-btn{display:block}
  .mobile-nav:not([hidden]){display:flex}
  .lead,.sub-inner,.foot-top,.claims,.feed-grid{grid-template-columns:1fr}
  .claim{border-right:none;border-bottom:1px solid var(--line)}
  .claim:last-child{border-bottom:none}
  .lead-visual{order:-1}
  .foot-top{gap:34px}
}
@media(prefers-reduced-motion:reduce){
  .dot{animation:none}
  html{scroll-behavior:auto}
}

/* ---------- merk / logo ---------- */
.brand{display:flex;align-items:center;gap:11px}
.logo-mark{flex:none;display:flex;align-items:center}
.logo-mark canvas,.logo-mark svg{display:block}
.wordmark{display:flex;flex-direction:column;line-height:1}
.wordmark .mark{font-family:var(--display);font-weight:800;font-size:1.22rem;letter-spacing:-0.02em}
.wordmark .mark .nl{color:var(--signal)}
.wordmark .brand-tag{margin-top:3px;font-size:0.6rem;color:#aab2bd}
.foot-brand .mark .nl{color:#7d97ff}

/* ---------- signaal/ruis-meter ---------- */
.post-meter{max-width:520px;margin:30px auto 0;text-align:left}
.sm-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.sm-title{font-family:var(--mono);font-size:0.64rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--static)}
.sm-pill{font-family:var(--mono);font-weight:600;font-size:0.64rem;text-transform:uppercase;letter-spacing:0.05em;padding:4px 9px}
.sm-pill.z0{background:#FBE2E0;color:var(--flag)}
.sm-pill.z1{background:#F4E8D4;color:var(--amber)}
.sm-pill.z2{background:var(--signal-tint);color:var(--signal)}
.sm-track{position:relative;height:10px;border:1px solid var(--ink);background:linear-gradient(90deg,rgba(220,43,34,0.14) 0 33%,rgba(184,118,26,0.14) 33% 66%,rgba(27,69,238,0.14) 66% 100%)}
.sm-div{position:absolute;top:-1px;bottom:-1px;width:1px;background:var(--line-strong)}
.sm-marker{position:absolute;top:50%;width:2px;height:26px;transform:translate(-50%,-50%)}
.sm-marker.z0{background:var(--flag)}
.sm-marker.z1{background:var(--amber)}
.sm-marker.z2{background:var(--signal)}
.sm-marker::after{content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%);width:11px;height:11px;border-radius:50%;background:inherit}
.sm-zones{display:flex;margin-top:14px;font-family:var(--mono);font-size:0.6rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--static)}
.sm-zones span{flex:1}
.sm-zones span:nth-child(2){text-align:center}
.sm-zones span:nth-child(3){text-align:right}
.sm-status{margin-top:14px;font-family:var(--body);font-size:1rem;color:#2a3038}
.sm-status b{font-family:var(--display);font-weight:700}
.sm-mini .sm-track{height:8px}
.sm-mini .sm-marker{height:20px}
.sm-mini .sm-zones{font-size:0.55rem;margin-top:9px}

@media(max-width:460px){
  .wordmark .brand-tag{display:none}
}

/* ===== VIDEO EMBEDS ===== */
.gh-content iframe,
.post-body iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    display: block;
    margin: 1.1rem 0;
}

.kg-embed-card {
    width: 100%;
    margin: 1.1rem 0;
}

.kg-embed-card iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

/* ===== BRAND LOGO ===== */
.brand { display: flex; align-items: center; gap: 10px; }
.brand-mark { display: block; width: 32px; height: 32px; flex-shrink: 0; }

/* ===== INTERVIEWS ===== */
.interviews { padding-bottom: 32px; }

.interview-featured {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 0;
    background: var(--ink);
    color: var(--paper);
    margin-bottom: 1px;
    text-decoration: none;
    border-radius: 6px;
    overflow: hidden;
}
.interview-featured:hover { opacity: 0.92; }

.interview-featured-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #162050;
}
.interview-featured-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.8;
}
.interview-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #0E1116, #162050);
}

.interview-soon {
    border: 1px solid rgba(14, 17, 22, 0.12);
    border-radius: 12px;
    overflow: hidden;
    background: #F4F5F7;
    position: relative;
    min-height: 300px;
}
.interview-soon-bar {
    height: 4px;
    background: linear-gradient(to right, #DC2B22, #B8761A 45%, #1B45EE);
    position: relative;
    z-index: 3;
}
.interview-soon-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.interview-soon-inner {
    position: relative;
    z-index: 3;
    padding: 52px 32px;
    text-align: center;
}
.interview-soon-play {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #DC2B22, #B8761A 45%, #1B45EE);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
}
.interview-soon-play span {
    width: 0;
    height: 0;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 15px solid #fff;
    margin-left: 4px;
}
.interview-soon-title {
    font-family: var(--display);
    font-weight: 700;
    font-size: 1.2rem;
    color: var(--ink);
    margin-bottom: 8px;
}
.interview-soon-title em {
    font-style: normal;
    color: var(--signal);
}
.interview-soon-text {
    font-size: 0.95rem;
    color: var(--static);
    max-width: 52ch;
    margin: 0 auto;
    line-height: 1.6;
}
.interview-soon-btn {
    display: inline-block;
    margin-top: 22px;
    font-size: 0.75rem;
    color: #fff;
    background: var(--signal);
    padding: 11px 22px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
    border-radius: 3px;
}
.interview-soon-btn:hover { opacity: 0.9; }


.interview-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    background: var(--signal);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.interview-play span {
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 16px solid #fff;
    margin-left: 4px;
}
.interview-play--sm {
    width: 36px;
    height: 36px;
}
.interview-play--sm span {
    border-top-width: 7px;
    border-bottom-width: 7px;
    border-left-width: 11px;
    margin-left: 3px;
}

.interview-featured-body {
    padding: 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}
.interview-featured-body h3 {
    font-family: var(--display);
    font-weight: 700;
    font-size: 1.3rem;
    letter-spacing: -0.01em;
    line-height: 1.15;
    color: #fff;
}
.interview-featured-body p {
    font-size: 0.95rem;
    color: rgba(255,255,255,0.65);
    line-height: 1.55;
}

.interview-kicker {
    color: #7d97ff;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.interview-meta {
    color: rgba(255,255,255,0.4);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    gap: 12px;
}

.interview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    background: none;
    margin-top: 8px;
}

.interview-card {
    background: var(--paper);
    text-decoration: none;
    color: var(--ink);
    display: flex;
    flex-direction: column;
    border-radius: 6px;
    overflow: hidden;
}
.interview-card:hover { background: var(--paper-pure); }

.interview-card-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #162050;
}
.interview-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.85;
}

.interview-card-body {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-radius: 0 0 6px 6px;
}
.interview-card-body h4 {
    font-family: var(--display);
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.01em;
    line-height: 1.2;
    color: var(--ink);
}
.interview-card-body .interview-kicker { color: var(--signal); }
.interview-card-body .interview-meta { color: var(--static); }

@media(max-width: 880px) {
    .interview-featured { grid-template-columns: 1fr; }
    .interview-featured-thumb { aspect-ratio: 16/9; }
    .interview-featured-body { padding: 20px; }
    .interview-featured-body h3 { font-size: 1.1rem; }
    .interview-grid { grid-template-columns: 1fr; gap: 0; background: none; border-top: 1px solid var(--line); }
    .interview-card {
        flex-direction: row;
        align-items: center;
        border-bottom: 1px solid var(--line);
        background: var(--paper);
    }
    .interview-card-thumb {
        width: 120px;
        min-width: 120px;
        aspect-ratio: 16/9;
        flex-shrink: 0;
    }
    .interview-card-body { padding: 12px 14px; }
    .interview-card-body h4 { font-size: 0.95rem; }
}

/* ===== INTERVIEW LIST (tag pagina) ===== */
.interview-list-item {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 20px;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
    align-items: center;
}
.interview-list-item:hover { opacity: 0.85; }
.interview-list-item:last-child { border-bottom: none; }

.interview-list-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #162050;
    border-radius: 4px;
    flex-shrink: 0;
}
.interview-list-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.85;
}

.interview-list-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.interview-list-body h3 {
    font-family: var(--display);
    font-weight: 700;
    font-size: 1.2rem;
    letter-spacing: -0.01em;
    line-height: 1.2;
    color: var(--ink);
}
.interview-list-body p {
    font-size: 0.95rem;
    color: #2a3038;
    line-height: 1.55;
}

@media(max-width: 640px) {
    .interview-list-item { grid-template-columns: 1fr; }
}

/* ===== INTERVIEW NUMBERED (tag pagina layout C) ===== */
.interview-numbered {
    display: grid;
    grid-template-columns: 48px 220px 1fr;
    gap: 20px;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
    align-items: center;
}
.interview-numbered:hover { opacity: 0.85; }
.interview-numbered:last-child { border-bottom: none; }

.interview-number {
    font-family: var(--mono);
    font-weight: 600;
    font-size: 0.75rem;
    color: rgba(14,17,22,0.2);
    white-space: nowrap;
    letter-spacing: 0.02em;
}

@media(max-width: 640px) {
    .interview-numbered { grid-template-columns: 1fr; }
    .interview-number { display: none; }
}

/* ===== BEGRIPSUITLEG (tooltip) ===== */
.uitleg {
    border-bottom: 2px dotted var(--signal);
    color: var(--signal);
    cursor: help;
    position: relative;
}
.uitleg .uitleg-pop {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    bottom: 150%;
    left: 50%;
    transform: translateX(-50%);
    width: 240px;
    max-width: 76vw;
    background: var(--ink);
    color: var(--paper);
    font-family: var(--mono);
    font-size: 0.78rem;
    font-weight: normal;
    line-height: 1.5;
    padding: 10px 12px;
    border-radius: 8px;
    z-index: 30;
    transition: opacity 0.15s ease;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
    text-align: left;
}
.uitleg .uitleg-pop::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--ink);
}
.uitleg:hover .uitleg-pop,
.uitleg:focus .uitleg-pop {
    visibility: visible;
    opacity: 1;
}
