/* =============================================================================
   Bemuar — "real.css"
   De-AI-Pass. Loads LAST on every page (after main → bmx-base → lang → bmx →
   bmx-v6), so it is the final word on look-and-feel.

   Purpose: strip the generic "AI-generated landing page" signature that was
   still present on ~44 of 57 pages and replace it with restrained, editorial
   agency design. Nothing structural changes — no markup, no content.

   The signature being removed:
     · pill badges with a glowing dot in front of every section label
     · blurred colour orbs / mesh gradients behind heroes
     · 60px grid overlays with radial masks
     · fake "dashboard" hero mockups (glow, spinning rings, glass cards,
       scanning sweeps, animated bar charts, pulsing status dots)
     · gradient-clipped headline and stat text
     · gradient borders that light up on hover
     · icon tiles with soft gradients that rotate on hover
     · shimmer sweeps across buttons, idle float/pulse animations
     · glassmorphism (backdrop-filter) on chips and badges
     · everything rounded to 20–28px

   Replaced with: hairlines, flat ink, one accent, crisp radii, and motion only
   where motion carries meaning (scroll reveal, the reference/review marquee).
   ============================================================================= */

/* -----------------------------------------------------------------------------
   1. Geometry — crisper radii, matte shadows
   -------------------------------------------------------------------------- */
:root{
  --r-sm:5px; --r-md:8px; --r-lg:11px; --r-xl:14px;
  --glow:0 8px 22px rgba(20,36,52,.10);
  --sh-sm:0 1px 2px rgba(20,36,52,.05);
  --sh-md:0 6px 18px rgba(20,36,52,.07);
  --sh-lg:0 22px 50px rgba(20,36,52,.12);
}

/* -----------------------------------------------------------------------------
   2. Typography — display type gets real tension
   -------------------------------------------------------------------------- */
h1{ letter-spacing:-.035em; line-height:1.03; }
h2{ letter-spacing:-.03em;  line-height:1.08; }
h3{ letter-spacing:-.015em; }
.lead{ line-height:1.6; }

/* -----------------------------------------------------------------------------
   3. THE EYEBROW — the tell the whole site was built on.
      Was: rounded pill + 6px dot with a 10px coloured glow.
      Now: a typographic label preceded by a short rule. No pill, no dot.
   -------------------------------------------------------------------------- */
