/*
Theme Name: Avvyd Solutions
Theme URI: https://avvyd.solutions
Author: Avvyd Solutions
Author URI: https://avvyd.solutions
Description: A high-tech AI-embedded app development company theme — fuchsia/magenta primary with deep blue-purple supporting palette.
Version: 2.0.16
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: avvyd-solutions
Tags: technology, ai, dark, modern, one-page

/* ============================================================
   VERSION HISTORY
   ------------------------------------------------------------
   1.0.0  Initial theme — structure, CSS, PHP templates,
          hero, services, about, process, portfolio,
          testimonials, contact, footer
   1.1.0  Added blue/purple color spectrum
   1.2.0  BiD color system integration — exact BiD tokens
          (#6366f1, #7c3aed, navy depth scale)
   1.3.0  Adobe Stock graphics integrated — 19 images
          across all sections
   1.4.0  Site title, favicon/logo, real contact info
          (hello@avvyd.ai, KC address, 816-533-5509)
   1.5.0  Replaced placeholder sections — fake stats →
          What We Believe; fake portfolio → AI Impact;
          fake testimonials → Early Adopter trust
   1.6.0  BiD product page (page-bid.php) — features,
          competitor comparison table, pricing tiers,
          AI credits explainer, FAQ
   1.7.0  BiD homepage buttons updated (Learn More →
          product page, Launch BiD → app); BiD added
          to fallback nav menu
   2.0.0  Product company pivot — front-page rewritten
          for software product co. positioning; Products
          section (BiD live, Aissign + Inkindr coming soon);
          Product Philosophy replaces Services; Notify
          early access section; Blog infrastructure
          (archive.php, index.php, single.php); SEO meta
          tags, Open Graph, Twitter Card, JSON-LD structured
          data; 5 default blog categories auto-registered
   2.0.0  Product company pivot — front-page rewritten
          for software product co. positioning; Products
          section (BiD live, Aissign + Inkindr coming soon);
          Product Philosophy replaces Services; Notify
          early access section; Blog infrastructure
          (archive.php, index.php, single.php); SEO meta
          tags, Open Graph, Twitter Card, JSON-LD structured
          data; 5 default blog categories auto-registered
   1.8.0  Legal & security pages added — Privacy Policy,
          Terms of Service, Acceptable Use Policy, EULA,
          Security & Trust (page-privacy.php,
          page-terms.php, page-aup.php, page-eula.php,
          page-security.php, legal-styles.php);
          footer legal links updated; security trust
          bar added to BiD product page
   2.0.7  Blog Index page template (page-blog.php) — a
          standalone blog landing page listing all published
          posts with pagination, independent of the Reading
          "Posts page" setting; Blog nav links (header +
          footer) repointed to /blog/; theme JSON-LD
          (Organization, WebSite, BlogPosting) suppressed when
          an SEO plugin (Yoast/Rank Math/AIOSEO) is active to
          avoid duplicate schema — SoftwareApplication on the
          BiD page is retained
   2.0.8  Favicon updated to the flat fuchsia brand mark —
          regenerated assets/icons/ (favicon.ico multi-res
          16/32/48, favicon-16/32/48/512.png,
          apple-touch-icon-180.png, favicon.svg) from the new
          brand mark; replaces the previous gradient icon
   2.0.9  BID-66 — BiD product page FAQ + trust updates:
          removed stale Free-tier references from the trial
          and cancellation FAQ answers (Free tier was retired
          in v2.0.5); added FAQ items for data security/
          privacy, SSO (roadmap), and accessibility (WCAG 2.1
          AA / Section 508, in progress — no compliance
          claim); reworded the security trust bar to vendor-
          agnostic "enterprise-grade cloud infrastructure that
          maintains SOC 2 and ISO 27001 certifications" and
          removed named-vendor list; SSO marked as roadmap in
          the Enterprise plan note; added ungated FAQPage
          JSON-LD (functions.php) mirroring on-page FAQ text
   2.0.10 BID-68 (cont.) — obfuscated the tech stack on the
          Security & Trust page (page-security.php): replaced
          named vendors (Supabase / Vercel / Anthropic / Stripe)
          throughout the vendor certs bar, body copy, compliance
          table, and the "Vendor-by-Vendor Certifications"
          section with generic provider-role labels (Cloud
          Database & Storage, Application Hosting & Edge, AI
          Processing, Payment Processing); kept all certification
          specifics (SOC 2 Type 2, ISO 27001:2022, ISO 42001,
          PCI DSS L1, HIPAA-eligible) attributed to roles;
          removed outbound vendor trust-center links; renamed
          the section to "Infrastructure Certifications"
   2.0.11 Blog pagination fix (page-blog.php) — pager links no
          longer point to the last post on the page; reset post
          data before building the pager and anchored the
          paginate_links base to the Blog page via
          get_permalink( get_queried_object_id() ), so links
          correctly resolve to /blog/page/N/
   2.0.12 BID-83 Phase E — campaign entry points + Recompete
          Radar. All 11 trial CTAs repointed from bare
          bid.avvyd.app (which opens the Sign In card and leaks
          conversions) to bid.avvyd.app/freetrial, which opens
          directly on Create Account — front-page.php,
          page-bid.php (hero, solution, 3 pricing cards, final
          CTA), page-security.php, page-blog.php, index.php,
          single.php; genuine "Launch app" sign-in links in
          footer.php and front-page.php deliberately left on the
          bare URL. Recompete Radar (free) added as a free TOOL,
          not a pricing tier and not a reinstatement of the Free
          plan retired in v2.0.5 — secondary hero CTA plus a
          dedicated section on page-bid.php, and a new landing
          page template page-recompete.php (assign to slug
          recompete-radar) targeting recompete search terms.
          BiD FAQ: trial answer now names /freetrial and the
          Continue with Microsoft option (BID-88 — M365 tenants
          may silently quarantine the confirmation email); new
          "Is there a free version of BiD?" answer states plainly
          that there is no free plan, only one free tool. FAQPage
          JSON-LD in functions.php updated to mirror both, and a
          second FAQPage block added for the Radar page, gated on
          the page template. HubSpot tracking code installed
          (portal 6217758) so native Original Source can
          distinguish website leads from the cold-email campaign,
          since bid_lead_source is hardcoded to the product.
          Theme assets now cache-bust on the real theme version
          instead of a hardcoded 1.0.0.
   2.0.13 Homepage placement for Recompete Radar — a free-tool
          band (front-page.php, section #free-tool) between the
          BiD featured-product section and the early-access
          notify block. v2.0.12 scoped the Radar plug to the BiD
          product page plus a footer link, which left the
          highest-traffic page carrying it only in the footer.
          Same framing as everywhere else: a free tool, not a
          reinstated free plan, and not part of BiD pricing.
          Also adds hero art to the Recompete Radar landing page
          (assets/images/recompete-radar-hero.jpg — a radar-sweep
          image, 2400x900/228KB, downscaled from an 8000px
          source) as a full-bleed decorative CSS background. Two
          overlay layers: a dark ramp that keeps the headline
          legible over the scan wedge, and a violet/indigo wash
          that pulls the image's cool blue toward the Avvyd
          palette. On mobile the art drops to 0.35 opacity behind
          a flat scrim so it reads as texture, not competition.
   2.0.14 Adds a small decorative radar-sweep graphic to the
          homepage Recompete Radar band (front-page.php,
          assets/images/recompete-radar-mark.jpg — 900x450/69KB,
          cropped from an 8000px source to keep the sweep apex).
          The band becomes copy-plus-buttons on the left and the
          graphic on the right, collapsing to a single column on
          narrow screens. Empty alt — the image shows no real data.
          The Recompete Radar landing page hero is UNCHANGED from
          v2.0.13 — the funnel image stays.
   2.0.15 Adds evergreen "Guides for GovCon BD Teams" internal-link
          sections to the homepage (front-page.php, section #guides,
          after Latest Insights, before the CTA) and the BiD product
          page (page-bid.php, section #bid-guides, before the CTA).
          Six hand-picked pillar posts each, so Google finds the
          core guides from the two strongest indexed pages instead
          of only the three newest posts. Applied live Sep 24, 2026
          via Theme File Editor; this zip brings the source in line.
   2.0.16 BID-117 Security & Trust page (page-security.php) rewritten
          so every statement is true in production as of Sep 25,
          2026. Each control carries an Active / In progress
          badge. New sections: Staff Access (named accounts + MFA,
          60-minute support sessions with written reason, in-app
          owner/admin notice, customer Access Log with CSV,
          append-only log, scope note on direct database access)
          and #firewall (Avvyd is a DBA of Aspis, LLC; Aspis' CEO
          is the sole administrator; Aspis orgs are ordinary
          tenants). Removed: "every protection is active", "all
          access is logged", "does not share infrastructure with
          Aspis", 128-bit randomUUID intake-token claim, 120-second
          signed-URL figure, GDPR "data residency controls". Isolation
          test date cited (Sep 25, 2026, staging). SSO moved from
          roadmap to live. Contacts: security@ and legal@avvyd.ai.
          Also page-bid.php + functions.php FAQ JSON-LD: SSO is live
          (Microsoft Entra ID, every plan), no longer "roadmap".
   ============================================================ */

