/* Industry landing pages (/industries and /industries/<slug>).
   Loaded AFTER /home.css, which supplies the palette, type, buttons, nav,
   receipt, proof band, contact band and footer. This file adds the blocks the
   homepage does not have and the breakpoints for them.
   Rules from the brief: no pill shapes (buttons 10px, small tags 8px), flat
   colour, 2px ink borders, hard offset shadows. Product mockups keep the app's
   own dark colours.
   Breakpoints: phone up to 640, tablet 641 to 1040, desktop 1041 and up. */

.ind .wrap { width: min(1320px, 100% - 48px); }

/* Without JS nothing may stay hidden: the receipt prints and the stamp shows. */
html:not(.js) .receipt-in { clip-path: none; }
html:not(.js) .stamp { opacity: 1; scale: 1; }

/* The mobile menu is the full screen, so the page behind must not scroll. */
html.ind-menu-open { overflow: hidden; }
.ind .nav-logo { display: flex; align-items: center; min-height: 44px; }

/* ---------- hero ---------- */
.ind-hero {
  position: relative; padding: 132px 0 clamp(56px, 7vw, 96px);
  background: linear-gradient(90deg, var(--paper) 0%, rgba(243,238,227,.86) 38%, rgba(243,238,227,0) 60%), linear-gradient(var(--rule) 1px, transparent 1px) 0 0 / 100% 76px, var(--paper);
  border-bottom: 2px solid var(--ink);
}
.ind-hero-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.ind-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 26px; }
.ind-crumbs a { text-decoration: underline; text-underline-offset: 4px; padding: 6px 0; }
.ind-crumbs a:hover { color: var(--orange-d); }
.ind-crumbs i { font-style: normal; color: var(--orange); }
.ind-hero .eyebrow { animation: none; }
.ind-h1 {
  font-size: clamp(2.5rem, 5.6vw, 5.4rem); line-height: .94; letter-spacing: -0.04em; font-weight: 800;
  font-variation-settings: 'wdth' 82; max-width: 16ch; text-wrap: balance; margin-bottom: 26px;
}
.ind-h1 em { color: var(--orange-d); font-size: 1.05em; }
.ind-sub { font-size: clamp(1.06rem, 1.35vw, 1.28rem); line-height: 1.5; color: var(--ink-soft); max-width: 58ch; }
.ind-hero .hero-cta, .ind-hero .hero-facts { animation: none; }
.ind-hub-hero .ind-h1 { max-width: 18ch; }

