/* =================================================================
   MILLWORK DRAWINGS — "WORKSHOP TITLE-BLOCK" STRUCTURE
   A homepage laid out like a drawing sheet: ruled frames, title
   blocks, labeled fields, mono metadata, a numbered drawing
   schedule instead of card grids. Loaded after heritage.css.
   ================================================================= */

/* ---------- mono primitives ---------- */
.mono-k, .mono-v, .tb-eyebrow, .block-tag, .idx-spec, .seq-step,
.report-head, .report-sign, .rule-item, .col-k, .issue-tag {
  font-family: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}
.mono-k { font-size: .625rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); display: block; }
.mono-v { font-size: .8125rem; letter-spacing: .03em; color: var(--ink); font-weight: 500; display: block; }

/* ---------- homepage nav = sheet masthead (dark text on paper) ---------- */
body.has-hero .navbar { background: var(--paper); border-bottom: 1.5px solid var(--ink); padding: .85rem 0; }
body.has-hero .navbar.scrolled { background: var(--paper); padding: .85rem 0; border-bottom: 1.5px solid var(--ink); box-shadow: none; }
body.has-hero .nav-links a { color: var(--ink-soft); }
body.has-hero .nav-links a:hover, body.has-hero .nav-links a.active { color: var(--ink); background: rgba(36,27,18,.06); }
body.has-hero .nav-phone { color: var(--muted); }
body.has-hero .nav-phone:hover { color: var(--oxblood); }
body.has-hero .hamburger span { background: var(--ink); }

/* ---------- sheet container ---------- */
.sheet { max-width: 1200px; margin: 0 auto; padding: 0 1.25rem; }

/* ================= HERO = TITLE BLOCK ================= */
.tb-hero-wrap { background: var(--paper); padding: 5.75rem 0 2.5rem; }
.tb-frame { border: 1.5px solid var(--ink); background: var(--white); position: relative; box-shadow: var(--shadow-md); }
.tb-frame::before { content: ''; position: absolute; inset: 5px; border: 1px solid var(--border); pointer-events: none; z-index: 0; }
.tb-frame > * { position: relative; z-index: 1; }

/* title-block stamp row */
.tb-stamp { display: flex; flex-wrap: wrap; border-bottom: 1.5px solid var(--ink); }
.tb-stamp-cell { padding: .55rem 1.15rem; border-left: 1px solid var(--border); display: flex; flex-direction: column; gap: .15rem; }
.tb-stamp-cell:first-child { border-left: none; }

/* hero body: headline left, real drawing (FIG. 1) right */
.tb-body { display: grid; grid-template-columns: 1.12fr 1fr; }
.tb-main { padding: 2.75rem 2.5rem 3rem; border-right: 1px solid var(--border); display: flex; flex-direction: column; }
.tb-main h1 { max-width: 15ch; }
.tb-main .tb-actions { margin-top: auto; }
.tb-figure { display: flex; flex-direction: column; background: var(--white); }
.tb-figure-img { flex: 1; overflow: hidden; min-height: 360px; background: #fff; padding: 1.75rem; display: flex; }
.tb-figure-img img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; }
.tb-figure-cap { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 1.25rem; border-top: 1.5px solid var(--ink); font-family: 'IBM Plex Mono', monospace; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); background: var(--white); }
.tb-figure-cap span:first-child { color: var(--oxblood); }
.tb-eyebrow { font-size: .6875rem; letter-spacing: .16em; text-transform: uppercase; color: var(--oxblood); margin-bottom: 1.5rem; }
.tb-main h1 { font-size: clamp(2rem, 4vw, 3.3rem); line-height: 1.05; color: var(--ink); margin-bottom: 1.25rem; letter-spacing: -.015em; }
.tb-main h1 em { font-style: italic; color: var(--oxblood); }
.tb-sub { color: var(--slate); max-width: 50ch; margin-bottom: 1.875rem; font-size: 1rem; line-height: 1.7; }
.tb-actions { display: flex; gap: .75rem; flex-wrap: wrap; }

.tb-spec { display: flex; flex-direction: column; }
.tb-field { padding: 1.05rem 1.5rem; border-bottom: 1px solid var(--border); }
.tb-field:last-child { border-bottom: none; }
.tb-field-v { font-family: 'Fraunces', Georgia, serif; font-size: 1.02rem; color: var(--ink); line-height: 1.3; margin-top: .35rem; display: block; }

