/*
Theme Name:  Anderson Family Office
Theme URI:   https://md-anderson.com
Author:      Anderson Family Office
Description: A private, institutional theme for the Anderson Family Office.
Version:     1.0.0
License:     Private
Text Domain: anderson-family-office
*/

/* ============================================================
   All styles follow — see css/style.css for source reference
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Lato:wght@300;400;700&display=swap');

/* ── Reset & Base ─────────────────────────────────────────── */

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

:root {
  --navy:          #0d1b2e;
  --navy-mid:      #142236;
  --navy-light:    #1c3050;
  --green:         #1a3328;
  --green-mid:     #213f32;
  --green-light:   #2c5241;
  --ivory:         #f8f5ef;
  --ivory-dark:    #ede8de;
  --ivory-deeper:  #e4ddd0;
  --gold:          #b8965c;
  --gold-light:    #d4af72;
  --gold-pale:     #e8d5a8;
  --charcoal:      #1e1e1e;
  --charcoal-mid:  #3a3a3a;
  --stone:         #8a8278;
  --text:          #1e1e1e;
  --text-mid:      #4a4540;
  --text-light:    #7a7570;
  --border-gold:   rgba(184, 150, 92, 0.22);
  --border-dark:   rgba(255,255,255,0.08);
  --border-light:  rgba(30,30,30,0.10);
  --serif:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:   'Lato', 'Helvetica Neue', Arial, sans-serif;
  --ease:   cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --transition: 0.45s var(--ease);
  --max-width: 1180px;
  --gutter: 2.5rem;
}

html { font-size: 16px; scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: var(--sans); font-weight: 300; color: var(--text); background: var(--ivory); line-height: 1.7; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a   { color: inherit; text-decoration: none; }
ul  { list-style: none; }

/* ── Typography ───────────────────────────────────────────── */

.t-display    { font-family: var(--serif); font-weight: 300; font-size: clamp(2.8rem, 6vw, 5.5rem); line-height: 1.1; letter-spacing: 0.01em; }
.t-headline   { font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 3.5vw, 3.2rem); line-height: 1.2; letter-spacing: 0.01em; }
.t-subhead    { font-family: var(--serif); font-weight: 400; font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.35; }
.t-label      { font-family: var(--sans); font-weight: 400; font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; }
.t-body       { font-family: var(--sans); font-weight: 300; font-size: 1rem; line-height: 1.8; }
.t-body-serif { font-family: var(--serif); font-weight: 300; font-size: 1.2rem; line-height: 1.75; }

/* ── Layout ───────────────────────────────────────────────── */

.container        { max-width: var(--max-width); margin: 0 auto; padding: 0 var(--gutter); }
.container--narrow { max-width: 780px; margin: 0 auto; padding: 0 var(--gutter); }
.container--wide  { max-width: 1400px; margin: 0 auto; padding: 0 var(--gutter); }
.section          { padding: 7rem 0; }
.section--large   { padding: 10rem 0; }
.section--small   { padding: 4rem 0; }

/* ── Rule / Eyebrow ──────────────────────────────────────── */

.rule { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.5rem; }
.rule::before { content: ''; display: block; width: 2rem; height: 1px; background: var(--gold); }
.rule--center { justify-content: center; }
.rule--center::before, .rule--center::after { content: ''; display: block; flex: 1; height: 1px; background: var(--border-gold); }
.section-eyebrow { color: var(--gold); }

/* ── Navigation ───────────────────────────────────────────── */

.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; padding: 1.4rem var(--gutter); display: flex; align-items: center; justify-content: space-between; transition: var(--transition); }
.nav--transparent { background: transparent; }
.nav--solid { background: var(--navy); border-bottom: 1px solid var(--border-dark); padding: 1rem var(--gutter); }
.nav__brand { display: flex; align-items: center; gap: 1rem; }
.nav__crest { width: 42px; height: 42px; object-fit: contain; filter: brightness(1.1); transition: var(--transition); }
.nav--solid .nav__crest { width: 36px; height: 36px; }
.nav__wordmark { display: flex; flex-direction: column; }
.nav__name  { font-family: var(--serif); font-weight: 400; font-size: 1.1rem; color: var(--ivory); letter-spacing: 0.06em; line-height: 1.1; }
.nav__motto { font-family: var(--sans); font-size: 0.58rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-top: 0.15rem; }
.nav__links { display: flex; align-items: center; gap: 2.2rem; }
.nav__link  { font-family: var(--sans); font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(248,245,239,0.75); transition: color 0.3s ease; position: relative; }
.nav__link::after { content: ''; position: absolute; bottom: -3px; left: 0; right: 0; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--ease); }
.nav__link:hover, .nav__link--active { color: var(--ivory); }
.nav__link:hover::after, .nav__link--active::after { transform: scaleX(1); }
.nav__toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; background: none; border: none; }
.nav__toggle span { display: block; width: 24px; height: 1px; background: var(--ivory); transition: var(--transition); }

