:root{
  --ink-void:#0b0b0c;
  --ink-deep:#111114;
  --ink-edge:#1f1f22;
  --ink-line:#2a2a2e;
  --paper:#e8e4d9;
  --paper-mute:#9a978d;
  --paper-faint:#5a5852;
  --bronze:#c8a96a;
  --bronze-dim:#8a7545;
  --sage:#7a9277;
  --sage-dim:#556055;
  --oxblood:#9a4247;
  --oxblood-dim:#6e3034;

  --display:'Fraunces',Georgia,serif;
  --body:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;

  --rail:clamp(20px,4vw,56px);
  --col-max:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{background:var(--ink-void);scroll-behavior:smooth}
body{
  font-family:var(--body);
  font-weight:300;
  font-size:16px;
  line-height:1.65;
  color:var(--paper);
  background:var(--ink-void);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  letter-spacing:0.005em;
  overflow-x:hidden;
}

/* Background canvas: cursor-reactive halo field */
.bg-field{
  position:fixed;inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0.72;
}
/* Grain overlay: paper texture */
body::before{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  z-index:95;
  opacity:0.035;
  mix-blend-mode:screen;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 0.95  0 0 0 0 0.85  0 0 0 0.7 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
main,.masthead,.foot{position:relative;z-index:2}

h1,h2,h3,h4{font-family:var(--display);font-weight:350;margin:0;letter-spacing:-0.015em;line-height:1.08}
p{margin:0}
a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color 180ms ease,color 180ms ease}
a:hover{border-bottom-color:var(--bronze)}
::selection{background:var(--bronze);color:var(--ink-void)}

.mono{font-family:var(--mono);font-weight:400;letter-spacing:0.04em;text-transform:uppercase;font-size:11px;color:var(--paper-mute)}
.mono-sm{font-family:var(--mono);font-weight:400;letter-spacing:0.06em;text-transform:uppercase;font-size:10px;color:var(--paper-faint)}

.page{
  max-width:var(--col-max);
  margin:0 auto;
  padding:0 var(--rail);
}

/* ================= Masthead ================= */
.masthead{
  position:sticky;top:0;z-index:50;
  background:rgba(11,11,12,0.82);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--ink-edge);
}
.masthead-inner{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:clamp(24px,4vw,64px);
  padding:18px var(--rail);
  max-width:var(--col-max);
  margin:0 auto;
}
.mark{
  display:inline-flex;align-items:baseline;gap:8px;
  font-family:var(--display);
  font-weight:400;
  font-size:26px;
  letter-spacing:-0.03em;
  color:var(--paper);
  font-variation-settings:"opsz" 144,"SOFT" 20;
  line-height:1;
}
.mark-3{
  fill:var(--bronze);
  flex-shrink:0;
  transform:translateY(1px);
  transition:fill 260ms ease;
}
.mark:hover .mark-3{fill:var(--paper)}
.mark .suffix{
  font-family:var(--mono);
  font-weight:400;
  font-size:12px;
  color:var(--paper-mute);
  letter-spacing:0.05em;
  margin-left:2px;
  align-self:center;
  padding-bottom:2px;
}
.nav{
  justify-self:end;
  display:flex;gap:clamp(14px,2.2vw,30px);
  font-family:var(--mono);
  font-size:11px;
  font-weight:400;
  letter-spacing:0.12em;
  text-transform:uppercase;
}
.nav a{
  color:var(--paper-mute);
  padding:6px 0;
  border-bottom:1px solid transparent;
}
.nav a:hover{color:var(--paper);border-bottom-color:var(--bronze)}
.nav a.active{color:var(--paper);border-bottom-color:var(--paper)}

.class-strip{
  justify-self:center;
  display:none;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--paper-faint);
}
@media(min-width:1060px){.class-strip{display:block}}