/* =========================================
   AVVYD SOLUTIONS — WORDPRESS THEME v1.2
   Primary:   Fuchsia / Magenta  (#FF007F)
   Supporting: BiD Indigo/Violet (#6366f1, #7c3aed)
               BiD Navy depths   (#020810 → #0a1628)
   Neutral:   Slate text scale   (#f1f5f9 → #334155)
   ========================================= */

:root {
  /* ── Fuchsia / Magenta  (Avvyd primary brand) ── */
  --fuchsia:         #FF007F;
  --fuchsia-light:   #FF4DA6;
  --fuchsia-dim:     #CC0066;
  --fuchsia-glow:    rgba(255, 0, 127, 0.13);
  --fuchsia-glow-lg: rgba(255, 0, 127, 0.20);

  /* ── Indigo / Violet  (BiD accent — exact values) ── */
  --indigo:          #6366f1;   /* --bid-accent */
  --indigo-light:    #818cf8;   /* one step lighter */
  --indigo-dark:     #4f46e5;   /* one step darker */
  --violet:          #7c3aed;   /* --bid-accent-dark */
  --violet-light:    #a78bfa;
  --violet-dim:      #5b21b6;
  --indigo-glow:     rgba(99, 102, 241, 0.15);   /* --bid-accent-glow approx */
  --indigo-border:   rgba(99, 102, 241, 0.20);   /* --bid-accent-border approx */
  --violet-glow:     rgba(124, 58, 237, 0.18);

  /* ── Blue-Cyan  (BiD info / on-hold stage) ── */
  --cyan:            #06b6d4;   /* --bid-info / --bid-type-rfi */
  --blue:            #3b82f6;   /* --bid-stage-onhold */
  --blue-glow:       rgba(59, 130, 246, 0.15);

  /* ── Background Depths  (BiD navy scale, exact) ── */
  --black:           #000000;
  --black-deep:      #020810;   /* --bid-bg-deep — the true floor */
  --black-base:      #0a1628;   /* --bid-bg-base — panels */
  --black-surface:   #0f172a;   /* --bid-bg-surface — inputs */
  --black-raised:    #1e293b;   /* --bid-bg-raised — hover states */
  --black-subtle:    #334155;   /* --bid-bg-subtle — secondary borders */
  /* Aliases used in older rules — mapped to BiD equivalents */
  --black-card:      #0a1628;
  --black-card-alt:  #0f172a;
  --black-border:    #1e293b;
  --black-border-hi: #334155;

  /* ── Text Scale  (BiD slate tokens, exact) ── */
  --white:           #f1f5f9;   /* --bid-text-primary  (warm white, not pure) */
  --white-pure:      #FFFFFF;
  --grey-bright:     #e2e8f0;   /* --bid-text-secondary */
  --grey-soft:       #94a3b8;   /* --bid-text-muted */
  --grey-faint:      #64748b;   /* --bid-text-faint */
  --grey-ghost:      #475569;   /* --bid-text-ghost */
  --grey-muted:      #334155;   /* --bid-text-dim */

  /* ── Gradients ── */
  --grad-brand:      linear-gradient(135deg, var(--fuchsia), var(--violet));
  --grad-indigo:     linear-gradient(135deg, var(--violet), var(--indigo));  /* --bid-accent-gradient */
  --grad-full:       linear-gradient(135deg, var(--fuchsia), var(--violet), var(--indigo));
  --grad-hero-text:  linear-gradient(90deg, var(--fuchsia), var(--violet-light), var(--indigo-light));
  --grad-orb-warm:   radial-gradient(circle, rgba(255,0,127,0.25) 0%, rgba(124,58,237,0.12) 50%, transparent 70%);
  --grad-orb-cool:   radial-gradient(circle, rgba(124,58,237,0.20) 0%, rgba(99,102,241,0.10) 50%, transparent 70%);
  --grad-auth-bg:    radial-gradient(ellipse at 30% 20%, #1e1040 0%, #020810 60%); /* BiD auth screen */

  /* ── Fonts ── */
  --font-display: 'Syne', sans-serif;
  --font-body:    'DM Sans', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  /* ── Shape ── */
  --radius-sm: 4px;
  --radius-md: 12px;
  --radius-lg: 24px;

  /* ── Motion ── */
  --transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);

  /* ── Glows ── */
  --glow-fuchsia:    0 0 32px rgba(255, 0, 127, 0.45);
  --glow-fuchsia-sm: 0 0 14px rgba(255, 0, 127, 0.28);
  --glow-indigo:     0 0 32px rgba(99, 102, 241, 0.40);
  --glow-indigo-sm:  0 0 14px rgba(99, 102, 241, 0.28);
  --glow-violet:     0 0 32px rgba(124, 58, 237, 0.40);
  --glow-blue-sm:    0 0 14px rgba(59, 130, 246, 0.28);
  /* Legacy aliases */
  --glow:            var(--glow-fuchsia);
  --glow-sm:         var(--glow-fuchsia-sm);
  /* old purple aliases → remap to indigo/violet */
  --purple:          var(--violet);
  --purple-light:    var(--violet-light);
  --purple-dim:      var(--violet-dim);
  --purple-glow:     var(--violet-glow);
  --blue-light:      #818cf8;   /* indigo-light stands in for blue-light visually */
  --blue-dim:        var(--violet-dim);
  --blue-deep:       var(--black-base);
}

