:root {
    --th-bg: #14110f;
    --th-panel: #1e1916;
    --th-text: #f3ebe2;
    --th-muted: #b7a99a;
    --th-accent: #d4a373;
    --th-line: rgba(243, 235, 226, 0.12);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body.th {
    font-family: "Instrument Sans", system-ui, sans-serif;
    background: var(--th-bg);
    color: var(--th-text);
    line-height: 1.55;
}
a { color: inherit; }
.th-skip {
    position: absolute; left: 12px; top: 12px; z-index: 100;
    padding: 8px 14px; background: var(--th-accent); color: #1a120c;
    text-decoration: none; border-radius: 8px; font-weight: 700;
    transform: translateY(-160%);
}
.th-skip:focus { transform: none; }
.th-banner {
    text-align: center; padding: 10px 16px; font-size: 0.82rem;
    background: #0c0a09; border-bottom: 1px solid var(--th-line);
}
.th-banner a { text-decoration: none; color: var(--th-muted); }
.th-wrap { width: min(1100px, calc(100% - 40px)); margin: 0 auto; }

.th-bar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px 22px; border-bottom: 1px solid var(--th-line);
}
.th-logo {
    font-family: Newsreader, Georgia, serif;
    font-size: 1.5rem; font-weight: 700; text-decoration: none;
}
.th-bar nav { display: flex; gap: 18px; font-size: 0.92rem; }
.th-bar nav a { text-decoration: none; color: var(--th-muted); }
.th-bar nav a:hover { color: var(--th-text); }

.th-hero {
    display: grid; min-height: min(88vh, 820px);
}
@media (min-width: 900px) {
    .th-hero { grid-template-columns: 1.05fr 0.95fr; }
}
.th-hero__panel {
    padding: clamp(40px, 8vw, 88px) clamp(22px, 5vw, 64px);
    display: flex; flex-direction: column; justify-content: center;
}
.th-eyebrow {
    font-size: 0.78rem; font-weight: 600; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--th-accent); margin-bottom: 16px;
}
.th-hero h1 {
    font-family: Newsreader, Georgia, serif;
    font-size: clamp(2.8rem, 7vw, 4.8rem); font-weight: 600;
    line-height: 1.02; letter-spacing: -0.02em; max-width: 12ch;
}
.th-lede {
    margin: 22px 0 32px; max-width: 38ch;
    color: var(--th-muted); font-size: 1.08rem;
}
.th-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: fit-content; padding: 14px 22px; border: 0; border-radius: 10px;
    background: var(--th-accent); color: #1a120c;
    font: inherit; font-weight: 700; text-decoration: none; cursor: pointer;
}
.th-hero__visual {
    position: relative; min-height: 320px;
    background: linear-gradient(145deg, #2a211c, #3a2c22 45%, #1a1512);
    display: grid; place-items: end start; padding: 28px;
    overflow: hidden;
}
.th-grain {
    position: absolute; inset: 12% 14%;
    border-radius: 18px;
    background:
        repeating-linear-gradient(90deg, rgba(212,163,115,0.08) 0 2px, transparent 2px 11px),
        linear-gradient(180deg, #5a4333, #2f231c);
    box-shadow: inset 0 0 0 1px rgba(243,235,226,0.08), 0 30px 60px rgba(0,0,0,0.35);
}
.th-hero__visual p {
    position: relative; z-index: 1;
    font-size: 0.85rem; letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--th-muted);
}

.th-work { padding: 88px 0; border-top: 1px solid var(--th-line); }
.th-work h2, .th-about h2, .th-contact h2 {
    font-family: Newsreader, Georgia, serif;
    font-size: clamp(2rem, 4.5vw, 3rem); font-weight: 600;
    margin-bottom: 32px; line-height: 1.1;
}
.th-cards {
    display: grid; gap: 18px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.th-cards article {
    background: var(--th-panel); border: 1px solid var(--th-line);
    border-radius: 18px; overflow: hidden;
}
.th-swatch { height: 140px; }
.th-swatch--oak { background: linear-gradient(135deg, #8b5e3c, #c08a5a 50%, #6e452c); }
.th-swatch--ash { background: linear-gradient(135deg, #a89a86, #d8cbb8 45%, #7d7264); }
.th-swatch--walnut { background: linear-gradient(135deg, #3b2418, #6b3f28 55%, #24150f); }
.th-cards h3 { padding: 18px 18px 6px; font-size: 1.15rem; }
.th-cards p { padding: 0 18px 20px; color: var(--th-muted); font-size: 0.95rem; }

.th-about { padding: 0 0 88px; }
.th-about__grid {
    display: grid; gap: 32px; padding: 36px; border-radius: 22px;
    background: var(--th-panel); border: 1px solid var(--th-line);
}
@media (min-width: 820px) { .th-about__grid { grid-template-columns: 1.2fr 0.8fr; align-items: center; } }
.th-about p { color: var(--th-muted); max-width: 42ch; margin-top: -12px; }
.th-about ul { list-style: none; display: grid; gap: 12px; }
.th-about li {
    padding: 12px 14px; border-radius: 12px;
    background: rgba(212, 163, 115, 0.08);
    border: 1px solid rgba(212, 163, 115, 0.18);
    font-weight: 600;
}

.th-contact { padding: 0 0 96px; }
.th-form {
    display: grid; gap: 14px; max-width: 640px;
    padding: 28px; border-radius: 18px;
    background: var(--th-panel); border: 1px solid var(--th-line);
}
.th-form__row { display: grid; gap: 14px; }
@media (min-width: 640px) { .th-form__row { grid-template-columns: 1fr 1fr; } }
.th-form label { display: grid; gap: 6px; font-size: 0.88rem; font-weight: 600; }
.th-form input, .th-form textarea {
    padding: 12px 14px; border-radius: 10px; border: 1px solid var(--th-line);
    background: #151210; color: var(--th-text); font: inherit;
}
.th-form__ok { color: var(--th-accent); }
.th-contact__note { margin-top: 18px; color: var(--th-muted); font-size: 0.95rem; }
.th-contact__note a { color: var(--th-accent); }

.th-foot {
    padding: 28px 22px; text-align: center; font-size: 0.88rem;
    color: var(--th-muted); border-top: 1px solid var(--th-line);
}
.th-foot a { color: var(--th-text); }
