/* =====================================================
   DIGITAL DIVA — GLOBAL SITE STYLES
   Dark indigo theme for all inner pages
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&display=swap');

/* ── 1. Site-wide dark background ── */
html, body, body.elementor-page,
#page, .site, .site-content {
  background-color: #0a0c28 !important;
  font-family: 'DM Sans', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── 2. All Elementor sections → transparent ── */
.elementor-section,
.elementor-top-section,
.e-con, .e-con-full,
.elementor-column,
.elementor-widget-wrap,
.elementor-element-populated,
.elementor-container,
.elementor-inner-section {
  background-color: transparent !important;
}

/* ── 3. Text on dark background ── */
body, p,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-icon-box-description,
.elementor-widget-container p {
  color: rgba(255,255,255,.80) !important;
}

h1,h2,h3,h4,h5,h6,
.elementor-heading-title {
  color: #ffffff !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
}

/* Gold headings that already have color set inline */
.elementor-heading-title[style*="color: rgb(212"],
.elementor-heading-title[style*="color: #d4a843"],
.elementor-heading-title[style*="color: #D4A843"],
.elementor-heading-title[style*="color: #e6a617"],
.elementor-heading-title[style*="color: rgb(230"] {
  background: linear-gradient(135deg,#FFE082,#D4A843,#8B5E1A) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* ── 4. Links ── */
a { color: rgba(255,255,255,.75); transition: color .2s; }
a:hover { color: #D4A843; }

/* ── 5. Hide Elementor header + footer (replaced by custom HTML) ── */
.elementor-location-header,
.elementor-location-footer { display: none !important; }

/* ── 6. Body padding for fixed nav ── */
body { padding-top: 72px !important; }

/* ── 7. Elementor page canvas — remove white wrapper ── */
.elementor-section-wrap,
#content, .site-content,
.entry-content, .post-content {
  background: transparent !important;
}

/* ── 8. Atmospheric bg ── */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background:
    radial-gradient(ellipse 65% 40% at 5% 0%,
      rgba(212,168,67,.05) 0, transparent 55%),
    radial-gradient(ellipse 50% 55% at 95% 100%,
      rgba(90,30,180,.05) 0, transparent 55%);
  pointer-events: none;
  z-index: 0;
}
.elementor-section, .e-con,
header, footer, nav, main {
  position: relative; z-index: 1;
}

/* ── 9. Buttons on inner pages ── */
.elementor-button {
  background: linear-gradient(135deg,#FFE082 0%,#D4A843 45%,#8B5E1A 100%) !important;
  color: #0a0c28 !important;
  border: none !important;
  border-radius: 100px !important;
  font-weight: 600 !important;
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease !important;
}
.elementor-button:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 40px rgba(212,168,67,.4) !important;
}

/* ── 10. Icon boxes ── */
.elementor-icon-box-wrapper {
  background: rgba(21,20,58,.6) !important;
  border: 1px solid rgba(212,168,67,.14) !important;
  border-radius: 14px !important;
  transition: transform .35s cubic-bezier(.16,1,.3,1),
              border-color .35s, box-shadow .35s !important;
}
.elementor-icon-box-wrapper:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(212,168,67,.35) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.35) !important;
}
.elementor-icon i, .elementor-icon svg {
  color: #D4A843 !important;
  fill: #D4A843 !important;
}

