.reels-section { background: #f0f6fb; }
.reels-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.reels-heading h2 { margin-bottom: 8px; }
.reels-heading p { margin: 0; }
.reels-controls { display: flex; gap: 10px; flex-shrink: 0; }
.reels-controls[hidden] { display: none; }
.reels-controls button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #c6d4e1; border-radius: 50%; background: #fff; color: #002147; cursor: pointer; }
.reels-controls button:hover:not(:disabled) { color: #fff; background: #002147; }
.reels-controls button:disabled { opacity: .35; cursor: default; }
.reels-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 40px) / 3); gap: 20px; align-items: start; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #b6c8d8 transparent; padding: 4px 0 16px; overscroll-behavior-x: contain; }
.reel-card { position: relative; min-width: 0; scroll-snap-align: start; background: #fff; border: 1px solid #dce5ee; border-radius: 10px; overflow: hidden; }
.reel-embed { min-height: 610px; }
.reel-embed blockquote { margin: 0; padding: 40px 24px; min-height: 610px; display: flex; align-items: center; justify-content: center; text-align: center; }
.reel-embed iframe.instagram-media { width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; }
.reel-embed blockquote a { color: #07528d; font-size: 15px; }
.reel-embed blockquote i { display: block; font-size: 30px; margin-bottom: 16px; }
.reel-permalink { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-top: 1px solid #edf1f5; color: #07528d; font-size: 12px; min-height: 48px; }
.reels-profile { margin-top: 16px; }
@media (max-width: 1100px) { .reels-track { grid-auto-columns: calc((100% - 20px) / 2); } }
@media (max-width: 700px) {
 .reels-track { grid-auto-columns: 100%; }
 .reels-heading { align-items: flex-start; gap: 16px; }
 .reels-heading h2 { font-size: 24px; }
 .reels-heading p { font-size: 13px; }
 .reels-controls { gap: 6px; }
 .reels-controls button { width: 40px; height: 40px; }
}

.reels-section { clear: both; padding: 64px 0; }
.reels-heading h2 { font-size: 30px; line-height: 1.35; color: #092747; }
.reels-profile { display: inline-block; color: #07528d; }
@media(max-width:700px) { .reels-section { padding: 40px 0; } .reels-heading h2 { font-size: 24px; } }