/* =====================================================
   GLOBAL.CSS — Header e Footer para todo o site
   Guia de Apps · Astra Child Theme
   ===================================================== */

/* ─── TOKENS ─── */
:root {
  --violet:    #4a1fa8;
  --purple:    #6b21d4;
  --purple-lt: #7c3aed;
  --cyan:      #22d3ee;
  --cyan-dk:   #06b6d4;
  --gold:      #f59e0b;
  --ink:       #0f0a1a;
  --ink2:      #1e1632;
  --ink3:      #5a5270;
  --rule:      #e5e0f0;
  --bg:        #f7f5fc;
  --white:     #ffffff;
  --ff-head:   'Exo 2', sans-serif;
  --ff-body:   'DM Sans', sans-serif;
  --max:       1200px;
  --pad:       16px;
  --cat-tech:    #4a1fa8;
  --cat-gadget:  #0891b2;
  --cat-soft:    #059669;
  --cat-apps:    #7c3aed;
  --cat-games:   #dc2626;
  --cat-esports: #ea580c;
}

/* ─── TOP BAR ─── */
.gda-topbar {
  background: var(--ink2);
  color: #9e8fc0;
  font-size: .72rem;
  padding: 5px 0;
  font-family: var(--ff-body);
}
.gda-topbar .wrap { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.gda-topbar-links { display: flex; gap: 16px; }
.gda-topbar-links a { color: #9e8fc0; transition: color .15s; }
.gda-topbar-links a:hover { color: var(--cyan); }

/* ─── HEADER ─── */
.gda-header {
  background: linear-gradient(135deg, var(--violet) 0%, var(--purple) 100%);
  position: sticky;
  top: 0;
  z-index: 300;
  box-shadow: 0 2px 20px rgba(74,31,168,.4);
}
.gda-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  gap: 20px;
}

/* Logo */
.gda-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.gda-logo-mark {
  width: 40px; height: 40px;
  background: rgba(255,255,255,.15);
  border: 2px solid rgba(255,255,255,.25);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; font-weight: 900;
  color: var(--cyan);
  font-family: var(--ff-head);
  letter-spacing: -.05em;
}
.gda-logo-text {
  font-family: var(--ff-head);
  font-size: 1.35rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.01em;
  line-height: 1;
}
.gda-logo-text span { color: var(--cyan); }
.gda-logo-sub { font-size: .62rem; color: rgba(255,255,255,.55); letter-spacing: .05em; text-transform: uppercase; }

/* Search */
.gda-search-bar { flex: 1; max-width: 360px; position: relative; }
.gda-search-bar input {
  width: 100%;
  background: rgba(255,255,255,.12);
  border: 1.5px solid rgba(255,255,255,.2);
  border-radius: 6px;
  padding: 8px 36px 8px 14px;
  font-family: var(--ff-body);
  font-size: .85rem;
  color: #fff;
  outline: none;
  transition: border-color .2s, background .2s;
}
.gda-search-bar input::placeholder { color: rgba(255,255,255,.5); }
.gda-search-bar input:focus { border-color: var(--cyan); background: rgba(255,255,255,.18); }
.gda-search-bar button {
  position: absolute; right: 10px; top: 50%;
  transform: translateY(-50%);
  background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,.6); font-size: 1rem; line-height: 1; padding: 0;
}
.gda-search-bar button:hover { color: var(--cyan); }

.gda-header-cta {
  background: var(--cyan);
  color: var(--ink) !important;
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: .85rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 9px 18px;
  border-radius: 5px;
  white-space: nowrap;
  transition: opacity .2s;
}
.gda-header-cta:hover { opacity: .85; }

