/* =========================================================================
   Rice Student Venture Fund
   Built on the RSVF design system.
   ========================================================================= */

:root{
  /* Brand */
  --rsvf-blue:    #23528F;
  --rsvf-blue-dk: #1B4173;
  --deep-space:   #0A1628;
  --deep-space-2: #111F35;
  --owl-blue:     #055394;
  --teal:         #57BBB9;
  --mid-blue:     #5A7DAB;
  --mist:         #C8D4E3;
  --vapor:        #F4F6FA;
  --white:        #FFFFFF;
  --slate:        #6B7684;
  --muted-dark:   #93A0B4;

  /* Type */
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;

  /* Layout */
  --wrap: 1200px;
  --gut: clamp(20px, 5vw, 48px);
  --r-card: 4px;
  --r-pill: 999px;
  --shadow: 0 1px 2px rgba(10,22,40,.06);
  --nav-h: 72px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0;
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.6;
  color:var(--deep-space);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
button{ font:inherit; }

::selection{ background:var(--teal); color:var(--deep-space); }

:focus-visible{
  outline:2px solid var(--teal);
  outline-offset:3px;
  border-radius:2px;
}

.wrap{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--gut);
}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--rsvf-blue); color:#fff;
  padding:.75rem 1.25rem; font-weight:600;
}
.skip-link:focus{ left:0; }

/* ---------- Scroll progress ---------- */
.scroll-progress{
  position:fixed; inset:0 auto auto 0;
  height:2px; width:0;
  background:var(--teal);
  z-index:120;
  transition:width .08s linear;
}

/* =========================================================================
   TYPE PRIMITIVES
   ========================================================================= */
.h2{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.9rem, 4vw, 3rem);
  letter-spacing:-.02em;
  line-height:1.08;
  margin:0 0 1rem;
}

.lead{
  font-size:1.15rem;
  line-height:1.55;
  color:var(--slate);
  max-width:62ch;
  margin:0;
}

.marker{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-display);
  font-weight:600; font-size:.72rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--rsvf-blue);
  margin:0 0 1.1rem;
}
.marker--teal{ color:var(--teal); }
.marker .traj{ width:34px; height:12px; flex:none; }

.section__head{ margin-bottom:clamp(2.5rem,5vw,4rem); max-width:820px; }

/* =========================================================================
   BUTTONS
   ========================================================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem;
  font-family:var(--font-body); font-weight:600; font-size:.95rem;
  padding:.85rem 1.75rem;
  border-radius:var(--r-pill);
  border:1px solid transparent;
  text-decoration:none; cursor:pointer;
  transition:background .2s, color .2s, border-color .2s, transform .2s;
}
.btn--primary{ background:var(--rsvf-blue); color:#fff; }
.btn--primary:hover{ background:var(--rsvf-blue-dk); transform:translateY(-2px); }

.btn--ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.btn--ghost:hover{ border-color:#fff; background:rgba(255,255,255,.08); transform:translateY(-2px); }

.btn--block{ width:100%; }

/* =========================================================================
   NAV
   ========================================================================= */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:110;
  height:var(--nav-h);
  display:flex; align-items:center;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
}
.nav.is-stuck{
  background:rgba(10,22,40,.86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom-color:rgba(255,255,255,.1);
}

.nav__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-inline:var(--gut);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}

.nav__brand{
  display:flex; align-items:center; gap:.7rem;
  text-decoration:none; color:#fff;
}
.nav__owl{ width:34px; height:34px; flex:none; }
.nav__brand-text{ display:flex; flex-direction:column; line-height:1; }
.nav__brand-text strong{
  font-family:var(--font-display); font-weight:700;
  font-size:1.05rem; letter-spacing:.02em;
}
.nav__brand-text em{
  font-style:normal; font-size:.6rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted-dark); margin-top:3px;
}

.nav__links{ display:flex; align-items:center; gap:2rem; }
.nav__links a{
  color:#fff; text-decoration:none;
  font-size:.92rem; font-weight:500;
  position:relative; padding:.25rem 0;
  transition:color .2s;
}
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:-2px;
  width:100%; height:1.5px; background:var(--teal);
  transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.nav__links a:not(.nav__cta):hover::after,