/* ================= Reveal animation ================= */
.reveal>*{opacity:0;transform:translateY(10px);animation:rise 720ms cubic-bezier(.2,.7,.2,1) forwards}
.reveal>*:nth-child(1){animation-delay:60ms}
.reveal>*:nth-child(2){animation-delay:140ms}
.reveal>*:nth-child(3){animation-delay:220ms}
.reveal>*:nth-child(4){animation-delay:300ms}
.reveal>*:nth-child(5){animation-delay:380ms}
.reveal>*:nth-child(6){animation-delay:460ms}
.reveal>*:nth-child(7){animation-delay:540ms}
.reveal>*:nth-child(8){animation-delay:620ms}
@keyframes rise{to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
  .reveal>*{animation:none;opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ================= Hero ================= */
.hero{
  padding:clamp(80px,13vw,160px) 0 clamp(64px,10vw,128px);
  border-bottom:1px solid var(--ink-edge);
}
.hero-meta{
  display:flex;gap:20px;flex-wrap:wrap;
  margin-bottom:clamp(32px,5vw,56px);
  color:var(--paper-faint);
}
.hero-meta span{display:inline-flex;align-items:center;gap:10px}
.hero-meta span::before{
  content:"";width:5px;height:5px;background:var(--bronze);
  display:inline-block;
}
.hero-meta span:first-child::before{display:none}
.hero-meta .dot-sage::before{background:var(--sage)}
.hero-meta .dot-oxblood::before{background:var(--oxblood)}

.hero h1{
  font-size:clamp(40px,7.6vw,104px);
  font-weight:300;
  font-variation-settings:"opsz" 144,"SOFT" 25;
  max-width:18ch;
  letter-spacing:-0.028em;
  line-height:1.02;
}
.hero h1 em{
  font-style:italic;
  font-weight:300;
  color:var(--paper-mute);
  font-variation-settings:"opsz" 144,"SOFT" 60;
}
.hero-lede{
  margin-top:clamp(28px,4vw,48px);
  max-width:58ch;
  font-size:clamp(16px,1.3vw,18.5px);
  line-height:1.7;
  color:var(--paper-mute);
  font-weight:300;
}

/* ================= Section frame ================= */
.section{
  padding:clamp(64px,10vw,128px) 0;
  border-bottom:1px solid var(--ink-edge);
}
.section:last-of-type{border-bottom:none}
.sec-head{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,40px);
  margin-bottom:clamp(36px,6vw,72px);
}
@media(min-width:860px){
  .sec-head{grid-template-columns:200px 1fr;align-items:baseline}
}
.sec-label{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--paper-faint);
  padding-top:6px;
}
.sec-label .dot{color:var(--bronze)}
.sec-label .dot-sage{color:var(--sage)}
.sec-label .dot-oxblood{color:var(--oxblood)}
.sec-title{
  font-size:clamp(30px,4.2vw,52px);
  font-weight:350;
  font-variation-settings:"opsz" 100,"SOFT" 30;
  max-width:20ch;
  letter-spacing:-0.022em;
}

/* ================= Trinity ================= */
.trinity{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border-top:1px solid var(--ink-edge);
}
.pillar{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  padding:clamp(34px,5vw,52px) 0;
  border-bottom:1px solid var(--ink-edge);
  position:relative;
  transition:background 320ms ease;
}
@media(min-width:860px){
  .pillar{
    grid-template-columns:120px 1fr 1.15fr;
    gap:clamp(32px,5vw,64px);
    align-items:baseline;
  }
}
.pillar:hover{background:linear-gradient(90deg,transparent,rgba(200,169,106,0.035))}
.pillar.sage:hover{background:linear-gradient(90deg,transparent,rgba(122,146,119,0.04))}
.pillar.oxblood:hover{background:linear-gradient(90deg,transparent,rgba(154,66,71,0.04))}
.pillar-num{
  font-family:var(--display);
  font-weight:300;
  font-size:clamp(44px,5vw,64px);
  font-variation-settings:"opsz" 144,"SOFT" 0;
  color:var(--bronze);
  line-height:1;
  letter-spacing:-0.02em;
}
.pillar.sage .pillar-num{color:var(--sage)}
.pillar.oxblood .pillar-num{color:var(--oxblood)}
.pillar-name{
  font-family:var(--display);
  font-size:clamp(24px,2.6vw,32px);
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 30;
  letter-spacing:-0.018em;
  line-height:1.15;
}
.pillar-name .tagline{
  display:block;
  margin-top:12px;
  font-family:var(--mono);
  font-size:11px;
  font-weight:400;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--paper-faint);
}
.pillar-body{
  font-size:15.5px;
  line-height:1.7;
  color:var(--paper-mute);
  max-width:58ch;
}