/* ── Reset ──────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  background: var(--black-deep);
  color: var(--white);
  font-family: var(--font-body);
  font-weight: 400;
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  /* BiD-matched atmospheric depth: indigo bloom top-right, violet whisper bottom-left */
  background-image:
    radial-gradient(ellipse 110% 55% at 85% -5%, rgba(99,102,241,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 70% 45% at -5% 85%,  rgba(124,58,237,0.06) 0%, transparent 55%);
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--fuchsia); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--fuchsia-light); }

/* ── Typography ─────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.8rem, 7vw, 5.5rem); }
h2 { font-size: clamp(2rem, 4.5vw, 3.2rem); }
h3 { font-size: clamp(1.3rem, 2.5vw, 1.8rem); }
h4 { font-size: 1.25rem; }

p { font-size: 1.05rem; color: var(--grey-soft); margin-bottom: 1.2rem; }
p:last-child { margin-bottom: 0; }

/* ── Layout Helpers ─────────────────────── */
.container {
  width: 90%;
  max-width: 1180px;
  margin: 0 auto;
}

.section {
  padding: 100px 0;
}

.section-label {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fuchsia);
  margin-bottom: 1rem;
  display: block;
}

.section-title {
  margin-bottom: 1.5rem;
}

.section-title em {
  font-style: normal;
  color: var(--fuchsia);
}

.text-center { text-align: center; }

/* ── Buttons ────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 2rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.03em;
  transition: all var(--transition);
  cursor: pointer;
  border: none;
  position: relative;
  overflow: hidden;
}

.btn-primary {
  background: var(--fuchsia);
  color: var(--white);
}

.btn-primary:hover {
  background: var(--fuchsia-light);
  color: var(--white);
  box-shadow: var(--glow);
  transform: translateY(-2px);
}

.btn-outline {
  background: transparent;
  color: var(--fuchsia);
  border: 1.5px solid var(--fuchsia);
}

.btn-outline:hover {
  background: var(--fuchsia-glow);
  color: var(--fuchsia-light);
  box-shadow: var(--glow-sm);
  transform: translateY(-2px);
}

/* ── Noise overlay ──────────────────────── */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9999;
  opacity: 0.4;
}

/* ── Navigation ─────────────────────────── */
#site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 1.2rem 0;
  transition: background var(--transition), padding var(--transition), backdrop-filter var(--transition);
}

#site-header.scrolled {
  background: rgba(2, 8, 16, 0.92);   /* --bid-bg-deep with opacity */
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--black-border);
}

.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.site-logo {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--white);
  letter-spacing: -0.03em;
}

.site-logo span {
  color: var(--fuchsia);
}

.nav-menu {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  list-style: none;
}

.nav-menu a {
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--grey-soft);
  letter-spacing: 0.04em;
  transition: color var(--transition);
}

.nav-menu a:hover { color: var(--white); }

.nav-cta { margin-left: 1rem; }

/* Mobile menu toggle */
.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
}

.nav-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  transition: all var(--transition);
}

/* ── Hero Section ───────────────────────── */
#hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-top: 100px;
}

.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(99,102,241,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(99,102,241,0.07) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, black 30%, transparent 100%);
}

.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}

.hero-orb-1 {
  width: 700px;
  height: 700px;
  /* Fuchsia → Violet: fuchsia side is brand, bleeds into BiD violet */
  background: radial-gradient(circle, rgba(255,0,127,0.26) 0%, rgba(124,58,237,0.12) 50%, transparent 70%);
  top: -15%;
  right: -8%;
}

.hero-orb-2 {
  width: 500px;
  height: 500px;
  /* Violet → Indigo: pure BiD palette on the cool side */
  background: radial-gradient(circle, rgba(124,58,237,0.20) 0%, rgba(99,102,241,0.10) 50%, transparent 70%);
  bottom: 5%;
  left: -8%;
}

.hero-content {
  position: relative;
  z-index: 2;
  max-width: 800px;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(123, 47, 255, 0.1);
  border: 1px solid rgba(123, 47, 255, 0.3);
  border-radius: 100px;
  padding: 0.4rem 1rem;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  color: var(--purple-light);
  margin-bottom: 2rem;
}

.hero-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fuchsia);
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.8); }
}

.hero-title {
  margin-bottom: 1.5rem;
}

.hero-title .line-accent {
  display: block;
  background: var(--grad-hero-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle {
  font-size: 1.2rem;
  max-width: 560px;
  margin-bottom: 2.5rem;
  color: var(--grey-soft);
}

.hero-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.hero-scroll {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  z-index: 2;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  color: var(--grey-muted);
  text-transform: uppercase;
}

.scroll-line {
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, var(--fuchsia), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}

@keyframes scrollPulse {
  0%, 100% { opacity: 1; transform: scaleY(1); }
  50% { opacity: 0.4; transform: scaleY(0.7); }
}

/* ── Stats Bar ──────────────────────────── */
#stats {
  padding: 50px 0;
  border-top: 1px solid var(--black-border);
  border-bottom: 1px solid var(--black-border);
  background: var(--black-card);
  position: relative;
  overflow: hidden;
}

#stats::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(99,102,241,0.05) 0%,
    rgba(124,58,237,0.05) 50%,
    rgba(255,0,127,0.04) 100%);
  pointer-events: none;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

.stat-item {
  text-align: center;
  padding: 1rem;
}

.stat-number {
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--fuchsia);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 0.4rem;
}

/* Walk through BiD spectrum left → right */
.stat-item:nth-child(2) .stat-number { color: var(--violet-light); }
.stat-item:nth-child(3) .stat-number { color: var(--indigo-light); }
.stat-item:nth-child(4) .stat-number {
  background: var(--grad-full);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.stat-label {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--grey-soft);
}

/* ── Services Section ───────────────────── */
#services {
  background: var(--black-deep);
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5px;
  background: var(--black-border);
  border: 1.5px solid var(--black-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-top: 4rem;
}

.service-card {
  background: var(--black-card);
  padding: 2.5rem;
  transition: background var(--transition);
  position: relative;
  overflow: hidden;
}

.service-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(99,102,241,0.07), transparent 60%);
  opacity: 0;
  transition: opacity var(--transition);
}

.service-card:hover { background: var(--black-surface); }
.service-card:hover::after { opacity: 1; }

.service-icon {
  width: 50px;
  height: 50px;
  border-radius: var(--radius-sm);
  background: var(--indigo-glow);
  border: 1px solid var(--indigo-border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  font-size: 1.4rem;
  position: relative;
  z-index: 1;
}

/* Cycle icon accent colors: fuchsia → violet → indigo */
.service-card:nth-child(1) .service-icon { background: rgba(255,0,127,0.08);  border-color: rgba(255,0,127,0.22); }
.service-card:nth-child(2) .service-icon { background: rgba(124,58,237,0.08); border-color: rgba(124,58,237,0.22); }
.service-card:nth-child(3) .service-icon { background: rgba(99,102,241,0.08); border-color: rgba(99,102,241,0.22); }
.service-card:nth-child(4) .service-icon { background: rgba(124,58,237,0.08); border-color: rgba(124,58,237,0.22); }
.service-card:nth-child(5) .service-icon { background: rgba(255,0,127,0.08);  border-color: rgba(255,0,127,0.22); }
.service-card:nth-child(6) .service-icon { background: rgba(99,102,241,0.08); border-color: rgba(99,102,241,0.22); }

.service-card h3 {
  margin-bottom: 0.75rem;
  font-size: 1.2rem;
  position: relative;
  z-index: 1;
}

.service-card p {
  font-size: 0.95rem;
  position: relative;
  z-index: 1;
}

/* ── About Section ──────────────────────── */
#about {
  background: var(--black-card);
  position: relative;
  overflow: hidden;
}

