@charset "utf-8";

#hqChannels.channels-section{
--ch-text:#111111;
--ch-sub:#888888;
--ch-muted:#aaaaaa;
--ch-line:#eeeeee;
--ch-bg:#ffffff;
--ch-card:#ffffff;
--ch-stat-bg:#f5f5f7;
--ch-icon-bg:#ffffff;
--ch-stat-divider:rgba(0,0,0,.08);
padding:100px 0 110px;
background:var(--ch-bg);
color:var(--ch-text);
font-family:var(--k-font),var(--e-font);
box-sizing:border-box;
}

#hqChannels .channels-inner{
max-width:var(--layout-max,1800px);
margin:0 auto;
padding:0 80px;
display:grid;
grid-template-columns:1.5fr 1fr;
gap:16px;
align-items:stretch;
}

/* Feature card */
#hqChannels .channels-feature{
display:flex;
flex-direction:column;
align-self:stretch;
height:100%;
background:var(--ch-card);
border:none;
border-radius:16px;
overflow:hidden;
box-shadow:0 1px 4px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.04);
}

#hqChannels .channels-hero{
display:block;
width:100%;
aspect-ratio:2/1;
object-fit:cover;
object-position:center 40%;
}

#hqChannels .channels-feature-body{
padding:28px 28px 28px;
}

#hqChannels .channels-feature-body .label{
margin:0 0 12px;
font-size:12px;
font-weight:600;
letter-spacing:.16em;
color:var(--ch-sub);
text-transform:uppercase;
font-family:var(--e-font),var(--k-font);
}

#hqChannels .channels-feature-body h2{
margin:0 0 12px;
font-size:clamp(30px,2.5vw,40px);
font-weight:700;
line-height:1.2;
letter-spacing:-.03em;
color:var(--ch-text);
font-family:var(--e-font),var(--k-font);
}

#hqChannels .channels-feature-body .desc{
margin:0 0 22px;
font-size:14px;
font-weight:400;
line-height:1.7;
color:var(--ch-sub);
word-break:keep-all;
}

/* Stats box */
#hqChannels .channels-stats{
list-style:none;
margin:0;
padding:28px 12px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
background:var(--ch-stat-bg);
border:none;
border-radius:14px;
}

#hqChannels .channels-stat{
position:relative;
display:flex;
flex-direction:column;
align-items:flex-start;
gap:0;
padding:0 18px;
}

#hqChannels .channels-stat:not(:last-child)::after{
content:'';
position:absolute;
top:8px;
right:0;
bottom:8px;
width:1px;
background:var(--ch-stat-divider);
}

#hqChannels .stat-icon-wrap{
display:flex;
align-items:center;
justify-content:center;
width:36px;
height:36px;
margin-bottom:12px;
background:var(--ch-icon-bg);
border-radius:50%;
flex-shrink:0;
}

#hqChannels .stat-icon{
width:20px;
height:20px;
object-fit:contain;
}

#hqChannels .stat-value{
margin-top:0;
font-size:28px;
font-weight:700;
line-height:1.05;
letter-spacing:-.02em;
color:var(--ch-text);
font-family:var(--e-font),var(--k-font);
font-variant-numeric:tabular-nums;
}

#hqChannels .stat-title{
margin-top:10px;
font-size:13px;
font-weight:700;
color:var(--ch-text);
line-height:1.35;
word-break:keep-all;
}

#hqChannels .stat-sub{
margin-top:6px;
font-size:11px;
font-weight:400;
color:#999999;
line-height:1.45;
word-break:keep-all;
}

/* Grid */
#hqChannels .channels-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
grid-auto-rows:auto;
gap:16px;
min-height:100%;
}

#hqChannels .channel-card{
position:relative;
display:flex;
flex-direction:column;
background:var(--ch-card);
border:none;
border-radius:16px;
padding:28px 24px 44px;
text-decoration:none;
color:inherit;
transition:transform .25s ease,box-shadow .25s ease;
min-height:200px;
box-shadow:0 1px 4px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.04);
}

#hqChannels .channel-card:hover{
transform:translateY(-2px);
box-shadow:0 6px 20px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);
}

