@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

/* ==========================================================
   WebShop — VISUAL REDESIGN ONLY
   Content and JS intentionally remain untouched.
   ========================================================== */
:root {
  --rd-ink: #07111f;
  --rd-ink-2: #0d1b2e;
  --rd-blue: #1e63ff;
  --rd-blue-2: #4d8cff;
  --rd-cyan: #30c5ff;
  --rd-sky: #e9f5ff;
  --rd-surface: #ffffff;
  --rd-surface-2: #f5f8fc;
  --rd-line: #dce6f2;
  --rd-muted: #66768a;
  --rd-shadow: 0 18px 60px rgba(7, 17, 31, .09);
  --rd-radius: 22px;
  --rd-radius-lg: 30px;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Outfit, sans-serif !important;
  color: var(--rd-ink) !important;
  background: #f5f8fc !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.logo,
.btn,
.tab-btn,
.brand-card-title,
.footer-heading {
  font-family:Outfit, sans-serif !important;
}

.container {
  max-width: 1420px !important;
}

a {
  transition: color .2s ease, opacity .2s ease, transform .2s ease;
}

/* ---------- GLOBAL HEADER ---------- */
.top-bar {
  background: #f8fbff !important;
  border-bottom: 1px solid #e4edf6 !important;
  color: #597087 !important;
  min-height: 34px !important;
  font-size: .74rem !important;
}

.top-bar-content {
  min-height: 34px !important;
}

.top-bar-badge {
  background: #edf5ff !important;
  color: #1e63ff !important;
  border: 1px solid #cfe0ff !important;
  border-radius: 999px !important;
  padding: .28rem .58rem !important;
  font-size: .62rem !important;
  /* letter-spacing: .06em; */
}

.header {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  background: #fff !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(216, 226, 239, .9) !important;
  box-shadow: 0 6px 28px rgba(8, 35, 63, .05) !important;
}

/* .navbar {
  min-height: 76px !important;
  gap: 1rem !important;
} */

/* .logo {
  font-weight: 800 !important;
  color: var(--rd-ink) !important;
  /* letter-spacing: -.04em !important; */
} */

.logo-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(145deg, #0b1730, #2468ff) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(30, 99, 255, .22) !important;
  font-size: 1.15rem !important;
}

.main-nav {
  margin-left: auto !important;
}

.nav-links {
  gap: .25rem !important;
}

.nav-link {
  color: #4e6177 !important;
  padding: .62rem .8rem !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  font-size: .86rem !important;
  font-weight: 600 !important;
}

.nav-link:hover,
.nav-link.active {
  color: var(--rd-ink) !important;
  background: #f2f6fb !important;
  border-color: #e2eaf4 !important;
  box-shadow: none !important;
}

.search-container {
  max-width: 300px !important;
}

.search-form {
  background: #f6f9fd !important;
  border: 1px solid #dae5f1 !important;
  border-radius: 13px !important;
  padding: .16rem !important;
}

.search-input {
  background: transparent !important;
  color: var(--rd-ink) !important;
  height: 39px !important;
  font-size: .84rem !important;
}

.search-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: var(--rd-ink) !important;
  color: #fff !important;
}

.mobile-menu-toggle {
  border: 1px solid #dbe5f0 !important;
  background: #fff !important;
  color: var(--rd-ink) !important;
  border-radius: 12px !important;
}

/* ---------- COMMON COMPONENTS ---------- */
.btn {
  border-radius: 12px !important;
  min-height: 44px;
  padding: .75rem 1.05rem !important;
  box-shadow: none !important;
  border: 1px solid transparent !important;
  font-weight: 700 !important;
}

