/* ============================================================
   메인 포털 홈 (커뮤니티형)
   바로가기 타일 + 섹션(인기/최신 프롬프트 · AI 영상 · AI 뉴스)
   카드 자체 스타일(.clab_card)은 carat_lab.css 를 그대로 쓴다.
   ============================================================ */

/* ---------- 바로가기 타일 ---------- */
.cp_quick{
    display:grid; grid-template-columns:repeat(6,1fr); gap:12px;
    margin:4px 0 40px;
}
.cp_quick__item{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px;
    padding:20px 8px 16px;
    background:#fff; border:1px solid var(--c-line,#ececf1); border-radius:14px;
    font-size:13.5px; font-weight:700; color:#44454f; text-decoration:none;
    transition:transform .15s, border-color .15s, box-shadow .15s;
}
.cp_quick__item i{ font-size:22px; color:var(--c-brand,#ff7a1a); }
.cp_quick__item:hover{
    transform:translateY(-3px); border-color:var(--c-brand,#ff7a1a);
    box-shadow:0 10px 24px rgba(17,17,26,.10); color:var(--c-brand-dark,#e5620a);
}
.cp_quick__item--accent{
    background:var(--c-brand,#ff7a1a); border-color:var(--c-brand,#ff7a1a); color:#fff;
    box-shadow:0 6px 16px rgba(255,122,26,.28);
}
.cp_quick__item--accent i{ color:#fff; }
.cp_quick__item--accent:hover{ background:var(--c-brand-dark,#e5620a); color:#fff; }

/* ---------- 섹션 공통 ---------- */
.cp_sec{ margin:0 0 48px; }
.cp_sec__head{
    display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
    margin:0 0 16px;
}
.cp_sec__head h2{
    font-size:21px; font-weight:800; letter-spacing:-.02em; margin:0; color:var(--c-fg,#191924);
}
.cp_sec__desc{ font-size:13px; color:#9ca3af; }
.cp_sec__more{
    margin-left:auto; font-size:13px; font-weight:600; color:#6b7280; text-decoration:none;
    transition:color .13s;
}
.cp_sec__more:hover{ color:var(--c-brand-dark,#e5620a); }

/* ---------- AI 영상 ---------- */
.cp_vwrap{
    display:grid; grid-template-columns:repeat(var(--vcols,2),1fr); gap:28px;
}
.cp_vcol__title{
    display:flex; align-items:baseline;
    font-size:15px; font-weight:700; margin:0 0 12px; color:#33343d;
}
.cp_vgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }

.cp_vcard{ display:block; text-decoration:none; color:inherit; min-width:0; }
.cp_vcard__thumb{
    position:relative; display:block; aspect-ratio:16/9; overflow:hidden;
    border-radius:12px; background:#11131a; border:1px solid var(--c-line,#ececf1);
}
.cp_vcard__thumb img{
    width:100%; height:100%; object-fit:cover; display:block;
    transition:transform .22s;
}
.cp_vcard:hover .cp_vcard__thumb img{ transform:scale(1.05); }
.cp_vcard__thumb i{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:36px; height:36px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:rgba(0,0,0,.55); color:#fff; font-size:13px; padding-left:3px;
    opacity:0; transition:opacity .15s;
}
.cp_vcard:hover .cp_vcard__thumb i{ opacity:1; }
.cp_vcard__title{
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
    font-size:13.5px; font-weight:600; line-height:1.45; margin:9px 2px 3px; color:#33343d;
}
.cp_vcard:hover .cp_vcard__title{ color:var(--c-brand-dark,#e5620a); }
.cp_vcard__meta{ display:block; font-size:12px; color:#9ca3af; margin:0 2px; }

/* ---------- AI 뉴스 ---------- */
.cp_news{
    display:grid; grid-template-columns:1.15fr 1fr; gap:28px; align-items:start;
}
.cp_news__lead{ display:block; text-decoration:none; color:inherit; }
.cp_news__leadthumb{
    position:relative; display:block; aspect-ratio:16/9; overflow:hidden;
    border-radius:14px; border:1px solid var(--c-line,#ececf1);
    background:linear-gradient(135deg,#3b3f52,#191924);
}
.cp_news__leadthumb img{
    width:100%; height:100%; object-fit:cover; display:block; transition:transform .22s;
}
.cp_news__lead:hover .cp_news__leadthumb img{ transform:scale(1.04); }
.cp_news__cat{
    position:absolute; left:12px; top:12px;
    font-style:normal; font-size:11.5px; font-weight:700; color:#fff;
    background:rgba(0,0,0,.55); backdrop-filter:blur(4px);
    padding:3px 10px; border-radius:999px;
}
.cp_news__leadtitle{
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
    font-size:18px; font-weight:800; line-height:1.45; letter-spacing:-.01em;
    margin:12px 2px 4px; color:var(--c-fg,#191924);
}
.cp_news__lead:hover .cp_news__leadtitle{ color:var(--c-brand-dark,#e5620a); }
.cp_news__meta{ display:block; font-size:12.5px; color:#9ca3af; margin:0 2px; }

.cp_news__list{ list-style:none; margin:0; padding:0; }
.cp_news__list li + li{ border-top:1px solid var(--c-line,#ececf1); }
.cp_news__list a{
    display:flex; align-items:baseline; gap:10px;
    padding:11px 4px; text-decoration:none; color:inherit;
}
.cp_news__no{
    flex:0 0 auto; font-style:normal; font-size:13px; font-weight:800;
    color:var(--c-brand,#ff7a1a); width:18px; text-align:center;
}
.cp_news__title{
    flex:1 1 auto; min-width:0; font-size:14px; font-weight:600; color:#33343d;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cp_news__list a:hover .cp_news__title{ color:var(--c-brand-dark,#e5620a); }
.cp_news__time{ flex:0 0 auto; font-size:12px; color:#b0b2bc; }

/* ---------- 반응형 ---------- */
@media (max-width:1024px){
    .cp_quick{ grid-template-columns:repeat(3,1fr); }
    .cp_vwrap{ grid-template-columns:1fr; }
}
@media (max-width:720px){
    .cp_quick{ grid-template-columns:repeat(2,1fr); gap:10px; }
    .cp_vgrid{ grid-template-columns:1fr 1fr; gap:10px; }
    .cp_news{ grid-template-columns:1fr; gap:14px; }
    .cp_sec{ margin-bottom:36px; }
}