/* ================= Capability + KOS card ================= */
.cap{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(24px,4vw,48px);
}
@media(min-width:860px){
  .cap{grid-template-columns:1.1fr 1fr}
  .cap-reverse{grid-template-columns:1fr 1.1fr}
}
@media(max-width:860px){
  .cap-reverse .kos-card{order:2}
  .cap-reverse .cap-copy{order:1}
}
.cap+.cap{margin-top:clamp(48px,7vw,80px)}
.cap-copy p+p{margin-top:1.1em;color:var(--paper-mute);max-width:52ch}
.cap-copy p:first-child{
  font-family:var(--display);
  font-size:clamp(21px,2.2vw,28px);
  line-height:1.35;
  font-weight:350;
  font-variation-settings:"opsz" 100,"SOFT" 40;
  color:var(--paper);
  letter-spacing:-0.012em;
  max-width:26ch;
}
.kos-card{
  border:1px solid var(--ink-edge);
  padding:clamp(24px,3.5vw,36px);
  display:flex;flex-direction:column;gap:20px;
  background:linear-gradient(180deg,rgba(255,255,255,0.015),transparent);
}
.kos-head{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-bottom:16px;border-bottom:1px solid var(--ink-edge);
}
.kos-head .name{
  font-family:var(--display);font-size:22px;font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 20;
}
.kos-head .rev{color:var(--paper-faint)}
.kos-head .rev .flag{color:var(--bronze)}
.kos-desc{color:var(--paper-mute);font-size:14.5px;line-height:1.65}
.kos-specs{
  display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;
  padding-top:12px;border-top:1px solid var(--ink-edge);
}
.kos-spec{display:flex;flex-direction:column;gap:4px}
.kos-spec .k{color:var(--paper-faint);font-size:10px}
.kos-spec .v{font-family:var(--mono);font-size:12px;color:var(--paper);letter-spacing:0.03em}
.kos-card-link{
  text-decoration:none;color:inherit;
  border-bottom:1px solid var(--ink-edge);
  transition:border-color 280ms ease,background 280ms ease;
}
.kos-card-link:hover{
  border-color:var(--bronze);
  background:linear-gradient(180deg,rgba(200,169,106,0.04),transparent);
}
.kos-card-link .kos-head .name{transition:color 280ms ease}
.kos-card-link:hover .kos-head .name{color:var(--bronze)}

