/*!
 * SPCEMW Minimalist Theme
 * Modern, clean, elegant design
 */

/* ===========================
   CORE RESET & BASE
   =========================== */
:root {
  --primary-dark: #2e3c36;
  --primary-white: #FFFFFF;
  --accent-green: #006341;
  --accent-green-dark: #004d32;
  --accent-yellow: #d6ce3e;
  --accent-gold: #FFD700;
  --text-dark: #333333;
  --text-gray: #666666;
  --bg-off-white: #F9F9F9;
  --border-light: #E5E5E5;
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.12);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.15);
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-dark);
  background: var(--primary-white);
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  line-height: 1.2;
  color: var(--primary-dark);
  margin-bottom: 0.5rem;
}

h1 { font-size: 3rem; font-weight: 700; }
h2 { font-size: 2.5rem; line-height: 1.2; }
h3 { font-size: 2rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }

p { margin-bottom: 0.75rem; color: var(--text-gray); }

a {
  color: var(--accent-green);
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: var(--accent-green-dark);
  text-decoration: none;
}

/* ===========================
   NAVIGATION
   =========================== */
.minimal-nav,
.navbar.minimal-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  background: var(--primary-white);
  border-bottom: 1px solid var(--border-light);
  padding: 1rem 0;
  transition: all 0.3s ease;
  box-shadow: none;
}

.minimal-nav.scrolled {
  background: rgba(255, 255, 255, 0.98);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(10px);
}

/* Offset body so content isn't hidden behind fixed nav */
body {
  padding-top: 72px;
}

.minimal-nav .navbar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--primary-dark) !important;
  letter-spacing: -0.5px;
}

.minimal-nav .navbar-brand img {
  height: 36px;
  width: auto;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}

/* PEN nav highlight */
.minimal-nav .nav-item.pen-nav .nav-link {
  background: #FFD700;
  color: #006341 !important;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.5px;
  padding: 0.3rem 0.9rem !important;
  line-height: 1.8;
}

.minimal-nav .nav-item.pen-nav .nav-link:hover {
  background: #e6c200;
  color: #004d32 !important;
}

.minimal-nav .nav-item.pen-nav .nav-link::after {
  display: none;
}

.minimal-nav .nav-link {
  color: var(--text-dark) !important;
  font-weight: 400;
  padding: 0.5rem 1rem !important;
  transition: color 0.3s ease;
  position: relative;
}

.minimal-nav .nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 1rem;
  right: 1rem;
  height: 2px;
  background: var(--accent-green);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.3s ease;
}

.minimal-nav .nav-link:hover::after,
.minimal-nav .nav-item.cta .nav-link::after {
  transform: scaleX(1);
}

.minimal-nav .nav-link:hover,
.minimal-nav .nav-item.cta .nav-link {
  color: var(--accent-green) !important;
}

.minimal-nav .nav-item.cta .nav-link {
  font-weight: 600;
}

/* ===========================
   HERO SECTIONS
   =========================== */
.minimal-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 120px 0 80px;
  min-height: 400px;
  display: flex;
  align-items: center;
}

.minimal-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0,99,65,0.45) 0%, rgba(0,77,50,0.55) 100%);
  z-index: 1;
}

.minimal-hero .container {
  position: relative;
  z-index: 2;
}

.minimal-hero h1,
.minimal-hero .bread {
  color: var(--primary-white);
  margin-bottom: 1rem;
}

.minimal-hero .breadcrumbs,
.minimal-hero .breadcrumbs a {
  color: rgba(255,255,255,0.9);
}

/* Banner Carousel on Homepage */
.hero-wrap.banner-carousel .item {
  position: relative;
  min-height: 600px;
  background-size: cover;
  background-position: center;
}

.hero-wrap.banner-carousel .item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(0,99,65,0.40) 0%, rgba(0,77,50,0.50) 100%);
  z-index: 1;
}

.hero-wrap.banner-carousel .container {
  position: relative;
  z-index: 2;
}

/* ===========================
   SECTIONS
   =========================== */
.minimal-section {
  padding: 40px 0;
  background: var(--primary-white);
}

.minimal-section.bg-light {
  background: var(--bg-off-white);
}

.minimal-section.bg-dark {
  background: var(--primary-dark);
  color: var(--primary-white);
}

.minimal-section.bg-dark h1,
.minimal-section.bg-dark h2,
.minimal-section.bg-dark h3 {
  color: var(--primary-white);
}