.btn-primary,
.btn-custom,
.btn-download-main {
  background: linear-gradient(135deg, #1957ec, #4a83ff) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 12px 24px rgba(30, 99, 255, .2) !important;
}

.btn-primary:hover,
.btn-custom:hover,
.btn-download-main:hover {
  transform: translateY(-2px);
}

.btn-secondary,
.btn-border {
  background: #fff !important;
  color: var(--rd-ink) !important;
  border-color: #cfdbe9 !important;
}

.btn-secondary:hover,
.btn-border:hover {
  background: #f4f7fb !important;
}

.hero-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: .4rem !important;
  border-radius: 999px !important;
  padding: .42rem .72rem !important;
  font-size: .66rem !important;
  /* letter-spacing: .08em !important; */
  text-transform: uppercase !important;
  font-weight: 800 !important;
  border: 1px solid #cfe0ff !important;
  background: #edf5ff !important;
  color: #1e63ff !important;
}

.section-header,
.catalog-header {
  align-items: flex-end !important;
}

.section-title-wrap h2,
.catalog-header h2 {
  /* letter-spacing: -.045em !important; */
}

.section-subtitle {
  color: #718196 !important;
}

/* ---------- HOMEPAGE ---------- */
.page-home .hero-section {
  padding: 22px 0 18px !important;
  background: linear-gradient(180deg, #eef7ff 0%, #f8fbff 85%) !important;
  position: relative;
  overflow: hidden;
}

.page-home .hero-section::before {
  content: "";
  position: absolute;
  width: 480px;
  height: 480px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(48, 197, 255, .22), transparent 68%);
  right: -120px;
  top: -160px;
  pointer-events: none;
}

.page-home .hero-section::after {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(77, 140, 255, .14), transparent 70%);
  left: -140px;
  bottom: -180px;
  pointer-events: none;
}

