:root {
  --ink: #111210;
  --paper: #f2f0e9;
  --cream: #e8e4d8;
  --brass: #d4a43e;
  --brass-light: #f1c864;
  --red: #ad2b1f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }

.site-header {
  height: 78px; padding: 0 4.5vw; display: flex; align-items: center; justify-content: space-between;
  background: #111210; color: white; border-bottom: 1px solid #ffffff24; position: absolute; inset: 0 0 auto; z-index: 10;
}
.brand { display: flex; align-items: center; gap: 12px; font-size: 19px; letter-spacing: -.04em; }
.brand b { color: var(--brass-light); }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; border: 2px solid var(--brass); color: var(--brass-light); font-size: 12px; font-weight: 900; letter-spacing: -.08em; transform: rotate(45deg); }
.brand-mark::first-line { transform: rotate(-45deg); }
.site-header nav { display: flex; gap: 34px; font: 600 11px/1 monospace; text-transform: uppercase; letter-spacing: .12em; }
.site-header nav a { color: #c7c7c2; transition: color .2s; }
.site-header nav a:hover { color: var(--brass-light); }
.button { min-height: 50px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 28px; background: var(--red); color: white; font: 700 11px/1 monospace; text-transform: uppercase; letter-spacing: .11em; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); background: #c33a2d; }
.button-small { min-height: 42px; }

.hero { min-height: 770px; position: relative; overflow: hidden; color: white; display: flex; align-items: center; }
.hero-image { position: absolute; inset: 0; background: url("/images/heat-inserts-hero.png") center/cover no-repeat; transform: scale(1.01); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #111210 0%, #111210f4 29%, #11121096 52%, #11121018 82%), linear-gradient(0deg,#111210a0,transparent 55%); }
.hero-grid { position: absolute; inset: 78px 0 0; opacity: .12; background-image: linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size: 76px 76px; mask-image: linear-gradient(90deg,#000,transparent 70%); }
.hero-copy { position: relative; width: min(660px, 80%); margin: 95px 0 50px 8vw; z-index: 2; }
.eyebrow { margin: 0 0 26px; font: 700 10px/1 monospace; text-transform: uppercase; letter-spacing: .18em; color: #6f6e68; display: flex; align-items: center; gap: 12px; }
.eyebrow span { display: block; width: 30px; height: 2px; background: var(--red); }
.eyebrow.light { color: #d4d1c7; }
h1,h2 { margin: 0; font-family: Impact, "Arial Narrow", sans-serif; font-weight: 900; text-transform: uppercase; letter-spacing: -.045em; line-height: .91; }
h1 { font-size: clamp(74px, 8.4vw, 136px); }
h1 em,h2 em { color: var(--brass-light); font-style: normal; }
.hero-lede { max-width: 545px; margin: 30px 0 38px; font-size: 18px; line-height: 1.6; color: #deddd7; }
.hero-actions { display: flex; align-items: center; gap: 34px; }
.button-gold { background: var(--brass); color: #111; }
.button-gold:hover { background: var(--brass-light); }
.text-link { font: 700 11px/1 monospace; text-transform: uppercase; letter-spacing: .1em; border-bottom: 1px solid #ffffff6b; padding-bottom: 6px; }
.hero-specs { position: absolute; z-index: 3; right: 4.5vw; bottom: 36px; display: flex; background: #111210e6; backdrop-filter: blur(10px); border: 1px solid #ffffff20; }
.hero-specs div { min-width: 150px; padding: 18px 20px; border-left: 1px solid #ffffff20; }
.hero-specs span,.hero-specs b { display: block; }
.hero-specs span { color: #8c8c87; font: 700 9px/1 monospace; letter-spacing: .12em; margin-bottom: 8px; }
.hero-specs b { font: 700 13px/1 monospace; color: var(--brass-light); }

.trust-strip { display: flex; min-height: 72px; align-items: center; justify-content: space-around; gap: 20px; padding: 0 4vw; background: var(--brass); color: #171712; }
.trust-strip p { margin: 0; font: 800 10px/1 monospace; text-transform: uppercase; letter-spacing: .11em; }
.trust-strip i { width: 4px; height: 4px; border-radius: 50%; background: #171712; }
.section { padding: 120px 8vw; }
.intro { display: grid; grid-template-columns: 1fr 1fr; gap: 10vw; align-items: end; }
h2 { font-size: clamp(58px, 6.7vw, 108px); }
.intro-copy { padding-bottom: 6px; }
.intro-copy > p,.section-head > p { max-width: 560px; margin: 0 0 30px; font-size: 19px; line-height: 1.65; color: #52514c; }
.dark-link { border-color: #1118; }

.anatomy { min-height: 650px; margin: 0 4vw 100px; padding: 60px 8vw; position: relative; overflow: hidden; background-color: #dfdbcf; background-image: linear-gradient(#1111 1px,transparent 1px),linear-gradient(90deg,#1111 1px,transparent 1px); background-size: 52px 52px; }
.insert-illustration { width: 230px; height: 430px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); filter: drop-shadow(0 30px 20px #3227124a); }
.insert-top,.insert-base { height: 46px; margin: 0 10px; border-radius: 12px 12px 3px 3px; background: linear-gradient(90deg,#8b5e16,#f2cf65 20%,#a56b11 48%,#f3d875 72%,#84520e); border: 2px solid #6c480d; }
.insert-base { border-radius: 3px 3px 13px 13px; background-size: 14px 14px; }
.insert-body { height: 338px; position: relative; border-left: 2px solid #6c480d; border-right: 2px solid #6c480d; background-color: #c6932d; background-image: repeating-linear-gradient(45deg,transparent 0 12px,#745011 13px 16px,transparent 17px 27px),repeating-linear-gradient(-45deg,transparent 0 12px,#f4d66f 13px 16px,transparent 17px 27px); overflow: hidden; }
.thread-hole { position: absolute; left: 50%; top: 25px; width: 77px; height: 285px; transform: translateX(-50%); background: repeating-linear-gradient(0deg,#161710 0 9px,#6e5930 10px 13px); border: 5px solid #6b4a14; box-shadow: inset 10px 0 15px #000b; }
.callout { position: absolute; display: grid; grid-template-columns: 36px 1fr; min-width: 220px; }
.callout::after { content:""; position:absolute; top: 9px; width: 120px; height: 1px; background: #111; }
.callout b { grid-row: 1/3; color: var(--red); font: 700 10px monospace; }
.callout span { font: 800 12px monospace; text-transform: uppercase; }
.callout small { margin-top: 7px; color: #65635d; font-size: 11px; }
.callout-a { left: 7%; top: 30%; }.callout-a::after { left: 100%; }
.callout-b { right: 3%; top: 46%; }.callout-b::after { right: 100%; }
.callout-c { left: 8%; bottom: 18%; }.callout-c::after { left: 100%; }
.material-stamp { position: absolute; right: 6%; bottom: 8%; border: 2px solid #8d856f; border-radius: 50%; padding: 18px; text-align: center; color: #766e5d; font: 900 24px monospace; transform: rotate(-7deg); }
.material-stamp small { font-size: 8px; letter-spacing: .1em; }

.chart-section { padding-top: 50px; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 8vw; margin-bottom: 64px; }
.section-head > p { margin-bottom: 4px; }
.size-table { border-top: 2px solid var(--ink); }
.table-row { min-height: 76px; display: grid; grid-template-columns: 1.2fr repeat(3,1fr) .7fr; align-items: center; padding: 0 24px; border-bottom: 1px solid #b9b6ad; transition: background .2s, padding .2s; }
a.table-row:hover { background: #e3dfd3; padding-left: 34px; }
.table-row strong { font-family: Impact, sans-serif; font-size: 26px; letter-spacing: .02em; }
.table-row span { color: #55534e; }
.table-row b { justify-self: end; font: 700 10px monospace; text-transform: uppercase; color: var(--red); }
.table-head { min-height: 40px; color: #77736a; font: 700 9px monospace; text-transform: uppercase; letter-spacing: .12em; }
.table-note { color: #77736a; font-size: 11px; margin-top: 16px; }

.quote-section { position: relative; min-height: 880px; padding: 110px 8vw; overflow: hidden; background: #111210; color: white; }
.quote-photo { position: absolute; inset: 0; background: url("/images/quote-lab-v1.jpg") center/cover no-repeat; }
.quote-overlay { position: absolute; inset: 0; background: linear-gradient(90deg,#111210f8 0%,#111210e8 36%,#1112106e 68%,#111210c9 100%),linear-gradient(0deg,#111210 0%,transparent 35%); }
.quote-section::after { content:""; position:absolute; inset:0; opacity:.09; pointer-events:none; background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size:64px 64px; }
.quote-intro,.quote-workspace { position: relative; z-index: 2; }
.quote-intro { max-width: 620px; }
.quote-intro h2 { font-size: clamp(58px,6.2vw,98px); }
.quote-intro > p:not(.eyebrow) { max-width: 570px; margin: 28px 0; color: #c6c5be; font-size: 17px; line-height: 1.65; }
.quote-promises { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 34px; }
.quote-promises span { display:flex; align-items:center; gap:9px; color:#d8d6cf; font:700 9px monospace; text-transform:uppercase; letter-spacing:.08em; }
.quote-promises b { color: var(--brass-light); }
.quote-workspace { width: min(760px,100%); margin: 70px 0 0 auto; padding: 0 34px 34px; background: #f4f1e9; color: var(--ink); box-shadow: 0 35px 90px #0008; }
.quote-tabs { min-height: 70px; margin: 0 -34px 32px; display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid #c9c5ba; }
.quote-tabs button { appearance:none; border:0; border-right:1px solid #d2cec4; padding:0 14px; background:#dfdbd0; color:#68665f; font:800 10px monospace; text-transform:uppercase; letter-spacing:.08em; }
.quote-tabs button:last-child { border-right:0; }
.quote-tabs button.is-active { background:var(--paper); color:var(--ink); box-shadow: inset 0 -3px var(--red); }
.form-grid,.contact-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.quote-workspace label { display:flex; flex-direction:column; gap:8px; color:#5d5a53; font:700 9px monospace; text-transform:uppercase; letter-spacing:.1em; }
.quote-workspace input,.quote-workspace select,.quote-workspace textarea { width:100%; min-height:48px; border:1px solid #bdb8aa; border-radius:0; padding:11px 13px; background:#fff; color:var(--ink); font:500 14px Arial,sans-serif; text-transform:none; letter-spacing:normal; }
.quote-workspace textarea { resize:vertical; line-height:1.45; }
.quote-workspace input:focus,.quote-workspace select:focus,.quote-workspace textarea:focus { outline:2px solid var(--brass); outline-offset:1px; border-color:transparent; }
.estimate-card { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin:22px 0; background:#ccc6b8; border:1px solid #ccc6b8; }
.estimate-card > div { padding:18px; background:#171815; color:white; }
.estimate-card span,.estimate-card strong { display:block; }
.estimate-card span { margin-bottom:8px; color:#999990; font:700 9px monospace; text-transform:uppercase; letter-spacing:.1em; }
.estimate-card strong { color:var(--brass-light); font:900 22px monospace; }
.estimate-card small { grid-column:1/-1; padding:10px 14px; background:#e8e4d9; color:#6c695f; font-size:10px; line-height:1.45; }
.contact-grid { margin:20px 0; }
.upload-field { margin:20px 0; padding:22px; border:1px dashed #9d9789; background:#e9e5da; }
.upload-field input { padding:12px; background:#f8f6f0; }
.upload-field small { color:#79756c; font:500 10px Arial,sans-serif; text-transform:none; letter-spacing:normal; }
.panel-copy { margin:0 0 24px; color:#615f58; font-size:15px; line-height:1.6; }
.button-quote { width:100%; margin-top:22px; border:0; background:var(--red); }
.button-quote:disabled { opacity:.55; cursor:wait; transform:none; }
.form-status { min-height:18px; margin:13px 0 0; font-size:12px; line-height:1.5; }
.form-status.is-success { color:#236c3b; }
.form-status.is-error { color:#a52218; }
.honeypot { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; overflow:hidden!important; }

.dark-section { background: var(--ink); color: white; }
.inverse > p { color: #aaa9a3; }
.application-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: #ffffff22; }
.application-grid article { background: var(--ink); padding: 24px; }
.application-no { color: var(--brass-light); font: 700 10px monospace; margin-bottom: 18px; }
.application-visual { height: 280px; position: relative; overflow: hidden; background: #1d1e1a; }
.application-visual img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s ease; }
.application-grid article:hover .application-visual img { transform: scale(1.025); }
.application-grid h3 { margin: 24px 0 10px; font-family: Impact,sans-serif; text-transform: uppercase; font-size: 28px; letter-spacing: -.02em; }
.application-grid p { margin: 0; color: #9d9d97; line-height: 1.55; font-size: 14px; }

.process .section-head { margin-bottom: 70px; }
.process-track { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid #aaa79e; }
.process-track > div { position: relative; padding: 32px 30px 0 0; }
.process-track b { position: absolute; top: -7px; left: 0; padding-right: 10px; background: var(--paper); color: var(--red); font: 700 10px monospace; }
.process-track i { width: 70px; height: 70px; display: grid; place-items:center; border: 1px solid #aaa79e; border-radius: 50%; font-style: normal; font-size: 25px; margin-bottom: 28px; }
.process-track h3 { font: 900 19px monospace; text-transform: uppercase; }
.process-track p { color: #66635c; font-size: 13px; line-height: 1.55; max-width: 210px; }

.cta { display: grid; grid-template-columns: 1.35fr .65fr; gap: 8vw; padding: 110px 8vw; background: var(--red); color: white; }
.cta h2 { font-size: clamp(52px,6vw,95px); }
.cta h2 em { color: var(--brass-light); }
.cta-card { align-self: end; border-top: 1px solid #ffffff6b; padding-top: 24px; }
.cta-card p { font-size: 16px; line-height: 1.6; color: #f0ddd9; }
.button-dark { width: 100%; background: var(--ink); margin: 20px 0; }
.email { font: 700 11px monospace; text-transform: uppercase; border-bottom: 1px solid #fff8; }
footer { padding: 70px 8vw 30px; display: grid; grid-template-columns: 2fr 1fr .7fr .7fr; gap: 50px; background: #0b0c0a; color: white; }
.footer-brand { align-self: start; }
footer p { color: #8b8c86; line-height: 1.6; margin: 0; }
footer > div { display: flex; flex-direction: column; gap: 13px; font: 700 10px monospace; text-transform: uppercase; }
footer small { grid-column: 1/-1; border-top: 1px solid #ffffff1f; padding-top: 25px; color: #6f706b; font-size: 9px; }

@media (max-width: 850px) {
  .site-header nav { display: none; }
  .hero { min-height: 740px; align-items: flex-start; }
  .hero-image { background-position: 62% center; }
  .hero-shade { background: linear-gradient(90deg,#111 0,#111e8 55%,#1114),linear-gradient(0deg,#111d,transparent); }
  .hero-copy { margin: 175px 6vw 160px; width: 88%; }
  h1 { font-size: clamp(62px,18vw,100px); }
  .hero-lede { font-size: 16px; max-width: 450px; }
  .hero-specs { left: 6vw; right: 6vw; bottom: 24px; }
  .hero-specs div { min-width: 0; flex: 1; padding: 15px 12px; }
  .trust-strip { flex-wrap: wrap; padding: 22px; }
  .trust-strip i { display: none; }
  .section { padding: 80px 6vw; }
  .intro,.cta { grid-template-columns: 1fr; }
  .section-head { display: block; }
  .section-head > p { margin-top: 30px; }
  .anatomy { margin: 0 3vw 70px; min-height: 650px; padding: 30px; }
  .insert-illustration { transform: translate(-50%,-50%) scale(.8); }
  .callout::after { width: 35px; }
  .callout-a { left: 3%; }.callout-b { right: -5%; }.callout-c { left: 3%; }
  .application-grid { grid-template-columns: 1fr; gap: 1px; }
  .application-visual { height: 230px; }
  .quote-section { padding:80px 6vw; }
  .quote-overlay { background:linear-gradient(90deg,#111210f7,#111210c9),linear-gradient(0deg,#111210,transparent); }
  .quote-workspace { margin:55px auto 0; }
  .process-track { grid-template-columns: 1fr 1fr; gap: 40px 10px; }
  footer { grid-template-columns: 1fr 1fr; }
  footer .footer-brand,footer small { grid-column: 1/-1; }
}

@media (max-width: 560px) {
  .site-header { padding: 0 5vw; }
  .site-header .button { padding: 0 13px; gap: 8px; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 24px; }
  .hero-specs div:nth-child(2) { display: none; }
  .trust-strip p { width: 45%; text-align: center; line-height: 1.5; }
  .intro { gap: 40px; }
  .anatomy { min-height: 570px; }
  .callout { min-width: 145px; grid-template-columns: 25px 1fr; }
  .callout small { display: none; }
  .callout-b { right: -12%; }
  .material-stamp { display: none; }
  .table-row { grid-template-columns: .7fr 1fr 1fr; padding: 0 10px; }
  .table-row span:nth-child(4),.table-row b,.table-head span:nth-child(4),.table-head span:nth-child(5) { display: none; }
  .quote-workspace { padding:0 18px 24px; }
  .quote-tabs { margin:0 -18px 24px; min-height:62px; }
  .quote-tabs button { padding:0 7px; font-size:8px; }
  .form-grid,.contact-grid { grid-template-columns:1fr; gap:14px; }
  .estimate-card { grid-template-columns:1fr; }
  .estimate-card small { grid-column:1; }
  .process-track { grid-template-columns: 1fr; }
  .cta { padding: 80px 6vw; }
  footer { grid-template-columns: 1fr; }
  footer > * { grid-column: 1!important; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none!important; } }