/* ==========================
   About Us page (aboutus.css)
   Reusable panel styling + page polish
   ========================== */

/* Keep content readable on wide screens */
#main {
    max-width: 1200px;
}

/* Improve paragraph rhythm */
#main p {
    line-height: 1.45;
}

/* ----------------------------------
   Reusable About panel
   ---------------------------------- */

.about-panel {
    background-image: url('/img/backgrounds/lightgreen-circuitboard-bg-trans_125x125.png');
    border: 2px solid rgba(25, 135, 84, 0.85); /* Bootstrap success */
    padding: 0.5rem;
}

/* Headings inside About panels */
.about-panel h3 {
    letter-spacing: 0.2px;
}

/* ----------------------------------
   Images inside About panels
   ---------------------------------- */

.about-panel img.rounded-5 {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

/* Hover polish for linked images */
.about-panel a:hover img.rounded-5 {
    transform: scale(1.01);
    box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.12);
}

/* ----------------------------------
   Buttons
   ---------------------------------- */

#main .btn {
    border-radius: 0.75rem;
}

/* ----------------------------------
   Accessibility improvements
   ---------------------------------- */

#main a:focus-visible,
#main .btn:focus-visible {
    outline: 3px solid rgba(25, 135, 84, 0.6);
    outline-offset: 3px;
}

/* ----------------------------------
   Reduced motion support
   ---------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .about-panel img.rounded-5 {
        transition: none;
    }

    .about-panel a:hover img.rounded-5 {
        transform: none;
        box-shadow: none;
    }
}