/* ── 11. Pricing tables (AI page) ── */
.eael-pricing-table-wrap {
  background: rgba(21,20,58,.8) !important;
  border: 1px solid rgba(212,168,67,.18) !important;
  border-radius: 16px !important;
  color: #fff !important;
}
.eael-pricing-table-title {
  color: #fff !important;
  font-family: 'Cormorant Garamond', serif !important;
}
.eael-pricing-table-price-wrap .price {
  background: linear-gradient(135deg,#FFE082,#D4A843,#8B5E1A) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.eael-pricing-table-item span { color: rgba(255,255,255,.7) !important; }
.eael-pricing-table-featured .eael-pricing-table-wrap {
  border-color: rgba(212,168,67,.5) !important;
  background: linear-gradient(145deg,rgba(212,168,67,.08),rgba(21,20,58,.9)) !important;
}

/* ── 12. Contact form (Fluent Forms) ── */
.ff-el-input, .ff-el-form-control,
.fluentform input, .fluentform textarea, .fluentform select {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(212,168,67,.2) !important;
  border-radius: 10px !important;
  color: #fff !important;
  transition: border-color .2s !important;
}
.ff-el-input:focus, .fluentform input:focus {
  border-color: rgba(212,168,67,.55) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(212,168,67,.1) !important;
}
.ff-el-input::placeholder, .fluentform input::placeholder {
  color: rgba(255,255,255,.35) !important;
}
.ff_submit_btn_wrapper button,
.fluentform .ff-btn-submit {
  background: linear-gradient(135deg,#FFE082,#D4A843,#8B5E1A) !important;
  color: #0a0c28 !important;
  border-radius: 100px !important;
  border: none !important;
  font-weight: 700 !important;
}

/* ── 13. Dividers ── */
.elementor-divider-separator {
  background: linear-gradient(90deg,transparent,#D4A843,#FFE082,#D4A843,transparent) !important;
  height: 1px !important; border: none !important; opacity: .45;
}

/* ── 14. Blog / archive ── */
.elementor-post__card,
article.elementor-post {
  background: rgba(21,20,58,.6) !important;
  border: 1px solid rgba(212,168,67,.12) !important;
  border-radius: 14px !important;
}
.elementor-post__title a { color: #fff !important; }
.elementor-post__title a:hover { color: #D4A843 !important; }
.elementor-post__excerpt { color: rgba(255,255,255,.6) !important; }

/* ── 15. Scrollbar styling ── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #0a0c28; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg,#8B5E1A,#D4A843);
  border-radius: 10px;
}

/* ── GLOBAL NAV ── */
#dd-global-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  height: 72px; display: flex; align-items: center;
  justify-content: space-between; padding: 0 32px;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  background: rgba(10,12,40,.82);
  border-bottom: 1px solid transparent;
  transition: background .3s, border-color .3s, box-shadow .3s;
  font-family: 'DM Sans', system-ui, sans-serif;
}
#dd-global-nav.scrolled {
  background: rgba(10,12,40,.97);
  border-bottom-color: rgba(212,168,67,.15);
  box-shadow: 0 4px 40px rgba(0,0,0,.4);
}
.ddg-logo img {
  height: 44px; width: auto; display: block;
  filter: drop-shadow(0 0 6px rgba(212,168,67,.15));
  transition: filter .3s;
}
#dd-global-nav.scrolled .ddg-logo img {
  filter: drop-shadow(0 0 12px rgba(212,168,67,.35));
}
.ddg-links { display: flex; list-style: none; gap: 2px; }
.ddg-links a {
  font-size: 13.5px; color: rgba(255,255,255,.7);
  text-decoration: none; padding: 8px 14px;
  position: relative; transition: color .2s;
}
.ddg-links a::after {
  content: ''; position: absolute; bottom: 3px;
  left: 14px; right: 14px; height: 1.5px;
  background: linear-gradient(135deg,#FFE082,#D4A843,#8B5E1A);
  transform: scaleX(0); transform-origin: left;
  transition: transform .3s cubic-bezier(.16,1,.3,1);
}
.ddg-links a:hover { color: #fff; }
.ddg-links a:hover::after { transform: scaleX(1); }
.ddg-cta {
  display: inline-flex; align-items: center;
  padding: 10px 22px; border-radius: 100px;
  background: linear-gradient(135deg,#FFE082,#D4A843,#8B5E1A);
  color: #0a0c28 !important; font-size: 13px; font-weight: 700;
  text-decoration: none; white-space: nowrap;
  box-shadow: 0 4px 20px rgba(212,168,67,.28);
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s;
}
.ddg-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(212,168,67,.45);
  color: #0a0c28 !important;
}
.ddg-ham {
  display: none; flex-direction: column; gap: 5px;
  cursor: pointer; background: none; border: none; padding: 8px;
}
.ddg-ham span {
  display: block; width: 24px; height: 1.5px;
  background: rgba(255,255,255,.8); transition: all .3s;
}
.ddg-ham.active span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.ddg-ham.active span:nth-child(2) { opacity: 0; }
.ddg-ham.active span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
#ddg-mob {
  display: none; position: fixed; inset: 0; top: 72px;
  background: rgba(8,9,30,.98); z-index: 9998;
  flex-direction: column; padding: 36px 32px; gap: 4px;
  overflow-y: auto;
}
#ddg-mob.open { display: flex; }
#ddg-mob a {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px; font-weight: 300;
  color: rgba(255,255,255,.8) !important; text-decoration: none;
  padding: 14px 0; border-bottom: 1px solid rgba(212,168,67,.09);
  transition: color .2s;
}
#ddg-mob a:hover { color: #D4A843 !important; }

/* ── GLOBAL FOOTER ── */
#dd-global-footer {
  background: rgba(6,7,22,.98);
  border-top: 1px solid rgba(212,168,67,.13);
  font-family: 'DM Sans', system-ui, sans-serif;
  position: relative; z-index: 1;
}
.ddg-foot-grid {
  max-width: 1180px; margin: 0 auto; padding: 72px 28px 48px;
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 48px;
}
.ddg-foot-logo img {
  height: 40px; display: block; margin-bottom: 14px;
  filter: drop-shadow(0 0 8px rgba(212,168,67,.2));
}
.ddg-foot-tagline {
  font-size: 14px; color: rgba(255,255,255,.44);
  line-height: 1.7; margin-bottom: 20px;
}
.ddg-socials { display: flex; gap: 10px; }
.ddg-social {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid rgba(212,168,67,.26);
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; font-size: 14px; font-weight: 600;
  color: rgba(255,255,255,.6) !important;
  transition: all .25s; font-family: 'DM Sans', sans-serif;
}
.ddg-social:hover {
  background: rgba(212,168,67,.12);
  border-color: rgba(212,168,67,.6);
  color: #fff !important;
}
.ddg-foot-col h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px; font-weight: 600;
  color: #fff !important; margin-bottom: 18px;
}
.ddg-foot-links { list-style: none; }
.ddg-foot-links li { margin-bottom: 10px; }
.ddg-foot-links a {
  font-size: 14px; color: rgba(255,255,255,.44) !important;
  text-decoration: none; transition: color .2s;
  display: flex; align-items: center; gap: 6px;
}
.ddg-foot-links a::before {
  content: ''; width: 0; height: 1px;
  background: #D4A843; transition: width .25s;
  flex-shrink: 0;
}
.ddg-foot-links a:hover {
  color: #D4A843 !important; padding-left: 4px;
}
.ddg-foot-links a:hover::before { width: 10px; }
.ddg-foot-contact a, .ddg-foot-contact span {
  display: block; font-size: 14px;
  color: rgba(255,255,255,.44) !important;
  text-decoration: none; margin-bottom: 9px;
  transition: color .2s;
}
.ddg-foot-contact a:hover { color: #D4A843 !important; }
.ddg-foot-bar {
  max-width: 1180px; margin: 0 auto;
  padding: 18px 28px; border-top: 1px solid rgba(212,168,67,.1);
  display: flex; justify-content: space-between; align-items: center;
}
.ddg-foot-bar span {
  font-size: 13px; color: rgba(255,255,255,.35) !important;
}

/* Responsive */
@media (max-width: 900px) {
  .ddg-foot-grid { grid-template-columns: 1fr 1fr; gap: 32px; padding: 56px 24px 40px; }
  .ddg-foot-bar { flex-direction: column; gap: 6px; text-align: center; }
}
@media (max-width: 600px) {
  #dd-global-nav .ddg-links, #dd-global-nav .ddg-cta { display: none; }
  .ddg-ham { display: flex; }
  .ddg-foot-grid { grid-template-columns: 1fr; gap: 28px; padding: 48px 20px 32px; }
}

/* ── WP Admin Bar offset (admin-only) ── */
body.admin-bar #dd-global-nav {
  top: 32px;
}
body.admin-bar {
  padding-top: 104px !important; /* 72px nav + 32px admin bar */
}
@media screen and (max-width: 782px) {
  body.admin-bar #dd-global-nav {
    top: 46px;
  }
  body.admin-bar {
    padding-top: 118px !important; /* 72px nav + 46px admin bar */
  }
}

/* ── Logo anchor alignment ── */
.ddg-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;
}