/* =========================================================
   Brandesis Landing Page System — Global CSS (CLEAN)
   Single tokens + single base + single components set
   ========================================================= */

/* =========================================================
   TOKENS
   ========================================================= */
@import url("https://fonts.googleapis.com/css2?family=Lora:wght@400;700&display=swap");
:root {
  /* Brand colours */
  --brand-green: #1E3932;
  --brand-orange: #E55906;
  --brand-orange-soft: #F28947;

  /* Neutrals */
  --bg: #F7F8F9;
  --surface: #FFFFFF;
  --border: #E6E8EC;

  /* Text */
  --text: var(--brand-green);
  --muted: #5C706C;

  /* Layout */
  --container: 1120px;

  /* Radius system */
  --radius: 6px;
  --radius-lg: 6px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-card: 0 10px 28px rgba(15, 23, 42, 0.06);
  --shadow-modal: 0 24px 80px rgba(2, 6, 23, 0.35);

  /* Spacing scale */
  --s-1: 8px;
  --s-2: 12px;
  --s-3: 16px;
  --s-4: 24px;
  --s-5: 32px;
  --s-6: 48px;
  --s-7: 72px;

  /* Type scale */
  --h1: clamp(40px, 3.6vw, 64px);

  /* Your current H2 token (you asked for larger) */
  --h2: clamp(36px, 4vw, 48px);

  --h3: 18px;
  --body: 16px;
  --small: 14px;
}

/* =========================================================
   BASE
   ========================================================= */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: Aeonik, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: var(--body);
  line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }

/* Utility */
.text-center { text-align: center; }
.br-center { text-align: center; }

/* Container */
.br-container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--s-4);
}

/* Section spacing */
.br-section { padding: var(--s-7) 0; }
.br-section--tight { padding: var(--s-6) 0; }

/* =========================================================
   TYPOGRAPHY
   ========================================================= */

.br-h1 {
  font-size: var(--h1);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 var(--s-4);
}

.br-h2 {
  font-size: var(--h2);
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0 0 var(--s-5);
  font-weight: 700;
  color: var(--brand-green);
}

.br-h2--accent { color: var(--brand-orange); }

.br-h3 {
  font-size: var(--h3);
  line-height: 1.3;
  margin: 0 0 var(--s-2);
}

.br-lead {
  font-size: clamp(16px, 1.2vw, 18px);
  color: var(--muted);
  margin: 0 0 var(--s-5);
}

.br-muted { color: var(--muted); }

/* =========================================================
   BUTTONS
   ========================================================= */

.br-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
}

.br-btn:active { transform: translateY(1px); }

.br-btn svg,
.br-btn img{
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 auto;
}

.br-btn--primary {
  background: var(--brand-orange);
  color: #fff;
  box-shadow: 0 10px 26px rgba(229, 89, 6, 0.26);
}
.br-btn--primary:hover { background: #D85105; }

.br-btn--secondary {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,0.25);
}
.br-btn--secondary:hover {
  border-color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.06);
}

.br-btn--ghost {
  background: transparent;
  color: var(--brand-green);
  border-color: rgba(30, 57, 50, 0.22);
}
.br-btn--ghost:hover { border-color: rgba(30, 57, 50, 0.40); }

/* =========================================================
   CARDS + GRIDS
   ========================================================= */

.br-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}

.br-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-4);
}
.br-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-4);
}

/* =========================================================
   LISTS + GOAL BULLETS (KEEP ROUND)
   ========================================================= */

.br-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}

.br-list li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  color: var(--muted);
}

.br-list li strong { color: var(--text); }

/* Orange check-in-circle (intentional exception) */
.br-dot {
  width: 18px;
  height: 18px;
  border-radius: var(--radius-pill);
  background: transparent;
  border: 1px solid rgba(229, 89, 6, 0.55);
  margin-top: 2px;
  flex: 0 0 auto;
  position: relative;
}

.br-dot::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 5px;
  width: 7px;
  height: 4px;
  border-left: 2px solid var(--brand-orange);
  border-bottom: 2px solid var(--brand-orange);
  transform: rotate(-45deg);
}