#hqChannels .channel-card--icon{
padding:28px 24px 44px;
}

#hqChannels .channel-card--compact{
align-self:start;
min-height:0;
padding:22px 24px 32px;
}

#hqChannels .channel-card--compact .card-icon{
margin-bottom:12px;
}

#hqChannels .channel-card--compact .card-title{
margin-bottom:8px;
}

#hqChannels .channel-card--compact .card-desc{
flex:0;
}

#hqChannels .channel-card--compact .card-arrow{
right:20px;
bottom:18px;
}

#hqChannels .channel-card--image{
padding:0 0 44px;
min-height:220px;
}

#hqChannels .card-icon{
width:32px;
height:32px;
object-fit:contain;
margin-bottom:16px;
}

#hqChannels .card-media{
position:relative;
width:100%;
height:148px;
margin:0 0 20px;
border-radius:16px 16px 0 0;
overflow:hidden;
}

#hqChannels .card-media > img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}

#hqChannels .card-title-row{
display:flex;
align-items:center;
gap:10px;
margin:0 24px 10px;
}

#hqChannels .card-inline-icon{
width:24px;
height:24px;
object-fit:contain;
flex-shrink:0;
}

#hqChannels .card-title-row .card-title{
margin:0;
}

#hqChannels .channel-card--image .card-title{
margin:0 24px 10px;
}

#hqChannels .card-title{
margin:0 0 10px;
font-size:16px;
font-weight:700;
line-height:1.3;
color:var(--ch-text);
font-family:var(--e-font),var(--k-font);
}

#hqChannels .channel-card--image .card-desc{
padding-left:24px;
padding-right:24px;
}

#hqChannels .card-desc{
margin:0;
font-size:12px;
font-weight:400;
line-height:1.6;
color:var(--ch-sub);
word-break:keep-all;
flex:1;
}

#hqChannels .card-arrow{
position:absolute;
right:22px;
bottom:22px;
font-size:16px;
font-weight:300;
color:#d0d0d0;
line-height:1;
}

/* Scroll reveal */
#hqChannels .reveal-item{
opacity:0;
transform:translateY(20px);
transition:opacity .9s ease-out,transform .9s ease-out;
}

#hqChannels.is-revealing .reveal-item{
opacity:1;
transform:translateY(0);
}

#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(1){transition-delay:.08s}
#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(2){transition-delay:.14s}
#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(3){transition-delay:.2s}
#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(4){transition-delay:.26s}
#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(5){transition-delay:.32s}
#hqChannels.is-revealing .channels-grid .reveal-item:nth-child(6){transition-delay:.38s}

@media (prefers-reduced-motion:reduce){
#hqChannels .reveal-item{opacity:1;transform:none;transition:none}
#hqChannels .channel-card{transition:none}
#hqChannels .channel-card:hover{transform:none;box-shadow:0 1px 4px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.04)}
}

@media (max-width:1200px){
#hqChannels{padding:80px 0 90px}
#hqChannels .channels-inner{padding:0 48px}
}

@media (max-width:1024px){
#hqChannels .channels-inner{
grid-template-columns:1fr;
gap:24px;
}
#hqChannels .channels-stats{
grid-template-columns:repeat(2,1fr);
gap:24px 0;
padding:24px 16px;
}
#hqChannels .channels-stat:not(:last-child)::after{display:none}
#hqChannels .channels-stat:nth-child(odd)::after{
display:block;
content:'';
position:absolute;
top:8px;
right:0;
bottom:8px;
width:1px;
background:var(--ch-stat-divider);
}
#hqChannels .channels-stat:nth-child(1)::after,
#hqChannels .channels-stat:nth-child(3)::after{display:block}
#hqChannels .channels-stat:nth-child(2)::after,
#hqChannels .channels-stat:nth-child(4)::after{display:none}
}

@media (max-width:640px){
#hqChannels{padding:64px 0 72px}
#hqChannels .channels-inner{padding:0 24px}
#hqChannels .channels-grid{grid-template-columns:1fr}
#hqChannels .channels-feature-body h2{font-size:28px}
#hqChannels .channels-stats{grid-template-columns:1fr 1fr}
}