/* All redesign rules are scoped to cost sections; the estimate form and FAQ retain their design. */
.cost-design { padding: clamp(44px, 5vw, 76px) 0; }
.cost-design > div:first-child { max-width: 1280px; }
.cost-design h2 { font-size: clamp(28px, 3vw, 42px); line-height: 1.13; letter-spacing: -.035em; }
.cost-design .text-center { text-align: left; max-width: 900px; margin-left: 0; }
.cost-design .text-center > p, .cost-design p { text-align: left; }
.cost-design .text-center > span, .cost-introduction .max-w-2xl > span { display: block; letter-spacing: .19em; font-size: 10px; }
.cost-hero { min-height: 0; display: block; position: relative; padding: 154px 0 76px; background: #0d130c; overflow: hidden; }
.cost-hero > img { position: absolute; top: 120px; right: max(24px, calc((100vw - 1216px) / 2)); left: auto; bottom: 56px; width: 43%; height: calc(100% - 176px); object-fit: cover; border-radius: 18px 5px 5px 18px; }
.cost-hero > div.absolute { display: none; }
.cost-hero .cost-hero-inner { position: relative; width: 100%; max-width: 1280px; }
.cost-hero-copy { max-width: 51%; padding: 16px 0; }
.cost-hero h1 { font-size: clamp(36px, 4.2vw, 60px); line-height: 1.04; letter-spacing: -.045em; max-width: 600px; }
.cost-hero p { color: #cbd5c8; font-size: 16px; line-height: 1.75; max-width: 520px; }
.cost-hero-copy > .mt-10 { column-gap: 20px; row-gap: 12px; max-width: 490px; }
.cost-hero-copy > .mt-10 > div { font-size: 11px; }
.cost-hero a { border-radius: 7px; min-height: 46px; }
.cost-introduction { background: #f5f8f3; }
.cost-introduction > div { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 56px; }
.cost-introduction .max-w-2xl { max-width: none; }
.cost-introduction .mt-6 { margin-top: 0; padding: 26px; border-color: #c6d7c6; border-left: 4px solid #226b34; border-radius: 0 12px 12px 0; background: #e8f1e6; }
.cost-introduction .text-amber-800 { color: #30492e; }
.cost-introduction .text-amber-600 { color: #226b34; }
.cost-size { background: #fff; }
.cost-size .cost-panel { border-radius: 14px; border: 1px solid #d7e1d5; overflow-x: auto; box-shadow: 0 12px 34px #1220100b; }
.cost-size table { border-collapse: collapse; }
.cost-size thead { background: #163e23; }
.cost-size th { padding: 18px 22px; font-size: 12px; }
.cost-size td { padding: 26px 22px; line-height: 1.7; border-bottom: 1px solid #e2e9df; }
.cost-size tr:last-child td { border-bottom: 0; }
.cost-size td:nth-child(3) { font-size: 18px; line-height: 1.4; font-weight: 700; color: #226b34; white-space: nowrap; }
.cost-size tbody tr { background: #fff; }
.cost-size tbody tr:nth-child(2) { background: #f4f8f1; }
.cost-size tbody tr:hover { background: #e2f7e7; }
.cost-sqft { background: #f5f8f3; }
.cost-sqft .cost-panel { position: relative; border-radius: 12px; background: #fff; padding: 28px; border: 1px solid #d6e0d3; box-shadow: 0 8px 22px #12201009; }
.cost-item-number { display: block; color: #5f7b5c; font-size: 12px; letter-spacing: .12em; font-weight: 700; margin-bottom: 20px; }
.cost-sqft h3 { font-size: 19px; }
.cost-sqft .cost-panel > p:first-of-type { color: #226b34; font-size: clamp(20px, 2vw, 27px); line-height: 1.3; margin-top: 20px; letter-spacing: -.025em; }
.cost-sqft .cost-panel > p:last-child { border-top: 1px solid #e3eadf; padding-top: 18px; margin-top: 20px; }
.cost-sqft .cost-panel:nth-child(2) { background: #e6f3e5; border-color: #9dc59a; }
.cost-services { background: #fff; }
.cost-services .cost-panel { position: relative; border: 1px solid #d7e1d5; border-radius: 12px; background: #fff; padding: 25px; box-shadow: 0 6px 18px #12201008; }
.cost-services .cost-panel h3 { font-size: 18px; }
.cost-services .cost-panel p { color: #226b34; font-size: 25px; line-height: 1.3; letter-spacing: -.02em; margin-top: 16px; }
.cost-services .cost-panel > span:last-child { display: block; padding-top: 16px; margin-top: 20px; border-top: 1px solid #e1e9de; color: #52644e; }
.cost-services .cost-panel:hover, .cost-sqft .cost-panel:hover { background: #e2f7e7; border-color: #8abb92; box-shadow: 0 10px 25px #12201012; }
.cost-design a:focus-visible { outline: 3px solid #6ed886; outline-offset: 4px; }
.cost-estimate { background: #f5f8f3; }
.cost-estimate .cost-panel { border-radius: 12px; border: 1px solid #d5e0d1; background: #fff; padding: 28px; border-top: 4px solid #226b34; }
.cost-estimate .cost-panel:nth-child(2) { border-top-color: #8c9d86; }
.cost-estimate .cost-panel h3 { font-size: 20px; }
.cost-estimate > div > p:last-child { max-width: none; margin: 28px 0 0; padding: 20px 24px; border-left: 3px solid #9bbd94; font-size: 14px; text-align: left; }
.cost-factors { background: #0d130c; }
.cost-factors h2 { color: #fff; }
.cost-factors .text-center > span { color: #a6e6b2; }
.cost-factors .cost-panel { border-radius: 12px; border: 1px solid #d7e1d5; background: #f8faf6; padding: 26px; }
.cost-factors .cost-panel > span:not(.cost-item-number) { display: none; }
.cost-factors .cost-item-number { color: #226b34; font-size: 30px; letter-spacing: -.045em; margin-bottom: 18px; }
.cost-factors .cost-panel h3 { margin-top: 0; font-size: 18px; line-height: 1.4; }
.cost-factors .cost-panel p { color: #52604c; font-size: 13px; line-height: 1.75; }
.cost-factors .cost-panel:hover { background: #e2f7e7; }
.cost-reviews { background: #f5f8f3; }
.cost-reviews article { border-radius: 12px; }
@media (max-width: 1000px) {
  .cost-introduction > div { gap: 28px; }
  .cost-sqft .cost-panel, .cost-services .cost-panel { padding: 22px; }
  .cost-size td, .cost-size th { padding-left: 15px; padding-right: 15px; }
}
@media (max-width: 760px) {
  .cost-hero { padding: 120px 0 0; display: flex; flex-direction: column; }
  .cost-hero .cost-hero-inner { order: 0; }
  .cost-hero-copy { max-width: none; padding-bottom: 34px; }
  .cost-hero > img { position: relative; order: 1; top: auto; right: auto; bottom: auto; width: calc(100% - 40px); height: 300px; margin: 0 20px 30px; border-radius: 12px; }
  .cost-hero h1 { font-size: clamp(36px, 7vw, 50px); }
  .cost-introduction > div { grid-template-columns: 1fr; }
  .cost-sqft .grid { grid-template-columns: 1fr; }
  .cost-size table, .cost-size tbody, .cost-size tr, .cost-size td { display: block; width: 100%; }
  .cost-size thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .cost-size .cost-panel { border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; }
  .cost-size tbody { display: grid; gap: 18px; }
  .cost-size tbody tr { padding: 20px; border: 1px solid #d7e1d5; border-radius: 12px; }
  .cost-size td { padding: 10px 0; border: 0; }
  .cost-size td::before { content: attr(data-label); display: block; margin-bottom: 4px; font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #5b6b55; }
  .cost-size td:first-child { font-size: 19px; }
  .cost-size td:nth-child(3) { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) { .cost-design * { transition: none; } }
