/* ================================================================
   INNER PAGES
   Shared building blocks used by every page other than the home
   page: a compact page hero, prose blocks, cards, agenda rows and
   forms. Same palette, radii and type scale as the home page.
   ================================================================ */

/* The navbar now lives in the shared header, above the hero rather than
   inside it, so it is lifted out of flow and floated over whichever hero
   the page starts with. */
.navbar{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

/* the home hero used space-between to keep the nav pinned to its top on
   mobile; with the nav lifted out, the copy stays bottom-aligned instead */
@media (max-width: 767px){
  .hero-section{ justify-content: flex-end; }
}

/* same clearance on the home hero, for short/landscape viewports */
.hero-content{
  padding-top: var(--nav-space);
}

/* Height the floating navbar occupies: its own top padding plus the pill
   (logo height + the container's vertical padding). Hero copy is padded
   clear of this so a tall headline can never grow up under the nav. */
:root{
  --nav-space: 124px;
}

@media (max-width: 767px){
  :root{ --nav-space: 92px; }
}

/* ---------- PAGE HERO ---------- */
.page-hero{
  position: relative;
  min-height: 460px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  color: #fff;
  /* clearance lives on the hero box itself, so the copy cannot reach the
     navbar even if the inner padding is overridden. Literal value first as
     a fallback for anything that cannot resolve the custom property. */
  padding-top: 148px;
  padding-top: calc(var(--nav-space) + 24px);
}

.page-hero-bg{
  position: absolute;
  inset: 0;
  z-index: 0;
}

.page-hero-bg img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.page-hero-bg::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(4,10,20,0.5) 0%, rgba(4,10,20,0.65) 55%, rgba(4,10,20,0.88) 100%);
}

.page-hero-content{
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 5vw 64px;
}

.page-hero-eyebrow{
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  color: #EE8A34;
  margin-bottom: 16px;
}

.page-hero h1{
  margin: 0;
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-weight: 500;
  font-size: clamp(2.2rem, 5vw, 4rem);
  line-height: 1.08;
  max-width: 20ch;
}

/* long-form headlines (e.g. the full summit title) need more measure and a
   smaller top end, or they stack into a wall of text */
.page-hero.long-title h1{
  max-width: 26ch;
  font-size: clamp(1.75rem, 3.4vw, 3.1rem);
  line-height: 1.14;
}

.page-hero p{
  margin: 22px 0 0;
  font-size: 18px;
  line-height: 1.6;
  color: rgba(255,255,255,0.82);
  max-width: 60ch;
}

/* ---------- GENERIC SECTION SHELL ---------- */
.section{
  background: #fff;
  padding: 90px 5vw;
}

.section.tint{
  background: #faf9f7;
  border-top: 1px solid #e2e2df;
  border-bottom: 1px solid #e2e2df;
}

.section.navy{
  background: #0F2A4D;
  color: #fff;
}

.section-inner{
  max-width: 1300px;
  margin: 0 auto;
}

.section-eyebrow{
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  color: #6b6b66;
  margin-bottom: 16px;
}