/* ── Mobile Nav ───────────────────────────────────────────── */

@media (max-width: 900px) {
  .nav__links { position: fixed; top: 0; right: 0; bottom: 0; width: min(320px, 85vw); background: var(--navy); flex-direction: column; align-items: flex-start; justify-content: center; padding: 4rem 2.5rem; gap: 1.8rem; transform: translateX(100%); transition: transform 0.5s var(--ease-out); border-left: 1px solid var(--border-dark); }
  .nav__links--open { transform: translateX(0); }
  .nav__link { font-size: 0.75rem; color: rgba(248,245,239,0.7); }
  .nav__toggle { display: flex; z-index: 110; }
}

/* ── Hero ─────────────────────────────────────────────────── */

.hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--navy); overflow: hidden; }
.hero__bg { position: absolute; inset: 0; background-image: url('assets/images/hero-bg.jpg'); background-size: cover; background-position: center 60%; opacity: 0.45; pointer-events: none; }
.hero__texture { position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); opacity: 0.6; pointer-events: none; }
.hero__vignette { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(8,14,24,0.55) 0%, rgba(8,14,24,0.2) 40%, rgba(8,14,24,0.2) 60%, rgba(8,14,24,0.75) 100%); pointer-events: none; }
.hero__inner { position: relative; text-align: center; padding: 8rem var(--gutter) 5rem; max-width: 800px; }
.hero__crest { width: clamp(120px, 16vw, 200px); height: auto; margin: 0 auto 2.5rem; opacity: 0; transform: translateY(16px); animation: fadeUp 1.2s var(--ease-out) 0.3s forwards; filter: drop-shadow(0 4px 20px rgba(0,0,0,0.4)); }
.hero__title { font-family: var(--serif); font-weight: 300; font-size: clamp(3rem, 7vw, 6rem); color: var(--ivory); letter-spacing: 0.05em; line-height: 1.05; margin-bottom: 1.8rem; opacity: 0; animation: fadeUp 1s var(--ease-out) 0.8s forwards; }
.hero__title em { font-style: italic; font-weight: 300; }
.hero__rule { width: 60px; height: 1px; background: var(--gold); margin: 0 auto 1.8rem; opacity: 0; animation: fadeUp 1s var(--ease-out) 1s forwards; }
.hero__motto { font-family: var(--sans); font-size: 0.65rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); opacity: 0; animation: fadeUp 1s var(--ease-out) 1.3s forwards; }
.hero__scroll { position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 0.6rem; opacity: 0; animation: fadeIn 1s ease 2s forwards; }
.hero__scroll-line { width: 1px; height: 40px; background: linear-gradient(to bottom, transparent, var(--gold)); animation: scrollPulse 2.5s ease infinite; }
.hero__scroll-label { font-family: var(--sans); font-size: 0.58rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); opacity: 0.7; }

/* ── Interior Page Header ─────────────────────────────────── */

.page-header { background: var(--navy); padding: 10rem var(--gutter) 5rem; text-align: center; position: relative; overflow: hidden; }
.page-header__texture { position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); opacity: 0.5; pointer-events: none; }
.page-header__inner { position: relative; max-width: 680px; margin: 0 auto; }
.page-header__eyebrow { color: var(--gold); margin-bottom: 1rem; }
.page-header__title { font-family: var(--serif); font-weight: 300; font-size: clamp(2.4rem, 5vw, 4rem); color: var(--ivory); line-height: 1.15; letter-spacing: 0.02em; margin-bottom: 1.2rem; }
.page-header__sub { font-family: var(--serif); font-style: italic; font-weight: 300; font-size: 1.15rem; color: rgba(248,245,239,0.55); line-height: 1.6; }
.page-header__rule { width: 50px; height: 1px; background: var(--gold); margin: 1.5rem auto 0; }

/* ── Pillars ──────────────────────────────────────────────── */