/* the job ticket */
.ind-ticket { background: #fffdf8; border: 2px solid var(--ink); border-radius: 14px; box-shadow: 0 6px 0 var(--ink); padding: 22px 24px 8px; rotate: 1deg; }
.ind-ticket-h { font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding-bottom: 14px; border-bottom: 2px dashed var(--ink); }
.ind-ticket-h i { font-style: normal; color: var(--orange); }
.ind-ticket dl > div { padding: 13px 0; border-bottom: 1px solid var(--rule); }
.ind-ticket dl > div:last-child { border-bottom: 0; }
.ind-ticket dt { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 3px; }
.ind-ticket dd { font-size: 1.06rem; font-weight: 650; line-height: 1.25; letter-spacing: -.01em; }
.ind-ticket-price dd { font-size: 1.7rem; font-weight: 800; font-variation-settings: 'wdth' 82; letter-spacing: -.03em; color: var(--orange-d); }

/* a plain-spoken note directly under the hero (compliance, pricing, cross-link) */
.ind-aside { background: var(--paper-2); border-bottom: 2px solid var(--ink); padding: 20px 0; }
.ind-aside p { font-size: 1.02rem; line-height: 1.55; color: var(--ink); padding-left: 18px; border-left: 4px solid var(--orange); }
.ind-aside a, .ind-who-note a, .ind-src a, .ind-deal-note a, .ind-proof-more a, .ind-signals a { text-decoration: underline; text-underline-offset: 4px; }
.ind-aside a:hover, .ind-who-note a:hover, .ind-src a:hover, .ind-signals a:hover { color: var(--orange-d); }

/* ---------- stack + receipt ---------- */
.ind-stack { padding-bottom: clamp(60px, 8vw, 110px); }
.ind-stack .h2 { max-width: 19ch; }
.ind-stack .receipt-wrap { position: static; }
.ind-scope { margin-top: 28px; padding: 16px 18px; background: #fffdf8; border: 2px solid var(--ink); border-radius: 10px; font-size: 1.02rem; color: var(--ink-soft); max-width: 60ch; }
.ind-scope b { color: var(--ink); }
.ind .r-lines li { align-items: flex-start; }
.ind .r-lines span { min-width: 0; }
.ind .r-lines b { white-space: nowrap; }
.r-keep-h { text-align: center; font-weight: 600; letter-spacing: .14em; margin-top: 18px; padding: 16px 0 12px; border-top: 1.5px dashed #1d2433; border-bottom: 1.5px dashed #1d2433; }
.r-keep-h span { font-weight: 400; letter-spacing: .04em; font-size: 12px; color: #6a7183; }
.ind .r-keeps b { font-weight: 400; color: #3f7d16; }
/* On these pages the stamp sits in the paper flow, under the total, so every
   line of the receipt stays readable at any width. The total is struck out. */
.ind .stamp { position: static; translate: none; rotate: -5deg; width: fit-content; margin: 22px auto 6px; background: none; }
.ind .receipt.stamped .r-lines, .ind .receipt.stamped .r-total { opacity: 1; }
.ind .r-total b { text-decoration: line-through transparent 2px; transition: text-decoration-color .3s .2s, color .3s .2s; }
.ind .receipt.stamped .r-total b { text-decoration-color: var(--orange-d); color: #6a7183; }
html:not(.js) .ind .r-total b { text-decoration-color: var(--orange-d); }
.ind-src { margin-top: 34px; font-family: var(--mono); font-size: 12px; line-height: 1.7; color: var(--ink-soft); max-width: 110ch; }

/* ---------- how one deal runs ---------- */
.ind-deal { background: var(--navy); color: var(--paper); padding: clamp(72px, 10vw, 140px) 0; overflow: clip; }
.ind-deal-head { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(28px, 5vw, 80px); align-items: end; }
.ind-deal-head .h2 { max-width: 15ch; }
.ind-deal-intro p { color: #b9c6da; font-size: 1.1rem; max-width: 48ch; }
.ind-deal-intro .ind-buyer { margin-top: 18px; padding: 14px 16px; border: 1.5px solid rgba(243,238,227,.3); border-radius: 10px; color: var(--paper); font-weight: 650; font-size: 1.05rem; line-height: 1.3; }
.ind-buyer span { display: block; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--green); margin-bottom: 4px; }

/* the spine: one line down the middle, a numbered block per step */
.ind-steps { position: relative; margin-top: clamp(48px, 6vw, 84px); display: grid; gap: clamp(48px, 6vw, 92px); }
.ind-steps::before { content: ''; position: absolute; left: 50%; top: 8px; bottom: 8px; width: 2px; margin-left: -1px; background: repeating-linear-gradient(#2a4168 0 8px, transparent 8px 14px); }
.ind-step { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 60px minmax(0, 1fr); column-gap: clamp(24px, 3.4vw, 56px); align-items: center; }
.ind-step-n { grid-column: 2; grid-row: 1; justify-self: center; width: 60px; height: 60px; display: grid; place-items: center; background: var(--navy); border: 2px solid var(--orange); border-radius: 10px; font-family: var(--mono); font-size: 15px; font-weight: 600; letter-spacing: .08em; color: var(--orange); box-shadow: 0 0 0 8px var(--navy); }
.ind-step-copy { grid-column: 1; grid-row: 1; justify-self: end; max-width: 30rem; }
.ind-step-mock { grid-column: 3; grid-row: 1; min-width: 0; }
.ind-step:nth-child(even) .ind-step-copy { grid-column: 3; justify-self: start; }
.ind-step:nth-child(even) .ind-step-mock { grid-column: 1; }
.ind-step-prod { font-family: var(--mono); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--green); margin-bottom: 8px; }
.ind-step-copy h3 { font-size: clamp(3rem, 5.4vw, 5.2rem); line-height: .88; letter-spacing: -.05em; font-weight: 800; font-variation-settings: 'wdth' 78; margin-bottom: 18px; }
.ind-step-copy > p:last-child { color: #c9d4e5; font-size: clamp(1.04rem, 1.22vw, 1.16rem); line-height: 1.55; }
.ind-deal-note { margin-top: clamp(40px, 5vw, 64px); font-family: var(--mono); font-size: 12.5px; line-height: 1.7; color: #8ea2bf; max-width: 92ch; }
.ind-deal-note a { color: var(--paper); } .ind-deal-note a:hover { color: var(--orange); }

/* ---------- product mockups (the app's own dark colours) ---------- */
.dm { container-type: inline-size; margin: 0; background: #0d1a2e; border: 1px solid #22395c; border-radius: 12px; overflow: hidden; font-family: Inter, system-ui, sans-serif; font-size: 13px; line-height: 1.4; color: #e8edf5; text-align: left; box-shadow: 0 30px 50px -28px rgba(0,0,0,.9), 0 0 0 6px rgba(42,65,104,.22); }
.dm-bar { height: 32px; display: flex; align-items: center; gap: 12px; padding: 0 12px; background: #081120; }
.dm-dots { display: flex; gap: 6px; } .dm-dots i { width: 9px; height: 9px; border-radius: 50%; background: #7dc244; }
.dm-dots i:first-child { background: #e87a54; } .dm-dots i:nth-child(2) { background: #f5c542; }
.dm-url { font-size: 11px; color: #7a92b2; background: #0f1d33; padding: 3px 12px; border-radius: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.dm-body { padding: 16px; }
.dm-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 12px; }
.dm-h b { font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.dm-h span { font-size: 12px; color: #7a92b2; }
.dm-h .dm-pill { margin-left: auto; }
.dm-pill { font-size: 11px; font-weight: 600; border-radius: 6px; padding: 2px 9px; background: rgba(125,194,68,.14); color: #8fd457; white-space: nowrap; }
.dm-pill.o { background: rgba(232,122,84,.16); color: #f09a7a; }
.dm-ok { color: #8fd457; font-weight: 600; }
.dm small { display: block; font-size: 11.5px; color: #7a92b2; }

/* find */
.dm-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.dm-chips span { font-size: 11.5px; color: #cfe0f5; background: #13243f; border: 1px solid rgba(122,146,178,.28); border-radius: 6px; padding: 4px 9px; }
.dm-rows { border: 1px solid rgba(122,146,178,.16); border-radius: 8px; overflow: hidden; }
.dm-rows li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 34px; align-items: center; gap: 10px; padding: 9px 12px; min-height: 50px; border-top: 1px solid rgba(122,146,178,.12); }
.dm-rows li:first-child { border-top: 0; }
.dm-rows li.on { background: rgba(232,122,84,.09); box-shadow: inset 3px 0 0 #e87a54; }
.dm-av { width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid #3a9be0; color: #6db8ee; background: #0f1e36; font-size: 10.5px; font-weight: 700; display: grid; place-items: center; }
.dm-rows b { display: block; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-rows small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-rows em { font-family: inherit; font-style: normal; font-size: 11.5px; color: #9fb2cc; white-space: nowrap; letter-spacing: 0; }
.dm-rows li.on em { color: #f09a7a; font-weight: 600; }
.dm-score { grid-column: 4; width: 34px; height: 26px; border-radius: 6px; display: grid; place-items: center; font-weight: 700; font-size: 12px; font-variant-numeric: tabular-nums; background: rgba(125,194,68,.16); color: #8fd457; }
.dm-sb { background: rgba(58,155,224,.14); color: #6db8ee; } .dm-sc { background: rgba(245,197,66,.14); color: #f5c542; }
.dm-foot { margin-top: 10px; font-size: 11.5px; color: #7a92b2; }
.dm-foot .dm-ok { margin-right: 8px; }

/* reach */
.dm-reach { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 14px; align-items: start; }
.dm-flow li { position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 10px; margin-bottom: 12px; background: #13243f; border: 1px solid rgba(122,146,178,.16); border-radius: 8px; }
.dm-flow li:last-child { margin-bottom: 0; }
.dm-flow li:not(:last-child)::after { content: ''; position: absolute; left: 24px; top: 100%; width: 2px; height: 12px; background: #3a9be0; }
.dm-ico { width: 28px; height: 28px; flex-shrink: 0; border-radius: 6px; display: grid; place-items: center; font-weight: 700; font-size: 11px; background: rgba(58,155,224,.16); color: #6db8ee; }
.dm-ico.o { background: rgba(232,122,84,.16); color: #f09a7a; } .dm-ico.w { background: rgba(122,146,178,.14); color: #9fb2cc; }
.dm-flow b { display: block; font-size: 12.5px; font-weight: 600; line-height: 1.25; }
.dm-note { background: #1b4f7e; border-radius: 10px 10px 3px 10px; padding: 12px 14px; font-size: 13px; line-height: 1.5; color: #f1f6fc; }
.dm-note small { color: #a9cdea; text-transform: uppercase; letter-spacing: .1em; font-size: 10.5px; margin-bottom: 5px; }

/* reply */
.dm-thread { display: flex; flex-direction: column; gap: 12px; }
.dm-bub { align-self: flex-start; max-width: 92%; background: #13243f; border: 1px solid rgba(122,146,178,.22); border-radius: 10px 10px 10px 3px; padding: 11px 14px; font-size: 13.5px; line-height: 1.5; }
.dm-bub small { color: #8fd457; text-transform: uppercase; letter-spacing: .1em; font-size: 10.5px; margin-bottom: 4px; }
.dm-ezra { border: 1px solid rgba(199,155,255,.4); background: rgba(199,155,255,.06); border-radius: 10px; padding: 11px 14px; }
.dm-ezra-h { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; font-size: 12px; color: #c79bff; font-weight: 600; margin-bottom: 6px; }
.dm-ezra-h span { margin-left: auto; background: #e87a54; color: #0d1a2e; font-weight: 700; border-radius: 6px; padding: 4px 10px; font-size: 11.5px; }
.dm-ezra p:last-child { font-size: 13.5px; line-height: 1.5; color: #e8edf5; }

/* close */
.dm-stages { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-bottom: 14px; }
.dm-stages li { font-size: 11px; font-weight: 600; color: #7a92b2; padding: 8px 6px 7px; border-top: 3px solid #22395c; background: #0f1e36; border-radius: 0 0 6px 6px; text-align: center; line-height: 1.2; }
.dm-stages li.past { border-top-color: #7dc244; color: #8fd457; }
.dm-stages li.on { border-top-color: #e87a54; color: #fff; background: #13243f; }
.dm-deal { background: #13243f; border: 1px solid #e87a54; border-radius: 10px; padding: 14px; }
.dm-deal-top { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; padding-bottom: 10px; border-bottom: 1px solid rgba(122,146,178,.18); }
.dm-deal-top b { font-size: 15px; font-weight: 700; }
.dm-deal-top span { font-size: 14px; font-weight: 700; color: #8fd457; }
.dm-deal dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 10px 0; }
.dm-deal dt { font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; color: #7a92b2; }
.dm-deal dd { font-size: 12.5px; font-weight: 600; }
.dm-deal p { font-size: 11.5px; color: #9fb2cc; }

/* sign */
.dm-sign { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 14px; align-items: stretch; }
.dm-paper { position: relative; background: #fbfaf6; color: #1b2a4a; border-radius: 8px; padding: 18px 18px 16px; overflow: hidden; }
.dm-paper h4 { font-size: 15px; font-weight: 700; line-height: 1.2; }
.dm-paper p { font-size: 11.5px; color: #6b7892; margin: 3px 0 12px; }
.dm-ln { display: block; height: 6px; border-radius: 3px; background: #e3e1d9; margin-bottom: 8px; } .dm-ln.s { width: 62%; }
.dm-sigbox { position: relative; margin-top: 44px; border-top: 1.5px solid #1b2a4a; padding-top: 4px; width: 66%; }
.dm-sigbox small { color: #6b7892; font-size: 11px; }
.dm-sig { position: absolute; left: 0; bottom: 20px; width: 80%; height: auto; overflow: visible; }
.dm-sig path { fill: none; stroke: #1d3b7a; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 420; }
.dm-seal { position: absolute; right: 14px; bottom: 16px; border: 3px solid #5fa32b; color: #5fa32b; font-weight: 800; letter-spacing: .12em; font-size: 13px; padding: 3px 9px; border-radius: 5px; rotate: -10deg; }
.dm-status { display: grid; gap: 8px; align-content: start; }
.dm-status li { position: relative; padding: 8px 10px 8px 36px; background: #13243f; border: 1px solid rgba(122,146,178,.16); border-radius: 8px; font-size: 12.5px; font-weight: 600; }
.dm-ck { position: absolute; left: 10px; top: 10px; width: 18px; height: 18px; border-radius: 50%; background: #7dc244; color: #0d1a2e; font-weight: 800; font-size: 11px; display: grid; place-items: center; }

/* mockups reflow on their own width, not the viewport's */
@container (max-width: 470px) {
  .dm-reach { grid-template-columns: 1fr; }
  .dm-sign { grid-template-columns: 1fr; }
  .dm-status { grid-template-columns: 1fr 1fr; }
  .dm-deal dl { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 380px) {
  .dm-body { padding: 12px; }
  .dm-rows li { grid-template-columns: 28px minmax(0, 1fr) 32px; gap: 4px 9px; padding: 9px 10px; }
  .dm-rows em { grid-column: 2 / 3; grid-row: 2; white-space: normal; }
  .dm-av { grid-row: 1 / 3; width: 28px; height: 28px; align-self: start; }
  .dm-score { grid-column: 3; grid-row: 1 / 3; width: 32px; height: 24px; }
  .dm-rows b, .dm-rows small { white-space: normal; }
  .dm-stages { grid-template-columns: 1fr 1fr; }
  .dm-bub { max-width: 100%; }
}

/* motion: a step's mockup plays once when it scrolls into view */
.js .ind-step-mock.rv:not(.in) { transform: translateY(34px) scale(.97); }
.js .rv.in .dm-stag > * { animation: dmIn .5s var(--ease) both; animation-delay: calc(.15s + var(--i, 0) * .11s); }
.js .rv.in .dm-sig path { animation: dmDraw 1.2s .5s ease-in-out both; }
.js .rv.in .dm-seal { animation: dmSeal .4s 1.6s cubic-bezier(.3,1.5,.5,1) both; }
@keyframes dmIn { from { opacity: 0; transform: translateY(10px); } }
@keyframes dmDraw { from { stroke-dashoffset: 420; } to { stroke-dashoffset: 0; } }
@keyframes dmSeal { from { opacity: 0; scale: 2.2; } }

/* ---------- who you sell to ---------- */
.ind-who { padding: clamp(72px, 10vw, 140px) 0; }
.ind-who .h2 { max-width: 18ch; }
.ind-band-h { display: flex; align-items: center; gap: 12px; margin: clamp(40px, 5vw, 64px) 0 18px; font-family: var(--mono); font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.ind-band-h span { width: 30px; height: 30px; display: grid; place-items: center; background: var(--ink); color: var(--paper); border-radius: 8px; letter-spacing: 0; }
.ind-band-h::after { content: ''; flex: 1; height: 2px; background: var(--ink); }

/* A: persona tiles */
.ind-buyers { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ind-buyers.ind-n5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ind-buyers li { display: flex; flex-direction: column; gap: 26px; min-height: 148px; padding: 16px 18px 18px; background: #fffdf8; border: 2px solid var(--ink); border-top-width: 10px; border-radius: 12px; box-shadow: 0 5px 0 var(--ink); }
.ind-buyers li:nth-child(3n+1) { border-top-color: var(--orange); }
.ind-buyers li:nth-child(3n+2) { border-top-color: var(--green); }
.ind-buyers li:nth-child(3n) { border-top-color: var(--blue); }
.ind-buyers span { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); }
.ind-buyers b { margin-top: auto; font-size: clamp(1.1rem, 1.5vw, 1.34rem); font-weight: 750; line-height: 1.12; letter-spacing: -.02em; font-variation-settings: 'wdth' 88; }

/* B: signals on a line */
.ind-signals { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ind-signals.ind-n4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ind-signals li { position: relative; padding: 30px 22px 4px 0; border-top: 2px solid var(--ink); }
.ind-signals li::before { content: ''; position: absolute; left: 0; top: -9px; width: 16px; height: 16px; background: var(--orange); border: 2px solid var(--ink); border-radius: 4px; rotate: 45deg; }
.ind-signals span { display: block; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; color: var(--orange-d); margin-bottom: 6px; }
.ind-signals p { font-size: 1.06rem; font-weight: 600; line-height: 1.3; }

/* C: the five modules, Find to Sign, as one strip */
.ind-mods { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); background: var(--ink); color: var(--paper); border: 2px solid var(--ink); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 0 var(--orange); }
.ind-mods li { padding: 22px 20px 24px; border-left: 1px solid rgba(243,238,227,.2); }
.ind-mods li:first-child { border-left: 0; }
.ind-mods span { display: block; font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--orange); margin-bottom: 14px; }
.ind-mods b { display: block; font-size: 1.16rem; font-weight: 750; line-height: 1.15; letter-spacing: -.02em; margin-bottom: 8px; }
.ind-mods p { font-size: .97rem; line-height: 1.45; color: #c2cde0; }
.ind-who-note { margin-top: 40px; max-width: 78ch; font-size: 1.04rem; line-height: 1.6; color: var(--ink-soft); padding-left: 18px; border-left: 4px solid var(--green); }

/* ---------- proof ---------- */
.ind-proof .h2 { max-width: 20ch; }
.ind-proof-note { margin-top: 22px; color: #c2cde0; max-width: 62ch; font-size: 1.08rem; }
.ind-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin-top: clamp(34px, 4vw, 56px); }
.ind-result { display: flex; flex-direction: column; border: 2px solid rgba(243,238,227,.3); border-radius: 14px; padding: 30px 26px 24px; transition: background .25s, color .25s, border-color .25s, opacity .7s var(--ease), transform .7s var(--ease); }
.ind-result b { display: block; font-size: clamp(3rem, 5.6vw, 5.2rem); line-height: .9; letter-spacing: -.05em; font-weight: 800; font-variation-settings: 'wdth' 78; color: var(--orange); white-space: nowrap; }
.ind-result b i { font-style: normal; font-size: .6em; color: var(--green); vertical-align: .12em; }
.ind-result p { margin-top: 16px; color: var(--paper); font-size: 1.1rem; font-weight: 600; line-height: 1.3; }
.ind-result small { display: block; margin: 10px 0 22px; color: #a9b8d0; font-size: .96rem; line-height: 1.45; }
.ind-result span { margin-top: auto; font-family: var(--mono); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; }
.ind-result:hover { background: var(--orange); border-color: var(--orange); }
.ind-result:hover b, .ind-result:hover b i, .ind-result:hover p, .ind-result:hover small, .ind-result:hover span { color: var(--ink); }
.ind-proof-more { margin-top: 22px; color: #c2cde0; font-size: 1rem; }
.ind-proof .tp { margin-top: 34px; line-height: 1.9; }

/* ---------- FAQ ---------- */
.ind-faq { padding: clamp(70px, 9vw, 130px) 0; background: var(--paper-2); border-top: 2px solid var(--ink); }
.ind-faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px, 6vw, 100px); }
.ind-faq-list { border-top: 2px solid var(--ink); }
.ind-faq details { border-bottom: 1px solid var(--rule); }
.ind-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 20px 0; min-height: 56px; }
.ind-faq summary::-webkit-details-marker { display: none; }
.ind-faq summary h3 { font-size: clamp(1.1rem, 1.6vw, 1.38rem); font-weight: 650; letter-spacing: -.015em; line-height: 1.25; }
.ind-faq summary::after { content: '+'; flex-shrink: 0; width: 36px; height: 36px; border-radius: 8px; border: 2px solid var(--ink); display: grid; place-items: center; font-weight: 500; font-size: 1.3rem; line-height: 1; transition: rotate .3s var(--ease), background .2s; }
.ind-faq details[open] summary::after { rotate: 45deg; background: var(--orange); }
.ind-faq summary:hover h3 { color: var(--orange-d); }
.ind-faq details p { color: var(--ink-soft); max-width: 64ch; padding: 0 0 24px; font-size: 1.06rem; line-height: 1.6; }

/* ---------- final CTA ---------- */
.ind-cta { overflow: clip; }
.ind-cta-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(30px, 5vw, 90px); align-items: center; }
.ind-cta .h2 { max-width: 16ch; }
.ind-cta .lede { max-width: 52ch; }
.ind-cta .btn-line:hover { background: var(--ink); color: var(--paper); }
.ind-others { background: #fffdf8; border: 2px solid var(--ink); border-radius: 14px; box-shadow: 0 8px 0 var(--ink); padding: 24px 26px 20px; }
.ind-others h3 { font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding-bottom: 12px; border-bottom: 2px solid var(--ink); }
.ind-others li a { display: flex; align-items: center; min-height: 44px; padding: 6px 0; border-bottom: 1px solid var(--rule); font-weight: 600; transition: padding .25s var(--ease), color .2s; }
.ind-others li a:hover { padding-left: 10px; color: var(--orange-d); }
.ind-others-all { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; font-family: var(--mono); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.ind-others-all:hover { color: var(--orange-d); }

/* ---------- hub picker ---------- */
.ind-picker { padding: clamp(60px, 8vw, 110px) 0 clamp(72px, 10vw, 130px); }
.ind-picker-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ind-picker-grid > li { display: flex; }
.ind-pick { display: flex; flex-direction: column; width: 100%; background: #fffdf8; border: 2px solid var(--ink); border-radius: 14px; padding: 24px 24px 20px; box-shadow: 0 5px 0 var(--ink); transition: transform .3s var(--ease), box-shadow .3s var(--ease), background .25s, opacity .7s var(--ease); }
.ind-pick:hover { transform: translateY(-4px); box-shadow: 0 9px 0 var(--ink); background: #fff; }
.ind-pick:active { transform: translateY(3px); box-shadow: 0 2px 0 var(--ink); }
.ind-pick-n { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; color: var(--orange-d); }
.ind-pick h2 { font-size: clamp(1.5rem, 2.1vw, 1.95rem); line-height: 1; letter-spacing: -.03em; font-weight: 750; font-variation-settings: 'wdth' 84; margin: 10px 0 12px; }
.ind-pick p { color: var(--ink-soft); font-size: 1.02rem; line-height: 1.45; }
.ind-pick dl { margin-top: auto; padding-top: 18px; }
.ind-pick dl > div { display: grid; grid-template-columns: 104px 1fr; gap: 10px; padding: 9px 0; border-top: 1px solid var(--rule); font-size: .92rem; line-height: 1.35; }
.ind-pick dt { font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); padding-top: 3px; }
.ind-pick-go { margin-top: 10px; padding-top: 14px; border-top: 2px solid var(--ink); font-weight: 700; }
.ind-pick:hover .ind-pick-go { color: var(--orange-d); }

/* ---------- footer: the industries row ---------- */
.foot-ind { margin-top: 44px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.12); }
.foot-ind h4 { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); margin-bottom: 10px; font-weight: 500; }
.foot-ind h4 a { display: inline-flex; align-items: center; min-height: 32px; }
.foot-ind ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 30px; }
.foot-ind li a { display: flex; align-items: center; min-height: 36px; font-size: .98rem; }
.foot-ind a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.ind .foot-base { margin-top: 36px; }

/* ================= desktop, narrower: 1041 to 1240 ================= */
@media (min-width: 1041px) and (max-width: 1240px) {
  .ind-buyers.ind-n5 b { font-size: 1.06rem; }
  .ind-mods li { padding: 20px 16px 22px; }
  .ind-mods b { font-size: 1.06rem; }
}

/* ================= tablet: 641 to 1040 ================= */
@media (max-width: 1040px) {
  .ind-hero { padding-top: 116px; }
  .ind-hero-grid { grid-template-columns: 1fr; align-items: start; }
  .ind-h1 { max-width: 18ch; }
  .ind-ticket { rotate: 0deg; max-width: 640px; }
  .ind-ticket dl { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
  .ind-ticket dl > div:nth-last-child(2) { border-bottom: 0; }
  .ind-deal-head, .ind-faq-grid, .ind-cta-grid { grid-template-columns: 1fr; }

  /* the spine moves to the left edge; copy then mockup stack beside it */
  .ind-steps { gap: 56px; }
  .ind-steps::before { left: 26px; }
  .ind-step { grid-template-columns: 52px minmax(0, 1fr); column-gap: 24px; row-gap: 22px; align-items: start; }
  .ind-step-n { grid-column: 1; grid-row: 1 / 3; align-self: start; width: 52px; height: 52px; }
  .ind-step-copy, .ind-step:nth-child(even) .ind-step-copy { grid-column: 2; grid-row: 1; justify-self: start; max-width: 40rem; }
  .ind-step-mock, .ind-step:nth-child(even) .ind-step-mock { grid-column: 2; grid-row: 2; max-width: 640px; }
  .ind-step-copy h3 { font-size: clamp(2.8rem, 7vw, 4rem); margin-bottom: 12px; }

  .ind-buyers, .ind-buyers.ind-n5 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .ind-buyers li { grid-column: span 3; min-height: 120px; gap: 18px; }
  .ind-buyers.ind-n5 li { grid-column: span 2; }
  .ind-buyers.ind-n5 li:nth-child(n+4) { grid-column: span 3; }
  /* signals become a vertical line */
  .ind-signals, .ind-signals.ind-n4 { grid-template-columns: 1fr; border-left: 2px solid var(--ink); margin-left: 8px; }
  .ind-signals li { display: grid; grid-template-columns: 34px 1fr; align-items: baseline; border-top: 0; padding: 0 0 20px 26px; }
  .ind-signals li:last-child { padding-bottom: 2px; }
  .ind-signals li::before { left: -9px; top: 4px; }
  .ind-signals span { margin-bottom: 0; }
  .ind-mods { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .ind-mods li { grid-column: span 2; border-left: 1px solid rgba(243,238,227,.2); border-top: 1px solid rgba(243,238,227,.2); }
  .ind-mods li:nth-child(-n+3) { border-top: 0; }
  .ind-mods li:nth-child(1), .ind-mods li:nth-child(4) { border-left: 0; }
  .ind-mods li:nth-child(n+4) { grid-column: span 3; }

  .ind-picker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ind-others ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 26px; }
  .foot-ind ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ind .receipt { transform: rotate(1deg); }
  /* every text link in the footer is a comfortable touch target */
  .ind .foot-col a { display: flex; align-items: center; min-height: 44px; padding: 0; }
  .foot-ind li a, .foot-ind h4 a { min-height: 44px; }
  .ind-crumbs a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; }
  .ind-crumbs { margin-bottom: 12px; }
}

/* wide tablet and small laptop: the receipt sits beside the argument again */
@media (min-width: 900px) and (max-width: 1040px) {
  .ind-stack .stack-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 36px; }
  .ind-stack .receipt-wrap { padding-top: 0; }
}

/* the fixed nav has no background until JS marks it scrolled; on small
   screens give it one so page text never runs underneath the logo */
@media (max-width: 820px) {
  .ind .nav { background: var(--paper); box-shadow: 0 1px 0 var(--rule); height: 64px; }
  .ind .nav-logo img { height: 34px; }
  .ind .nav-links a:not(.btn) { display: flex; align-items: center; min-height: 44px; }
  .ind-hero { padding-top: 96px; }
  .foot-ind ul { grid-template-columns: 1fr 1fr; }
}

/* ================= phone: up to 640 ================= */
@media (max-width: 640px) {
  .ind .wrap { width: min(1320px, 100% - 36px); }
  .ind-h1 { font-size: clamp(2.15rem, 10.4vw, 3.2rem); letter-spacing: -.035em; margin-bottom: 20px; }
  .ind-sub { font-size: 1.05rem; }
  .ind-hero .hero-cta { flex-direction: column; align-items: stretch; margin: 26px 0 24px; }
  .ind-hero .hero-cta .btn, .ind-cta .hero-cta .btn { justify-content: center; white-space: normal; text-align: center; min-height: 52px; }
  .ind-cta .hero-cta { flex-direction: column; align-items: stretch; }
  .ind-hero .hero-facts { flex-direction: column; gap: 6px; }
  .ind-crumbs span { display: none; } .ind-crumbs i:last-of-type { display: none; }
  .ind-ticket { padding: 18px 18px 4px; }
  .ind-ticket dl { display: block; }
  .ind-ticket dl > div:nth-last-child(2) { border-bottom: 1px solid var(--rule); }
  .ind-aside p { font-size: .98rem; padding-left: 14px; }
  .ind-stack .h2, .ind-who .h2, .ind-deal-head .h2, .ind-proof .h2, .ind-cta .h2 { font-size: clamp(2rem, 9vw, 2.6rem); max-width: none; }
  .ind .pains li { grid-template-columns: 40px 1fr; font-size: 1.02rem; }
  .ind .receipt { transform: none; width: 100%; }
  .ind .receipt-in { font-size: 13px; padding: 24px 18px 40px; }
  .ind .r-total b { font-size: 23px; }
  .ind .stamp { padding: 10px 16px 8px; border-width: 4px; margin-top: 18px; }
  .ind .stamp b { font-size: 2rem; }
  .ind-src { font-size: 11.5px; overflow-wrap: anywhere; }

  /* steps: the number sits on the spine, content takes the rest of the width */
  .ind-steps { gap: 46px; }
  .ind-steps::before { left: 17px; }
  .ind-step { grid-template-columns: 36px minmax(0, 1fr); column-gap: 14px; row-gap: 18px; }
  .ind-step-n { width: 36px; height: 36px; font-size: 12px; border-radius: 8px; box-shadow: 0 0 0 6px var(--navy); }
  .ind-step-copy h3 { font-size: 2.7rem; }
  .dm { font-size: 12.5px; }

  .ind-band-h { margin-top: 38px; }
  .ind-buyers, .ind-buyers.ind-n5 { grid-template-columns: 1fr; gap: 10px; }
  .ind-buyers li, .ind-buyers.ind-n5 li, .ind-buyers.ind-n5 li:nth-child(n+4) { grid-column: auto; min-height: 0; flex-direction: row; align-items: center; gap: 14px; padding: 14px 16px; border-top-width: 2px; border-left-width: 10px; box-shadow: 0 4px 0 var(--ink); }
  .ind-buyers li:nth-child(3n+1) { border-top-color: var(--ink); border-left-color: var(--orange); }
  .ind-buyers li:nth-child(3n+2) { border-top-color: var(--ink); border-left-color: var(--green); }
  .ind-buyers li:nth-child(3n) { border-top-color: var(--ink); border-left-color: var(--blue); }
  .ind-buyers span { flex-shrink: 0; width: 62px; }
  .ind-buyers b { margin-top: 0; font-size: 1.08rem; }
  .ind-mods { grid-template-columns: 1fr; }
  .ind-mods li, .ind-mods li:nth-child(n+4) { grid-column: auto; border-left: 0; border-top: 1px solid rgba(243,238,227,.2); padding: 18px 18px 20px; }
  .ind-mods li:nth-child(-n+3) { border-top: 1px solid rgba(243,238,227,.2); }
  .ind-mods li:first-child { border-top: 0; }
  .ind-mods span { margin-bottom: 8px; }

  .ind-results { grid-template-columns: 1fr; }
  .ind-result b { font-size: clamp(2.8rem, 15vw, 3.8rem); }
  .ind-faq summary { gap: 14px; }
  .ind-picker-grid { grid-template-columns: 1fr; }
  .ind-pick dl > div { grid-template-columns: 96px 1fr; }
  .ind-others ul { grid-template-columns: 1fr; }
  .foot-ind ul { grid-template-columns: 1fr; }
  .ind .contact-facts li { font-size: 11.5px; }
}

@media (prefers-reduced-motion: reduce) {
  .ind-pick:hover { transform: none; }
  .js .ind-step-mock.rv:not(.in) { transform: none; }
}


/* ================= Fig. 03: the targeting spec sheet =================
   One object, three rows: Who / When / With. A label gutter on the left,
   content on the right, the platform row in navy as the answer. */
.ind-who { padding: clamp(84px, 11vw, 168px) 0; }
.spec-head { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 6vw, 110px); align-items: end; margin-bottom: clamp(36px, 4.5vw, 64px); }
.spec-head .h2 { max-width: 13ch; }
.spec-lede { font-size: clamp(1.02rem, 1.25vw, 1.2rem); line-height: 1.5; color: var(--ink-soft); max-width: 46ch; padding-bottom: 6px; }

.spec { background: #fffdf8; border: 2px solid var(--ink); border-radius: 20px; box-shadow: 0 10px 0 var(--ink); overflow: hidden; }
.spec-row { display: grid; grid-template-columns: clamp(170px, 19vw, 250px) minmax(0, 1fr); }
.spec-row + .spec-row { border-top: 2px solid var(--ink); }

.spec-k { padding: 34px 26px 34px 34px; background: var(--paper-2); border-right: 2px solid var(--ink); display: flex; flex-direction: column; align-items: flex-start; }
.spec-k span { width: 30px; height: 30px; border-radius: 7px; background: var(--ink); color: var(--paper); font-family: var(--mono); font-size: 13px; font-weight: 600; display: grid; place-items: center; margin-bottom: 18px; }
.spec-k h3 { font-size: clamp(2rem, 3.2vw, 3rem); line-height: .9; letter-spacing: -.045em; font-weight: 800; font-variation-settings: 'wdth' 80; }
.spec-k p { font-family: var(--mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); margin-top: 12px; line-height: 1.45; }

/* A: who */
.spec-who { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 0; align-content: center; }
.spec-who li { display: flex; align-items: center; gap: 16px; padding: 26px 30px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 0 -1px -1px 0; }
.spec-who b { font-size: clamp(1.06rem, 1.3vw, 1.22rem); font-weight: 650; letter-spacing: -.015em; line-height: 1.2; }
.pa { flex: none; width: 46px; height: 46px; border-radius: 50%; border: 2px solid var(--ink); display: grid; place-items: center; background: var(--orange); }
.pa svg { width: 24px; height: 24px; fill: var(--ink); }
.pa-1 { background: var(--green); } .pa-2 { background: #6db8ee; } .pa-3 { background: var(--paper-2); }

/* B: when */
.spec-when { counter-reset: none; }
.spec-when li { display: grid; grid-template-columns: 54px minmax(0, 1fr) 28px; align-items: center; gap: 6px; padding: 19px 30px; border-top: 1px solid var(--rule); transition: background .25s, padding .3s cubic-bezier(.2,.8,.2,1); }
.spec-when li:first-child { border-top: 0; }
.spec-when span { font-family: var(--mono); font-size: 13px; font-weight: 500; color: var(--orange-d); letter-spacing: .06em; }
.spec-when p { font-size: clamp(1.08rem, 1.45vw, 1.34rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.25; color: var(--ink); max-width: none; }
.spec-when i { width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center; background: transparent; transition: background .25s; }
.spec-when svg { width: 16px; height: 16px; fill: var(--rule); transition: fill .25s; }
.spec-when li:hover { background: #fff7ee; padding-left: 38px; }
.spec-when li:hover i { background: var(--orange); } .spec-when li:hover svg { fill: var(--ink); }

/* C: with */
.spec-dark { background: var(--navy); color: var(--paper); }
.spec-dark .spec-k { background: #101f38; border-right-color: #24385a; }
.spec-dark .spec-k span { background: var(--orange); color: var(--navy); }
.spec-dark .spec-k p { color: #8ea2bf; }
.spec-with { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 38px 30px 36px; position: relative; }
.spec-with::before { content: ''; position: absolute; left: 48px; right: 48px; top: 55px; height: 2px; background: repeating-linear-gradient(90deg, #35507c 0 8px, transparent 8px 14px); }
.spec-with li { position: relative; padding: 0 18px; display: flex; flex-direction: column; align-items: flex-start; }
.spec-n { position: relative; width: 36px; height: 36px; border-radius: 8px; border: 2px solid var(--orange); background: var(--navy); color: var(--orange); font-family: var(--mono); font-size: 13px; font-weight: 600; display: grid; place-items: center; margin-bottom: 20px; }
.spec-with small { font-family: var(--mono); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }
.spec-with b { font-size: clamp(1.2rem, 1.6vw, 1.5rem); font-weight: 750; letter-spacing: -.03em; font-variation-settings: 'wdth' 86; line-height: 1.1; margin: 6px 0 10px; }
.spec-with p { font-size: .96rem; line-height: 1.45; color: #b9c6da; max-width: none; }
.spec-with li:last-child .spec-n { background: var(--orange); color: var(--navy); }

.ind-who-note { margin-top: 44px; max-width: 78ch; font-size: .98rem; color: var(--ink-soft); padding-left: 18px; border-left: 3px solid var(--green); }

@media (max-width: 1040px) {
  .spec-head { grid-template-columns: 1fr; align-items: start; gap: 18px; }
  .spec-with { grid-template-columns: 1fr; padding: 30px 26px; gap: 0; }
  .spec-with::before { left: 43px; right: auto; top: 44px; bottom: 60px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, #35507c 0 8px, transparent 8px 14px); }
  .spec-with li { display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 20px; padding: 0 0 26px; align-items: start; }
  .spec-with li:last-child { padding-bottom: 0; }
  .spec-n { grid-row: 1 / span 3; margin: 0; }
  .spec-with small, .spec-with b, .spec-with p { grid-column: 2; }
  .spec-with b { margin: 4px 0 6px; }
}
@media (max-width: 720px) {
  .spec { border-radius: 16px; box-shadow: 0 7px 0 var(--ink); }
  .spec-row { grid-template-columns: 1fr; }
  .spec-k { flex-direction: row; align-items: center; gap: 14px; padding: 18px 20px; border-right: 0; border-bottom: 2px solid var(--ink); }
  .spec-dark .spec-k { border-bottom-color: #24385a; }
  .spec-k span { margin: 0; }
  .spec-k h3 { font-size: 1.9rem; }
  .spec-k p { margin: 0 0 0 auto; text-align: right; max-width: 12ch; }
  .spec-who { grid-template-columns: 1fr; }
  .spec-who li { padding: 16px 20px; min-height: 64px; }
  .pa { width: 40px; height: 40px; } .pa svg { width: 21px; height: 21px; }
  .spec-when li { grid-template-columns: 38px minmax(0, 1fr); padding: 16px 20px; min-height: 56px; }
  .spec-when i { display: none; }
  .spec-when li:hover { padding-left: 20px; }
  .spec-with { padding: 24px 20px; }
  .spec-with::before { left: 37px; top: 40px; }
}

/* spec sheet refinements */
.spec-who { gap: 1px; background: var(--rule); align-content: stretch; }
.spec-who li { background: #fffdf8; border: 0; margin: 0; }
.spec-when svg { fill: rgba(22, 38, 77, .26); }
.spec-with::before { right: calc(10% + 30px); }
@media (max-width: 1040px) { .spec-with::before { right: auto; } }

/* buyers always fill their row: n columns on desktop, two on tablet (an odd last one spans), one on phones */
.spec-who { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); background: #fffdf8; gap: 0; overflow: hidden; }
.spec-who li { box-shadow: 1px 0 0 var(--rule), 0 1px 0 var(--rule); padding: 30px 24px; }
@media (max-width: 1040px) {
  .spec-who { grid-template-columns: 1fr 1fr; }
  .spec-who li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 720px) { .spec-who { grid-template-columns: 1fr; } .spec-who li { padding: 16px 20px; } }

.spec-who b { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 1041px) {
  .spec-who-many li { flex-direction: column; align-items: flex-start; gap: 14px; padding: 26px 22px 28px; }
}

.ind .r-keeps b { color: #8a8f9c; font-weight: 400; text-transform: uppercase; font-size: 11px; letter-spacing: .1em; }
.r-keep-h span { display: block; max-width: 34ch; margin: 4px auto 0; line-height: 1.4; }

/* signature always sits on the rule, whatever the signer line wraps to */
.dm-sig { bottom: auto; top: 0; transform: translateY(-86%); }
.dm-sigbox { margin-top: 52px; }
.dm-sigbox small { display: block; line-height: 1.35; padding-top: 3px; }

.spec-row > .spec-honest { grid-column: 2; }
.spec-honest { margin: 0; padding: 16px 30px 18px; border-top: 2px dashed var(--ink); background: #fff7ee; font-size: .98rem; line-height: 1.45; color: var(--ink-soft); max-width: none; }
.spec-honest b { color: var(--ink); }
@media (max-width: 720px) { .spec-row > .spec-honest { grid-column: 1; padding: 14px 20px 16px; } }