/* Practice areas table */
.practice-list{
  margin-top:clamp(48px,7vw,80px);
  border-top:1px solid var(--ink-edge);
}
.practice-head{
  padding:18px 0;
  color:var(--paper-faint);
  border-bottom:1px solid var(--ink-edge);
  letter-spacing:0.16em;
}
.practice{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:clamp(22px,3.2vw,30px) 0;
  border-bottom:1px solid var(--ink-edge);
  transition:background 280ms ease;
}
.practice:hover{background:linear-gradient(90deg,transparent,rgba(200,169,106,0.028))}
@media(min-width:860px){
  .practice{
    grid-template-columns:280px 1fr 160px;
    gap:clamp(24px,4vw,48px);
    align-items:baseline;
  }
}
.practice-name{
  font-family:var(--display);
  font-size:20px;
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 20;
  letter-spacing:-0.012em;
  color:var(--paper);
}
.practice-desc{
  color:var(--paper-mute);
  font-size:14.5px;
  line-height:1.7;
  max-width:62ch;
}
.status{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--paper-mute);
}
.status::before{
  content:"";width:6px;height:6px;background:var(--bronze);
  display:inline-block;
}
.status.active::before{background:var(--sage)}
.status.active{color:var(--sage)}
.status.active-research::before{background:var(--bronze)}
.status.active-research{color:var(--bronze)}
.status.roadmap::before{background:var(--oxblood)}
.status.roadmap{color:var(--oxblood)}
@media(min-width:860px){
  .status-cell{text-align:right;justify-self:end}
}

/* ================= Engage CTAs ================= */
.engage{
  display:grid;grid-template-columns:1fr;gap:0;
  border-top:1px solid var(--ink-edge);
}
@media(min-width:860px){.engage{grid-template-columns:1fr 1fr 1fr}}
.cta{
  padding:clamp(32px,5vw,52px) clamp(24px,3.5vw,40px);
  border-bottom:1px solid var(--ink-edge);
  display:flex;flex-direction:column;gap:14px;
  transition:background 280ms ease;
  cursor:pointer;
  position:relative;
}
@media(min-width:860px){
  .cta+.cta{border-left:1px solid var(--ink-edge)}
}
.cta:hover{background:rgba(200,169,106,0.028)}
.cta:hover .cta-arrow{transform:translateX(6px);color:var(--bronze)}
.cta-label{color:var(--paper-faint)}
.cta-title{
  font-family:var(--display);font-size:clamp(22px,2.6vw,30px);
  font-weight:400;font-variation-settings:"opsz" 100,"SOFT" 30;
  letter-spacing:-0.015em;line-height:1.2;
}
.cta-desc{color:var(--paper-mute);max-width:44ch;font-size:14.5px}
.cta-arrow{
  align-self:flex-start;
  margin-top:8px;
  font-family:var(--mono);font-size:14px;
  color:var(--paper-mute);
  transition:transform 320ms ease,color 320ms ease;
}

/* ================= Capabilities page (briefs) ================= */
.caps{padding:clamp(80px,12vw,160px) 0}
.caps-head{
  display:grid;gap:32px;
  margin-bottom:clamp(72px,10vw,120px);
  padding-bottom:clamp(40px,6vw,64px);
  border-bottom:1px solid var(--ink-edge);
  max-width:860px;
}
.caps-head .mono-tag{color:var(--paper-faint)}
.caps-head h1{
  font-size:clamp(42px,6.4vw,78px);
  font-weight:300;
  font-variation-settings:"opsz" 144,"SOFT" 30;
  letter-spacing:-0.025em;
  line-height:1.05;
  max-width:18ch;
}
.caps-head p{
  color:var(--paper-mute);
  max-width:60ch;
  font-size:17.5px;line-height:1.75;
}

.brief{
  display:grid;grid-template-columns:1fr;
  gap:clamp(28px,4vw,40px);
  padding:clamp(56px,8vw,96px) 0;
  border-bottom:1px solid var(--ink-edge);
}
.brief:first-of-type{padding-top:0}
@media(min-width:900px){
  .brief{grid-template-columns:300px 1fr;gap:clamp(56px,7vw,96px)}
}
.brief-meta{
  display:flex;flex-direction:column;gap:12px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
}
.brief-class{
  color:var(--bronze);
  padding-bottom:12px;
  border-bottom:1px solid var(--ink-edge);
  font-size:11.5px;
  letter-spacing:0.16em;
}
.brief-class.sage{color:var(--sage)}
.brief-class.oxblood{color:var(--oxblood)}
.brief-num{color:var(--paper-faint)}
.brief-date{color:var(--paper-faint)}

