/* Starting design tokens for Option 3. Validate contrast and layout in the build. */
:root {
  --color-charcoal: #181b1e;
  --color-slate: #292e33;
  --color-ivory: #f1eee7;
  --color-champagne: #d6b98c;
  --color-text-muted-dark: #c4c8ca;
  --color-text-muted-light: #4c5358;
  --font-heading: "Libre Baskerville", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --content-max: 70rem;
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --radius-control: .2rem;
  --control-height: 3rem;
}
/* These are reference values, not a complete stylesheet.
   Use a contrasting focus ring for each background.
   Do not place ivory text on champagne.
   Apply grayscale in CSS to the original portrait, preserving the source. */


@font-face{font-family:Inter;src:url('/fonts/inter-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Libre Baskerville';src:url('/fonts/libre-baskerville-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
*{box-sizing:border-box}
html{scroll-padding-top:24px}
body{margin:0;background:var(--color-charcoal);color:var(--color-ivory);font-family:var(--font-body);font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:5px;text-decoration-thickness:1px}
button,input,textarea{font:inherit}
button,a,input,textarea{touch-action:manipulation}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--color-champagne);outline-offset:5px}
.light :focus-visible{outline-color:#705022}
.container{width:min(calc(100% - 96px),var(--content-max));margin-inline:auto}
.skip-link{position:absolute;top:12px;left:16px;z-index:10;padding:12px 20px;background:var(--color-champagne);color:var(--color-charcoal);transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
.site-header{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:32px;padding-block:27px;border-bottom:1px solid #d6b98c30}
.wordmark{font-family:var(--font-heading);font-size:21px;line-height:1.5;text-decoration:none;min-height:44px;display:flex;align-items:center}
nav{display:flex;gap:36px}
nav a{font-size:14px;display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
nav a:hover{text-decoration:underline}
.hero{position:relative;min-height:550px;display:grid;grid-template-columns:56% 44%;align-items:center}
.hero-copy{position:relative;z-index:1;padding-block:80px 90px}
h1,h2,h3{font-family:var(--font-heading);font-weight:400;line-height:1.25;margin:0;text-wrap:balance}
h1{font-size:clamp(46px,5.1vw,72px);letter-spacing:-.065em;white-space:nowrap}
.descriptor{margin:19px 0 32px;font-size:22px;letter-spacing:.2em;line-height:1.5}
.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;min-height:50px;padding:12px 25px;background:var(--color-champagne);color:var(--color-charcoal);border:1px solid transparent;border-radius:var(--radius-control);font-size:15px;font-weight:600;line-height:1.5;text-decoration:none}
.button:hover{background:#e3cba7}
.arrow{font-size:23px;font-weight:400;line-height:1}
.portrait{position:absolute;right:-24px;top:0;bottom:0;width:51%;margin:0;isolation:isolate;overflow:hidden}
.portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:59% center;filter:grayscale(1) brightness(.83);mask-image:linear-gradient(90deg,transparent 0%,#000 19%,#000 94%,transparent 100%)}
.portrait::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,var(--color-charcoal),transparent 7%,transparent 96%,#181b1e40)}
.about{border-top:1px solid #d6b98c66;padding-block:48px 51px}
h2{font-size:32px;letter-spacing:-.035em}
.about p{max-width:64ch;margin:20px 0 0;color:var(--color-text-muted-dark);line-height:1.85}
.recognition{padding-block:43px 64px;border-top:1px solid #d6b98c66}
.recognition-list{list-style:none;padding:0;margin:32px 0 0;display:grid;grid-template-columns:repeat(4,1fr)}
.recognition-list li{padding:0 25px;border-left:1px solid #f1eee730}
.recognition-list li:first-child{border:0;padding-left:0}
.recognition-list li:last-child{padding-right:0}
.recognition-list h3{font-size:20px;line-height:1.5;letter-spacing:-.03em;text-wrap:initial}
.recognition-list p{font-size:13px;line-height:1.7;color:var(--color-text-muted-dark);margin:9px 0 0}
.placement{display:block;color:var(--color-champagne)}
.light{background:var(--color-ivory);color:var(--color-charcoal)}
.contact{padding-block:65px 0}
.contact-intro{max-width:61ch;margin:19px 0 27px;color:var(--color-text-muted-light)}
.contact h2{font-size:36px}
.form-wrap{max-width:880px}
.form-note{font-size:13px;color:var(--color-text-muted-light);margin:0 0 20px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:23px 28px}
.field{min-width:0}
.field-wide{grid-column:1/-1}
label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.required{font-weight:400}
input,textarea{display:block;width:100%;border:1px solid #8c8d88;border-radius:2px;background:#ffffff55;color:var(--color-charcoal);padding:12px 14px;font-size:17px;line-height:1.5}
input{min-height:50px}
textarea{min-height:170px;resize:vertical}
input:focus,textarea:focus{border-color:#705022}
[aria-invalid=true]{border:2px solid #9a2c27}
.field-error{color:#9a2c27;font-size:14px;line-height:1.5;margin:6px 0 0}
.field-error:empty{display:none}
.verification{margin-block:24px 16px;min-height:0}
.form-environment{font-size:14px;line-height:1.6;padding:12px 16px;border-left:3px solid #89704b;background:#e7dfd2;margin:24px 0}
.form-environment[hidden]{display:none}
.submit{background:var(--color-charcoal);color:var(--color-ivory);min-width:190px}
.submit:hover{background:var(--color-slate)}
.submit:disabled{cursor:wait;opacity:.65}
.privacy-helper{font-size:13px;line-height:1.7;color:var(--color-text-muted-light);margin:17px 0 0}
.feedback{font-size:16px;line-height:1.65;border-radius:2px;margin-top:22px;scroll-margin:30px}
.feedback:empty{display:none}
.feedback[data-state=error]{padding:15px 18px;color:#7f201d;background:#f9e9e5;border:1px solid #a94c43}
.feedback[data-state=success]{padding:15px 18px;color:#28533c;background:#e5ede5;border:1px solid #5f876d}
.feedback[data-state=mock]{padding:15px 18px;color:#5f4824;background:#e7dfd2;border:1px solid #89704b}
.site-footer{margin-top:50px;border-top:1px solid #181b1e40;display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:15px 20px;font-size:12px;color:var(--color-text-muted-light)}
.site-footer p{margin:0}
.site-footer a{display:inline-flex;align-items:center;min-height:44px}
.prose{padding-block:64px 80px;min-height:65vh;max-width:760px}
.prose h1{white-space:normal;font-size:48px;letter-spacing:-.04em}
.prose h2{font-size:25px;margin-top:40px}
.prose p{color:var(--color-text-muted-dark)}
.prose .back{display:inline-block;margin-bottom:35px;font-size:14px}
.prose li{margin-bottom:8px}
.dark-footer{border-color:#f1eee740;color:var(--color-text-muted-dark);margin-top:0}
@media(min-width:1400px){.hero{min-height:570px}.hero-copy{padding-block:90px 110px}}
@media(max-width:1050px){.container{width:calc(100% - 64px)}h1{font-size:clamp(40px,5vw,56px)}.hero{min-height:480px}.portrait{right:-12px;width:51%}.recognition-list li{padding-inline:17px}.recognition-list h3{font-size:18px}.recognition-list p{font-size:12px}}
@media(max-width:800px){.container{width:calc(100% - 48px)}.site-header{padding-block:15px;gap:16px}.wordmark{font-size:19px}nav{gap:22px}.hero{min-height:430px}.hero-copy{padding-block:65px}.descriptor{font-size:18px}.recognition-list{grid-template-columns:1fr 1fr;row-gap:28px}.recognition-list li:nth-child(3){border-left:0;padding-left:0}.recognition-list h3{font-size:20px}.recognition-list p{font-size:13px}.about{padding-block:40px}.contact{padding-top:48px}}
@media(max-width:650px){body{font-size:17px}.container{width:calc(100% - 40px)}.site-header{padding-block:12px}.wordmark{font-size:18px}nav a:not(:last-child){display:none}nav a{font-size:13px}.hero{display:flex;min-height:0;flex-direction:column;align-items:stretch}.portrait{position:relative;inset:auto;align-self:center;width:calc(100% + 40px);height:clamp(260px,78vw,330px);order:0}.portrait img{object-position:59% center;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 94%,transparent)}.portrait::after{background:linear-gradient(0deg,var(--color-charcoal),transparent 5%,transparent 98%,#181b1e30)}.hero-copy{order:1;padding:25px 0 40px}.hero h1{font-size:clamp(34px,9.9vw,46px);letter-spacing:-.065em;white-space:normal;text-wrap:initial}.descriptor{font-size:17px;margin:14px 0 23px}.button{min-height:48px;padding-inline:22px}.about{padding-block:36px 39px}h2{font-size:27px}.about p{line-height:1.8;margin-top:17px}.recognition{padding-block:35px 39px}.recognition-list{display:block;margin-top:25px}.recognition-list li,.recognition-list li:first-child,.recognition-list li:nth-child(3){padding:19px 0;border:0;border-top:1px solid #f1eee730}.recognition-list li:first-child{padding-top:0;border:0}.recognition-list li:last-child{padding-bottom:0}.recognition-list h3{font-size:20px}.recognition-list p{margin-top:6px}.placement{display:inline}.placement::before{content:' · '}.contact{padding-top:40px}.contact h2{font-size:30px}.contact-intro{margin-top:17px}.fields{grid-template-columns:1fr;gap:21px}.field-wide{grid-column:auto}.form-note{margin-bottom:22px}input,textarea{font-size:16px}.site-footer{margin-top:36px;font-size:11px;gap:12px}.prose{padding-block:40px 50px}.prose h1{font-size:38px}.prose h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}