/* roncoejr.info dynamic layout (structure mirrors blocktelligence.info) */
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; background: #0e0e10; color: #e8e8e8; }
a { color: #4fb3ff; }
.site-hero, .section-hero { background-size: cover; background-position: center; text-align: center; padding: 40px 20px; border-bottom: 3px solid #4fb3ff; }
.site-logo { max-width: 90%; height: auto; }
.site-description { font-size: 1.2em; background: rgba(0,0,0,.55); display: inline-block; padding: 6px 14px; border-radius: 6px; }
.section-hero .logo { max-width: 80%; height: auto; }
.section-hero h1 { margin: 12px 0 4px; text-shadow: 0 2px 6px #000; }
.section-hero .subtitle { background: rgba(0,0,0,.55); display: inline-block; padding: 4px 12px; border-radius: 6px; }
.section-heading { text-align: center; color: #4fb3ff; margin: 32px 0 16px; }
.featured-video { max-width: 900px; margin: 0 auto; aspect-ratio: 16/9; padding: 0 12px; }
.featured-video iframe, .video-wrapper iframe { width: 100%; height: 100%; border: 0; }
.topic-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.topic-card { background: #1b1b20; border: 1px solid #2c2c34; border-radius: 10px; padding: 20px; text-align: center; text-decoration: none; color: inherit; transition: border-color .2s; }
.topic-card:hover { border-color: #4fb3ff; }
.topic-icon { font-size: 2em; color: #4fb3ff; }
.topic-name { font-weight: bold; font-size: 1.2em; margin: 8px 0; }
.topic-desc { color: #aaa; font-size: .9em; }
.video-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.video-grid.single { max-width: 800px; grid-template-columns: 1fr; }
.video-wrapper { aspect-ratio: 16/9; }
.article-list { max-width: 900px; margin: 0 auto; padding: 0 16px; display: flex; flex-direction: column; gap: 10px; }
.article-card { background: #1b1b20; border-left: 4px solid #4fb3ff; padding: 12px 16px; border-radius: 6px; text-decoration: none; color: inherit; }
.article-year { color: #4fb3ff; font-weight: bold; margin-right: 10px; }
.photo-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.photo-card img { width: 100%; height: auto; border-radius: 6px; }
.no-content { text-align: center; color: #888; padding: 40px; }
.site-footer { text-align: center; color: #888; padding: 30px; margin-top: 30px; border-top: 1px solid #2c2c34; }
