/* =====================================================================
   SaraikiCulture - Header + Hero redesign (matches demo/screenshot)
   Namespaced with .sc- to avoid clashing with existing theme/Bootstrap.
   ===================================================================== */
:root{
  --sc-cream:#FAF6F0; --sc-cream-2:#F3ECE1;
  --sc-terracotta:#B65A38; --sc-terracotta-dark:#8f4429;
  --sc-olive:#4E6E58; --sc-gold:#D8B37A; --sc-gold-soft:#e7cfa4;
  --sc-ink:#2c2620; --sc-ink-soft:#5c534a;
  --sc-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Header ---------- */
.sc-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(250,246,240,.9); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(216,179,122,.35);
  font-family:'Poppins',sans-serif;
  transition:box-shadow .3s var(--sc-ease), background .3s var(--sc-ease);
}
.sc-header.scrolled{ box-shadow:0 4px 14px rgba(44,38,32,.08); background:rgba(250,246,240,.97); }
.sc-nav{ max-width:1280px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; height:74px; }
.sc-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.sc-brand .sc-mark{ width:44px; height:44px; border-radius:12px; flex:none; background:linear-gradient(135deg,var(--sc-terracotta),var(--sc-gold)); display:grid; place-items:center; color:#fff; font-size:20px; box-shadow:0 4px 14px rgba(44,38,32,.12); }
.sc-brand .sc-txt{ display:flex; flex-direction:column; line-height:1.05; }
.sc-brand .sc-txt b{ font-size:19px; letter-spacing:.02em; color:var(--sc-ink); font-weight:800; }
.sc-brand .sc-txt span{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--sc-terracotta); font-weight:600; }

.sc-menu{ display:flex; align-items:center; gap:0; list-style:none; margin:0; padding:0; }
.sc-menu a{ padding:6px 8px; font-size:13px; font-weight:500; color:var(--sc-ink-soft); border-radius:10px; transition:all .2s var(--sc-ease); display:block; text-decoration:none; white-space:nowrap; }
.sc-menu a:hover, .sc-menu a.active{ color:var(--sc-terracotta); background:var(--sc-cream-2); }

