/* =========================================================
   BESOURIA V41 — Primary Hero Standard
   Shared compact sizing for Opportunities, Welcome to Syria,
   and Business Directory. Page content and identity stay unique.
   ========================================================= */
:root{
  --primary-hero-height:420px;
  --primary-hero-title:clamp(34px,3.65vw,46px);
  --primary-hero-copy:15.5px;
  --primary-hero-visual-height:320px;
  --primary-hero-gap:36px;
  --primary-hero-button-height:46px;
  --primary-hero-radius:22px;
}

/* Shared typography */
.hero.pro-hero .hero-copy h1,
.directory-hero h1,
.ws-hero h1{
  max-width:650px;
  font-size:var(--primary-hero-title)!important;
  line-height:1.1!important;
  letter-spacing:-1.1px!important;
  margin-top:9px!important;
  margin-bottom:14px!important;
}
.hero.pro-hero .hero-copy>p,
.directory-hero p,
.ws-hero-copy>p{
  max-width:650px;
  font-size:var(--primary-hero-copy)!important;
  line-height:1.72!important;
}
.hero.pro-hero .trust-pill,
.directory-hero .section-kicker,
.ws-hero .ws-eyebrow{
  font-size:12px;
}

/* Shared buttons */
.hero.pro-hero .hero-actions .btn,
.hero.pro-hero .hero-search .btn,
.directory-hero .directory-hero-actions .btn,
.directory-hero .directory-hero-search .btn,
.ws-hero .ws-actions .btn{
  min-height:var(--primary-hero-button-height);
  padding-top:10px;
  padding-bottom:10px;
  border-radius:11px;
}

/* Opportunities */
.hero.pro-hero{
  min-height:var(--primary-hero-height)!important;
  padding:38px 0 36px!important;
}
.hero.pro-hero .hero-grid.pro-grid{
  grid-template-columns:minmax(0,1fr) minmax(300px,430px)!important;
  gap:var(--primary-hero-gap)!important;
}
.hero.pro-hero .hero-business-image{
  max-width:430px!important;
  height:var(--primary-hero-visual-height)!important;
}
.hero.pro-hero .hero-search{margin-top:17px!important}
.hero.pro-hero .hero-actions{margin-top:13px!important}

/* Welcome to Syria */
.ws-hero{
  min-height:var(--primary-hero-height)!important;
  padding:38px 0 36px!important;
}
.ws-hero-grid{
  grid-template-columns:minmax(0,1fr) minmax(300px,430px)!important;
  gap:var(--primary-hero-gap)!important;
}
.ws-hero-visual{
  max-width:430px!important;
  height:var(--primary-hero-visual-height)!important;
}
.ws-hero-visual:before{border-radius:24px!important}
.ws-hero-visual img{border-radius:22px!important}
.ws-actions{margin:17px 0 13px!important}
.ws-floating-card{
  width:190px!important;
  padding:13px 15px!important;
  inset-block-end:15px!important;
}
.ws-floating-card strong{font-size:13px!important}
.ws-floating-card span{font-size:11px!important}

/* Business Directory */
.directory-hero{
  min-height:var(--primary-hero-height)!important;
  padding:34px 0!important;
}
.directory-hero-panel{
  min-height:344px!important;
  grid-template-columns:minmax(0,1fr) minmax(300px,430px)!important;
  gap:var(--primary-hero-gap)!important;
  padding:24px 28px!important;
  border-radius:var(--primary-hero-radius)!important;
}
.directory-hero-overview{
  max-width:430px;
  width:100%;
  height:var(--primary-hero-visual-height)!important;
  justify-self:center;
}
.directory-hero-search{margin-top:17px!important}
.directory-hero-actions{margin-top:12px!important}
.directory-hero-metrics>div{padding:9px 5px 8px!important}
.directory-hero-metrics strong{font-size:20px!important}
.directory-hero-metrics span{font-size:11px!important}

@media(max-width:980px){
  .hero.pro-hero,
  .ws-hero,
  .directory-hero{min-height:0!important}
  .hero.pro-hero .hero-grid.pro-grid,
  .ws-hero-grid,
  .directory-hero-panel{
    grid-template-columns:1fr!important;
    gap:26px!important;
  }
  .hero.pro-hero .hero-business-image,
  .ws-hero-visual,
  .directory-hero-overview{
    max-width:540px!important;
  }
}

