/* ============================================================
   3D CONCEPT PREVIEW — theme overrides over the ORIGINAL site.
   The original files are untouched; everything 3D-related lives
   here. Delete this file + the injected <canvas>/<script> tags
   and the site is back to 100% original.

   Theme (per user request): WHOLE page background white (the 3D
   canvas is opaque white), content cards = white glass (20%
   opacity + blur) with thin black border, dark text everywhere.
   ============================================================ */

/* The 3D canvas sits fixed behind everything, fully opaque white. */
#gl {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: 0; display: block; pointer-events: none;
}

/* page layers must sit above the canvas */
main, .site-footer { position: relative; z-index: 1; }

/* whole-page white: every original section background is removed
   so the white 3D canvas shows through everywhere */
body { background: #ffffff !important; }
html { background: #ffffff !important; }
.section--dark, .section--paper, .section, .showcase { background: transparent !important; }
body { background: transparent !important; }

/* ---------- white glass card scheme (90% transparent) + light color tints ---------- */
.card, .info-tile, .step, .rel-card, .std-chip, .member, .team-card,
.faq-item, .faq, .dl-card, .partner-chip, .meta-tile, .next-band,
.link-card, .tslide, .callout, .form, .exp-note, .svc, .section-head {
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px);
  color: #16273f !important;
}

/* the contact form card: keep the glass surface, drop the border */
.form {
  border: 0 !important;
}

/* light pastel tints per card family — keeps the glass airy but colorful */
.svc, .link-card, .next-band { background: #e8f5fe !important; }        /* sky blue  */
.step { background: #eeebfe !important; }                               /* violet    */
.info-tile, .meta-tile { background: #e9fbfd !important; }              /* cyan      */
.dl-card, .exp-note { background: #e6f9ef !important; }                  /* mint      */
.partner-chip { background: #fdf0e2 !important; }                        /* peach     */
.card { background: #fdf7e3 !important; }                                /* warm sand */
.tslide { background: #fdeef1 !important; }                             /* rose      */
.section-head { background: rgba(255, 255, 255, 0.92) !important; }
.svc:hover, .link-card:hover, .next-band:hover { background: #d8edfd !important; }
.step:hover { background: #e2dcfd !important; }
.card:hover { background: #fdf2d2 !important; }

/* dark text inside glass cards */
.card h3, .step h3, .info-tile h3, .team-card__name, .faq-q span,
.dl-card .h-3, .partner-chip b, .meta-tile b, .next-band h3,
.link-card h3, .tslide .tname, .callout, .std-chip b,
.exp-note div b, .svc h3, .rel-card b, .faq-q {
  color: #0c1d38 !important;
}
.card p, .step p, .info-tile p, .faq-a p, .dl-card p, .partner-chip span,
.meta-tile span, .link-card p, .tslide .trole, .std-chip small,
.team-card__role, .team-card__creds, .team-card__spec,
.team-card__bullets li, .form__note, .exp-note div, .svc p, .rel-card small {
  color: #24385c !important;
}
.team-card__creds, .team-card__spec, .exp-note div { color: #2f4670 !important; }
.next-band small { color: #0e63c4 !important; }
.card__icon, .info-tile__icon, .team-card__photo--init span,
.svc__icon, .faq-q svg, .link-card > svg:first-child, .link-card .go,
.rel-card .arrow, .checklist-icon { color: #0e63c4 !important; }
.faq-q svg, .checklist-icon { color: #0e63c4 !important; }
.dl-card__meta span { color: #2f4670 !important; border-color: rgba(0, 0, 0, 0.3) !important; }
.checks li, .scope-item p { color: #24385c !important; }
.checks svg, .scope-item svg { color: #0e63c4 !important; }
.step__n { color: #0e63c4 !important; }
.svc__icon { background: rgba(14, 99, 196, 0.12) !important; color: #0e63c4 !important; }
.tslide .tquote { color: #16273f !important; }
.faq-q svg { color: #0e63c4 !important; }

/* section headings also sit on glass so they never blend with the model */
.section-head {
  padding: clamp(22px, 3vw, 34px) clamp(22px, 3vw, 36px);
}
.section-head .h-2 { color: #0c1d38 !important; }
.section-head .lead { color: #24385c !important; }
.section-head .eyebrow { color: #0e63c4 !important; }
.section-head.center { text-align: left; }

/* eyebrow accents: blue on white */
.eyebrow { color: #0e63c4 !important; }
.eyebrow::before { background: var(--red) !important; }

/* ---------- callout: amber note on glass ---------- */
.callout {
  background: rgba(245, 165, 36, 0.14) !important;
  border-left: 3px solid #c77414 !important;
  border-top: 0 !important; border-right: 0 !important; border-bottom: 0 !important;
  color: #4a3a14 !important;
}
.callout b { color: #2c2208 !important; }

/* ---------- hero: white glass over the 3D scene ---------- */
.hero { background: transparent !important; }
.hero__bg, .page-hero__bg, .hero__scrim, .page-hero__scrim, .hero__grid { display: none !important; }
.hero__content, .page-hero .container {
  position: relative; z-index: 2;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px);
  border: 1px solid rgba(0, 0, 0, 0.6);
  border-radius: 20px;
  padding: clamp(28px, 4vw, 56px) !important;
}
.hero__title, .page-hero .h-display { color: #0c1d38 !important; }
.hero__lead, .page-hero .lead { color: #24385c !important; }
.hero .eyebrow, .page-hero .eyebrow { color: #0e63c4 !important; }
.crumbs a, .crumbs span { color: #24385c !important; }
.hero__scroll { color: #2f4670 !important; }
.hero__title .l > span, .hero.in .hero__title .l > span { color: #0c1d38; }
.stat__num { color: #0c1d38 !important; }
.stat__num i { color: var(--red) !important; }
.stat__label { color: #2f4670 !important; }

/* ---------- footer: white glass, dark text ---------- */
.site-footer {
  background: rgba(255, 255, 255, 0.9) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px);
}
.ft p, .ft a, .ft span, .ft__addr { color: #24385c !important; }
.ft h4 { color: #0c1d38 !important; }
.ft a:hover { color: #0e63c4 !important; }
.ft__base span { color: #6d80a0 !important; }

/* ---------- tables ---------- */
.exp-tablewrap, .tablewrap { background: rgba(255, 255, 255, 0.9) !important; border: 1px solid rgba(0, 0, 0, 0.6) !important; }
.exp-table th, .compare th { color: #0e63c4 !important; background: rgba(255, 255, 255, 0.45) !important; }
.exp-table td, .compare td { color: #16273f !important; border-top-color: rgba(0, 0, 0, 0.18) !important; }
.exp-work { color: #0c1d38 !important; font-weight: 600; }
.exp-caption b { color: #0c1d38 !important; }
.exp-caption span { color: #2f4670 !important; }
.eng-status { background: rgba(5, 150, 105, 0.14) !important; color: #047857 !important; }
.eng-status--wip { background: rgba(217, 119, 6, 0.16) !important; color: #b45309 !important; }

/* ---------- forms ---------- */
.form input, .form select, .form textarea, .form .field input, .form .field select, .form .field textarea {
  background: rgba(255, 255, 255, 0.75) !important;
  border: 1px solid rgba(0, 0, 0, 0.3) !important;
  color: #0c1d38 !important;
}
.form label { color: #24385c !important; }
.form input:focus, .form select:focus, .form textarea:focus { border-color: #0e63c4 !important; }

/* FAQ filter chips: glass pills with thin black border (active = brand navy) */
.faq-chip { background: rgba(255, 255, 255, 0.45) !important; color: #16273f !important; box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, 0.45) !important; }
.faq-chip:hover { background: #fff !important; }
.faq-chip.is-active { background: var(--grad-brand) !important; color: #fff !important; box-shadow: 0 8px 22px rgba(0, 96, 168, 0.32) !important; }
.btn--outline, .btn--ghost {
  color: #12233d !important;
  border-color: rgba(0, 0, 0, 0.4) !important;
  background: rgba(255, 255, 255, 0.6) !important;
}
.btn--outline:hover, .btn--ghost:hover { background: #fff !important; }
.btn--primary { color: #fff !important; }

/* ---------- image-backed cards keep their own dark scrims ---------- */
.ind-card, .cta-band { /* unchanged — photo cards */ }

/* ---------- maps / iframe ---------- */
.map-frame iframe { filter: none !important; }
.map-frame { border: 1px solid rgba(0, 0, 0, 0.6) !important; }

/* the original preloader is removed on 3D pages — the assembly IS the intro */
.preloader { display: none !important; }

/* reduced motion: static assembled model, no orbit (handled in scene3d.js) */
@media (prefers-reduced-motion: reduce) {
  #gl { opacity: 1; }
}

/* --------------------------------------------------------------------------
   READABILITY PASS — 2026-09-27
   Same treatment for the glass pages: legible labels on a properly opaque
   surface, with no hairline grey.
   -------------------------------------------------------------------------- */
.crumbs, .crumbs a, .crumbs span, .stat__label, .hero__scroll,
.dl-card__meta span, .ft__base span, .exp-caption span, .team-card__role,
.team-card__creds, .team-card__spec, .std-chip small, .meta-tile span,
.rel-card small, .tslide .trole { font-size: 13.5px !important; }
.stat__label, .hero__scroll, .dl-card__meta span, .ft__base span,
.team-card__role, .team-card__creds, .team-card__spec { font-weight: 600 !important; }
.crumbs, .crumbs a, .crumbs span, .hero__scroll, .ft__base span,
.dl-card__meta span, .exp-caption span { color: #3f5273 !important; }

/* breadcrumb text sat light for the old dark hero; the hero surface is opaque
   now, so it must read dark (legacy glass pages only). */
.page-hero .breadcrumb, .page-hero .breadcrumb a, .page-hero .breadcrumb span,
.breadcrumb, .breadcrumb a, .breadcrumb .sep { color: #24385c !important; opacity: 1 !important; }

/* --------------------------------------------------------------------------
   READABILITY PASS — 2026-09-27
   This layer makes every section background transparent, so the dark-band
   palette (white / pale slate) has to become ink or it disappears on paper.
   -------------------------------------------------------------------------- */
.section--dark, .section--dark h1, .section--dark h2, .section--dark h3,
.section--dark h4, .section--dark p, .section--dark li, .section--dark .lead,
.section--dark .card p, .section--dark .card h3, .section--dark .checks li,
.section--dark .h-3, .section--dark strong, .section--dark b,
.section--dark .info-tile p, .section--dark .step p {
  color: #24385c !important;
}
.section--dark .eyebrow { color: #0e63c4 !important; }
.section--dark .text-grad {
  background: linear-gradient(100deg, #0e63c4 0%, #c00018 120%) !important;
  -webkit-background-clip: text; background-clip: text; color: transparent !important;
}
.section--dark .card, .section--dark .info-tile, .section--dark .step {
  background: rgba(255, 255, 255, 0.92) !important;
}