.heading-section {
  margin-bottom: 1rem;
}

.heading-section .subheading {
  color: var(--accent-green);
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 0.2rem;
  display: block;
}

.heading-section h2 {
  margin-bottom: 0.35rem;
  line-height: 1.2;
}

.heading-section p {
  margin-bottom: 0;
  font-size: 0.95rem;
  line-height: 1.4;
}

/* ===========================
   CARDS
   =========================== */
.card {
  border: 1px solid var(--border-light);
  border-radius: 8px;
  box-shadow: none;
  transition: all 0.3s ease;
  overflow: hidden;
  background: var(--primary-white);
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
  border-color: var(--accent-green);
}

.card-img-top {
  border-radius: 0;
}

.card-body {
  padding: 1.5rem;
}

.card-title {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  color: var(--primary-dark);
}

.card-text {
  color: var(--text-gray);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* ===========================
   BUTTONS
   =========================== */
.btn {
  padding: 0.75rem 1.5rem;
  font-weight: 500;
  border-radius: 6px;
  transition: all 0.3s ease;
  border: none;
  font-size: 0.95rem;
}

.btn-primary {
  background: var(--accent-green);
  color: var(--primary-white);
  border: 2px solid var(--accent-green);
}

.btn-primary:hover {
  background: var(--accent-green-dark);
  border-color: var(--accent-green-dark);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,99,65,0.3);
}

.btn-outline-primary {
  background: transparent;
  color: var(--accent-green);
  border: 2px solid var(--accent-green);
}

.btn-outline-primary:hover {
  background: var(--accent-green);
  color: var(--primary-white);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,99,65,0.2);
}

.btn-outline-light {
  background: transparent;
  color: var(--primary-white);
  border: 2px solid var(--primary-white);
}

.btn-outline-light:hover {
  background: var(--primary-white);
  color: var(--accent-green);
}

.btn-lg {
  padding: 1rem 2rem;
  font-size: 1.1rem;
}

.btn-sm {
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
}

/* ===========================
   FOOTER
   =========================== */
.minimal-footer,
.ftco-footer {
  background: #2e3c36 !important;
  color: rgba(255,255,255,0.8);
  padding: 3.5em 0 2em 0 !important;
}

.minimal-footer h2,
.minimal-footer .ftco-heading-2,
.ftco-footer h2,
.ftco-footer .ftco-heading-2 {
  color: var(--primary-white) !important;
  font-size: 1.25rem;
  margin-bottom: 1rem;
  font-weight: 600;
}

.minimal-footer .logo a {
  color: var(--primary-white);
  font-size: 1.5rem;
  font-weight: 700;
}

.minimal-footer a,
.ftco-footer a {
  color: rgba(255,255,255,0.7);
  transition: color 0.3s ease;
  font-size: 0.95rem;
}

.minimal-footer a:hover,
.ftco-footer a:hover {
  color: var(--accent-yellow) !important;
}

.minimal-footer ul {
  padding: 0;
  margin: 0;
}

.minimal-footer .list-unstyled li {
  padding: 0.3rem 0;
}

.footer-social,
.ftco-footer-social {
  display: flex;
  gap: 1rem;
  margin-top: 1rem;
}

.footer-social a,
.ftco-footer-social li a {
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.1) !important;
  border-radius: 50%;
  transition: all 0.3s ease;
  color: var(--primary-white) !important;
}

.footer-social a:hover,
.ftco-footer-social li a:hover {
  background: var(--accent-yellow) !important;
  color: var(--primary-dark) !important;
  transform: translateY(-3px);
}

.minimal-footer .text-center p {
  color: rgba(255,255,255,0.6);
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.1);
}

/* ===========================
   ANIMATIONS
   =========================== */
.fade-in-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Keep some essential FTCO animations but simplified */
.ftco-animate {
  opacity: 1 !important;
  visibility: visible !important;
}

/* ===========================
   FORMS
   =========================== */
