/* Junk Punk inner pages, menu and footer links, 2026-09-18. Tokens live in styles.css. */

.skip { position: absolute; left: 12px; top: -60px; z-index: 50; padding: 10px 16px; border-radius: 99px; background: var(--ink); color: #fff; font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; }
.links a[aria-current="page"] { background: var(--ink); color: #fff; }
.muted { color: var(--muted); }
a:not(.pill):not(.brand):not(.skip) { text-underline-offset: 3px; }

/* Menu button and sheet (below 1180px) */
.menu-btn { display: none; height: 38px; padding: 0 16px; margin-left: 6px; border: 0; border-radius: 99px; background: var(--ink); color: #fff; font: 600 14px/1 var(--text); cursor: pointer; }
.menu { position: fixed; inset: 0; z-index: 19; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; padding: 110px var(--gutter) 32px; background: var(--yellow); overflow-y: auto; }
.menu[hidden] { display: none; }
.menu nav { display: grid; gap: 2px; }
.menu nav a { font: 500 clamp(26px, 7vw, 40px)/1.25 var(--display); letter-spacing: -0.02em; color: var(--ink); text-decoration: none; }
.menu nav a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.menu-actions { display: grid; gap: 10px; }
.menu-actions .pill-yellow { background: var(--ink); color: #fff; }
.menu-actions .pill-ghost { color: var(--ink); box-shadow: inset 0 0 0 1.5px rgba(23,18,79,.4); }
body.menu-open { overflow: hidden; }
@media (max-width: 1180px) {
  .links { display: none; }
  .menu-btn { display: inline-flex; align-items: center; }
}

/* Footer links */
.end-links { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 40px; padding-top: 40px; border-top: 1px solid rgba(255,255,255,.12); }
.end-links h3 { margin: 0 0 12px; font: 600 14px/1.2 var(--text); color: rgba(255,255,255,.55); }
.end-links nav { display: grid; gap: 6px; align-content: start; }
.end-links a { color: #fff; font-size: 15px; text-decoration: none; }
.end-links a:hover { text-decoration: underline; }
.end-links p { font-size: 14px; color: rgba(255,255,255,.7); max-width: 44ch; }
.end { gap: 56px; }
.end-base { border-top: 0; padding-top: 0; }

/* Shared: inner page top spacing and closing call to action */
.page-take .ask, .page-how .how-intro, .page-about .about-hero,
.page-gallery .gal, .page-contact .contact, .page-pricing .price-hero, .page-service .svc-hero { padding-top: calc(var(--header) + 40px); }
.take-cta { display: grid; justify-items: center; gap: 14px; text-align: center; padding: 96px var(--gutter); background: var(--soft); }
.take-cta p { color: var(--muted); max-width: 44ch; }
.take-cta .actions { justify-content: center; }

/* Services showroom: names on the left, one big photo on the right */
.show { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px; align-items: stretch; min-height: 100svh; padding: calc(var(--header) + 32px) var(--gutter) 48px; background: var(--yellow); }
.show-side { display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.show-side h1 { font-size: clamp(30px, 3vw, 44px); max-width: 12ch; }
.show-list { list-style: none; margin: 0; padding: 0; display: grid; }
.show-list a { display: block; padding: 7px 0 7px 0; color: rgba(23,18,79,.45); font: 500 clamp(17px, 1.45vw, 22px)/1.25 var(--display); letter-spacing: -0.015em; text-decoration: none; transition: color .2s ease, padding .25s ease; }
.show-list a[aria-current] { color: var(--ink); padding-left: 18px; background: linear-gradient(var(--ink), var(--ink)) 0 50% / 8px 8px no-repeat; border-radius: 0; }
.show-stage { position: relative; border-radius: 28px; overflow: hidden; background: var(--ink); min-height: 520px; box-shadow: 0 50px 80px -50px rgba(23,18,79,.7); }
.slide { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; color: #fff; text-decoration: none; }
.slide.on { opacity: 1; z-index: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.2s ease; }
.slide.on img { transform: none; }
.slide::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(23,18,79,.85)); }
.slide-copy { position: absolute; z-index: 1; left: 36px; right: 36px; bottom: 32px; display: grid; gap: 8px; justify-items: start; }
.slide-name { font: 600 clamp(28px, 3vw, 46px)/1.05 var(--display); letter-spacing: -0.03em; }
.slide-line { font-size: 17px; color: rgba(255,255,255,.88); max-width: 40ch; }
.slide-go { margin-top: 10px; display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 99px; background: var(--yellow); color: var(--ink); font-weight: 600; font-size: 15px; }
.slide:hover .slide-go { background: #fff; }
.svc-extra-band { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; padding: 40px var(--gutter); background: var(--ink); color: #fff; font: 500 clamp(18px, 1.6vw, 22px)/1.3 var(--display); }
.svc-extra-band .pill-ink { background: var(--yellow); color: var(--ink); }
.svc-extra-band .pill-line { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.45); }

/* Service page */
.svc-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; align-items: center; padding: 0 var(--gutter) 72px; background: var(--yellow); }
.svc-hero-copy { display: grid; gap: 14px; justify-items: start; }
.crumb { font-size: 14px; font-weight: 500; }
.crumb a { color: var(--ink); }
.svc-hero h1 { font-size: clamp(32px, 3.6vw, 52px); }
.svc-headline { font: 500 clamp(18px, 1.5vw, 22px)/1.35 var(--display); letter-spacing: -0.01em; }
.svc-hero .lede { color: rgba(23,18,79,.78); }
.svc-hero-photo { position: relative; margin: 0; }
.svc-hero-photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 26px; box-shadow: 0 40px 70px -40px rgba(23,18,79,.6); }
.from { position: absolute; left: -26px; bottom: 28px; width: 110px; height: 110px; display: grid; place-content: center; text-align: center; border-radius: 50%; background: var(--blue); color: #fff; font: 600 28px/1 var(--display); letter-spacing: -0.03em; transform: rotate(-10deg); box-shadow: 0 0 0 5px #fff, 0 14px 30px -12px rgba(23,18,79,.6); }
.from span { font: 500 13px/1.4 var(--text); letter-spacing: 0; }
.svc-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding: 88px var(--gutter); }
.svc-intro p { font: 500 clamp(19px, 1.7vw, 24px)/1.5 var(--text); max-width: 34ch; }
.svc-haul { display: grid; gap: 16px; align-content: start; }
.svc-haul h2 { font-size: clamp(20px, 1.8vw, 26px); }
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { padding: 8px 14px; border-radius: 99px; background: var(--soft); font-size: 15px; font-weight: 500; }
.svc-price { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; margin: 0 var(--gutter); padding: 48px 56px; border-radius: 28px; background: var(--ink); color: #fff; }
.svc-price-truck img { width: 100%; max-width: 480px; }
.svc-price-copy { display: grid; gap: 16px; justify-items: start; }
.svc-price-copy p { color: rgba(255,255,255,.8); max-width: 40ch; }
.svc-price-copy strong { color: var(--yellow); }
.svc-price .pill-ink { background: var(--yellow); color: var(--ink); }
.svc-proof { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 6fr); gap: 56px; align-items: center; padding: 96px var(--gutter); }
.svc-real { margin: 0; }
.svc-real img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 22px; }
.svc-real figcaption { margin-top: 10px; font-size: 13px; color: var(--muted); }
.svc-proof-copy { display: grid; gap: 22px; justify-items: start; }
.steps-mini { margin: 0; padding: 0 0 0 20px; display: grid; gap: 8px; font-size: 15px; }
.steps-mini li::marker { font-weight: 600; color: var(--blue); }
.svc-more { padding: 0 var(--gutter) 96px; display: grid; gap: 18px; }
.svc-more h2 { font-size: clamp(20px, 1.8vw, 26px); }
.svc-others { display: flex; flex-wrap: wrap; gap: 8px; }
.svc-others a { padding: 10px 16px; border-radius: 99px; box-shadow: inset 0 0 0 1.5px #dddcee; color: var(--ink); text-decoration: none; font-size: 15px; font-weight: 500; }
.svc-others a:hover { box-shadow: inset 0 0 0 1.5px var(--ink); }

/* What we take */
.ask { display: grid; gap: 22px; padding: 0 var(--gutter) 80px; background: var(--yellow); min-height: 70svh; align-content: center; }
.ask h1 { font-size: clamp(38px, 6vw, 92px); letter-spacing: -0.04em; }
.ask-form input { width: 100%; max-width: 900px; padding: 18px 26px; border: 0; border-radius: 22px; background: #fff; color: var(--ink); font: 500 clamp(24px, 3.4vw, 48px)/1.1 var(--display); letter-spacing: -0.02em; box-shadow: 0 20px 50px -26px rgba(23,18,79,.55); }
.ask-form input::placeholder { color: rgba(23,18,79,.28); }
.ask-form input:focus { outline: 3px solid var(--ink); outline-offset: 3px; }
.answer { font-size: 18px; font-weight: 500; min-height: 1.6em; padding-left: 4px; }
.answer.is-yes::before, .answer.is-no::before, .answer.is-maybe::before { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-right: 10px; border-radius: 50%; color: #fff; font-weight: 700; vertical-align: -6px; }
.answer.is-yes::before { content: "✓"; background: #1f9d55; }
.answer.is-no::before { content: "✕"; background: #d33a2c; }
.answer.is-maybe::before { content: "?"; background: var(--blue); }
.wall { padding: 88px var(--gutter); display: grid; gap: 28px; }
.wall-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 12px; }
.wall-list li { padding: 12px 20px; border-radius: 99px; background: var(--soft); font: 500 clamp(16px, 1.5vw, 21px)/1.2 var(--display); letter-spacing: -0.01em; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.wall-list li.hit { background: var(--blue); color: #fff; transform: scale(1.06) rotate(-1.5deg); }
.dont { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; margin: 0 var(--gutter) 88px; padding: 48px 56px; border-radius: 28px; background: var(--ink); color: #fff; }
.dont p { color: rgba(255,255,255,.78); margin-top: 14px; max-width: 46ch; }
.dont-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; align-content: center; }
.dont-list li { padding: 10px 18px; border-radius: 99px; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.3); text-decoration: line-through; text-decoration-color: rgba(255,255,255,.5); }
.dont-list li.hit { background: #d33a2c; box-shadow: none; }

/* How it works */
.how-intro { padding: 0 var(--gutter) 40px; display: grid; gap: 16px; }
.how-intro h1 { font-size: clamp(34px, 4.4vw, 64px); max-width: 16ch; }
.how-intro p { color: var(--muted); max-width: 48ch; }
.walk { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding: 0 var(--gutter) 96px; }
.walk-steps { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.walk-steps li { counter-increment: step; min-height: 58vh; display: grid; align-content: center; gap: 10px; padding-left: 76px; position: relative; opacity: .35; transition: opacity .3s ease; }
.walk-steps li.on { opacity: 1; }
.walk-steps li::before { content: counter(step); position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); font: 600 22px/1 var(--display); }
.walk-steps h2 { font-size: clamp(24px, 2.4vw, 34px); }
.walk-steps p { color: var(--muted); max-width: 40ch; font-size: 17px; }
.walk-phone { position: sticky; top: calc(var(--header) + 10px); height: calc(100svh - var(--header) - 20px); display: grid; place-items: center; }
.walk-phone .phone { grid-row: auto; }
.walk .thread li { display: none; }
.walk .thread li.in { display: block; animation: pop .35s ease both; }

/* Pricing */
.price-hero { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 48px; align-items: center; padding: 0 var(--gutter) 72px; background: var(--yellow); }
.price-hero h1 { font-size: clamp(32px, 3.8vw, 56px); }
.price-hero-copy { display: grid; gap: 16px; }
.price-hero .lede { color: rgba(23,18,79,.78); }
.builder { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 48px; align-items: start; padding: 88px var(--gutter); }
.builder-options { display: grid; gap: 30px; }
.builder fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 12px; }
.builder legend { font-weight: 600; margin-bottom: 12px; font-size: 17px; }
.choice { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.choice-row { grid-template-columns: repeat(auto-fill, minmax(180px, 240px)); }
.choice label { position: relative; cursor: pointer; }
.choice input { position: absolute; opacity: 0; }
.choice span { display: flex; justify-content: space-between; align-items: center; gap: 10px; height: 100%; padding: 16px 18px; border-radius: 16px; box-shadow: inset 0 0 0 1.5px #dddcee; font-weight: 500; transition: box-shadow .15s ease, background-color .15s ease; }
.choice em { font-style: normal; color: var(--muted); font-size: 14px; white-space: nowrap; }
.choice input:checked + span { background: var(--ink); color: #fff; box-shadow: none; }
.choice input:checked + span em { color: var(--yellow); }
.choice input:focus-visible + span { outline: 3px solid var(--blue); outline-offset: 2px; }
.labor-note { font-size: 15px; color: var(--muted); max-width: 52ch; }
.receipt { position: sticky; top: calc(var(--header) + 12px); display: grid; gap: 16px; padding: 30px; border-radius: 24px; background: var(--ink); color: #fff; }
.receipt-title { font-weight: 600; color: rgba(255,255,255,.6); font-size: 14px; }
.receipt dl { margin: 0; display: grid; gap: 10px; }
.receipt dl div { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 10px; border-bottom: 1px dashed rgba(255,255,255,.2); }
.receipt dt, .receipt dd { margin: 0; }
.receipt-total { display: flex; justify-content: space-between; align-items: baseline; }
.receipt-total strong { font: 600 clamp(38px, 3.6vw, 52px)/1 var(--display); letter-spacing: -0.03em; color: var(--yellow); font-variant-numeric: tabular-nums; }
.receipt-fine { font-size: 13px; color: rgba(255,255,255,.6); }
.price-table { padding: 0 var(--gutter) 88px; display: grid; gap: 22px; }
.price-table table { width: 100%; border-collapse: collapse; }
.price-table th { text-align: left; font-size: 14px; font-weight: 600; color: var(--muted); padding: 0 12px 12px 0; border-bottom: 2px solid var(--ink); }
.price-table td { padding: 16px 12px 16px 0; border-bottom: 1px solid #e4e3f2; font-size: 16px; }
.price-table td:first-child { font-weight: 600; }
.price-table td:last-child, .price-table th:last-child { text-align: right; padding-right: 0; font: 600 20px/1 var(--display); color: var(--blue); }
.price-table th:last-child { font: 600 14px var(--text); color: var(--muted); }
.heavy { display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; padding: 72px var(--gutter); background: var(--soft); }
.heavy h2 { font-size: clamp(20px, 1.8vw, 26px); margin-bottom: 12px; }
.heavy p { max-width: 52ch; }

/* About */
.about-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; padding: 0 var(--gutter) 96px; }
.about-copy { display: grid; gap: 20px; }
.about-copy h1 { font-size: clamp(32px, 3.8vw, 56px); }
.about-copy .lede { color: var(--muted); font-size: 18px; }
.facts { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.facts li { padding: 9px 16px; border-radius: 99px; background: var(--yellow); font-weight: 600; font-size: 15px; }
.about-photos { position: relative; height: min(620px, 70svh); }
.about-photos img { position: absolute; width: 50%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 20px; border: 6px solid #fff; box-shadow: 0 30px 60px -30px rgba(23,18,79,.55); }
.about-photos .p1 { left: 0; top: 6%; transform: rotate(-4deg); }
.about-photos .p2 { left: 28%; top: 0; z-index: 2; transform: rotate(2deg); }
.about-photos .p3 { right: 0; bottom: 0; transform: rotate(5deg); }
.route { padding: 96px var(--gutter); background: var(--ink); color: #fff; display: grid; gap: 48px; }
.route-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: end; }
.route-head p { color: rgba(255,255,255,.75); max-width: 44ch; }
.route-stops { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; position: relative; }
.route-stops::before { content: ""; position: absolute; left: 8%; right: 8%; top: 38%; border-top: 3px dashed rgba(244,214,58,.5); }
.route-stops li { position: relative; display: grid; gap: 10px; }
.route-stops img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 20px; }
.route-stops li:last-child img { filter: grayscale(.85); opacity: .75; }
.route-stops h3 { margin: 6px 0 0; font: 500 22px/1.2 var(--display); color: var(--yellow); }
.route-stops p { color: rgba(255,255,255,.75); }
.award { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; padding: 96px var(--gutter) 40px; }
.award img { border-radius: 18px; box-shadow: 0 30px 60px -34px rgba(23,18,79,.5); }
.award p { color: var(--muted); margin-top: 12px; }
.hauler { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 40px; align-items: center; margin: 56px var(--gutter) 96px; padding: 40px 48px; border-radius: 28px; background: var(--yellow); }
.hauler img { width: 150px; }
.hauler p { margin-top: 10px; max-width: 48ch; }

/* Gallery */
.gal { padding: 0 var(--gutter) 88px; display: grid; gap: 28px; }
.gal-head { display: grid; gap: 12px; }
.gal-head h1 { font-size: clamp(34px, 4.4vw, 64px); }
.gal-head p { color: var(--muted); }
.gal-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.gal-filter button { height: 40px; padding: 0 16px; border: 0; border-radius: 99px; background: var(--soft); color: var(--ink); font: 500 15px/1 var(--text); cursor: pointer; }
.gal-filter button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.gal-grid { list-style: none; margin: 0; padding: 0; columns: 4 240px; column-gap: 14px; }
.gal-grid li { break-inside: avoid; margin-bottom: 14px; }
.gal-grid li[hidden] { display: none; }
.gal-grid button { display: block; width: 100%; padding: 0; border: 0; border-radius: 16px; overflow: hidden; background: var(--soft); cursor: zoom-in; }
.gal-grid img { width: 100%; height: auto; transition: transform .35s ease; }
.gal-grid button:hover img { transform: scale(1.04); }
.lightbox { width: min(92vw, 1000px); max-height: 92vh; padding: 0; border: 0; border-radius: 22px; background: var(--ink); color: #fff; overflow: visible; }
.lightbox::backdrop { background: rgba(23,18,79,.85); backdrop-filter: blur(6px); }
.lightbox figure { margin: 0; }
.lightbox img { width: 100%; max-height: 80vh; object-fit: contain; border-radius: 22px 22px 0 0; background: #000; }
.lightbox figcaption { padding: 14px 20px 18px; font-size: 15px; }
.lb-close, .lb-nav { position: absolute; border: 0; border-radius: 99px; background: #fff; color: var(--ink); font: 600 14px/1 var(--text); height: 40px; padding: 0 16px; cursor: pointer; }
.lb-close { top: -52px; right: 0; }
.lb-prev { bottom: 10px; right: 104px; }
.lb-next { bottom: 10px; right: 16px; }

/* Contact */
.contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding: 0 var(--gutter) 96px; background: var(--yellow); }
.contact-copy { display: grid; gap: 18px; align-content: start; justify-items: start; }
.contact-copy h1 { font-size: clamp(32px, 3.8vw, 56px); }
.contact-copy .lede { color: rgba(23,18,79,.78); }
.big-phone { font: 600 clamp(36px, 4.6vw, 68px)/1 var(--display); letter-spacing: -0.03em; color: var(--ink); text-decoration: none; }
.contact-facts { margin: 16px 0 0; display: grid; gap: 10px; }
.contact-facts div { display: grid; grid-template-columns: 70px 1fr; gap: 12px; }
.contact-facts dt { font-weight: 600; }
.contact-facts dd { margin: 0; }
.contact-form { display: grid; gap: 14px; align-content: start; padding: 28px; border-radius: 26px; background: #fff; box-shadow: 0 30px 60px -34px rgba(23,18,79,.5); }
.contact-form h2 { font-size: 22px; }
.contact-form iframe { width: 100%; height: 720px; border: 0; }
.area-contact { padding: 88px var(--gutter); }

/* Tablet */
@media (max-width: 1080px) {
  .show { grid-template-columns: 1fr; min-height: 0; gap: 24px; padding-left: 0; padding-right: 0; }
  .show-side { padding: 0 var(--gutter); }
  .show-list { display: none; }
  .show-stage { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 var(--gutter) 8px; border-radius: 0; background: none; box-shadow: none; min-height: 0; scrollbar-width: none; }
  .show-stage::-webkit-scrollbar { display: none; }
  .slide { position: relative; flex: 0 0 min(78vw, 460px); aspect-ratio: 4 / 5; opacity: 1; border-radius: 22px; overflow: hidden; scroll-snap-align: center; }
  .slide img { transform: none; }
  .slide-copy { left: 20px; right: 20px; bottom: 20px; }
  .slide-line { font-size: 15px; }
  .slide-name { font-size: 26px; }
  .slide-go { height: 38px; padding: 0 16px; font-size: 14px; margin-top: 6px; }
  .svc-extra-band { padding: 32px var(--gutter) 104px; }
  .svc-hero, .svc-body, .svc-price, .svc-proof, .dont, .walk, .price-hero, .builder, .heavy, .about-hero, .route-head, .award, .contact { grid-template-columns: 1fr; }
  .walk-phone { display: none; }
  .walk-steps li { min-height: 0; padding-top: 22px; padding-bottom: 22px; opacity: 1; }
  .receipt { position: static; }
  .end-links { grid-template-columns: 1fr 1fr; }
  .end-links > div { grid-column: 1 / -1; }
}

/* Phone */
@media (max-width: 640px) {
  .page-take .ask, .page-how .how-intro, .page-about .about-hero,
  .page-gallery .gal, .page-contact .contact, .page-pricing .price-hero, .page-service .svc-hero { padding-top: calc(var(--header) + 20px); }
  .take-cta { padding: 64px var(--gutter) 96px; }
  .svc-hero { gap: 32px; padding-bottom: 48px; }
  .from { left: auto; right: 12px; bottom: -22px; width: 88px; height: 88px; font-size: 22px; }
  .svc-body { gap: 32px; padding: 64px var(--gutter); }
  .svc-price { margin: 0; border-radius: 0; padding: 48px var(--gutter); gap: 24px; }
  .svc-proof { gap: 32px; padding: 64px var(--gutter); }
  .svc-real img { aspect-ratio: 1; }
  .svc-more { padding-bottom: 72px; }
  .ask { min-height: 0; padding-bottom: 56px; gap: 16px; }
  .ask-form input { padding: 14px 18px; border-radius: 16px; }
  .answer { font-size: 16px; }
  .wall { padding: 56px var(--gutter); }
  .wall-list li { padding: 9px 14px; }
  .dont { margin: 0 0 0; border-radius: 0; padding: 48px var(--gutter); gap: 24px; }
  .walk { padding-bottom: 64px; }
  .walk-steps li { padding-left: 64px; }
  .walk-steps li::before { width: 44px; height: 44px; font-size: 18px; }
  .price-hero { padding-bottom: 48px; gap: 24px; }
  .builder { padding: 56px var(--gutter); gap: 32px; }
  .choice, .choice-row { grid-template-columns: 1fr; }
  .price-table { padding-bottom: 56px; }
  .price-table th:nth-child(3), .price-table td:nth-child(3) { display: none; }
  .heavy { padding: 56px var(--gutter); gap: 28px; }
  .about-hero { padding-bottom: 64px; gap: 32px; }
  .about-photos { height: 420px; }
  .route { padding: 64px var(--gutter); gap: 32px; }
  .route-stops { grid-template-columns: 1fr; gap: 28px; }
  .route-stops::before { left: 20px; right: auto; top: 0; bottom: 0; border-top: 0; border-left: 3px dashed rgba(244,214,58,.5); }
  .award { padding: 64px var(--gutter) 24px; gap: 24px; }
  .hauler { grid-template-columns: 1fr; margin: 40px 0 0; border-radius: 0; padding: 40px var(--gutter); gap: 16px; }
  .hauler img { width: 110px; }
  .gal-grid { columns: 2; column-gap: 10px; }
  .gal-grid li { margin-bottom: 10px; }
  .lb-close { top: 10px; right: 10px; }
  .contact { padding-bottom: 56px; gap: 32px; }
  .contact-form { order: -1; }
  .contact-form { padding: 16px; margin: 0 calc(var(--gutter) * -0.5); }
  .area-contact { padding: 56px var(--gutter); }
  .end-links { grid-template-columns: 1fr; gap: 28px; }
}