#about::after {
  content: '';
  position: absolute;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(27,111,255,0.07) 0%, transparent 70%);
  bottom: -100px;
  right: -100px;
  pointer-events: none;
}

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
}

.about-visual {
  position: relative;
}

.about-box {
  aspect-ratio: 1;
  max-width: 460px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #0C0D1A 0%, #090C1F 100%);
  border: 1px solid var(--black-border);
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-box-inner {
  text-align: center;
  z-index: 2;
  position: relative;
}

.about-orb {
  position: absolute;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(124,58,237,0.18) 0%, rgba(99,102,241,0.08) 50%, transparent 70%);
  filter: blur(30px);
}

.about-box-label {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--indigo-light);
  margin-bottom: 0.5rem;
}

.about-box-num {
  font-family: var(--font-display);
  font-size: 5rem;
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  letter-spacing: -0.05em;
}

.about-box-num span { color: var(--fuchsia); }

.about-dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--fuchsia);
  box-shadow: var(--glow-sm);
}

.about-dot-1 { top: 20%; right: 15%; background: var(--indigo-light); box-shadow: var(--glow-indigo-sm); animation: float 3s ease-in-out infinite; }
.about-dot-2 { bottom: 25%; left: 10%; background: var(--violet-light); box-shadow: 0 0 14px rgba(124,58,237,0.5); animation: float 4s ease-in-out infinite 1s; }

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

.about-features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 2rem;
}

.about-features li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.95rem;
  color: var(--grey-soft);
}

.about-features li::before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--fuchsia-glow);
  border: 1px solid var(--fuchsia);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23FF007F' d='M8.3 14.4L4 10.1l1.4-1.4 2.9 2.9 6.2-6.2 1.4 1.4z'/%3E%3C/svg%3E");
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: center;
}

/* ── Process Section ────────────────────── */
#process {
  background: var(--black-deep);
}

.process-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 4rem;
  position: relative;
}

.process-steps::before {
  content: '';
  position: absolute;
  top: 28px;
  left: 12.5%;
  right: 12.5%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--fuchsia), var(--violet), var(--indigo), transparent);
  z-index: 0;
}

.process-step {
  text-align: center;
  padding: 0 1.5rem;
  position: relative;
  z-index: 1;
}

.step-num {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--black-base);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 700;
}

/* Fuchsia → Violet → Violet → Indigo — walks the full Avvyd/BiD spectrum */
.process-step:nth-child(1) .step-num { border: 1px solid var(--fuchsia);  color: var(--fuchsia);      box-shadow: var(--glow-fuchsia-sm); }
.process-step:nth-child(2) .step-num { border: 1px solid var(--violet);   color: var(--violet-light); box-shadow: 0 0 14px rgba(124,58,237,0.35); }
.process-step:nth-child(3) .step-num { border: 1px solid var(--indigo);   color: var(--indigo-light); box-shadow: var(--glow-indigo-sm); }
.process-step:nth-child(4) .step-num { border: 1px solid var(--indigo);   color: var(--indigo-light); box-shadow: var(--glow-indigo-sm); }

.process-step h3 {
  font-size: 1.05rem;
  margin-bottom: 0.6rem;
}

.process-step p {
  font-size: 0.88rem;
}

/* ── Portfolio Section ──────────────────── */
#portfolio {
  background: var(--black-card-alt);
  position: relative;
  overflow: hidden;
}

#portfolio::before {
  content: '';
  position: absolute;
  width: 600px;
  height: 400px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,102,241,0.06) 0%, transparent 70%);
  top: 0;
  left: -100px;
  pointer-events: none;
}

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 4rem;
}

.portfolio-card {
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--black-deep);
  border: 1px solid var(--black-border);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
  cursor: pointer;
}

.portfolio-card:hover {
  transform: translateY(-6px);
  border-color: var(--indigo-border);
  box-shadow: var(--glow-indigo);
}

.portfolio-thumb {
  height: 220px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portfolio-thumb-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--fuchsia-dim), #1a0030);
  opacity: 0.9;
}

/* BiD-spectrum thumb gradients per card */
.portfolio-card:nth-child(1) .portfolio-thumb-bg { background: linear-gradient(135deg, var(--fuchsia-dim), #1a0030); }
.portfolio-card:nth-child(2) .portfolio-thumb-bg { background: var(--grad-indigo); }
.portfolio-card:nth-child(3) .portfolio-thumb-bg { background: linear-gradient(135deg, #0a1628, #1e1040); }
.portfolio-card:nth-child(4) .portfolio-thumb-bg { background: linear-gradient(135deg, var(--violet-dim), var(--fuchsia-dim)); }

.portfolio-thumb-icon {
  position: relative;
  z-index: 1;
  font-size: 3.5rem;
}

.portfolio-info { padding: 1.5rem; }

/* Tag colors walk the spectrum */
.portfolio-tag {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--fuchsia);
  margin-bottom: 0.5rem;
  display: block;
}

.portfolio-card:nth-child(2) .portfolio-tag { color: var(--violet-light); }
.portfolio-card:nth-child(3) .portfolio-tag { color: var(--indigo-light); }
.portfolio-card:nth-child(4) .portfolio-tag { color: var(--violet-light); }

.portfolio-info h3 { font-size: 1.1rem; margin-bottom: 0.4rem; }
.portfolio-info p  { font-size: 0.88rem; }

/* ── Testimonials ───────────────────────── */
#testimonials {
  background: var(--black-deep);
  position: relative;
}

#testimonials::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 50% 100%, rgba(99,102,241,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 4rem;
}

.testimonial-card {
  background: var(--black-base);         /* --bid-bg-base */
  border: 1px solid var(--black-border); /* --bid-border-subtle */
  border-radius: var(--radius-md);
  padding: 2rem;
  transition: border-color var(--transition), box-shadow var(--transition);
  position: relative;
  overflow: hidden;
}

.testimonial-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--grad-indigo);
  opacity: 0;
  transition: opacity var(--transition);
}

.testimonial-card:hover {
  border-color: var(--indigo-border);
  box-shadow: var(--glow-indigo-sm);
}

.testimonial-card:hover::before { opacity: 1; }

.testimonial-stars {
  color: var(--fuchsia);
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  margin-bottom: 1rem;
}

.testimonial-text {
  font-size: 0.95rem;
  font-style: italic;
  color: var(--grey-bright);   /* --bid-text-secondary */
  margin-bottom: 1.5rem;
  line-height: 1.7;
}

.testimonial-author {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.author-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--grad-indigo);   /* BiD primary button gradient */
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 0.85rem;
  font-weight: 700;
  color: white;
  flex-shrink: 0;
}

.author-name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--white);
}

.author-role {
  font-size: 0.78rem;
  color: var(--grey-soft);
}

