
:root{--bg:#292728;--card:#322f2c;--card2:#3b3732;--line:#4b453d;--bone:#e3dbc9;--dim:#9b9387;
--copper:#9e6245;--copper-bright:#c98e63;--brass:#c4a047;--leather:#723a19;--ink-on-copper:#f5f0e4;--header:rgba(41,39,40,.92);
--display:'American Typewriter','Courier Prime','Courier New',Georgia,serif;--q-ink:#723a19;--q-author:#6d5436;
--fb:Avenir,'Avenir Next','Segoe UI',system-ui,sans-serif;--ease:cubic-bezier(.22,.7,.2,1);}
[data-theme="light"]{--bg:#e3dbc9;--card:#efe9db;--card2:#e7dfcc;--line:#ccc2aa;--bone:#292728;--dim:#73695a;
--copper:#9e6245;--copper-bright:#84492c;--brass:#8a6a1f;--ink-on-copper:#f7f2e6;--header:rgba(227,219,201,.93);--q-ink:#c4a047;--q-author:#9b9387;}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--bone);font-family:var(--fb);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.display{font-family:var(--display)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px}
.vcard{transition:transform .2s var(--ease),border-color .2s,box-shadow .2s}
.vcard:hover{transform:translateY(-3px);border-color:var(--copper);box-shadow:0 10px 30px rgba(0,0,0,.28)}
.chip{display:inline-block;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;padding:.18rem .6rem;border-radius:999px;border:1px solid var(--line);color:var(--dim)}
.eyebrow{font-family:var(--display);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--copper-bright)}
.navbtn{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:.5rem 1.05rem;border-radius:999px;border:1px solid transparent;color:var(--dim);cursor:pointer;transition:all .15s;white-space:nowrap;display:inline-block}
.navbtn:hover{color:var(--bone);border-color:var(--line)}
.navbtn.active{background:var(--copper);color:var(--ink-on-copper);box-shadow:0 2px 14px rgba(158,98,69,.45)}
.btn{background:var(--copper);color:var(--ink-on-copper);font-weight:600;padding:.62rem 1.5rem;border-radius:10px;cursor:pointer;display:inline-block;transition:filter .15s;font-size:.9rem}
.btn:hover{filter:brightness(1.08)}
.ghost{border:1px solid var(--line);color:var(--bone);padding:.58rem 1.3rem;border-radius:10px;cursor:pointer;display:inline-block;transition:border-color .15s;font-size:.9rem}
.ghost:hover{border-color:var(--copper)}
header{position:sticky;top:0;z-index:30;backdrop-filter:blur(10px);background:var(--header);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:16px;padding:14px 0}
.brand img{height:38px;width:auto;display:block}
.links{display:flex;gap:6px;margin-left:auto;align-items:center}
@media(max-width:820px){.links .navbtn:not(.tt){display:none}}
.hero{position:relative;min-height:88vh;display:flex;align-items:center;justify-content:center;text-align:center}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,22,21,.55),rgba(30,28,26,.32) 45%,var(--bg))}
.hero .in{position:relative;padding:0 20px}
.hero .mk{width:min(280px,58vw);height:auto;margin:0 auto;filter:drop-shadow(0 10px 40px rgba(0,0,0,.5))}
.herowm{font-family:var(--fb);font-weight:300;letter-spacing:.36em;text-transform:uppercase;font-size:clamp(1.2rem,3vw,2rem);margin-top:1.4rem;padding-left:.36em}
.tagline{font-family:var(--display);font-size:.7rem;letter-spacing:.4em;text-transform:uppercase;color:var(--copper-bright);margin-top:.9rem}
.marq{overflow:hidden;white-space:nowrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card);padding:18px 0}
.marq .t{display:inline-block;animation:sc 42s linear infinite;font-family:var(--display);letter-spacing:.04em;font-size:.98rem}
.marq .t span{margin:0 16px;color:var(--copper-bright)}
@keyframes sc{from{transform:translateX(0)}to{transform:translateX(-50%)}}
section{padding:96px 0}
.sechead{text-align:center;margin-bottom:52px}
.sechead h2{font-family:var(--display);text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(1.8rem,4vw,2.6rem);margin-top:.4rem}
.pagehead{padding:170px 0 20px;text-align:center}
.pagehead h1{font-family:var(--display);text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(2.2rem,6vw,4rem)}
.grid3{display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.grid2{display:grid;gap:20px;grid-template-columns:1fr 1fr}
@media(max-width:820px){.grid3{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}}
.prose{max-width:64ch;margin:0 auto}
.prose p{font-size:1.05rem;line-height:1.85;margin-bottom:1.5rem}
.prose .lead{font-size:1.2rem}
.prose .accent{font-family:var(--display);text-transform:uppercase;font-weight:700;font-size:clamp(1.3rem,3vw,1.9rem);margin:.4rem 0 1.6rem;color:var(--bone)}
.photo{width:100%;object-fit:cover;display:block}
.feat{max-width:760px;margin:0 auto;border-top:1px solid var(--line);padding:44px 0}
.feat .sub{color:var(--copper-bright)}
.feat h3{font-family:var(--display);text-transform:uppercase;font-size:1.5rem;margin:.5rem 0 1rem}
.feat p{font-size:1rem;line-height:1.8;margin-bottom:1rem;color:var(--bone)}
.qcard{background:var(--bone);color:var(--q-ink);border-radius:18px;padding:56px 40px;text-align:center;max-width:760px;margin:0 auto}
.form{max-width:600px;margin:48px auto 0}
.form input,.form textarea{width:100%;background:var(--card2);border:1px solid var(--line);border-radius:8px;padding:.7rem .8rem;color:var(--bone);font-family:var(--fb);margin-bottom:14px;font-size:.95rem}
.form input:focus,.form textarea:focus{outline:1px solid var(--copper)}
.form textarea{min-height:120px;resize:vertical}
.form .r{display:flex;gap:14px}@media(max-width:600px){.form .r{flex-direction:column}}
footer{border-top:1px solid var(--line);text-align:center}
footer .in{padding:56px 0}
footer .fmk{height:44px;margin:0 auto;opacity:.95}
footer .fwm{font-family:var(--fb);font-weight:300;letter-spacing:.28em;text-transform:uppercase;font-size:.95rem;margin-top:.7rem}
footer .fsoc{margin-top:1rem;display:flex;gap:20px;justify-content:center;font-size:.9rem;color:var(--dim)}
footer .fsoc a:hover{color:var(--bone)}