/* ─── MEGA NAV ─── */
.gda-nav-wrap {
  background: rgba(0,0,0,.25);
  border-top: 1px solid rgba(255,255,255,.08);
}
.gda-main-nav {
  display: flex;
  align-items: stretch;
  height: 44px;
  overflow-x: auto;
  scrollbar-width: none;
  position: relative;
  margin: 0;
  padding: 0;
}
.gda-main-nav::-webkit-scrollbar { display: none; }
.gda-main-nav > li { display: flex; position: relative; list-style: none; }
.gda-main-nav > li > a {
  display: flex; align-items: center; gap: 5px;
  padding: 0 16px;
  font-family: var(--ff-head);
  font-weight: 700; font-size: .88rem;
  letter-spacing: .04em; text-transform: uppercase;
  color: rgba(255,255,255,.75);
  border-bottom: 3px solid transparent;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.gda-main-nav > li > a:hover,
.gda-main-nav > li.active > a { color: #fff; border-bottom-color: var(--cyan); }
.gda-main-nav > li:first-child > a { padding-left: 0; }
.gda-arrow { font-size: .6rem; opacity: .7; }

/* Dropdown */
.gda-dropdown {
  position: absolute; top: 100%; left: 0;
  background: var(--white);
  border: 1px solid var(--rule);
  border-top: 3px solid var(--cyan);
  border-radius: 0 0 8px 8px;
  min-width: 240px;
  box-shadow: 0 12px 32px rgba(0,0,0,.15);
  opacity: 0; pointer-events: none;
  transform: translateY(-6px);
  transition: opacity .2s, transform .2s;
  z-index: 400;
  margin: 0; padding: 0;
}
.gda-main-nav > li:hover .gda-dropdown { opacity: 1; pointer-events: all; transform: translateY(0); }
.gda-dropdown a {
  display: block;
  padding: 10px 18px;
  font-size: .85rem;
  font-weight: 500;
  color: var(--ink2);
  border-bottom: 1px solid var(--rule);
  transition: background .15s, color .15s;
}
.gda-dropdown a:last-child { border-bottom: none; }
.gda-dropdown a:hover { background: var(--bg); color: var(--purple); }
.gda-dropdown a span { font-size: .7rem; color: var(--ink3); margin-left: 4px; }

/* ─── TICKER ─── */
.gda-ticker {
  background: var(--cyan-dk);
  display: flex; align-items: center; height: 32px; overflow: hidden;
}
.gda-ticker-label {
  background: var(--ink2);
  font-family: var(--ff-head);
  font-weight: 800; font-size: .75rem;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--cyan);
  padding: 0 14px; height: 100%;
  display: flex; align-items: center;
  flex-shrink: 0; white-space: nowrap;
}
.gda-ticker-track {
  display: flex; align-items: center; height: 100%;
  animation: gda-tick 32s linear infinite;
  white-space: nowrap;
}
.gda-ticker-track:hover { animation-play-state: paused; }
.gda-ticker-track a {
  font-size: .8rem; font-weight: 600;
  color: var(--ink); padding: 0 22px;
  border-right: 1px solid rgba(0,0,0,.15);
  line-height: 32px; transition: opacity .2s;
}
.gda-ticker-track a:hover { opacity: .7; }
@keyframes gda-tick {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ─── FOOTER ─── */
.gda-footer { background: var(--ink2); color: #8a7baa; padding: 40px 0 0; margin-top: 40px; font-family: var(--ff-body); }
.gda-footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.gda-footer-brand .gda-logo-text { font-size: 1.3rem; }
.gda-footer-brand p { font-size: .8rem; line-height: 1.65; margin-top: 12px; max-width: 230px; }
.gda-footer-social { display: flex; gap: 8px; margin-top: 14px; }
.gda-s-btn {
  width: 32px; height: 32px; border-radius: 5px;
  background: rgba(255,255,255,.07);
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; transition: background .15s;
  color: #fff;
}
.gda-s-btn:hover { background: var(--purple); }
.gda-footer-col h4 {
  font-family: var(--ff-head); font-size: .82rem;
  font-weight: 800; text-transform: uppercase;
  letter-spacing: .1em; color: #fff; margin-bottom: 14px;
}
.gda-footer-col ul { display: flex; flex-direction: column; gap: 8px; list-style: none; margin: 0; padding: 0; }
.gda-footer-col ul a { font-size: .8rem; color: #8a7baa; transition: color .15s; }
.gda-footer-col ul a:hover { color: var(--cyan); }
.gda-footer-bottom {
  padding: 16px 0;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px;
}
.gda-footer-bottom p { font-size: .73rem; }
.gda-fb-links { display: flex; gap: 16px; }
.gda-fb-links a { font-size: .73rem; color: #8a7baa; transition: color .15s; }
.gda-fb-links a:hover { color: #fff; }

/* ─── RESPONSIVO (Header/Footer) ─── */
@media (max-width: 640px) {
  .gda-search-bar,
  .gda-header-cta { display: none; }
  .gda-footer-grid { grid-template-columns: 1fr; }
}
@media (max-width: 1024px) {
  .gda-footer-grid { grid-template-columns: 1fr 1fr; }
}