/*
Theme Name: Jamia Arabia Islamia Darul Hadith - Astra Child
Description: Custom coded child theme for Jamia Arabia Islamia Darul Hadith, Baympur. Built on Astra.
Author: Custom build for madrasah website
Template: astra
Version: 1.0.0
Text Domain: jaidh-child
*/

/* ==========================================================================
   DESIGN TOKENS
   Islamic classic palette: deep green, mid green, gold, cream.
   ========================================================================== */
:root{
  --jaidh-green-deep:   #123524; /* primary — deep forest/masjid green */
  --jaidh-green:        #1F6E43; /* accent — buttons, links, active states */
  --jaidh-green-soft:   #E8F0E4; /* card backgrounds */
  --jaidh-gold:         #B8912F; /* brass/gold accent — never overused */
  --jaidh-gold-light:   #E6D6A3; /* hairlines, faint borders */
  --jaidh-cream:        #FBF8F1; /* page background */
  --jaidh-ink:          #1C231D; /* body text */
  --jaidh-ink-soft:     #4B564D; /* secondary text */
  --jaidh-white:        #FFFFFF;

  --jaidh-font-arabic:  'Amiri', 'Noto Naskh Arabic', serif;
  --jaidh-font-display: 'Noto Serif Bengali', 'Amiri', serif;
  --jaidh-font-body:    'Hind Siliguri', 'Noto Sans Bengali', sans-serif;

  --jaidh-radius: 6px;
  --jaidh-shadow: 0 6px 24px rgba(18,53,36,0.08);
}

/* Manuscript lattice pattern (signature motif — subtle, gold-on-cream) */
.jaidh-pattern-bg{
  background-color: var(--jaidh-cream);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cg fill='none' stroke='%23B8912F' stroke-width='0.6' opacity='0.35'%3E%3Crect x='12' y='12' width='40' height='40'/%3E%3Crect x='12' y='12' width='40' height='40' transform='rotate(45 32 32)'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
}

/* Manuscript verse-medallion divider — the one recurring signature element */
.jaidh-divider{
  display:flex;
  align-items:center;
  gap:14px;
  margin: 0 auto 2.5rem;
  max-width: 420px;
}
.jaidh-divider::before,
.jaidh-divider::after{
  content:"";
  flex:1;
  height:1px;
  background: linear-gradient(90deg, transparent, var(--jaidh-gold), transparent);
}
.jaidh-divider__medallion{
  width:10px;height:10px;
  border:1.5px solid var(--jaidh-gold);
  transform: rotate(45deg);
  flex-shrink:0;
}

/* ==========================================================================
   BASE
   ========================================================================== */
body{
  background: var(--jaidh-cream);
  color: var(--jaidh-ink);
  font-family: var(--jaidh-font-body);
}
h1,h2,h3,h4, .site-title{
  font-family: var(--jaidh-font-display);
  color: var(--jaidh-green-deep);
}
a{ color: var(--jaidh-green); }
a:hover{ color: var(--jaidh-gold); }

.ast-container, .site-content .ast-container{ max-width: 1180px; }

/* Astra header polish */
.site-header, .main-header-bar{
  background: var(--jaidh-white) !important;
  border-bottom: 2px solid var(--jaidh-gold-light) !important;
}
.main-header-menu .menu-item > .menu-link{
  color: var(--jaidh-green-deep) !important;
  font-weight: 600;
  letter-spacing: .01em;
}
.main-header-menu .menu-item > .menu-link:hover{ color: var(--jaidh-gold) !important; }

/* Buttons — used site-wide (Astra buttons + our own) */
.jaidh-btn, .ast-button, button, input[type="submit"]{
  display:inline-block;
  font-family: var(--jaidh-font-body);
  font-weight: 600;
  border-radius: var(--jaidh-radius);
  padding: .85rem 1.9rem;
  transition: transform .15s ease, box-shadow .15s ease;
}
.jaidh-btn--primary{
  background: var(--jaidh-green-deep);
  color: var(--jaidh-white) !important;
  border: 1px solid var(--jaidh-green-deep);
}
.jaidh-btn--primary:hover{ background: var(--jaidh-green); transform: translateY(-1px); }
.jaidh-btn--gold{
  background: transparent;
  color: var(--jaidh-green-deep) !important;
  border: 1.5px solid var(--jaidh-gold);
}
.jaidh-btn--gold:hover{ background: var(--jaidh-gold); color: var(--jaidh-white) !important; }

/* Focus visibility (accessibility floor) */
a:focus-visible, button:focus-visible, .jaidh-btn:focus-visible{
  outline: 3px solid var(--jaidh-gold);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; }
}