/* hero data strip */
.tb-data { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1.5px solid var(--ink); }
.tb-data-cell { padding: 1.4rem 1.5rem; border-left: 1px solid var(--border); }
.tb-data-cell:first-child { border-left: none; }
.tb-num { display: block; font-family: 'Fraunces', Georgia, serif; font-size: 2.1rem; font-weight: 600; color: var(--ink); letter-spacing: -.01em; line-height: 1; margin-bottom: .45rem; }
.tb-num em { font-style: normal; color: var(--oxblood); }

/* ================= TRUST RULE STRIP ================= */
.rule-strip { background: var(--paper); border-bottom: 1.5px solid var(--ink); }
.rule-strip .sheet { display: flex; flex-wrap: wrap; gap: .55rem 2.25rem; padding-top: .9rem; padding-bottom: .9rem; }
.rule-item { font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); display: flex; align-items: center; gap: .55rem; }
.rule-item::before { content: ''; width: 7px; height: 7px; background: var(--gold); display: inline-block; }

/* ================= GENERIC BLOCK + HEAD ================= */
.block { background: var(--paper); padding: 4.5rem 0; }
.block.alt { background: var(--section-bg); }
.block-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2.25rem; padding-bottom: 1.1rem; border-bottom: 1.5px solid var(--ink); }
.block-tag { font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--oxblood); white-space: nowrap; }
.block-title h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); color: var(--ink); line-height: 1.1; margin-top: .5rem; }
.block-note { font-size: .9rem; color: var(--muted); max-width: 40ch; text-align: right; line-height: 1.6; }

/* ================= SERVICES = DRAWING SCHEDULE ================= */
.index { border-top: 1px solid var(--border); }
.idx-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.75rem; padding: 1.5rem .35rem; border-bottom: 1px solid var(--border); transition: padding .2s ease, background .2s ease; }
.idx-row:hover { background: rgba(181,145,90,.07); padding-left: 1.1rem; padding-right: 1.1rem; }
.idx-no { font-family: 'IBM Plex Mono', monospace; font-size: 1.05rem; color: var(--gold); font-weight: 500; }
.idx-main h3 { font-size: 1.3rem; color: var(--ink); margin-bottom: .25rem; }
.idx-spec { font-size: .6875rem; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.idx-go { font-size: 1.35rem; color: var(--ink); transition: transform .2s ease, color .2s ease; }
.idx-row:hover .idx-go { transform: translateX(5px); color: var(--oxblood); }

/* ================= PROCESS = SEQUENCE ================= */
.seq { display: grid; grid-template-columns: repeat(4, 1fr); border: 1.5px solid var(--ink); background: var(--white); }
.seq-cell { padding: 1.85rem 1.5rem; border-left: 1px solid var(--border); }
.seq-cell:first-child { border-left: none; }
.seq-step { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--oxblood); margin-bottom: .85rem; }
.seq-cell h3 { font-size: 1.12rem; color: var(--ink); margin-bottom: .5rem; }
.seq-cell p { font-size: .875rem; color: var(--slate); line-height: 1.6; }

/* ================= WHY US = DARK SPEC PANEL ================= */
.spec-dark { background: var(--ink); padding: 4.5rem 0; }
.spec-dark .block-head { border-bottom-color: rgba(255,255,255,.28); }
.spec-dark .block-tag { color: var(--gold-soft); }
.spec-dark .block-title h2 { color: #fff; }
.spec-dark .block-note { color: rgba(255,255,255,.5); }
.spec-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(255,255,255,.16); }
.spec-item { padding: 1.6rem 2rem 1.6rem 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.spec-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.13); padding-right: 2.5rem; }
.spec-item:nth-child(even) { padding-left: 2.5rem; }
.spec-k { font-family: 'IBM Plex Mono', monospace; font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-soft); display: block; margin-bottom: .6rem; }
.spec-item h4 { font-family: 'Fraunces', serif; font-size: 1.15rem; color: #fff; margin-bottom: .4rem; font-weight: 600; }
.spec-item p { font-size: .875rem; color: rgba(255,255,255,.55); line-height: 1.6; }

/* ================= TESTIMONIALS = FIELD REPORTS ================= */
.reports { display: grid; grid-template-columns: repeat(3, 1fr); border: 1.5px solid var(--ink); background: var(--white); }
.report { padding: 1.85rem 1.6rem; border-left: 1px solid var(--border); display: flex; flex-direction: column; }
.report:first-child { border-left: none; }
.report-head { font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; color: var(--oxblood); margin-bottom: .9rem; display: flex; justify-content: space-between; gap: 1rem; }
.report .stars { margin-bottom: .9rem; }
.report .stars svg { width: 14px; height: 14px; color: var(--gold); fill: var(--gold); }
.report-text { font-family: 'Fraunces', Georgia, serif; font-size: 1rem; line-height: 1.55; color: var(--ink-soft); font-style: italic; margin-bottom: 1.25rem; flex: 1; }
.report-sign { font-size: .68rem; letter-spacing: .04em; color: var(--muted); border-top: 1px solid var(--border); padding-top: .85rem; text-transform: uppercase; }
.reports-foot { margin-top: 1.5rem; }
.reports-foot a { font-family: 'IBM Plex Mono', monospace; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--oxblood); display: inline-flex; align-items: center; gap: .5rem; text-decoration: underline; text-underline-offset: 3px; }

