/* Clean, minimal responsive styles for Offshore Building and Infrastructure Group */

:root{
  --bg: #ffffff;
  --muted: #f8f9fa;
  --text: #1a3a52;
  --subtle: #6c757d;
  --primary: #0066cc;
  --primary-dark: #004499;
  --border: #e9ecef;
  --container: 1200px;
}

/* Gallery Styles */
#main article.thumb {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  animation: fadeInUp 0.6s ease forwards;
}

#main article.thumb.is-hidden {
  display: none !important;
}

#main {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 20px !important;
  padding: 20px !important;
}

#main article.thumb .image {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  aspect-ratio: 4/3;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#main article.thumb .image:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

#main article.thumb .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

#main article.thumb:hover .image img {
  transform: scale(1.05);
}

#main article.thumb h2,
#main article.thumb p {
  display: block !important;
  padding: 10px 0;
  margin: 0;
}

#main article.thumb h2 {
  font-size: 18px;
  font-weight: 600;
  color: var(--text, #222);
}

#main article.thumb p {
  font-size: 14px;
  color: var(--subtle, #666);
}

.gallery-heading {
  display: none !important;
}

/* Lightbox Styles */
.lightbox {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  z-index: 1000;
  opacity: 0;
  transition: opacity 0.3s ease;
  cursor: pointer;
}

.lightbox.active {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
}

.lightbox-content {
  position: relative;
  max-width: 90%;
  max-height: 90%;
  transform: scale(0.8);
  transition: transform 0.3s ease;
  cursor: default;
}

.lightbox.active .lightbox-content {
  transform: scale(1);
}

.lightbox-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 8px;
  cursor: default;
}

.lightbox-close {
  position: absolute;
  top: 20px;
  right: 40px;
  color: white;
  font-size: 40px;
  cursor: pointer;
  background: none;
  border: none;
  transition: transform 0.2s ease;
  z-index: 1001;
}

.lightbox-close:hover {
  transform: scale(1.1);
}

.lightbox-caption {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: white;
  text-align: center;
  background: rgba(0, 0, 0, 0.7);
  padding: 10px 20px;
  border-radius: 4px;
  font-size: 16px;
  cursor: default;
}

/* Gallery Filter Animations */
.gallery-filter {
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.gallery-filter::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease;
}

.gallery-filter:hover::before {
  width: 300px;
  height: 300px;
}

.gallery-filter.is-active {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

/* Fade animation for gallery items */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Stagger animation for gallery items */
#main article.thumb:nth-child(1) { animation-delay: 0.05s; }
#main article.thumb:nth-child(2) { animation-delay: 0.1s; }
#main article.thumb:nth-child(3) { animation-delay: 0.15s; }
#main article.thumb:nth-child(4) { animation-delay: 0.2s; }
#main article.thumb:nth-child(5) { animation-delay: 0.25s; }
#main article.thumb:nth-child(6) { animation-delay: 0.3s; }
#main article.thumb:nth-child(7) { animation-delay: 0.35s; }
#main article.thumb:nth-child(8) { animation-delay: 0.4s; }
#main article.thumb:nth-child(9) { animation-delay: 0.45s; }
#main article.thumb:nth-child(10) { animation-delay: 0.5s; }
#main article.thumb:nth-child(11) { animation-delay: 0.55s; }
#main article.thumb:nth-child(12) { animation-delay: 0.6s; }

/* Site-wide typography & spacing */
html {font-size:16px}
body {font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:var(--text);}
h1,h2,h3,h4{color:var(--text);margin:0 0 12px;font-weight:800}
h1{font-size:clamp(28px,4.5vw,48px)}
h2{font-size:clamp(20px,3.2vw,32px)}
h3{font-size:18px}
p{color:var(--text);margin-bottom:18px}

/* Main wrapper spacing */
.site-main{display:block}
/* Make top-level sections full-bleed; keep inner .container centered at max width */
.site-main > *{width:100%;padding:28px 0}
.site-main > * .container{max-width:var(--container);margin:0 auto;padding:0 20px}
.site-main > *:first-child{padding-top:20px}

/* Global reveal animation for top-level sections inside main */
.site-main > *{opacity:0;transform:translateY(10px);animation:fadeUp .6s ease forwards}
.site-main > *:nth-child(1){animation-delay:0.06s}
.site-main > *:nth-child(2){animation-delay:0.12s}
.site-main > *:nth-child(3){animation-delay:0.18s}
.site-main > *:nth-child(4){animation-delay:0.24s}
.site-main > *:nth-child(5){animation-delay:0.30s}
.site-main > *:nth-child(6){animation-delay:0.36s}

@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .site-main > *{animation:none;opacity:1;transform:none}
}