.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--border-light); }
.pillar { padding: 3.5rem 2.5rem; border-right: 1px solid var(--border-light); position: relative; transition: background var(--transition); }
.pillar:last-child { border-right: none; }
.pillar:hover { background: var(--ivory-dark); }
.pillar__number { font-family: var(--serif); font-size: 0.8rem; color: var(--gold); letter-spacing: 0.15em; margin-bottom: 1.5rem; display: block; }
.pillar__title  { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--charcoal); margin-bottom: 1rem; letter-spacing: 0.01em; }
.pillar__text   { font-size: 0.9rem; color: var(--text-mid); line-height: 1.75; margin-bottom: 2rem; }
.pillar__link   { font-family: var(--sans); font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); display: flex; align-items: center; gap: 0.6rem; transition: gap var(--transition); }
.pillar__link::after { content: '→'; transition: transform var(--transition); }
.pillar:hover .pillar__link { gap: 1rem; }

/* ── Statement / Pull Quote ───────────────────────────────── */

.statement { background: var(--navy); padding: 7rem var(--gutter); text-align: center; position: relative; }
.statement__inner { max-width: 820px; margin: 0 auto; }
.statement__mark  { font-family: var(--serif); font-size: 5rem; color: var(--gold); opacity: 0.25; line-height: 0.6; margin-bottom: 1.5rem; }
.statement__quote { font-family: var(--serif); font-style: italic; font-weight: 300; font-size: clamp(1.4rem, 2.8vw, 2.2rem); color: var(--ivory); line-height: 1.55; margin-bottom: 2rem; }
.statement__attribution { font-family: var(--sans); font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); }

/* ── Bands ────────────────────────────────────────────────── */

.band       { background: var(--green); padding: 6rem var(--gutter); }
.band--navy { background: var(--navy); }

/* ── Split ────────────────────────────────────────────────── */

.split     { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.split--3-2 { grid-template-columns: 3fr 2fr; }
.split--2-3 { grid-template-columns: 2fr 3fr; }
.split__media-frame { position: relative; overflow: hidden; }
.split__media-frame::before { content: ''; position: absolute; inset: -1rem; border: 1px solid var(--border-gold); pointer-events: none; z-index: 1; }
.split__media-img { width: 100%; aspect-ratio: 4/5; object-fit: cover; filter: sepia(0.15) contrast(0.95); }

/* ── Values ───────────────────────────────────────────────── */

.values { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.5rem 4rem; margin-top: 3rem; }
.value { padding-top: 1.5rem; border-top: 1px solid var(--border-light); }
.value__title { font-family: var(--serif); font-weight: 400; font-size: 1.25rem; margin-bottom: 0.6rem; }
.value__text  { font-size: 0.9rem; color: var(--text-mid); line-height: 1.75; }

/* ── Focus Grid ───────────────────────────────────────────── */

.focus-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--border-light); margin-top: 4rem; }
.focus-item { background: var(--ivory); padding: 3rem 2rem; position: relative; overflow: hidden; }
.focus-item::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(to right, var(--gold), var(--gold-light)); transform: scaleX(0); transform-origin: left; transition: transform 0.5s var(--ease); }
.focus-item:hover::before { transform: scaleX(1); }
.focus-item__icon  { width: 36px; height: 1px; background: var(--gold); margin-bottom: 1.8rem; }
.focus-item__title { font-family: var(--serif); font-size: 1.3rem; font-weight: 400; margin-bottom: 0.8rem; }
.focus-item__text  { font-size: 0.88rem; color: var(--text-mid); line-height: 1.75; }

/* ── Principles ───────────────────────────────────────────── */

.principles { display: flex; flex-direction: column; gap: 0; margin-top: 3rem; }
.principle { display: grid; grid-template-columns: 3rem 1fr; gap: 2rem; padding: 2rem 0; border-bottom: 1px solid var(--border-light); align-items: start; }
.principle:first-child { border-top: 1px solid var(--border-light); }
.principle__num   { font-family: var(--serif); font-size: 0.85rem; color: var(--gold); padding-top: 0.15rem; }
.principle__title { font-family: var(--serif); font-size: 1.2rem; font-weight: 400; margin-bottom: 0.4rem; }
.principle__text  { font-size: 0.88rem; color: var(--text-mid); line-height: 1.75; }

/* ── Timeline ─────────────────────────────────────────────── */

