/* Industries hub + industry pages (concepts C08, C09), written by tools/build_industry_pages.py.
   Loads after site.css (header, buttons, .eyebrow2, .h2md, .h2cta, .cta, .tile2, .av, footer) and catalog.css (.cathero hero,
   .pc product cards). Desktop is sized in --u (1536 reference); phones and tablets in px with 16px / 32px side gutters, at the end. */

.ivh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ibody { padding: 0 calc(57 * var(--u)) calc(60 * var(--u)); }
.isec { margin-top: calc(54 * var(--u)); }
.isec:first-child { margin-top: calc(26 * var(--u)); }
.ihead { display: flex; align-items: flex-end; justify-content: space-between; gap: calc(20 * var(--u)); margin-bottom: calc(18 * var(--u)); }
.ihead__ctl { display: flex; align-items: center; gap: calc(16 * var(--u)); }
.ilink { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); font-size: calc(13.6 * var(--u)); font-weight: 600; color: #1c1b19; white-space: nowrap; }
.ilink .arr { width: calc(13 * var(--u)); height: calc(13 * var(--u)); transition: transform .2s; }
.ilink:hover .arr { transform: translateX(3px); }

/* ---------- what they wear: the catalog's own cards in a scrolling row ---------- */
.irail {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc(207 * var(--u)); gap: calc(12 * var(--u));
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: calc(4 * var(--u)) calc(2 * var(--u)) calc(16 * var(--u));
  margin: 0 calc(-2 * var(--u));
}
.irail::-webkit-scrollbar { display: none; }
.irail:focus-visible { outline: 2px solid #111; outline-offset: 4px; border-radius: 10px; }
.irail .pc { scroll-snap-align: start; }
.irail .pc__img { height: calc(176 * var(--u)); }
.pc__add.is-added { background: #111; }
.pc__add.is-added::before, .pc__add.is-added::after { background: #fff; }
.pc__add.is-added::after { transform: translate(-50%, -50%) rotate(90deg) scaleX(0); }
.irail__btns { display: flex; gap: calc(8 * var(--u)); }
.irail__btn {
  width: calc(38 * var(--u)); height: calc(38 * var(--u)); border-radius: 50%; display: grid; place-items: center;
  background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 4px 12px rgba(60,50,40,.08); transition: background .2s, color .2s;
}
.irail__btn .arr { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }
.irail__btn:hover { background: #111; color: #fff; }
.irail__btn[disabled] { opacity: .35; pointer-events: none; }

/* ---------- where logos go: line drawings with the spot lit ---------- */
.iplaces { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(14 * var(--u)); }
.iplace a {
  display: flex; flex-direction: column; height: 100%; padding: calc(18 * var(--u)) calc(20 * var(--u)) calc(20 * var(--u));
  border-radius: calc(12 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05);
  transition: box-shadow .25s, transform .25s;
}
.iplace a:hover, .iplace a:focus-visible { box-shadow: 0 12px 28px rgba(40,34,28,.12); transform: translateY(-2px); }
.iplace__fig { display: block; height: calc(150 * var(--u)); margin-bottom: calc(10 * var(--u)); }
.iplace__fig svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ifig__b { fill: #fff; stroke: #2b2926; stroke-width: 1.6; stroke-linejoin: round; }
.ifig__l { fill: none; stroke: #2b2926; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; opacity: .55; }
.ifig__hi { fill: rgba(196,83,47,.16); stroke: #c4532f; stroke-width: 2; stroke-dasharray: 5 3; }
@media (prefers-reduced-motion: no-preference) {
  .ifig__hi { animation: ifig-pulse 2.4s ease-in-out infinite; }
  @keyframes ifig-pulse { 0%, 100% { fill: rgba(196,83,47,.12); } 50% { fill: rgba(196,83,47,.34); } }
}
.iplace__t { font-family: var(--display); font-size: calc(17 * var(--u)); font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: #111; }
.iplace__x { margin-top: calc(6 * var(--u)); font-size: calc(13.6 * var(--u)); line-height: calc(20 * var(--u)); color: #57544f; }
.iplace__go { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); margin-top: auto; padding-top: calc(14 * var(--u)); font-size: calc(13 * var(--u)); font-weight: 600; color: #1c1b19; }
.iplace__go .arr { width: calc(12 * var(--u)); height: calc(12 * var(--u)); transition: transform .2s; }
.iplace a:hover .iplace__go .arr { transform: translateX(3px); }

/* ---------- his jobs: muted photo, colour on hover / in view ---------- */
.ijobs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(16 * var(--u)); }
.ijobs--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ijobs--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ijob a { display: block; }
.ijob__ph { position: relative; display: block; height: calc(300 * var(--u)); border-radius: calc(12 * var(--u)); overflow: hidden; background: #d9d5ce; transform: translateZ(0); }
.ijobs--2 .ijob__ph { height: calc(400 * var(--u)); }
.ijobs--4 .ijob__ph { height: calc(270 * var(--u)); }
.ijob__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .7s ease, transform .9s cubic-bezier(.2, .8, .2, 1); }
.ijob__ph img.is-color { opacity: 0; }
.ijob a:hover .ijob__ph img, .ijob a:focus-visible .ijob__ph img { transform: scale(1.04); }
.ijob a:hover .ijob__ph img.is-color, .ijob a:focus-visible .ijob__ph img.is-color, .ijob.is-shown .ijob__ph img.is-color { opacity: 1; }
.ijob__cap { display: block; margin-top: calc(12 * var(--u)); font-size: calc(14.4 * var(--u)); font-weight: 600; color: #151515; }
.ijob__go { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); margin-top: calc(4 * var(--u)); font-size: calc(12.8 * var(--u)); color: #66635d; transition: color .2s; }
.ijob__go .arr { width: calc(11 * var(--u)); height: calc(11 * var(--u)); }
.ijob a:hover .ijob__go { color: #111; }

/* ---------- a customer's words ---------- */
.iquote { margin: 0; padding: calc(34 * var(--u)) calc(44 * var(--u)) calc(30 * var(--u)); border-radius: calc(14 * var(--u));
  background: radial-gradient(ellipse 60% 120% at 70% 0%, #1f1e1d 0%, #0f0f0f 60%, #0b0b0b 100%); }
.iquote blockquote { margin: 0; font-size: calc(24 * var(--u)); line-height: calc(34 * var(--u)); color: #ecebe8; max-width: calc(980 * var(--u)); }
.iquote figcaption { display: grid; grid-template-columns: auto 1fr; column-gap: calc(14 * var(--u)); align-items: center; margin-top: calc(22 * var(--u)); }
.iquote figcaption b { font-size: calc(15.2 * var(--u)); font-weight: 600; color: #f4f3f0; }
.iquote figcaption span:last-child { font-size: calc(13.4 * var(--u)); color: #9a9792; }
.iquotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(14 * var(--u)); }
.iquotes .iquote { padding: calc(28 * var(--u)) calc(32 * var(--u)) calc(26 * var(--u)); }
.iquotes .iquote blockquote { font-size: calc(18.6 * var(--u)); line-height: calc(28 * var(--u)); }

/* ---------- who else ---------- */
.iother { display: flex; flex-wrap: wrap; align-items: center; gap: calc(8 * var(--u)); margin-top: calc(48 * var(--u)); padding-top: calc(26 * var(--u)); border-top: 1px solid #d6d2ca; }
.iother__label { margin-right: calc(8 * var(--u)); font-family: var(--display); font-size: calc(12.4 * var(--u)); letter-spacing: .14em; text-transform: uppercase; color: #66635d; }
.iother__chip { display: inline-flex; align-items: center; height: calc(38 * var(--u)); padding: 0 calc(16 * var(--u)); border-radius: 999px; background: #fff;
  border: 1px solid #e2dfd9; font-size: calc(13.6 * var(--u)); font-weight: 500; transition: background .2s, color .2s, border-color .2s; }
.iother__chip:hover { background: #111; border-color: #111; color: #fff; }

/* ---------- hub: customer-type tiles (the home tiles, bigger) ---------- */
.itiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(26 * var(--u)) calc(14 * var(--u)); }
.itile.tile2 { display: block; }
.itile .tile2__img { height: calc(250 * var(--u)); }
.itile b { margin-top: calc(14 * var(--u)); padding-left: calc(4 * var(--u)); font-size: calc(14.4 * var(--u)); }
.itile__go { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); margin-top: calc(4 * var(--u)); padding-left: calc(4 * var(--u)); font-size: calc(12.8 * var(--u)); color: #66635d; transition: color .2s; }
.itile__go .arr { width: calc(11 * var(--u)); height: calc(11 * var(--u)); }
.itile:hover .itile__go { color: #111; }

/* hub: what we make for each */
.imake { display: grid; gap: calc(10 * var(--u)); }
.imake__row { display: grid; grid-template-columns: calc(330 * var(--u)) 1fr; align-items: center; gap: calc(16 * var(--u)); padding: calc(12 * var(--u)) calc(14 * var(--u)) calc(12 * var(--u)) calc(24 * var(--u));
  border-radius: calc(12 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f4f3f0 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.imake__name { display: flex; flex-direction: column; }
.imake__name b { font-family: "Inter", system-ui, sans-serif; font-size: calc(22 * var(--u)); font-weight: 800; text-transform: uppercase; line-height: 1.05; color: #0c0c0c; }
.imake__name span { margin-top: calc(6 * var(--u)); font-size: calc(13.6 * var(--u)); color: #57544f; }
.imake__name em { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); margin-top: calc(12 * var(--u)); font-style: normal; font-size: calc(12.8 * var(--u)); font-weight: 600; color: #1c1b19; }
.imake__name em .arr { width: calc(11 * var(--u)); height: calc(11 * var(--u)); transition: transform .2s; }
.imake__name:hover em .arr { transform: translateX(3px); }
.imake__ps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(10 * var(--u)); }
.imake__p { display: grid; place-items: center; height: calc(132 * var(--u)); border-radius: calc(9 * var(--u)); background: #f8f7f4; transition: box-shadow .2s, transform .2s; }
.imake__p:hover { box-shadow: 0 8px 22px rgba(40,34,28,.12); transform: translateY(-2px); }
.imake__p img { max-width: 82%; max-height: calc(118 * var(--u)); object-fit: contain; mix-blend-mode: multiply; }

/* ===================== phones + tablets (px) ===================== */
@media (max-width: 1179px) {
  .ibody { padding: 0 16px 44px; }
  .isec { margin-top: 40px; }
  .isec:first-child { margin-top: 22px; }
  .ihead { flex-wrap: wrap; align-items: flex-end; gap: 10px; margin-bottom: 14px; }
  .ihead__ctl { gap: 12px; }
  .ilink { font-size: 14px; gap: 6px; }
  .ilink .arr { width: 13px; height: 13px; }
  .irail { grid-auto-columns: 46%; gap: 10px; padding: 2px 16px 12px; margin: 0 -16px; scroll-padding: 0 16px; }
  .irail .pc__img { height: 150px; }
  .irail__btns { display: none; }
  .iplaces { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .iplace a { padding: 14px 14px 16px; border-radius: 12px; }
  .iplace__fig { height: 104px; margin-bottom: 8px; }
  .iplace__t { font-size: 15px; }
  .iplace__x { font-size: 13.5px; line-height: 19px; margin-top: 4px; }
  .iplace__go { font-size: 13px; padding-top: 10px; gap: 6px; }
  .iplace__go .arr { width: 12px; height: 12px; }
  .ijobs, .ijobs--2, .ijobs--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 10px; }
  .ijob__ph, .ijobs--2 .ijob__ph, .ijobs--4 .ijob__ph { height: auto; aspect-ratio: 1; border-radius: 10px; }
  .ijob__cap { font-size: 14px; margin-top: 8px; }
  .ijob__go { font-size: 13px; }
  .ijob__go .arr { width: 11px; height: 11px; }
  .iquote { padding: 24px 20px 20px; border-radius: 12px; }
  .iquote blockquote, .iquotes .iquote blockquote { font-size: 18px; line-height: 27px; }
  .iquote figcaption { column-gap: 12px; margin-top: 16px; }
  .iquote figcaption b { font-size: 15px; }
  .iquote figcaption span:last-child { font-size: 13px; }
  .iquotes { grid-template-columns: 1fr; gap: 10px; }
  .iquotes .iquote { padding: 22px 20px 20px; }
  .iother { gap: 8px; margin-top: 36px; padding-top: 20px; }
  .iother__label { flex-basis: 100%; margin: 0 0 2px; font-size: 11.5px; }
  .iother__chip { height: 40px; padding: 0 15px; font-size: 14px; }
  .itiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 10px; }
  .itile .tile2__img { height: auto; aspect-ratio: 239 / 200; border-radius: 10px; }
  .itile b { font-size: 13px; margin-top: 10px; padding-left: 2px; }
  .itile__go { font-size: 13px; padding-left: 2px; }
  .imake { gap: 10px; }
  .imake__row { grid-template-columns: 1fr; gap: 12px; padding: 16px 14px 14px; border-radius: 12px; }
  .imake__name b { font-size: 19px; }
  .imake__name span { font-size: 14px; margin-top: 4px; }
  .imake__name em { font-size: 13px; margin-top: 8px; }
  .imake__ps { gap: 6px; }
  .imake__p { height: 78px; border-radius: 8px; }
  .imake__p img { max-height: 68px; }
}
@media (min-width: 640px) and (max-width: 1179px) {
  .ibody { padding: 0 32px 52px; }
  .irail { grid-auto-columns: 30%; padding: 2px 32px 12px; margin: 0 -32px; scroll-padding: 0 32px; }
  .iplaces { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ijobs, .ijobs--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ijobs--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .itiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .iquotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .imake__row { grid-template-columns: 230px 1fr; align-items: center; }
  .imake__p { height: 96px; }
  .imake__p img { max-height: 84px; }
}

/* ===================== AREA PAGES (/areas/, concept C15): his region from OpenStreetMap, the way in along the roads ===================== */
.amap { display: block; width: 100%; height: 100%; }
.amap--tall, .amap--mid { display: none; }
.amap__credit { position: absolute; z-index: 2; right: calc(12 * var(--u)); bottom: calc(10 * var(--u)); padding: calc(2 * var(--u)) calc(8 * var(--u)); border-radius: calc(6 * var(--u));
  background: rgba(255,255,255,.78); font-size: calc(10.5 * var(--u)); color: #57544f; }
.amap__credit a { text-decoration: underline; }
.amhero { position: relative; height: calc(560 * var(--u)); overflow: hidden; background: #f2efe8; }
.amhero__map { position: absolute; inset: 0; }
.amhero__card { position: absolute; z-index: 2; left: calc(57 * var(--u)); top: calc(40 * var(--u)); width: calc(600 * var(--u)); padding: calc(30 * var(--u)) calc(34 * var(--u)) calc(28 * var(--u));
  border-radius: calc(16 * var(--u)); border: 1px solid rgba(255,255,255,.6); background: rgba(250,249,246,.84); -webkit-backdrop-filter: blur(14px) saturate(1.15); backdrop-filter: blur(14px) saturate(1.15);
  box-shadow: 0 18px 50px rgba(30,25,20,.18), 0 1px 2px rgba(0,0,0,.06); }
.amhero .cathero__h1 { margin-top: calc(12 * var(--u)); }
.amhero--right .amhero__card { left: auto; right: calc(57 * var(--u)); }   /* places west of the shop: the route runs on the left */
.amhero__sub { margin-top: calc(14 * var(--u)); font-size: calc(15.2 * var(--u)); line-height: calc(23 * var(--u)); color: #393734; }
.amhero .cathero__ctas { margin-top: calc(22 * var(--u)); }
.achips { display: flex; flex-wrap: wrap; gap: calc(8 * var(--u)); margin-top: calc(20 * var(--u)); }
.achips li { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(34 * var(--u)); padding: 0 calc(13 * var(--u)); border-radius: 999px;
  background: #fff; border: 1px solid #e2dfd9; font-size: calc(13 * var(--u)); font-weight: 600; color: #1c1b19; white-space: nowrap; }
.achips svg { width: calc(15 * var(--u)); height: calc(15 * var(--u)); color: #c4532f; stroke-width: 1.8; flex: none; }
/* the hub: the whole region on the right */
.ahero--hub { min-height: calc(640 * var(--u)); }
.ahero--hub .ahero__map { position: absolute; top: 0; right: calc(57 * var(--u)); bottom: calc(14 * var(--u)); width: calc(540 * var(--u));
  border-radius: calc(16 * var(--u)); overflow: hidden; box-shadow: 0 14px 40px rgba(30,25,20,.14), 0 1px 2px rgba(0,0,0,.06); }

.asplit { display: grid; grid-template-columns: 1.25fr 1fr; gap: calc(40 * var(--u)); align-items: start; }
.alocal__list { margin-top: calc(16 * var(--u)); }
.alocal__list li { padding: calc(14 * var(--u)) 0; border-top: 1px solid #d6d2ca; font-size: calc(15 * var(--u)); line-height: calc(23 * var(--u)); color: #33312d; }
.alocal__list li:last-child { border-bottom: 1px solid #d6d2ca; }
.apickup { padding: calc(20 * var(--u)); border-radius: calc(14 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.apickup__ph { display: block; margin-top: calc(12 * var(--u)); border-radius: calc(10 * var(--u)); overflow: hidden; }
.apickup__ph img { width: 100%; height: calc(200 * var(--u)); object-fit: cover; }
.apickup__ad { margin-top: calc(14 * var(--u)); }
.apickup__ad b { display: block; font-size: calc(16 * var(--u)); color: #111; }
.apickup__ad span { display: block; margin-top: calc(2 * var(--u)); font-size: calc(13.6 * var(--u)); color: #57544f; }
.apickup__how { margin: calc(10 * var(--u)) 0 calc(12 * var(--u)); font-size: calc(14 * var(--u)); line-height: calc(21 * var(--u)); color: #3e3c38; }

.agroups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(16 * var(--u)); margin-top: calc(28 * var(--u)); }
.agroup { padding: calc(24 * var(--u)) calc(26 * var(--u)) calc(14 * var(--u)); border-radius: calc(14 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.agroup__t { font-family: "Inter", system-ui, sans-serif; font-size: calc(22 * var(--u)); font-weight: 800; text-transform: uppercase; color: #0c0c0c; }
.agroup__x { margin-top: calc(6 * var(--u)); font-size: calc(13.6 * var(--u)); line-height: calc(20 * var(--u)); color: #57544f; }
.agroup__list { margin-top: calc(12 * var(--u)); }
.aplace { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: calc(12 * var(--u)); padding: calc(12 * var(--u)) 0; border-top: 1px solid #ddd9d2; }
.aplace b { font-size: calc(15.4 * var(--u)); font-weight: 600; color: #111; }
.aplace span { grid-column: 1; font-size: calc(12.8 * var(--u)); color: #66635d; }
.aplace .arr { grid-column: 2; grid-row: 1 / span 2; width: calc(13 * var(--u)); height: calc(13 * var(--u)); transition: transform .2s; }
.aplace:hover .arr { transform: translateX(3px); }

@media (max-width: 1179px) {
  .asplit { grid-template-columns: 1fr; gap: 26px; }
  .alocal__list { margin-top: 10px; }
  .alocal__list li { padding: 12px 0; font-size: 15px; line-height: 22px; }
  .apickup { padding: 16px; border-radius: 12px; }
  .apickup__ph { margin-top: 10px; border-radius: 10px; }
  .apickup__ph img { height: 180px; }
  .apickup__ad b { font-size: 16px; }
  .apickup__ad span { font-size: 14px; }
  .apickup__how { font-size: 14.5px; line-height: 21px; margin: 8px 0 10px; }
  .agroups { grid-template-columns: 1fr; gap: 12px; margin-top: 20px; }
  .agroup { padding: 18px 16px 8px; border-radius: 12px; }
  .agroup__t { font-size: 20px; }
  .agroup__x { font-size: 14px; line-height: 20px; }
  .aplace { padding: 12px 0; column-gap: 10px; }
  .aplace b { font-size: 15.5px; }
  .aplace span { font-size: 13px; }
  .aplace .arr { width: 13px; height: 13px; }
}
@media (min-width: 640px) and (max-width: 1179px) {
  .agroups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1179px) {
  .amhero { height: auto; display: flex; flex-direction: column; overflow: visible; background: none; }
  .amhero__map { position: relative; inset: auto; height: 360px; }
  .amap--wide { display: none; }
  .amap--tall { display: block; }
  .amap__credit { right: 8px; bottom: 8px; padding: 2px 7px; border-radius: 6px; font-size: 10.5px; }
  .amhero__card { position: relative; left: auto; right: auto; top: auto; width: auto; margin: -36px 16px 0; padding: 20px 18px 18px; border-radius: 14px; background: rgba(250,249,246,.95); }
  .amhero .cathero__h1 { margin-top: 8px; font-size: 34px; line-height: 35px; }
  .amhero__sub { margin-top: 10px; font-size: 15px; line-height: 22px; }
  .amhero .cathero__ctas { margin-top: 16px; gap: 10px; }
  .amhero .cathero__ctas .btn { flex: 1; height: 46px; padding: 0 10px; font-size: 14px; }
  .achips { gap: 6px; margin-top: 14px; }
  .achips li { height: 32px; padding: 0 11px; gap: 6px; font-size: 13px; }
  .achips svg { width: 14px; height: 14px; }
  .ahero--hub { min-height: 0; }
  .ahero--hub .ahero__map { position: relative; top: auto; right: auto; bottom: auto; width: auto; height: 460px; margin: 18px 0 6px; border-radius: 12px; }
}
@media (min-width: 640px) and (max-width: 1179px) {
  .amhero__map { height: 440px; }
  .amap--tall { display: none; }
  .amap--mid { display: block; }
  .amhero__card { margin: -48px 32px 0; max-width: 640px; }
  .amhero .cathero__ctas .btn { flex: 0 0 auto; padding: 0 22px; }
  .ahero--hub .ahero__map { height: 560px; max-width: 560px; }
}

/* ===================== PROMOTIONAL PRODUCTS (/promotional-products/, concept C11) ===================== */
.ijobs--promo { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ijobs--promo .ijob__ph { height: calc(230 * var(--u)); }
.ijob__ph--art { display: grid; place-items: center; background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: inset 0 0 0 1px #e2dfd9; }
.ijob__ph--art svg { width: 62%; height: auto; }
.ijob__line { display: block; margin-top: calc(4 * var(--u)); font-size: calc(13.4 * var(--u)); line-height: calc(19 * var(--u)); color: #57544f; }
.psource { display: flex; align-items: center; justify-content: space-between; gap: calc(30 * var(--u)); padding: calc(30 * var(--u)) calc(36 * var(--u));
  border-radius: calc(14 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.psource__x { margin-top: calc(10 * var(--u)); max-width: calc(640 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(23 * var(--u)); color: #3e3c38; }
.psource__btns { display: flex; gap: calc(12 * var(--u)); flex: none; }
@media (max-width: 1179px) {
  .ijobs--promo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ijobs--promo .ijob__ph { height: auto; aspect-ratio: 1; }
  .ijob__line { font-size: 13.5px; line-height: 19px; margin-top: 3px; }
  .psource { flex-direction: column; align-items: stretch; gap: 16px; padding: 20px 16px; border-radius: 12px; }
  .psource__x { font-size: 15px; line-height: 22px; margin-top: 8px; }
  .psource__btns { flex-direction: column; gap: 10px; }
  .psource__btns .btn { width: 100%; justify-content: center; }
}
@media (min-width: 640px) and (max-width: 1179px) {
  .ijobs--promo { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .psource__btns { flex-direction: row; }
  .psource__btns .btn { width: auto; }
}
/* area pages: which jobs are from this place */
.ijob__tag { position: absolute; z-index: 1; left: calc(10 * var(--u)); top: calc(10 * var(--u)); padding: calc(4 * var(--u)) calc(10 * var(--u)); border-radius: 999px;
  background: rgba(20,19,18,.55); color: #fff; font-size: calc(11.5 * var(--u)); font-weight: 500; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ijob__tag.is-local { background: #c4532f; }
@media (max-width: 1179px) { .ijob__tag { left: 8px; top: 8px; padding: 4px 9px; font-size: 11.5px; } }

/* ===================== TRADE PAGES (/industries/trades/<slug>/) ===================== */
.tpicks { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(12 * var(--u)); }
.tpick { display: flex; flex-direction: column; height: 100%; padding: calc(14 * var(--u)) calc(16 * var(--u)) calc(16 * var(--u)); border-radius: calc(12 * var(--u));
  background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); transition: box-shadow .25s, transform .25s; }
.tpick:hover, .tpick:focus-visible { box-shadow: 0 12px 28px rgba(40,34,28,.12); transform: translateY(-2px); }
.tpick__img { display: grid; place-items: center; height: calc(130 * var(--u)); }
.tpick__img img { max-height: 100%; max-width: 80%; object-fit: contain; mix-blend-mode: multiply; }
.tpick b { margin-top: calc(10 * var(--u)); font-family: "Inter", system-ui, sans-serif; font-size: calc(17 * var(--u)); font-weight: 800; text-transform: uppercase; color: #0c0c0c; }
.tpick__x { margin-top: calc(6 * var(--u)); font-size: calc(13.2 * var(--u)); line-height: calc(19 * var(--u)); color: #57544f; }
.tpick__go { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); margin-top: auto; padding-top: calc(12 * var(--u)); font-size: calc(12.8 * var(--u)); font-weight: 600; color: #1c1b19; }
.tpick__go .arr { width: calc(11 * var(--u)); height: calc(11 * var(--u)); }
.tfaq { display: grid; grid-template-columns: calc(380 * var(--u)) 1fr; gap: calc(40 * var(--u)); align-items: start; }
.tfaq__q { border-top: 1px solid #d6d2ca; }
.tfaq__q:last-child { border-bottom: 1px solid #d6d2ca; }
.tfaq__q summary { display: flex; justify-content: space-between; align-items: center; gap: calc(16 * var(--u)); padding: calc(16 * var(--u)) 0; cursor: pointer; list-style: none;
  font-size: calc(16 * var(--u)); font-weight: 600; color: #151515; }
.tfaq__q summary::-webkit-details-marker { display: none; }
.tfaq__q summary i { flex: none; width: calc(9 * var(--u)); height: calc(9 * var(--u)); border-right: 1.6px solid #111; border-bottom: 1.6px solid #111; transform: rotate(45deg); transition: transform .2s; }
.tfaq__q[open] summary i { transform: rotate(225deg); }
.tfaq__q p { padding: 0 0 calc(16 * var(--u)); max-width: calc(760 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(23 * var(--u)); color: #3e3c38; }
@media (max-width: 1179px) {
  .tpicks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .tpick { padding: 12px 12px 14px; border-radius: 12px; }
  .tpick__img { height: 100px; }
  .tpick b { font-size: 15px; margin-top: 8px; }
  .tpick__x { font-size: 13.5px; line-height: 19px; }
  .tpick__go { font-size: 13px; padding-top: 10px; }
  .tfaq { grid-template-columns: 1fr; gap: 12px; }
  .tfaq__q summary { font-size: 16px; padding: 14px 0; gap: 14px; }
  .tfaq__q summary i { width: 9px; height: 9px; }
  .tfaq__q p { font-size: 15px; line-height: 22px; padding-bottom: 14px; }
}
@media (min-width: 640px) and (max-width: 1179px) { .tpicks { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ===================== ABOUT (/about/, concepts C12, C17) ===================== */
.astory { display: grid; grid-template-columns: calc(520 * var(--u)) 1fr; gap: calc(48 * var(--u)); align-items: center; }
.astory__ph { margin: 0; border-radius: calc(14 * var(--u)); overflow: hidden; }
.astory__ph img { width: 100%; height: calc(560 * var(--u)); object-fit: cover; }
.astory__copy > p:not(.eyebrow2) { margin-top: calc(14 * var(--u)); max-width: calc(640 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(25 * var(--u)); color: #3e3c38; }
.astory__q { margin: calc(22 * var(--u)) 0 0; padding-left: calc(18 * var(--u)); border-left: 3px solid #c4532f; font-size: calc(21 * var(--u)); line-height: calc(29 * var(--u)); font-weight: 600; color: #151515; }
.astory__q span { display: block; margin-top: calc(6 * var(--u)); font-size: calc(12.6 * var(--u)); font-weight: 500; color: #66635d; }
.atime { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(14 * var(--u)); margin: calc(28 * var(--u)) 0 0; padding: calc(18 * var(--u)) 0 0; border-top: 1px solid #d6d2ca; list-style: none; }
.atime li { position: relative; padding-top: calc(14 * var(--u)); }
.atime li::before { content: ""; position: absolute; left: 0; top: 0; width: calc(9 * var(--u)); height: calc(9 * var(--u)); border-radius: 50%; background: #c4532f; }
.atime b { display: block; font-size: calc(15 * var(--u)); color: #111; }
.atime span { display: block; margin-top: calc(3 * var(--u)); font-size: calc(13 * var(--u)); line-height: calc(18 * var(--u)); color: #66635d; }
.apromise { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(14 * var(--u)); }
.apromise li { padding: calc(20 * var(--u)); border-radius: calc(12 * var(--u)); background: linear-gradient(180deg, #f0efeb 0%, #f6f5f2 100%); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.apromise__ic { display: grid; place-items: center; width: calc(42 * var(--u)); height: calc(42 * var(--u)); border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.apromise__ic svg { width: calc(21 * var(--u)); height: calc(21 * var(--u)); color: #c4532f; stroke-width: 1.6; }
.apromise b { display: block; margin-top: calc(14 * var(--u)); font-family: "Inter", system-ui, sans-serif; font-size: calc(16 * var(--u)); font-weight: 800; text-transform: uppercase; color: #111; }
.apromise li > span:last-child { display: block; margin-top: calc(6 * var(--u)); font-size: calc(13.8 * var(--u)); line-height: calc(20 * var(--u)); color: #57544f; }
.astats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: calc(16 * var(--u)) 0 0; padding: calc(22 * var(--u)) 0; border-radius: calc(12 * var(--u)); background: #111; }
.astats div { text-align: center; border-left: 1px solid rgba(255,255,255,.14); }
.astats div:first-child { border-left: 0; }
.astats dt { font-family: "Inter", system-ui, sans-serif; font-size: calc(34 * var(--u)); font-weight: 800; color: #fff; }
.astats dd { margin: calc(4 * var(--u)) 0 0; font-family: var(--display); font-size: calc(11 * var(--u)); letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.62); }
.iquotes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.avisit { position: relative; min-height: calc(420 * var(--u)); border-radius: calc(16 * var(--u)); overflow: hidden; }
.avisit__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.avisit__card { position: absolute; right: calc(28 * var(--u)); top: 50%; transform: translateY(-50%); width: calc(420 * var(--u)); padding: calc(26 * var(--u)) calc(28 * var(--u));
  border-radius: calc(14 * var(--u)); background: rgba(250, 249, 246, .86); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 14px 40px rgba(0,0,0,.18); }
.avisit__ad { margin-top: calc(12 * var(--u)); }
.avisit__ad b { display: block; font-size: calc(16 * var(--u)); color: #111; }
.avisit__ad span { display: block; margin-top: calc(2 * var(--u)); font-size: calc(13.6 * var(--u)); color: #57544f; }
.hours { display: grid; gap: calc(4 * var(--u)); margin: calc(14 * var(--u)) 0 0; }
.hours div { display: flex; justify-content: space-between; gap: calc(14 * var(--u)); font-size: calc(13.6 * var(--u)); color: #3e3c38; }
.hours dt { font-weight: 600; color: #151515; }
.hours dd { margin: 0; }
.avisit__btns { display: flex; gap: calc(10 * var(--u)); margin-top: calc(18 * var(--u)); }
.avisit__btns .btn { width: auto; padding: 0 calc(18 * var(--u)); }
.avisit__areas { margin-top: calc(14 * var(--u)); }
@media (max-width: 1179px) {
  .astory { grid-template-columns: 1fr; gap: 18px; }
  .astory__ph img { height: 300px; }
  .astory__copy > p:not(.eyebrow2) { font-size: 16px; line-height: 24px; margin-top: 12px; }
  .astory__q { font-size: 19px; line-height: 27px; margin-top: 18px; padding-left: 14px; }
  .astory__q span { font-size: 12.5px; }
  .atime { grid-template-columns: 1fr; gap: 12px; margin-top: 20px; padding-top: 14px; }
  .atime li { padding: 0 0 0 20px; }
  .atime li::before { top: 6px; width: 9px; height: 9px; }
  .atime b { font-size: 15px; }
  .atime span { font-size: 13.5px; line-height: 19px; }
  .apromise { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .apromise li { padding: 14px; border-radius: 12px; }
  .apromise__ic { width: 38px; height: 38px; }
  .apromise__ic svg { width: 19px; height: 19px; }
  .apromise b { font-size: 14.5px; margin-top: 10px; }
  .apromise li > span:last-child { font-size: 13.5px; line-height: 19px; }
  .astats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; padding: 18px 0; border-radius: 12px; margin-top: 12px; }
  .astats div:nth-child(3) { border-left: 0; }
  .astats dt { font-size: 28px; }
  .astats dd { font-size: 10.5px; }
  .iquotes--3 { grid-template-columns: 1fr; }
  .avisit { min-height: 0; display: flex; flex-direction: column; border-radius: 12px; }
  .avisit__ph { position: relative; height: 220px; }
  .avisit__card { position: relative; right: auto; top: auto; transform: none; width: auto; padding: 18px 16px; border-radius: 0; background: #f6f5f2; box-shadow: none; }
  .avisit__ad b { font-size: 16px; }
  .avisit__ad span, .hours div { font-size: 14px; }
  .hours { gap: 4px; margin-top: 12px; }
  .avisit__btns { flex-direction: column; gap: 10px; margin-top: 16px; }
  .avisit__btns .btn { width: 100%; justify-content: center; height: 48px; }
}
@media (min-width: 640px) and (max-width: 1179px) {
  .apromise { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .iquotes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .avisit__btns { flex-direction: row; }
  .avisit__btns .btn { width: auto; }
}