/* Reset */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; color:var(--text); background:var(--bg); line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}

/* Header */
.site-header{background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1200}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px}
.header-left{display:flex;align-items:center;gap:12px}
.site-logo{height:44px;width:auto;display:block}
.nav-toggle{display:none;background:none;border:none;font-size:20px;cursor:pointer}

.main-nav{flex:1;display:flex;justify-content:center}
.nav-menu{display:flex;gap:20px;align-items:center;list-style:none}
.nav-menu a{font-size:13px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;padding:8px 10px;border-radius:8px;color:var(--text);transition:all .18s ease}
.nav-menu a:hover{color:var(--primary-dark);background:rgba(0,0,0,0.03);transform:translateY(-2px)}
.nav-menu a.active{color:var(--primary-dark);background:rgba(0,166,81,0.1);border-bottom:2px solid var(--primary)}

.header-right{display:flex;align-items:center;gap:12px}

/* Buttons */
.btn{display:inline-block;padding:10px 16px;border-radius:999px;background:var(--primary);color:white;font-weight:700;border:none;cursor:pointer;transition:all .18s ease}
.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn-primary{background:var(--primary);color:#fff;border:1px solid var(--primary)}
.btn-muted{background:#fff;color:var(--text);border:1px solid var(--border)}
.btn:focus,.btn:active,.btn:focus-visible{outline:none;box-shadow:0 6px 20px rgba(0,102,204,0.12);transform:none}
.btn:hover{transform:translateY(-3px)}

/* Utility card */
.card{background:#fff;border-radius:12px;padding:18px;border:1px solid var(--border);box-shadow:0 6px 18px rgba(2,6,23,0.04)}

/* Hero - full bleed video with overlay and centered text */
.hero{position:relative;min-height:80vh;overflow:hidden}
.hero-video-bg{position:absolute;inset:0;z-index:1;overflow:hidden}
.hero-video-bg video{width:100%;height:100%;object-fit:cover;display:block}
/* gray overlay on top of video for consistent contrast */
.hero::after{content:"";position:absolute;inset:0;background:rgba(0,102,204,0.15);z-index:2}
.hero-content{position:absolute;left:40px;bottom:48px;z-index:3;padding:0 20px;text-align:left;color:#fff;max-width:880px}
.hero h1{font-size:clamp(28px,6vw,64px);line-height:1.02;font-weight:800;color:#fff;margin:0 0 12px}
.hero h1 strong{color:var(--primary)}
.hero p{color:rgba(255,255,255,0.92);font-size:16px;max-width:720px;margin:0 0 18px}

/* Page hero for internal pages (image/bg with centered text) */
.page-hero{padding:64px 0;background:linear-gradient(180deg,rgba(15,23,32,0.04),transparent);position:relative;overflow:hidden}
.page-hero .container{display:flex;flex-direction:column;align-items:flex-start;padding:40px 20px}
.page-hero h1{font-size:clamp(22px,3vw,36px);color:var(--text);margin-bottom:8px}
.page-hero p{color:var(--subtle);margin-bottom:0}

/* Page hero variant with background image and overlay */
.page-hero.has-bg{padding:80px 0;background-color:transparent}
.page-hero.has-bg::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.35),rgba(0,0,0,0.25));z-index:1}
.page-hero.has-bg .container{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;padding:48px 20px}
.page-hero.has-bg h1,.page-hero.has-bg p{color:#fff}
.page-hero.has-bg{background-size:cover;background-position:center;background-repeat:no-repeat}
.page-hero.has-bg .container{max-width:980px}

/* Sections */
.services-section,.benefits-section,.contact-section,.clients-section,.about-section{padding:64px 0;background:var(--bg)}

/* Generic content section */
.content-section{padding:48px 0}
.content-section .container{padding:0 20px}
.content-section h2{font-size:24px;margin-bottom:12px}
.content-section p{font-size:16px;color:var(--subtle)}
.section-header{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:18px}
.section-title{font-size:28px;margin:0;color:var(--text);letter-spacing:-0.01em;display:flex;align-items:center;gap:12px}
.section-title::before{content:"";width:48px;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--primary),var(--primary-dark));display:inline-block}
.section-subtitle{color:var(--subtle);margin:0;font-size:16px}

@media (max-width:900px){
  .section-header{align-items:center;text-align:center}
  .section-title::before{display:none}
}

.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.service-card{
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(16,24,40,0.06);
  transition:transform .22s,box-shadow .22s;
  display:flex;
  flex-direction:column;
}
.service-card:hover{transform:translateY(-6px);box-shadow:0 18px 48px rgba(16,24,40,0.08)}
.service-card img{width:100%;height:220px;object-fit:cover;display:block}
.service-card-content{padding:24px}

/* Service card icon */
.service-card .service-icon{width:56px;height:56px;border-radius:10px;background:var(--muted);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--primary);flex-shrink:0}
.service-card .service-icon svg{width:28px;height:28px;display:block}