.brief-diagram-wrap{
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--ink-edge);
  display:flex;flex-direction:column;gap:14px;
  align-items:flex-start;
}
.brief-diagram{
  width:100%;
  max-width:300px;
  height:auto;
  color:var(--bronze);
  opacity:0.82;
}
.brief.sage .brief-diagram{color:var(--sage)}
.brief.oxblood .brief-diagram{color:var(--oxblood)}
.brief-caption{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--paper-faint);
  line-height:1.45;
}

.brief-body{max-width:64ch}
.brief-title{
  font-size:clamp(30px,3.4vw,42px);
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 25;
  letter-spacing:-0.02em;
  line-height:1.1;
  margin-bottom:28px;
  color:var(--paper);
}
.brief-body p{
  font-size:17px;line-height:1.8;
  color:var(--paper);
  margin-bottom:1.35em;
}
.brief-body p+p{color:var(--paper-mute)}
.brief-body .pullquote{
  font-family:var(--display);
  font-size:clamp(21px,2.1vw,25px);
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 40;
  line-height:1.45;
  color:var(--paper);
  padding:22px 0 22px 26px;
  margin:32px 0;
  border-left:2px solid var(--bronze);
  max-width:48ch;
  letter-spacing:-0.008em;
}
.brief.sage .pullquote{border-left-color:var(--sage)}
.brief.oxblood .pullquote{border-left-color:var(--oxblood)}

.caps-foot{
  margin-top:clamp(64px,9vw,104px);
  padding-top:clamp(36px,5vw,56px);
  border-top:1px solid var(--ink-edge);
  display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:baseline;
}
.caps-foot p{color:var(--paper-mute);max-width:46ch;font-size:15.5px;line-height:1.7}

/* ================= Thesis (document) ================= */
.doc{padding:clamp(56px,10vw,120px) 0}
.doc-head{
  display:grid;gap:clamp(28px,4vw,44px);
  margin-bottom:clamp(48px,7vw,96px);
  padding-bottom:clamp(32px,5vw,56px);
  border-bottom:1px solid var(--ink-edge);
}
.doc-meta{display:flex;flex-wrap:wrap;gap:28px}
.doc-meta .pair{display:flex;flex-direction:column;gap:4px}
.doc-meta .k{font-family:var(--mono);font-size:10px;letter-spacing:0.15em;text-transform:uppercase;color:var(--paper-faint)}
.doc-meta .v{font-family:var(--mono);font-size:12px;color:var(--paper-mute);letter-spacing:0.04em}
.doc-head h1{
  font-size:clamp(40px,6.4vw,80px);
  font-weight:300;
  font-variation-settings:"opsz" 144,"SOFT" 30;
  letter-spacing:-0.028em;
  max-width:18ch;
}
.doc-kicker{
  font-family:var(--mono);font-size:11px;
  letter-spacing:0.16em;text-transform:uppercase;
  color:var(--bronze);
}

.doc-body{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(40px,6vw,72px);
}
@media(min-width:980px){
  .doc-body{grid-template-columns:200px 1fr;gap:clamp(56px,7vw,88px)}
}
.toc{
  position:sticky;top:96px;
  align-self:start;
  display:flex;flex-direction:column;gap:10px;
  font-family:var(--mono);
  font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
}
.toc a{color:var(--paper-faint);padding:4px 0;border-bottom:1px solid transparent}
.toc a:hover{color:var(--paper)}
.toc-label{color:var(--paper-faint);margin-bottom:4px}

