/* ============================================
   DIGIDEEPAM — Global Site CSS
   assets/css/site.css
   Covers: CSS variables, navbar, footer, FAB buttons
   ============================================ */
:root {
  --gold: #d4af37;
  --gold-light: #f0c040;
  --gold-dark: #a07820;
  --dark: #0a0b14;
  --dark-2: #0f1020;
  --dark-3: #1a1b2e;
  --dark-4: #252640;
  --white: #ffffff;
  --grey: #8892b0;
  --light: #f8f9ff;
  --card-bg: rgba(26,27,46,0.8);
  --glass: rgba(255,255,255,0.05);
  --border: rgba(212,175,55,0.2);
  --shadow: 0 20px 60px rgba(0,0,0,0.4);
  --radius: 16px;
  --transition: all 0.4s cubic-bezier(0.4,0,0.2,1);
}

.dd-navbar *, .dd-navbar *::before, .dd-navbar *::after,
.dd-footer *, .dd-footer *::before, .dd-footer *::after { box-sizing:border-box; }

/* ===== NAVBAR =====
   IMPORTANT: backdrop-filter is on ::before pseudo-element, NOT on nav itself.
   On iOS Safari, backdrop-filter on a parent causes ALL position:fixed children
   to be clipped to the parent's bounds — making the mobile slide panel invisible.
   Putting blur on ::before avoids this while keeping the frosted-glass look.
===== */
.dd-navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  border-bottom:1px solid rgba(212,175,55,0.1);
  padding:14px 0;
  transition:padding 0.3s ease, box-shadow 0.3s ease;
}
.dd-navbar::before {
  content:'';
  position:absolute; top:0; left:0; right:0; bottom:0;
  background:rgba(10,11,20,0.88);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  z-index:0;
  pointer-events:none;
}
.dd-navbar.scrolled { padding:10px 0; box-shadow:0 8px 32px rgba(0,0,0,0.5); }
.dd-navbar.scrolled::before { background:rgba(10,11,20,0.97); }

.dd-nav-container {
  max-width:1280px; margin:0 auto; padding:0 28px;
  display:flex; align-items:center; justify-content:space-between;
  position:relative; z-index:1;
}
.dd-nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.dd-nav-logo img { height:42px; max-width:200px; object-fit:contain; display:block; }
.dd-nav-logo .text-logo {
  font-family:'Cinzel',serif; font-size:22px; font-weight:900; letter-spacing:1.2px;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}

/* Desktop nav links */
.dd-nav-links { display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.dd-nav-links a {
  color:#cbd5e0; text-decoration:none; font-size:14px; font-weight:500;
  padding:9px 14px; border-radius:8px; transition:color 0.2s, background 0.2s; position:relative;
}
.dd-nav-links a:hover { color:var(--gold); background:rgba(212,175,55,0.06); }
.dd-nav-links a.active { color:var(--gold); }
.dd-nav-links a.active::after {
  content:''; position:absolute; bottom:4px; left:14px; right:14px; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold-light)); border-radius:2px;
}
.dd-nav-links .nav-cta {
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--dark) !important; font-weight:700; padding:9px 18px; margin-left:6px;
  border-radius:50px;
}
.dd-nav-links .nav-cta:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(212,175,55,0.35); }