.timeline { position: relative; padding-left: 3rem; margin-top: 3rem; }
.timeline::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: linear-gradient(to bottom, var(--gold), transparent); }
.timeline-item { position: relative; margin-bottom: 3rem; padding-bottom: 3rem; border-bottom: 1px solid var(--border-light); }
.timeline-item:last-child { border-bottom: none; margin-bottom: 0; }
.timeline-item::before { content: ''; position: absolute; left: -3.38rem; top: 0.3rem; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.timeline-item__year  { font-family: var(--sans); font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.5rem; }
.timeline-item__title { font-family: var(--serif); font-size: 1.3rem; font-weight: 400; margin-bottom: 0.5rem; }
.timeline-item__text  { font-size: 0.88rem; color: var(--text-mid); line-height: 1.75; }

/* ── Events ───────────────────────────────────────────────── */

.events-list { display: flex; flex-direction: column; gap: 0; margin-top: 3rem; }
.event-item { display: grid; grid-template-columns: 6rem 1fr auto; gap: 2.5rem; align-items: center; padding: 2rem 0; border-bottom: 1px solid var(--border-light); transition: background var(--transition); }
.event-item:first-child { border-top: 1px solid var(--border-light); }
.event-item__date  { text-align: center; }
.event-item__month { font-family: var(--sans); font-size: 0.6rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); display: block; }
.event-item__day   { font-family: var(--serif); font-size: 2.2rem; font-weight: 300; color: var(--charcoal); line-height: 1; }
.event-item__title { font-family: var(--serif); font-size: 1.25rem; font-weight: 400; margin-bottom: 0.3rem; }
.event-item__meta  { font-size: 0.82rem; color: var(--text-light); }
.event-item__status { font-family: var(--sans); font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); white-space: nowrap; }

/* ── Contact Form ─────────────────────────────────────────── */

.contact-form { display: flex; flex-direction: column; gap: 1.5rem; margin-top: 2rem; }
.form-group { display: flex; flex-direction: column; gap: 0.5rem; }
.form-group label { font-family: var(--sans); font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-mid); }
.form-group input, .form-group textarea, .form-group select { font-family: var(--sans); font-weight: 300; font-size: 0.95rem; color: var(--text); background: transparent; border: none; border-bottom: 1px solid var(--border-light); padding: 0.75rem 0; outline: none; transition: border-color 0.3s ease; -webkit-appearance: none; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-bottom-color: var(--gold); }
.form-group textarea { resize: none; height: 120px; }
.form-group select { cursor: pointer; }
.form-note { font-size: 0.78rem; color: var(--text-light); font-style: italic; font-family: var(--serif); }

/* ── Buttons ──────────────────────────────────────────────── */

.btn { display: inline-flex; align-items: center; gap: 0.8rem; font-family: var(--sans); font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; padding: 1rem 2.2rem; cursor: pointer; transition: var(--transition); border: none; outline: none; }
.btn--outline       { background: transparent; border: 1px solid var(--gold); color: var(--gold); }
.btn--outline:hover { background: var(--gold); color: var(--navy); }
.btn--outline-light       { background: transparent; border: 1px solid rgba(248,245,239,0.3); color: var(--ivory); }
.btn--outline-light:hover { background: rgba(248,245,239,0.08); border-color: var(--ivory); }
.btn--solid       { background: var(--navy); color: var(--ivory); }
.btn--solid:hover { background: var(--navy-light); }
.btn--gold        { background: var(--gold); color: var(--navy); }
.btn--gold:hover  { background: var(--gold-light); }

/* ── Stats ────────────────────────────────────────────────── */

.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--border-dark); }
.stat { padding: 3rem 2rem; border-right: 1px solid var(--border-dark); text-align: center; }
.stat:last-child { border-right: none; }
.stat__value { font-family: var(--serif); font-size: 3rem; font-weight: 300; color: var(--ivory); line-height: 1; margin-bottom: 0.5rem; }
.stat__label { font-family: var(--sans); font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(248,245,239,0.45); }

/* ── Ornament ─────────────────────────────────────────────── */

.ornament { text-align: center; padding: 2rem 0; color: var(--gold); font-size: 1.2rem; letter-spacing: 0.5em; opacity: 0.4; }

/* ── Footer ───────────────────────────────────────────────── */

