/* ============================================================
   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.1) !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: rgba(186, 230, 253, 0.3) !important; }        /* sky blue  */
.step { background: rgba(221, 214, 254, 0.32) !important; }                               /* violet    */
.info-tile, .meta-tile { background: rgba(207, 250, 254, 0.32) !important; }              /* cyan      */
.dl-card, .exp-note { background: rgba(167, 243, 208, 0.3) !important; }                  /* mint      */
.partner-chip { background: rgba(254, 215, 170, 0.3) !important; }                        /* peach     */
.card { background: rgba(254, 240, 199, 0.3) !important; }                                /* warm sand */
.tslide { background: rgba(254, 205, 211, 0.28) !important; }                             /* rose      */
.section-head { background: rgba(255, 255, 255, 0.15) !important; }
.svc:hover, .link-card:hover, .next-band:hover { background: rgba(186, 230, 253, 0.45) !important; }
.step:hover { background: rgba(221, 214, 254, 0.48) !important; }
.card:hover { background: rgba(254, 240, 199, 0.45) !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: #35496b !important;
}
.team-card__creds, .team-card__spec, .exp-note div { color: #4a6284 !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: #4a6284 !important; border-color: rgba(0, 0, 0, 0.3) !important; }
.checks li, .scope-item p { color: #35496b !important; }
.checks svg, .scope-item svg { color: #0e63c4 !important; }
.step__n { -webkit-text-stroke: 1.5px rgba(14, 99, 196, 0.75) !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: #35496b !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.2);
  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: #35496b !important; }
.hero .eyebrow, .page-hero .eyebrow { color: #0e63c4 !important; }
.crumbs a, .crumbs span { color: #35496b !important; }
.hero__scroll { color: #4a6284 !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: #4a6284 !important; }

/* ---------- footer: white glass, dark text ---------- */
.site-footer {
  background: rgba(255, 255, 255, 0.2) !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: #35496b !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.2) !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: #4a6284 !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: #35496b !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; }
}

/* ---------- closing Brief band ----------
   These pages have a plain <body>, so the base sheet's band rules — which all
   need an .hx ancestor — never match. Restating what they would have got:
   the headline at the band's own scale, on one row, next to its button. */
.cta-band h2 {
  font-size: clamp(1.65rem, 2.6vw, 2.3rem);
  letter-spacing: -0.03em;
  margin-bottom: 8px;
}
.cta-band__inner { align-items: center; }
@media (max-width: 640px) {
  .cta-band h2 { font-size: clamp(1.4rem, 6.2vw, 1.8rem); }
}