@media(max-width:680px){
  :root{
    --primary-hero-title:32px;
    --primary-hero-copy:14.5px;
    --primary-hero-visual-height:245px;
    --primary-hero-gap:22px;
    --primary-hero-button-height:44px;
  }
  .hero.pro-hero,
  .ws-hero,
  .directory-hero{padding:28px 0!important}
  .hero.pro-hero .hero-copy h1,
  .directory-hero h1,
  .ws-hero h1{
    letter-spacing:-.6px!important;
    margin-bottom:12px!important;
  }
  .directory-hero-panel{padding:18px!important;border-radius:18px!important}
  .ws-floating-card{
    width:calc(100% - 30px)!important;
    padding:12px 14px!important;
  }
}

/* =========================================================
   BESOURIA V42 — Unified typography hierarchy
   The three primary pages now share one exact heading scale.
   ========================================================= */
:root{
  --primary-page-h1:42px;
  --primary-page-h2:31px;
  --primary-page-h3:19px;
  --primary-page-kicker:12px;
  --primary-page-description:15px;
  --primary-page-h1-line:1.16;
  --primary-page-h2-line:1.28;
  --primary-page-h3-line:1.42;
}

/* H1 — exact same main-page title size */
.hero.pro-hero .hero-copy h1,
.directory-hero .directory-hero-copy h1,
.ws-hero .ws-hero-copy h1{
  font-size:var(--primary-page-h1)!important;
  line-height:var(--primary-page-h1-line)!important;
  letter-spacing:-.75px!important;
  font-weight:800!important;
}

/* H2 — exact same chapter heading size on all three pages */
.hero.pro-hero ~ .section .section-heading h2,
.hero.pro-hero ~ .section .how-copy h2,
.directory-hero ~ .section .section-heading h2,
.welcome-syria-page .ws-heading h2,
.welcome-syria-page .ws-invest h2,
.welcome-syria-page .ws-final h2{
  font-size:var(--primary-page-h2)!important;
  line-height:var(--primary-page-h2-line)!important;
  letter-spacing:-.35px!important;
  font-weight:800!important;
  margin-top:0!important;
}

/* H3 — exact same card/content heading size */
.hero.pro-hero ~ .section h3,
.directory-hero ~ .section h3,
.welcome-syria-page .ws-section h3{
  font-size:var(--primary-page-h3)!important;
  line-height:var(--primary-page-h3-line)!important;
  font-weight:750!important;
}

/* Eyebrows / kickers */
.hero.pro-hero .trust-pill,
.hero.pro-hero ~ .section .section-kicker,
.directory-hero .section-kicker,
.directory-hero ~ .section .section-kicker,
.welcome-syria-page .ws-eyebrow,
.welcome-syria-page .ws-heading>span,
.welcome-syria-page .ws-heading>div>span{
  font-size:var(--primary-page-kicker)!important;
  line-height:1.45!important;
  letter-spacing:.04em!important;
}

/* Main descriptions and section introductions */
.hero.pro-hero .hero-copy>p,
.directory-hero .directory-hero-copy>p,
.ws-hero .ws-hero-copy>p,
.hero.pro-hero ~ .section .section-heading>p,
.directory-hero ~ .section .section-heading>p,
.welcome-syria-page .ws-heading>p,
.welcome-syria-page .ws-invest p{
  font-size:var(--primary-page-description)!important;
  line-height:1.75!important;
}

/* Stable spacing after headings */
.hero.pro-hero ~ .section .section-heading,
.directory-hero ~ .section .section-heading,
.welcome-syria-page .ws-heading{
  margin-bottom:30px!important;
}

@media(max-width:680px){
  :root{
    --primary-page-h1:31px;
    --primary-page-h2:25px;
    --primary-page-h3:17px;
    --primary-page-kicker:11px;
    --primary-page-description:14px;
  }
  .hero.pro-hero .hero-copy h1,
  .directory-hero .directory-hero-copy h1,
  .ws-hero .ws-hero-copy h1{
    letter-spacing:-.35px!important;
  }
  .hero.pro-hero ~ .section .section-heading,
  .directory-hero ~ .section .section-heading,
  .welcome-syria-page .ws-heading{
    margin-bottom:24px!important;
  }
}

/* =========================================================
   BESOURIA V43 — Global footer-page hero heading standard
   Matches the homepage hero heading scale on every public page
   linked from the footer.
   ========================================================= */
:root{
  --site-hero-h1-size:42px;
  --site-hero-h1-mobile:31px;
  --site-hero-h1-line-height:1.16;
  --site-hero-h1-spacing:12px 0 16px;
}

