@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Lobster+Two:wght@700&family=Rye&display=swap');

:root {
  --ink: #071c29;
  --navy: #09293a;
  --teal: #0b7780;
  --gold: #e7b85b;
  --cream: #fff8e7;
  --white: #fff;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  color: var(--ink);
  background: #dff7fa url("assets/harmony-waves.webp") center / 560px 560px repeat;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

a { color: inherit; }

.site-header {
  position: relative;
  z-index: 10;
  color: var(--white);
  background: rgba(7, 28, 41, .96);
  border-bottom: 1px solid rgba(255,255,255,.15);
}

.nav-wrap {
  width: min(1420px, calc(100% - 2rem));
  min-height: 82px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  text-decoration: none;
  font-weight: 800;
  white-space: nowrap;
}

.brand-mark {
  width: 42px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  color: var(--cream);
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
  background: var(--teal);
}

.brand-mark svg { width: 26px; height: 26px; }

.brand-title {
  font-family: "Lobster Two", "Rye", Georgia, serif;
  font-size: clamp(1.6rem, 2.2vw, 2.05rem);
  line-height: 1;
  letter-spacing: .025em;
}

nav { display: flex; align-items: center; gap: .2rem; }

nav a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .62rem .72rem;
  border-radius: 999px;
  text-decoration: none;
  font-size: .86rem;
  font-weight: 700;
}

nav a:hover, nav a:focus-visible, nav a[aria-current="page"] {
  color: var(--white);
  background: var(--teal);
}

nav a.nav-teleport { margin-left: .3rem; color: var(--ink); background: var(--gold); }
nav a.nav-apply { margin-left: .3rem; color: var(--white); background: var(--teal); box-shadow: inset 0 0 0 1px rgba(255,255,255,.24); }

.page-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  text-align: center;
}

.page-bar h1 {
  margin: 0;
  color: var(--navy);
  font-family: "Lobster Two", "Rye", Georgia, serif;
  font-size: clamp(2.1rem, 5vw, 3.15rem);
  font-weight: 700;
  line-height: 1;
  text-shadow: 0 3px 18px rgba(9,41,58,.12);
}

.tracker-frame {
  width: min(1440px, calc(100% - 1.5rem));
  height: calc(100% - 1.25rem);
  min-height: 520px;
  margin: .65rem auto;
  border: 1px solid rgba(7,28,41,.18);
  border-radius: 1rem;
  background: #071c29;
  box-shadow: 0 18px 50px rgba(7,28,41,.2);
}

:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }

.mobile-nav { display: none; position: relative; }

.mobile-nav summary {
  padding: .55rem .85rem;
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 999px;
  list-style: none;
  font-weight: 800;
  cursor: pointer;
}

.mobile-nav summary::-webkit-details-marker { display: none; }

.mobile-links {
  position: absolute;
  z-index: 20;
  top: calc(100% + .65rem);
  right: 0;
  width: min(280px, calc(100vw - 2rem));
  padding: .65rem;
  display: grid;
  gap: .25rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 1rem;
  background: rgba(7,28,41,.98);
  box-shadow: 0 18px 55px rgba(2,18,27,.28);
}

.mobile-links a {
  min-height: 46px;
  display: flex;
  align-items: center;
  padding: .78rem .9rem;
  border-radius: .6rem;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 700;
}

.mobile-links a:hover, .mobile-links a:focus-visible, .mobile-links a[aria-current="page"] { color: var(--white); background: var(--teal); }

.content-site { display: block; min-height: 100%; }