/* ── CTA Section ────────────────────────── */
#cta {
  padding: 120px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
  background: var(--grad-auth-bg);   /* BiD auth screen bg */
}

.cta-bg-orb {
  position: absolute;
  width: 800px;
  height: 800px;
  border-radius: 50%;
  /* Violet core (BiD) → fades to fuchsia edge (Avvyd) */
  background: radial-gradient(circle,
    rgba(124,58,237,0.14) 0%,
    rgba(99,102,241,0.08) 35%,
    rgba(255,0,127,0.06) 60%,
    transparent 75%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  filter: blur(20px);
}

.cta-inner {
  position: relative;
  z-index: 2;
  max-width: 660px;
  margin: 0 auto;
}

.cta-inner h2 { margin-bottom: 1.2rem; }
.cta-inner p { font-size: 1.1rem; margin-bottom: 2.5rem; }

.cta-actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* ── Contact Section ────────────────────── */
#contact {
  background: var(--black-base);   /* --bid-bg-base */
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 5rem;
  align-items: start;
  margin-top: 4rem;
}

.contact-info h3 {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.contact-detail {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  font-size: 0.95rem;
  color: var(--grey-soft);
}

.contact-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: var(--indigo-glow);
  border: 1px solid var(--indigo-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}

/* WordPress Form Styles */
.avvyd-form .form-group {
  margin-bottom: 1.2rem;
}

.avvyd-form label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--grey-soft);
  margin-bottom: 0.4rem;
}

.avvyd-form input,
.avvyd-form textarea,
.avvyd-form select {
  width: 100%;
  padding: 0.85rem 1rem;
  background: var(--black-surface);   /* --bid-bg-surface */
  border: 1px solid var(--black-border);
  border-radius: var(--radius-sm);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 0.95rem;
  transition: border-color var(--transition), box-shadow var(--transition);
}

.avvyd-form input:focus,
.avvyd-form textarea:focus,
.avvyd-form select:focus {
  outline: none;
  border-color: var(--indigo);
  box-shadow: 0 0 0 3px rgba(99,102,241,0.15);   /* BiD indigo focus ring */
}

.avvyd-form textarea { min-height: 130px; resize: vertical; }

/* ── Footer ─────────────────────────────── */
#site-footer {
  background: var(--black-deep);   /* --bid-bg-deep */
  border-top: 1px solid var(--black-border);
  padding: 60px 0 30px;
}

.footer-top {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}

.footer-brand p {
  font-size: 0.9rem;
  margin-top: 0.75rem;
  max-width: 260px;
  color: var(--grey-faint);
}

.footer-col h4 {
  font-family: var(--font-display);
  font-size: 0.9rem;
  letter-spacing: 0.05em;
  color: var(--grey-bright);
  margin-bottom: 1.2rem;
}

.footer-col ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.footer-col ul a {
  font-size: 0.88rem;
  color: var(--grey-faint);   /* --bid-text-faint */
  transition: color var(--transition);
}

.footer-col ul a:hover { color: var(--indigo-light); }

.footer-bottom {
  border-top: 1px solid var(--black-border);
  padding-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.footer-bottom p {
  font-size: 0.82rem;
  color: var(--grey-ghost);   /* --bid-text-ghost */
  margin: 0;
}

.social-links {
  display: flex;
  gap: 0.75rem;
}

.social-link {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: var(--black-base);
  border: 1px solid var(--black-border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--grey-faint);
  font-size: 0.9rem;
  transition: all var(--transition);
}

.social-link:hover {
  border-color: var(--indigo-border);
  color: var(--indigo-light);
  box-shadow: var(--glow-indigo-sm);
}

/* ── WordPress Standard Classes ─────────── */
.wp-block-image { margin: 1.5rem 0; }
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { text-align: center; margin: 0 auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.85rem; color: var(--grey-soft); margin-top: 0.4rem; }

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

/* ── Section label variant: indigo ──────── */
.section-label-indigo {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--indigo-light);
  margin-bottom: 1rem;
  display: block;
}

/* ── BiD Featured App Block ─────────────── */
#bid-feature {
  background: var(--black-base);
  border-top: 1px solid var(--black-border);
  border-bottom: 1px solid var(--black-border);
  position: relative;
  overflow: hidden;
}

#bid-feature::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--grad-auth-bg);
  opacity: 0.7;
}

#bid-feature::after {
  content: '';
  position: absolute;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,102,241,0.14) 0%, transparent 70%);
  top: -100px;
  right: -100px;
  filter: blur(40px);
  pointer-events: none;
}

.bid-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  position: relative;
  z-index: 2;
}

.bid-feature-content h2 { margin-bottom: 1.2rem; }

.bid-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(99,102,241,0.1);
  border: 1px solid rgba(99,102,241,0.25);
  border-radius: 100px;
  padding: 0.4rem 1rem;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.15em;
  color: var(--indigo-light);
  margin-bottom: 1.5rem;
}

.bid-features-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin: 1.5rem 0 2rem;
}

.bid-features-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: 0.95rem;
  color: var(--grey-soft);
}

.bid-feature-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--grad-indigo);
  flex-shrink: 0;
  margin-top: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
  color: white;
}

.bid-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.btn-indigo {
  background: var(--grad-indigo);
  color: var(--white-pure);
  border: none;
}

.btn-indigo:hover {
  filter: brightness(1.15);
  box-shadow: var(--glow-indigo);
  transform: translateY(-2px);
  color: var(--white-pure);
}

.btn-outline-indigo {
  background: transparent;
  color: var(--indigo-light);
  border: 1.5px solid rgba(99,102,241,0.4);
}

.btn-outline-indigo:hover {
  background: rgba(99,102,241,0.08);
  color: var(--indigo-light);
  box-shadow: var(--glow-indigo-sm);
  transform: translateY(-2px);
}

.bid-visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bid-screen {
  width: 100%;
  max-width: 440px;
  aspect-ratio: 4/3;
  background: var(--black-surface);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: var(--radius-md);
  overflow: hidden;
  position: relative;
  box-shadow: 0 0 60px rgba(99,102,241,0.15), 0 0 120px rgba(124,58,237,0.08);
}

.bid-screen-header {
  background: var(--black-raised);
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-bottom: 1px solid var(--black-border);
}

.bid-screen-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.bid-screen-dot:nth-child(1) { background: #ef4444; }
.bid-screen-dot:nth-child(2) { background: #f59e0b; }
.bid-screen-dot:nth-child(3) { background: #10b981; }

.bid-screen-title {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--grey-faint);
  margin-left: 0.5rem;
  letter-spacing: 0.05em;
}

.bid-screen-body {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.bid-row {
  height: 10px;
  border-radius: 100px;
  background: var(--black-raised);
}

.bid-row-wide   { width: 80%; }
.bid-row-medium { width: 55%; }
.bid-row-short  { width: 35%; }

.bid-row-accent {
  background: linear-gradient(90deg, var(--indigo), var(--violet));
  width: 45%;
}

.bid-card-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.5rem;
  margin-top: 0.4rem;
}

.bid-mini-card {
  height: 55px;
  border-radius: var(--radius-sm);
  background: var(--black-raised);
  border: 1px solid var(--black-border);
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.bid-mini-card-bar {
  height: 5px;
  border-radius: 100px;
  background: var(--black-subtle);
  width: 70%;
}

.bid-mini-card:nth-child(1) .bid-mini-card-bar { background: var(--indigo); width: 60%; }
.bid-mini-card:nth-child(2) .bid-mini-card-bar { background: var(--violet); width: 80%; }
.bid-mini-card:nth-child(3) .bid-mini-card-bar { background: var(--fuchsia); width: 50%; }
/* ═══════════════════════════════════════════
   WHAT WE BELIEVE — replaces stats bar
   ═══════════════════════════════════════════ */

#beliefs {
  padding: 48px 0;
  border-top: 1px solid var(--black-border);
  border-bottom: 1px solid var(--black-border);
  background: var(--black-card);
  position: relative;
  overflow: hidden;
}

#beliefs::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    rgba(99,102,241,0.04) 0%,
    rgba(124,58,237,0.04) 50%,
    rgba(255,0,127,0.03) 100%);
  pointer-events: none;
}