/* ==========================================================================
   HERO — the manuscript opening page
   ========================================================================== */
.jaidh-hero{
  position: relative;
  padding: 5rem 1.5rem 4rem;
  text-align: center;
  overflow:hidden;
}
.jaidh-hero__banner{
  max-width: 100%;
  width: 640px;
  height: auto;
  border-radius: var(--jaidh-radius);
  box-shadow: var(--jaidh-shadow);
  margin: 0 auto 1.8rem;
  display:block;
}
.jaidh-hero__logo{
  width: 92px; height: 92px;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid var(--jaidh-gold);
  box-shadow: var(--jaidh-shadow);
  margin: 0 auto 1.4rem;
  display:block;
}
.jaidh-hero__ayat{
  font-family: var(--jaidh-font-arabic);
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  color: var(--jaidh-green-deep);
  direction: rtl;
  line-height: 1.9;
  margin-bottom: .6rem;
}
.jaidh-hero__translation{
  font-style: italic;
  color: var(--jaidh-ink-soft);
  font-size: 1rem;
  margin-bottom: .2rem;
}
.jaidh-hero__ref{
  font-size: .85rem;
  color: var(--jaidh-gold);
  letter-spacing: .05em;
  margin-bottom: 2.2rem;
  display:block;
}
.jaidh-hero__title{
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  margin: 0 0 .6rem;
  line-height: 1.3;
}
.jaidh-hero__tagline{
  color: var(--jaidh-ink-soft);
  font-size: 1.05rem;
  max-width: 640px;
  margin: 0 auto 2rem;
}
.jaidh-hero__cta{ display:flex; gap: 1rem; justify-content:center; flex-wrap:wrap; }

/* ==========================================================================
   SECTION SHELL
   ========================================================================== */
.jaidh-section{ padding: 4.5rem 1.5rem; }
.jaidh-section--alt{ background: var(--jaidh-green-soft); }
.jaidh-section__eyebrow{
  display:block;
  text-align:center;
  color: var(--jaidh-gold);
  font-weight:600;
  letter-spacing:.08em;
  margin-bottom: .5rem;
  font-size: .85rem;
}
.jaidh-section__title{
  text-align:center;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  margin: 0 0 2.5rem;
}
.jaidh-wrap{ max-width: 1100px; margin: 0 auto; }

/* About */
.jaidh-about p{
  max-width: 760px; margin: 0 auto 1.2rem;
  text-align:center; font-size: 1.05rem; line-height: 1.9;
  color: var(--jaidh-ink-soft);
}

/* Departments grid */
.jaidh-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1.5rem;
}
.jaidh-card{
  background: var(--jaidh-white);
  border: 1px solid var(--jaidh-gold-light);
  border-radius: var(--jaidh-radius);
  padding: 1.8rem 1.5rem;
  text-align:center;
  box-shadow: var(--jaidh-shadow);
}
.jaidh-card__icon{ font-size: 2rem; display:block; margin-bottom:.7rem; }
.jaidh-card__title{
  font-family: var(--jaidh-font-display);
  color: var(--jaidh-green-deep);
  font-size: 1.15rem;
  margin: 0;
}

/* Features checklist */
.jaidh-features{
  list-style:none; margin:0 auto; padding:0;
  max-width: 760px;
  display:grid; grid-template-columns: 1fr 1fr; gap: .9rem 2rem;
}
.jaidh-features li{
  display:flex; align-items:flex-start; gap:.6rem;
  color: var(--jaidh-ink); font-size: 1rem;
}
.jaidh-features li::before{
  content:"✓";
  color: var(--jaidh-white);
  background: var(--jaidh-green);
  width:20px; height:20px; border-radius:50%;
  flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:.7rem; margin-top:.15rem;
}

/* Gallery */
.jaidh-gallery__img{
  width:100%; height: 240px;
  object-fit: cover;
  border-radius: var(--jaidh-radius);
  border: 1px solid var(--jaidh-gold-light);
  box-shadow: var(--jaidh-shadow);
  display:block;
}

/* Faculty */
.jaidh-faculty-group{ margin-bottom: 2.5rem; text-align:center; }
.jaidh-faculty-photo{
  width: 84px; height: 84px;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid var(--jaidh-gold);
  margin: 0 auto .8rem;
  display:block;
}
.jaidh-faculty-group-photo{
  width: 100%;
  max-width: 560px;
  height: auto;
  border-radius: var(--jaidh-radius);
  border: 1px solid var(--jaidh-gold-light);
  box-shadow: var(--jaidh-shadow);
  margin: 0 auto 1.2rem;
  display:block;
}
.jaidh-faculty-group__label{
  text-align:center; font-weight:600; color: var(--jaidh-green-deep);
  margin-bottom: 1rem; font-size: 1rem;
}
.jaidh-faculty-list{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem;
  list-style:none; padding:0; margin:0;
}
.jaidh-faculty-list li{
  background: var(--jaidh-white);
  border:1px solid var(--jaidh-gold-light);
  border-radius: 999px;
  padding: .5rem 1.1rem;
  font-size: .92rem;
}
.jaidh-faculty-list li strong{ color: var(--jaidh-green-deep); }

