/* Copper Falls Applied Systems — site styles.
   One stylesheet, no build step, no third-party requests. */

@font-face {
  font-family: 'Archivo';
  src: url('/assets/fonts/archivo-var-latin.woff2') format('woff2-variations');
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
}

:root {
  --copper:#7A3B21; --copper-deep:#5E2C18; --mid:#A9714A;
  --cream:#F5EBE1; --paper:#FBF6F1; --ground:#F5EBE1;
  --ink:#2C1A12; --ink-soft:#6B5546; --line:#E0D2C4;
  --panel:#FBF6F1; --on-copper:#F5EBE1; --tint:#C4A494;
  --focus:#7A3B21;
  --measure:64ch;
  --step:clamp(48px, 7vw, 96px);
  --gutter:clamp(20px, 5vw, 48px);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --copper:#C87848; --copper-deep:#8C4A2C; --mid:#A9714A;
    --cream:#F0E3D8; --paper:#231610; --ground:#17100C;
    --ink:#F0E3D8; --ink-soft:#B49B88; --line:#3A2A21;
    --panel:#20140F; --on-copper:#F5EBE1; --tint:#C4A494;
    --focus:#C87848;
  }
}

*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--ground); color:var(--ink);
  font-family:Archivo, system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-variation-settings:'wght' 420, 'wdth' 100;
  font-size:clamp(16px, 0.55vw + 14px, 18px); line-height:1.6;
  text-rendering:optimizeLegibility;
}
img, svg { max-width:100%; height:auto; }
a { color:var(--copper); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { text-decoration-thickness:2px; }
:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }

.skip {
  position:absolute; left:-9999px; top:0; background:var(--copper); color:var(--on-copper);
  padding:10px 16px; z-index:10;
}
.skip:focus { left:0; }

.wrap { max-width:1080px; margin-inline:auto; padding-inline:var(--gutter); }

/* ---------------------------------------------------------------- head -- */
.site-head { border-bottom:1px solid var(--line); background:var(--ground); }
.site-head .wrap {
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding-block:18px; flex-wrap:wrap;
}
.brand { display:flex; align-items:center; gap:14px; text-decoration:none; color:var(--copper); }
.brand img { width:34px; height:auto; display:block; }
.brand b {
  font-variation-settings:'wght' 650, 'wdth' 105; font-size:1.05rem;
  letter-spacing:.01em; line-height:1;
}
.brand span {
  display:block; font-size:.58rem; letter-spacing:.24em; color:var(--ink-soft);
  font-variation-settings:'wght' 600, 'wdth' 105; margin-top:4px;
}
.nav { display:flex; gap:clamp(16px,3vw,32px); flex-wrap:wrap; }
.nav a {
  text-decoration:none; color:var(--ink-soft); font-size:.74rem; letter-spacing:.16em;
  text-transform:uppercase; font-variation-settings:'wght' 600, 'wdth' 105;
  padding-block:6px; border-bottom:2px solid transparent;
}
.nav a:hover { color:var(--copper); }
.nav a[aria-current="page"] { color:var(--copper); border-bottom-color:var(--copper); }

/* ---------------------------------------------------------------- hero -- */
.hero { background:var(--copper-deep); color:var(--on-copper); position:relative; overflow:hidden; }
.hero .wrap { position:relative; padding-block:clamp(56px,9vw,104px); }
.hero-mark {
  position:absolute; right:-6%; top:50%; translate:0 -50%; width:min(46%, 460px);
  opacity:.14; pointer-events:none;
}
.hero h1 {
  margin:0; font-variation-settings:'wght' 680, 'wdth' 105;
  font-size:clamp(2.2rem, 6vw, 4rem); line-height:1.02; letter-spacing:-.015em;
  text-wrap:balance; max-width:16ch;
}
.hero p { max-width:52ch; margin:24px 0 0; color:var(--tint); font-size:1.06rem; }
.hero .rule { width:220px; height:3px; background:var(--tint); margin:34px 0 18px; }
.hero .tag {
  font-size:.72rem; letter-spacing:.26em; text-transform:uppercase; color:var(--tint);
  font-variation-settings:'wght' 600, 'wdth' 105;
}

/* ------------------------------------------------------------- content -- */
main section { padding-block:var(--step); border-bottom:1px solid var(--line); }
main section:last-of-type { border-bottom:0; }
.eyebrow {
  max-width:none;
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--mid);
  font-variation-settings:'wght' 600, 'wdth' 105; margin:0 0 14px;
  display:flex; align-items:baseline; gap:12px;
}
.eyebrow::after { content:""; flex:1; height:1px; background:var(--line); }
h2 {
  margin:0 0 18px; font-variation-settings:'wght' 650, 'wdth' 105;
  font-size:clamp(1.5rem, 3.4vw, 2.2rem); line-height:1.1; letter-spacing:-.01em;
  text-wrap:balance; color:var(--copper);
}
h3 {
  margin:0 0 8px; font-variation-settings:'wght' 620, 'wdth' 105;
  font-size:1.06rem; letter-spacing:-.005em; color:var(--ink);
}
p { max-width:var(--measure); }
.lede { font-size:1.12rem; color:var(--ink-soft); max-width:58ch; }

.grid { display:grid; gap:clamp(20px,3vw,32px); }
.grid.three { grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); }
.grid.two { grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); }

.item { border-top:2px solid var(--copper); padding-top:16px; }
.item p { color:var(--ink-soft); margin:0; font-size:.95rem; }
.item .num {
  font-size:.7rem; letter-spacing:.18em; color:var(--mid);
  font-variation-settings:'wght' 600, 'wdth' 105; display:block; margin-bottom:8px;
}