/* ================= BLOG = READING INDEX ================= */
.read-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.75rem; padding: 1.4rem .35rem; border-bottom: 1px solid var(--border); transition: padding .2s, background .2s; }
.read-row:first-child { border-top: 1px solid var(--border); }
.read-row:hover { background: rgba(181,145,90,.07); padding-left: 1.1rem; padding-right: 1.1rem; }
.read-cat { font-family: 'IBM Plex Mono', monospace; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); width: 7.5rem; flex-shrink: 0; }
.read-main h3 { font-size: 1.12rem; color: var(--ink); line-height: 1.35; }
.read-main h3 a { color: var(--ink); }
.read-row:hover .read-main h3 a { color: var(--oxblood); }
.read-time { font-family: 'IBM Plex Mono', monospace; font-size: .68rem; color: var(--muted); white-space: nowrap; }

/* ================= LEAD MAGNET = REQUISITION SLIP ================= */
.req-wrap { background: var(--section-bg); padding: 4.5rem 0; }
.req-grid { display: grid; grid-template-columns: 1.05fr 1fr; border: 1.5px solid var(--ink); background: var(--white); box-shadow: var(--shadow-md); }
.req-info { padding: 2.5rem; border-right: 1px solid var(--border); }
.req-info .block-tag { color: var(--oxblood); }
.req-info h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); color: var(--ink); margin: .6rem 0 1rem; line-height: 1.1; }
.req-info > p { color: var(--slate); font-size: .95rem; margin-bottom: 1.5rem; }
.req-list { display: flex; flex-direction: column; }
.req-list li { display: grid; grid-template-columns: auto 1fr; gap: .85rem; padding: .7rem 0; border-bottom: 1px solid var(--border); font-size: .9rem; color: var(--ink-soft); align-items: center; }
.req-list li:last-child { border-bottom: none; }
.req-list .rq-no { font-family: 'IBM Plex Mono', monospace; font-size: .72rem; color: var(--gold); }
.req-form { padding: 2.5rem; }
.req-form > .mono-k { margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1.5px solid var(--ink); font-size: .7rem; color: var(--oxblood); letter-spacing: .14em; }
.req-form label { font-family: 'IBM Plex Mono', monospace; letter-spacing: .08em; }
.req-form .form-box { background: transparent; box-shadow: none; padding: 0; border-radius: 0; }

/* ================= FAQ = NUMBERED SPEC ================= */
.faq-block { background: var(--paper); padding: 4.5rem 0; }
.faq-block .sheet { max-width: 860px; }
.faq-block .faq-wrap { max-width: none; border-top: 1.5px solid var(--ink); counter-reset: faq; }
.faq-block .faq-q::before { counter-increment: faq; content: counter(faq, decimal-leading-zero); font-family: 'IBM Plex Mono', monospace; color: var(--gold); margin-right: 1.25rem; font-size: .8rem; font-weight: 500; flex-shrink: 0; }
.faq-block .faq-q { font-family: 'Fraunces', Georgia, serif; font-weight: 600; justify-content: flex-start; }
.faq-block .faq-q svg { margin-left: auto; }

/* ================= CTA = ISSUED FOR QUOTE ================= */
.cta-issue { background: var(--ink); }
.cta-issue .sheet { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-top: 3rem; padding-bottom: 3rem; flex-wrap: wrap; }
.cta-issue .issue-tag { font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-soft); margin-bottom: .65rem; }
.cta-issue h2 { color: #fff; font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.1; }
.cta-issue h2 em { font-style: italic; color: var(--gold-soft); }

/* ================= FOOTER COLOPHON ================= */
.tb-colophon { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid rgba(255,255,255,.2); margin-bottom: 3rem; }
.tb-colophon .c { padding: .8rem 1rem; border-left: 1px solid rgba(255,255,255,.12); }
.tb-colophon .c:first-child { border-left: none; }
.col-k { font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.4); display: block; margin-bottom: .3rem; }
.col-v { font-family: 'Fraunces', Georgia, serif; font-size: .95rem; color: rgba(255,255,255,.88); }