.form-control {
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.form-control:focus {
  border-color: var(--accent-green);
  box-shadow: 0 0 0 3px rgba(0,99,65,0.1);
  outline: none;
}

/* ===========================
   BADGES & LABELS
   =========================== */
.badge {
  padding: 0.4rem 0.8rem;
  font-weight: 500;
  border-radius: 4px;
  font-size: 0.75rem;
}

.badge-primary {
  background: var(--accent-green);
  color: var(--primary-white);
}

.badge-success { background: #28a745; }
.badge-warning { background: #ffc107; color: var(--primary-dark); }
.badge-info { background: #17a2b8; }
.badge-danger { background: #dc3545; }

/* ===========================
   UTILITIES
   =========================== */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }

.text-green { color: var(--accent-green); }
.bg-green { background: var(--accent-green); }

/* Remove excessive backgrounds */
.bg-yellow { background: var(--bg-off-white) !important; }
.ftco-degree-bg { background: var(--primary-white) !important; }

/* Enhance overlays with better gradients */
.hero-wrap .overlay {
  background: linear-gradient(135deg, rgba(0,99,65,0.30) 0%, rgba(0,77,50,0.40) 100%) !important;
  opacity: 1 !important;
}

.hero-wrap-2 .overlay {
  background: linear-gradient(135deg, rgba(0,99,65,0.25) 0%, rgba(0,77,50,0.35) 100%) !important;
  opacity: 1 !important;
}

/* ===========================
   TEAM GRID LAYOUT
   =========================== */
/* Custom column for 5 cards per row on large screens */
@media (min-width: 1200px) {
  .col-lg-custom {
    flex: 0 0 20%;
    max-width: 20%;
  }
}

/* Team grid card */
.team-grid-card {
  background: var(--primary-white);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 1.25rem;
  box-shadow: var(--shadow-sm);
  transition: all 0.3s ease;
  min-height: 380px;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.team-grid-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-5px);
  border-color: var(--accent-green);
}

/* Photo wrapper and styling */
.team-photo-wrapper {
  margin-bottom: 1rem;
  display: flex;
  justify-content: center;
}

.team-photo {
  width: 180px;
  height: 210px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: var(--shadow-sm);
}

/* Team info section */
.team-info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.team-name {
  color: var(--primary-dark);
  font-weight: 600;
  font-size: 1.1rem;
  margin-bottom: 0.4rem;
  line-height: 1.3;
}

.team-position {
  color: var(--accent-green);
  font-size: 0.9rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
  line-height: 1.4;
}

.team-bio {
  color: var(--text-gray);
  font-size: 0.85rem;
  line-height: 1.5;
  margin-bottom: 0;
}

/* Responsive adjustments */
@media (max-width: 1199px) {
  /* 3 cards on tablets */
  .team-members-grid .col-lg-custom {
    flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}

@media (max-width: 767px) {
  /* 2 cards on mobile */
  .team-members-grid .col-sm-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  
  .team-grid-card {
    min-height: 350px;
    padding: 1rem;
  }
  
  .team-photo {
    width: 150px;
    height: 175px;
  }
  
  .team-name {
    font-size: 1rem;
  }
  
  .team-position {
    font-size: 0.85rem;
  }
  
  .team-bio {
    font-size: 0.8rem;
  }
}

@media (max-width: 575px) {
  /* 1 card on very small screens */
  .team-members-grid .col-sm-6 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Legacy testimony styles (for other pages if used) */
.testimony-wrap {
  background: var(--primary-white);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 1.25rem;
  box-shadow: none;
  transition: all 0.3s ease;
  min-height: 450px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.testimony-wrap:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.testimony-wrap .user-img {
  width: 220px !important;
  height: 260px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.testimony-wrap .member-info {
  margin-bottom: 0.75rem;
}

.testimony-wrap .name {
  color: var(--primary-dark);
  font-weight: 600;
  font-size: 1.15rem;
  margin-bottom: 0.35rem;
  text-align: center;
}

.testimony-wrap .position {
  color: var(--accent-green);
  font-size: 0.95rem;
  margin-bottom: 0.75rem;
  text-align: center;
  display: block;
}

.testimony-wrap .bio-text {
  margin-bottom: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text-gray);
  text-align: center;
}

.testimony-wrap.py-2 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

@media (max-width: 767px) {
  .testimony-wrap {
    min-height: 400px;
    padding: 1rem;
  }
  
  .testimony-wrap .user-img {
    width: 190px !important;
    height: 225px !important;
  }
  
  .testimony-wrap .name {
    font-size: 1.05rem;
  }
  
  .testimony-wrap .position {
    font-size: 0.9rem;
  }
  
  .testimony-wrap .bio-text {
    font-size: 0.85rem;
  }
}

/* ===========================
   RESPONSIVE
   =========================== */
@media (max-width: 991px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  
  .minimal-section {
    padding: 35px 0;
  }
  
  .ftco-section {
    padding: 35px 0;
  }
  
  .minimal-hero {
    padding: 100px 0 60px;
    min-height: 350px;
  }
}

@media (max-width: 767px) {
  h1 { font-size: 2rem; }
  h2 { font-size: 1.75rem; }
  
  .minimal-section {
    padding: 30px 0;
  }
  
  .ftco-section {
    padding: 30px 0;
  }
  
  .minimal-hero {
    padding: 80px 0 50px;
    min-height: 300px;
  }
  
  .btn {
    padding: 0.65rem 1.25rem;
    font-size: 0.9rem;
  }
  
  /* Reset column spacing on mobile */
  .ftco-section.bg-light .row,
  .ftco-section.ftco-degree-bg .row {
    margin-left: -15px;
    margin-right: -15px;
  }
  
  .ftco-section.bg-light .row > [class*='col-'],
  .ftco-section.ftco-degree-bg .row > [class*='col-'] {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 1.5rem;
  }
  
  .blog-entry .text {
    padding: 1rem !important;
  }
  
  .heading-section {
    margin-bottom: 1rem;
  }
  
  .practice-area {
    padding: 1.25rem;
    margin-bottom: 1rem;
  }
}

/* ===========================
   CAROUSEL ADJUSTMENTS
   =========================== */
.owl-carousel .owl-nav button {
  background: rgba(255,255,255,0.9) !important;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  transition: all 0.3s ease;
}

.owl-carousel .owl-nav button:hover {
  background: var(--accent-green) !important;
  color: var(--primary-white) !important;
}

.owl-carousel .owl-dots .owl-dot span {
  background: rgba(0,0,0,0.2);
  transition: all 0.3s ease;
}

.owl-carousel .owl-dots .owl-dot.active span {
  background: var(--accent-green);
}

/* ===========================
   COMPATIBILITY OVERRIDES
   =========================== */
/* Override FTCO heavy styles */
.ftco-section {
  padding: 40px 0;
}

.ftco-no-pt { padding-top: 0 !important; }
.ftco-no-pb { padding-bottom: 0 !important; }

.ftco-bg-dark {
  background: #2e3c36 !important;
}

/* Icon and typography enhancements */
.icon {
  color: var(--accent-green);
  transition: all 0.3s ease;
}

.icon:hover {
  color: var(--accent-yellow);
}

/* Subheadings with yellow accent */
.subheading,
.ftco-section .subheading {
  color: var(--accent-yellow) !important;
  font-weight: 600;
}

/* Banner text shadows for readability */
.slider-text h1,
.slider-text .subheading,
.slider-text h2 {
  text-shadow: 2px 2px 8px rgba(0,0,0,0.6), 1px 1px 4px rgba(0,0,0,0.4);
}

.slider-text p,
.slider-text .mb-4 {
  text-shadow: 1px 1px 4px rgba(0,0,0,0.5), 0 0 8px rgba(0,0,0,0.3);
}

.hero-wrap h1,
.hero-wrap h2,
.hero-wrap .subheading {
  text-shadow: 2px 2px 8px rgba(0,0,0,0.6), 1px 1px 4px rgba(0,0,0,0.4);
}

.hero-wrap p {
  text-shadow: 1px 1px 4px rgba(0,0,0,0.5), 0 0 8px rgba(0,0,0,0.3);
}

/* Clean up practice areas / icon boxes */
.practice-area {
  text-align: center;
  padding: 1.5rem;
  border: 1px solid var(--border-light);
  border-radius: 8px;
  transition: all 0.3s ease;
  background: var(--primary-white);
}

.practice-area:hover {
  box-shadow: var(--shadow-sm);
  transform: translateY(-5px);
}

.practice-area .icon {
  font-size: 3rem;
  color: var(--accent-green);
  margin-bottom: 0.75rem;
}

.practice-area h3 {
  margin-bottom: 0.5rem;
}

.practice-area p {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

/* Clean modal */
.modal-content {
  border-radius: 8px;
  border: none;
  box-shadow: var(--shadow-lg);
}

.modal-header {
  border-bottom: 1px solid var(--border-light);
  padding: 1.5rem;
}

.modal-body {
  padding: 2rem;
}

/* ===========================
   NEWS & BLOG SECTION COMPACT STYLES
   =========================== */
/* Reduce horizontal spacing in news section */
.ftco-section.bg-light .row,
.ftco-section.ftco-degree-bg .row {
  margin-left: -8px;
  margin-right: -8px;
}

.ftco-section.bg-light .row > [class*='col-'],
.ftco-section.ftco-degree-bg .row > [class*='col-'] {
  padding-left: 8px;
  padding-right: 8px;
}

/* Compact blog entries */
.blog-entry {
  margin-bottom: 0;
  height: 100%;
}

.blog-entry .text {
  padding: 1rem !important;
}

.blog-entry .text .topper {
  margin-bottom: 0.5rem;
}

.blog-entry .text .heading {
  font-size: 1.1rem;
  line-height: 1.3;
  margin-bottom: 0.4rem;
}

.blog-entry .text p {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

.blog-entry .text .btn {
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
}

/* Event date boxes - more compact */
.blog-entry .event-date {
  padding: 0.6rem !important;
  margin-bottom: 0.6rem !important;
  font-size: 0.9rem;
}

.blog-entry .event-date .badge {
  padding: 0.25rem 0.5rem;
  font-size: 0.7rem;
}

/* Reduce section bottom spacing */
.ftco-section .row.mt-4 {
  margin-top: 1.5rem !important;
}

/* Compact heading section */
.ftco-section .heading-section {
  margin-bottom: 1rem;
}

.ftco-section .heading-section p {
  font-size: 0.95rem;
  margin-bottom: 0;
}

/* Reduce Bootstrap utility spacing */
.ftco-section .mb-5,
.ftco-section .row.mb-5 {
  margin-bottom: 1rem !important;
}

.ftco-section .row.justify-content-center.mb-5 {
  margin-bottom: 1rem !important;
}

.col-md-10.heading-section.mb-5 {
  margin-bottom: 1rem !important;
}

/* "WHO ARE WE" section - compress text */
.ftco-section.ftco-degree-bg.bg-light p {
  margin-bottom: 0.6rem;
  line-height: 1.5;
}

.ftco-section.ftco-degree-bg.bg-light center p {
  margin-bottom: 0.5rem;
}

/* Compress all center text paragraphs */
center p {
  margin-bottom: 0.6rem;
  line-height: 1.5;
}

/* About section tab content */
.tabulation-2 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.tab-content {
  padding: 1rem;
  margin-top: 0.5rem;
}

.tab-content p {
  margin-bottom: 0.5rem;
  line-height: 1.5;
}

.tab-pane.container {
  padding: 1rem !important;
}

/* Years counter section */
.years.d-flex {
  margin-top: 1.5rem;
}

.years h4 {
  margin-bottom: 0;
  font-size: 1.1rem;
}

/* About section with image */
.ftco-section.ftco-no-pt.ftco-no-pb {
  padding: 40px 0 !important;
}

.ftco-section.ftco-no-pt {
  padding-top: 20px !important;
}

.ftco-section.ftco-no-pb {
  padding-bottom: 20px !important;
}

/* Visit website section */
.ftco-section.bg-light .py-4 {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}

/* Testimony section overlay */
.testimony-section .overlay {
  opacity: 0.8;
}

/* Footer row spacing */
.ftco-footer .row.mb-5 {
  margin-bottom: 2rem !important;
}

/* ===========================
   INNER PAGE HERO BANNER
   =========================== */
.inner-page-hero {
  background: linear-gradient(135deg, #006341 0%, #004d32 60%, #2e3c36 100%);
  padding: 55px 0 45px;
  position: relative;
  overflow: hidden;
  text-align: center;
}

/* Subtle decorative circles */
.inner-page-hero::before {
  content: '';
  position: absolute;
  top: -60px;
  right: -60px;
  width: 320px;
  height: 320px;
  background: rgba(255, 215, 0, 0.07);
  border-radius: 50%;
  pointer-events: none;
}

.inner-page-hero::after {
  content: '';
  position: absolute;
  bottom: -80px;
  left: -40px;
  width: 240px;
  height: 240px;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 50%;
  pointer-events: none;
}

.inner-page-hero h1.bread {
  color: #ffffff;
  font-size: 2.2rem;
  font-weight: 700;
  margin-bottom: 0.6rem;
  position: relative;
  z-index: 1;
}

.inner-page-hero .breadcrumbs {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.9rem;
  margin-bottom: 0;
  position: relative;
  z-index: 1;
}

.inner-page-hero .breadcrumbs a {
  color: #FFD700;
  text-decoration: none;
  transition: color 0.2s;
}

.inner-page-hero .breadcrumbs a:hover {
  color: #ffffff;
}

.inner-page-hero .breadcrumbs span {
  color: rgba(255, 255, 255, 0.75);
}

/* Gold accent underline below page title */
.inner-page-hero h1.bread::after {
  content: '';
  display: block;
  width: 50px;
  height: 3px;
  background: #FFD700;
  margin: 10px auto 0;
  border-radius: 2px;
}

/* ================================================
   SCHOOL DIRECTORY — Card Grid, Tabs, Filter, Modal
   ================================================ */

/* Filter bar */
.school-filter-wrap {
  position: relative;
}
.school-filter-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #006341;
  pointer-events: none;
  z-index: 4;
}
.school-filter-input {
  padding-left: 38px !important;
  border: 2px solid #006341 !important;
  border-radius: 50px !important;
  font-size: 0.9rem;
  height: 42px;
}
.school-filter-input:focus {
  box-shadow: 0 0 0 3px rgba(0,99,65,0.15) !important;
  outline: none;
}

/* Category tabs */
.school-tab-nav {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.school-tab-item {
  cursor: pointer;
  padding: 6px 14px;
  border-radius: 50px;
  border: 1.5px solid #006341;
  color: #006341;
  font-size: 0.82rem;
  font-weight: 600;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s;
  user-select: none;
  display: flex;
  align-items: center;
  gap: 6px;
}
.school-tab-item:hover {
  background: #e8f5ee;
}
.school-tab-item.active {
  background: #006341;
  color: #fff;
}
.school-tab-badge {
  background: rgba(255,255,255,0.25);
  border-radius: 50px;
  padding: 1px 7px;
  font-size: 0.75rem;
  font-weight: 700;
}
.school-tab-item.active .school-tab-badge {
  background: rgba(255,255,255,0.3);
}
.school-tab-item:not(.active) .school-tab-badge {
  background: #e8f5ee;
  color: #006341;
}

/* School card */
.school-card {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.10);
  background: #fff;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.school-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,99,65,0.18);
}

/* Card photo area */
.school-card-photo {
  height: 160px;
  background: linear-gradient(135deg, #006341 0%, #004d32 60%, #2e3c36 100%);
  background-size: cover;
  background-position: center;
  position: relative;
  flex-shrink: 0;
}

/* Logo badge (bottom-left of photo) */
.school-logo-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  width: 46px;
  height: 46px;
  background: #fff;
  border-radius: 8px;
  padding: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
  display: flex;
  align-items: center;
  justify-content: center;
}
.school-logo-badge img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* School code badge (top-right of photo) */
.school-code-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.55);
  color: #FFD700;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 50px;
  letter-spacing: 0.5px;
}

/* Card body */
.school-card-body {
  padding: 12px 14px 12px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.school-card-name {
  font-size: 0.85rem;
  font-weight: 700;
  color: #2e3c36;
  margin: 0;
  line-height: 1.35;
}
.school-card-location {
  font-size: 0.78rem;
  color: #6c757d;
  margin: 0;
}
.school-card-location .fa {
  color: #006341;
  font-size: 0.72rem;
}

/* Icon row */
.school-card-icons {
  margin-top: auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.school-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #e8f5ee;
  color: #006341;
  font-size: 0.75rem;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.school-icon-btn:hover {
  background: #006341;
  color: #fff;
  text-decoration: none;
}

/* School detail modal */
.school-modal .modal-content {
  border: none;
  border-radius: 12px;
  overflow: hidden;
}
.school-modal-header {
  background: linear-gradient(135deg, #006341 0%, #004d32 100%);
  background-size: cover;
  background-position: center;
  padding: 22px 24px;
  min-height: 100px;
  position: relative;
  border: none;
}
.school-modal-header.has-photo {
  min-height: 160px;
}
.school-modal-overlay {
  position: relative;
  z-index: 2;
}
.school-modal-header::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1;
}
.school-modal-header.has-photo::after {
  background: rgba(0,0,0,0.55);
}
.school-modal-logo {
  width: 52px;
  height: 52px;
  object-fit: contain;
  background: #fff;
  border-radius: 8px;
  padding: 4px;
  flex-shrink: 0;
}
.school-modal-body {
  padding: 20px 24px;
}
.school-modal-table td {
  padding: 6px 8px;
  border-top: 1px solid #f0f0f0;
  font-size: 0.875rem;
  vertical-align: middle;
}
.school-modal-table td.text-muted {
  width: 38%;
  font-size: 0.8rem;
}
.school-modal-photo img {
  max-height: 200px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
