/* ============================================================
   The BrainTree — inner-page layer
   ------------------------------------------------------------
   Loaded on every page after redesign.css / redesign-alt.css.
   The homepage is built from .rd-* components and carries none
   of the Tailwind utility classes rewritten here, so this file
   only touches the inner pages. Everything is scoped to
   body.rd2 .body-inner and never reaches the hero or the footer.
   ============================================================ */

/* ------------------------------------------------------------
   Page banner -> editorial hero, matching the homepage language
   ------------------------------------------------------------ */
body.rd2 .body-inner > div[style*="background-image"] {
  position: relative;
  height: auto !important;
  min-height: 380px;
  padding: clamp(78px, 10vw, 128px) 0 clamp(42px, 5vw, 60px);
  align-items: flex-end;
  background-position: center 42%;
  border-radius: 0 0 40px 40px;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
}

body.rd2 .body-inner > div[style*="background-image"]>div:not(.absolute) {
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: 22px;
  text-align: left;
}

/* one visual treatment wins over the per-page overlay utilities */
body.rd2 .body-inner > div[style*="background-image"]>.absolute {
  background: linear-gradient(100deg,
      rgba(6, 15, 28, .96) 0%,
      rgba(6, 15, 28, .88) 34%,
      rgba(6, 15, 28, .58) 66%,
      rgba(6, 15, 28, .34) 100%) !important;
  opacity: 1 !important;
}

/* amber/blue glow + fine dot grain */
body.rd2 .body-inner > div[style*="background-image"]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(640px 260px at 88% 118%, rgba(242, 169, 0, .34), transparent 68%),
    radial-gradient(520px 240px at 6% -12%, rgba(0, 86, 179, .3), transparent 70%);
}

