/* AMC inner-page components. Brand tokens come from style.css + amc.css:
   --plum #12283c (navy), --orange #236fae (brand blue, action), --line, --muted. */

.wrap.narrow { max-width: 820px; }
.section { padding: clamp(2.4rem, 5vw, 4rem) 0; }
.band--snug { padding-top: clamp(1.6rem, 4vw, 2.6rem); }
.section-head { margin-bottom: 1.6rem; }
.section-head.center { text-align: center; max-width: 760px; margin-left: auto; margin-right: auto; }
.lede { font-size: clamp(1.05rem, 1.6vw, 1.2rem); color: var(--muted); line-height: 1.6; }
.prose h2 { margin: 1.8rem 0 .6rem; }
.prose h3 { margin: 1.4rem 0 .4rem; }
.prose p { color: #333b42; line-height: 1.7; margin: 0 0 1rem; }
.center { text-align: center; }

/* breadcrumbs */
.crumbs { padding: .8rem 0 0; font-size: .85rem; color: var(--muted); }
.crumbs a { color: var(--orange); text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.crumb-sep { opacity: .5; margin: 0 .1rem; }

/* CTA pairs reused from homepage .cta-pair; ensure spacing on inner pages */
.cta-pair { display: flex; flex-wrap: wrap; gap: 12px 14px; margin-top: 1.4rem; }
@media (max-width: 640px) { .cta-pair .btn { width: 100%; } }
.link-row { display: flex; flex-wrap: wrap; gap: .5rem .9rem; }
.link-row a { color: var(--orange); font-weight: 600; }

/* size page hero */
.size-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: center; }
.size-hero h1 { line-height: 1.1; }
.size-render-lg { width: 100%; height: auto; display: block; }
@media (max-width: 820px) { .size-hero { grid-template-columns: 1fr; } .size-render-lg { max-width: 460px; margin: 0 auto; } }

/* size switcher pills */
.size-switch { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 1.2rem 0; }
.size-switch .ss-label { font-weight: 700; font-size: .9rem; color: var(--muted); }
.size-switch a, .size-switch .ss-cur { font-family: "Archivo", sans-serif; font-weight: 700; font-size: .9rem;
  padding: .4rem .8rem; border-radius: 6px; border: 2px solid var(--plum); text-decoration: none; }
.size-switch a { color: var(--plum); background: #fff; }
.size-switch a:hover { background: var(--plum); color: #fff; }
.size-switch .ss-cur { background: var(--orange); color: #fff; border-color: var(--orange); }

/* pros / cons */
.proscons { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; margin-top: 1rem; }
@media (max-width: 700px) { .proscons { grid-template-columns: 1fr; } }
.pc { border: 1px solid var(--line); border-radius: 12px; padding: 1.2rem 1.3rem; background: #fff; }
.pc h3 { margin: 0 0 .6rem; font-size: 1.05rem; }
.pc ul { margin: 0; padding-left: 1.1rem; }
.pc li { margin: .35rem 0; line-height: 1.5; color: #333b42; }
.pc-yes { box-shadow: 4px 4px 0 var(--line); }
.pc-yes h3::before { content: "\2713  "; color: #2e7d32; }
.pc-no h3::before { content: "\2717  "; color: #b23b2e; }

/* services hub grid */
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
@media (max-width: 900px) { .svc-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .svc-grid { grid-template-columns: 1fr; } }
.svc-card { display: block; background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 1.4rem 1.4rem 1.2rem; text-decoration: none; color: inherit; box-shadow: 4px 4px 0 var(--line);
  transition: transform .12s ease, box-shadow .12s ease; }
.svc-card:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--orange); }
.svc-card h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
.svc-card p { color: var(--muted); line-height: 1.55; margin: 0 0 .7rem; font-size: .95rem; }
.svc-more { color: var(--orange); font-weight: 700; font-size: .9rem; }

/* reviews reuse the homepage .rev-strip / .rev-card component from style.css.
   With three cards the desktop grid fills exactly; mobile swipes. */

/* outlined secondary button: same size as the primary, outlined not shrunken */
.btn-more { display: inline-block; padding: .8rem 1.5rem; border: 2px solid var(--plum);
  border-radius: 8px; background: #fff; color: var(--plum); font-family: "Archivo", sans-serif;
  font-weight: 700; font-size: 1rem; text-decoration: none; white-space: normal; }
.btn-more:hover { background: var(--plum); color: #fff; }

/* card-grid CTA for the undecided (sizes hub, services hub) */
.size-grid-cta { text-align: center; margin-top: 1.8rem; }
.size-grid-cta p { color: var(--muted); margin: 0 0 .8rem; }

/* what-goes-in table */
.haul-table-wrap { overflow-x: auto; margin: 1rem 0 1.4rem; }
.haul-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.haul-table th { font-family: "Archivo", sans-serif; font-size: .95rem; text-align: left; padding: .7rem .9rem; background: var(--plum); color: #fff; }
.haul-table th + th { border-left: 1px solid rgba(255,255,255,.2); }
.haul-table td { padding: .55rem .9rem; border-top: 1px solid var(--line); color: #333b42; font-size: .95rem; width: 50%; }
.haul-table td + td { border-left: 1px solid var(--line); color: #7a4a42; }

/* town hero spec panel: dark glass so it holds up over the brightest photo */
.hero-spec { display: inline-flex; flex-wrap: wrap; gap: .5rem .6rem; margin-top: 1.1rem;
  padding: .65rem .8rem; border-radius: 10px; background: rgba(11,11,11,.46);
  border: 1px solid rgba(255,255,255,.25); }
.hero-spec span { font-size: .85rem; font-weight: 600; color: #fff; white-space: nowrap; }
.hero-spec span + span::before { content: "\00b7"; margin-right: .6rem; opacity: .6; }
@media (max-width: 560px) { .hero-spec span { white-space: normal; } }

/* areas hub */
.area-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
@media (max-width: 760px) { .area-grid { grid-template-columns: 1fr; } }
.area-card { border: 1px solid var(--line); border-radius: 12px; padding: 1.3rem 1.4rem; background: #fff; box-shadow: 4px 4px 0 var(--line); }
.area-card h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.area-card h3 a { color: var(--plum); text-decoration: none; }
.area-card p { color: var(--muted); line-height: 1.55; margin: 0 0 .7rem; font-size: .95rem; }
.area-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ac-photo { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; display: block; }
.ac-body { padding: 1.1rem 1.3rem 1.3rem; display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; flex: 1; }
.ac-body p { margin: 0; }
.ac-body .btn { margin-top: auto; }
.ac-meta { font-family: "Archivo", sans-serif; font-weight: 700; font-size: .76rem; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.area-more { color: var(--orange); font-weight: 700; font-size: .9rem; }
.county-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin: 1.2rem 0 1.6rem; }
@media (max-width: 820px) { .county-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .county-grid { grid-template-columns: 1fr; } }
.county-block h3 { font-size: 1rem; margin: 0 0 .5rem; }
.town-pills { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.town-pills li { display: inline-flex; align-items: center; font-family: "Archivo", sans-serif;
  font-weight: 600; font-size: .95rem; line-height: 1; padding: .55rem 1.05rem; border-radius: 999px;
  background: #fff; border: 1px solid var(--line); color: var(--muted); cursor: default; }
.town-pills li a { color: var(--orange); text-decoration: none; }
.town-pills.overflow { margin-top: .6rem; }

/* town hero (reuses homepage .hero / .hero-bg / .hero-overlay / .hero-accent) */
.town-hero { min-height: clamp(340px, 52vh, 460px); display: flex; align-items: center; }
.town-hero .hero-content { padding: 2rem 0; }
.hero-neighbors { margin-top: 1rem; font-size: .9rem; color: rgba(255,255,255,.85); }
.hero-neighbors a { color: #edca56; }

/* about / contact split */
.split { display: grid; grid-template-columns: 1.4fr .9fr; gap: 2.2rem; align-items: start; }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; } }
.about-facts img { width: 100%; height: auto; border-radius: 12px; display: block; margin-bottom: 1rem; }
.about-facts ul { list-style: none; margin: 0; padding: 0; }
.about-facts li { padding: .55rem 0; border-bottom: 1px solid var(--line); color: #333b42; }
.about-facts li:last-child { border-bottom: 0; }
.about-facts strong { color: var(--plum); }

/* faq (reuses homepage .faq details/summary styling) */
.faq-q { display: inline; font-size: 1.02rem; margin: 0; }

/* nav toggle (hamburger) for inner pages — mobile only */
.nav-toggle { display: none; }
@media (max-width: 900px) {
  .nav-toggle { display: inline-flex; flex-direction: column; gap: 4px; cursor: pointer; padding: .4rem; min-width: 48px; min-height: 48px; align-items: center; justify-content: center; }
  .nav-toggle span { width: 22px; height: 2px; background: var(--plum); display: block; }
  .site-header .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff;
    flex-direction: column; padding: .5rem 1.2rem 1rem; box-shadow: 0 12px 24px -12px rgba(0,0,0,.3); }
  .nav-toggle-cb:checked ~ .nav { display: flex; }
  .site-header { position: relative; }
  .site-header .nav a { padding: .7rem 0; border-bottom: 1px solid var(--line); }
}

/* town-page deep section + map */
.job-list { list-style: none; margin: .6rem 0 1.2rem; padding: 0; }
.job-list li { padding: .5rem .9rem; border-left: 3px solid var(--orange); background: #fff;
  margin-bottom: .5rem; border-radius: 0 8px 8px 0; line-height: 1.55; color: #333b42; }
.town-map { height: 340px; border-radius: 12px; border: 1px solid var(--line); margin: 1rem 0 .6rem; background: #eef3f7; }
.map-note { font-size: .9rem; color: var(--muted); }

/* design pass b3: deep-section columns, coverage map, card polish */
.deep-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
@media (max-width: 760px) { .deep-cols { grid-template-columns: 1fr; } }
.town-map-lg { height: 440px; }
@media (max-width: 640px) { .town-map-lg { height: 340px; } }
.pc-no { box-shadow: 4px 4px 0 var(--line); }
.size-card .size-top { text-decoration: none; display: block; }
.size-card .size-render-wrap { display: block; }

/* compliance pass b4: sticky mobile call bar + lead form */
.callpill { display: none; }
@media (max-width: 760px) {
  .callpill { position: fixed; right: 14px; bottom: calc(14px + env(safe-area-inset-bottom));
    z-index: 60; display: inline-flex; align-items: center; gap: .5rem;
    min-height: 52px; padding: 0 1.3rem; border-radius: 999px;
    background: var(--orange); color: #fff; font-family: "Archivo", sans-serif;
    font-weight: 700; font-size: 1.02rem; text-decoration: none;
    box-shadow: 0 10px 24px -8px rgba(18, 40, 60, .55); }
  .callpill:active { transform: scale(.97); }
  body { padding-bottom: 76px; }
}
.lead-form { max-width: 460px; }
.lead-form p { margin: 0 0 .9rem; }
.lead-form label { display: block; font-weight: 700; font-size: .92rem; margin-bottom: .3rem; color: var(--plum); }
.lead-form input, .lead-form textarea { width: 100%; font-size: 16px; padding: .65rem .75rem;
  border: 2px solid var(--line); border-radius: 8px; font-family: inherit; background: #fff; box-sizing: border-box; }
.lead-form input:focus, .lead-form textarea:focus { outline: none; border-color: var(--orange); }
.lead-form button { margin-top: .2rem; }
.hp-field { position: absolute !important; left: -9999px; }

/* b6: areas-hub hero with map, size chart, footer social */
.areas-hero { display: grid; grid-template-columns: 1.05fr 1fr; gap: 2.4rem; align-items: center; }
@media (max-width: 900px) { .areas-hero { grid-template-columns: 1fr; } }
.town-map-hero { height: 430px; margin: 0 0 .5rem; box-shadow: 4px 4px 0 var(--line); }
@media (max-width: 640px) { .town-map-hero { height: 320px; } }
.reviews-badge.badge-left { margin: 1.1rem 0 0; }
.size-chart td, .size-chart th { width: auto; font-size: .92rem; }
.size-chart td, .size-chart td + td { color: #333b42; }
.size-chart td:first-child { white-space: nowrap; }
.size-chart th { white-space: nowrap; }
.size-chart tbody tr:nth-child(even) td { background: #f5f8fb; }
.size-chart .row-cur td, .size-chart .row-cur:nth-child(even) td { background: #eef3f9; font-weight: 700; }
.size-chart a { color: var(--orange); font-weight: 700; text-decoration: none; }
.size-chart a:hover { text-decoration: underline; }
.footer-social a { color: #cfd8e3; }

/* haul cards: green/red accent edges to carry the in/out read at a glance */
.haul-cards .pc-yes { border-top: 3px solid #2e7d32; }
.haul-cards .pc-no { border-top: 3px solid #b23b2e; }
.haul-cards .pc li { padding-left: .1rem; }

/* b7: kill pill-in-pill (linked towns: the anchor carries the capsule) */
.town-pills li:has(a) { background: none; border: 0; padding: 0; font: inherit; }
.area-pills .town-pills { gap: .55rem; }

/* b7: sticky about aside, homepage photo strip, services link row */
@media (min-width: 861px) { .split aside { position: sticky; top: 96px; } }
.about-facts img + ul { margin-bottom: 1rem; }
.photo-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; }
@media (max-width: 760px) { .photo-strip { grid-template-columns: 1fr 1fr; gap: .6rem; } }
.photo-strip img { width: 100%; height: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: 10px; border: 1px solid var(--line); display: block; }
.svc-links { text-align: center; margin-top: 1rem; color: var(--muted); font-size: .95rem; }
.svc-links a { color: var(--orange); font-weight: 600; }

/* b9: services-hub audience split */
.duo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; margin-top: 1.4rem; }
@media (max-width: 760px) { .duo-grid { grid-template-columns: 1fr; } }
.duo-grid h3 { font-size: 1.15rem; }

/* b9: in-body photos */
.body-photo { width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--line);
  display: block; margin: 0 0 1.4rem; }

/* homepage how-it-works */
.steps3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.step-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1.25rem 1.35rem; box-shadow: 4px 4px 0 var(--line); }
.step-card h3 { margin: .35rem 0 .4rem; font-size: 1.08rem; }
.step-card p { margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.55; }
.step-n { font-family: "Archivo", sans-serif; font-weight: 900; font-size: 1.7rem; line-height: 1; color: var(--orange-dk); }
@media (max-width: 760px) { .steps3 { grid-template-columns: 1fr; } }

/* areas hub: Scribby's-pattern centered hero, town finder, region cards */
.hero-center .hero-content { text-align: center; max-width: 880px; margin-inline: auto; }
.hero-center .hero-cta { justify-content: center; }
.hero-center .hero-spec { margin-inline: auto; }
.finder-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 2rem; align-items: start; }
@media (max-width: 900px) { .finder-layout { grid-template-columns: 1fr; } }
.town-finder { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1.4rem 1.5rem; box-shadow: 4px 4px 0 var(--line); }
.tf-label { display: block; font-family: "Archivo", sans-serif; font-weight: 800; font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; color: var(--plum); margin-bottom: .6rem; }
.town-finder input { width: 100%; box-sizing: border-box; font: inherit; font-size: 1.05rem; padding: .85rem 1rem; border: 2px solid var(--plum); border-radius: 8px; }
.town-finder input:focus { outline: 2px solid var(--orange); outline-offset: 1px; }
.tf-results { list-style: none; margin: .6rem 0 0; padding: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.tf-results li + li { border-top: 1px solid var(--line); }
.tf-results a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .7rem 1rem; text-decoration: none; color: var(--ink); font-weight: 600; }
.tf-results a:hover { background: #f2f6fa; }
.tf-go { font-size: .82rem; font-weight: 700; color: var(--orange); white-space: nowrap; }
.tf-empty { margin: .8rem 0 0; color: var(--muted); }
.tf-note { margin: 1rem 0 0; font-size: .88rem; color: var(--muted); line-height: 1.5; }
.region-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; margin-top: 1.4rem; }
@media (max-width: 980px) { .region-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .region-grid { grid-template-columns: 1fr; } }
.region-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: 4px 4px 0 var(--line); display: flex; flex-direction: column; }
.region-card h3 { margin: 0; background: var(--plum); color: #fff; font-size: 1.02rem; padding: .85rem 1.2rem; }
.rc-body { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; flex: 1; }
.rc-body > p { margin: 0 0 .9rem; color: var(--muted); font-size: .93rem; line-height: 1.5; }
.rc-towns { list-style: none; margin: 0 0 1.1rem; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .8rem; }
.rc-towns li { font-size: .95rem; font-weight: 600; color: #333b42; padding-left: 1.15rem; position: relative; }
.rc-towns li::before { content: "\2713"; position: absolute; left: 0; color: var(--orange-dk); font-weight: 900; }
.rc-towns a { color: var(--orange); text-decoration: none; }
.rc-towns a:hover { text-decoration: underline; }
.rc-hq { display: inline-block; font-family: "Archivo", sans-serif; font-size: .68rem; font-weight: 900; letter-spacing: .06em; background: var(--orange-dk); color: #fff; border-radius: 4px; padding: .1rem .35rem; vertical-align: 1px; margin-left: .25rem; }
.rc-body .btn { margin-top: auto; align-self: flex-start; }

/* duo cards (services hub) share .area-card but have no photo — restore padding */
.duo-grid .area-card { padding: 1.5rem 1.6rem 1.6rem; display: block; }
.duo-grid .area-card h3 { margin: 0 0 .6rem; }
.duo-grid .area-card p { margin: 0 0 1.1rem; }

/* coverage map HQ chip (Scribby's pattern) */
.map-hq { background: #12283c; color: #fff; border: 2px solid #fff; border-radius: 6px;
  font-family: "Archivo", sans-serif; font-weight: 900; font-size: .72rem; letter-spacing: .06em;
  display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,.35); }