.doc-article h2{
  font-size:clamp(22px,2.4vw,28px);
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 20;
  letter-spacing:-0.012em;
  margin-top:clamp(48px,6vw,72px);
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--ink-edge);
  display:flex;align-items:baseline;gap:14px;
}
.doc-article h2:first-child{margin-top:0}
.doc-article h2::before{
  content:attr(data-num);
  font-family:var(--mono);font-size:11px;
  letter-spacing:0.14em;color:var(--bronze);
  font-weight:400;
}
.doc-article h3{
  font-size:17px;
  font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 30;
  margin-top:28px;margin-bottom:14px;
  color:var(--paper);
}
.doc-article p{
  font-size:15.5px;line-height:1.75;
  color:var(--paper);
  margin-bottom:1.15em;
  max-width:66ch;
}
.doc-article p+p{color:var(--paper-mute)}
.doc-article p.lead{
  font-family:var(--display);
  font-size:clamp(19px,1.9vw,22px);
  font-weight:350;
  font-variation-settings:"opsz" 100,"SOFT" 40;
  line-height:1.45;
  color:var(--paper);
  letter-spacing:-0.008em;
  margin-bottom:1.35em;
}
.doc-article ul{
  list-style:none;padding:0;margin:0 0 1.4em 0;
  display:flex;flex-direction:column;gap:12px;
  max-width:66ch;
}
.doc-article li{
  font-size:15px;line-height:1.7;
  color:var(--paper-mute);
  padding-left:22px;position:relative;
}
.doc-article li::before{
  content:"\00b7";
  position:absolute;left:4px;top:0;
  color:var(--bronze);
  font-family:var(--mono);
  font-size:20px;
  line-height:1;
}
.doc-article li strong{
  color:var(--paper);font-weight:500;
  font-family:var(--display);
  font-size:16px;
  font-variation-settings:"opsz" 100,"SOFT" 20;
}
.doc-article .pillar-inline{
  display:block;
  margin:8px 0 12px;
  padding-left:0;
}
.doc-article .pillar-inline strong{display:block;margin-bottom:4px}
.doc-article .pillar-inline::before{display:none}

.doc-closer{
  margin-top:clamp(56px,8vw,96px);
  padding-top:clamp(32px,5vw,48px);
  border-top:1px solid var(--ink-edge);
  display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:baseline;
}
.doc-closer p{color:var(--paper-mute);max-width:40ch}

/* ================= Inquiry ================= */
.inq{padding:clamp(72px,10vw,128px) 0 clamp(96px,12vw,160px)}
.inq-head{
  display:grid;gap:24px;
  margin-bottom:clamp(48px,7vw,80px);
  max-width:720px;
}
.inq-head h1{
  font-size:clamp(36px,5.5vw,64px);
  font-weight:300;
  font-variation-settings:"opsz" 144,"SOFT" 30;
  letter-spacing:-0.025em;
  line-height:1.05;
  max-width:16ch;
}
.inq-head p{
  color:var(--paper-mute);
  max-width:54ch;
  font-size:16.5px;line-height:1.7;
}

.inq-form{
  display:grid;grid-template-columns:1fr;
  gap:clamp(28px,3.5vw,40px);
  max-width:720px;
  padding-top:clamp(24px,3vw,32px);
  border-top:1px solid var(--ink-edge);
}
.field{
  display:grid;gap:10px;
  border-bottom:1px solid var(--ink-edge);
  padding-bottom:clamp(20px,3vw,28px);
}
.field-row{
  display:grid;grid-template-columns:1fr;
  gap:clamp(20px,2.5vw,28px);
}
@media(min-width:700px){
  .field-row{grid-template-columns:1fr 1fr;gap:clamp(28px,3.5vw,40px)}
  .field-row .field{margin:0}
}
.field label{
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--mono);font-size:10px;
  letter-spacing:0.16em;text-transform:uppercase;
  color:var(--paper-faint);
}
.field label .req{color:var(--bronze)}
.field input,.field textarea,.field select{
  background:transparent;border:none;
  border-bottom:1px solid var(--ink-line);
  color:var(--paper);
  font-family:var(--body);
  font-size:17px;font-weight:300;
  padding:8px 0 12px;
  outline:none;
  transition:border-color 220ms ease;
  width:100%;resize:none;
  letter-spacing:0.005em;
}
.field textarea{min-height:120px;line-height:1.6}
.field select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%239a978d' stroke-width='1.2' fill='none'/></svg>");
  background-repeat:no-repeat;background-position:right 4px center;
  padding-right:24px;cursor:pointer;
}
.field select option{background:var(--ink-deep);color:var(--paper)}
.field input:focus,.field textarea:focus,.field select:focus{border-bottom-color:var(--bronze)}
.field input::placeholder,.field textarea::placeholder{color:var(--paper-faint);font-weight:300}