/* Optional (also round) */
.br-check {
  width: 18px;
  height: 18px;
  border-radius: var(--radius-pill);
  background: transparent;
  border: 1px solid rgba(229, 89, 6, 0.55);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  flex: 0 0 auto;
  color: var(--brand-orange);
  font-weight: 900;
}

/* =========================================================
   HERO
   ========================================================= */

.br-hero {
  background: var(--brand-green);
  color: #fff;
}

.br-hero .br-lead { color: rgba(255,255,255,0.72); }

.br-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: var(--s-6);
  align-items: start;
}

.br-hero-content { padding-top: 6px; }

/* pill exception */
.br-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  font-size: var(--small);
  margin-bottom: var(--s-4);
}

.br-lead--hero { max-width: 54ch; }

.br-hero-ctas {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.br-hero-panel {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.10);
}

.br-hero-media { background: #FFF; }
.br-hero-image { width: 100%; height: auto; display: block; }

.br-hero-form { padding: 22px 22px 18px; }

.br-hero-bonus {
  margin: 14px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(15, 23, 42, 0.70);
}
.br-hero-bonus strong { color: var(--brand-orange); }

/* =========================================================
   HUBSPOT FORMS (GLOBAL)
   ========================================================= */

.hs-form label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 8px;
  color: rgba(15, 23, 42, 0.75);
}

.hs-form input[type="text"],
.hs-form input[type="email"],
.hs-form input[type="tel"],
.hs-form select,
.hs-form textarea {
  width: 100%;
  padding: 12px 12px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: #fff;
  font-size: 14px;
  outline: none;
}

.hs-form input:focus,
.hs-form select:focus,
.hs-form textarea:focus {
  border-color: rgba(229, 89, 6, 0.45);
  box-shadow: 0 0 0 4px rgba(229, 89, 6, 0.10);
}

.hs-form .hs-error-msg,
.hs-form .hs-error-msgs label {
  color: #B42318;
  font-size: 12px;
}

.hs-button,
.hs-form input[type="submit"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 12px 18px !important;
  border-radius: var(--radius) !important;
  border: 1px solid transparent !important;
  background: var(--brand-orange) !important;
  color: #fff !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

.hs-button:hover,
.hs-form input[type="submit"]:hover {
  background: #D85105 !important;
}

.hs-form .hs_submit { margin-top: 14px; }

/* =========================================================
   WHAT YOU’LL LEARN — CARDS
   ========================================================= */

.br-learn{
  --learn-border: #E8EEF3;
  --learn-muted: #5C706C;
  --learn-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 6px 18px rgba(15, 23, 42, 0.04);
  --learn-shadow-hover:
    0 10px 24px rgba(15, 23, 42, 0.10),
    0 22px 60px rgba(15, 23, 42, 0.10);
}

.br-learn .br-learn-intro{
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}

.br-learn-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-4);
  margin-top: var(--s-6);
  grid-auto-rows: 1fr;
  align-items: stretch;
}

.br-learn-grid--2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }

.br-learn-card{
  background: var(--surface);
  border: 1px solid var(--learn-border);
  border-radius: var(--radius);
  padding: var(--s-5);
  box-shadow: var(--learn-shadow);
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.br-learn-card:hover{
  transform: translateY(-4px);
  border-color: rgba(229, 89, 6, 0.22);
  box-shadow: var(--learn-shadow-hover);
}

.br-learn-icon{
  width: 24px;
  height: 24px;
  margin: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.br-learn-icon svg{
  width: 24px;
  height: 24px;
  display: block;
  stroke: var(--brand-green);
  stroke-width: 1.8;
  fill: none;
  transition: stroke 200ms ease, transform 200ms ease;
}

.br-learn-icon img{
  width: 24px;
  height: 24px;
  display: block;
  object-fit: contain;
  transition: filter 200ms ease, transform 200ms ease;
  filter: brightness(0) saturate(100%)
          invert(14%) sepia(11%)
          saturate(1700%) hue-rotate(121deg)
          brightness(92%) contrast(93%);
}

.br-learn-card:hover .br-learn-icon svg{
  stroke: var(--brand-orange);
  transform: translateY(-1px);
}

.br-learn-card:hover .br-learn-icon img{
  transform: translateY(-1px);
  filter: brightness(0) saturate(100%)
          invert(42%) sepia(89%)
          saturate(1260%) hue-rotate(356deg)
          brightness(96%) contrast(95%);
}

.br-learn-title{
  margin: 0 0 12px;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--brand-green);
}

.br-learn-desc{
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--learn-muted);
}