/* Improved zigzag on wide screens: equal-height cards, cropped images, balanced padding */
@media (min-width:900px){
  .service-card{flex-direction:row;min-height:280px;align-items:stretch}
  .service-card:nth-child(even){flex-direction:row-reverse}
  /* smaller image (40%) to give more room for text */
  .service-card img{width:40%;height:100%;object-fit:cover;flex-shrink:0}
  .service-card-content{width:60%;padding:32px;display:flex;flex-direction:column;justify-content:center}
  .service-card + .service-card{margin-top:24px}
}

/* Service card CTA: turn inline link into a button */
.service-card-content a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:10px;
  padding:6px 10px;
  border-radius:8px;
  border:1px solid var(--primary);
  color:var(--primary);
  font-weight:700;
  background:transparent;
  width:auto;
  max-width:none;
  white-space:nowrap;
  align-self:flex-start;
  font-size:13px;
}
.service-card-content a:hover{background:var(--primary);color:#fff}

/* Ensure services stack as full-width rows on desktop so nth-child alternation creates a zigzag per row */
@media (min-width:900px){
  .services-grid{display:grid;grid-template-columns:1fr;gap:28px}
}
.service-card h3{margin-bottom:8px;color:var(--text)}
.service-card p{color:var(--subtle);font-size:15px}

/* About section */
.about-section{padding:64px 0;background:linear-gradient(180deg,#ffffff,#fbfbfb)}
.about-grid{display:grid;grid-template-columns:1fr;gap:28px;align-items:center}
.about-media img{width:100%;height:360px;object-fit:cover;border-radius:12px;box-shadow:0 8px 30px rgba(2,6,23,0.06)}

/* common content image */
.content-image{width:100%;border-radius:10px;margin-bottom:30px;display:block;box-shadow:0 8px 20px rgba(2,6,23,0.04)}
.about-content h2{font-size:32px;margin-bottom:12px;color:var(--text);font-weight:800;letter-spacing:-0.01em;line-height:1.05}
.about-content p{color:var(--subtle);margin-bottom:18px;font-size:16px}
.about-list{list-style:none;padding:0;margin:0 0 18px 0}
.about-list li{padding:8px 0;color:var(--text);display:flex;gap:12px;align-items:flex-start}
.about-list li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--primary);flex:0 0 10px;margin-top:6px}
.about-cta-row{display:flex;gap:12px;margin-top:8px}
.about-cta-row .btn{padding:10px 14px}

/* Entrance animations */
.about-media, .about-content{opacity:0;transform:translateY(12px);animation:fadeUp .6s ease forwards}
.about-media{animation-delay:0.05s}
.about-content{animation-delay:0.18s}

@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .about-media, .about-content{animation:none;opacity:1;transform:none}
}

@media(min-width:900px){
  .about-grid{grid-template-columns:48% 52%;gap:36px}
  .about-media img{height:420px}
}

/* Benefits */
.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.benefit-item{text-align:center}
.benefit-number{font-size:48px;color:var(--primary);font-weight:800}

/* Clients */
.clients-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:18px;align-items:center;justify-items:center}
.client{width:140px;height:64px;background:var(--muted);display:flex;align-items:center;justify-content:center;border-radius:8px}

