/* ============================================================
   AVERON LABS - unified "pill" theme for the whole site
   Same look as the "Book a Scoping Call" pill and the nav bar:
   near-black surface, deep-red border, white text, red accents,
   lift + red glow on hover. Works in light and dark mode.
   ============================================================ */
:root {
  --pill-bg: #0c0d10;
  --pill-bg-2: #1b1d22;
  --pill-border: #7f1220;
  --pill-red: #e11d2e;
  --pill-red-bright: #ff3b3b;
  --pill-glow: rgba(225, 29, 46, 0.4);
  --pill-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
  --card-edge: rgba(225, 29, 46, 0.28);
  --card-shadow: 0 10px 28px rgba(15, 15, 20, 0.08);
}
[data-theme="dark"] {
  --card-edge: #7f1220;
  --card-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
}

/* ---------- Buttons: dark pill, red border ---------- */
.btn-primary, .btn-premium, .btn-send, .btn.btn-primary,
.hero-cover .btn-outline, .btn-outline {
  background: linear-gradient(135deg, var(--pill-bg) 0%, var(--pill-bg-2) 100%);
  color: #fff;
  border: 1px solid var(--pill-border);
  border-radius: 50px;
  font-weight: 700;
  box-shadow: var(--pill-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease, border-color .3s ease, background .3s ease, color .3s ease;
}
.btn-primary i, .btn-premium i, .btn-send i, .btn-outline i { color: var(--pill-red-bright); transition: transform .35s cubic-bezier(.34,1.56,.64,1); }
.btn-primary:hover, .btn-premium:hover, .btn-send:hover,
.btn-outline:hover, .hero-cover .btn-outline:hover,
[data-theme="dark"] .hero-cover .btn-outline:hover {
  background: linear-gradient(135deg, var(--pill-bg) 0%, var(--pill-bg-2) 100%);
  color: #fff;
  border-color: var(--pill-red-bright);
  box-shadow: 0 18px 36px var(--pill-glow);
  transform: translateY(-3px) scale(1.03);
}
.btn-primary:hover i, .btn-premium:hover i, .btn-send:hover i { transform: translateX(4px); color: #fff; }
.btn:active { transform: translateY(-1px) scale(.98); }
/* outline buttons on plain page backgrounds */
.btn-outline { background: transparent; color: var(--text, #0c0d10); box-shadow: none; }
.btn-outline:hover { background: var(--pill-bg); color: #fff; }
[data-theme="dark"] .btn-outline { color: #fff; background: rgba(12, 13, 16, 0.6); }
.hero-cover .btn-outline,
[data-theme="dark"] .hero-cover .btn-outline {
  color: #fff;
  background: rgba(12, 13, 16, 0.85);
  border: 1px solid var(--pill-border);
}

/* ---------- Badges / tags / chips: small pills ---------- */
.badge, .sub-badge, .blog-sub-badge, .item-badge, .pricing-badge, .author-tag, .skill-tag, .tech-chip {
  background: var(--pill-bg);
  color: #ff6b6b;
  border: 1px solid var(--pill-border);
  border-radius: 50px;
  font-weight: 700;
  box-shadow: none;
}
.hero-cover .badge { background: rgba(12, 13, 16, 0.85); color: #ff6b6b; backdrop-filter: blur(6px); }
.badge i, .sub-badge i, .pricing-badge i, .tech-chip i { color: var(--pill-red-bright); }

/* ---------- Tech chips: keep text readable on hover / tap ---------- */
.tech-chip:hover, .tech-chip:focus-visible, .tech-chip:active {
  background: linear-gradient(135deg, var(--pill-red), var(--pill-border)) !important;
  border-color: var(--pill-red-bright) !important;
  color: #fff !important;
  box-shadow: 0 14px 26px var(--pill-glow);
  transform: translateY(-5px);
}
.tech-chip:hover i, .tech-chip:focus-visible i, .tech-chip:active i { color: #fff !important; }
.tech-tab, .filter-btn {
  background: var(--pill-bg);
  color: #fff;
  border: 1px solid var(--pill-border);
  border-radius: 50px;
  font-weight: 700;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), border-color .3s ease, box-shadow .3s ease;
}
.tech-tab:hover, .filter-btn:hover { border-color: var(--pill-red-bright); box-shadow: 0 14px 28px var(--pill-glow); transform: translateY(-2px); }
.tech-tab.active, .tech-tab[aria-selected="true"], .filter-btn.active {
  background: linear-gradient(135deg, var(--pill-red), var(--pill-border));
  border-color: var(--pill-red-bright);
  color: #fff;
}

/* ---------- Cards: black/white surface + deep-red edge ---------- */
.card, .p-card, .blog-card, .job-card, .service-category-card, .service-item-card,
.cta-card, .policy-card, .mq-card, .apply-cta-card, .pricing-card, .contact-form-card,
.modal-box, .tech-tabs-shell {
  border: 1px solid var(--card-edge) !important;
  box-shadow: var(--card-shadow);
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), border-color .3s ease, box-shadow .3s ease;
}
.card:hover, .p-card:hover, .blog-card:hover, .job-card:hover, .service-category-card:hover,
.service-item-card:hover, .cta-card:hover, .policy-card:hover, .mq-card:hover,
.apply-cta-card:hover, .pricing-card:hover {
  border-color: var(--pill-red-bright) !important;
  box-shadow: 0 18px 36px var(--pill-glow);
  transform: translateY(-4px);
}
.p-glow { background: var(--pill-red); }
/* Privacy-policy card hover glow was filling the whole card solid red and hiding the text - disabled */
.card-glow { display: none !important; }

/* ---------- Forms ---------- */
input:focus, textarea:focus, select:focus {
  border-color: var(--pill-red-bright) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(225, 29, 46, 0.2);
}
:focus-visible { outline-color: var(--pill-red-bright); }

/* ---------- Footer + hero ---------- */
.footer { background: #08090b; border-top: 1px solid var(--pill-border); }
.hero-cover-overlay { background: linear-gradient(90deg, rgba(8,9,11,.9) 0%, rgba(8,9,11,.65) 45%, rgba(8,9,11,.2) 100%) !important; }
@media (max-width: 640px) { .hero-cover-overlay { background: rgba(8,9,11,.8) !important; } }
::selection { background: var(--pill-red); color: #fff; }