/* FutraDay — shared frosted-card material.
   Based on the homepage's dark, lightly lime-tinted studio-proof glass.
   Only FutraDay pages load this file; independent showroom demo brands do not.
   Keep navigation, media artwork, buttons, status messages and form inputs distinct. */
:root {
  --fd-glass-surface: linear-gradient(
    145deg,
    rgba(8, 11, 9, .96) 0%,
    rgba(6, 9, 7, .97) 52%,
    rgba(4, 7, 5, .98) 100%
  );
  --fd-glass-stroke: rgba(230, 234, 232, .16);
  --fd-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, .085);
  --fd-glass-depth: 0 20px 58px rgba(0, 0, 0, .24);
  --fd-glass-radius: 16px;
}

/* Real content cards across homepage, service pages, case studies, pricing,
   blog, contact, reviews, free plans, ScopeBot and trust pages. */
:is(
  .card,
  .lab-card,
  .acquisition-card,
  .acquisition-includes,
  .contact-form,
  .audit-runner,
  .website-price-card,
  .pg-pkg,
  .pg-cta,
  .studio-proof,
  .case-study-step-grid > article,
  .process-grid > div,
  .roi-controls,
  .roi-results,
  .pg-fact,
  .plan-step,
  .proof-grid > div,
  .fit-card,
  .review-panel,
  .futra-review-info,
  .sb-panel,
  .sb-field,
  .sb-conversion,
  .case-study-facts > div,
  .roi-result-highlight,
  .hero-job-card,
  .review-publication,
  .homepage-faq-list details,
  .faq-list details
) {
  background: var(--fd-glass-surface) !important;
  border: 1px solid var(--fd-glass-stroke) !important;
  border-radius: var(--fd-glass-radius) !important;
  box-shadow: var(--fd-glass-highlight), var(--fd-glass-depth) !important;
  -webkit-backdrop-filter: blur(16px) saturate(120%);
  backdrop-filter: blur(16px) saturate(120%);
}

/* ScopeBot has a legacy high-specificity opaque override. */
html body.scopebot-page .scopebot :is(.sb-panel, .sb-field, .sb-conversion) {
  background: var(--fd-glass-surface) !important;
}

/* Keep the audit scanner's form on the same shared smoked-glass surface.
   Its bundled audit CSS previously added a separate, greener gradient. */
html body .audit-page .audit-runner {
  background: var(--fd-glass-surface) !important;
  border-color: var(--fd-glass-stroke) !important;
}
html body .audit-page .audit-runner::before {
  content: none !important;
}

/* Pricing fact cards are separate panels; don't expose the old green-grey
   grid background in the gaps between otherwise matching glass cards. */
html body .pricing-guide .pg-facts {
  background: transparent !important;
  border: 0 !important;
}

/* Keep cards composed as separate surfaces rather than joined dark slabs. */
.case-study-step-grid,
.case-study-facts,
.pg-facts {
  gap: 14px;
}
.case-study-step-grid {
  border: 0 !important;
}
.case-study-facts > div {
  padding: 18px 20px !important;
}
.case-study-step-grid > article {
  min-width: 0;
}
.pg-facts {
  border: 0 !important;
}
.card-grid > .card {
  min-width: 0;
}

/* Lift only cards that are intended as interactive surfaces. */
:is(.lab-card, .acquisition-card, .website-price-card, .card > a:focus-visible) {
  transition: border-color .2s ease, box-shadow .2s ease;
}
:is(.lab-card, .acquisition-card, .website-price-card):hover {
  border-color: rgba(224, 242, 228, .26) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11),
    0 25px 68px rgba(0, 0, 0, .28) !important;
}

/* Readability and performance on phones. */
@media (max-width: 600px) {
  :is(.card, .lab-card, .acquisition-card, .website-price-card,
      .pg-pkg, .pg-cta, .studio-proof, .pg-fact, .plan-step, .proof-grid > div, .fit-card) {
    -webkit-backdrop-filter: blur(10px) saturate(110%);
    backdrop-filter: blur(10px) saturate(110%);
  }
}

/* Keep cards legible if glass blur is unsupported or disabled. */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  :is(.card, .lab-card, .acquisition-card, .acquisition-includes, .contact-form, .audit-runner,
      .website-price-card, .pg-pkg, .pg-cta, .studio-proof, .case-study-step-grid > article, .process-grid > div,
      .roi-controls, .roi-results, .pg-fact, .plan-step, .proof-grid > div,
      .fit-card, .review-panel, .futra-review-info, .sb-panel, .sb-field, .sb-conversion, .case-study-facts > div, .roi-result-highlight, .review-publication, .hero-job-card,
      .homepage-faq-list details, .faq-list details) {
    background: #070a08 !important;
  }
}
@media (prefers-reduced-transparency: reduce) {
  :is(.card, .lab-card, .acquisition-card, .acquisition-includes, .contact-form, .audit-runner,
      .website-price-card, .pg-pkg, .pg-cta, .studio-proof, .case-study-step-grid > article, .process-grid > div,
      .roi-controls, .roi-results, .pg-fact, .plan-step, .proof-grid > div,
      .fit-card, .review-panel, .futra-review-info, .sb-panel, .sb-field, .sb-conversion, .case-study-facts > div, .roi-result-highlight, .review-publication, .hero-job-card,
      .homepage-faq-list details, .faq-list details) {
    background: #070a08 !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}


/* One restrained brand accent for actual FutraDay content cards.
   Keep inputs, buttons, nav elements, footer columns, tables and demo brands clear. */
:root { --fd-card-dash: #b8ff2c; }
:is(
  .card, .lab-card, .acquisition-card, .acquisition-includes,
  .contact-form, .audit-runner, .website-price-card, .pg-pkg, .pg-cta,
  .studio-proof, .case-study-step-grid > article, .process-grid > div,
  .roi-controls, .roi-results, .roi-result-highlight,
  .pg-fact, .plan-step, .proof-grid > div, .fit-card, .review-panel,
  .futra-review-info, .sb-panel, .sb-field, .sb-conversion,
  .case-study-facts > div, .hero-job-card, .review-publication,
  .homepage-faq-list details, .faq-list details
) {
  position: relative;
}
:is(
  .card, .lab-card, .acquisition-card, .acquisition-includes,
  .contact-form, .audit-runner, .website-price-card, .pg-pkg, .pg-cta,
  .studio-proof, .case-study-step-grid > article, .process-grid > div,
  .roi-controls, .roi-results, .roi-result-highlight,
  .pg-fact, .plan-step, .proof-grid > div, .fit-card, .review-panel,
  .futra-review-info, .sb-panel, .sb-field, .sb-conversion,
  .case-study-facts > div, .hero-job-card, .review-publication,
  .homepage-faq-list details, .faq-list details
)::after {
  content: "" !important;
  position: absolute;
  top: 0;
  left: 22px;
  width: 50px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: linear-gradient(90deg, var(--fd-card-dash), rgba(184,255,44,.20));
  box-shadow: 0 0 5px rgba(184,255,44,.075);
  opacity: .95;
  pointer-events: none;
  z-index: 1;
}
/* Blog cards previously had a second top rule; avoid duplicated accents. */
html body .card-grid > .card::before { content: none !important; }