/* Industry illustrations. Same paper, ink and type as the editorial pages. */
.industry-neighbourhood { position: relative; margin: -28px -24px -8px; }
.industry-neighbourhood img { width: 100%; height: auto; }
.industry-neighbourhood__note { position: absolute; z-index: 1; top: 0; right: 0; font: 500 12px/1.5 var(--font-mono); text-align: right; color: var(--muted); }
.industry-neighbourhood__note em { font: italic 400 25px/1.1 var(--font-aside); color: var(--violet); }
.industry-neighbourhood__route { display: flex; justify-content: center; align-items: center; gap: 10px; margin: -10px 0 0; font: 600 12px/1.4 var(--font-body); }
.industry-neighbourhood__route span { padding: 8px 12px; background: var(--wash-violet); border: 1px solid #D7CBEE; border-radius: 999px; }
.industry-neighbourhood__route i { color: var(--violet); font-style: normal; }
.industry-phone__art, .industry-phone__form, .industry-phone__confirmed { position: relative; display: grid; place-items: center; height: 120px; margin: 12px 0 16px; border-radius: 15px; background: #E4D9F2; overflow: hidden; }
.industry-phone__art > span { z-index: 1; display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: #FFF9ED; box-shadow: 6px 6px 0 #BDACD5; transform: rotate(-10deg); }
.industry-phone__art svg { width: 48px; height: 48px; }
.industry-phone__art i { position: absolute; width: 90px; height: 90px; border: 1px solid #BDAAD4; border-radius: 50%; transform: scaleX(1.8) rotate(-20deg); }
.industry-phone__art i:nth-of-type(2) { width: 150px; height: 150px; }
.industry-phone__art i:nth-of-type(3) { width: 200px; height: 200px; }
.industry-phone__form { padding: 18px; gap: 7px; background: #F2DFCC; }
.industry-phone__form > span { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; padding: 8px 11px; border: 1px solid #C8B6A6; border-radius: 6px; background: #FFF9F0; }
.industry-phone__form b { width: 65%; height: 4px; border-radius: 3px; background: #A59285; }
.industry-phone__form i { font: 600 11px/1 var(--font-body); font-style: normal; color: #346548; }
.industry-phone__confirmed { background: #E3EACF; }
.industry-phone__confirmed > span { display: grid; place-items: center; z-index: 1; width: 64px; height: 64px; border-radius: 50%; background: var(--ink); color: var(--lime); font-size: 34px; box-shadow: 0 0 0 8px #CDD5BA; }
.industry-phone__confirmed svg { position: absolute; width: 85%; color: #91A074; }
@media (max-width: 680px) {
  .industry-neighbourhood { margin: 8px -10px 0; }
  .industry-neighbourhood__route { gap: 5px; font-size: 10px; }
  .industry-neighbourhood__route span { padding: 7px 8px; }
  .industry-neighbourhood__note { top: -12px; }
  .industry-neighbourhood__note em { font-size: 21px; }
  .industry-phone__art, .industry-phone__form, .industry-phone__confirmed { height: 100px; }
  .industry-phone__form { padding: 12px; }
}
/* Industry pages (Troy, 1 Nov 2026): three problems and their fixes with a picture each, and what we build, as icons. */
.fix-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:44px; }
.fix-card { display:flex; flex-direction:column; padding:12px 12px 24px; border:1px solid var(--line); border-radius:22px; background:var(--card); transition:translate .3s var(--settle), box-shadow .3s var(--settle); }
.fix-card > div:first-child { margin:0 0 18px; height:140px; }
.fix-card__problem { display:flex; gap:10px; margin:0 10px; color:var(--muted); font-size:15px; line-height:1.45; }
.fix-card__problem::before { content:"✕"; flex:none; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#FCE3E1; color:#B4372D; font:700 11px/1 var(--font-body); }
.fix-card h3 { display:flex; gap:10px; margin:14px 10px 0; font:700 21px/1.2 var(--font-display); letter-spacing:-.02em; }
.fix-card h3::before { content:"✓"; flex:none; display:grid; place-items:center; width:22px; height:22px; margin-top:2px; border-radius:50%; background:var(--lime); color:var(--ink); font:700 12px/1 var(--font-body); }
@media (hover:hover) { .fix-card:hover { translate:0 -4px; box-shadow:0 22px 44px -28px rgba(13,16,36,.4); } }
.built-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:40px 0 0; padding:0; list-style:none; }
.built-list li { display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:20px; border:1px solid var(--line); border-radius:20px; background:var(--card); font:700 18px/1.25 var(--font-display); letter-spacing:-.015em; }
.built-list__icon { display:grid; place-items:center; width:54px; height:54px; border-radius:16px; background:var(--wash-violet); color:var(--violet); }
.built-list li:nth-child(2) .built-list__icon { background:#FFE1D6; color:#843C29; }
.built-list li:nth-child(3) .built-list__icon { background:#FFF1C2; color:#6E5300; }
.built-list li:nth-child(4) .built-list__icon { background:#E8F3D4; color:#485A29; }
.built-list__icon svg { width:30px; height:30px; }
@media (max-width:900px) { .fix-cards { grid-template-columns:1fr; } .built-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.reduce-motion .fix-card { transition:none; }
/* Three phone screens from the client's own site under the real work (Troy, 2 Nov 2026). Phones swipe sideways. */
.proof-shots { list-style:none; margin:56px 0 0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(16px, 2.6vw, 32px); }
.proof-shots figure { margin:0; }
.proof-shots img { display:block; width:100%; height:auto; border-radius:24px; background:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.16), 0 28px 50px -26px rgba(0,0,0,.75); }
.proof-shots figcaption { margin-top:16px; font:600 17px/1.35 var(--font-body); text-align:center; }
@media (max-width:700px) {
  .proof-shots { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%; overflow-x:auto; scroll-snap-type:x mandatory; margin:40px -16px 0; padding:0 16px 10px; }
  .proof-shots li { scroll-snap-align:center; }
}