.sc-actions{ display:flex; align-items:center; gap:10px; }
.sc-icon-btn{ width:44px; height:44px; border-radius:12px; border:1px solid rgba(216,179,122,.5); background:#fff; color:var(--sc-ink); display:grid; place-items:center; cursor:pointer; transition:all .2s var(--sc-ease); font-size:16px; text-decoration:none; }
.sc-icon-btn:hover{ background:var(--sc-terracotta); color:#fff; border-color:var(--sc-terracotta); }
.sc-lang-btn{ display:inline-flex; align-items:center; gap:7px; height:44px; padding:0 15px; border-radius:12px; border:1px solid rgba(216,179,122,.5); background:#fff; color:var(--sc-ink); font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; transition:all .2s var(--sc-ease); }
.sc-lang-btn:hover{ background:var(--sc-olive); color:#fff; border-color:var(--sc-olive); }
.sc-lang-btn .sc-lang-globe{ font-size:15px; }
.sc-lang-btn .sc-lang-label{ min-width:52px; text-align:center; }
.sc-subscribe{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-family:inherit; font-weight:600; font-size:15px; border:none; padding:12px 22px; border-radius:999px; background:var(--sc-terracotta); color:#fff; box-shadow:0 8px 20px rgba(182,90,56,.32); transition:all .25s var(--sc-ease); text-decoration:none; white-space:nowrap; }
.sc-subscribe:hover{ background:var(--sc-terracotta-dark); transform:translateY(-2px); box-shadow:0 12px 26px rgba(182,90,56,.42); }
.sc-hamburger{ display:none; }

/* ---------- Mobile menu ---------- */
.sc-mobile-menu{ position:fixed; inset:0; z-index:2000; background:var(--sc-cream); padding:92px 26px 30px; transform:translateX(100%); transition:transform .35s var(--sc-ease); display:flex; flex-direction:column; gap:4px; overflow-y:auto; }
.sc-mobile-menu.open{ transform:translateX(0); }
.sc-mobile-menu a{ padding:14px 16px; font-size:18px; font-weight:500; border-radius:12px; color:var(--sc-ink); text-decoration:none; }
.sc-mobile-menu a:hover{ background:var(--sc-cream-2); color:var(--sc-terracotta); }
.sc-mobile-close{ position:absolute; top:22px; right:22px; }

/* ---------- Hero ---------- */
.sc-hero{ position:relative; min-height:92vh; display:flex; align-items:center; color:#fff; overflow:hidden; font-family:'Poppins',sans-serif; }
.sc-hero-bg{ position:absolute; inset:0; z-index:0; }
.sc-hero-bg img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06); animation:sc-kenburns 22s ease-in-out infinite alternate; }
@keyframes sc-kenburns{ to{ transform:scale(1.16) translate(-1.5%,-1%); } }
.sc-hero-bg::after{ content:''; position:absolute; inset:0; background:linear-gradient(105deg,rgba(44,30,20,.82) 0%,rgba(80,40,20,.55) 45%,rgba(78,110,88,.35) 100%); }
.sc-hero .sc-container{ position:relative; z-index:2; max-width:1280px; margin:0 auto; padding:0 24px; width:100%; }
.sc-hero-content{ max-width:720px; }
.sc-badge{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); padding:7px 16px; border-radius:999px; font-size:13px; font-weight:500; letter-spacing:.03em; margin-bottom:22px; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.sc-hero h1{ font-family:'Playfair Display',serif; font-size:clamp(38px,6vw,68px); font-weight:600; line-height:1.1; margin:0 0 8px; color:#fff; letter-spacing:-.01em; }
.sc-hero .sc-urdu-title{ font-family:'Noto Nastaliq Urdu',serif; font-size:clamp(24px,3.5vw,40px); color:var(--sc-gold-soft); margin:6px 0 20px; direction:rtl; line-height:2; }
.sc-hero .sc-lede{ font-size:clamp(16px,2vw,20px); color:rgba(255,255,255,.9); max-width:560px; margin:0 0 34px; line-height:1.6; }
.sc-hero-cta{ display:flex; flex-wrap:wrap; gap:14px; }
.sc-btn{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-family:inherit; font-weight:600; font-size:15px; border:none; padding:13px 26px; border-radius:999px; transition:all .25s var(--sc-ease); text-decoration:none; }
.sc-btn-primary{ background:var(--sc-terracotta); color:#fff; box-shadow:0 8px 20px rgba(182,90,56,.32); }
.sc-btn-primary:hover{ background:var(--sc-terracotta-dark); transform:translateY(-2px); box-shadow:0 12px 26px rgba(182,90,56,.42); }
.sc-btn-ghost{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.7); }
.sc-btn-ghost:hover{ background:rgba(255,255,255,.15); border-color:#fff; transform:translateY(-2px); }
.sc-scroll-hint{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); z-index:2; color:rgba(255,255,255,.75); font-size:12px; letter-spacing:.2em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:6px; animation:sc-bob 2s infinite; }
@keyframes sc-bob{ 0%,100%{ transform:translateX(-50%) translateY(0);} 50%{ transform:translateX(-50%) translateY(8px);} }

/* ---------- Saraiki (skr) - RTL + Nastaliq (TranslatePress) ---------- */
html[lang="skr"] body, html[lang="skr"] p, html[lang="skr"] li, html[lang="skr"] a,
html[lang="skr"] h1, html[lang="skr"] h2, html[lang="skr"] h3, html[lang="skr"] h4,
html[lang="skr"] .sc-menu a, html[lang="skr"] .sc-mobile-menu a{ font-family:'Noto Nastaliq Urdu', serif; }
html[lang="skr"] .sc-hero h1{ line-height:1.9; }
html[lang="skr"] .sc-hero h1, html[lang="skr"] .sc-hero .sc-lede, html[lang="skr"] .sc-badge,
html[lang="skr"] .sc-hero-content{ direction:rtl; }
html[lang="skr"] .sc-lang-btn .sc-lang-label{ font-family:'Poppins',sans-serif; direction:ltr; }

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .sc-menu{ display:none; }
  .sc-hamburger{ display:grid; }
}
@media (max-width:640px){
  .sc-nav{ height:66px; padding:0 16px; }
  .sc-subscribe{ display:none; }
  .sc-hero{ min-height:88vh; }
}

/* ---------- Dropdown menus ---------- */
.sc-menu .sc-has-dd{ position:relative; }
.sc-dd-toggle{ display:inline-flex; align-items:center; gap:5px; padding:6px 8px; font-size:13px; font-weight:500; color:var(--sc-ink-soft); background:none; border:none; border-radius:10px; cursor:pointer; font-family:inherit; transition:all .2s var(--sc-ease); white-space:nowrap; }
.sc-menu .sc-has-dd:hover .sc-dd-toggle, .sc-dd-toggle.active, .sc-menu .sc-has-dd.open .sc-dd-toggle{ color:var(--sc-terracotta); background:var(--sc-cream-2); }
.sc-dd-caret{ font-size:9px; transition:transform .2s var(--sc-ease); }
.sc-has-dd:hover .sc-dd-caret, .sc-has-dd.open .sc-dd-caret{ transform:rotate(180deg); }
.sc-has-dd::after{ content:''; position:absolute; top:100%; left:0; right:0; height:8px; }
.sc-dd-panel{ position:absolute; top:calc(100% + 6px); left:0; min-width:212px; background:#fff; border:1px solid rgba(216,179,122,.4); border-radius:14px; box-shadow:0 12px 34px rgba(44,38,32,.14); padding:8px; display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .2s var(--sc-ease), transform .2s var(--sc-ease), visibility .2s; z-index:1001; }
.sc-menu .sc-has-dd:hover .sc-dd-panel, .sc-menu .sc-has-dd.open .sc-dd-panel{ opacity:1; visibility:visible; transform:none; }
.sc-dd-panel a{ display:block; padding:9px 12px; border-radius:8px; font-size:14px; color:var(--sc-ink-soft); white-space:nowrap; text-decoration:none; }
.sc-dd-panel a:hover{ background:var(--sc-cream-2); color:var(--sc-terracotta); }
.sc-mm-head{ font-size:12px; text-transform:uppercase; letter-spacing:.12em; color:var(--sc-terracotta); font-weight:700; padding:16px 16px 4px; }
/* Saraiki dropdowns */
html[lang="skr"] .sc-dd-toggle, html[lang="skr"] .sc-dd-panel a, html[lang="skr"] .sc-mm-head{ font-family:'Noto Nastaliq Urdu', serif; }
html[lang="skr"] .sc-dd-panel{ left:auto; right:0; text-align:right; }