.section.navy .section-eyebrow{ color: #EE8A34; }

.section h2{
  margin: 0 0 24px;
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-weight: 500;
  font-size: clamp(1.9rem, 3.6vw, 2.8rem);
  color: #0F172B;
}

.section.navy h2{ color: #fff; }

.section h3{
  margin: 0 0 14px;
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-weight: 500;
  font-size: 22px;
  color: #0F172B;
}

.section.navy h3{ color: #fff; }

.prose p{
  margin: 0 0 20px;
  font-size: 17px;
  line-height: 1.7;
  color: #4a4a48;
  max-width: 70ch;
}

.section.navy .prose p{ color: rgba(255,255,255,0.78); }

.prose p:last-child{ margin-bottom: 0; }

/* two-column split: sticky heading on the left, content on the right */
.split{
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 70px;
  align-items: start;
}

.split-heading{
  position: sticky;
  top: 40px;
}

.split-heading h2{ margin-bottom: 16px; }

@media (max-width: 900px){
  .split{ grid-template-columns: 1fr; gap: 32px; }
  .split-heading{ position: static; }
}

/* ---------- CARD GRID ---------- */
.card-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.card-grid.two{ grid-template-columns: repeat(2, 1fr); }

.card{
  border: 1px solid #e2e2df;
  border-radius: 18px;
  padding: 34px 30px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.card .card-index{
  font-size: 12px;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: #EE8A34;
}

.card h3{ margin: 0; font-size: 20px; }

.card p{
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #4a4a48;
}

.card ul{
  margin: 6px 0 0;
  padding-left: 18px;
  font-size: 15px;
  line-height: 1.7;
  color: #4a4a48;
}

.section.navy .card{
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.16);
}
.section.navy .card h3{ color: #fff; }
.section.navy .card p,
.section.navy .card ul{ color: rgba(255,255,255,0.75); }

@media (max-width: 991px){
  .card-grid,
  .card-grid.two{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px){
  .card-grid,
  .card-grid.two{ grid-template-columns: 1fr; }
}

/* ---------- BULLETED LIST ---------- */
.check-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 34px;
}

.check-list li{
  position: relative;
  padding-left: 30px;
  font-size: 16px;
  line-height: 1.6;
  color: #4a4a48;
}

.check-list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #EE8A34;
}

.section.navy .check-list li{ color: rgba(255,255,255,0.8); }

@media (max-width: 700px){
  .check-list{ grid-template-columns: 1fr; }
}

/* ---------- STAT STRIP ---------- */
.stat-strip{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}

.stat-strip .stat .value{
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-size: clamp(2rem, 3.4vw, 3rem);
  font-weight: 500;
  color: #EE8A34;
  line-height: 1;
  margin-bottom: 10px;
}

.stat-strip .stat .label{
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
}

@media (max-width: 800px){
  .stat-strip{ grid-template-columns: repeat(2, 1fr); }
}

/* ---------- AGENDA ---------- */
.agenda{
  border-top: 1px solid #e2e2df;
}

.agenda-row{
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 34px;
  padding: 26px 4px;
  border-bottom: 1px solid #e2e2df;
}

.agenda-time{
  font-size: 14px;
  font-weight: 600;
  color: #0F2A4D;
  letter-spacing: 0.04em;
}

.agenda-body h3{
  margin: 0 0 8px;
  font-size: 19px;
}

.agenda-body p{
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #4a4a48;
  max-width: 70ch;
}

@media (max-width: 700px){
  .agenda-row{ grid-template-columns: 1fr; gap: 8px; }
}

/* ---------- KEY-FACT PANEL ---------- */
.fact-panel{
  border: 1px solid #e2e2df;
  border-radius: 18px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  background: #fff;
}

.fact{
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.fact .fact-label{
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  color: #8a8a86;
}

.fact .fact-value{
  font-size: 16px;
  font-weight: 500;
  color: #0F172B;
  line-height: 1.5;
}

.fact .fact-value a{
  color: #0F172B;
  text-decoration: underline;
}

/* ---------- BUTTONS ---------- */
.btn{
  display: inline-flex;
  align-items: center;
  gap: 16px;
  background: #0F2A4D;
  color: #fff;
  text-decoration: none;
  padding: 16px 20px;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 500;
  width: fit-content;
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s ease;
}

.btn:hover{ background: #091D38; }

.btn.orange{ background: #EE8A34; color: #0F172B; }
.btn.orange:hover{ background: #d97a26; }

.btn.ghost{
  background: transparent;
  color: #0F172B;
  border: 1px solid #0F2A4D;
}
.btn.ghost:hover{ background: rgba(15,42,77,0.06); }

.btn .divider{
  width: 1px;
  height: 16px;
  background: rgba(255,255,255,0.35);
}

.btn.ghost .divider{ background: rgba(15,42,77,0.3); }

.btn .icon{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
}

.btn.ghost .icon{ background: rgba(15,42,77,0.08); }

.btn .icon svg{ width: 11px; height: 11px; }

.btn-row{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 32px;
}

/* ---------- CONTACT ---------- */
.contact-grid{
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 70px;
  align-items: start;
}

@media (max-width: 950px){
  .contact-grid{ grid-template-columns: 1fr; gap: 40px; }
}

.contact-form{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.field{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.field label{
  font-size: 13px;
  font-weight: 600;
  color: #0F172B;
}

.field input,
.field select,
.field textarea{
  font-family: inherit;
  font-size: 15px;
  color: #0F172B;
  padding: 14px 16px;
  border: 1px solid #d9d9d4;
  border-radius: 12px;
  background: #fff;
  width: 100%;
}

.field textarea{ min-height: 150px; resize: vertical; }

.field input:focus,
.field select:focus,
.field textarea:focus{
  outline: none;
  border-color: #0F2A4D;
  box-shadow: 0 0 0 3px rgba(15,42,77,0.08);
}

.form-note{
  font-size: 13px;
  line-height: 1.6;
  color: #8a8a86;
  margin: 0;
}

/* ---------- INSIGHTS ---------- */
.insight-card{
  border: 1px solid #e2e2df;
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  background: #fff;
}

.insight-card img{
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  display: block;
}

.insight-card-body{
  padding: 26px 24px 30px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.insight-meta{
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
  color: #EE8A34;
}

.insight-card h3{
  margin: 0;
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.3;
  color: #0F172B;
}

.insight-card p{
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #4a4a48;
}

/* current page gets a subtle marker in the navbar */
.nav_menu a.is-active,
.mob_menu a.is-active{
  color: #EE8A34;
}

/* ---------- TEAM GRID ---------- */
/* intro line that sits between an h2 and a grid */
.prose-lead{
  margin: -8px 0 40px;
  font-size: 17px;
  line-height: 1.7;
  color: #4a4a48;
  max-width: 62ch;
}

.team-grid{
  display: grid;
  /* auto-fit + a max column width so the row stays centred and the cards keep
     their proportions whether there is one person listed or nine */
  grid-template-columns: repeat(auto-fit, minmax(290px, 360px));
  justify-content: center;
  gap: 24px;
}

.team-card{
  border: 1px solid #e2e2df;
  border-radius: 18px;
  padding: 30px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: transform .25s ease, box-shadow .25s ease;
}

.team-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 34px rgba(15,42,77,0.09);
}

/* photo and monogram share a box so a card with a headshot and one without
   still line up on the same row */
.team-photo{
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  flex: none;
}

.team-monogram{
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0F2A4D;
  color: #fff;
  font-family: 'Poppins', 'Trebuchet MS', sans-serif;
  font-weight: 500;
  font-size: 28px;
  letter-spacing: 0.04em;
  border: 2px solid #EE8A34;
}

.team-body h3{
  margin: 0 0 6px;
  font-size: 20px;
}

.team-role{
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  color: #EE8A34;
  margin-bottom: 12px;
}

.team-body p{
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #4a4a48;
}

/* ---------- MOBILE POLISH, INNER PAGES ---------- */
@media (max-width: 767px){
  .page-hero{
    min-height: 360px;
    padding-top: 112px;
    padding-top: calc(var(--nav-space) + 20px);
  }
  .page-hero-content{ padding-bottom: 44px; }
  .page-hero p{ font-size: 16px; }
  .section{ padding: 56px 5vw; }
  .card{ padding: 28px 24px; }
  .fact-panel{ padding: 26px 22px; }
  .team-grid{ grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .team-card{ padding: 26px 24px; gap: 16px; }
  .prose-lead{ font-size: 16px; margin-bottom: 30px; }
  .prose p{ font-size: 16px; }
  .agenda-row{ padding: 22px 2px; }
}