.cap { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:clamp(16px,4vw,48px); }
.cap + .cap { margin-top:clamp(32px,5vw,56px); padding-top:clamp(32px,5vw,56px); border-top:1px solid var(--line); }
.cap h3 { font-size:clamp(1.15rem,2.4vw,1.5rem); color:var(--copper); }
.cap .num { font-size:.72rem; letter-spacing:.2em; color:var(--mid);
            font-variation-settings:'wght' 600, 'wdth' 105; display:block; margin-bottom:10px; }
.cap ul { margin:14px 0 0; padding-left:18px; color:var(--ink-soft); font-size:.95rem; }
.cap li { margin-bottom:6px; }
@media (max-width:760px) { .cap { grid-template-columns:1fr; } }

.band { background:var(--panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

.person { border-top:2px solid var(--copper); padding-top:18px; }
.person h3 { font-size:1.2rem; color:var(--copper); }
.person .role {
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--mid);
  font-variation-settings:'wght' 600, 'wdth' 105; margin:4px 0 14px;
}
.person dl { margin:14px 0 0; display:grid; grid-template-columns:auto 1fr; gap:6px 16px; font-size:.92rem; }
.person dt { color:var(--ink-soft); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
             font-variation-settings:'wght' 600, 'wdth' 105; padding-top:3px; }
.person dd { margin:0; }

.principals { border-top:2px solid var(--copper); padding-top:20px; }
.principals .names { display:grid; gap:clamp(16px,3vw,40px);
                     grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); }
.principals .names h3 { font-size:1.2rem; color:var(--copper); margin:0; }
.principals .names .role {
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--mid);
  font-variation-settings:'wght' 600, 'wdth' 105; margin:4px 0 0;
}
.shared-mail {
  margin-top:26px; padding-top:18px; border-top:1px solid var(--line);
  display:flex; align-items:baseline; gap:16px; flex-wrap:wrap;
}
.shared-mail dt, .shared-mail .k {
  font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft);
  font-variation-settings:'wght' 600, 'wdth' 105;
}
.shared-mail .v { font-size:1.02rem; }

.panel-note { background:var(--panel); border:1px solid var(--line); padding:26px; max-width:640px; }
.panel-note p { margin:0; }

.btn {
  display:inline-block; background:var(--copper); color:var(--on-copper); text-decoration:none;
  padding:14px 26px; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
  font-variation-settings:'wght' 620, 'wdth' 105; border:2px solid var(--copper);
}
.btn:hover { background:transparent; color:var(--copper); }
.btn.ghost { background:transparent; color:var(--on-copper); border-color:var(--tint); }
.btn.ghost:hover { background:var(--on-copper); color:var(--copper-deep); border-color:var(--on-copper); }

/* ---------------------------------------------------------------- form -- */
form { max-width:640px; }
.field { margin-bottom:22px; }
label {
  display:block; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-soft); font-variation-settings:'wght' 600, 'wdth' 105; margin-bottom:8px;
}
input, textarea {
  width:100%; font:inherit; color:var(--ink); background:var(--panel);
  border:1px solid var(--line); border-radius:0; padding:12px 14px;
}
input:focus, textarea:focus { border-color:var(--copper); outline:2px solid var(--focus); outline-offset:1px; }
textarea { min-height:170px; resize:vertical; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.hint { font-size:.82rem; color:var(--ink-soft); margin-top:-12px; margin-bottom:22px; }
.formmsg { padding:14px 16px; border:1px solid var(--line); background:var(--panel); margin-bottom:22px; }
.formmsg.ok { border-color:var(--copper); }
.formmsg.bad { border-color:#B03A2E; color:#B03A2E; }
button[type="submit"] {
  font:inherit; cursor:pointer; background:var(--copper); color:var(--on-copper);
  border:2px solid var(--copper); padding:14px 30px; font-size:.78rem; letter-spacing:.16em;
  text-transform:uppercase; font-variation-settings:'wght' 620, 'wdth' 105;
}
button[type="submit"]:hover { background:transparent; color:var(--copper); }
button[disabled] { opacity:.55; cursor:progress; }

/* -------------------------------------------------------------- footer -- */
.site-foot { background:var(--copper-deep); color:var(--tint); }
.site-foot .wrap { padding-block:clamp(40px,6vw,64px); display:grid; gap:32px;
                   grid-template-columns:repeat(auto-fit, minmax(210px,1fr)); }
.site-foot h4 {
  margin:0 0 12px; font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--on-copper); font-variation-settings:'wght' 600, 'wdth' 105;
}
.site-foot a { color:var(--tint); text-decoration:none; }
.site-foot a:hover { color:var(--on-copper); text-decoration:underline; }
.site-foot img { width:44px; }
.site-foot ul { list-style:none; margin:0; padding:0; }
.site-foot li { margin-bottom:8px; font-size:.92rem; }
.site-foot .legal {
  grid-column:1/-1; border-top:1px solid rgba(245,235,225,.18); padding-top:20px;
  font-size:.76rem; letter-spacing:.06em; display:flex; justify-content:space-between;
  flex-wrap:wrap; gap:12px;
}

/* ------------------------------------------------------------ 404 etc. -- */
.center { text-align:center; padding-block:clamp(64px,12vw,140px); }
.center h1 { font-size:clamp(2rem,6vw,3.2rem); color:var(--copper);
             font-variation-settings:'wght' 680, 'wdth' 105; margin:0 0 16px; }
.center p { margin-inline:auto; }

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}