/* =========================================================
   efootball.me — home.css (homepage sections & lists)
   ========================================================= */
.section{margin:clamp(16px, 2.4vw, 24px) 0}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:10px}
.section h3{margin:0; font-size:clamp(18px, 2.6vw, 22px)}

.compact-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px}
.row{display:flex; gap:10px; align-items:center; padding:8px; border:1px solid var(--border); border-radius:12px; background:var(--bg-elev)}
.row:hover{background:var(--surface); text-decoration:none}
.thumb-xxs{width:62px; height:44px; object-fit:cover; border-radius:10px; background:#000}
.row-text{display:flex; flex-direction:column; gap:4px}
.row-text .title{font-weight:700; color:var(--text); line-height:1.35}
.row-text .sub{font-size:12px}
@media (max-width:520px){ .thumb-xxs{width:56px; height:40px} .row{padding:6px} }

/* Post page content */
.post{max-width:900px; margin-inline:auto; padding:clamp(8px,1.2vw,12px)}
.post h1{font-size:clamp(22px,3.4vw,32px); line-height:1.22; margin:6px 0 8px}
.meta-line{font-size:13px; color:var(--muted); margin-bottom:12px}
.badge{display:inline-block; padding:3px 8px; border-radius:999px; background:var(--surface); border:1px solid var(--border)}
.video-wrap{margin:12px 0 14px; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); background:#000}
.post img.hero{margin:10px 0 14px; border-radius:var(--radius-lg); box-shadow:var(--shadow)}
.post-body.classy{font-size:1rem}
.post-body.classy p{margin:0 0 1em}
.post-body.classy h2,.post-body.classy h3{margin:1.2em 0 .6em}
.post-body.classy ul,.post-body.classy ol{padding-inline-start:1.2rem}
.post-body.classy blockquote{margin:1em 0; padding:10px 14px; border-inline-start:4px solid var(--primary); background:var(--surface); border-radius:10px}
.post-body.classy table{border-collapse:collapse; width:100%; margin:12px 0; font-size:.95rem}
.post-body.classy th,.post-body.classy td{border:1px solid var(--border); padding:8px; text-align:start; background:var(--bg-elev)}
.post-body.classy th{background:var(--surface)}

/* Archive */
.archive-list{list-style:none; padding:0; margin:10px 0; display:grid; grid-template-columns:1fr 1fr; gap:8px}
.archive-list li a{display:block; padding:10px; border:1px solid var(--border); border-radius:12px; background:var(--bg-elev); font-weight:600}
.archive-list li a:hover{background:var(--surface); text-decoration:none}
@media (max-width:680px){ .archive-list{grid-template-columns:1fr} }
