.rgc-root { max-width: 1100px; margin: 24px auto; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial; color:#222; }
.rgc-intro { background:#fff; padding:18px; border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,0.04); text-align:center; }
.rgc-btn { background:#ffcc00; color:#000; border:none; padding:12px 20px; border-radius:8px; font-weight:700; cursor:pointer; }
.rgc-container { display:flex; gap:28px; align-items:flex-start; margin-top:18px; }
.rgc-image { flex:0 0 300px; position:relative; min-height:220px; text-align:center; }
.rgc-image img { width:100%; border-radius:8px; box-shadow:0 8px 30px rgba(0,0,0,0.06); }
.rgc-placeholder { width:300px; height:220px; display:flex; align-items:center; justify-content:center; background:#f3f3f3; border-radius:8px; font-size:34px; font-weight:700; color:#777; margin:auto; }
.rgc-spinner { border:6px solid rgba(0,0,0,0.06); border-top:6px solid #ffcc00; border-radius:50%; width:48px; height:48px; animation: rgc-spin 1s linear infinite; position:absolute; left:50%; top:40%; transform:translate(-50%,-50%); display:none; }
@keyframes rgc-spin { 100% { transform: rotate(360deg); } }
.rgc-info { flex:1; min-width:360px; text-align:left; padding:18px; background:#fff; border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,0.04); }
.rgc-info h2 { margin:0 0 12px 0; font-size:26px; }
.rgc-info ul { margin-left:18px; color:#444; }
.rgc-learn { background:#0073aa; color:#fff; padding:10px 14px; border-radius:8px; text-decoration:none; display:inline-block; margin-right:12px; }
.rgc-actions { margin-top:18px; }
@media(max-width:900px){ .rgc-container{flex-direction:column;}.rgc-image{flex:unset}.rgc-placeholder{width:100%;height:220px} .rgc-info{width:100%} }