/* Public hero/page-heading titles reached from footer navigation */
.ws-hero h1,
.directory-hero h1,
.ai-page-heading h1,
.compass-hero h1,
.about-vision-hero h1,
.blog-hero h1,
.contact-hub-hero h1,
.preserve-hero h1,
.volunteer-apply-hero h1,
.terms-hero h1,
.policy-hero h1,
.payment-hero h1,
.participate-hero h1,
.opportunity-form-intro h1,
.business-form-intro h1,
.page-hero h1,
.info-hero h1{
  font-size:var(--site-hero-h1-size)!important;
  line-height:var(--site-hero-h1-line-height)!important;
  letter-spacing:-1px!important;
  margin:var(--site-hero-h1-spacing)!important;
  font-weight:600!important;
}

@media(max-width:700px){
  .ws-hero h1,
  .directory-hero h1,
  .ai-page-heading h1,
  .compass-hero h1,
  .about-vision-hero h1,
  .blog-hero h1,
  .contact-hub-hero h1,
  .preserve-hero h1,
  .volunteer-apply-hero h1,
  .terms-hero h1,
  .policy-hero h1,
  .payment-hero h1,
  .participate-hero h1,
  .opportunity-form-intro h1,
  .business-form-intro h1,
  .page-hero h1,
  .info-hero h1{
    font-size:var(--site-hero-h1-mobile)!important;
    line-height:1.2!important;
    letter-spacing:-.5px!important;
  }
}

/* =========================================================
   BESOURIA V44 — Global public heading hierarchy
   H1 is always the largest title. Section subtitles can no
   longer become larger than the page hero title.
   ========================================================= */
:root{
  --public-h1-size:42px;
  --public-h2-size:29px;
  --public-h3-size:19px;
  --public-h1-mobile:31px;
  --public-h2-mobile:23px;
  --public-h3-mobile:17px;
}

/* Keep every public hero title at the same maximum scale. */
.hero h1,
[class*="hero"] h1,
.page-heading h1,
.ai-page-heading h1,
.opportunity-form-intro h1,
.business-form-intro h1{
  font-size:var(--public-h1-size)!important;
  line-height:1.16!important;
}

/* Global section/chapter subtitles — always visibly smaller than H1. */
.section h2,
.section-heading h2,
.about-section-head h2,
.about-global h2,
.about-cta-card h2,
.ws-heading h2,
.ws-invest h2,
.ws-final h2,
.directory-section h2,
.ai-page-heading h2,
.page-heading h2,
.content-heading h2,
.policy-section h2,
.legal-section h2,
.contact-section h2,
.blog-section h2,
.preserve-section h2,
.participate-section h2{
  font-size:var(--public-h2-size)!important;
  line-height:1.3!important;
  letter-spacing:-.25px!important;
  font-weight:750!important;
}

/* Third-level headings and card titles. */
.section h3,
.about-pillar-grid h3,
.about-roadmap h3,
.about-principles h3,
.ws-section h3,
.directory-section h3,
.card h3,
article h3{
  font-size:var(--public-h3-size)!important;
  line-height:1.42!important;
}

/* Small labels above headings must remain small. */
.section-kicker,
.ws-eyebrow,
.eyebrow,
.kicker,
[class*="hero"] > * .section-kicker{
  font-size:12px!important;
  line-height:1.45!important;
}

@media(max-width:700px){
  .hero h1,
  [class*="hero"] h1,
  .page-heading h1,
  .ai-page-heading h1,
  .opportunity-form-intro h1,
  .business-form-intro h1{
    font-size:var(--public-h1-mobile)!important;
    line-height:1.2!important;
  }

  .section h2,
  .section-heading h2,
  .about-section-head h2,
  .about-global h2,
  .about-cta-card h2,
  .ws-heading h2,
  .ws-invest h2,
  .ws-final h2,
  .directory-section h2,
  .ai-page-heading h2,
  .page-heading h2,
  .content-heading h2,
  .policy-section h2,
  .legal-section h2,
  .contact-section h2,
  .blog-section h2,
  .preserve-section h2,
  .participate-section h2{
    font-size:var(--public-h2-mobile)!important;
    line-height:1.32!important;
  }

  .section h3,
  .about-pillar-grid h3,
  .about-roadmap h3,
  .about-principles h3,
  .ws-section h3,
  .directory-section h3,
  .card h3,
  article h3{
    font-size:var(--public-h3-mobile)!important;
  }
}