.beliefs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
  z-index: 1;
}

.belief-item {
  padding: 1.8rem 2rem;
  text-align: center;
  border-right: 1px solid var(--black-border);
  transition: background var(--transition);
}

.belief-item:last-child { border-right: none; }
.belief-item:hover { background: rgba(99,102,241,0.04); }

.belief-icon {
  font-size: 1.2rem;
  color: var(--fuchsia);
  margin-bottom: 0.8rem;
  display: block;
}

.belief-item:nth-child(2) .belief-icon { color: var(--violet-light); }
.belief-item:nth-child(3) .belief-icon { color: var(--indigo-light); }
.belief-item:nth-child(4) .belief-icon { color: var(--violet-light); }

.belief-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1rem;
  color: var(--white);
  margin-bottom: 0.5rem;
  letter-spacing: -0.01em;
}

.belief-desc {
  font-size: 0.85rem;
  color: var(--grey-soft);
  line-height: 1.6;
}

/* ═══════════════════════════════════════════
   IMPACT GRID — replaces fake portfolio
   ═══════════════════════════════════════════ */

.impact-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 4rem;
}

.impact-card {
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--black-deep);
  border: 1px solid var(--black-border);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.impact-card:hover {
  transform: translateY(-6px);
  border-color: rgba(124,58,237,0.45);
  box-shadow: 0 0 32px rgba(124,58,237,0.2);
}

.impact-card-icon {
  position: relative;
  z-index: 1;
  font-size: 2.8rem;
  filter: drop-shadow(0 0 12px rgba(255,0,127,0.4));
}

.impact-card:nth-child(1) .portfolio-thumb { background-image: url('assets/images/portfolio-healthcare.jpg'); background-size: cover; background-position: center; }
.impact-card:nth-child(2) .portfolio-thumb { background-image: url('assets/images/portfolio-ecommerce.jpg');  background-size: cover; background-position: center; }
.impact-card:nth-child(3) .portfolio-thumb { background-image: url('assets/images/portfolio-fintech.jpg');    background-size: cover; background-position: center; }
.impact-card:nth-child(4) .portfolio-thumb { background-image: url('assets/images/portfolio-edtech.jpg');     background-size: cover; background-position: center; }

.impact-card:nth-child(1) .portfolio-tag { color: var(--fuchsia); }
.impact-card:nth-child(2) .portfolio-tag { color: var(--violet-light); }
.impact-card:nth-child(3) .portfolio-tag { color: var(--indigo-light); }
.impact-card:nth-child(4) .portfolio-tag { color: var(--violet-light); }

/* ═══════════════════════════════════════════
   TRUST / EARLY ADOPTER — replaces fake testimonials
   ═══════════════════════════════════════════ */

.trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.trust-card {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-md);
  padding: 2.2rem;
  transition: border-color var(--transition), box-shadow var(--transition);
  position: relative;
  overflow: hidden;
}

.trust-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  opacity: 0;
  transition: opacity var(--transition);
}

.trust-card:nth-child(1)::before { background: var(--grad-brand); }
.trust-card:nth-child(2)::before { background: var(--grad-indigo); }
.trust-card:nth-child(3)::before { background: linear-gradient(90deg, var(--fuchsia), var(--violet)); }

.trust-card:hover {
  border-color: var(--indigo-border);
  box-shadow: var(--glow-indigo-sm);
}

.trust-card:hover::before { opacity: 1; }

.trust-icon {
  font-size: 2rem;
  margin-bottom: 1.2rem;
  display: block;
}

.trust-card h3 {
  font-size: 1.15rem;
  margin-bottom: 0.75rem;
  color: var(--white);
}

.trust-card p {
  font-size: 0.93rem;
  line-height: 1.75;
  color: var(--grey-soft);
  margin: 0;
}

/* ═══════════════════════════════════════════
   IMAGE INTEGRATION STYLES
   ═══════════════════════════════════════════ */

/* ── Hero background image ────────────────── */
#hero {
  background-image: url('assets/images/hero-bg.jpg');
  background-size: cover;
  background-position: center 30%;
  background-repeat: no-repeat;
}

/* Deepen the overlay so text stays readable */
#hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(2,8,16,0.82) 0%,
    rgba(7,8,15,0.70) 50%,
    rgba(2,8,16,0.80) 100%
  );
  z-index: 1;
}

.hero-bg, .hero-content, .hero-scroll { z-index: 2; }

/* ── Services section background ─────────── */
#services {
  position: relative;
}

#services::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('assets/images/services-bg.jpg');
  background-size: cover;
  background-position: center;
  opacity: 0.06;
  z-index: 0;
}

#services .container { position: relative; z-index: 1; }

/* ── Service card images ──────────────────── */
.service-card-img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  object-position: center;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  margin: -2.5rem -2.5rem 1.5rem -2.5rem;
  width: calc(100% + 5rem);
  display: block;
  opacity: 0.85;
  transition: opacity var(--transition);
}

.service-card:hover .service-card-img { opacity: 1; }

/* ── About section image ──────────────────── */
#about {
  background-image: url('assets/images/about-bg-tint.jpg');
  background-size: cover;
  background-position: center;
}

#about::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 16, 0.88);
  z-index: 0;
}

#about .container { position: relative; z-index: 1; }

.about-photo {
  width: 100%;
  max-width: 480px;
  aspect-ratio: 4/3;
  object-fit: cover;
  object-position: center top;
  border-radius: var(--radius-lg);
  border: 1px solid var(--black-border);
  display: block;
  box-shadow: 0 0 60px rgba(99,102,241,0.15);
}

/* ── Process section background ──────────── */
#process {
  position: relative;
}

#process::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('assets/images/process-bg.jpg');
  background-size: cover;
  background-position: center;
  opacity: 0.05;
  z-index: 0;
}

#process .container { position: relative; z-index: 1; }

/* ── Portfolio card thumbnail images ─────── */
.portfolio-thumb img.portfolio-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.5s ease;
}

.portfolio-card:hover .portfolio-img {
  transform: scale(1.04);
}

/* Fallback bg images for placeholder cards */
.portfolio-card:nth-child(1) .portfolio-thumb { background-image: url('assets/images/portfolio-healthcare.jpg'); background-size: cover; background-position: center; }
.portfolio-card:nth-child(2) .portfolio-thumb { background-image: url('assets/images/portfolio-ecommerce.jpg');  background-size: cover; background-position: center; }
.portfolio-card:nth-child(3) .portfolio-thumb { background-image: url('assets/images/portfolio-fintech.jpg');    background-size: cover; background-position: center; }
.portfolio-card:nth-child(4) .portfolio-thumb { background-image: url('assets/images/portfolio-edtech.jpg');     background-size: cover; background-position: center; }

