/* site overrides — put slider / contact-form / tweak CSS here (keep it out of the pages) */

/* Betheme equal-height valign-middle pulls columns up via translateY(-50%),
   overlapping the previous section/hero when the theme's equalize JS is absent.
   Neutralize the transform at all widths (matches Betheme's own responsive reset). */
.equal-height-wrap .mcb-wrap .mcb-wrap-inner{top:0!important;transform:none!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important}

/* mfn-mobile-menu-fix — Betheme's mobile hamburger relies on its JS to open
   the menu; in a frozen build that JS is unreliable, so tapping does nothing.
   These rules + MOBILE_MENU_JS toggle a `mfn-mobile-open` class on #Header_wrapper
   with no dependency on Betheme JS. Only active when the class is set (added
   solely by tapping the hamburger, which is hidden on desktop), so the desktop
   horizontal menu is untouched. */
#Header_wrapper.mfn-mobile-open #Top_bar{position:relative}
#Header_wrapper.mfn-mobile-open #menu{display:block!important;position:absolute;left:0;right:0;top:100%;background:#fff;z-index:99999;box-shadow:0 10px 30px rgba(0,0,0,.18);max-height:80vh;overflow:auto}
#Header_wrapper.mfn-mobile-open #menu>ul.menu{display:block!important;width:100%}
#Header_wrapper.mfn-mobile-open #menu ul.menu>li{display:block!important;float:none!important;width:100%!important;margin:0!important;border-bottom:1px solid rgba(0,0,0,.08)}
#Header_wrapper.mfn-mobile-open #menu ul.menu li a{display:block!important;padding:14px 22px!important;color:#222!important;line-height:1.3!important}
#Header_wrapper.mfn-mobile-open #menu ul.sub-menu{position:static!important;display:none;left:auto;top:auto;box-shadow:none;min-width:0;background:rgba(0,0,0,.03)}
#Header_wrapper.mfn-mobile-open #menu li.mfn-sub-open>ul.sub-menu{display:block!important}
#Header_wrapper.mfn-mobile-open #menu ul.sub-menu li a{padding-left:42px!important}
.responsive-menu-toggle{cursor:pointer}

/* --- contact form (replaces Contact Form 7; theme styling kept) --- */
#ispac-contact .ispac-cap{display:flex;align-items:center;gap:12px}
#ispac-contact .ispac-cap-q{font-size:17px;font-weight:700;letter-spacing:1px;background:#f4f4f4;border:1px solid #ddd;border-radius:4px;padding:11px 16px;white-space:nowrap;user-select:none}
#ispac-contact .ispac-cap input{flex:1}
#ispac-contact .ispac-hp{position:absolute;left:-9999px}
#ispac-contact .wpcf7-response-output{display:none;margin:12px 0 0;padding:10px 14px;border-radius:4px}
#ispac-contact .cf-ok{display:block;border:1px solid #46b450;background:#f1f9f1;color:#2b6b2f}
#ispac-contact .cf-err{display:block;border:1px solid #dc3232;background:#fdf2f2;color:#a12020}


/* ======================================================================
   DESIGN POLISH — ispac.in  (layout only; colours/content untouched)
   ====================================================================== */

/* ---------- 1. Blog grid: equal cards, small title, date beside it ------ */
#Content .posts_group.grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:30px;
}
#Content .posts_group.grid{position:static !important; height:auto !important}
#Content .posts_group.grid .post-item{
  width:auto !important; margin:0 !important; float:none !important;
  position:static !important; left:auto !important; top:auto !important;
  transform:none !important;
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #ececec; border-radius:8px; overflow:hidden;
  transition:box-shadow .25s ease, transform .25s ease;
}
#Content .posts_group.grid .post-item:hover{
  box-shadow:0 10px 28px rgba(0,0,0,.09); transform:translateY(-2px);
}
#Content .posts_group.grid .post-item .date_label{display:none}
#Content .posts_group.grid .image_frame{margin:0 !important; border:0 !important}
#Content .posts_group.grid .image_frame .image_wrapper{
  aspect-ratio:16/10; overflow:hidden; line-height:0; background:#f3f3f3;
}
#Content .posts_group.grid .image_frame .image_wrapper > a{display:block;height:100%}
#Content .posts_group.grid .image_frame img{
  width:100% !important; height:100% !important; object-fit:cover; display:block;
  transition:transform .45s ease;
}
#Content .posts_group.grid .post-item:hover .image_frame img{transform:scale(1.05)}