.page-home .hero-slider-container {
  border: 1px solid #d6e5f4 !important;
  border-radius: 30px !important;
  overflow: hidden !important;
  box-shadow: 0 28px 70px rgba(17, 61, 105, .10) !important;
  background: linear-gradient(125deg, #ffffff 0%, #e9f5ff 55%, #f8fbff 100%) !important;
}

.page-home .hero-slide {
  padding: 4rem 4.2rem !important;
  min-height: 410px !important;
}

.page-home .hero-content {
  max-width: 560px !important;
}

.page-home .hero-title {
  font-size: clamp(2.6rem, 5vw, 4.7rem) !important;
  line-height: .98 !important;
  /* letter-spacing: -.065em !important; */
  color: var(--rd-ink) !important;
  max-width: 620px !important;
}

.page-home .hero-description {
  color: #52677d !important;
  max-width: 520px !important;
  font-size: 1rem !important;
}

.page-home .hero-price-wrap {
  margin: 1rem 0 1.4rem !important;
}

.page-home .hero-price {
  color: var(--rd-ink) !important;
}

.page-home .hero-old-price {
  color: #8da0b5 !important;
}

.page-home .hero-image-wrapper {
  min-width: 42% !important;
}

.page-home .studio-product-card {
  background: linear-gradient(145deg, rgba(255, 255, 255, .92), rgba(228, 241, 255, .88)) !important;
  border: 1px solid #cfdeec !important;
  box-shadow: 0 30px 60px rgba(20, 64, 105, .12) !important;
  border-radius: 28px !important;
  padding: 2rem !important;
}

.page-home .studio-product-card img {
  filter: drop-shadow(0 26px 28px rgba(6, 31, 62, .20)) !important;
}

.page-home .hero-floating-badge {
  border-radius: 12px !important;
  background: rgba(7, 17, 31, .92) !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(7, 17, 31, .18) !important;
}

.page-home .slider-arrow {
  background: #fff !important;
  color: var(--rd-ink) !important;
  border: 1px solid #d6e2ef !important;
  box-shadow: 0 8px 20px rgba(7, 17, 31, .08) !important;
}

.page-home .dot {
  background: #ced9e6 !important;
}

.page-home .dot.active {
  background: var(--rd-blue) !important;
}

.page-home>.container[style*="margin-top"]>div {
  background: #fff !important;
  border: 1px solid #e0e8f1 !important;
  border-left: 4px solid var(--rd-blue) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  padding: 1rem 1.2rem !important;
}

.page-home .brands-strip {
  margin: 18px auto 0;
  padding: 20px 0 !important;
  background:linear-gradient(120deg, #0d1b2d 0%, #102b54 60%, #1c59d7 100%) !important;
  border-top: 1px solid #e5edf5 !important;
  border-bottom: 1px solid #e5edf5 !important;
}

.page-home .brands-title {
  color: #8995a4 !important;
  font-size: .72rem !important;
  /* letter-spacing: .08em !important; */
  text-transform: uppercase;
}

.page-home .brands-grid {
  gap: .75rem !important;
  margin-top: 14px !important;
}

.page-home .brand-card {
  background: #fff !important;
  border: 1px solid #dfe7f0 !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  padding: 14px 12px !important;
}

.page-home .brand-card:hover {
  transform: translateY(-2px) !important;
  border-color: #bcd2f2 !important;
  box-shadow: 0 10px 26px rgba(30, 99, 255, .08) !important;
}

.page-home .brand-count {
  color: #91a0b1 !important;
}

.page-home .featured-section {
  padding: 4rem 0 2rem !important;
  background: #f5f8fc !important;
}

.page-home .featured-carousel-track {
  gap: 1rem !important;
}

.page-home .catalog-section {
  padding: 3.6rem 0 4.2rem !important;
  background: #f5f8fc !important;
}

.page-home .filter-bar {
  background: #fff !important;
  border: 1px solid #dfe7f1 !important;
  border-radius: 20px !important;
  box-shadow: 0 12px 34px rgba(7, 17, 31, .06) !important;
}

.page-home .tab-btn {
  border: 1px solid transparent !important;
  background: #f5f8fc !important;
  color: #62748a !important;
  border-radius: 10px !important;
}

.page-home .tab-btn.active,
.page-home .tab-btn:hover {
  background: #0b1730 !important;
  color: #fff !important;
}

.page-home .filter-select {
  border: 1px solid #d9e3ee !important;
  border-radius: 10px !important;
  background: #fff !important;
}

.page-home .product-card {
  border: 1px solid #dfe8f2 !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 10px 32px rgba(15, 44, 77, .06) !important;
  overflow: hidden !important;
}

.page-home .product-card:hover {
  transform: translateY(-7px) !important;
  box-shadow: 0 24px 54px rgba(15, 44, 77, .12) !important;
  border-color: #bfd5f2 !important;
}

.page-home .product-img-box {
  background: linear-gradient(145deg, #f5f9fe, #edf6ff) !important;
  border-bottom: 1px solid #e2ebf4 !important;
}

.page-home .product-card-body {
  padding: 1.1rem !important;
}

.page-home .product-card-footer {
  border-top: 1px solid #edf1f5 !important;
  padding-top: .8rem !important;
}

.page-home .promo-deal-section {
  padding: 1rem 0 2rem !important;
}

.page-home .deal-banner {
  background: linear-gradient(120deg, #07111f 0%, #102b54 60%, #1c59d7 100%) !important;
  border-radius: 28px !important;
  box-shadow: 0 28px 70px rgba(7, 17, 31, .18) !important;
  border: 1px solid rgba(255, 255, 255, .06) !important;
}

.page-home .deal-content h2 {
  color: #fff !important;
  /* letter-spacing: -.055em !important; */
}

.page-home .features-section {
  background: #fff !important;
  padding: 3rem 0 !important;
}

.page-home .feature-box {
  border: 1px solid #e2e9f2 !important;
  background: #f9fbfd !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.page-home .feature-icon {
  background: #eaf2ff !important;
  color: #1e63ff !important;
}

.page-home .testimonials-section {
  background: #f5f8fc !important;
  padding: 4rem 0 !important;
  border: 0 !important;
}

.page-home .review-card {
  background: #fff !important;
  border: 1px solid #e0e8f1 !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

.page-home .review-card:hover {
  box-shadow: 0 18px 38px rgba(7, 17, 31, .08) !important;
}

/* ---------- CATALOG / STORE PAGE ---------- */
.page-catalog .catalog-section {
  padding: 3.2rem 0 4.5rem !important;
  background: linear-gradient(180deg, #eef6ff 0, #f7f9fc 240px) !important;
}

.page-catalog .featured-section {
  background: #fff !important;
  padding: 3.3rem 0 1rem !important;
}

.page-catalog .catalog-header,
.page-catalog .section-header {
  margin-bottom: 1.3rem !important;
}

.page-catalog .filter-bar {
  background: #fff !important;
  border: 1px solid #dce6f2 !important;
  box-shadow: 0 18px 45px rgba(7, 17, 31, .07) !important;
  border-radius: 22px !important;
}

.page-catalog .tab-btn {
  border-radius: 10px !important;
  background: #f5f8fc !important;
  color: #60758b !important;
}

.page-catalog .tab-btn.active {
  background: #0b1730 !important;
  color: #fff !important;
}

.page-catalog .product-card {
  border: 1px solid #dde6f0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 10px 30px rgba(8, 34, 61, .06) !important;
}

.page-catalog .product-img-box {
  background: linear-gradient(145deg, #eff6ff, #ffffff) !important;
}

@media (max-width:640px) {
        .service-hero{
            margin: 0px;
            padding: 0px;
        }
    }
/* ---------- SERVICE PAGE ---------- */
.page-service .service-hero,
.page-printer-service .service-hero {
  margin: 0px auto 0 !important;
  /* border-radius: 30px !important; */
  overflow: hidden !important;
  max-width: 100% !important;
  background: linear-gradient(115deg, #102a43 0%, #155e75 55%, #0f766e 100%) !important;
  box-shadow: 0 28px 70px rgba(7, 17, 31, .18) !important;
}

.page-service .service-hero h1,
.page-printer-service .service-hero h1 {
  font-size: clamp(2.5rem, 5vw, 4.2rem) !important;
  /* letter-spacing: -.06em !important; */
}

.page-service .services-grid,
.page-printer-service .services-grid {
  gap: 1rem !important;
}

.page-service .service-card,
.page-printer-service .service-card {
  border: 1px solid #dce6f0 !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 28px rgba(8, 34, 61, .05) !important;
}

.page-service .service-card:hover,
.page-printer-service .service-card:hover {
  border-color: #aec6ea !important;
}

.page-service .service-card-icon,
.page-printer-service .service-card-icon {
  border-radius: 14px !important;
  background: #edf5ff !important;
  color: var(--rd-blue) !important;
}

.page-service .testimonials-section,
.page-printer-service .testimonials-section {
  background: #f5f8fc !important;
  border: 0 !important;
}

.page-service .service-review-card,
.page-printer-service .service-review-card {
  border-radius: 20px !important;
  background: #fff !important;
  border: 1px solid #dfe7f0 !important;
  box-shadow: 0 8px 22px rgba(7, 17, 31, .04) !important;
}

/* ---------- ABOUT / CONTACT / FAQ ---------- */
.page-about .page-hero,
.page-contact .page-hero {
  margin: 18px auto 0 !important;
  max-width: 1420px !important;
  border-radius: 28px !important;
  background: linear-gradient(115deg, #07111f 0%, #153158 62%, #2563eb 100%) !important;
  box-shadow: 0 24px 60px rgba(7, 17, 31, .15) !important;
  padding: 5rem 0 4.2rem !important;
}

.page-about .page-hero h1,
.page-contact .page-hero h1 {
  font-size: clamp(2rem, 3vw, 4rem) !important;
   /* letter-spacing: -.06em !important; */ 
}

.page-about main.container,
.page-contact main.container {
  max-width: 1100px !important;
}

.page-about .about-card,
.page-about .mv-box,
.page-about .why-box,
.page-contact .contact-card,
.page-contact .faq-card {
  border: 1px solid #dfe7f0 !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 12px 34px rgba(7, 17, 31, .06) !important;
}

.page-about .about-image-wrapper img {
  border-radius: 20px !important;
}

.page-about .mv-box,
.page-about .why-box {
  padding: 1.5rem !important;
}

.page-about .mv-icon,
.page-about .why-icon {
  border-radius: 14px !important;
  background: #edf5ff !important;
}

.page-contact .disclaimer-banner {
  border-radius: 18px !important;
  border: 1px solid #dfe7f0 !important;
  border-left: 4px solid var(--rd-blue) !important;
  background: #fff !important;
  box-shadow: none !important;
}

.page-contact .form-control {
  border: 1px solid #d6e1ed !important;
  border-radius: 12px !important;
  background: #fbfdff !important;
}

.page-contact .info-item {
  padding: .9rem 0 !important;
  border-bottom: 1px solid #eef2f6 !important;
}

.page-contact .info-icon {
  border-radius: 12px !important;
  background: #edf5ff !important;
  color: #1e63ff !important;
}

.page-faq .faq-hero {
  margin: 18px auto 0 !important;
  max-width: 1420px !important;
  border-radius: 28px !important;
  background: linear-gradient(115deg, #07111f 0%, #12335c 65%, #2878ff 100%) !important;
  box-shadow: 0 24px 60px rgba(7, 17, 31, .15) !important;
}

.page-faq .faq-hero h1 {
  font-size: clamp(2.5rem, 5vw, 4rem) !important;
   /* letter-spacing: -.06em !important; */ 
}

.page-faq .faq-container-box {
  max-width: 1000px !important;
  margin: 0 auto !important;
  background: #fff !important;
  border: 1px solid #dfe7f0 !important;
  border-radius: 24px !important;
  box-shadow: 0 14px 38px rgba(7, 17, 31, .06) !important;
  padding: 20px;
}

.page-faq .faq-accordion-item {
  border: 1px solid #e0e8f1 !important;
  border-radius: 16px !important;
  margin-bottom: .75rem !important;
  background: #fbfdff !important;
}

.page-faq .faq-question:hover {
  background: #f4f8fd !important;
}

/* ---------- POLICY / LEGAL PAGES ---------- */
.page-legal .policy-hero {
  margin: 18px auto 0 !important;
  max-width: 1420px !important;
  border-radius: 28px !important;
  background: linear-gradient(115deg, #07111f 0%, #142d51 62%, #2a70eb 100%) !important;
  box-shadow: 0 24px 60px rgba(7, 17, 31, .15) !important;
  text-align: left !important;
  padding: 4.2rem 0 !important;
}

.page-legal .policy-hero .container {
  padding-left: 4rem !important;
}

.page-legal .policy-hero h1 {
  font-size: clamp(2.4rem, 5vw, 4rem) !important;
  /* letter-spacing: -.06em !important; */
}

.page-legal .policy-content {
  background: #f5f8fc !important;
  padding: 3rem 0 5rem !important;
}

.page-legal .policy-box {
  max-width: 920px !important;
  padding: 3rem !important;
  border: 1px solid #dfe7f0 !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 46px rgba(7, 17, 31, .07) !important;
}

.page-legal .policy-box h2 {
  border-bottom: 0 !important;
  padding-bottom: .2rem !important;
  font-size: 1.45rem !important;
  color: var(--rd-ink) !important;
}

.page-legal .policy-box h2::before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 4px;
  border-radius: 99px;
  background: linear-gradient(90deg, #1e63ff, #30c5ff);
  margin-right: 10px;
  vertical-align: middle;
}

.page-legal .policy-box p,
.page-legal .policy-box li {
  color: #68798d !important;
}

/* ---------- SETUP / FORM / PROGRESS / DOWNLOAD FLOWS ---------- */
.page-flow .setup-banner,
.page-flow .progress-hero,
.page-flow .failed-hero,
.page-flow .download-hero {
  margin:  auto 0 !important;
  /* max-width: 1420px !important; */
  /* border-radius: 30px !important; */
  overflow: hidden !important;
  background: linear-gradient(115deg, #07111f 0%, #132d4f 58%, #2563eb 100%) !important;
  box-shadow: 0 26px 68px rgba(7, 17, 31, .18) !important;
}

.page-flow .setup-banner-grid,
.page-flow .progress-hero-grid,
.page-flow .failed-hero-grid,
.page-flow .download-hero-grid {
  padding: 2.2rem !important;
  gap: 3.5rem !important;
}


.page-flow .setup-banner h1,
.page-flow .progress-hero h1,
.page-flow .failed-hero h1,
.page-flow .download-hero h1 {
  font-size: clamp(2.4rem, 5vw, 4rem) !important;
  /* letter-spacing: -.06em !important; */
}

.page-flow .setup-form-wrap {
  background: rgba(255, 255, 255, .07) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 16px !important;
  padding: .6rem !important;
}

.page-flow .setup-input {
  background: #fff !important;
  border: 1px solid #dce6f0 !important;
  border-radius: 11px !important;
}

.page-flow .setup-img-card,
.page-flow .progress-img-card,
.page-flow .failed-img-card,
.page-flow .download-img-card {
  /* background: rgba(255, 255, 255, .96) !important; */
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 22px !important;
  box-shadow: 0 22px 46px rgba(0, 0, 0, .25) !important;
}

.page-flow .about-setup-section,
.page-flow .about-section,
.page-flow .software-benefits-section {
  background: #f5f8fc !important;
}

.page-flow .about-setup-grid,
.page-flow .about-grid,
.page-flow .benefits-grid {
  gap: 2rem !important;
}
.btn-border-red{
  border: 2px solid rgb(231, 220, 220);
  padding: 12px 16px;
  border-radius: 8px;
}
.page-flow .about-setup-content,
.page-flow .about-content,
.page-flow .benefits-content {
  background: #fff !important;
  border: 1px solid #dfe7f0 !important;
  border-radius: 22px !important;
  padding: 2rem !important;
  box-shadow: 0 14px 34px rgba(7, 17, 31, .05) !important;
}

.page-flow .progress-box {
  border: 1px solid rgba(255, 255, 255, .12) !important;
  background: rgba(255, 255, 255, .06) !important;
  border-radius: 22px !important;
}

.page-flow .progress-bar-container {
  background: rgba(255, 255, 255, .10) !important;
}

.page-flow .progress-bar-fill {
  background: linear-gradient(90deg, #30c5ff, #4d8cff) !important;
}

.page-flow .alert-card-red {
  border-radius: 22px !important;
  border: 1px solid #ffcaca !important;
  box-shadow: 0 12px 30px rgba(117, 18, 18, .06) !important;
}

.page-flow .phone-support-box {
  border-radius: 22px !important;
}

.page-flow .benefits-list li {
  border-bottom: 1px solid #edf2f6 !important;
}

/* ---------- FOOTER ---------- */
.footer {
  margin-top: 0 !important;
  background: #06101d !important;
  color: #fff !important;
  border-top: 0 !important;
  position: relative;
  overflow: hidden;
}

.footer::before {
  content: "";
  position: absolute;
  width: 480px;
  height: 480px;
  right: -180px;
  top: -300px;
  background: radial-gradient(circle, rgba(48, 197, 255, .12), transparent 70%);
  pointer-events: none;
}

.footer-grid {
  padding: 4rem 0 2.5rem !important;
  gap: 2.2rem !important;
}

.footer .logo {
  color: #fff !important;
}

.footer-about p {
  color: #8ea1b5 !important;
  line-height: 1.75 !important;
}

.footer-heading {
  color: #fff !important;
  font-size: .86rem !important;
  /* letter-spacing: .04em; */
  text-transform: uppercase;
}

.footer-links a {
  color: #8fa1b6 !important;
}

.footer-links a:hover {
  color: #fff !important;
  transform: translateX(2px);
}

.footer-links li {
  margin-bottom: .65rem !important;
}

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .09) !important;
  padding: 1.2rem 0 !important;
  color: #7d91a6 !important;
}

.payment-badge span {
  background: rgba(255, 255, 255, .05) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
  border-radius: 8px !important;
}

/* ---------- DRAWERS / MODALS ---------- */
.cart-drawer-overlay,
.modal-overlay {
  background: rgba(4, 12, 24, .68) !important;
  backdrop-filter: blur(8px) !important;
}

.cart-drawer,
.modal-box {
  border-radius: 26px !important;
  border: 1px solid #dce6f0 !important;
  box-shadow: 0 35px 90px rgba(0, 0, 0, .22) !important;
}

.cart-header {
  background: #f8fbff !important;
  border-bottom: 1px solid #e3eaf2 !important;
}

.close-btn {
  background: #f1f5f9 !important;
  border: 1px solid #dbe4ed !important;
  color: #23364d !important;
  border-radius: 10px !important;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px) {
  .main-nav {
    order: 10 !important;
    width: 100% !important;
  }

  .navbar {
    flex-wrap: wrap !important;
    padding: 12px 0 !important;
  }

  .search-container {
    max-width: 100% !important;
    flex: 1 1 100% !important;
    order: 9 !important;
  }

  .page-home .hero-slide {
    padding: 2.6rem !important;
  }

  .page-home .hero-slide {
    grid-template-columns: 1fr !important;
  }

  .page-home .hero-content {
    order: 1;
  }

  .page-home .hero-image-wrapper {
    order: 2;
  }

  .page-flow .setup-banner-grid,
  .page-flow .progress-hero-grid,
  .page-flow .failed-hero-grid,
  .page-flow .download-hero-grid {
    padding: 2.5rem !important;
  }
}

@media (max-width:760px) {
  .top-bar-left span:last-child {
    display: none !important;
  }

  .navbar {
    min-height: 64px !important;
  }

  .main-nav {
    display: none;
  }

  .main-nav.mobile-open {
    display: block !important;
  }

  .nav-links {
    gap: .4rem !important;
    padding: 10px 0 !important;
  }

  .nav-link {
    width: 100% !important;
  }

  .page-home .hero-slider-container,
  .page-home .brands-strip,
  .page-about .page-hero,
  .page-contact .page-hero,
  .page-faq .faq-hero,
  .page-legal .policy-hero,
  .page-flow .setup-banner,
  .page-flow .progress-hero,
  .page-flow .failed-hero,
  .page-flow .download-hero {
    border-radius: 22px !important;
  }

  .page-home .hero-slide {
    padding: 2rem 1.3rem !important;
  }

  .page-home .hero-title {
    font-size: 2.75rem !important;
  }

  .page-home .hero-image-wrapper {
    min-width: 0 !important;
  }

  .page-legal .policy-hero .container {
    padding-left: 1.2rem !important;
  }

  .page-legal .policy-box {
    padding: 1.5rem !important;
  }

  .page-flow .setup-banner-grid,
  .page-flow .progress-hero-grid,
  .page-flow .failed-hero-grid,
  .page-flow .download-hero-grid {
    padding: 1.4rem !important;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width:480px) {
  .container {
    padding-left: .9rem !important;
    padding-right: .9rem !important;
  }

  .page-home .hero-title {
    font-size: 2.25rem !important;
  }

  .logo-icon {
    width: 34px !important;
    height: 34px !important;
  }
}