/* PrimeStart v5: the conversion layer of the industry and location pages (WP4, 21 October 2026).
   Loaded after the page's own sheet (inc/v5-trades.php, inc/v5-places.php). Class names start cv- (the shared blocks) or are the
   page's own where a phone rule re-orders or folds what is already there. Phone rules are at 640px and below, as on the rest of v5.

   The managed band      .cvm   what you get, and how changes work after launch
   The enquiry card      .cvq   a callback, a quote or a chat, ahead of the questions
   The phone fold        .cvf   a section that is one line on a phone and open on a wider screen
   The final action row  .cvx   Get started, Arrange a callback, free homepage design */

/* ---------- the location hero's trust line (the industry hero already has .ih__f) ---------- */
.lch__f{list-style:none;margin:20px 0 0;padding:0;display:flex;gap:8px 20px;flex-wrap:wrap;align-items:center}
.lch__f li{display:flex;align-items:center;gap:7px;font-weight:700;font-size:14.5px;color:var(--v5-ink)}
/* a small icon in a soft tinted square, as the menu rows have (.mi__ic), instead of a green tick */
.cvt i{flex:none;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--v5-orange-50);color:var(--v5-orange-d)}
.cvt i.g{background:var(--v5-green-50);color:var(--v5-green)}
.ih__f.cvt i .ic,.lch__f.cvt i .ic{width:16px;height:16px;padding:0;border-radius:0;background:none;color:inherit;stroke-width:2.2}
.ih--c .ih__f.cvt i{background:rgba(255,255,255,.14);color:#FFB37A}
.ih--c .ih__f.cvt i.g{color:#7BE0A6}

/* ---------- the directories' hero: the callback line under the search ---------- */
.cvh{margin:14px 0 0;font-size:15px;color:var(--v5-ink-2)}
.cvh a{font-weight:800;color:var(--v5-ink);border-bottom:2px solid var(--v5-orange);padding:10px 0 2px}

/* ---------- the managed band ---------- */
.cvm{background:linear-gradient(180deg,#fff 0%,#FFF8F1 100%);padding:72px 0}
.cvm__in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:40px;align-items:stretch}
.cvm__l h2{font-size:38px;letter-spacing:-.03em;margin:12px 0 12px;max-width:none;text-wrap:balance}
.cvm__l .lead{max-width:540px}
.cvm__t{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}
.cvm__t li{display:flex;align-items:flex-start;gap:12px;min-width:0}
/* each "what you get" item has its own icon, in a soft tinted square */
.cvm__t i{flex:none;width:38px;height:38px;border-radius:12px;background:var(--v5-orange-50);color:var(--v5-orange-d);display:grid;place-items:center}
.cvm__t li:nth-child(2) i{background:var(--v5-sky-50);color:var(--v5-sky)}
.cvm__t li:nth-child(3) i{background:var(--v5-green-50);color:var(--v5-green)}
.cvm__t li:nth-child(4) i{background:var(--v5-lilac-50);color:#5B45C9}
.cvm__t li:nth-child(5) i{background:var(--v5-butter-50);color:#946C00}
.cvm__t li:nth-child(6) i{background:#EEF2F7;color:var(--v5-ink)}
.cvm__t i .ic{width:17px;height:17px}
.cvm__t b{display:block;font-size:15.5px;line-height:1.3;color:var(--v5-ink)}
.cvm__t small{display:block;font-size:13.5px;line-height:1.4;color:var(--v5-ink-3);margin-top:2px}
.cvm__r{border-radius:var(--v5-r-xl);background:var(--v5-ink);color:#fff;padding:34px 32px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--v5-sh-2)}
.cvm__ic{width:44px;height:44px;border-radius:14px;background:var(--v5-orange);color:var(--v5-ink);display:grid;place-items:center}
.cvm__ic .ic{width:22px;height:22px}
.cvm__r h3{font-size:24px;letter-spacing:-.02em;color:#fff;margin:4px 0 0}
.cvm__r p{font-size:15.5px;line-height:1.55;color:#D5DCE6;margin:0}
.cvm__r .cvm__care{font-size:14px;color:#B7C2D1;padding-top:12px;border-top:1px solid rgba(255,255,255,.16)}
.cvm__g{margin-top:auto;display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:15px;color:#fff;border-bottom:2px solid var(--v5-orange);align-self:flex-start;padding-bottom:2px}
.cvm__g .ic{width:18px;height:18px;color:var(--v5-orange)}

/* ---------- the enquiry card ---------- */
.cvq{padding:0 0 64px}
.cvq__box{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:28px 34px;border-radius:var(--v5-r-xl);background:#fff;border:1.5px solid var(--v5-line);box-shadow:var(--v5-sh-1)}
.cvq__t{min-width:0;flex:1 1 300px}
.cvq__t h2{font-size:26px;letter-spacing:-.02em;margin:0}
.cvq__t p{margin:6px 0 0;font-size:16px;color:var(--v5-ink-2)}
.cvq__b{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cvq__b .btn .ic{width:17px;height:17px}
.cvq__chat{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 6px;font-weight:800;font-size:15px;color:var(--v5-ink);border-bottom:2px solid var(--v5-orange)}
.cvq__chat .ic{width:18px;height:18px}
.sec--soft + .cvq,.ipk + .cvq,#packages + .cvq{margin-top:0}
.ipk{padding-bottom:56px}
#packages{padding-bottom:56px}

/* ---------- the final action row ---------- */
.cvx{flex-wrap:wrap}
.cvx__f{margin:16px 0 0;position:relative;z-index:2}
.cvx__f .link{color:var(--v5-ink);border-bottom-color:var(--v5-ink)}

/* ---------- the phone fold: nothing on a wide screen ---------- */
.cvf__s{display:none}
.cvf__b{display:block}

/* ---------- what stays on the phones, in the order of the page ---------- */
@media (max-width:1000px){
  .cvm__in{grid-template-columns:minmax(0,1fr);gap:26px}
  .cvm__l h2{font-size:32px}
}

@media (max-width:640px){
  /* the hero: heading, one line, two buttons, the trust line; the illustration is dropped (the real client site follows) */
  .ih{padding-bottom:6px}
  .ih__v{display:none}
  .ih__in{min-height:0}
  .ih__b .btn,.lch__b .btn{min-height:50px;height:50px}
  .ih__b{flex-direction:column;align-items:stretch}
  .ih__f,.lch__f{justify-content:center;gap:6px 14px;margin-top:14px}
  .ih__f li,.lch__f li{font-size:13.5px}
  .lch__t{text-align:center}
  .lch--d .lch__v{order:0;margin-top:14px}
  .lch--s .lch__ph--2 img,.lch__ph--2 img{height:160px}
  .lch__ph--2 figcaption{padding:6px 12px 4px}
  .lch__in{padding-bottom:26px}

  .cvh{text-align:center}

  /* the real client site, compact, straight after the hero */
  .irl{padding:8px 0 28px}
  .irl .irel__h{margin-bottom:12px}
  .irl .irel__h .link{display:none}
  .irl .irel__h h2{font-size:22px}
  #work{padding:8px 0 28px}
  #work .head{margin-bottom:14px}
  #work .head h2{font-size:22px}
  #work .head .lead{display:none}
  .lwk .lwk__c:nth-child(n+2){display:none}

  /* the managed band */
  .cvm{padding:36px 0 32px}
  .cvm__l h2{font-size:27px}
  .cvm__t{grid-template-columns:minmax(0,1fr);gap:11px;margin-top:18px}
  .cvm__t small{display:none}
  .cvm__t b{font-size:15px}
  .cvm__t i{width:34px;height:34px;border-radius:11px}
  .cvm__r{padding:24px 22px;border-radius:24px}
  .cvm__r h3{font-size:21px}
  .cvm__r p{font-size:15px}

  /* the packages: recommended first, one price per card (the page prints no other) */
  .pks .pk--rec,.lcp .lcp__c--rec{order:-1}
  .ipk,#packages{padding-top:34px;padding-bottom:30px}
  #packages .head,.ipk .head{margin-bottom:10px}
  #packages .head .lead,.ipk .head .lead{font-size:15px}

  /* the enquiry card */
  .cvq{padding:0 0 34px}
  .cvq__box{padding:22px 20px;gap:16px;border-radius:24px}
  .cvq__t{flex-basis:100%}
  .cvq__t h2{font-size:22px}
  .cvq__t p{font-size:15px}
  .cvq__b{flex-direction:column;align-items:stretch;gap:10px;width:100%}
  .cvq__b .btn{width:100%;min-height:50px;height:50px}
  .cvq__chat{justify-content:center;border-bottom:0;min-height:48px;border-radius:999px;background:var(--v5-soft)}

  /* the fold: every depth section is a one-line bar until it is opened */
  .sec:has(> details.cvf),.sec--soft:has(> details.cvf){padding:0;border-top:1px solid var(--v5-line)}
  .cvf__s{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:60px;padding:14px var(--v5-pad);cursor:pointer;list-style:none;font-weight:800;font-size:16px;line-height:1.3;color:var(--v5-ink)}
  .cvf__s::-webkit-details-marker{display:none}
  .cvf__s i{flex:none;width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid var(--v5-line);display:grid;place-items:center;transition:transform .2s ease,background .2s ease}
  .cvf__s i .ic{width:14px;height:14px;stroke-width:2.6}
  .cvf[open] > .cvf__s i{transform:rotate(45deg);background:var(--v5-orange);border-color:var(--v5-orange)}
  .cvf__b{padding:6px 0 38px}
  .cvf:not([open]) > .cvf__b{display:none}

  /* the questions: five at most on a phone (the full set stays on the page for a wider screen and in the structured data) */
  .faq .qa:nth-of-type(n+6){display:none}
  .faq .qa summary{font-size:16px;padding:16px 0;min-height:56px}
  #loc-faq,.faq{scroll-margin-top:70px}

  /* nearby places and similar trades: a compact list of links */
  .irel{padding:28px 0}
  .irel__g{grid-template-columns:minmax(0,1fr);gap:8px}
  .irel__i{height:auto;border-radius:14px;background:#fff;border:1px solid var(--v5-line)}
  .irel__i img{display:none}
  .irel__i span{position:static;background:none;box-shadow:none;color:var(--v5-ink);min-height:50px;padding:12px 16px;font-size:15px}
  .lcb{grid-template-columns:minmax(0,1fr);gap:8px}
  .lcb__c{height:auto;min-height:52px;border-radius:14px;background:#fff;border:1px solid var(--v5-line);display:flex;align-items:center}
  .lcb__c img{display:none}
  .lcb__t{position:static;background:none;box-shadow:none;padding:12px 44px 12px 16px;display:block}
  .lcb__t b{font-size:16px;color:var(--v5-ink)}
  .lcb__t small{display:none}
  .lcb .ft__go{right:10px;bottom:auto;top:50%;margin-top:-15px}

  /* the final action band */
  .cvx{flex-direction:column;align-items:stretch;gap:10px}
  .cvx .btn{width:100%;min-height:50px;height:50px}
  .cvx__f{text-align:center}
}

@media (max-width:359px){
  .cvm__l h2{font-size:24px}
  .cvq__t h2{font-size:20px}
}