.nav__links a.is-active::after{ transform:scaleX(1); }

.nav__cta{
  background:var(--rsvf-blue);
  padding:.6rem 1.35rem !important;
  border-radius:var(--r-pill);
  font-weight:600;
  transition:background .2s, transform .2s;
}
.nav__cta:hover{ background:var(--rsvf-blue-dk); transform:translateY(-1px); }

.nav__toggle{
  display:none; background:none; border:0; cursor:pointer;
  width:42px; height:42px; padding:9px; position:relative;
}
.nav__toggle span{
  display:block; height:2px; background:#fff; border-radius:2px;
  margin:5px 0; transition:transform .3s, opacity .2s;
}
.nav__toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* =========================================================================
   HERO
   ========================================================================= */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding:calc(var(--nav-h) + 3rem) 0 2rem;
  background:
    radial-gradient(900px 620px at 78% 18%, rgba(35,82,143,.5) 0%, transparent 62%),
    radial-gradient(700px 500px at 10% 88%, rgba(87,187,185,.14) 0%, transparent 60%),
    var(--deep-space);
  color:#fff;
  overflow:hidden;
}

.hero__stars{
  position:absolute; inset:0;
  width:100%; height:100%;
  pointer-events:none;
}

.hero__arc{
  position:absolute; left:0; right:0; bottom:0;
  width:100%; height:58%;
  pointer-events:none;
}
.hero__arc .arc-line{
  fill:none; stroke:var(--teal); stroke-width:2; stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:1800; stroke-dashoffset:1800;
  animation:draw 2.4s .35s cubic-bezier(.22,.8,.3,1) forwards;
}
.hero__arc .arc-fill{
  fill:rgba(87,187,185,.07);
  opacity:0;
  animation:fadeIn 1.6s 1.5s ease forwards;
}
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes fadeIn{ to{ opacity:1; } }

.hero__inner{ position:relative; z-index:2; }

.hero__h1{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(2.6rem, 7vw, 5.5rem);
  letter-spacing:-.035em; line-height:.98;
  margin:0 0 1.5rem;
}
.hero__accent{
  color:var(--teal);
}

.hero__lead{
  font-size:clamp(1.05rem,1.5vw,1.2rem);
  line-height:1.6;
  color:#C6D0DE;
  max-width:56ch;
  margin:0 0 2.25rem;
}

.hero__ctas{ display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:3rem; }

.hero__quote{ margin:0; max-width:46ch; }
.hero__quote blockquote{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:500;
  font-size:1.05rem; color:#fff;
  padding-left:1rem; border-left:2px solid var(--teal);
}
.hero__quote figcaption{
  font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted-dark); padding-left:1rem;
}

.hero__metrics{
  position:relative; z-index:2;
  margin-top:clamp(2.5rem,6vw,4.5rem);
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem;
}
.metric{ border-top:1px solid var(--teal); padding-top:.9rem; }
.metric__val{
  display:block;
  font-family:var(--font-mono); font-weight:700;
  font-size:clamp(1.5rem,3.2vw,2.4rem);
  letter-spacing:-.02em; line-height:1.1;
  color:#fff;
  font-variant-numeric:tabular-nums;
}
.metric__label{
  display:block; margin-top:.35rem;
  font-family:var(--font-display); font-weight:600;
  font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted-dark);
}

/* =========================================================================
   MARQUEE
   ========================================================================= */