.submit-row{
  display:flex;justify-content:space-between;align-items:center;
  gap:20px;flex-wrap:wrap;
  padding-top:clamp(8px,2vw,16px);
}
.submit-note{
  font-family:var(--mono);font-size:10.5px;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--paper-faint);
}
.btn{
  font-family:var(--mono);font-size:12px;
  letter-spacing:0.18em;text-transform:uppercase;
  padding:16px 28px;
  background:var(--paper);color:var(--ink-void);
  border:none;cursor:pointer;
  transition:background 220ms ease,color 220ms ease,transform 220ms ease;
  font-weight:500;
  text-decoration:none;
  display:inline-block;
}
.btn:hover{background:var(--bronze)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:0.5;cursor:not-allowed;background:var(--paper-mute)}
.btn.secondary{
  background:transparent;color:var(--paper);
  border:1px solid var(--ink-line);
}
.btn.secondary:hover{border-color:var(--bronze);color:var(--bronze);background:transparent}

.form-error{
  display:none;
  color:var(--oxblood);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  margin-top:8px;
  padding:14px 18px;
  border:1px solid var(--oxblood-dim);
  background:rgba(154,66,71,0.06);
}
.form-error.show{display:block;animation:fade 360ms ease both}
@keyframes fade{from{opacity:0}to{opacity:1}}

.form-success{
  display:none;
  padding:clamp(28px,4vw,40px);
  border:1px solid var(--ink-edge);
  background:rgba(200,169,106,0.03);
  max-width:720px;margin-top:24px;
  flex-direction:column;gap:12px;
}
.form-success.show{display:flex;animation:fade 500ms ease both}
.form-success .tag{color:var(--bronze)}
.form-success h3{
  font-family:var(--display);font-size:22px;font-weight:400;
  font-variation-settings:"opsz" 100,"SOFT" 30;
  color:var(--paper);
}
.form-success p{color:var(--paper-mute);font-size:15px;line-height:1.65;max-width:56ch}

/* ================= Footer ================= */
.foot{
  border-top:1px solid var(--ink-edge);
  padding:clamp(32px,4vw,48px) 0;
  margin-top:clamp(48px,6vw,80px);
}
.foot-inner{
  display:grid;grid-template-columns:1fr;gap:20px;
  font-family:var(--mono);font-size:10.5px;
  letter-spacing:0.14em;text-transform:uppercase;
  color:var(--paper-faint);
}
@media(min-width:820px){.foot-inner{grid-template-columns:1fr auto 1fr;align-items:center}}
.foot-mark{
  color:var(--paper-mute);
  display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.foot-mark .foot-dot{color:var(--paper-faint);margin:0 2px}
.foot-3{fill:var(--bronze);flex-shrink:0;transform:translateY(1px)}
.foot-class{justify-self:center;text-align:center}
.foot-nav{justify-self:end;display:flex;gap:20px;flex-wrap:wrap}
.foot-nav a{color:var(--paper-faint)}
.foot-nav a:hover{color:var(--paper);border-bottom-color:var(--bronze)}

/* Mobile */
@media(max-width:640px){
  .nav{gap:14px;font-size:10px}
  .pillar-num{font-size:38px}
  .hero-meta{gap:14px}
  .hero-meta span{font-size:10px}
}