#Content .posts_group.grid .post-desc-wrapper{flex:1; display:flex; padding:0}
#Content .posts_group.grid .post-desc{
  flex:1; display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto 1fr auto;
  column-gap:14px;
  padding:16px 18px 6px;
}
#Content .posts_group.grid .post-title{grid-column:1; grid-row:1; margin:0}
#Content .posts_group.grid .post-title h4.entry-title{
  font-size:17px !important; line-height:1.45 !important; margin:0 !important;
  font-weight:600; letter-spacing:0;
}
#Content .posts_group.grid .post-title h4.entry-title a{color:#2b2b2b}
#Content .posts_group.grid .post-title h4.entry-title a:hover{color:var(--ispac-accent,#f07c1f)}
#Content .posts_group.grid .post-head{grid-column:2; grid-row:1; margin:0}
#Content .posts_group.grid .post-head .post-meta,
#Content .posts_group.grid .post-head .author-date,
#Content .posts_group.grid .post-head .date{
  margin:0 !important; padding:0 !important; border:0 !important;
  font-size:12px; line-height:1.45; color:#9a9a9a; white-space:nowrap;
}
#Content .posts_group.grid .post-head .post-date{font-size:12px; color:#9a9a9a}
#Content .posts_group.grid .post-head i{font-size:12px; margin-right:3px}
#Content .posts_group.grid .post-excerpt{grid-column:1/-1; grid-row:2; margin:8px 0 0; font-size:14px; color:#6f6f6f}
#Content .posts_group.grid .post-footer{
  grid-column:1/-1; grid-row:4; margin:14px 0 0; padding:10px 0 4px;
  border-top:1px solid #f0f0f0; font-size:13px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
#Content .posts_group.grid .post-footer > *{
  float:none !important; margin:0 !important; padding:0 !important; width:auto !important;
  border:0 !important; white-space:nowrap;
}

/* ---------- 2. WordPress galleries: tidy masonry, nothing cropped ------- */
#Content .gallery{
  display:block !important;
  columns:3; column-gap:16px; margin:0 0 26px !important;
}
/* a single-image gallery (the chapter certificates) — left aligned, not full bleed */
#Content .gallery.gallery-columns-1{columns:1; max-width:560px; margin-left:0 !important; margin-right:auto !important}
#Content .gallery.gallery-columns-1 .gallery-item{margin-bottom:0 !important}
#Content .gallery.gallery-columns-2{columns:2}
#Content .gallery.gallery-columns-4,
#Content .gallery.gallery-columns-5{columns:4}
/* the theme's masonry JS absolutely-positions these and stamps an inline
   height on the container — neutralise both so the CSS columns can work */