/* Keep overlay + icon on top of bg image */
.portfolio-thumb-bg { mix-blend-mode: multiply; opacity: 0.65; }
.portfolio-thumb-icon { z-index: 2; }

/* ── BiD section image backgrounds ───────── */
#bid-feature {
  background-image: url('assets/images/bid-bg.jpg');
  background-size: cover;
  background-position: center;
}

.bid-visual-photo {
  width: 100%;
  max-width: 520px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(99,102,241,0.25);
  display: block;
  box-shadow: 0 0 60px rgba(99,102,241,0.2), 0 0 120px rgba(124,58,237,0.1);
  object-fit: cover;
  aspect-ratio: 16/9;
}

/* ── CTA section background ───────────────── */
#cta {
  background-image: url('assets/images/cta-bg.jpg');
  background-size: cover;
  background-position: center 40%;
}

#cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 16, 0.72);
  z-index: 0;
}

.cta-bg-orb, .cta-inner { z-index: 2; }

/* ── Responsive image tweaks ──────────────── */
@media (max-width: 768px) {
  .service-card-img {
    height: 130px;
    margin: -1.5rem -1.5rem 1.2rem -1.5rem;
    width: calc(100% + 3rem);
  }

  .about-photo { max-width: 100%; }
  .bid-visual-photo { max-width: 100%; }
}

/* ═══════════════════════════════════════════ */

@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .trust-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-top { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .section { padding: 70px 0; }

  .nav-menu { display: none; }
  .nav-menu.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(2, 8, 16, 0.97);   /* --bid-bg-deep */
    backdrop-filter: blur(20px);
    padding: 1.5rem;
    gap: 1.2rem;
    border-top: 1px solid var(--black-border);
  }
  .nav-toggle { display: flex; }

  .services-grid,
  .process-steps,
  .impact-grid,
  .trust-grid,
  .contact-grid,
  .bid-feature-grid,
  .about-grid { grid-template-columns: 1fr; }

  .beliefs-grid { grid-template-columns: repeat(2, 1fr); }
  .belief-item { border-right: none; border-bottom: 1px solid var(--black-border); }
  .belief-item:nth-child(odd) { border-right: 1px solid var(--black-border); }
  .belief-item:nth-child(3),
  .belief-item:nth-child(4) { border-bottom: none; }

  .process-steps::before { display: none; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  .footer-top { grid-template-columns: 1fr; gap: 2rem; }

  .hero-actions { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 480px) {
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .cta-actions { flex-direction: column; align-items: center; }
}

/* ═══════════════════════════════════════════
   PRODUCT CARDS — v1.9.0
   ═══════════════════════════════════════════ */

.product-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--black-border);
  margin-top: 2.5rem;
  transition: border-color var(--transition), box-shadow var(--transition);
}

.product-card-live {
  background: var(--black-base);
  border-color: rgba(99,102,241,0.25);
}

.product-card-live:hover {
  border-color: rgba(99,102,241,0.5);
  box-shadow: 0 0 40px rgba(99,102,241,0.12);
}

.product-card-soon {
  background: var(--black-card);
  border-color: var(--black-border-hi);
}

.product-card-soon:hover {
  border-color: rgba(124,58,237,0.35);
  box-shadow: 0 0 40px rgba(124,58,237,0.08);
}

.product-card-teaser {
  background: var(--black-deep);
  border-color: var(--black-border);
  border-style: dashed;
}

.product-card-inner {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 0;
  align-items: stretch;
  min-height: 340px;
}

.product-card-inner-teaser {
  min-height: 240px;
}

.product-card-content {
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.product-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.25rem 0.7rem;
  border-radius: 100px;
  margin-bottom: 1rem;
  width: fit-content;
}

.product-live {
  background: rgba(16,185,129,0.1);
  border: 1px solid rgba(16,185,129,0.25);
  color: #10b981;
}

.product-live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #10b981;
  animation: pulse 2s infinite;
}

.product-soon {
  background: rgba(124,58,237,0.1);
  border: 1px solid rgba(124,58,237,0.25);
  color: var(--violet-light);
}

.product-teaser {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--black-border-hi);
  color: var(--grey-soft);
}

.product-eyebrow {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--indigo-light);
  margin-bottom: 0.4rem;
}

.product-card-teaser .product-eyebrow { color: var(--grey-faint); }

.product-name {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  color: var(--white);
  line-height: 1;
  margin-bottom: 0.3rem;
}

.product-tagline {
  font-size: 0.95rem;
  color: var(--grey-soft);
  margin-bottom: 1rem;
  font-style: italic;
}

.product-desc {
  font-size: 0.92rem;
  color: var(--grey-soft);
  line-height: 1.75;
  margin-bottom: 1.2rem;
}

.product-highlights {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-bottom: 1.8rem;
  flex: 1;
}

.product-highlights li {
  font-size: 0.88rem;
  color: var(--grey-soft);
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  line-height: 1.5;
}

.product-highlights li::before {
  content: '✓';
  color: #10b981;
  font-size: 0.75rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.product-card-soon .product-highlights li::before { color: var(--violet-light); }
.product-card-teaser .product-highlights li::before { color: var(--grey-faint); }

.product-actions {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

/* Product visuals */
.product-card-visual {
  position: relative;
  overflow: hidden;
  border-left: 1px solid var(--black-border);
  background: var(--black-surface);
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-screenshot {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.5s ease;
}

.product-card:hover .product-screenshot { transform: scale(1.02); }

.product-card-visual-soon {
  background: linear-gradient(135deg, var(--black-surface) 0%, var(--black-deep) 100%);
}

.product-soon-visual {
  text-align: center;
  padding: 2rem;
}

.product-soon-icon {
  font-size: 3rem;
  color: var(--grey-muted);
  margin-bottom: 0.75rem;
  display: block;
}

.product-card-soon .product-soon-icon { color: var(--violet-dim); }

.product-soon-label {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--grey-faint);
}

/* ═══════════════════════════════════════════
   NOTIFY SECTION
   ═══════════════════════════════════════════ */

.notify-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: start;
}

.notify-form-wrap {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-md);
  padding: 2rem;
}

/* ═══════════════════════════════════════════
   BLOG GRID — homepage preview
   ═══════════════════════════════════════════ */

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 3rem;
}

.blog-card {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: border-color var(--transition), transform var(--transition);
  display: flex;
  flex-direction: column;
}

.blog-card:hover {
  border-color: var(--indigo-border);
  transform: translateY(-4px);
}

.blog-card-thumb {
  height: 180px;
  overflow: hidden;
}

.blog-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.blog-card:hover .blog-thumb-img { transform: scale(1.04); }

.blog-card-body {
  padding: 1.4rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.blog-card-cat {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--fuchsia);
  margin-bottom: 0.5rem;
  display: block;
}

.blog-card-title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-bottom: 0.5rem;
  line-height: 1.4;
}

.blog-card-title a {
  color: var(--white);
  text-decoration: none;
  transition: color var(--transition);
}