.marquee{
  background:var(--deep-space-2);
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:2.25rem 0;
  overflow:hidden;
  scroll-margin-top:var(--nav-h);
}
/* fade the logos out at both edges instead of hard-cutting them */
.marquee__viewport{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
}
.marquee__label{
  text-align:center; margin:0 0 1.5rem;
  font-family:var(--font-display); font-weight:600;
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted-dark);
}
.marquee__track{
  display:flex; align-items:center; gap:5rem;
  width:max-content;
  animation:slide 34s linear infinite;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes slide{ to{ transform:translateX(-50%); } }

.marquee__item{
  flex:none; height:34px;
  display:flex; align-items:center;
  opacity:.65; transition:opacity .25s;
}
.marquee:hover .marquee__item{ opacity:.4; }
.marquee__item:hover{ opacity:1; }
.marquee__item img,
.marquee__item svg{
  height:100%; width:auto; max-width:190px;
  object-fit:contain;
  filter:brightness(0) invert(1);
}
.marquee__item span{
  font-family:var(--font-display); font-weight:700;
  font-size:1.35rem; letter-spacing:-.02em; color:#fff;
  white-space:nowrap;
}

/* =========================================================================
   SECTIONS
   ========================================================================= */
.section{
  position:relative;
  padding:clamp(4.5rem,10vw,8rem) 0;
}
.section--light{ background:var(--white); }
.section--vapor{ background:var(--vapor); }
.section--dark{
  background:var(--deep-space);
  color:#fff;
  overflow:hidden;
}
.section--dark .h2{ color:#fff; }
.section--dark .lead{ color:var(--muted-dark); }

.section__arc{
  position:absolute; left:0; right:0; top:0;
  width:100%; height:240px; opacity:.55; pointer-events:none;
}

/* ---------- Pillars ---------- */
.pillars{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(1.5rem,3vw,2.75rem);
  margin-bottom:clamp(3rem,6vw,5rem);
}
.pillar{
  border-top:1px solid var(--mist);
  padding-top:1.5rem;
}
.pillar__num{
  font-family:var(--font-mono); font-weight:700; font-size:.85rem;
  color:var(--teal); letter-spacing:.08em;
}
.pillar h3{
  font-family:var(--font-display); font-weight:600;
  font-size:1.3rem; letter-spacing:-.01em;
  margin:.65rem 0 .6rem;
}
.pillar p{ margin:0; color:var(--slate); font-size:.97rem; }

/* ---------- Pull quote ---------- */
.pullquote{
  margin:0;
  background:var(--vapor);
  border-left:3px solid var(--teal);
  padding:clamp(1.75rem,4vw,2.75rem);
  border-radius:var(--r-card);
}
.pullquote blockquote{
  margin:0 0 1rem;
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(1.1rem,2.2vw,1.5rem);
  line-height:1.45; letter-spacing:-.01em;
  color:var(--deep-space);
  max-width:60ch;
}
.pullquote figcaption{
  font-family:var(--font-display); font-weight:600;
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--rsvf-blue);
}

/* =========================================================================
   PORTFOLIO
   ========================================================================= */
.filters{
  display:flex; flex-wrap:wrap; gap:.55rem;
  margin-bottom:2.5rem;
}
.filter{
  background:transparent;
  border:1px solid var(--mist);
  color:var(--slate);
  padding:.5rem 1.15rem;
  border-radius:var(--r-pill);
  font-size:.85rem; font-weight:500;
  cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.filter:hover{ border-color:var(--rsvf-blue); color:var(--rsvf-blue); }
.filter.is-active{
  background:var(--rsvf-blue); border-color:var(--rsvf-blue); color:#fff;
}

.pgrid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px,1fr));
  gap:clamp(1.25rem,2.5vw,1.75rem);
}

.pcard{
  background:var(--white);
  border:1px solid var(--mist);
  border-radius:var(--r-card);
  padding:1.75rem;
  display:flex; flex-direction:column;
  text-decoration:none; color:inherit;
  position:relative;
  transition:transform .28s cubic-bezier(.22,.8,.3,1), box-shadow .28s, border-color .28s;
}
.pcard:hover{
  transform:translateY(-4px);
  border-color:var(--rsvf-blue);
  box-shadow:0 12px 32px rgba(10,22,40,.10);
}
.pcard.is-hidden{ display:none; }

.pcard__logo{
  height:46px;
  display:flex; align-items:center;
  margin-bottom:1.5rem;
}
.pcard__logo img,
.pcard__logo svg{
  max-height:100%; max-width:190px; width:auto;
  object-fit:contain; object-position:left center;
}
.pcard__logo .wordmark{
  font-family:var(--font-display); font-weight:700;
  font-size:1.5rem; letter-spacing:-.02em; color:var(--deep-space);
}

