/* ============================================================
   Medinaz Modern Home Theme — teal (#03989e) + cream (#fffec8)
   Loaded after style.css / responsive.css on the landing page.
   ============================================================ */

:root{
  --mz-teal:#03989e;
  --mz-teal-dark:#02777c;
  --mz-teal-deep:#023b40;
  --mz-teal-soft:#e2f4f4;
  --mz-cream:#fffec8;
  --mz-cream-dark:#6b5f00;
  --mz-coral:#ff4d6d;
  --mz-ink:#0d2b2e;
  --mz-muted:#587a7d;
  --mz-bg:#f3fafa;
  --mz-line:#d9eded;
  --mz-radius:20px;
  --mz-shadow:0 18px 50px -20px rgba(2,119,124,.45);
  --mz-shadow-sm:0 8px 24px -12px rgba(2,119,124,.35);
}

body{
  font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif !important;
  color:var(--mz-ink);
  background:var(--mz-bg);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{
  font-family:"Bricolage Grotesque","Plus Jakarta Sans",sans-serif !important;
  letter-spacing:-.01em;
}
::selection{background:var(--mz-teal);color:#fff}

/* tag pill */
.mz-tag{
  display:inline-block;
  font-family:"Gochi Hand",cursive !important;
  font-size:21px;
  color:var(--mz-cream-dark);
  background:var(--mz-cream);
  padding:4px 18px 6px;
  border-radius:8px;
  transform:rotate(-1.4deg);
  box-shadow:0 4px 0 rgba(0,0,0,.12);
  line-height:1.2;
  margin-bottom:18px;
}
.mz-chip{
  display:inline-block;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.28);
  color:#eafcfc;
  padding:6px 13px;border-radius:999px;
  font-size:13px;font-weight:600;
  margin:0 6px 8px 0;
}

/* ---------- Preloader ---------- */
#preloader{background:var(--mz-teal-deep) !important}
#loader{border-color:var(--mz-cream) transparent var(--mz-cream) transparent !important}

/* ---------- Navbar (Bootstrap 3) ---------- */
.navbar.navbar-default{
  background:#ffffff !important;
  border:none !important;
  border-bottom:1px solid var(--mz-line) !important;
  box-shadow:0 10px 30px -18px rgba(2,119,124,.35);
  padding:6px 0 !important;
}
.navbar-default .navbar-collapse{background:transparent !important;box-shadow:none !important;border:none !important}
.navbar-default .navbar-brand{
  display:flex;align-items:center;
  height:64px !important;
  padding:0 15px !important;
}
.navbar-default .navbar-brand img{max-height:52px;width:auto}
.navbar-default .navbar-nav>li>a{
  color:var(--mz-ink) !important;
  font-weight:600 !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  padding-top:22px;padding-bottom:22px;
}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li.active>a{color:var(--mz-teal) !important;background:transparent !important}
.navbar-default .navbar-toggle{border-color:var(--mz-teal) !important;margin-top:15px}
.navbar-default .navbar-toggle .icon-bar{background:var(--mz-teal) !important}
.navbar-default .navbar-nav>li>a.blog_button{
  margin-top:11px;
  padding:10px 22px !important;
  font-size:16px !important;
}
@media(max-width:767px){
  .navbar-default .navbar-collapse{background:#fff !important}
  .navbar-default .navbar-nav>li>a{padding-top:12px;padding-bottom:12px}
  .navbar-default .navbar-nav>li>a.blog_button{margin:6px 0 10px 15px;display:inline-block}
}

/* ---------- Hero ---------- */
#hero.hero-content,
.hero-slider-section-one{
  background:
    radial-gradient(900px 420px at 85% -10%,rgba(255,254,200,.16),transparent 60%),
    radial-gradient(700px 420px at -5% 110%,rgba(3,152,158,.5),transparent 55%),
    linear-gradient(160deg,var(--mz-teal-deep),#035e63 55%,var(--mz-teal)) !important;
  position:relative;
}
#hero::after{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:22px 22px;pointer-events:none;
}
#hero .container{position:relative;z-index:2}
.hero-content-wrap .hero-content h1{
  color:#fff !important;
  font-size:52px;
  font-weight:800 !important;
  line-height:1.06;
}
.hero-content-wrap .hero-content h1 .hl{color:var(--mz-cream)}
.hero-content-wrap .hero-content p{
  color:#d7f3f3 !important;
  font-size:17px;
  max-width:54ch;
}
@media(max-width:767px){
  .hero-content-wrap .hero-content h1{font-size:34px}
  .hero-content-wrap{padding-top:64px}
  .mobile-slider-area{margin-top:48px}
}

/* wave shapes at hero bottom — tint to page bg */
.river-wave{filter:hue-rotate(0deg)}
.section-shape .river-wave{opacity:.35}

/* ---------- Buttons ---------- */
.softo-solid-btn{
  background:linear-gradient(135deg,var(--mz-teal),var(--mz-teal-dark)) !important;
  border:none !important;
  color:#fff !important;
  border-radius:14px !important;
  font-weight:700 !important;
  box-shadow:0 10px 22px -8px rgba(3,152,158,.6);
  transition:transform .15s ease,box-shadow .15s ease !important;
}
.softo-solid-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 30px -8px rgba(3,152,158,.75);
  color:#fff !important;
}
.softo-btn-outline{
  background:transparent !important;
  border:2px solid var(--mz-teal) !important;
  color:var(--mz-teal-dark) !important;
  border-radius:12px !important;
  font-weight:700 !important;
  transition:all .15s ease !important;
}
.softo-btn-outline:hover{
  background:var(--mz-teal) !important;
  color:#fff !important;
  transform:translateY(-2px);
}
.download-btn{
  background:rgba(255,255,255,.1) !important;
  border:1.5px solid rgba(255,255,255,.32) !important;
  border-radius:14px !important;
  color:#fff !important;
  transition:all .15s ease !important;
}
.download-btn:hover{
  border-color:var(--mz-cream) !important;
  background:rgba(255,254,200,.12) !important;
  color:var(--mz-cream) !important;
  transform:translateY(-2px);
}
.download-btn p,.download-btn small{color:inherit !important}
/* store icons: template fills them with a purple gradient via background-clip:text — force white */
.download-btn span{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:#fff !important;
  color:#fff !important;
}
.download-btn:hover span{
  -webkit-text-fill-color:var(--mz-cream) !important;
  color:var(--mz-cream) !important;
}

/* download buttons that sit on light sections */
.download-section .download-btn{
  background:rgba(255,255,255,.12) !important;
}

/* ---------- Section headings ---------- */
.section-heading h3{
  font-weight:800 !important;
  color:var(--mz-teal-deep) !important;
  font-size:32px;
  position:relative;
  padding-bottom:14px;
  display:inline-block;
}
.section-heading h3::after{
  content:"";position:absolute;left:0;bottom:0;width:64px;height:5px;border-radius:99px;
  background:linear-gradient(90deg,var(--mz-teal),var(--mz-cream));
}
.section-heading.text-center h3::after{left:50%;transform:translateX(-50%)}
.section-heading p{color:var(--mz-muted) !important}

/* ---------- Promo banners ---------- */
.promo-section{background:var(--mz-bg) !important}
.single-promo-section{
  background:#fff !important;
  border:1px solid var(--mz-line);
  border-radius:var(--mz-radius);
  box-shadow:var(--mz-shadow-sm);
  overflow:hidden;
  transition:transform .2s ease,box-shadow .2s ease;
  margin-bottom:24px;
}
.single-promo-section:hover{transform:translateY(-6px);box-shadow:var(--mz-shadow)}
.single-promo-section .line{display:none}
.bg-secondary{background:transparent !important}

/* ---------- Video section ---------- */
.video-app-1 .overlay-1{background:rgba(2,59,64,.72) !important}
.video-play-button a{
  background:var(--mz-cream) !important;
  color:var(--mz-teal-deep) !important;
  box-shadow:0 0 0 14px rgba(255,254,200,.25) !important;
}

/* ---------- Testimonials ---------- */
.testimonial-section{background:var(--mz-teal-soft) !important}
.single-testimonial-item{
  background:#fff !important;
  border:1px solid var(--mz-line) !important;
  border-radius:var(--mz-radius) !important;
  box-shadow:var(--mz-shadow-sm) !important;
  padding:28px !important;
}
.blockquote-icon i{color:var(--mz-teal) !important}
.testimonial-author-info h6{color:var(--mz-teal-dark) !important;font-weight:700}
.owl-theme .owl-dots .owl-dot span{background:#bfdfe0 !important}
.owl-theme .owl-dots .owl-dot.active span{background:var(--mz-teal) !important}

/* ---------- Bestsellers ---------- */
#news{background:var(--mz-bg) !important}
.single-blog-article{
  background:#fff !important;
  border:1px solid var(--mz-line);
  border-radius:var(--mz-radius);
  box-shadow:var(--mz-shadow-sm);
  overflow:hidden;
  padding:14px;
  transition:transform .2s ease,box-shadow .2s ease;
  margin-bottom:26px;
}
.single-blog-article:hover{transform:translateY(-6px);box-shadow:var(--mz-shadow)}
.blog-post-img-thumb img{border-radius:14px}
.blog-post-content-area h3{
  font-size:17px !important;
  font-weight:700 !important;
  color:var(--mz-ink) !important;
  line-height:1.35;
}
.bestseller-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}

/* ---------- Download / app section ---------- */
.download-section{
  background:
    radial-gradient(800px 380px at 90% -10%,rgba(255,254,200,.14),transparent 60%),
    linear-gradient(150deg,var(--mz-teal-deep),#03676d 60%,var(--mz-teal)) !important;
}
.download-app-text h3{color:var(--mz-cream) !important;font-weight:800 !important}
.download-app-text p{color:#d7f3f3 !important}

/* ---------- FAQ ---------- */
.faq-section{background:var(--mz-bg) !important}
.panel-group .panel{
  background:#fff !important;
  border:1px solid var(--mz-line) !important;
  border-radius:14px !important;
  box-shadow:var(--mz-shadow-sm) !important;
  margin-bottom:14px !important;
  overflow:hidden;
}
.panel-heading{background:#fff !important;border:none !important}
.panel-title a{
  color:var(--mz-teal-deep) !important;
  font-weight:700 !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
}
.panel-title a:hover{color:var(--mz-teal) !important}
.panel-body{color:var(--mz-muted) !important;border-top:1px dashed var(--mz-line) !important}

/* ---------- Footer (shared markup) ---------- */
.footer-area,
.footer-area.footer-bg,
footer.footer-area{
  background:
    radial-gradient(800px 300px at 90% 0%,rgba(255,254,200,.08),transparent 60%),
    linear-gradient(160deg,#02282c,var(--mz-teal-deep) 70%,#034b50) !important;
  position:relative;
  padding-top:80px;
}
.footer-area::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;
  background:linear-gradient(90deg,var(--mz-teal),var(--mz-cream),var(--mz-teal));
}
.footer-widget h3{color:var(--mz-cream) !important;font-weight:800 !important;font-size:18px !important}
.footer-widget p{color:#bfe3e4 !important}
.footer-list li a,.footer-list-contact li a{color:#bfe3e4 !important;font-weight:500}
.footer-list li a:hover{color:var(--mz-cream) !important;padding-left:4px}
.footer-list-contact li i{color:var(--mz-cream) !important}
.social-link li a{
  background:rgba(255,255,255,.1) !important;color:#fff !important;
  border-radius:12px !important;transition:all .15s ease !important;
}
.social-link li a:hover{background:var(--mz-teal) !important;transform:translateY(-3px)}
.copy-right-area{border-top:1px solid rgba(255,255,255,.12);margin-top:10px}
.copy-right-text p{color:#9fcfd1 !important}
.copy-right-text a{color:var(--mz-cream) !important}

/* ---------- Purple remnant overrides ---------- */
.blog_button{
  background:linear-gradient(135deg,var(--mz-teal),var(--mz-teal-dark)) !important;
  animation:none !important;
  color:#fff !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  font-weight:700;
  border-radius:14px !important;
}
.blog_button:hover{background:linear-gradient(135deg,#04a7ae,var(--mz-teal)) !important;color:#fff !important}

.testimonial-content{
  background:var(--mz-teal-soft) !important;
  color:var(--mz-ink) !important;
  border:1px solid var(--mz-line) !important;
  border-radius:16px !important;
  min-height:280px !important;
}
.testimonial-content p{color:var(--mz-ink) !important}
.testimonial-content:after{border-top-color:var(--mz-teal-soft) !important}

.download-section:after{
  background:linear-gradient(150deg,rgba(2,59,64,.9) 15%,rgba(3,103,109,.88) 60%,rgba(3,152,158,.82) 94%) !important;
}

/* ---------- Slider indicator arrows ---------- */
.slider-indicator ul li{
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.3) !important;
  color:#fff !important;
  border-radius:50% !important;
}
.slider-indicator ul li:hover{background:var(--mz-cream) !important;color:var(--mz-teal-deep) !important}