/* ============================================================
   ثيم اليوم الوطني السعودي — يُحمَّل بعد kazaa.css ويتخطّى ألوانه فقط
   الحذف/التعطيل: NATIONAL_DAY_THEME=false في .env (ما فيه أي تعديل تاني في الكود)
   ============================================================ */
:root {
  --blue:        #00843d;
  --blue-dark:   #006c35;
  --blue-deeper: #00532a;
  --blue-black:  #04301a;
  --blue-light:  #e6f4ec;
  --blue-mid:    #3fae72;
  --blue-pale:   #b7e0c8;
  --orange:      #c9a227;   /* ذهبي مكان لون التمييز */
  --nd-green:    #006c35;
  --nd-gold:     #c9a227;
}

/* شريط علم علوي رفيع فوق الصفحة */
body::before {
  content: "";
  display: block;
  height: 5px;
  background: linear-gradient(90deg, #006c35 0 33%, #ffffff 33% 66%, #006c35 66% 100%);
  position: relative;
  z-index: 100000;
}

/* لافتة اليوم الوطني */
.nd-banner {
  background: linear-gradient(135deg, #04301a, #006c35 55%, #00843d);
  color: #fff;
  text-align: center;
  padding: 9px 14px;
  font-weight: 800;
  font-size: .95rem;
  letter-spacing: .2px;
  border-bottom: 2px solid var(--nd-gold);
}
.nd-banner b { color: #ffe08a; }
.nd-banner .nd-sep { opacity: .5; margin: 0 8px; }

/* الهيرو والأقسام الغامقة */
.hero-overlay { background: linear-gradient(110deg, rgba(4,48,26,.93) 0%, rgba(0,108,53,.72) 55%, rgba(4,48,26,.2) 100%) !important; }
.hero h1 .accent { color: #ffe08a !important; }
.hero-badge::before { background: var(--nd-gold) !important; }
.hero-maintenance-btn:hover, .hero-projects-btn:hover {
  background: var(--nd-green) !important; border-color: var(--nd-green) !important;
  box-shadow: 0 8px 30px rgba(0,108,53,.4) !important;
}

/* الفورم والقسم الغامق في "تواصل معنا" */
#contact .contact-form { background: linear-gradient(135deg, #04301a, #006c35) !important; }
#contact .contact-form .form-input:focus { border-color: var(--nd-gold) !important; }

/* البريلودر */
#kzPreloader { background: linear-gradient(135deg, #04301a 0%, #006c35 100%) !important; }

/* روابط وأزرار عامة كانت بلون ثابت */
a:hover { color: inherit; }
.btn-primary, .btn-blue { background: var(--nd-green) !important; border-color: var(--nd-green) !important; }
::selection { background: var(--nd-gold); color: #04301a; }

/* اللافتة ثابتة أعلى الصفحة، والنافبار الثابت ينزل تحتها */
.nd-banner { position: relative; z-index: 1003; height: 34px; line-height: 34px; padding: 0 12px; font-size: .88rem; white-space: nowrap; overflow: hidden; }
.navbar { top: calc(36px + 34px) !important; }
.navbar.scrolled { top: 0 !important; }
@media (max-width: 768px) { .nd-banner { font-size: .74rem; } .navbar { top: var(--kz-topbar-h, 42px) !important; } }

/* =====================================================================
   تصميم اليوم الوطني 96 «عزنا بطبعنا» — هوية السدو (زخارف النسيج التراثي)
   ===================================================================== */
:root{
  --sadu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Crect width='28' height='28' fill='%2304301a'/%3E%3Cpath d='M14 2l6 6-6 6-6-6z' fill='%23006c35'/%3E%3Cpath d='M14 14l6 6-6 6-6-6z' fill='%23006c35'/%3E%3Cpath d='M14 5l3 3-3 3-3-3z' fill='%23f3ead2'/%3E%3Cpath d='M14 17l3 3-3 3-3-3z' fill='%23f3ead2'/%3E%3Cpath d='M0 14l3 3-3 3zM28 14l-3 3 3 3z' fill='%23c9a227'/%3E%3Ccircle cx='14' cy='14' r='1.3' fill='%23c9a227'/%3E%3C/svg%3E");
  --sadu-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M14 2l6 6-6 6-6-6z' fill='%23006c35' fill-opacity='.10'/%3E%3Cpath d='M14 14l6 6-6 6-6-6z' fill='%23006c35' fill-opacity='.10'/%3E%3Ccircle cx='14' cy='14' r='1.3' fill='%23c9a227' fill-opacity='.35'/%3E%3C/svg%3E");
}
.nd-banner{
  height:46px !important; line-height:46px !important; display:flex; align-items:center; justify-content:center; gap:16px;
  background:var(--sadu) !important; background-size:28px 28px !important; border-bottom:2px solid var(--nd-gold) !important;
  box-shadow:0 4px 18px rgba(0,0,0,.35); overflow:hidden;
}
.nd-banner .nd-badge{ height:36px; width:auto; border-radius:4px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.4)); }
.nd-banner .nd-txt{ background:rgba(4,48,26,.78); padding:0 16px; border-radius:20px; line-height:30px; height:30px; }
.navbar{ top:calc(36px + 46px) !important; }
.navbar.scrolled{ top:0 !important; }

.section, .why-section, .showcase-section, .kz-partners, .kz-clients, .kzwhy-section, footer, .footer{ position:relative; }
.section::before, .why-section::before, .showcase-section::before, .kz-partners::before, .kz-clients::before, .kzwhy-section::before, footer::before, .footer::before{
  content:""; position:absolute; top:0; left:0; right:0; height:14px; z-index:3;
  background:var(--sadu); background-size:28px 28px; border-bottom:2px solid var(--nd-gold); pointer-events:none;
}
.section:not(.section-dark):not(.products-section), .why-section{ background-image:var(--sadu-light); background-size:28px 28px; }

.section-title{ position:relative; }
.section-title::after{
  content:""; display:block; height:12px; width:150px; margin:14px auto 0;
  background:
    radial-gradient(circle at 50% 50%, #c9a227 0 4px, transparent 5px) center/12px 12px no-repeat,
    linear-gradient(90deg, transparent, #c9a227 25%, #c9a227 75%, transparent) center/100% 2px no-repeat;
}
.service-card, .why-card, .product-card, .blog-card, .testimonial-card, .kz-card{
  border-top:3px solid var(--nd-gold) !important; transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
}
.service-card:hover, .why-card:hover, .product-card:hover, .blog-card:hover, .testimonial-card:hover{
  transform:translateY(-8px) !important; box-shadow:0 18px 40px rgba(0,108,53,.28), 0 0 0 1px rgba(201,162,39,.5) !important;
}

.nd-hero-fx{ position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.nd-hero-fx canvas{ position:absolute; inset:0; width:100%; height:100%; }
.nd-palm{ position:absolute; bottom:-6px; width:230px; opacity:.55; filter:drop-shadow(0 0 20px rgba(201,162,39,.35)); }
.nd-palm.l{ left:-30px; transform:scaleX(-1); } .nd-palm.r{ right:-30px; }
.nd-hero-frame{ position:absolute; inset:14px; border:1px solid rgba(201,162,39,.55); border-radius:10px; box-shadow:inset 0 0 60px rgba(201,162,39,.12); }
.nd-hero-frame::before,.nd-hero-frame::after{ content:"◆"; position:absolute; color:#c9a227; font-size:16px; top:-10px; }
.nd-hero-frame::before{ right:24px; } .nd-hero-frame::after{ left:24px; }
.nd-count{
  position:absolute; z-index:4; bottom:22px; left:50%; transform:translateX(-50%);
  display:flex; gap:10px; align-items:center; padding:9px 20px; border-radius:40px; color:#fff; font-weight:800;
  background:linear-gradient(135deg, rgba(4,48,26,.88), rgba(0,108,53,.88)); border:1.5px solid #c9a227;
  box-shadow:0 8px 30px rgba(0,0,0,.4), 0 0 24px rgba(201,162,39,.3); animation:ndGlow 3s ease-in-out infinite; white-space:nowrap;
}
.nd-count b{ color:#ffe08a; font-size:1.15rem; }
.nd-count img{ height:28px; }
@keyframes ndGlow{ 50%{ box-shadow:0 8px 30px rgba(0,0,0,.4), 0 0 42px rgba(201,162,39,.65); } }
.hero h1, .hero p, .hero-btns{ position:relative; z-index:3; }
.hero h1{ text-shadow:0 4px 30px rgba(0,0,0,.45); }

.nd-reveal{ opacity:0; transform:translateY(34px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.8,.2,1); }
.nd-reveal.nd-in{ opacity:1; transform:none; }

@media (max-width:768px){
  .nd-banner{ height:auto !important; padding:5px 8px; flex-direction:column; gap:4px; }
  .nd-banner .nd-badge{ height:28px; } .nd-banner .nd-txt{ font-size:.72rem; height:auto; line-height:1.6; padding:0 10px; white-space:normal; text-align:center; }
  .navbar{ top:var(--kz-topbar-h,42px) !important; } .navbar.scrolled{ top:0 !important; }
  .nd-palm{ width:120px; } .nd-count{ font-size:.75rem; padding:7px 12px; }
}
@media (prefers-reduced-motion:reduce){ .nd-reveal{ opacity:1; transform:none; transition:none; } .nd-count{ animation:none; } }

/* ===== شريط السدو الملوّن المعتمَد (nd/sadu-strip.png) بدل الزخرفة المولَّدة ===== */
.nd-banner{ background:#0d3b3a url("nd/sadu-strip.png") repeat-x center/auto 100% !important; }
.section::before, .why-section::before, .showcase-section::before, .kz-partners::before, .kz-clients::before, .kzwhy-section::before, footer::before, .footer::before{
  height:30px; background:url("nd/sadu-strip.png") repeat-x center/auto 100%; border-bottom:0; opacity:1;
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:38px; z-index:2; pointer-events:none;
  background:url("nd/sadu-strip.png") repeat-x center/auto 100%;
}
.nd-count{ bottom:52px; }
.section:not(.section-dark):not(.products-section), .why-section{ padding-top:calc(var(--sec-pt, 5rem) + 14px); }

/* ===== احتفالات: كانفس شاشة كاملة + فوانيس صاعدة + نجوم متلألئة ===== */


.nd-floater{
  position:absolute; bottom:-80px; border-radius:50% 50% 46% 46%; opacity:.85; box-shadow:0 0 22px rgba(201,162,39,.45), inset -6px -8px 14px rgba(0,0,0,.25);
  animation:ndRise linear forwards;
}
.nd-floater::after{ content:""; position:absolute; left:50%; bottom:-16px; width:1px; height:16px; background:rgba(255,255,255,.55); }
@keyframes ndRise{ 0%{ transform:translate(0,0) rotate(-4deg); opacity:0 } 8%{ opacity:.9 } 50%{ transform:translate(var(--sway),-55vh) rotate(5deg) } 100%{ transform:translate(calc(var(--sway) * -1),-115vh) rotate(-4deg); opacity:0 } }
.nd-stars{ position:absolute; inset:0; }
.nd-stars i{ position:absolute; color:#ffe08a; font-style:normal; text-shadow:0 0 10px #c9a227; animation:ndTwinkle ease-in-out infinite; }
@keyframes ndTwinkle{ 0%,100%{ opacity:.15; transform:scale(.6) } 50%{ opacity:1; transform:scale(1.2) rotate(20deg) } }

/* تخفيف الحِمل: بدون ظلال متحركة ثقيلة على البالونات */
.nd-floater{ box-shadow:none !important; opacity:.8; will-change:transform; }
.nd-stars i{ text-shadow:none !important; will-change:opacity; }


/* شريط الجوال: responsive.css فارض navy ثابت بـ !important، فنغيّره لأخضر اليوم الوطني + سدو تحته */
@media (max-width: 768px){
  .navbar{ background:rgba(4,48,26,.97) !important; border-bottom:2px solid #c9a227; box-shadow:0 4px 20px rgba(0,0,0,.3); }
  .navbar::after{ content:""; position:absolute; left:0; right:0; bottom:-14px; height:12px; pointer-events:none;
    background:url("nd/sadu-strip.png") repeat-x center/auto 100%; }
  .mobile-menu{ background:linear-gradient(180deg,#04301a,#006c35) !important; }
}