/* ================= RESPONSIVE ================= */
@media (max-width: 920px) {
  .tb-body { grid-template-columns: 1fr; }
  .tb-main { padding: 2.25rem 1.75rem 2.5rem; border-right: none; border-bottom: 1px solid var(--border); }
  .tb-figure-img { min-height: 240px; }
  .tb-data { grid-template-columns: repeat(2, 1fr); }
  .tb-data-cell:nth-child(2) { border-left: none; }
  .tb-data-cell:nth-child(n+3) { border-top: 1px solid var(--border); }
  .seq { grid-template-columns: repeat(2, 1fr); }
  .seq-cell:nth-child(2) { border-left: none; }
  .seq-cell:nth-child(n+3) { border-top: 1px solid var(--border); }
  .spec-grid { grid-template-columns: 1fr; }
  .spec-item:nth-child(odd) { border-right: none; padding-right: 0; }
  .spec-item:nth-child(even) { padding-left: 0; }
  .reports { grid-template-columns: 1fr; }
  .report { border-left: none; border-top: 1px solid var(--border); }
  .report:first-child { border-top: none; }
  .req-grid { grid-template-columns: 1fr; }
  .req-info { border-right: none; border-bottom: 1px solid var(--border); }
  .block-head { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .block-note { text-align: left; }
  .tb-colophon { grid-template-columns: repeat(3, 1fr); }
  .tb-colophon .c:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,.12); }
  .tb-colophon .c:nth-child(4) { border-left: none; }
}
@media (max-width: 560px) {
  .tb-stamp-cell { flex: 1 0 33.33%; border-top: 1px solid var(--border); }
  .tb-data { grid-template-columns: 1fr 1fr; }
  .seq { grid-template-columns: 1fr; }
  .seq-cell { border-left: none; border-top: 1px solid var(--border); }
  .seq-cell:first-child { border-top: none; }
  .read-cat { width: auto; }
  .read-row, .idx-row { grid-template-columns: auto 1fr auto; gap: 1rem; }
  .tb-colophon { grid-template-columns: repeat(2, 1fr); }
  .tb-colophon .c:nth-child(odd) { border-left: none; }
}

/* =================================================================
   INNER PAGES — title-block language (services / pricing / about /
   contact / blog index). Dark masthead + mono labels + spec cards.
   ================================================================= */

/* ---- dark title-block masthead ---- */
.page-hero { border-bottom: 2px solid var(--gold); }
.page-hero .breadcrumbs { font-family: 'IBM Plex Mono', monospace; text-transform: uppercase; letter-spacing: .12em; font-size: .66rem; }
.page-stamp {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 0;
  font-family: 'IBM Plex Mono', monospace; font-size: .66rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--gold-soft); margin-bottom: 1.2rem;
}
.page-stamp span { padding: 0 1.1rem; border-left: 1px solid rgba(203,167,103,.4); }
.page-stamp span:first-child { border-left: none; }

/* ---- section overlines read as drafting labels everywhere ---- */
.overline { font-family: 'IBM Plex Mono', monospace; letter-spacing: .16em; }

/* ---- SERVICES = numbered schedule ---- */
body { counter-reset: svc; }
.service-detail { counter-increment: svc; }
.service-detail .overline::before {
  content: counter(svc, decimal-leading-zero) " · ";
  width: auto; height: auto; background: none; flex-shrink: 0;
  color: var(--gold); -webkit-text-fill-color: var(--gold);
}

/* ---- PRICING = spec sheets (flat, ruled, squared) ---- */
.price-card { border-radius: 0; border: 1.5px solid var(--ink); box-shadow: none; background: var(--white); }
.price-card:hover { transform: none; box-shadow: var(--shadow-md); }
.price-card.featured { border-color: var(--ink); box-shadow: 0 0 0 2px var(--gold); }
.popular-tag { border-radius: 0; background: var(--ink); letter-spacing: .12em; font-family: 'IBM Plex Mono', monospace; font-weight: 500; }
.price-type { font-family: 'IBM Plex Mono', monospace; color: var(--oxblood); }
.price-desc { border-bottom-color: var(--border); }
.price-features li { border-bottom: 1px solid var(--border); padding-bottom: .85rem; }
.price-features li:last-child { border-bottom: none; }

/* ---- ABOUT = bordered data strip ---- */
.about-stats { gap: 0; border: 1.5px solid var(--ink); background: var(--white); }
.a-stat { border-radius: 0; box-shadow: none; border-left: 1px solid var(--border); }
.a-stat:first-child { border-left: none; }
.a-stat-label { font-family: 'IBM Plex Mono', monospace; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