.pcard__meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  margin-bottom:.85rem;
}
.tag{
  font-family:var(--font-display); font-weight:600;
  font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  padding:.3rem .65rem; border-radius:var(--r-pill);
  background:rgba(35,82,143,.09); color:var(--rsvf-blue);
}
.tag--stage{ background:var(--vapor); color:var(--slate); }

.pcard h3{
  font-family:var(--font-display); font-weight:600;
  font-size:1.2rem; letter-spacing:-.01em;
  margin:0 0 .55rem;
}
.pcard p{
  margin:0 0 1.5rem;
  font-size:.93rem; line-height:1.6; color:var(--slate);
  flex:1;
}

.pcard__foot{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
  padding-top:1rem;
  border-top:1px solid var(--mist);
  font-size:.8rem;
}
.pcard__loc{
  font-family:var(--font-mono); font-weight:500; font-size:.72rem;
  color:var(--slate); letter-spacing:-.01em;
}
.pcard__link{
  font-weight:600; color:var(--rsvf-blue);
  display:inline-flex; align-items:center; gap:.35rem;
}
.pcard__link svg{ width:13px; height:13px; transition:transform .25s; }
.pcard:hover .pcard__link svg{ transform:translate(2px,-2px); }

.pgrid__empty{
  text-align:center; color:var(--slate); padding:3rem 0; margin:0;
}

/* =========================================================================
   TEAM
   ========================================================================= */
.tgroup{ margin-bottom:clamp(3rem,6vw,4.5rem); }
.tgroup:last-child{ margin-bottom:0; }

.tgroup__head{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem 1.25rem;
  padding-bottom:1rem; margin-bottom:2rem;
  border-bottom:1px solid var(--mist);
}
.tgroup__head h3{
  font-family:var(--font-display); font-weight:700;
  font-size:1.35rem; letter-spacing:-.015em;
  margin:0;
}
.tgroup__head p{ margin:0; font-size:.9rem; color:var(--slate); }

.tgrid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(215px,1fr));
  gap:clamp(1.25rem,2.5vw,2rem);
}

.person{ position:relative; }

.person__photo{
  aspect-ratio:1/1;
  border-radius:var(--r-card);
  overflow:hidden;
  background:linear-gradient(150deg, var(--rsvf-blue) 0%, var(--deep-space) 100%);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1rem;
  position:relative;
  transition:transform .3s cubic-bezier(.22,.8,.3,1);
}
.person:hover .person__photo{ transform:translateY(-4px); }
.person__photo > img:not(.person__owl){ width:100%; height:100%; object-fit:cover; }

.person__mono{
  font-family:var(--font-display); font-weight:700;
  font-size:2.1rem; letter-spacing:.03em;
  color:rgba(255,255,255,.9);
}
.person__owl{
  position:absolute; right:12px; bottom:12px;
  width:22px; height:22px; opacity:.3;
  pointer-events:none;
}

.person--tba .person__photo{
  background:var(--vapor);
  border:1px dashed var(--mist);
}
.person--tba .person__mono{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--slate); font-weight:600;
}

.person__link{
  display:block; text-decoration:none; color:inherit;
}
.person__link:focus-visible{ outline-offset:5px; }

/* LinkedIn badge: sits opposite the owl watermark, fades in on hover */
.person__badge{
  position:absolute; top:10px; right:10px;
  width:28px; height:28px;
  border-radius:var(--r-card);
  background:rgba(10,22,40,.62);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translateY(-4px);
  transition:opacity .25s, transform .25s, background .2s;
  pointer-events:none;
}
.person__badge svg{ width:14px; height:14px; fill:#fff; }
.person:hover .person__badge,
.person__link:focus-visible .person__badge{ opacity:1; transform:none; }

.person--tba .person__badge{ background:rgba(10,22,40,.55); }

.person__link:hover h4{ color:var(--rsvf-blue); }

.person h4{
  font-family:var(--font-display); font-weight:600;
  font-size:1.02rem; letter-spacing:-.01em;
  margin:0 0 .2rem;
}
.person__role{
  margin:0; font-size:.85rem; color:var(--slate);
}
.person__sector{
  display:inline-block; margin-top:.5rem;
  font-family:var(--font-display); font-weight:600;
  font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--rsvf-blue);
}