/* Blog cards */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.blog-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--border);box-shadow:0 8px 30px rgba(2,6,23,0.04);display:flex;flex-direction:column}
.blog-card img{width:100%;height:180px;object-fit:cover}
.blog-card-content{padding:16px;display:flex;flex-direction:column;gap:10px}
.blog-card h3{font-size:18px;margin:0;color:var(--text)}
.blog-card p{margin:0;color:var(--subtle);font-size:14px}
.blog-card a{margin-top:auto;align-self:flex-start;color:var(--primary);font-weight:700}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.contact-panel{background:linear-gradient(180deg,#ffffff,#fbfbfb);padding:28px;border-radius:12px;border:1px solid var(--border)}
.contact-cards{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}
.contact-card{display:flex;gap:12px;align-items:center;padding:12px;border-radius:8px;background:var(--muted)}
.contact-card .icon{width:44px;height:44px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 4px 10px rgba(0,0,0,0.04)}
.contact-card h4{margin:0 0 4px 0;font-size:15px}
.contact-card .details p{margin:0;color:var(--subtle)}
.contact-form{background:transparent;padding:0}
.contact-form-grid{background:#fff;padding:22px;border-radius:12px;border:1px solid var(--border)}
.contact-form-grid .form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.contact-form-grid .form-group{display:flex;flex-direction:column}
.contact-form-grid .form-group.full{grid-column:1/-1}
.form-control{padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:15px}
.form-control:focus{outline:none;box-shadow:0 0 0 3px rgba(0,166,81,0.08);border-color:var(--primary-dark)}
.contact-form-grid label{font-size:13px;margin-bottom:6px;color:var(--subtle)}

/* Form refinements */
.form-row .form-group .form-control{width:100%}
.contact-form-grid .btn{margin-top:10px}

/* Header/nav refinements */
.site-header{backdrop-filter:saturate(140%) blur(6px);background:rgba(255,255,255,0.72)}
.nav-menu a{padding:10px 12px}
.nav-menu .btn.nav-cta{padding:8px 12px;border-radius:8px}

/* Accessibility: visible focus for keyboard users */
:focus{outline:2px solid var(--primary);outline-offset:2px}

/* Footer */
.site-footer{background:var(--primary-dark);color:#ffffff;padding:0}
/* make footer background full-bleed while keeping inner content centered */
.site-footer .container{max-width:100%;padding:0}
.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px;max-width:var(--container);margin:0 auto;padding:48px 20px}
.footer-section h4{color:#f3f4f6;margin-bottom:12px}
.footer-bottom{text-align:center;padding-top:22px;color:#cbd5e1}
.site-footer a{color:#ffffff;text-decoration:none}
.site-footer a:hover,.site-footer a:focus{color:#ffffff;text-decoration:underline;text-underline-offset:2px}

/* Responsive */
@media (max-width:900px){
  .benefits-grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr}
}

@media (max-width:768px){
  .nav-toggle{display:block}
  .header-inner{position:relative; padding:10px 16px}
  .main-nav{position:absolute;left:0;right:0;top:100%;z-index:2000;background:#fff;padding:0;box-shadow:0 12px 40px rgba(0,0,0,0.12)}
  .nav-menu{display:none;flex-direction:column;gap:12px;align-items:stretch;padding:16px;background:#fff;border-top:1px solid var(--border);width:100%}
  .nav-menu.active{display:flex}
  .nav-menu a{padding:12px;border-radius:8px}
  .hero{min-height:60vh}
  .hero-content{padding:48px 16px}
  .hero h1{font-size:28px}
}

@media (max-width:480px){
  .benefits-grid{grid-template-columns:1fr}
  .site-logo{height:34px}
}

/* Small utility for centered call-to-action blocks used site-wide */
.section-cta{text-align:center;margin-top:40px}

/* spacing for consecutive buttons in CTAs */
.section-cta .btn + .btn{margin-left:15px}

/* Utilities */
.lead{margin-bottom:32px;color:var(--subtle)}
.muted{color:var(--subtle);margin-bottom:18px}
.no-margin{margin:0}
.text-center{text-align:center}
.mt-12{margin-top:12px}
.mt-14{margin-top:14px}
.mt-18{margin-top:18px}
.mt-20{margin-top:20px}

/* Form small note */
.form-note{margin-top:10px;font-size:13px;color:var(--subtle)}

/* Lightbox styles */
.lb-backdrop{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(2,6,23,0.75);z-index:2000}
.lb-backdrop.active{display:flex}
.lb-img{max-width:92%;max-height:92%;border-radius:8px;box-shadow:0 18px 60px rgba(2,6,23,0.6)}
.lb-caption{color:#fff;margin-top:12px;font-size:14px;text-align:center}
.lb-close{position:absolute;top:18px;right:18px;color:#fff;background:transparent;border:none;font-size:28px;cursor:pointer}

/* small helpers */
.required{color:var(--primary)}
.muted-list{margin:10px 0 0 16px;color:var(--subtle)}
.small-text{font-size:14px}


/* Gallery styles */
.gallery-section{padding:64px 0;background:var(--bg)}
.gallery-section .container{max-width:1200px}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;margin-top:18px}
.gallery-item{background:#fff;border-radius:10px;overflow:hidden;border:1px solid var(--border);box-shadow:0 8px 20px rgba(2,6,23,0.04);transition:transform .18s,box-shadow .18s}
.gallery-item img{width:100%;height:160px;object-fit:cover;display:block}
.gallery-item figcaption{padding:10px 12px;font-size:14px;color:var(--subtle)}
.gallery-item:hover{transform:translateY(-6px);box-shadow:0 18px 48px rgba(16,24,40,0.08)}

@media (max-width:768px){
  .gallery-item img{height:140px}
}

/* Gallery filters (minimal, clean) */
.gallery-filters { display:flex; gap:12px; justify-content:center; align-items:center; flex-wrap:wrap; margin:24px auto 8px; max-width:1100px; padding:0 16px; }
.gallery-filter {
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 16px; min-height:44px; border-radius:999px;
  border:1px solid var(--primary); background:#fff; color:var(--primary);
  font-weight:700; letter-spacing:.02em; font-size:.95rem; cursor:pointer;
  box-shadow:0 2px 8px rgba(16,24,40,.06);
  transition:transform .15s, box-shadow .15s, background-color .15s, color .15s, border-color .15s;
  background-image:none !important;
}
.gallery-filter:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(16,24,40,.08); }
.gallery-filter.is-active,
.gallery-filter[aria-pressed="true"] { background:var(--primary); color:#fff; border-color:var(--primary); }
.gallery-filter.is-active:hover,
.gallery-filter[aria-pressed="true"]:hover { filter:brightness(0.95); }
.gallery-filter[aria-pressed="false"] { background:#fff; color:var(--primary); border-color:var(--primary); }
.gallery-filter:focus-visible { outline:3px solid var(--primary); outline-offset:2px; }

/* Hide structural headings; used for JS categorization only */
#main > h2.gallery-heading { display:none !important; }

/* Smooth filter transitions */
#main article.thumb { transition: opacity .18s ease, transform .18s ease; }
#main article.thumb.is-hidden { display:none !important; opacity:0; transform:scale(.98); }

/* Tidy gallery images and captions */
#main article.thumb h2, #main article.thumb p { display:none; }
#main article.thumb .image img { width:100%; height:auto; aspect-ratio:4 / 3; object-fit:cover; border-radius:8px; }

@media (max-width:600px){ .gallery-filters{ gap:8px; } }

/* Button color state fixes (force correct colors) */
.gallery-filters .gallery-filter { color: var(--primary) !important; border-color: var(--primary); }
.gallery-filters .gallery-filter span { color: inherit !important; }

/* Inactive state: consistent across default/hover/focus */
.gallery-filters .gallery-filter[aria-pressed="false"],
.gallery-filters .gallery-filter[aria-pressed="false"]:hover,
.gallery-filters .gallery-filter[aria-pressed="false"]:focus { background:#fff; color: var(--primary) !important; border-color: var(--primary); }

/* Active state: consistent across default/hover/focus */
.gallery-filters .gallery-filter[aria-pressed="true"],
.gallery-filters .gallery-filter[aria-pressed="true"]:hover,
.gallery-filters .gallery-filter[aria-pressed="true"]:focus,
.gallery-filters .gallery-filter.is-active,
.gallery-filters .gallery-filter.is-active:hover,
.gallery-filters .gallery-filter.is-active:focus { background: var(--primary); color: #fff !important; border-color: var(--primary); }

/* Footer text color override: force white across all pages */
.site-footer,
.site-footer p,
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4, .site-footer h5, .site-footer h6,
.site-footer li, .site-footer span, .site-footer small, .site-footer strong, .site-footer em,
.site-footer .footer-bottom, .site-footer .footer-content {
  color: #ffffff !important;
}
.site-footer a,
.site-footer a:visited,
.site-footer a:hover,
.site-footer a:focus {
  color: #ffffff !important;
  text-decoration: none;
}
.site-footer a:hover, .site-footer a:focus { text-decoration: underline; text-underline-offset: 2px; }

/* Gallery2 mobile responsiveness fixes */
/* Remove global section padding from Multiverse #main and prevent horizontal scroll */
.site-main > #main { padding: 0 !important; }
#main { overflow-x: hidden; }

/* Make filter buttons flow neatly on small screens */
@media (max-width: 640px) {
  .gallery-filters { padding: 0 12px; gap: 10px; }
  .gallery-filters .gallery-filter { flex: 1 1 calc(50% - 10px); max-width: none; }
}
@media (max-width: 400px) {
  .gallery-filters .gallery-filter { flex: 1 1 100%; }
}