/* Desktop dropdown */
.dd-nav-links .has-dropdown { position:relative; }
.dd-nav-links .has-dropdown > a .caret { font-size:10px; margin-left:5px; transition:transform 0.3s; }
.dd-nav-links .has-dropdown:hover > a .caret { transform:rotate(180deg); }
.dd-nav-links .dropdown-menu {
  position:absolute; top:calc(100% + 8px); left:50%;
  transform:translateX(-50%) translateY(8px);
  min-width:240px; background:rgba(15,16,32,0.98);
  border:1px solid var(--border); border-radius:14px; padding:10px;
  box-shadow:0 18px 40px rgba(0,0,0,0.5);
  list-style:none; margin:0;
  opacity:0; visibility:hidden; transition:all 0.25s ease;
  z-index:1001;
}
.dd-nav-links .has-dropdown:hover .dropdown-menu,
.dd-nav-links .has-dropdown:focus-within .dropdown-menu {
  opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
}
.dd-nav-links .dropdown-menu li { display:block; }
.dd-nav-links .dropdown-menu a {
  display:flex; align-items:flex-start; gap:12px; padding:12px 14px;
  border-radius:10px; font-size:13.5px; color:#cbd5e0;
}
.dd-nav-links .dropdown-menu a:hover { background:rgba(212,175,55,0.08); color:var(--gold); }
.dd-nav-links .dropdown-menu a i { color:var(--gold); font-size:16px; margin-top:2px; flex-shrink:0; width:18px; text-align:center; }
.dd-nav-links .dropdown-menu a .dd-mi-title { display:block; font-weight:600; color:#fff; margin-bottom:2px; }
.dd-nav-links .dropdown-menu a:hover .dd-mi-title { color:var(--gold); }
.dd-nav-links .dropdown-menu a .dd-mi-sub { display:block; font-size:11.5px; color:var(--grey); }
.dd-nav-links .dropdown-menu a.active { background:rgba(212,175,55,0.06); }
.dd-nav-links .dropdown-menu a.active::after { display:none; }

/* ===== HAMBURGER ===== */
.dd-hamburger {
  display:none; flex-direction:column; gap:5px;
  cursor:pointer; padding:10px 8px;
  background:none; border:none;
  -webkit-tap-highlight-color:transparent;
}
.dd-hamburger span {
  display:block; width:24px; height:2px;
  background:var(--gold); border-radius:2px;
  transition:transform 0.3s ease, opacity 0.2s ease;
  transform-origin:center; pointer-events:none;
}
.dd-hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.dd-hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.dd-hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ===== OVERLAY — sits between page (auto) and nav (1000) ===== */
.dd-nav-overlay {
  display:none;
  position:fixed; top:0; left:0; right:0; bottom:0;
  background:rgba(0,0,0,0.6);
  z-index:998;
}

/* ===== MOBILE PANEL ===== */
@media (max-width:980px) {
  .dd-hamburger { display:flex; }

  /* Panel is a sibling of nav-container visually but position:fixed.
     Because nav NO LONGER has backdrop-filter directly, this fixed child
     is NOT clipped to nav bounds — it covers full viewport as intended. */
  .dd-nav-links {
    position:fixed;
    top:0; right:0; bottom:0;
    width:82%;
    max-width:290px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    list-style:none;
    margin:0;
    padding:68px 14px 40px;
    background:#0c0d1a;
    border-left:1px solid rgba(212,175,55,0.18);
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    z-index:1001;
    -webkit-transform:translateX(110%);
    transform:translateX(110%);
    -webkit-transition:-webkit-transform 0.32s ease;
    transition:transform 0.32s ease;
  }
  .dd-nav-links.open {
    -webkit-transform:translateX(0);
    transform:translateX(0);
  }

  .dd-nav-links > li { border-bottom:1px solid rgba(255,255,255,0.06); }
  .dd-nav-links > li:last-child { border-bottom:none; padding-top:8px; }

  .dd-nav-links a {
    display:flex; align-items:center;
    font-size:15px; font-weight:500;
    padding:14px 10px; border-radius:8px;
    color:#c8d0e0; text-decoration:none;
  }
  .dd-nav-links a.active,
  .dd-nav-links a:active { color:var(--gold); background:rgba(212,175,55,0.08); }
  .dd-nav-links a.active::after { display:none; }
  .dd-nav-links .nav-cta { justify-content:center; margin-top:0; border-radius:50px !important; }

  /* Resources sub-dropdown */
  .dd-nav-links .has-dropdown > a { justify-content:space-between; }
  .dd-nav-links .has-dropdown > a .caret { transition:transform 0.25s ease; }
  .dd-nav-links .has-dropdown.open > a .caret { transform:rotate(180deg); }

  .dd-nav-links .dropdown-menu {
    display:block !important;
    position:static !important;
    transform:none !important;
    opacity:0; visibility:hidden;
    max-height:0; overflow:hidden;
    background:transparent; border:none; box-shadow:none;
    padding:0; margin:0; min-width:0; list-style:none;
    transition:max-height 0.3s ease, opacity 0.2s ease, visibility 0.2s;
  }
  .dd-nav-links .has-dropdown.open .dropdown-menu {
    opacity:1; visibility:visible;
    max-height:260px;
    padding:2px 0 8px 10px;
    margin:0 0 4px;
  }
  .dd-nav-links .dropdown-menu a {
    font-size:13.5px; padding:11px 10px; color:#8892b0; gap:10px;
  }
  .dd-nav-links .dropdown-menu a:active { color:var(--gold); }
  .dd-nav-links .dropdown-menu a i { font-size:13px; width:16px; text-align:center; }
  .dd-nav-links .dropdown-menu .dd-mi-sub { display:none; }
}

/* spacer so content sits below fixed nav */
body { padding-top:78px; background:var(--dark); color:var(--white); font-family:'Inter',sans-serif; margin:0; }
html { scroll-behavior:smooth; }

/* ===== FOOTER ===== */
.dd-footer {
  background:linear-gradient(180deg,var(--dark-2),var(--dark));
  border-top:1px solid var(--border);
  padding:60px 28px 24px;
  margin-top:60px;
}
.dd-footer-grid {
  max-width:1280px; margin:0 auto;
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:50px;
  padding-bottom:40px; border-bottom:1px solid rgba(212,175,55,0.08);
}
.dd-footer-brand .ftr-logo { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.dd-footer-brand .ftr-logo img { height:46px; max-width:220px; object-fit:contain; }
.dd-footer-brand .ftr-logo .text-logo {
  font-family:'Cinzel',serif; font-size:24px; font-weight:900;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.dd-footer-brand p { color:var(--grey); font-size:13px; line-height:1.7; margin-bottom:18px; max-width:340px; }
.dd-footer-socials { display:flex; gap:10px; }
.dd-footer-socials a {
  width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  background:rgba(212,175,55,0.08); border:1px solid var(--border); color:var(--gold);
  text-decoration:none; transition:var(--transition);
}
.dd-footer-socials a:hover { background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:var(--dark); transform:translateY(-2px); }
.dd-footer-col h4 {
  color:var(--white); font-size:14px; font-weight:700; margin-bottom:18px; text-transform:uppercase;
  letter-spacing:1px; position:relative; padding-bottom:10px;
}
.dd-footer-col h4::after {
  content:''; position:absolute; left:0; bottom:0; width:32px; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold-light));
}
.dd-footer-col ul { list-style:none; margin:0; padding:0; }
.dd-footer-col li { margin-bottom:10px; }
.dd-footer-col a { color:var(--grey); text-decoration:none; font-size:13px; transition:var(--transition); display:inline-flex; align-items:center; gap:8px; }
.dd-footer-col a:hover { color:var(--gold); transform:translateX(3px); }
.dd-footer-col a i { color:var(--gold); width:14px; }
.dd-footer-bottom {
  max-width:1280px; margin:24px auto 0; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
  color:var(--grey); font-size:12px;
}
.dd-footer-bottom a { color:var(--gold); text-decoration:none; }
@media (max-width:880px) {
  .dd-footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
}
@media (max-width:520px) {
  .dd-footer-grid { grid-template-columns:1fr; }
  .dd-footer-bottom { flex-direction:column; text-align:center; }
}

/* ===== FLOATING ACTION BUTTONS ===== */
.fab-container { position:fixed; bottom:24px; right:24px; z-index:999; display:flex; flex-direction:column; gap:10px; }
.fab-btn {
  width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  text-decoration:none; box-shadow:0 6px 20px rgba(0,0,0,0.4); transition:var(--transition);
}
.fab-btn.fab-top { background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:var(--dark); }
.fab-btn.fab-wa { background:#25D366; color:#fff; }
.fab-btn.fab-book { background:linear-gradient(135deg,#6c5ce7,#a29bfe); color:#fff; }
.fab-btn:hover { transform:translateY(-3px) scale(1.05); }