.content-page {
  width: min(1100px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(3.5rem, 7vw, 6rem) 0;
}

.content-hero { max-width: 790px; margin: 0 auto 3rem; text-align: center; }
.content-hero .eyebrow { margin: 0 0 .65rem; color: var(--teal); font-size: .78rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.content-hero h1 { margin: 0 0 1rem; color: var(--navy); font-family: "Lobster Two", "Rye", Georgia, serif; font-size: clamp(3rem, 8vw, 5.5rem); line-height: .98; }
.content-hero p { margin: 0; color: #3d5964; font-size: 1.12rem; }

.content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.content-card { padding: 1.6rem; border: 1px solid rgba(7,28,41,.12); border-radius: 1.1rem; background: rgba(255,255,255,.82); box-shadow: 0 12px 36px rgba(7,28,41,.08); backdrop-filter: blur(8px); }
.content-card h2, .content-card h3 { margin: 0 0 .55rem; color: var(--navy); }
.content-card p { margin: 0; color: #4e626b; }
.content-card p + p { margin-top: .8rem; }
.content-card.wide { grid-column: 1 / -1; }

.village-manifesto { overflow: hidden; border: 1px solid rgba(7,28,41,.12); border-radius: 1.35rem; background: rgba(255,255,255,.86); box-shadow: 0 18px 46px rgba(7,28,41,.1); }
.village-lead { padding: clamp(1.7rem, 4vw, 3rem); color: var(--white); background: linear-gradient(135deg, var(--navy), var(--teal)); }
.village-lead .eyebrow { margin: 0 0 .55rem; color: #b9f3ef; font-size: .78rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.village-lead h2 { max-width: 760px; margin: 0 0 .8rem; font-family: "Lobster Two", Georgia, serif; font-size: clamp(2.25rem, 5vw, 4rem); line-height: 1; }
.village-lead p { max-width: 850px; margin: 0; color: rgba(255,255,255,.82); font-size: 1.08rem; }
.village-copy { padding: clamp(1.7rem, 4vw, 3rem); columns: 2 330px; column-gap: 2.5rem; }
.village-copy p { margin: 0 0 1.2rem; color: #405963; break-inside: avoid; }
.village-copy blockquote { margin: .4rem 0 1.4rem; padding: 1.2rem 1.35rem; break-inside: avoid; border-left: 4px solid var(--teal); border-radius: 0 .8rem .8rem 0; color: var(--navy); background: #e8f8f7; font-size: 1.08rem; }
.village-values { padding: 0 clamp(1.7rem, 4vw, 3rem) 2.2rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.village-values span { padding: .85rem 1rem; border: 1px solid rgba(11,119,128,.18); border-radius: .75rem; color: var(--navy); background: rgba(223,247,250,.68); font-weight: 700; }
.village-finale { margin: 0; padding: 1.35rem 1.5rem; color: var(--white); text-align: center; background: var(--teal); font-size: clamp(1.1rem, 2vw, 1.35rem); }

.chase-profile { margin-top: 2rem; display: grid; grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); overflow: hidden; border: 1px solid rgba(7,28,41,.12); border-radius: 1.35rem; background: rgba(255,255,255,.88); box-shadow: 0 18px 46px rgba(7,28,41,.1); }
.chase-photo { min-height: 100%; margin: 0; background: var(--navy); }
.chase-photo img { width: 100%; height: 100%; min-height: 590px; display: block; object-fit: cover; object-position: center; }
.chase-copy { padding: clamp(1.7rem, 4vw, 3rem); align-self: center; }
.chase-copy .eyebrow { margin: 0 0 .5rem; color: var(--teal); font-size: .78rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.chase-copy h2 { margin: 0 0 .9rem; color: var(--navy); font-family: "Lobster Two", Georgia, serif; font-size: clamp(2.5rem, 5vw, 4rem); line-height: 1; }
.chase-copy p { color: #405963; }
.chase-intro { color: var(--teal) !important; font-size: 1.2rem; font-weight: 800; }
.chase-tags { margin: 1.4rem 0; display: flex; flex-wrap: wrap; gap: .55rem; }
.chase-tags span { padding: .45rem .75rem; border-radius: 999px; color: var(--white); background: var(--teal); font-size: .88rem; font-weight: 800; }
.chase-signoff { margin-bottom: 0; color: var(--navy) !important; font-weight: 700; }

.event-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.event-item { padding: 1.4rem; border-radius: 1rem; color: var(--ink); background: rgba(255,255,255,.84); border: 1px solid rgba(7,28,41,.12); }
.event-item > strong { display: block; padding-bottom: .75rem; color: var(--teal); border-bottom: 2px solid rgba(11,119,128,.18); font-size: 1.05rem; letter-spacing: .12em; text-transform: uppercase; }
.day-events { display: grid; gap: 0; }
.event-entry { padding: 1rem 0; }
.event-entry + .event-entry { border-top: 1px dashed rgba(7,28,41,.16); }
.event-time { display: block; margin: 0 0 .45rem; color: #b55443; font-weight: 800; }
.event-item h2 { margin: 0 0 .45rem; color: var(--navy); font-size: 1.25rem; }
.event-item p { margin: 0; color: #50646d; }
.event-item .no-events { padding-top: 1rem; color: #75858b; font-style: italic; }
.edit-events-button { margin-top: 1.35rem; padding: .72rem 1.15rem; border: 0; border-radius: 999px; color: var(--white); background: var(--teal); font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 10px 24px rgba(11,119,128,.2); }
.event-editor { width: min(720px, calc(100% - 2rem)); max-height: 88vh; padding: 0; border: 0; border-radius: 1.25rem; color: var(--ink); background: var(--cream); box-shadow: 0 28px 80px rgba(2,18,27,.38); }
.event-editor::backdrop { background: rgba(3,18,27,.72); backdrop-filter: blur(4px); }
.editor-shell { position: relative; padding: 2rem; }
.editor-shell h2 { margin: 0 0 .5rem; color: var(--navy); font-family: "Lobster Two", Georgia, serif; font-size: 2.5rem; }
.editor-shell p { color: #50646d; }
.editor-shell label { display: grid; gap: .35rem; margin: .85rem 0; color: var(--navy); font-weight: 800; }
.editor-shell input, .editor-shell select, .editor-shell textarea { width: 100%; padding: .75rem .85rem; border: 1px solid rgba(7,28,41,.22); border-radius: .65rem; color: var(--ink); background: var(--white); font: inherit; font-weight: 500; }
.editor-close { position: absolute; top: .8rem; right: .9rem; border: 0; color: var(--navy); background: transparent; font-size: 2rem; cursor: pointer; }
.editor-primary, .editor-secondary, .remove-event { padding: .7rem 1rem; border-radius: 999px; font: inherit; font-weight: 800; cursor: pointer; }
.editor-primary { border: 0; color: var(--white); background: var(--teal); }
.editor-secondary { border: 1px solid var(--teal); color: var(--teal); background: transparent; }
.editable-event { margin: 1rem 0; padding: 1rem; border: 1px solid rgba(7,28,41,.14); border-radius: .9rem; background: rgba(255,255,255,.6); }
.editable-event legend { padding: 0 .4rem; color: var(--teal); font-weight: 800; }
.editor-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.remove-event { border: 1px solid var(--coral); color: #9f3f31; background: transparent; }
.editor-actions { display: flex; justify-content: flex-end; gap: .7rem; margin-top: 1.2rem; }
.form-message { min-height: 1.5rem; color: #9f3f31 !important; font-weight: 700; }

.faq-list { display: grid; gap: .75rem; }
.faq-list details { padding: 1rem 1.15rem; border: 1px solid rgba(7,28,41,.12); border-radius: .9rem; background: rgba(255,255,255,.84); }
.faq-list summary { color: var(--navy); font-size: 1.05rem; font-weight: 800; cursor: pointer; }
.faq-list p { margin: .8rem 0 0; color: #4e626b; }
.faq-list p a { color: var(--teal); font-weight: 800; }
.faq-answer-links { margin-top: .85rem; display: flex; flex-wrap: wrap; gap: .55rem; }
.faq-answer-links a { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: .55rem .85rem; border-radius: 999px; color: var(--white); background: var(--teal); text-decoration: none; font-size: .92rem; font-weight: 800; }
.faq-answer-links a:hover, .faq-answer-links a:focus-visible { background: var(--navy); }

.teleport-card { margin-top: 2rem; padding: 2rem; border-radius: 1.2rem; color: var(--white); text-align: center; background: var(--teal); box-shadow: 0 18px 48px rgba(11,119,128,.22); }
.teleport-card h2 { margin: 0 0 .6rem; font-family: "Lobster Two", "Rye", Georgia, serif; font-size: 2.3rem; }
.teleport-card p { max-width: 650px; margin: 0 auto 1rem; color: rgba(255,255,255,.86); }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: .7rem 1.1rem; border-radius: 999px; color: var(--ink); background: var(--gold); text-decoration: none; font-weight: 800; }

footer { padding: 1.6rem 1rem; color: rgba(255,255,255,.72); text-align: center; background: var(--ink); font-size: .88rem; }
footer p { margin: 0; }

@media (max-width: 1120px) {
  .desktop-nav { display: none; }
  .mobile-nav { display: block; }
}

@media (max-width: 760px) {
  .nav-wrap { min-height: 74px; }
  .brand-title { font-size: 1.45rem; }
  .page-bar { padding-block: .65rem; }
  .tracker-frame { width: calc(100% - .75rem); height: calc(100% - .5rem); margin: .25rem auto; border-radius: .65rem; }
  .content-grid, .event-list { grid-template-columns: 1fr; }
  .editor-row { grid-template-columns: 1fr; gap: 0; }
  .content-card.wide { grid-column: auto; }
  .village-values { grid-template-columns: 1fr; }
  .chase-profile { grid-template-columns: 1fr; }
  .chase-photo img { min-height: 0; aspect-ratio: 1 / 1; }
}
/* Editable Meet Our Team */
.team-section{width:min(var(--max),calc(100% - 2rem));margin:0 auto 4rem;padding:clamp(1.5rem,4vw,3rem);border:1px solid rgba(11,119,128,.2);border-radius:1.5rem;background:#fff;box-shadow:0 16px 45px rgba(7,28,41,.09)}.team-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:2rem}.team-heading h2{margin:.2rem 0 .45rem;font-family:"Lobster Two",Georgia,serif;font-size:clamp(2.2rem,5vw,3.8rem);line-height:1;color:var(--navy)}.team-heading p:last-child{max-width:650px;margin:0;color:#496470}.team-pencil{flex:0 0 auto;width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(11,119,128,.28);border-radius:50%;background:#e9f8f6;color:var(--teal);cursor:pointer}.team-pencil:hover,.team-pencil:focus-visible,.team-pencil.active{color:#fff;background:var(--teal)}.team-pencil svg{width:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.15rem}.team-card{overflow:hidden;border:1px solid rgba(9,41,58,.12);border-radius:1.2rem;background:var(--cream)}.team-photo{aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#d9f4f4,#f7e9c8)}.team-photo img{width:100%;height:100%;object-fit:cover}.team-photo-placeholder{font-size:4rem}.team-copy{padding:1.15rem}.team-copy h3{margin:0;font-size:1.25rem;color:var(--navy)}.team-role{min-height:1.4em;margin:.2rem 0 .85rem;color:var(--teal);font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.team-bio{min-height:4.8rem;margin:0;white-space:pre-wrap;color:#425d68}.team-copy textarea{width:100%;min-height:115px;padding:.75rem;border:1px solid rgba(11,119,128,.3);border-radius:.7rem;background:#fff;font:inherit;resize:vertical}.team-save{margin-top:.6rem;padding:.62rem .9rem;border:0;border-radius:999px;background:var(--teal);color:#fff;font-weight:800;cursor:pointer}.team-save:disabled{opacity:.6}.team-note{padding:.75rem 1rem;border-radius:.7rem;background:#e9f8f6;color:var(--navy);font-weight:700}.team-loading{grid-column:1/-1;text-align:center;color:#617985}@media(max-width:850px){.team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.team-grid{grid-template-columns:1fr}.team-heading{align-items:flex-start}.team-section{padding:1.2rem}}

/* Allow the expanded site navigation to wrap cleanly before the mobile breakpoint. */
.desktop-nav{flex-wrap:wrap;justify-content:flex-end}

.event-card-actions{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:1rem}.event-move-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.move-event{min-height:42px;padding:.6rem .85rem;border:1px solid #8bbcc1;border-radius:999px;background:#e9f8f6;color:#075a64;font:inherit;font-size:.88rem;font-weight:800;cursor:pointer}.move-event:hover:not(:disabled){background:#0b7780;color:#fff}.move-event:focus-visible{outline:3px solid #e7b85b;outline-offset:3px}.move-event:disabled{opacity:.4;cursor:default}.event-order-message{font-size:.9rem;color:#075a64;line-height:1.5}.event-order-message:empty{display:none}@media(max-width:520px){.event-card-actions{align-items:flex-start;flex-direction:column}.move-event{padding:.65rem .8rem}}