body.rd2 .body-inner > div[style*="background-image"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image: radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: .5;
  -webkit-mask-image: linear-gradient(100deg, #000, transparent 56%);
  mask-image: linear-gradient(100deg, #000, transparent 56%);
}

body.rd2 .body-inner > div[style*="background-image"] h1,
body.rd2 .body-inner > div[style*="background-image"] h2,
body.rd2 .body-inner > div[style*="background-image"] h3 {
  color: #fff;
}

body.rd2 .body-inner > div[style*="background-image"] h1 {
  font-size: clamp(2.05rem, 4.3vw, 3.35rem);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -.033em;
  margin: 0 0 18px;
  text-wrap: balance;
  max-width: 22ch;
}

body.rd2 .body-inner > div[style*="background-image"] p {
  color: rgba(255, 255, 255, .8);
  font-size: clamp(1rem, 1.3vw, 1.14rem);
  font-weight: 400;
  max-width: 52ch;
}

/* breadcrumb as a glass pill */
body.rd2 .body-inner > div[style*="background-image"] nav {
  justify-content: flex-start;
}

body.rd2 .body-inner > div[style*="background-image"] nav ol {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .18);
  backdrop-filter: blur(10px);
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .01em;
}

body.rd2 .body-inner > div[style*="background-image"] nav ol a,
body.rd2 .body-inner > div[style*="background-image"] nav ol li {
  color: rgba(255, 255, 255, .75);
}

body.rd2 .body-inner > div[style*="background-image"] nav ol a:hover {
  color: #fff;
}

body.rd2 .body-inner > div[style*="background-image"] nav ol li:last-child {
  color: #f6c65a;
}

/* ------------------------------------------------------------
   Surfaces: let the shared depth layer glow through
   ------------------------------------------------------------ */
body.rd2 .body-inner > section {
  position: relative;
}

/* light sections carry deep ink by default; dark bands are excluded and
   set their own text colour, and white cards re-assert ink headings */
body.rd2 .body-inner > section:not([style*="background-image"]) {
  color: var(--w-ink);
}

body.rd2 .body-inner .bg-white h1:not([class*="text-"]),
body.rd2 .body-inner .bg-white h2:not([class*="text-"]),
body.rd2 .body-inner .bg-white h3:not([class*="text-"]),
body.rd2 .body-inner .bg-white h4:not([class*="text-"]) {
  color: var(--w-ink);
}

/* large indigo/violet panels join the ink palette */
body.rd2 .body-inner section div[class*="bg-indigo-9"][class*="rounded-"],
body.rd2 .body-inner section div[class*="bg-purple-9"][class*="rounded-"],
body.rd2 .body-inner section div[class*="bg-blue-9"][class*="rounded-"] {
  background-color: #0c1c2b;
}

body.rd2 .body-inner section div[class*="bg-indigo-9"][class*="rounded-"] h2,
body.rd2 .body-inner section div[class*="bg-purple-9"][class*="rounded-"] h2,
body.rd2 .body-inner section div[class*="bg-indigo-9"][class*="rounded-"] h3,
body.rd2 .body-inner section div[class*="bg-purple-9"][class*="rounded-"] h3 {
  color: #fff;
}

body.rd2 .body-inner > section.bg-white {
  background: transparent;
}

body.rd2 .body-inner > section.bg-gray-50,
body.rd2 .body-inner > section.bg-gray-100 {
  background: rgba(243, 236, 225, .5);
}

body.rd2 .body-inner > section.bg-primary,
body.rd2 .body-inner > section.bg-blue-900,
body.rd2 .body-inner > section.bg-gray-900 {
  background: #0c1c2b;
  color: #b7cadb;
}

body.rd2 .body-inner > section.bg-primary h2,
body.rd2 .body-inner > section.bg-blue-900 h2,
body.rd2 .body-inner > section.bg-gray-900 h2,
body.rd2 .body-inner > section.bg-primary h3,
body.rd2 .body-inner > section.bg-blue-900 h3,
body.rd2 .body-inner > section.bg-gray-900 h3 {
  color: #fff;
}

/* full-bleed dark bands built on a background image */
body.rd2 .body-inner > section[style*="background-image"] {
  position: relative;
  overflow: hidden;
}

body.rd2 .body-inner > section[style*="background-image"]>.absolute {
  background: linear-gradient(100deg, rgba(6, 15, 28, .97), rgba(8, 22, 38, .86) 55%, rgba(11, 31, 53, .92)) !important;
  opacity: 1 !important;
}

body.rd2 .body-inner > section[style*="background-image"] h3 {
  border-bottom-color: rgba(242, 169, 0, .5) !important;
  color: #fff;
}

body.rd2 .body-inner > section[style*="background-image"] li {
  color: #c3d5e3;
}

/* ------------------------------------------------------------
   Type colours
   ------------------------------------------------------------ */
body.rd2 .body-inner section .text-gray-900,
body.rd2 .body-inner section .text-gray-800,
body.rd2 .body-inner section .text-gray-700 {
  color: var(--w-ink);
}

body.rd2 .body-inner section .text-gray-600,
body.rd2 .body-inner section .text-gray-500 {
  color: var(--w-ink-2);
}

body.rd2 .body-inner section .text-gray-400 {
  color: #74889a;
}

body.rd2 .body-inner section .text-primary {
  color: var(--w-amber-deep);
}

/* underlined section headings and any primary border become amber */
body.rd2 .body-inner section [class*="border-primary"] {
  border-color: var(--w-amber);
}

/* centred divider bars become amber rules */
body.rd2 .body-inner section .bg-primary.mx-auto {
  background-color: var(--w-amber);
}

body.rd2 .body-inner section .bg-gradient-to-r.bg-primary,
body.rd2 .body-inner section [class*="from-primary"][class*="to-blue"],
body.rd2 .body-inner section .bg-gradient-to-r.from-teal-400 {
  background-image: linear-gradient(90deg, var(--w-amber), rgba(242, 169, 0, .22));
}

/* ------------------------------------------------------------
   Cards: one calm, consistent surface
   ------------------------------------------------------------ */
body.rd2 .body-inner section .bg-white.rounded-3xl,
body.rd2 .body-inner section .bg-white.rounded-2xl,
body.rd2 .body-inner section .bg-white.rounded-\[2rem\] {
  box-shadow: inset 0 0 0 1px var(--w-line), 0 26px 46px -40px rgba(15, 34, 51, .6);
  transition: transform .4s cubic-bezier(.2, .7, .3, 1), box-shadow .4s ease;
}

body.rd2 .body-inner section .bg-white.rounded-3xl:hover,
body.rd2 .body-inner section .bg-white.rounded-2xl:hover,
body.rd2 .body-inner section .bg-white.rounded-\[2rem\]:hover {
  box-shadow: inset 0 0 0 1px rgba(15, 34, 51, .12), 0 40px 62px -38px rgba(15, 34, 51, .62);
}

/* dark cards keep their own surface but get a warmer hairline */
body.rd2 .body-inner section .bg-gray-900.rounded-3xl,
body.rd2 .body-inner section .bg-gray-800.rounded-3xl,
body.rd2 .body-inner section .bg-gray-800.rounded-2xl {
  background: #0e2135;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07), 0 30px 50px -40px rgba(6, 15, 28, .9);
}

/* icon tiles */
body.rd2 .body-inner section .bg-primary\/10 {
  background-color: rgba(242, 169, 0, .15);
}

body.rd2 .body-inner section .rounded-2xl.text-primary,
body.rd2 .body-inner section .rounded-full.text-primary {
  color: var(--w-amber-deep);
}

/* ------------------------------------------------------------
   Buttons
   ------------------------------------------------------------ */
body.rd2 .body-inner section .btn-primary,
body.rd2 .body-inner section a.bg-primary,
body.rd2 .body-inner section button.bg-primary,
body.rd2 .body-inner section button[type="submit"] {
  background-color: var(--w-ink);
  background-image: none;
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: .01em;
  box-shadow: 0 20px 32px -24px rgba(15, 34, 51, .95);
  transition: transform .25s ease, background-color .25s ease, box-shadow .25s ease, color .25s ease;
}

body.rd2 .body-inner section .btn-primary:hover,
body.rd2 .body-inner section a.bg-primary:hover,
body.rd2 .body-inner section button.bg-primary:hover,
body.rd2 .body-inner section button[type="submit"]:hover {
  background-color: var(--w-amber);
  color: #12202e;
  box-shadow: 0 24px 38px -24px rgba(169, 115, 0, .95);
}

/* small primary chips (blog categories, tags) go ink instead of brand blue */
body.rd2 .body-inner section span.bg-primary,
body.rd2 .body-inner section div.bg-primary.bg-opacity-10 {
  background-color: var(--w-ink);
  color: #fff;
}

/* the inverted CTA (white pill on a dark band) */
body.rd2 .body-inner section a.bg-white.text-primary {
  color: var(--w-ink);
  border-radius: 999px;
  font-weight: 700;
}

body.rd2 .body-inner section a.bg-white.text-primary:hover {
  background-color: var(--w-amber);
  color: #12202e;
}

/* ------------------------------------------------------------
   Forms
   ------------------------------------------------------------ */
body.rd2 .body-inner section form label {
  color: var(--w-ink);
  font-size: .84rem;
  font-weight: 600;
  letter-spacing: .02em;
}

body.rd2 .body-inner section form input[type="text"],
body.rd2 .body-inner section form input[type="email"],
body.rd2 .body-inner section form input[type="date"],
body.rd2 .body-inner section form input[type="tel"],
body.rd2 .body-inner section form select,
body.rd2 .body-inner section form textarea {
  width: 100%;
  background: #fff;
  border: 1px solid var(--w-line);
  border-radius: 14px;
  padding: 14px 16px;
  font-size: .96rem;
  color: var(--w-ink);
  box-shadow: 0 1px 2px rgba(15, 34, 51, .04);
  transition: border-color .25s ease, box-shadow .25s ease;
}

body.rd2 .body-inner section form input::placeholder,
body.rd2 .body-inner section form textarea::placeholder {
  color: #93a5b3;
}

body.rd2 .body-inner section form input:focus,
body.rd2 .body-inner section form select:focus,
body.rd2 .body-inner section form textarea:focus {
  outline: none;
  border-color: var(--w-amber);
  box-shadow: 0 0 0 4px rgba(242, 169, 0, .18);
}

/* ------------------------------------------------------------
   Lists, media, maps
   ------------------------------------------------------------ */
body.rd2 .body-inner section li .fa-check,
body.rd2 .body-inner section li .fa-check-circle,
body.rd2 .body-inner section li .fa-plus {
  color: var(--w-amber);
}

body.rd2 .body-inner section iframe {
  border: 0;
  border-radius: 20px;
  box-shadow: inset 0 0 0 1px var(--w-line), 0 30px 52px -44px rgba(15, 34, 51, .7);
}

body.rd2 .body-inner section img.shadow-lg,
body.rd2 .body-inner section img.shadow-xl {
  border-radius: 20px;
}

/* headings inside content get the homepage's tighter tracking */
body.rd2 .body-inner section h2,
body.rd2 .body-inner section h3 {
  letter-spacing: -.028em;
}

/* ------------------------------------------------------------
   Small screens
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  body.rd2 .body-inner > div[style*="background-image"] {
    min-height: 300px;
    padding-top: clamp(64px, 16vw, 92px);
    border-radius: 0 0 26px 26px;
  }

  body.rd2 .body-inner > div[style*="background-image"] h1 {
    max-width: none;
  }

  body.rd2 .body-inner > div[style*="background-image"] nav ol {
    padding: 7px 14px;
  }
}