/* =========================================================================
   STORY
   ========================================================================= */
/* Three short chapters read far better than two tall columns of body copy */
.chapters{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(1.75rem,4vw,3.25rem);
  margin-bottom:clamp(3.5rem,7vw,5.5rem);
}
.chapter{
  border-top:1px solid rgba(87,187,185,.45);
  padding-top:1.4rem;
}
.chapter__num{
  font-family:var(--font-mono); font-weight:700; font-size:.82rem;
  letter-spacing:.08em; color:var(--teal);
}
.chapter h3{
  font-family:var(--font-display); font-weight:600;
  font-size:1.35rem; letter-spacing:-.015em;
  margin:.6rem 0 .8rem; color:#fff;
}
.chapter p{
  margin:0;
  font-size:.97rem; line-height:1.75;
  color:#C6D0DE;
  max-width:46ch;
}

.story-quote{
  margin:0 0 clamp(3rem,6vw,4.5rem);
  max-width:900px;
}
.story-quote blockquote{
  margin:0 0 1.5rem;
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(1.35rem,3.2vw,2.3rem);
  line-height:1.32; letter-spacing:-.022em;
  color:#fff;
}
.story-quote figcaption{
  display:grid; gap:.15rem;
  padding-left:1rem;
  border-left:2px solid var(--teal);
}
.story-quote figcaption span{
  font-size:.85rem; color:var(--muted-dark);
}
.story-quote figcaption strong{
  font-family:var(--font-display); font-weight:600;
  font-size:.95rem; color:#fff;
}

.values{
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:clamp(1.25rem,2.5vw,2rem);
  padding-top:clamp(2.25rem,4vw,3rem);
  border-top:1px solid rgba(255,255,255,.12);
}
.value{ border-top:1px solid rgba(87,187,185,.45); padding-top:1.1rem; }
.value h3{
  font-family:var(--font-display); font-weight:600;
  font-size:.98rem; letter-spacing:-.005em;
  margin:0 0 .5rem; color:#fff;
}
.value p{ margin:0; font-size:.85rem; line-height:1.6; color:var(--muted-dark); }

/* =========================================================================
   CONTACT
   ========================================================================= */
.contact{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(2.5rem,5vw,4.5rem);
  align-items:start;
}

.contact__list{
  list-style:none; padding:0; margin:2.25rem 0 0;
  display:grid; gap:1.1rem;
}
.contact__list li{
  display:grid; gap:.2rem;
  padding-left:1rem; border-left:2px solid var(--mist);
}
.contact__list strong{
  font-family:var(--font-display); font-weight:600; font-size:.95rem;
}
.contact__list span{ font-size:.89rem; color:var(--slate); }

.contact__direct{
  margin-top:2rem; font-size:.92rem; color:var(--slate);
}
.contact__direct a{ color:var(--rsvf-blue); font-weight:600; }