.eyebrow,
.bmx-eyebrow,
body.bmx-light .bmx-eyebrow{
  display:inline-flex; align-items:center; gap:13px;
  padding:0; border:0; background:none; border-radius:0;
  font-family:var(--font-head,inherit);
  font-size:.72rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted,#5F6B79);
  margin-bottom:20px;
}
.eyebrow::before,
body.bmx-light .bmx-eyebrow::before{
  content:""; display:block;
  width:26px; height:1px; flex:0 0 26px;
  border-radius:0; background:var(--primary,#356084); box-shadow:none;
}
/* the old <span class="dot"> element stays hidden */
.bmx-eyebrow .dot,
body.bmx-light .bmx-eyebrow .dot{ display:none; }

/* centred section heads: keep the rule, keep it balanced */
.center .eyebrow, .bmx-head .bmx-eyebrow{ justify-content:center; }

/* on the dark Termin band */
body.bmx-light .bmx-termin .bmx-eyebrow{
  background:none; border:0; color:#8FB4D4;
}
body.bmx-light .bmx-termin .bmx-eyebrow::before{ background:#8FB4D4; }

/* -----------------------------------------------------------------------------
   4. HERO BACKGROUNDS — no blurred colour orbs, no grid overlay
   -------------------------------------------------------------------------- */
.hero-bg::before,
.page-hero .hero-bg::before,
.bmx-hero-bg::before,
body.bmx-light .bmx-hero-bg::before{
  content:none !important; background:none !important;
  filter:none !important; animation:none !important;
}
.hero-grid, .bmx-hero-grid,
body.bmx-light .bmx-hero-grid{ display:none !important; }

.hero, .bmx-hero, body.bmx-light .bmx-hero{ background:var(--bg,#EBE7DF); }

/* page hero: flat, generous, closed off with a hairline */
.page-hero{
  background:var(--bg-soft,#F2EFE8);
  border-bottom:1px solid var(--border,#DAD4C7);
  padding-top:calc(var(--nav-h,76px) + var(--s-8,64px));
  padding-bottom:var(--s-8,64px);
}
.page-hero .hero-bg{ display:none; }
.breadcrumb{ font-size:.8rem; letter-spacing:.02em; }

/* -----------------------------------------------------------------------------
   5. FAKE DASHBOARD HERO (10 city pages) — removed entirely.
      Same decision as the homepage: the right-hand side stays empty and the
      headline runs full width. An invented UI mockup is the single loudest
      "generated page" signal there is.
   -------------------------------------------------------------------------- */
.hero-visual{ display:none !important; }
.hero-split{ grid-template-columns:1fr !important; }
.hero-copy{ max-width:900px; text-align:left; }
.hero-copy h1{ max-width:17ch; }
.hero-copy .lead{ max-width:58ch; }
@media (max-width:920px){
  .hero-split{ text-align:left; }
  .hero-copy{ text-align:left; }
  .hero-copy .hero-cta, .hero-copy .badge-row{ justify-content:flex-start; }
}

/* service pages: spinning rings + floating gradient tile — removed */
.bmx-svc-hero-art,
body.bmx-light .bmx-svc-hero-art{ display:none !important; }

/* -----------------------------------------------------------------------------
   6. TRUST CHIPS — off the pills, onto the baseline
   -------------------------------------------------------------------------- */
.badge-row{ gap:26px; margin-top:var(--s-6,32px); }
.badge{
  padding:0; border:0; background:none; border-radius:0;
  font-size:.88rem; color:var(--muted,#5F6B79);
}
.badge svg{ width:14px; height:14px; color:var(--primary,#356084); }

/* -----------------------------------------------------------------------------
   7. CARDS — no gradient outline, no lift-and-glow
   -------------------------------------------------------------------------- */
.card::before{ content:none !important; }
.card{
  border-radius:var(--r-lg);
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.card:hover{
  transform:translateY(-3px);
  border-color:var(--primary,#356084);
  box-shadow:var(--sh-md);
  background:var(--surface,#fff);
}

/* icon tiles: flat ink square, white glyph, no gradient, no rotation */
.service-card .ic, .feature .ic{
  background:var(--text,#172432);
  border:0; border-radius:9px;
  color:#fff;
  transition:none;
}
.service-card:hover .ic{ transform:none; }
.service-card .tags li{ border-radius:4px; font-size:.76rem; letter-spacing:.01em; }

/* -----------------------------------------------------------------------------
   8. STATS — solid numerals, not clipped gradient text
   -------------------------------------------------------------------------- */
.stat .n,
.bmx-stat .n,
body.bmx-light .bmx-stat .n{
  background:none !important;
  -webkit-text-fill-color:currentColor !important;
  color:var(--text,#172432) !important;
  letter-spacing:-.04em;
}
.grad-text, .bmx-grad-text,
body.bmx-light .bmx-grad-text{
  background:none !important;
  -webkit-text-fill-color:currentColor !important;
  color:var(--primary,#356084) !important;
  animation:none !important;
}

/* -----------------------------------------------------------------------------
   9. TIMELINE / PROCESS — no glow behind the nodes
   -------------------------------------------------------------------------- */
.tl-node::before{ content:none !important; }
.tl-node{
  width:66px; height:66px;
  background:var(--surface,#fff);
  border:1px solid var(--border,#DAD4C7);
  box-shadow:none;
}
.tl-node svg{ width:26px; height:26px; color:var(--primary,#356084); }
.tl-num{
  background:var(--text,#172432);
  box-shadow:none;
  width:24px; height:24px; font-size:.76rem;
}
.tl-step:hover .tl-node{
  transform:none;
  border-color:var(--primary,#356084);
  box-shadow:none;
}
.tl-step:hover .tl-node svg{ transform:none; }
body.bmx-light .bmx-proc::after{ box-shadow:none; background:var(--bmx-primary,#356084); }

/* -----------------------------------------------------------------------------
   10. BUTTONS — solid, matte, no shimmer sweep
   -------------------------------------------------------------------------- */
.btn--primary,
body.bmx-light .bmx-btn--primary{
  background:var(--primary,#356084);
  color:#fff;
  box-shadow:none;
  border-radius:6px;
}
.btn--primary:hover,
body.bmx-light .bmx-btn--primary:hover{
  background:var(--primary-600,#2A4E6C);
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(20,36,52,.16);
}
.btn--primary::after, .btn--primary:hover::after,
.bmx-btn--primary::after, .bmx-btn--primary:hover::after,
body.bmx-light .bmx-btn--primary::after,
body.bmx-light .bmx-btn--primary:hover::after{
  content:none !important; animation:none !important;
}
.btn--ghost, body.bmx-light .bmx-btn--ghost{ border-radius:6px; box-shadow:none; }
.btn--ghost:hover{ transform:translateY(-2px); }

/* nav underline: one hairline in the accent, not a gradient bar */
.nav-links a::after{ background:var(--primary,#356084); height:1px; border-radius:0; bottom:-5px; }

/* -----------------------------------------------------------------------------
   11. FAQ — flat marker, no gradient fill on open
   -------------------------------------------------------------------------- */
.faq-item{ border-radius:var(--r-md); }
.faq-item[open]{ border-color:var(--border,#DAD4C7); background:var(--surface,#fff); }
.faq-item summary .pl{
  border-radius:4px; border-color:var(--border,#DAD4C7);
  color:var(--text,#172432);
}
.faq-item[open] summary .pl{ background:none; border-color:var(--primary,#356084); color:var(--primary,#356084); }

/* -----------------------------------------------------------------------------
   12. CLOSING CTA — a real navy band, matching the homepage rhythm
   -------------------------------------------------------------------------- */
.cta-inner::before{ content:none !important; }
.cta-inner{
  background:var(--text,#172432);
  border:0;
  border-radius:var(--r-xl);
  padding:clamp(2.6rem,5vw,4.4rem) clamp(1.6rem,4vw,3.4rem);
  /* inherited light ink, so ANY child element stays readable on the navy */
  color:#E7EDF4;
}
.cta-inner h2{ color:#F4F7FA; }
.cta-inner p, .cta-inner .lead, .cta-inner li, .cta-inner small{ color:#A9BCD0; }
.cta-inner strong, .cta-inner b{ color:#F4F7FA; }
.cta-inner a:not(.btn){ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.cta-inner .btn--primary{ background:#F2EFE8; color:var(--text,#172432); }
.cta-inner .btn--primary:hover{ background:#fff; color:var(--text,#172432); }
.cta-inner .btn--ghost{ border-color:rgba(255,255,255,.28); color:#E7EDF4; background:transparent; }
.cta-inner .btn--ghost:hover{ border-color:#fff; background:rgba(255,255,255,.06); }

/* -----------------------------------------------------------------------------
   13. GLASSMORPHISM — solid ink instead of frosted glass
   -------------------------------------------------------------------------- */
.ref-badge, .ref-open,
body.bmx-light .bmx-ref-card .ref-badge,
body.bmx-light .bmx-ref-card .ref-open,
.post-card .cat,
.project-card .thumb .tag{
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  background:rgba(23,36,50,.88);
  border-color:rgba(255,255,255,.12);
  border-radius:5px;
}
.post-card .cat, .project-card .thumb .tag{ color:#fff; }
body.bmx-light .bmx-glasscard{
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  background:#fff;
}

/* -----------------------------------------------------------------------------
   14. IDLE MOTION — off. Content that moves must have a reason to move.
       Kept: scroll reveal, and the reference / review marquees.
   -------------------------------------------------------------------------- */
.hv-glow, .hv-main, .hv-chip, .hv-dot, .hv-bars i, .hv-ring, .hv-main::after,
.bmx-shield, .bmx-ring, .bmx-chip, .bmx-svc-badge, .bmx-browser, .bmx-scan,
.bmx-growth, .bmx-growth .g-bars i, .bmx-chip-seo, .bmx-chip-web,
.bmx-net .edge, .bmx-webnet .edge,
body.bmx-light .bmx-reviews-badge,
.wa-float,
.hero-bg::before{
  animation:none !important;
}
body.bmx-light .bmx-stats{ animation:none !important; background:#172432 !important; }
body.bmx-light .bmx-cta-band{ animation:none !important; }
.wa-float{ box-shadow:0 6px 20px rgba(20,36,52,.22) !important; }

/* scroll progress: a hairline, not a neon strip */
.scroll-progress,
body.bmx-light .scroll-progress{
  height:2px; background:var(--primary,#356084) !important; box-shadow:none !important;
}

/* -----------------------------------------------------------------------------
   15. Remaining soft-gradient fills → flat tints
   -------------------------------------------------------------------------- */
body.bmx-light .bmx-pillar-ic{ background:var(--bmx-tint,#E4EAEF); border-radius:8px; }
body.bmx-light .bmx-pain-ic{ border-radius:8px; }
body.bmx-light .bmx-step-node{ box-shadow:none; }
body.bmx-light .bmx-chip .ok{ box-shadow:none; }
body.bmx-light .bmx-area-ic{ border-radius:9px; }
body.bmx-light .bmx-svc{ border-radius:11px; }
body.bmx-light .bmx-reviews-card,
body.bmx-light .bmx-ref-card,
body.bmx-light .bmx-reviews-badge{ border-radius:11px; }
body.bmx-light .bmx-tech{ border-radius:5px; }

/* -----------------------------------------------------------------------------
   16. FOOTER — two leftovers from the old dark theme, invisible on the light one
   -------------------------------------------------------------------------- */
.footer-region{ border-top:1px solid var(--border,#DAD4C7); }
.footer-region-row a{ opacity:1; color:var(--muted,#5F6B79); }
.footer-region-row a:hover{ color:var(--text,#172432); }   /* was #fff → vanished */
.footer-region-label{ color:var(--faint,#8A93A0); letter-spacing:.02em; }
/* colour change on hover, not a horizontal jump */
.footer-col a{ transition:color .2s; }
.footer-col a:hover{ padding-left:0; color:var(--text,#172432); }

/* form fields: square-ish, calm focus ring */
.field input, .field textarea, .field select{ border-radius:6px; }
.field input:focus, .field textarea:focus, .field select:focus{
  border-color:var(--primary,#356084);
  box-shadow:0 0 0 3px rgba(53,96,132,.12);
}
