/* The Global Quran Academy — V5.3 institutional brand refinement */
.brand-hero{padding:78px 0 74px}
.brand-hero .hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);gap:82px;align-items:center}
.brand-hero .hero-copy{max-width:690px}
.brand-hero h1{font-size:clamp(3rem,4.8vw,4.65rem);line-height:1.035;margin-bottom:24px;max-width:760px}
.brand-hero h1 span{color:var(--brand-green)}
.brand-hero .lead{font-size:1.08rem;line-height:1.78;max-width:650px}
.hero-trustline{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:26px;color:#496258;font-size:.78rem;font-weight:750}
.hero-trustline span{display:inline-flex;align-items:center;gap:8px}
.hero-trustline .icon{width:18px;height:18px;color:var(--brand-green)}
.academy-overview{min-height:0;position:relative}
.overview-card{background:#fff;border:1px solid #d9e5df;border-radius:30px;box-shadow:0 28px 78px rgba(7,55,44,.13);overflow:hidden;position:relative}
.overview-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 0,rgba(201,154,61,.11),transparent 30%);pointer-events:none}
.overview-brand{position:relative;display:flex;align-items:center;gap:15px;padding:22px 24px;border-bottom:1px solid #e5ece8;background:rgba(255,255,255,.9)}
.overview-mark{width:54px;height:54px;display:grid;place-items:center;flex:0 0 auto}
.overview-mark .brand-mark{width:54px;height:54px}
.overview-brand span:last-child{display:grid;gap:4px}
.overview-brand small{font-size:.62rem;text-transform:uppercase;letter-spacing:.13em;color:#76867f;font-weight:850}
.overview-brand strong{font-family:"Sora","Manrope",sans-serif;font-size:.96rem;color:var(--brand-green-deep)}
.overview-main{position:relative;padding:36px 34px 30px;background:linear-gradient(145deg,#f7fbf9,#fffdf8)}
.overview-main .mini-label{display:inline-block;color:#76571f;font-size:.63rem;text-transform:uppercase;letter-spacing:.14em;font-weight:900;margin-bottom:12px}
.overview-main h2{font-size:clamp(1.7rem,2.4vw,2.35rem);line-height:1.12;margin-bottom:14px;max-width:520px}
.overview-main>p{font-size:.91rem;line-height:1.75;max-width:520px;margin-bottom:26px}
.overview-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid #dfe8e4;border-radius:16px;overflow:hidden;background:#fff}
.overview-steps>div{position:relative;background:#fff;padding:17px 16px;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;border-right:1px solid #e4ebe7}
.overview-steps>div:last-child{border-right:0}
.overview-steps>div:not(:last-child):after{content:"→";position:absolute;right:-9px;top:50%;transform:translateY(-50%);z-index:2;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#9a7738;font-size:.68rem;font-weight:900;border:1px solid #e4ebe7}
.overview-steps b{font-size:.62rem;color:#76571f;letter-spacing:.08em;padding-top:2px}
.overview-steps span{display:grid;gap:3px}
.overview-steps strong{font-size:.78rem;color:#1e3b31}
.overview-steps small{font-size:.65rem;line-height:1.45;color:#7a8a83}
.overview-footer{position:relative;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e4ebe7;background:#fff}
.overview-footer a{min-height:64px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:.67rem;font-weight:800;color:#516960;border-right:1px solid #e4ebe7;text-align:center;padding:8px;transition:background-color .18s ease,color .18s ease}
.overview-footer a:last-child{border-right:0}
.overview-footer a:hover{background:#f3f8f5;color:var(--brand-green-deep)}
.overview-footer a:focus-visible{outline:3px solid rgba(201,154,61,.55);outline-offset:-4px}
.overview-footer .icon{width:16px;height:16px;color:var(--brand-green)}
.brand-strip-grid>div{padding-top:29px;padding-bottom:29px}
.courses-section{padding-top:92px}
.why-section,.standard-section,.faq-home{border-top:1px solid rgba(220,231,226,.5)}
.page-hero h1{max-width:860px}
.page-hero .lead{max-width:780px}
.form-info,.course-side-card,.sticky-card,.values-card{box-shadow:0 18px 48px rgba(7,55,44,.07)}
.contact-cards article{transition:.2s ease}
.contact-cards article:hover{transform:translateY(-2px);border-color:#c6d9d0}
.footer-brand .brand-lockup{grid-template-columns:72px 1fr}
.footer-brand .brand-logo,.footer-brand .brand-logo .brand-mark{width:68px;height:68px}
@media(max-width:1050px){
  .brand-hero .hero-grid{grid-template-columns:1fr;gap:48px}
  .brand-hero .hero-copy{max-width:760px}
  .academy-overview{max-width:720px}
}
@media(max-width:700px){
  .brand-hero{padding:58px 0 62px}
  .brand-hero h1{font-size:clamp(2.45rem,11vw,3.35rem)}
  .hero-trustline{display:grid;gap:10px}
  .overview-main{padding:27px 22px 24px}
  .overview-steps{grid-template-columns:1fr;border-radius:14px}
  .overview-steps>div{border-right:0;border-bottom:1px solid #e4ebe7}
  .overview-steps>div:last-child{border-bottom:0}
  .overview-steps>div:not(:last-child):after{content:"↓";right:18px;top:auto;bottom:-10px;transform:none}
  .overview-footer{grid-template-columns:1fr 1fr}
  .overview-footer a:nth-child(2){border-right:0}
  .overview-footer a:nth-child(-n+2){border-bottom:1px solid #e4ebe7}
}

/* Final dark-card contrast lock */
.why-section .learning-board h3,
.why-section .learning-board h3 *,
.learning-board h3,
.learning-board h3 *{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}

/* ===== V5.4 FINAL FINISH ===== */
html{scroll-padding-top:118px}
::selection{background:#dcefe7;color:#062e27}
a,button,.btn,input,select,textarea,summary{outline-offset:3px}
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:3px solid rgba(201,154,61,.55);
  outline-offset:3px;
}
.site-header{transition:box-shadow .2s ease,background-color .2s ease}
.site-header:hover{box-shadow:0 10px 30px rgba(7,55,44,.045)}
.primary-nav a:after{transition:transform .2s ease,opacity .2s ease}
.primary-nav a:hover:after{content:"";position:absolute;height:2px;background:var(--brand-gold);left:0;right:0;bottom:-10px;transform:scaleX(.55);opacity:.75}
.brand-lockup{transition:opacity .2s ease}
.brand-lockup:hover{opacity:.92}
.brand-name{font-weight:750!important}
.btn{letter-spacing:-.01em}
.btn-primary,.btn-gold{transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}
.btn-primary:hover,.btn-gold:hover{transform:translateY(-2px)}
.course-card,.resource-card,.standard-cards>div,.principles-grid article,.contact-cards article{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.resource-card:hover,.standard-cards>div:hover,.principles-grid article:hover,.contact-cards article:hover{
  transform:translateY(-3px);
  border-color:#c7dacf;
  box-shadow:0 18px 44px rgba(7,55,44,.075);
}
.section-head .eyebrow,.page-hero .eyebrow,.hero-copy .eyebrow{margin-bottom:16px}
.section-head h2,.why-copy h2,.standard-grid h2,.faq-layout h2{margin-bottom:18px}
.page-hero{border-bottom:1px solid rgba(220,231,226,.72)}
.page-hero .breadcrumbs{opacity:.92}
.form-card,.form-info{border:1px solid rgba(220,231,226,.75)}
.field input::placeholder,.field textarea::placeholder{color:#84928c;opacity:1}
.field input,.field select,.field textarea{transition:border-color .2s ease,box-shadow .2s ease}
.field input:focus,.field select:focus,.field textarea:focus{
  box-shadow:0 0 0 4px rgba(12,92,73,.08);
}
.faq-list summary{transition:color .18s ease}
.faq-list summary:hover{color:var(--brand-green)}
.faq-list details[open] summary{color:var(--brand-green-deep)}
.cta-card,.admissions-panel,.learning-board{isolation:isolate}
.site-footer{border-top:1px solid rgba(255,255,255,.05)}
.site-footer .footer-title{color:#f1d08a}
.site-footer .footer-links a{color:#c9dad4}
.site-footer .footer-links a:hover{color:#ffffff}
.site-footer .footer-brand p{color:#bfd1ca}
.site-footer .footer-trust span{color:#c8d9d2}
.footer-bottom{color:#b9cbc4}
.whatsapp-float{transition:transform .2s ease,box-shadow .2s ease}
.whatsapp-float:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 20px 38px rgba(5,60,44,.3)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
@media(max-width:700px){
  html{scroll-padding-top:90px}
  .brand-copy{min-width:0}
  .brand-name{white-space:normal;line-height:1.08}
  .brand-sub{white-space:normal;line-height:1.35}
  .page-hero .lead{font-size:1rem}
  .section-head h2,.why-copy h2,.standard-grid h2,.faq-layout h2{font-size:clamp(2rem,9vw,2.75rem)}
}