.footer { background: var(--charcoal); padding: 5rem var(--gutter) 2.5rem; }
.footer__inner { max-width: var(--max-width); margin: 0 auto; }
.footer__top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 4rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(255,255,255,0.06); margin-bottom: 2.5rem; }
.footer__brand-crest  { width: 50px; height: auto; margin-bottom: 1.2rem; opacity: 0.85; }
.footer__brand-name   { font-family: var(--serif); font-size: 1.1rem; color: var(--ivory); letter-spacing: 0.06em; margin-bottom: 0.3rem; }
.footer__brand-motto  { font-family: var(--sans); font-size: 0.58rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.2rem; }
.footer__brand-text   { font-size: 0.82rem; color: rgba(248,245,239,0.35); line-height: 1.75; max-width: 280px; }
.footer__col-title    { font-family: var(--sans); font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.5rem; }
.footer__links        { display: flex; flex-direction: column; gap: 0.8rem; }
.footer__link         { font-size: 0.82rem; color: rgba(248,245,239,0.45); transition: color 0.3s ease; font-family: var(--serif); }
.footer__link:hover   { color: rgba(248,245,239,0.85); }
.footer__bottom       { display: flex; align-items: center; justify-content: space-between; }
.footer__legal        { font-size: 0.72rem; color: rgba(248,245,239,0.2); line-height: 1.6; }
.footer__motto-full   { font-family: var(--serif); font-style: italic; font-size: 0.85rem; color: rgba(248,245,239,0.2); letter-spacing: 0.08em; }

/* ── Contact Page ─────────────────────────────────────────── */

.contact-hero { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; }
.contact-hero__left { background: var(--navy); display: flex; flex-direction: column; justify-content: center; padding: 10rem 5rem 5rem; position: relative; overflow: hidden; }
.contact-hero__left::before { content: ''; position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); opacity: 0.5; pointer-events: none; }
.contact-hero__right { background: var(--ivory); display: flex; flex-direction: column; justify-content: center; padding: 10rem 5rem 5rem; }

/* ── Animations ───────────────────────────────────────────── */

@keyframes fadeUp  { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes scrollPulse { 0%, 100% { opacity: 0.3; transform: scaleY(0.8); transform-origin: top; } 50% { opacity: 1; transform: scaleY(1); transform-origin: top; } }

/* Animations only activate when JS has loaded (js class on <html>).
   Without JS, all .reveal elements are fully visible by default.      */
.js .reveal          { opacity: 0; transform: translateY(24px); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.js .reveal--visible { opacity: 1; transform: translateY(0); }
.reveal--delay-1 { transition-delay: 0.1s; }
.reveal--delay-2 { transition-delay: 0.2s; }
.reveal--delay-3 { transition-delay: 0.3s; }
.reveal--delay-4 { transition-delay: 0.4s; }
.reveal--delay-5 { transition-delay: 0.5s; }

/* ── Utilities ────────────────────────────────────────────── */

.text-ivory  { color: var(--ivory); }
.text-gold   { color: var(--gold); }
.text-mid    { color: var(--text-mid); }
.text-light  { color: var(--text-light); }
.text-center { text-align: center; }
.text-right  { text-align: right; }
.italic      { font-style: italic; }
.mb-1 { margin-bottom: 0.5rem; } .mb-2 { margin-bottom: 1rem; }   .mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }   .mb-6 { margin-bottom: 3rem; }   .mb-8 { margin-bottom: 4rem; }
.mt-4 { margin-top: 2rem; }      .mt-6 { margin-top: 3rem; }

/* ── Responsive ───────────────────────────────────────────── */

@media (max-width: 1024px) {
  :root { --gutter: 2rem; }
  .pillars { grid-template-columns: 1fr; }
  .pillar  { border-right: none; border-bottom: 1px solid var(--border-light); }
  .focus-grid { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr 1fr; gap: 3rem; }
  .split { gap: 3rem; }
}

@media (max-width: 768px) {
  :root { --gutter: 1.5rem; }
  .section { padding: 5rem 0; }
  .section--large { padding: 6rem 0; }
  .split, .split--3-2, .split--2-3 { grid-template-columns: 1fr; }
  .values { grid-template-columns: 1fr; gap: 1.5rem; }
  .stats { grid-template-columns: 1fr; }
  .stat { border-right: none; border-bottom: 1px solid var(--border-dark); }
  .stat:last-child { border-bottom: none; }
  .focus-grid { grid-template-columns: 1fr; }
  .event-item { grid-template-columns: 4rem 1fr; }
  .event-item__status { display: none; }
  .footer__top { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer__bottom { flex-direction: column; gap: 1rem; text-align: center; }
  .footer__brand-text { max-width: 100%; }
  .contact-hero { grid-template-columns: 1fr; min-height: auto; }
  .contact-hero__left  { padding: 10rem 2rem 4rem; min-height: 60vh; }
  .contact-hero__right { padding: 4rem 2rem 5rem; }
}

@media (max-width: 480px) {
  .hero__title { font-size: 2.5rem; }
  .t-display   { font-size: 2.2rem; }
  .btn { font-size: 0.62rem; padding: 0.85rem 1.6rem; }
}