:root{
  --bg:#f7f2e9;
  --panel:#ffffff;
  --panel-soft:#fbf7f0;
  --line:#e6dbc7;
  --text:#202020;
  --muted:#6c6258;
  --accent:#8d1b1b;
  --accent2:#b88a3f;
  --shadow:0 16px 40px rgba(28, 22, 14, .08);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(184,138,63,.12), transparent 24%),
    radial-gradient(circle at top right, rgba(141,27,27,.10), transparent 22%),
    linear-gradient(180deg, #fbf7f0 0%, #f4ede1 100%);
  font-family: Georgia, "Times New Roman", serif;
}
a{color:inherit}
.site-shell{width:min(var(--max), calc(100% - 32px)); margin:0 auto}
.topbar{
  position:sticky; top:12px; z-index:30; margin-top:16px;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:14px 18px; border:1px solid var(--line); border-radius:22px;
  background:rgba(255,255,255,.88); backdrop-filter:blur(14px); box-shadow:var(--shadow);
}
.brand{display:flex; align-items:center; gap:14px; min-width:0; text-decoration:none}
.brand-mark{
  width:54px; height:54px; border-radius:16px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.26), transparent 35%),
    linear-gradient(135deg, var(--accent), #4a0c0c);
  display:grid; place-items:center; color:#fff; font-weight:700; letter-spacing:.08em;
  box-shadow:0 10px 24px rgba(141,27,27,.16); flex:0 0 auto;
}
.brand strong{display:block; font-size:1rem; line-height:1.1; font-family: Arial, Helvetica, sans-serif}
.brand span{display:block; margin-top:4px; color:var(--muted); font-size:.82rem; font-family: Arial, Helvetica, sans-serif}
.nav{display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end}
.nav a{
  text-decoration:none; font-family: Arial, Helvetica, sans-serif; font-size:.92rem;
  padding:10px 14px; border-radius:999px; border:1px solid var(--line); background:#fff;
}
.nav a.active{border-color:rgba(141,27,27,.28); background:rgba(141,27,27,.08)}
.hero{
  display:grid; grid-template-columns:1.15fr .85fr; gap:24px; align-items:center;
  padding:26px 0 18px;
}
.eyebrow{
  font-family: Arial, Helvetica, sans-serif; text-transform:uppercase; letter-spacing:.24em;
  color:var(--accent); font-size:.73rem; font-weight:700;
}
h1,h2,h3,p{margin:0}
h1{
  font-size:clamp(2.5rem, 6vw, 4.7rem);
  line-height:.94; letter-spacing:-.04em; margin-top:10px; font-weight:700;
}
.page-title{font-size:clamp(2rem, 4vw, 3.2rem)}
.lede{
  margin-top:18px; max-width:60ch; color:var(--muted); line-height:1.8;
  font-size:1.02rem; font-family: Arial, Helvetica, sans-serif;
}
.actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px}
.btn,.ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 16px; border-radius:999px; text-decoration:none; font-family: Arial, Helvetica, sans-serif;
  border:1px solid var(--line); background:#fff;
}
.btn{background:linear-gradient(135deg, var(--accent), #b13428); color:#fff; border-color:transparent}
.ghost{background:rgba(255,255,255,.5)}
.card{
  border:1px solid var(--line); border-radius:28px; background:var(--panel);
  box-shadow:var(--shadow); overflow:hidden;
}
.hero-card{padding:0}
.hero-art{
  min-height:470px; display:flex; flex-direction:column; justify-content:flex-end;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.52)),
    radial-gradient(circle at 22% 18%, rgba(248,215,160,.95), transparent 24%),
    radial-gradient(circle at 82% 22%, rgba(163,35,35,.18), transparent 22%),
    linear-gradient(135deg, #f7e8c9 0%, #efe3ce 40%, #f5ece0 100%);
  position:relative;
}
.hero-art span{position:relative; z-index:1; display:inline-flex; padding:.35rem .55rem; border-radius:999px; background:rgba(255,255,255,.72); border:1px solid var(--line)}
.hero-art::before,
.hero-art::after{
  content:""; position:absolute; inset:auto; border-radius:999px; opacity:.86;
}
.hero-art::before{
  width:72%; height:13px; left:14%; bottom:36%;
  background:linear-gradient(90deg, #8d1b1b, #b88a3f);
  transform:rotate(-12deg);
}
.hero-art::after{
  width:78%; height:10px; left:10%; bottom:29%;
  background:linear-gradient(90deg, #b88a3f, #8d1b1b);
  transform:rotate(9deg);
}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(247,242,233,.92));
}
.hero-copy-art{
  position:relative; z-index:1; padding:18px 20px; display:flex; gap:10px; flex-wrap:wrap;
  font-family: Arial, Helvetica, sans-serif; color:var(--muted); font-size:.92rem;
  border-top:1px solid var(--line); background:rgba(255,255,255,.48);
}
.page-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:22px; padding:0 0 22px;
}
.panel{padding:22px}
.section-head{
  display:flex; justify-content:space-between; gap:14px; align-items:flex-end; margin-bottom:16px
}
.section-head h1,.section-head h2{line-height:1.1}
.section-head p,.muted{color:var(--muted); font-family: Arial, Helvetica, sans-serif; line-height:1.7}
.mission,.callout,.event-box,.contact-stack,.member p{
  font-family: Arial, Helvetica, sans-serif; line-height:1.78; color:#352f29;
}
.mission{display:grid; gap:14px}
.mission strong{font-weight:700; color:var(--accent)}
.callout,.event-box,.contact-stack{
  margin-top:6px; padding:18px; border-radius:18px; border:1px solid var(--line); background:var(--panel-soft)
}
.callout-text{font-style:italic}
.contact-stack{display:grid; gap:12px}
.contact-stack a{font-weight:700; text-decoration:none}
.site-footer{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 22px; margin:0 0 32px; border-radius:18px;
  font-family: Arial, Helvetica, sans-serif;
}
.site-footer strong{display:block; font-size:1rem}
.site-footer span,.footer-note{display:block; color:var(--muted); font-size:.9rem; margin-top:4px}
.footer-links{display:flex; flex-wrap:wrap; gap:10px; justify-content:center}
.footer-links a{
  text-decoration:none; padding:8px 12px; border:1px solid var(--line); border-radius:999px; background:var(--panel-soft)
}
.team{display:grid; gap:18px}
.member{
  display:grid; grid-template-columns:140px 1fr; gap:18px; align-items:start;
  padding:18px; border-radius:22px; border:1px solid var(--line); background:var(--panel-soft)
}
.portrait{
  width:140px; height:160px; border-radius:18px; border:1px solid var(--line);
  background:
    radial-gradient(circle at 50% 32%, rgba(255,255,255,.76), transparent 24%),
    linear-gradient(135deg, rgba(141,27,27,.18), rgba(184,138,63,.18));
}
.portrait-libby{
  background:
    radial-gradient(circle at 50% 32%, rgba(255,255,255,.76), transparent 24%),
    linear-gradient(135deg, rgba(141,27,27,.18), rgba(184,138,63,.18));
}
.portrait-paris{
  background:
    radial-gradient(circle at 50% 32%, rgba(255,255,255,.76), transparent 24%),
    linear-gradient(135deg, rgba(184,138,63,.20), rgba(38,31,26,.10));
}
.member h2{font-size:1.2rem; margin-bottom:10px}
.member p{margin-bottom:12px}
.member p:last-child{margin-bottom:0}
.brand:hover,.nav a:hover,.btn:hover,.ghost:hover{transform:translateY(-1px)}
.brand,.nav a,.btn,.ghost{transition:transform .16s ease, background-color .16s ease, border-color .16s ease}
@media (max-width: 900px){
  .hero,.page-grid{grid-template-columns:1fr}
  .member{grid-template-columns:1fr}
  .portrait{width:100%; height:220px}
  .topbar{position:static}
  .site-footer{flex-direction:column; align-items:flex-start}
}