/* =========================================================
   WHY DOWNLOAD + WHO IT’S FOR (SPLIT)
   ========================================================= */

.br-split{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--s-6);
  align-items: start;
}

.br-bonus-note{
  display: block;
  margin-top: 18px;
  font-size: 13px;
  color: var(--muted);
}
.br-bonus-note strong{
  color: var(--brand-orange);
  margin-right: 6px;
}

.br-audience-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.br-audience-card{
  background: var(--surface);
  border: 1px solid #EEF2F6;
  border-radius: var(--radius);
  padding: 16px 18px;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 6px 18px rgba(15, 23, 42, 0.04);
}

.br-audience-card h3{
  margin: 0 0 6px;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--brand-green);
}

.br-audience-card p{
  margin: 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted);
}

/* =========================================================
   TESTIMONIAL (SINGLE / ROTATOR)
   ========================================================= */

.br-testimonial{ background: var(--br-section-bg, #F2F2F2); }

.br-testimonial-inner{
  --t-avatar: 192px;
  max-width: 920px;
  margin: 0 auto;
  text-align: center;
}

.br-testimonial-quote{
  font-size: clamp(22px, 2.2vw, 40px);
  line-height: 1.25;
  font-weight: 500;
  margin: 0 0 40px;
  color: var(--brand-green);
}

.br-testimonial-author{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.br-testimonial-avatar{
  width: var(--t-avatar);
  height: var(--t-avatar);
  border-radius: var(--radius-pill);
  overflow: hidden;
  background: rgba(0,0,0,0.06);
}

.br-testimonial-avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.br-testimonial-name{ font-weight: 700; font-size: 18px; }
.br-testimonial-title{ font-size: 14px; color: var(--muted); }

.br-testimonial-rotator{
  position: relative;
  min-height: 520px;
}

.br-testimonial-slide{
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 500ms ease, transform 500ms ease;
}

.br-testimonial-slide.is-active{
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.br-testimonial.is-dark,
.br-testimonial.is-dark *{ color: #fff; }
.br-testimonial.is-dark .br-testimonial-title{ color: rgba(255,255,255,0.75); }

/* =========================================================
   MODAL
   ========================================================= */

.br-modal{ position: fixed; inset: 0; display: none; z-index: 9999; }
.br-modal[aria-hidden="false"]{ display: block; }

.br-modal__overlay{
  position:absolute; inset:0;
  background: rgba(15,23,42,0.55);
}

.br-modal__dialog{
  position: relative;
  max-width: 720px;
  margin: 6vh auto;
  background: var(--surface);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(15,23,42,0.08);
  box-shadow: var(--shadow-modal);
  overflow: hidden;
}

.br-modal__header{
  display:flex; align-items:center; justify-content:space-between;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(15,23,42,0.08);
}

.br-modal__title{ font-weight: 800; color: var(--brand-green); }

.br-modal__close{
  background: transparent;
  border: 0;
  cursor: pointer;
  font-weight: 800;
  color: var(--brand-orange);
}

.br-modal__body{ padding: 20px; }

/* =========================================================
   FINAL CTA (NO FOOTER HERE ANYMORE)
   ========================================================= */

.br-final{
  background: var(--br-final-bg, #1E3932);
  color: #fff;
  padding-top: 96px;
  padding-bottom: 96px;
}

.br-final__inner{
  text-align: center;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

.br-final__h2{
  font-size: var(--h2);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
  margin: 0 0 var(--s-5);
}

.br-final__lead{
  max-width: 60ch;
  margin: 0 auto var(--s-5);
  opacity: .85;
  color: rgba(255,255,255,0.72);
}

.br-final__actions{
  display: flex;
  justify-content: center;
  margin: 0;
}

.br-final .br-btn{
  padding: 14px 22px;
  min-height: 48px;
  font-weight: 700;
  border-radius: var(--radius);
}

@media (max-width: 520px){
  .br-final .br-btn{
    width: auto;
    max-width: 100%;
  }
}

/* =========================================================
   FOOTER MODULE (SEPARATE)
   ========================================================= */

.br-footer{
  margin: 0;
  padding: 0;
  color: #fff;
}

.br-footer .br-container{
  padding-top: 28px;
  padding-bottom: 28px;
}

.br-footer__rule{
  margin: 0 0 16px;
  border: 0;
  border-top: 1px solid rgba(255,255,255,0.14);
}

.br-footer__text{
  margin: 0;
  text-align: center;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.55);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 980px){
  .br-hero-grid { grid-template-columns: 1fr; }
  .br-grid-3 { grid-template-columns: 1fr; }
  .br-grid-2 { grid-template-columns: 1fr; }
  .br-learn-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .br-split{ grid-template-columns: 1fr; }
}

@media (max-width: 640px){
  .br-learn-grid{ grid-template-columns: 1fr; }
  .br-audience-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 520px){
  .br-container { padding: 0 var(--s-3); }
  .br-section { padding: var(--s-6) 0; }
  .br-btn { width: 100%; }
}
/* =========================================================
   HEADER
   ========================================================= */

.br-header{
  position: relative;
  z-index: 50;
  color: #fff;
}

/* background modes */
.br-header--bg-transparent{
  background: transparent;
}

.br-header--bg-color{
  background: var(--br-header-bg, #1E3932);
}

.br-header--bg-image{
  background: var(--br-header-bg, #1E3932);
}

.br-header--bg-image::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--br-header-image);
  background-size: cover;
  background-position: center;
  opacity: 1;
  pointer-events: none;
}

.br-header--bg-image::after{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0, calc(var(--br-overlay, 0) / 100));
  pointer-events: none;
}

/* full width container (for true edge-to-edge header) */
.br-header__full{
  width: 100%;
  padding: 0 var(--s-4);
}

.br-header__inner{
  position: relative; /* ensures it sits above bg overlays */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  height: 72px;
}

.br-header__brand{
  font-weight: 800;
  letter-spacing: -0.01em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.br-header__logo{
  height: 26px;
  width: auto;
  max-width: 180px;
  display: block;
}

.br-header__brandtext{
  font-weight: 800;
  letter-spacing: -0.01em;
}

@media (max-width: 820px){
  .br-header__logo{ height: 22px; max-width: 150px; }
}

.br-header__nav{
  display: flex;
  gap: 28px;
  align-items: center;
}

.br-header__link{
  font-size: 14px;
  color: var(--br-nav-color, rgba(255,255,255,0.78));
}

.br-header__link:hover{
  color: var(--br-nav-hover, rgba(255,255,255,0.95));
}
.br-header__link.is-active{
  color: var(--br-nav-active, #fff);
}
.br-header__actions{ display: flex; align-items: center; }

/* Divider */
.br-header__divider{
  height: 1px;
  background: color-mix(in oklab, var(--br-divider-color, #fff) calc(var(--br-divider-opacity, 0.12) * 100%), transparent);
  opacity: 1;
}

/* Classic: normal flow */
.br-header--classic{ position: relative; }

/* Sticky: sticks to top */
.br-header--sticky{
  position: sticky;
  top: 0;
}

/* Floating: rounded, inset, shadow */
.br-header--floating{
  position: sticky;
  top: 14px;
}

.br-header--floating .br-header__inner{
  height: 64px;
}

.br-header--floating.br-header--bg-transparent .br-header__inner,
.br-header--floating.br-header--bg-color .br-header__inner,
.br-header--floating.br-header--bg-image .br-header__inner{
  border-radius: 999px;
  padding: 0 16px;
  background: rgba(30,57,50,0.88);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.18);
}

/* On mobile: hide nav links by default (keeps it clean) */
@media (max-width: 820px){
  .br-header__nav{ display: none; }
  .br-header__inner{ height: 64px; }
}

/* =========================================================
   HERO — BLINK MATCH (SHARPER)
   Paste at END of main.css
   ========================================================= */

/* 1) Sharper text rendering (subtle but real) */
body{
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 2) Hero headline: allow “top line” + “accent line” */
.br-hero-title{
  margin: 0 0 var(--s-4);
}

.br-hero-title__top{
  display: block;
  font-size: var(--h1);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
}

.br-hero-title__accent{
  display: block;
  margin-top: 6px;
  font-weight: 400; /* you said 700 is your preferred weight */
  letter-spacing: -0.02em;
  line-height: 0.95;
  color: var(--brand-orange);
  font-size: clamp(64px, 6.5vw, 140px);
}

/* If you keep a single H1 field (no split), this still helps */
.br-hero .br-h1{
  color: rgba(255,255,255,0.92);
}

/* 3) Hero lead: slightly clearer than current */
.br-hero .br-lead,
.br-lead--hero{
  color: rgba(255,255,255,0.78);
}
.br-hero-title__accent{
  font-family: "Lora", Georgia, serif;
  font-size: 176px;
  font-weight: 700;
}
/* 4) Hero right panel: closer to Blink */
.br-hero-panel{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
}

/* cover area (warm paper tone) */
.br-hero-media{
  background: #EDE7DF;
}

/* form area (peach panel) */
.br-hero-form{
  background: #FFFFFF;
  padding: 26px 26px 22px;
}

/* 5) Buttons in hero: slightly snappier */
.br-hero-ctas .br-btn{
  padding: 14px 20px;
}

.br-btn--primary{
  box-shadow: 0 14px 34px rgba(229, 89, 6, 0.30);
}

/* 6) Optional helper: clamp hero grid spacing on smaller screens */
@media (max-width: 980px){
  .br-hero-grid{ gap: var(--s-5); }
}
/* =========================================================
   HERO V2 (Blink-match)
   ========================================================= */

/* HERO V2 — FIX PRINT (guarantee full layout renders) */
.br-hero-title{ margin: 0 0 var(--s-4); }

.br-hero-title__top{
  display:block;
  font-size: var(--h1);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
}

.br-hero-title__accent{
  display:block;
  margin-top: 6px;
  font-family: var(--br-hero-accent-font, 'Lora', Georgia, serif);
  font-size: var(--br-hero-accent-size, 176px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 0.95;
  color: var(--brand-orange);
}

.br-hero-body{
  max-width: 62ch;
  margin-top: 10px;
  color: rgba(255,255,255,0.72);
  font-size: 15px;
}

.br-hero-panel{
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
  background: #fff;
}

.br-hero-media{ background: var(--br-hero-cover-bg, #FFF); }
.br-hero-form{ background: var(--br-hero-form-bg, #fff); }

.br-hero-cover-placeholder{
  padding: 40px 22px;
  color: rgba(30,57,50,0.65);
  font-weight: 700;
}

.br-form-placeholder{
  padding: 16px;
  border: 1px dashed rgba(30,57,50,0.25);
  border-radius: 8px;
  color: rgba(30,57,50,0.65);
  background: rgba(255,255,255,0.7);
}

/* Optional: crisper type rendering */
body{
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

@media (max-width: 980px){
  .br-hero-title__accent{ font-size: clamp(72px, 16vw, 140px); }
}
/* HERO V2 — spacing rhythm (left column) */
.br-hero-content{
  padding-top: 10px;
}

.br-hero-badge{
  margin-bottom: 22px; /* was using token spacing; this is closer to Blink */
}

.br-hero-title{
  margin: 0 0 18px;
}

.br-lead--hero{
  margin: 0 0 22px;
  max-width: 58ch;
}

.br-hero-body{
  margin: 0 0 26px;
  max-width: 70ch;
}

.br-hero-ctas{
  margin-top: 4px;
}

/* HERO V2 — right panel layout */
.br-hero-media{
  padding: 26px;
}

.br-hero-image{
  width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.20);
}
.br-hero-form{
  padding: 22px 26px 22px;
  background: #fff !important;
}

.br-hero .br-form-intro{
  margin: 0 0 22px;
  text-align: center;
}

.br-hero .br-form-heading{
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.18;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #1E3932;
  text-align: center;
  max-width: none;
}

.br-hero .br-form-subheading{
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(15,23,42,0.72);
  text-align: left;
}

.br-hero .br-form-subheading__label{
  color: var(--brand-orange);
  font-weight: 700;
  margin-right: 4px;
}

.br-hero .br-form-subheading__text{
  color: rgba(15,23,42,0.72);
}
}
.br-form-placeholder{
  border: 1px dashed rgba(30,57,50,0.22);
  background: rgba(255,255,255,0.55);
  color: rgba(30,57,50,0.55);
}
/* Hero V2: allow marketer to control top headline weight */
.br-hero-title__top{
  font-weight: var(--br-hero-top-weight, 700);
}
.br-hero-cover-placeholder{
  background: rgba(255,255,255,0.35);
  border: 1px dashed rgba(255,255,255,0.25);
  border-radius: 8px;
}

.br-form-placeholder{
  background: rgba(255,255,255,0.55);
  border: 1px dashed rgba(30,57,50,0.22);
}
/* Final CTA: no shadow on button */
.br-final .br-btn{
  box-shadow: none !important;
}
/* Global: remove shadows from all Brandesis buttons */
.br-btn{br-hero-badge
}
/* HERO V2 — right panel: white only + 8px radius */
.br-hero-panel{
  border-radius: 8px !important;
  background: #fff !important;
  overflow: hidden;
}

.br-hero-media{
  background: #fff !important;
  padding: 22px !important;
}

.br-hero-image{
  border-radius: 8px !important;
}

/* form area */
.br-hero-form{
  background: #fff !important;
  padding: 22px !important;
}

/* placeholders (when no image/form selected) */
.br-hero-cover-placeholder,
.br-form-placeholder{
  background: #fff !important;
  border-radius: 8px !important;
}
.br-hero-title__top{ font-weight: var(--br-hero-top-weight, 600); }
.br-hero-panel{ border-radius: 8px; }
.br-hero-image{ border-radius: 8px; }
.br-hero-media, .br-hero-form{ background:#fff; }
/* Hero badge */
.br-hero-badge{
  font-size: 12px !important;
  line-height: 1;
}

.br-hero-badge__icon{
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.br-hero-badge__icon svg{
  width: 16px;
  height: 16px;
  display: block;
}
.br-hero-bullets{
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  color: rgba(255,255,255,0.70);
  font-size: 13px;
}
.br-hero-bullets li{ display:flex; align-items:center; gap:10px; }
.br-bullet-dot{ width:6px; height:6px; border-radius:999px; background: var(--brand-orange); display:inline-block; }
/* Global: remove shadows from ALL buttons everywhere */
.br-btn,
.br-btn--primary,
.br-btn--secondary,
.hs-button,
.hs-form input[type="submit"]{
  box-shadow: none !important;
  filter: none !important;
}
/* =========================================================
   THANK YOU PAGE — FINAL (FIXED)
   ========================================================= */

/* ================= HERO ================= */

.br-ty-hero{
  padding: 110px 20px 60px;
  background: var(--brand-green, #1E3932);
  color: #fff;
  text-align: center;
}

.br-ty-hero__inner{
  max-width: 1000px;
  margin: 0 auto;
}

.br-ty-hero__icon{
  display:flex;
  justify-content:center;
  margin-bottom: 30px;
}

/* ✅ 96x96 badge */
.br-ty-hero__icon-ring{
  width: 96px;
  height: 96px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  border: 1px solid rgba(229,89,6,0.35);
  box-shadow: 0 0 0 28px rgba(229,89,6,0.10);
}

.br-ty-hero__icon-mark{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(229,89,6,0.15);
  color: var(--brand-orange,#E55906);
}

.br-ty-hero__icon-mark svg{
  width: 28px;
  height: 28px;
  display:block;
}

/* ✅ H1 exactly 72px */
.br-ty-hero__h1{
  font-size: 72px;
  line-height: 1.05;
  margin: 0 0 18px;
  font-weight: 700;
}

/* ✅ Set is orange + Lora + NOT italic */
.br-ty-hero__accent{
  color: var(--brand-orange,#E55906);
  font-family: "Lora", serif;
  font-style: normal;
}

/* ✅ subheading 20px */
.br-ty-hero__sub{
  max-width: 820px;
  margin: 0 auto;
  font-size: 20px;
  line-height: 1.8;
  opacity: 0.9;
}


/* ================= DOWNLOAD CARD ================= */

.br-ty-download{
  padding: 30px 20px 80px;
  background: var(--brand-green,#1E3932);
}

.br-ty-card{
  max-width: 1100px;
  margin: 0 auto;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  box-shadow: 0 30px 70px rgba(0,0,0,0.28);

  /* ✅ important: force consistent height so image can truly “fill” */
  min-height: 420px;
}

/* LEFT SIDE */
.br-ty-card__left{
  padding: 70px 60px;
  text-align: left;
  color: var(--brand-green,#1E3932);
  display: flex;
  flex-direction: column;
  justify-content: center; /* keeps content vertically balanced */
}

.br-ty-card__h2{
  margin: 0 0 18px;
  font-size: 34px;
  font-weight: 700;
}

.br-ty-card__body{
  margin-bottom: 26px;
  font-size: 16px;
  line-height: 1.75;
  color: #3F4D49;
  max-width: 520px;
}

/* ✅ BUTTON full width (match left column) */
.br-ty-card__btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 520px;      /* match text width */
  padding: 18px 24px;
  border-radius: 6px;
  font-weight: 600;
  box-shadow: 0 18px 35px rgba(229,89,6,0.30);
}

.br-ty-card__btn .br-btn__icon svg{
  display:block;
}

.br-ty-card__back{
  margin-top: 18px;
  font-size: 14px;
}

.br-ty-card__back a{
  color: #7A8A87;
  text-decoration: none;
}

.br-ty-card__back a:hover{
  text-decoration: underline;
}

/* RIGHT SIDE — IMAGE FILLS PERFECTLY */
.br-ty-card__right{
  padding: 0;
  position: relative;
  overflow: hidden; /* ✅ prevents edge gaps */
  display: block;   /* ✅ don’t use flex here */
}

.br-ty-card__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


/* ================= FEATURE CARDS ================= */

.br-ty-features{
  padding: 30px 20px 110px;
  background: var(--brand-green,#1E3932);
}

.br-ty-features__grid{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 26px;
}

.br-ty-feature{
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 38px;
  text-align: center;
  color: #fff;
  transition: transform .25s ease;
}

.br-ty-feature:hover{
  transform: translateY(-4px);
}

/* ✅ ICONS 48x48 */
.br-ty-feature__icon{
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  margin: 0 auto 20px;
  background: rgba(0,0,0,0.25);
  color: var(--brand-orange,#E55906);
}

.br-ty-feature__icon svg{
  width: 22px;
  height: 22px;
  display:block;
}

.br-ty-feature__h3{
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 600;
}

.br-ty-feature__p{
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  opacity: 0.85;
}
/* ICONS — make inline SVG behave */
.br-ty-hero__icon svg,
.br-ty-feature__icon svg{
  width: 100%;
  height: 100%;
  display: block;
}

.br-ty-hero__icon-mark svg{
  width: 28px;
  height: 28px;
}

.br-ty-feature__icon svg{
  width: 22px;
  height: 22px;
}

/* force Lucide to use currentColor */
.br-ty-hero__icon svg *,
.br-ty-feature__icon svg *{
  stroke: currentColor;
}

/* ================= SOCIAL SECTION ================= */

.br-ty-social{
  background: var(--brand-green,#1E3932);
  padding: 40px 20px 60px;
  text-align: center;
}

.br-ty-social__inner{
  display: flex;
  justify-content: center;
  gap: 24px;
}

.br-social{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.06);
  color: #fff;
  transition: all .25s ease;
}

.br-social svg{
  width: 20px;
  height: 20px;
  display:block;
}

.br-social:hover{
  background: var(--brand-orange,#E55906);
  color: #fff;
}


/* ================= RESPONSIVE ================= */

@media (max-width: 980px){

  .br-ty-hero__h1{
    font-size: 46px; /* keep readable on mobile */
  }

  .br-ty-hero__sub{
    font-size: 16px;
  }

  .br-ty-card{
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .br-ty-card__left{
    padding: 50px 40px;
  }

  .br-ty-card__right{
    height: 320px; /* ✅ ensures image still fills on mobile */
  }
}
/* =========================================================
   THANK YOU HERO — TOP BADGE (25% smaller again)
   ========================================================= */

.br-ty-hero__badge{
  width: 86px;               /* 114 × 0.75 */
  height: 86px;
  margin: 0 auto 18px;
  position: relative;
  display: grid;
  place-items: center;
}

/* ONE outer ring */
.br-ty-hero__badge::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 999px;
  border: 2px solid rgba(229, 89, 6, 0.22);
}

/* remove any second ring */
.br-ty-hero__badge::after{
  content: none !important;
}

.br-ty-hero__badge-inner{
  width: 84px;               /* slightly inside ring */
  height: 84px;
  border-radius: 999px;
  display: grid;
  place-items: center;

  background: rgba(229, 89, 6, 0.16);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
}

.br-ty-hero__badge-icon{
  display: block;
  width: 50px;               /* scaled proportionally */
  height: 50px;
  color: #E55906;
}
/* Learn card icon coloring (inline Lucide uses currentColor) */
.br-learn-icon{
  color: var(--brand-green);
}
.br-learn-icon svg{
  width: 24px;
  height: 24px;
  display: block;
  stroke: currentColor;
  fill: none;
}
.br-learn-card:hover .br-learn-icon{
  color: var(--brand-orange);
}

/* Brandesis hero form button fix */
.br-hero .hs-form .hs-button,
.br-hero .hs-form input[type="submit"]{
  background: #E55906 !important;
  border: 1px solid #E55906 !important;
  color: #ffffff !important;
  opacity: 1 !important;
  box-shadow: none !important;
  filter: none !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  min-height: 58px !important;
  padding: 16px 18px !important;
  border-radius: 8px !important;
  transition: none !important;
}

/* Remove dim hover/focus effects if HubSpot applies them */
.br-hero .hs-form .hs-button:hover,
.br-hero .hs-form .hs-button:focus,
.br-hero .hs-form input[type="submit"]:hover,
.br-hero .hs-form input[type="submit"]:focus{
  background: #E55906 !important;
  border-color: #E55906 !important;
  color: #ffffff !important;
  opacity: 1 !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Remove disabled-looking state if theme is forcing it */
.br-hero .hs-form .actions,
.br-hero .hs-form .hs_submit{
  opacity: 1 !important;
}

/* =========================================================
   GLOBAL CORNER RESET (Brandesis Design Rule)
   Everything square except intentional pills/circles


.br-btn,
.br-card,
.br-hero-panel,
.br-hero-image,
.br-hero-cover-placeholder,
.br-form-placeholder,
.br-learn-card,
.br-audience-card,
.br-modal__dialog,
.br-ty-card,
.br-ty-feature,
.br-ty-feature__icon,
.br-ty-card__btn,
.hs-form input[type="text"],
.hs-form input[type="email"],
.hs-form input[type="tel"],
.hs-form select,
.hs-form textarea,
.hs-button,
.hs-form input[type="submit"]{
  border-radius: 0 !important;
}
   ========================================================= */
/* Ensure hero form buttons stay square 
.br-hero .hs-form .hs-button,
.br-hero .hs-form input[type="submit"]{
  border-radius: 0 !important;
}
*/