.blog-card-title a:hover { color: var(--indigo-light); }

.blog-card-excerpt {
  font-size: 0.85rem;
  color: var(--grey-soft);
  line-height: 1.65;
  margin-bottom: 1rem;
  flex: 1;
}

.blog-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--grey-faint);
  border-top: 1px solid var(--black-border);
  padding-top: 0.75rem;
  margin-top: auto;
}

.blog-card-read {
  color: var(--indigo-light);
  text-decoration: none;
  font-weight: 700;
  transition: color var(--transition);
}

.blog-card-read:hover { color: var(--fuchsia); }

/* ═══════════════════════════════════════════
   BLOG ARCHIVE & SINGLE PAGE
   ═══════════════════════════════════════════ */

.blog-page {
  background: var(--black-deep);
  padding-top: 80px;
}

.blog-hero {
  background: var(--black-base);
  border-bottom: 1px solid var(--black-border);
  padding: 60px 0 50px;
}

.blog-archive-grid {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 4rem;
  padding: 60px 0 80px;
  align-items: start;
}

.blog-posts-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.blog-post-card {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  display: grid;
  grid-template-columns: 280px 1fr;
  transition: border-color var(--transition);
}

.blog-post-card:hover { border-color: var(--indigo-border); }

.blog-post-thumb {
  overflow: hidden;
}

.blog-post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.blog-post-card:hover .blog-post-thumb img { transform: scale(1.04); }

.blog-post-body {
  padding: 1.8rem;
  display: flex;
  flex-direction: column;
}

.blog-post-cat {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--fuchsia);
  margin-bottom: 0.5rem;
  display: block;
}

.blog-post-title {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 0.6rem;
  line-height: 1.35;
}

.blog-post-title a {
  color: var(--white);
  text-decoration: none;
  transition: color var(--transition);
}

.blog-post-title a:hover { color: var(--indigo-light); }

.blog-post-excerpt {
  font-size: 0.9rem;
  color: var(--grey-soft);
  line-height: 1.7;
  flex: 1;
  margin-bottom: 1.2rem;
}

.blog-post-meta {
  display: flex;
  gap: 1rem;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--grey-faint);
}

/* Sidebar */
.blog-sidebar { position: sticky; top: 100px; }

.sidebar-widget {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-md);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.sidebar-widget-title {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--grey-faint);
  margin-bottom: 1rem;
}

.sidebar-cat-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.sidebar-cat-list a {
  font-size: 0.88rem;
  color: var(--grey-soft);
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  padding: 0.3rem 0;
  border-bottom: 1px solid var(--black-border);
  transition: color var(--transition);
}

.sidebar-cat-list a:hover { color: var(--indigo-light); }
.sidebar-cat-list a:last-child { border-bottom: none; }

/* Single post */
.blog-single-hero {
  background: var(--black-base);
  border-bottom: 1px solid var(--black-border);
  padding: 60px 0 50px;
}

.blog-single-layout {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 4rem;
  padding: 50px 0 80px;
  align-items: start;
}

.blog-single-body {
  max-width: 720px;
}

.entry-content h2 { font-size: 1.5rem; margin: 2rem 0 0.8rem; color: var(--white); letter-spacing: -0.02em; }
.entry-content h3 { font-size: 1.15rem; margin: 1.5rem 0 0.6rem; color: var(--grey-bright); }
.entry-content p  { font-size: 0.97rem; color: var(--grey-soft); line-height: 1.85; margin-bottom: 1.2rem; }
.entry-content ul,
.entry-content ol { margin: 1rem 0 1.2rem 1.5rem; display: flex; flex-direction: column; gap: 0.4rem; }
.entry-content li { font-size: 0.95rem; color: var(--grey-soft); line-height: 1.7; }
.entry-content a  { color: var(--indigo-light); }
.entry-content a:hover { color: var(--fuchsia); }
.entry-content strong { color: var(--grey-bright); }
.entry-content blockquote {
  border-left: 3px solid var(--indigo);
  padding: 1rem 1.4rem;
  margin: 1.5rem 0;
  background: rgba(99,102,241,0.06);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--grey-bright);
  font-size: 1.05rem;
  font-style: italic;
}
.entry-content code {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  background: var(--black-raised);
  border: 1px solid var(--black-border);
  padding: 0.15rem 0.4rem;
  border-radius: 3px;
  color: var(--fuchsia-light);
}
.entry-content pre {
  background: var(--black-surface);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-sm);
  padding: 1.2rem 1.4rem;
  overflow-x: auto;
  margin: 1.2rem 0;
}
.entry-content pre code { background: none; border: none; padding: 0; }

/* Post nav */
.blog-post-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--black-border);
}

.blog-nav-card {
  background: var(--black-base);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-sm);
  padding: 1rem 1.2rem;
  text-decoration: none;
  transition: border-color var(--transition);
}

.blog-nav-card:hover { border-color: var(--indigo-border); }

.blog-nav-label {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--grey-faint);
  margin-bottom: 0.3rem;
  display: block;
}

.blog-nav-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--white);
  line-height: 1.4;
}

/* ═══════════════════════════════════════════
   RESPONSIVE ADDITIONS v1.9.0
   ═══════════════════════════════════════════ */

@media (max-width: 1024px) {
  .product-card-inner { grid-template-columns: 1fr; }
  .product-card-visual { display: none; }
  .blog-archive-grid { grid-template-columns: 1fr; }
  .blog-single-layout { grid-template-columns: 1fr; }
  .blog-sidebar { position: static; }
}

@media (max-width: 768px) {
  .blog-grid { grid-template-columns: 1fr; }
  .blog-post-card { grid-template-columns: 1fr; }
  .blog-post-thumb { height: 200px; }
  .notify-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .blog-post-nav { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════
   NOTIFY CHECKBOXES — v2.0.2
   ═══════════════════════════════════════════ */

.notify-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin-top: 0.5rem;
}

.notify-check-label {
  display: flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  color: var(--grey-soft) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
}

.notify-check-label input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  accent-color: var(--indigo) !important;
  cursor: pointer !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  flex-shrink: 0 !important;
}

/* Screenshot images in product cards */
.product-card-live .product-card-visual,
.product-card-soon .product-card-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--black-surface);
}

.product-card-soon .product-screenshot {
  opacity: 0.7;
}

/* ═══════════════════════════════════════════
   ADA / SEO FIXES — v2.0.6
   ═══════════════════════════════════════════ */

/* A1 — Skip link */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  background: #020810;
  color: #f1f5f9;
  padding: 12px 16px;
  border-radius: 0 0 6px 0;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid var(--fuchsia);
}
.skip-link:focus {
  left: 0;
  outline: 2px solid var(--fuchsia);
  outline-offset: 2px;
}

/* Focus ring — visible on all interactive elements */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--fuchsia);
  outline-offset: 3px;
  border-radius: 2px;
}

/* A7 — Heading level fixes: service/product card h3 sizing
   (was h4 for styling — now h3 with CSS size control) */
.service-card h3,
.blog-card-title,
.trust-card h3,
.bid-feature-card h3,
.sidebar-widget-title {
  font-size: 1.05rem; /* keep visual size, correct semantic level */
}

/* Legal page h2 inside sections */
.legal-section h2 { scroll-margin-top: 100px; }