/* PRISM DCA — site stylesheet.
   Kept in a file (not inline in the page) so the Content-Security-Policy can
   forbid inline styles. Component styles live in the React components. */

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0; height: 100%;
  background: #001230;
}
body { font-family: 'Inter', 'Aptos', system-ui, sans-serif; }
#root { height: 100%; }

/* ───── Theme: Prism (canonical brand) ───── */
.theme-prism {
  --bg: #F4F6FA;
  --surface: #FFFFFF;
  --raised: #FFFFFF;
  --border: #E5E9F0;
  --line: #B0B5C0;
  --text: #001230;
  --text-body: #0F1419;
  --mute: #4A5568;
  --dim: #4E5D6F;
  --accent: #9EA0A2;
  --accent-deep: #6B6E71;
  color: var(--text-body);
  background: var(--bg);
}

/* ───── PRISM brand button ───── */
.pb-btn {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Inter', 'Aptos', sans-serif;
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 13px 22px; border: 1px solid #001230;
  background: transparent; color: #001230;
  cursor: pointer; text-decoration: none;
  border-radius: 2px;
  transition: background 200ms cubic-bezier(0.4, 0, 0.2, 1), color 200ms, border-color 200ms;
}
.pb-btn:hover { background: #001230; color: #FFFFFF; }
.pb-btn--filled { background: #001230; color: #FFFFFF; }
.pb-btn--filled:hover { background: #000A1F; border-color: #000A1F; }
.pb-btn--filled-silver { background: #9EA0A2; color: #001230; border-color: #9EA0A2; }
.pb-btn--filled-silver:hover { background: #7E8082; border-color: #7E8082; color: #001230; }
.pb-btn--ghost { border-color: #B0B5C0; color: #001230; }
.pb-btn--ghost:hover { background: #001230; color: #FFFFFF; border-color: #001230; }

/* PRISM scrollbar */
[data-scrollable]::-webkit-scrollbar { width: 8px; }
[data-scrollable]::-webkit-scrollbar-thumb { background: #B0B5C0; border-radius: 2px; }
[data-scrollable]::-webkit-scrollbar-track { background: transparent; }

/* Placeholder grey darkened (from #B0B5C0) to meet WCAG AA contrast */
input::placeholder, textarea::placeholder { color: #6B6E71; opacity: 1; }

/* Entrance animation for the deal pop-up */
@keyframes pbFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes pbPopIn { from { transform: translateY(20px) scale(0.985); } to { transform: none; } }

/* Shown only if JavaScript is switched off */
.pb-noscript {
  max-width: 560px; margin: 0 auto; padding: 96px 24px;
  font-family: 'Inter', 'Aptos', system-ui, sans-serif; line-height: 1.6;
  color: #FFFFFF;
}
.pb-noscript h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 400; font-size: 40px; margin: 0 0 16px; }
.pb-noscript a { color: #FFFFFF; }

/* ─────────────────────────────────────────────────────────────
   Mobile / responsive (phones). Desktop layout is unchanged above
   768px; below it, multi-column layouts stack, padding tightens,
   and the big display headings scale down.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  html, body { overflow-x: hidden; }

  /* Collapse every multi-column grid into a single column */
  .theme-prism [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  /* Tighten the large page padding so content isn't cramped / overflowing */
  .theme-prism section,
  .theme-prism footer > div {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
  .theme-prism section { padding-top: 56px !important; padding-bottom: 56px !important; }

  /* Nav: tighter padding; hide the standalone Contact button (still in the menu) */
  .pb-nav { padding-left: 16px !important; padding-right: 16px !important; }
  .pb-nav .pb-btn--filled { display: none !important; }

  /* Scale down oversized display headings */
  .theme-prism main h1 { font-size: 44px !important; line-height: 1.07 !important; }
  .theme-prism main h2 { font-size: 30px !important; line-height: 1.15 !important; }

  /* Home hero: stack, and shrink the photo panel */
  .pb-hero { min-height: 0 !important; }
  .pb-hero-media { min-height: 300px !important; }
  .pb-hero-text {
    padding-left: 22px !important; padding-right: 22px !important;
    padding-top: 40px !important; padding-bottom: 48px !important;
  }

  /* Transaction cards fit narrow screens */
  .theme-prism [style*="width: 340px"] { width: 82vw !important; max-width: 320px !important; }

  /* Bigger tap targets for small text links (footer links, email addresses) */
  .theme-prism footer a,
  .theme-prism main a[href^="mailto:"] { display: inline-block; padding-top: 10px; }
}