#Content .gallery.masonry{position:static !important; height:auto !important}
#Content .gallery .gallery-item{
  width:100% !important; max-width:100% !important; margin:0 0 16px !important; float:none !important;
  position:static !important; left:auto !important; top:auto !important; right:auto !important;
  transform:none !important;
  display:block !important; break-inside:avoid; page-break-inside:avoid; overflow:hidden;
}
#Content .gallery .gallery-icon{margin:0 !important; padding:0 !important}
#Content .gallery .gallery-icon a{
  display:block; line-height:0; overflow:hidden; border-radius:6px;
  background:#f3f3f3; border:1px solid #ececec;
}
#Content .gallery .gallery-icon img{
  width:100% !important; height:auto !important; display:block;
  border:0 !important; padding:0 !important; margin:0 !important;
  transition:transform .45s ease;
}
#Content .gallery .gallery-icon a:hover img{transform:scale(1.04)}
#Content .gallery .gallery-caption{
  font-size:13px; line-height:1.5; color:#7a7a7a; margin:8px 2px 0; padding:0;
}
@media(max-width:1024px){#Content .gallery,#Content .gallery.gallery-columns-4{columns:2}}
@media(max-width:600px){#Content .gallery,#Content .gallery.gallery-columns-2,
  #Content .gallery.gallery-columns-3,#Content .gallery.gallery-columns-4{columns:1}}

/* ---------- 3. Team / chapter member cards ----------------------------- */
.mcb-wrap-inner:has(> .column_our_team){
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px; align-items:stretch;
}
.mcb-wrap-inner:has(> .column_our_team.one-half){grid-template-columns:repeat(2,1fr)}
/* chapter committees: 6 compact cards per row */
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)){grid-template-columns:repeat(6,1fr); gap:18px}
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)) .desc_wrapper{padding:12px 12px 14px}
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)) .desc_wrapper h4{font-size:14px !important; line-height:1.35}
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)) .desc_wrapper .subtitle{font-size:12px; margin:0 0 8px !important}
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)) .desc_wrapper hr.hr_color{width:32px; margin:0 0 8px !important}
.mcb-wrap-inner:has(> .column_our_team:not(.one-third)) .desc_wrapper .desc{font-size:13px; line-height:1.55}
@media(max-width:1280px){.mcb-wrap-inner:has(> .column_our_team:not(.one-third)){grid-template-columns:repeat(4,1fr)}}
@media(max-width:1024px){.mcb-wrap-inner:has(> .column_our_team){grid-template-columns:repeat(2,1fr)}
  .mcb-wrap-inner:has(> .column_our_team:not(.one-third)){grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.mcb-wrap-inner:has(> .column_our_team:not(.one-third)){grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.mcb-wrap-inner:has(> .column_our_team){grid-template-columns:1fr}
  .mcb-wrap-inner:has(> .column_our_team:not(.one-third)){grid-template-columns:repeat(2,1fr)}}
.mcb-wrap-inner:has(> .column_our_team) > .column{
  width:auto !important; margin:0 !important; float:none !important;
}
.mcb-wrap-inner:has(> .column_our_team) > .column:not(.column_our_team){grid-column:1/-1}
.column_our_team{display:flex}
.column_our_team .team{
  display:flex; flex-direction:column; width:100%;
  border:1px solid #ececec; border-radius:10px; overflow:hidden; background:#fff;
  transition:box-shadow .25s ease, transform .25s ease;
}
.column_our_team .team:hover{box-shadow:0 10px 26px rgba(0,0,0,.08); transform:translateY(-2px)}
.column_our_team .image_frame,
.column_our_team .image_frame .image_wrapper{
  margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important;
}
.column_our_team .image_frame .image_wrapper{
  aspect-ratio:1/1; overflow:hidden; line-height:0; background:#f2f2f2;
}
.column_our_team .image_frame img{
  width:100% !important; height:100% !important; object-fit:cover;
  object-position:center 18%; display:block;
}
.column_our_team .desc_wrapper{flex:1; display:flex; flex-direction:column; padding:16px 18px 20px}
.column_our_team .desc_wrapper h4{font-size:17px !important; line-height:1.4; margin:0 0 4px !important; font-weight:600}
.column_our_team .desc_wrapper .subtitle{margin:0 0 12px !important; font-size:13px; color:#9a9a9a}
.column_our_team .desc_wrapper hr.hr_color{margin:0 0 12px !important; width:46px}
.column_our_team .desc_wrapper .desc{font-size:14px; line-height:1.6; color:#6f6f6f}

/* ---------- 0. Compact header ------------------------------------------ */
/* the theme ships a 120px logo in a ~150px bar; tighten it without changing
   the layout or hiding anything */
#Action_bar{padding:4px 0 !important}
#Action_bar .contact_details li,
#Action_bar .social li{line-height:30px !important; font-size:13px}
#Top_bar{padding:0 !important; box-shadow:0 1px 0 rgba(0,0,0,.06)}
#Top_bar .container{min-height:0 !important}
#Top_bar .column{margin:0 !important}
#Top_bar #logo{
  height:auto !important; min-height:0 !important; line-height:0 !important;
  padding:10px 0 !important; margin:0 !important;
}
#Top_bar #logo img{max-height:64px !important; height:auto !important; width:auto !important}
#Top_bar .top_bar_left,
#Top_bar .top_bar_right{height:auto !important; background:none !important}
#Top_bar .menu_wrapper{margin:0 !important}
#Top_bar .menu > li > a{padding:0 !important; height:auto !important}
#Top_bar .menu > li > a > span:not(.description){
  line-height:84px !important; padding:0 13px !important; font-size:15px;
}
#Top_bar .menu > li > a span.description{display:none}
#Top_bar .secondary_menu_wrapper{display:none}
.header_placeholder{height:0 !important}
/* Google-translate button — switched off site-wide */
#glt-translate-trigger,
#glt-toolbar,
#glt-footer,
#flags,
#google_language_translator,
.goog-te-banner-frame,
.skiptranslate{display:none !important}
body{top:0 !important}
#Header_wrapper{background-position:center top}
@media(max-width:1240px){#Top_bar .menu > li > a > span:not(.description){padding:0 9px !important; font-size:14px}}
@media(max-width:768px){#Top_bar #logo img{max-height:52px !important}
  #Top_bar #logo{padding:8px 0 !important}}

/* ---------- 4. Related posts (bottom of every news post) --------------- */
#Content .section-post-related .section-related-ul{
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
}
#Content .section-post-related .section-related-ul.col-3{grid-template-columns:repeat(3,1fr)}
#Content .section-post-related .section-related-ul.col-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:1024px){#Content .section-post-related .section-related-ul,
  #Content .section-post-related .section-related-ul.col-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){#Content .section-post-related .section-related-ul,
  #Content .section-post-related .section-related-ul.col-3{grid-template-columns:1fr}}
#Content .section-post-related h4{font-size:20px; margin:0 0 20px}

#Content .post-related{
  width:auto !important; margin:0 !important; float:none !important;
  display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto auto 1fr auto;
  background:#fff; border:1px solid #ececec; border-radius:8px; overflow:hidden;
  padding:0 0 16px;
  transition:box-shadow .25s ease, transform .25s ease;
}
#Content .post-related:hover{box-shadow:0 10px 28px rgba(0,0,0,.09); transform:translateY(-2px)}
#Content .post-related .single-photo-wrapper{grid-column:1/-1; grid-row:1; margin:0 0 14px !important}
#Content .post-related .image_frame{margin:0 !important; padding:0 !important; border:0 !important}
#Content .post-related .image_wrapper{
  aspect-ratio:16/10; overflow:hidden; line-height:0; background:#f3f3f3;
}
#Content .post-related .image_wrapper > a{display:block; height:100%}
#Content .post-related .image_wrapper img{
  width:100% !important; height:100% !important; object-fit:cover; display:block;
  transition:transform .45s ease;
}
#Content .post-related:hover .image_wrapper img{transform:scale(1.05)}
#Content .post-related .date_label{
  grid-column:2; grid-row:2; align-self:start;
  position:static !important; background:none !important; box-shadow:none !important;
  color:#9a9a9a !important; font-size:12px; line-height:1.5; font-weight:400;
  padding:0 16px 0 0 !important; margin:0 !important; border:0 !important; white-space:nowrap;
}
#Content .post-related .desc{display:contents}
#Content .post-related .desc > h4{
  grid-column:1; grid-row:2; margin:0 !important; padding:0 6px 0 16px;
  font-size:16px !important; line-height:1.45 !important; font-weight:600;
}
#Content .post-related .desc > h4 a{color:#2b2b2b}
#Content .post-related .desc > h4 a:hover{color:var(--ispac-accent,#f07c1f)}
#Content .post-related .desc > hr.hr_color{
  grid-column:1/-1; grid-row:3; width:auto !important; margin:14px 16px 0 !important;
}
#Content .post-related .desc > .button{
  grid-column:1/-1; grid-row:5; justify-self:start;
  margin:14px 0 0 16px !important;
}

