/* ============================================================
   BALDHEAD CABINET CO — an evening cabinetmaker shop.
   Dark walnut shop floor, sawdust-cream text, cardinal lacquer
   accents, bench-oak raised panels, kiln-dark recesses,
   chisel-steel frames, dovetail-tan paper tags, resin-green
   only on small level-bubble marks.
   ============================================================ */

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
    font-size: 16px;
    line-height: 1.65;
    overflow-x: hidden;
    background-color: #1C1712;
    color: #EFE7D8;
    font-family: Georgia, "Times New Roman", serif;
}

h1, h2, h3, h4, h5 {
    color: #EFE7D8;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    line-height: 1.2;
    font-weight: bold;
}

p { margin: 0 0 16px 0; }
a { color: #D2B98C; text-decoration: none; }
a:hover { text-decoration: underline; }

strong { color: #EFE7D8; }

.wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

section { padding: 0; }

/* ============================================================
   PLANE-RACK NAV (.planerack)
   ============================================================ */
.planerack {
    position: sticky;
    top: 0;
    z-index: 60;
    width: 100%;
    background-color: #2E251C;
    border-bottom: 4px solid #6B655C;
}

.planerack-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 8px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.planerack-brand { display: flex; align-items: center; gap: 10px; }

.planerack-plate {
    display: inline-block;
    background-color: #D2B98C;
    color: #120E0A;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 15px;
    padding: 7px 12px;
    text-decoration: none;
    box-shadow: 3px 3px 0 #B33A2E;
}

.planerack-dot {
    width: 12px;
    height: 12px;
    background-color: #B33A2E;
    border-radius: 50%;
    flex: 0 0 auto;
    box-shadow: 0 0 0 2px #120E0A;
}

.planerack-links { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

.planerack-tag {
    display: inline-block;
    background-color: #D2B98C;
    color: #120E0A;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 1px;
    padding: 8px 13px 6px 13px;
    text-decoration: none;
    border-radius: 4px 4px 9px 9px;
}

.planerack-tag.is-active { background-color: #B33A2E; color: #EFE7D8; }

.planerack-chip {
    display: inline-block;
    background-color: #B33A2E;
    color: #EFE7D8;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 1px;
    padding: 8px 13px 6px 13px;
    text-decoration: none;
    border-radius: 4px 4px 9px 9px;
}

.planerack-toggle {
    display: none;
    background-color: #D2B98C;
    color: #120E0A;
    border: none;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 15px;
    padding: 6px 14px;
    cursor: pointer;
    border-radius: 4px;
}

@media (max-width: 760px) {
    .planerack-toggle { display: block; }
    .planerack-links {
        display: none;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        padding-top: 6px;
    }
    .planerack-links.is-open { display: flex; }
    .planerack-tag, .planerack-chip { text-align: center; }
}

/* ============================================================
   DOVETAIL-BENCH HERO (.dovetailbench)
   ============================================================ */
.dovetailbench {
    background-color: #120E0A;
    border-bottom: 10px solid #2E251C;
}

.dovetailbench-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 64px 24px 26px 24px;
    padding: 64px 24px 26px 24px;
    text-align: center;
}

.hero-eyebrow {
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #D2B98C;
    font-size: 13px;
    margin: 0 0 18px 0;
}

.dovetailbench h1 {
    font-size: 54px;
    margin: 0 auto 18px auto;
    max-width: 900px;
}

.hero-lead {
    max-width: 780px;
    margin: 0 auto 28px auto;
    color: #EFE7D8;
    font-size: 18px;
}

.hero-ctas { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

.btn-cardinal {
    display: inline-block;
    background-color: #B33A2E;
    color: #EFE7D8;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 15px;
    padding: 13px 26px;
    text-decoration: none;
    box-shadow: 4px 4px 0 #6B655C;
}

.btn-steel {
    display: inline-block;
    background-color: transparent;
    color: #EFE7D8;
    border: 2px solid #6B655C;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 15px;
    padding: 11px 24px;
    text-decoration: none;
}

.btn-tan {
    display: inline-block;
    background-color: #D2B98C;
    color: #120E0A;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 15px;
    padding: 13px 26px;
    text-decoration: none;
    box-shadow: 4px 4px 0 #120E0A;
}

.hero-jig {
    max-width: 900px;
    margin: 34px auto 0 auto;
    background-color: #D2B98C;
    color: #120E0A;
    padding: 26px 26px 28px 26px;
    text-align: left;
    border-radius: 6px;
    box-shadow: 0 12px 0 #2E251C;
}

.hero-jig h3 {
    font-size: 24px;
    margin: 0 0 8px 0;
    color: #120E0A;
}

.hero-jig-sub {
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #6B655C;
    margin: 0 0 12px 0;
}

.hero-jig p { color: #2E251C; font-size: 15px; margin: 0 0 8px 0; }
.hero-jig a { color: #B33A2E; font-weight: bold; }

.dovetailbench-kick {
    background-color: #2E251C;
    border-top: 3px solid #6B655C;
}

.kick-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 18px 24px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}

.kick-stat { flex: 1 1 220px; text-align: center; }

.kick-num {
    display: block;
    font-size: 42px;
    font-family: "Trebuchet MS", sans-serif;
    color: #EFE7D8;
    font-weight: bold;
}

.kick-label {
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px;
    color: #D2B98C;
}

/* ============================================================
   LUMBER-RACK ROWS (.lumberrack)
   ============================================================ */
.lumberrack { background-color: #1C1712; overflow-x: hidden; }

.rack-head {
    max-width: 1180px;
    margin: 0 auto;
    padding: 56px 24px 6px 24px;
}

.rack-head h2 { font-size: 34px; margin: 0 0 8px 0; }
.rack-eyebrow {
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px;
    color: #6B655C;
    margin: 0 0 4px 0;
}
.rack-head p { color: #EFE7D8; max-width: 820px; }

.rack-list { margin-top: 18px; }

.rack-row {
    display: flex;
    align-items: center;
    gap: 26px;
    width: 100%;
    background-color: #2E251C;
    padding: 24px 24px;
    margin-bottom: 14px;
    border-left: 8px solid #6B655C;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
}

.rack-row:nth-child(2n) {
    background-color: #D2B98C;
    color: #120E0A;
    border-left-color: #B33A2E;
}
.rack-row:nth-child(2n) .rack-num,
.rack-row:nth-child(2n) .rack-body p { color: #120E0A; }

.rack-row:nth-child(3n) {
    background-color: #221B15;
    border-left-color: #6B655C;
}

.rack-num {
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 30px;
    color: #B33A2E;
    flex: 0 0 70px;
    text-align: center;
}

.rack-body { flex: 1 1 auto; }
.rack-body h3 { font-size: 22px; margin: 0 0 8px 0; color: #EFE7D8; }

.rack-row:nth-child(2n) .rack-body h3 { color: #120E0A; }
.rack-row:nth-child(3n) .rack-body h3 { color: #D2B98C; }

.rack-body p { margin: 0 0 10px 0; }
.rack-row:nth-child(2n) .rack-body p { color: #2E251C; }

.rack-read { font-family: "Courier New", Courier, monospace; font-size: 13px; font-weight: bold; }
.rack-row:nth-child(2n) .rack-read { color: #B33A2E; }

/* offset rows deeper into the rack */
.rack-offset { margin-top: 0; }
@media (min-width: 861px) {
    .rack-offset { margin-right: 44px; }
    .rack-offset.rack-row:nth-child(2n) { margin-left: 44px; margin-right: auto; }
}

.bubble {
    width: 12px;
    height: 12px;
    background-color: #6E7D52;
    border-radius: 50%;
    flex: 0 0 auto;
    margin-left: 6px;
}
.rack-row:nth-child(2n) .bubble { background-color: #6E7D52; }

/* ============================================================
   STATEMENT ROW (pledge)
   ============================================================ */
.statement {
    background-color: #2E251C;
    border-top: 3px solid #6B655C;
    border-bottom: 3px solid #6B655C;
}

.statement-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 58px 24px;
    text-align: center;
}

.statement-figure {
    display: block;
    font-size: 96px;
    font-family: "Trebuchet MS", sans-serif;
    font-weight: bold;
    color: #D2B98C;
    line-height: 1;
    margin: 0 0 10px 0;
}

.statement p {
    font-size: 20px;
    max-width: 760px;
    margin: 0 auto 6px auto;
    color: #EFE7D8;
}

.statement-sub {
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px;
    color: #D2B98C;
    margin-top: 12px;
}

/* ============================================================
   CUT-SHEET FLOW (.stationflow)
   ============================================================ */
.stationflow { background-color: #120E0A; overflow-x: hidden; }

.stationflow-in { max-width: 1180px; margin: 0 auto; padding: 56px 24px 30px 24px; }

.stationflow h2 { font-size: 32px; margin: 0 0 6px 0; }
.stationflow-lead { max-width: 820px; margin: 0 0 26px 0; color: #D2B98C; }

.flow-track {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 10px;
}

.station { flex: 1 1 170px; text-align: center; max-width: 200px; margin: 0 auto; }

.sawplate {
    width: 74px;
    height: 74px;
    margin: 0 auto 12px auto;
    background-color: #6B655C;
    color: #1C1712;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 18px;
    box-shadow: 0 5px 0 #120E0A;
}

.station h4 {
    font-size: 18px;
    margin: 0 0 8px 0;
    color: #EFE7D8;
}

.station p { font-size: 14px; color: #D2B98C; text-align: center; margin: 0; }

.station-final .sawplate {
    background-color: #2E251C;
    color: #6E7D52;
    box-shadow: 6px 6px 0 #6B655C;
}

.endcaps {
    text-align: center;
    margin-top: 12px;
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #6B655C;
}

/* ============================================================
   ACCENT / STATEMENT STRIP on bench-oak
   ============================================================ */
.pledgesecond {
    background-color: #2E251C;
    border-bottom: 3px solid #6B655C;
}

.pledgesecond-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 34px 24px;
    text-align: center;
}

.pledgesecond strong {
    color: #D2B98C;
    font-size: 24px;
    display: block;
    margin-bottom: 6px;
}

.pledgesecond p { color: #EFE7D8; margin: 0; }

/* ============================================================
   BENCH-CALL / anchored page target
   ============================================================ */
.bench { background-color: #1C1712; }

.bench-anchor { display: block; }

/* ============================================================
   LACQUER-TAG BAND (.lacquerband)
   ============================================================ */
.lacquerband {
    background-color: #B33A2E;
    color: #EFE7D8;
    width: 100%;
}

.lacquerband-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 34px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
}

.lacquerband h3 { color: #EFE7D8; margin: 0 0 6px 0; font-size: 24px; }
.lacquerband p { margin: 0; color: #EFE7D8; max-width: 640px; }

.shopready {
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size: 13px;
    display: block;
    padding: 4px 10px;
    border: 2px solid #EFE7D8;
    width: auto;
    display: inline-block;
    margin-bottom: 10px;
    color: #EFE7D8;
}

.lacquerband .btn-tan { box-shadow: 4px 4px 0 #120E0A; }

/* ============================================================
   SHAVING-BIN FOOTER (.shavingbin)
   ============================================================ */
.shavingbin {
    background-color: #120E0A;
    color: #EFE7D8;
    position: relative;
}

.shavingbin-topbar {
    background-color: #1C1712;
    border-top: 3px solid #6B655C;
    border-bottom: 3px solid #6B655C;
    position: relative;
    z-index: 1;
}

.shavingbin-motto {
    max-width: 1180px;
    margin: 0 auto;
    padding: 24px;
    text-align: center;
    font-family: "Trebuchet MS", sans-serif;
    font-size: 26px;
    letter-spacing: 4px;
    color: #D2B98C;
    font-weight: bold;
}
.shavingbin-motto small {
    display: block;
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 3px;
    font-size: 12px;
    color: #6B655C;
    margin-top: 8px;
}

.shavingbin-cols {
    max-width: 1180px;
    margin: 0 auto;
    padding: 34px 24px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    position: relative;
    z-index: 1;
}

.shavingbin-col { flex: 1 1 240px; }

.shavingbin-col h4 {
    font-size: 16px;
    margin: 0 0 12px 0;
    font-family: "Courier New", Courier, monospace;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #6B655C;
}

.shavingbin-col ul { list-style: none; margin: 0; padding: 0; }
.shavingbin-col li { margin-bottom: 8px; }
.shavingbin-col a { color: #D2B98C; }
.shavingbin-col p { color: #EFE7D8; font-size: 15px; margin: 0 0 8px 0; }

.shavingbin-plate {
    background-color: #6B655C;
    color: #120E0A;
    position: relative;
    z-index: 1;
}

.plate-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 20px 24px;
    text-align: center;
}

.plate-co {
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 2px;
    font-size: 16px;
    color: #120E0A;
    margin: 0;
}

.plate-line { font-size: 14px; color: #2E251C; margin: 2px 0; }
.plate-line strong { color: #120E0A; }

.shavingbin-copy {
    background-color: #120E0A;
    text-align: center;
    padding: 16px 24px;
    color: #EFE7D8;
    font-size: 13px;
    position: relative;
    z-index: 1;
}
.shavingbin-copy small { color: #D2B98C; display: block; margin-top: 4px; }

/* watermark decorative curl hidden visually-fine */
.shavbin-water { visibility: hidden; }

/* ============================================================
   SERVICES PAGE LAYOUT
   ============================================================ */
.pagehero { background-color: #120E0A; border-bottom: 6px solid #2E251C; }
.pagehero-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 52px 24px 26px 24px;
    text-align: center;
}
.pagehero h1 { font-size: 44px; margin: 0 0 10px 0; }
.pagehero-sub { color: #D2B98C; max-width: 760px; margin: 0 auto; font-size: 17px; }

.detailblocks { background-color: #1C1712; }
.detailblocks-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 30px 24px 20px 24px;
}

.detail-row {
    display: flex;
    gap: 26px;
    align-items: flex-start;
    background-color: #2E251C;
    margin-bottom: 16px;
    padding: 24px;
    border-left: 8px solid #B33A2E;
}
.detail-row:nth-child(2n) {
    background-color: #D2B98C;
    color: #120E0A;
}
.detail-row:nth-child(2n) h3,
.detail-row:nth-child(2n) p { color: #120E0A; }
.detail-row:nth-child(3n) { background-color: #221B15; border-left-color: #6B655C; }
.detail-row:nth-child(3n) h3 { color: #D2B98C; }

.detail-tag {
    flex: 0 0 92px;
    text-align: center;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    font-size: 26px;
    color: #B33A2E;
}
.detail-row:nth-child(2n) .detail-tag { color: #6B655C; }

.detail-body { flex: 1 1 auto; }
.detail-body h3 { font-size: 22px; margin: 0 0 10px 0; color: #EFE7D8; }
.detail-body p { margin: 0 0 12px 0; }
.detail-body ul { margin: 0 0 8px 0; padding-left: 20px; }
.detail-footer { text-align: center; padding: 10px 24px 14px 24px; }
.detail-footer a { color: #D2B98C; }

/* CTA band reused */
.cta-wrap { padding: 30px 0 20px 0; }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contactgrid { background-color: #1C1712; }
.contactgrid-in {
    max-width: 1180px;
    margin: 0 auto;
    padding: 30px 24px;
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}
.contact-formpanel { flex: 1 1 520px; background-color: #2E251C; padding: 26px; }
.contact-infopanel { flex: 1 1 320px; }

.contact-formpanel h2, .contact-infopanel h2 {
    font-size: 24px;
    margin: 0 0 8px 0;
}

.formrow { margin-bottom: 14px; }
.formrow label {
    display: block;
    font-family: "Courier New", Courier, monospace;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 12px;
    color: #D2B98C;
    margin-bottom: 5px;
}
.contact-formpanel .formrow input,
.contact-formpanel .formrow textarea,
.contact-formpanel .formrow select {
    width: 100%;
    border: 2px solid #6B655C;
    background-color: #120E0A;
    color: #EFE7D8;
    padding: 10px;
    font-size: 15px;
    font-family: Georgia, serif;
}

.contactsubmit {
    background-color: #B33A2E;
    color: #EFE7D8;
    border: none;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 15px;
    padding: 12px 26px;
    cursor: pointer;
}

.infofact { margin-bottom: 18px; }
.infofact strong {
    display: block;
    font-family: "Courier New", Courier, monospace;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 12px;
    color: #6B655C;
    margin-bottom: 4px;
}
.infofact p, .infofact span { color: #EFE7D8; margin: 0; }
.infofact a { color: #D2B98C; font-weight: bold; }
.infofact .coord { color: #EFE7D8; }

.faQ { background-color: #120E0A; }
.faQ-in { max-width: 1180px; margin: 0 auto; padding: 30px 24px 10px 24px; }
.faQ-in h2 { font-size: 28px; margin: 0 0 18px 0; }

.qa { background-color: #2E251C; margin-bottom: 12px; }
.qa summary {
    cursor: pointer;
    padding: 14px 18px;
    font-weight: bold;
    font-size: 17px;
    color: #D2B98C;
    font-family: "Trebuchet MS", sans-serif;
    list-style: none;
}
.qa summary::-webkit-details-marker { display: none; }
.qa-content { padding: 0 18px 18px 18px; }
.qa-content p { color: #EFE7D8; margin: 0; }

.contacthours { color: #EFE7D8; }

.formnote { font-size: 13px; color: #D2B98C; margin-top: 10px; }
.formnote p { margin: 4px 0; }

/* Reveal default visible for noscript is handled by .js html class */
/* ============================================================
   SCROLL REVEAL — safe without JS (default visible).
   ============================================================ */
.reveal { will-change: opacity, transform; }
.js .reveal {
    opacity: 0;
    transform: translateY(18px);
}
.js .reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s ease, transform 0.7s ease;
}
.no-js .reveal { opacity: 1; transform: none; }