/* Industry conversion layout (wave 4). Sits on top of seo-pages.css and industries.css.
   The site body is navy with cream type, so this layer works on a navy canvas: cream rules,
   cream type, and one cream panel at the top holding everything that decides a booking.
   Brand: navy #012138, cream #F0F0E8, Inter for copy, IBM Plex Mono for small labels.
   Mobile first: the outcome, the wins, the price and the button fit the first screen at 390px. */
.conv{--cv-rule:rgba(240,240,232,.26);--cv-soft:rgba(240,240,232,.07);max-width:1000px;padding-top:112px;padding-bottom:90px}
.conv .seo-crumbs{margin-bottom:16px}
.conv .ind-section{margin:40px 0}
.conv h2{font-size:clamp(23px,2.6vw,30px);line-height:1.15;letter-spacing:-.02em;margin:0 0 10px}
.conv h3{font-size:18px;margin:0 0 6px}
.conv p{font-size:16px;line-height:1.6}
.conv .ind-kicker{margin:0 0 8px;opacity:.6}

/* Hero: a cream panel on the navy page. The outcome, three wins, the price, the button. */
.cv-hero{background:#f0f0e8;color:#012138;border-radius:22px;padding:30px 7% 28px;margin:0 0 34px}
.cv-hero .cv-kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;opacity:.65;margin:0 0 12px}
.cv-hero h1{color:#012138;font-size:clamp(27px,4.3vw,46px);line-height:1.08;letter-spacing:-.03em;margin:0 0 12px;max-width:26ch}
.cv-sub{color:#012138!important;opacity:.82;font-size:16px!important;line-height:1.5;margin:0!important;max-width:54ch}
.cv-wins{list-style:none!important;padding:0!important;margin:16px 0 0!important;max-width:none!important;display:grid;gap:8px}
.cv-wins li{list-style:none!important;margin:0;color:#012138;font-size:15px;line-height:1.42;display:grid;grid-template-columns:16px 1fr;gap:10px;align-items:start}
.cv-wins li::before{content:"";width:9px;height:9px;margin-top:6px;border-radius:2px;background:#012138}
.cv-deal{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:18px 0 0;padding-top:15px;border-top:1px solid rgba(1,33,56,.24)}
.cv-price{margin:0!important;color:#012138;font-size:15px!important;max-width:none}
.cv-price strong{font-weight:600;white-space:nowrap}
.cv-hero .cv-btn{background:#012138;color:#f0f0e8!important}
.cv-btn{display:inline-block;background:#f0f0e8;color:#012138!important;padding:13px 24px;border-radius:999px;text-decoration:none!important;font-weight:600;font-size:15px;line-height:22px}
.cv-btn:hover{opacity:.88}

/* What you get and how it pays back. */
.cv-pay{display:grid;gap:0;border:1px solid var(--cv-rule);border-radius:18px;padding:4px 22px;margin:22px 0}
.cv-pay > div{padding:16px 0;border-top:1px solid var(--cv-rule)}
.cv-pay > div:first-child{border-top:0}
.cv-pay dt{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase;opacity:.62;margin-bottom:6px}
.cv-pay dd{margin:0;font-size:16px;line-height:1.6}
.cv-estimate{background:var(--cv-soft);border-radius:12px;padding:16px 18px;margin:20px 0 0}
.cv-estimate p{margin:0!important;font-size:16px}
.cv-estimate .cv-label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase;opacity:.65;display:block;margin-bottom:6px}
.cv-estimate .cv-fine{font-size:14px!important;opacity:.7;margin-top:8px!important}

/* Workflows. */
.cv-flow{list-style:none!important;padding:0!important;margin:22px 0!important;max-width:none!important;display:grid;gap:0}
.cv-flow > li{list-style:none!important;margin:0;padding:18px 0;border-top:1px solid var(--cv-rule)}
.cv-flow > li:last-child{border-bottom:1px solid var(--cv-rule)}
.cv-flow .cv-no{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.09em;opacity:.55;display:block;margin-bottom:6px}
.cv-flow p{margin:0!important;font-size:16px;line-height:1.6;max-width:62ch}
.cv-held{margin-top:9px!important;font-size:15px!important;opacity:.86;padding-left:14px;border-left:2px solid var(--cv-rule)}
.cv-held b{font-family:'IBM Plex Mono',monospace;font-weight:400;font-size:11px;letter-spacing:.09em;text-transform:uppercase;opacity:.7;display:block;margin-bottom:2px}

/* Mid page and closing call to action. */
.cv-cta{border:1px solid var(--cv-rule);background:var(--cv-soft);border-radius:18px;padding:24px 26px;margin:32px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 22px}
.cv-cta p{margin:0!important;font-size:16px!important;max-width:46ch}
.cv-cta .cv-btn{flex:0 0 auto}
.cv-close{border-top:1px solid var(--cv-rule);padding-top:26px;margin-top:40px}
.cv-close h2{margin-bottom:8px}
.cv-close p{max-width:60ch}
.conv .ind-links{margin-top:22px;font-size:14px;line-height:1.9;opacity:.85}

/* Delivery notes, short. */
.cv-runs{display:grid;gap:14px;margin:20px 0}
.cv-runs p{margin:0!important}
.conv .ind-faq details{padding:15px 0;border-bottom:1px solid var(--cv-rule)}
.conv .ind-faq summary{font-size:17px}
.conv .ind-faq details p{font-size:16px;max-width:62ch;opacity:.9}

/* Sticky mobile call to action. */
.cv-sticky{display:none}
@media (max-width:760px){
  .conv{padding-top:64px;padding-bottom:104px}
  .conv .seo-crumbs{margin-bottom:12px}
  .cv-hero{border-radius:16px;padding:22px 20px 20px;margin-bottom:28px}
  .cv-hero h1{letter-spacing:-.02em}
  .cv-deal{gap:12px}
  .cv-price{width:100%}
  .cv-btn{width:100%;text-align:center;padding:14px 20px}
  .conv .ind-section{margin:32px 0}
  .cv-pay{padding:4px 18px}
  .cv-cta{padding:22px 20px;display:block}
  .cv-cta .cv-btn{margin-top:16px}
  .seo-footer{padding-bottom:104px}
  .cv-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;align-items:center;justify-content:space-between;gap:14px;
    background:#012138;border-top:1px solid rgba(240,240,232,.3);padding:11px 14px calc(11px + env(safe-area-inset-bottom,0px))}
  .cv-sticky span{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.07em;text-transform:uppercase;opacity:.75;line-height:1.3}
  .cv-sticky a{flex:0 0 auto;background:#f0f0e8;color:#012138!important;text-decoration:none!important;font-weight:600;font-size:14px;line-height:20px;padding:12px 18px;border-radius:999px}
}

/* Layout variants, so the 30 pages do not read as one template. */
.conv-b .cv-wins li::before{border-radius:50%}
.conv-b .cv-flow{gap:14px;display:grid}
.conv-b .cv-flow > li{border:1px solid var(--cv-rule);border-radius:16px;padding:18px 20px;background:var(--cv-soft)}
.conv-b .cv-flow > li:last-child{border-bottom:1px solid var(--cv-rule)}
.conv-b .cv-pay{border:0;border-radius:0;padding:0 0 0 20px;border-left:2px solid var(--cv-rule)}
.conv-b .cv-estimate{border-radius:0}
.conv-c .cv-wins li::before{width:11px;height:3px;margin-top:9px;border-radius:0}
.conv-c .cv-flow > li{display:grid;gap:4px 22px}
.conv-c .cv-flow h3,.conv-c .cv-flow p{min-width:0}
.conv-c .cv-estimate{background:none;border:1px dashed var(--cv-rule);padding:18px 20px}
.conv-c .cv-cta{border-radius:0;background:none;border-width:1px 0}
.conv-d .cv-wins li::before{width:3px;height:14px;margin-top:4px;border-radius:0}
.conv-d .cv-pay{border-radius:0}
.conv-d .cv-flow > li{padding:16px 0 18px}
.conv-d .cv-held{border-left:0;padding-left:0;border-top:1px solid var(--cv-rule);padding-top:8px}
.conv-d .cv-cta{border-radius:0}
@media (min-width:761px){
  .conv-b .cv-flow{grid-template-columns:1fr 1fr;gap:18px 20px}
  .conv-c .cv-flow > li{grid-template-columns:140px minmax(0,1fr)}
  .conv-c .cv-no{grid-column:1;grid-row:1 / span 3;margin:0;padding-top:4px}
  .conv-c .cv-flow h3,.conv-c .cv-flow p{grid-column:2}
  .cv-pay.cv-pay-2{grid-template-columns:1fr 1fr;column-gap:30px;padding:4px 26px}
  .cv-pay.cv-pay-2 > div:nth-child(2){border-top:0}
  .conv-b .cv-pay.cv-pay-2{padding:0 0 0 20px;column-gap:26px}
}
@media (prefers-reduced-motion:reduce){.cv-btn,.cv-sticky a{transition:none}}
.cv-note{margin:0!important;color:#012138;opacity:.7;font-size:13px!important;max-width:34ch;line-height:1.4}
@media (max-width:760px){.cv-note{width:100%;margin:-4px 0 0!important}}