/* ---------- 5. Lightbox (shared by every gallery) ---------------------- */
.ig-lb{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.93);display:none;align-items:center;justify-content:center}
.ig-lb.on{display:flex}
.ig-lb img{max-width:90vw;max-height:88vh;object-fit:contain;border-radius:3px}
.ig-lb button{position:absolute;background:rgba(255,255,255,.12);color:#fff;border:0;cursor:pointer;
  width:48px;height:48px;line-height:1;font-size:30px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;transition:background .2s ease}
.ig-lb button:hover{background:rgba(255,255,255,.28)}
.ig-lb .ig-close{top:18px;right:18px;font-size:26px}
.ig-lb .ig-prev{left:18px;top:50%;transform:translateY(-50%)}
.ig-lb .ig-next{right:18px;top:50%;transform:translateY(-50%)}
.ig-lb .ig-count{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;font-size:14px;letter-spacing:1px}
@media(max-width:600px){.ig-lb button{width:38px;height:38px;font-size:22px}
  .ig-lb .ig-prev{left:6px}.ig-lb .ig-next{right:6px}}

/* ---------- thumbnail grid used by the rebuilt photo gallery ---------- */
.ispac-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:0 0 24px}
.ispac-gallery .ig-item{display:block;overflow:hidden;border-radius:6px;background:#f2f2f2;aspect-ratio:4/3;line-height:0;font-size:0;margin:0;border:1px solid #ececec}
.ispac-gallery .ig-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.ispac-gallery .ig-item:hover img{transform:scale(1.06)}
@media(max-width:600px){.ispac-gallery{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}