.contact__form{
  background:var(--white);
  border:1px solid var(--mist);
  border-radius:var(--r-card);
  padding:clamp(1.5rem,3vw,2.25rem);
  display:grid; gap:1.1rem;
  box-shadow:var(--shadow);
}
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.field{ display:grid; gap:.4rem; }
.field > span{
  font-family:var(--font-display); font-weight:600;
  font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--deep-space);
}
.field > span i{
  font-style:normal; color:var(--slate); font-weight:500;
  letter-spacing:.06em; text-transform:none;
}
.field input,
.field select,
.field textarea{
  font-family:var(--font-body); font-size:.95rem;
  color:var(--deep-space);
  background:var(--vapor);
  border:1px solid var(--mist);
  border-radius:var(--r-card);
  padding:.75rem .9rem;
  width:100%;
  transition:border-color .2s, background .2s;
}
.field textarea{ resize:vertical; min-height:110px; }
.field input:focus,
.field select:focus,
.field textarea:focus{
  background:#fff; border-color:var(--rsvf-blue);
  outline:none;
}
.field input:user-invalid,
.field textarea:user-invalid{ border-color:#C0392B; }

.field-note{
  margin:0; font-size:.76rem; color:var(--slate); text-align:center;
}

/* =========================================================================
   FOOTER
   ========================================================================= */
.footer{
  background:var(--deep-space);
  color:#fff;
  padding:clamp(3rem,6vw,4.5rem) 0 2rem;
}
.footer__inner{
  display:grid; grid-template-columns:1.2fr 1fr;
  gap:clamp(2rem,5vw,4rem);
  padding-bottom:2.5rem;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.footer__brand img{ margin-bottom:1rem; }
.footer__brand p{
  margin:0; color:var(--muted-dark); font-size:.92rem;
}

.footer__nav{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.footer__nav h4{
  font-family:var(--font-display); font-weight:600;
  font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--teal); margin:0 0 1rem;
}
.footer__nav a{
  display:block; text-decoration:none;
  color:var(--muted-dark); font-size:.9rem;
  padding:.3rem 0;
  transition:color .2s;
}
.footer__nav a:hover{ color:#fff; }

.footer__base{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 2rem;
  padding-top:1.75rem;
}
.footer__base p{
  margin:0; font-size:.78rem; color:var(--slate);
}

/* =========================================================================
   REVEAL
   ========================================================================= */
.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.22,.8,.3,1) var(--d,0s),
             transform .7s cubic-bezier(.22,.8,.3,1) var(--d,0s);
}
.reveal.is-in{ opacity:1; transform:none; }

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width:1000px){
  .chapters{ grid-template-columns:1fr; gap:2rem; }
  .chapter p{ max-width:62ch; }
  .story-quote{ max-width:none; }
  .values{ grid-template-columns:repeat(2,1fr); gap:1.5rem; }
  .contact{ grid-template-columns:1fr; }
  .pillars{ grid-template-columns:1fr; gap:1.75rem; }
  .footer__inner{ grid-template-columns:1fr; }
}

@media (max-width:820px){
  .nav__toggle{ display:block; }

  .nav__links{
    position:fixed; inset:var(--nav-h) 0 auto 0;
    flex-direction:column; align-items:stretch; gap:0;
    background:rgba(10,22,40,.98);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(255,255,255,.12);
    padding:.5rem var(--gut) 1.5rem;
    transform:translateY(-12px);
    opacity:0; pointer-events:none;
    transition:opacity .25s, transform .25s;
  }
  .nav__links.is-open{ opacity:1; transform:none; pointer-events:auto; }
  .nav__links a{
    padding:1rem 0;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-size:1rem;
  }
  .nav__links a::after{ display:none; }
  .nav__cta{
    margin-top:1.25rem; text-align:center; border-bottom:0 !important;
    padding:.9rem 1.35rem !important;
  }

  .hero__metrics{ grid-template-columns:repeat(2,1fr); gap:1.25rem 1.5rem; }
  .marquee__track{ gap:3rem; }
  .tgrid{ grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); }
}

@media (max-width:560px){
  .field-row{ grid-template-columns:1fr; }
  .values{ grid-template-columns:1fr; }
  .pgrid{ grid-template-columns:1fr; }
  .hero__quote{ display:none; }
  .footer__base{ flex-direction:column; }
}

/* =========================================================================
   MOTION PREFERENCES
   ========================================================================= */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .reveal{ opacity:1; transform:none; }
  .marquee__track{ animation:none; }
  .hero__arc .arc-line{ stroke-dashoffset:0; }
  .hero__arc .arc-fill{ opacity:1; }
}

@media print{
  .nav,.marquee,.scroll-progress{ display:none; }
  .reveal{ opacity:1; transform:none; }
  .section--dark,.footer,.hero{ background:#fff !important; color:#000 !important; }
}