/* Admission CTA banner */
.jaidh-cta-banner{
  background: var(--jaidh-green-deep);
  color: var(--jaidh-white);
  text-align:center;
  padding: 4rem 1.5rem;
  border-radius: var(--jaidh-radius);
  max-width: 1100px;
  margin: 0 auto;
}
.jaidh-cta-banner h2{ color: var(--jaidh-white); margin-bottom:.8rem; }
.jaidh-cta-banner p{ color: #D9E4D4; max-width:600px; margin:0 auto 1.8rem; }

/* Contact */
.jaidh-contact{
  display:grid; gap: 1.2rem;
  grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  max-width: 900px; margin: 0 auto;
  text-align:center;
}
.jaidh-contact__item{ padding: 1rem; }
.jaidh-contact__label{
  display:block; color: var(--jaidh-gold); font-size:.8rem;
  letter-spacing:.06em; margin-bottom:.3rem;
}
.jaidh-contact__value{ font-size: 1.05rem; color: var(--jaidh-green-deep); font-weight:600; }

/* Footer strip with pattern */
.jaidh-footer-strip{ height: 6px; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.jaidh-site-footer{
  background: var(--jaidh-green-deep);
  color: #D9E4D4;
  padding-top: 6px; /* pattern strip sits above via background */
}
.jaidh-footer-main{
  display:grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 2.5rem;
  padding: 3rem 1.5rem 2rem;
}
.jaidh-footer-logo{
  width:56px;height:56px;border-radius:50%;
  object-fit:cover; margin-bottom:.8rem;
}
.jaidh-footer-title{
  color: var(--jaidh-white);
  font-size: 1.1rem;
  margin: 0 0 .5rem;
}
.jaidh-footer-heading{
  color: var(--jaidh-gold);
  font-size: .95rem;
  letter-spacing:.04em;
  margin: 0 0 1rem;
}
.jaidh-footer-text{ color:#C7D6C2; margin: 0 0 .5rem; font-size:.95rem; }
.jaidh-footer-links{ list-style:none; margin:0; padding:0; }
.jaidh-footer-links li{ margin-bottom:.6rem; }
.jaidh-footer-links a, .jaidh-footer-text a{ color:#C7D6C2; }
.jaidh-footer-links a:hover, .jaidh-footer-text a:hover{ color: var(--jaidh-gold); }
.jaidh-footer-bottom{
  border-top: 1px solid rgba(255,255,255,0.12);
  text-align:center;
  padding: 1.2rem 1.5rem;
  font-size: .85rem;
  color: #A9BFA4;
}
@media (max-width: 720px){
  .jaidh-footer-main{ grid-template-columns: 1fr; text-align:center; gap: 2rem; }
  .jaidh-footer-logo{ margin-left:auto; margin-right:auto; }
}

/* Mobile menu drawer (Astra) — match brand colors */
.ast-mobile-popup-drawer,
.ast-mobile-popup-drawer .main-header-menu{
  background: var(--jaidh-cream) !important;
}
.ast-mobile-popup-drawer .menu-link{
  color: var(--jaidh-green-deep) !important;
  border-bottom: 1px solid var(--jaidh-gold-light);
}
.ast-mobile-popup-drawer .menu-link:hover{ color: var(--jaidh-gold) !important; }
button.menu-toggle, .ast-mobile-menu-buttons-minimal .astra-menu-toggle-icon{
  color: var(--jaidh-green-deep);
}

@media (max-width: 640px){
  .jaidh-hero{ padding: 1.8rem 0 2rem; }
  .jaidh-hero__banner{
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    margin-bottom: 1.2rem;
  }
  .jaidh-hero__ayat{ margin-bottom: .3rem; font-size: 1.5rem; padding: 0 1rem; }
  .jaidh-hero__translation{ margin-bottom: .1rem; padding: 0 1rem; }
  .jaidh-hero__ref{ margin-bottom: 1.4rem; }
  .jaidh-hero__tagline{ padding: 0 1rem; }
  .jaidh-hero__cta{ padding: 0 1rem; }
  .jaidh-features{ grid-template-columns: 1fr; }
  .jaidh-section{ padding: 3rem 1.2rem; }
}