/* svc-v2: the shared visual system for the redesigned service pages, the
   About page and the Who we help pages (2026-09-27). base.html links it on
   any page whose body class contains svc-v2, just before the page's own
   extra_style block, so page rules still come after these. Every rule is
   scoped to body.svc-v2 (the ind-v2 section to body.ind-v2), so no other page
   changes. Until 2026-09-27 this was inlined from
   templates/partials/svc_v2_styles.html; it moved here so browsers cache it
   instead of every page carrying about 32KB of CSS. asset() adds a content
   hash, so every edit gets a new URL. */

/* Compatibility with the homepage-v2 base (tokens.css + site.css, 2026-09-27).
   These pages were designed and approved on the earlier base: Newsreader
   headings, the earlier palette, and a reset with no list padding, inherited
   link colour and plain headings. The rules below restore exactly that
   inside <main> only, so the new header, footer, menu and action bar keep
   the homepage-v2 look. Specificity mirrors the earlier base: the padding
   reset is 0,0,0 and the element resets 0,0,1, so they tie with site.css
   element rules and win by coming later, and any class rule beats them. */
/* Newsreader trimmed to the weights these pages use (400 to 600) and to
   Latin-1 plus curly quotes, dashes and a few symbols: 34KB instead of the
   58KB full variable font (static/fonts/newsreader-normal-latin.woff2,
   weights 200 to 800), which delayed first paint. Built with fontTools
   (varLib.instancer wght 400:600, then subset). */
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/newsreader-400-600-latin.woff2) format('woff2');unicode-range:U+0020-007E,U+00A0-00FF,U+2013-2014,U+2018-2019,U+201C-201D,U+2022,U+2026,U+20AC,U+2122}
@font-face{font-family:'Newsreader Fallback T';font-weight:300;src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Tinos'),local('Liberation Serif');size-adjust:102.06%;ascent-override:72.01%;descent-override:25.96%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback T';font-weight:400;src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Tinos'),local('Liberation Serif');size-adjust:104.79%;ascent-override:70.14%;descent-override:25.29%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback N';font-weight:300;src:local('Noto Serif'),local('NotoSerif-Regular');size-adjust:87.01%;ascent-override:84.48%;descent-override:30.46%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback N';font-weight:400;src:local('Noto Serif'),local('NotoSerif-Regular');size-adjust:89.33%;ascent-override:82.28%;descent-override:29.66%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback D';font-weight:300;src:local('DejaVu Serif'),local('DejaVuSerif');size-adjust:80.75%;ascent-override:91.02%;descent-override:32.82%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback D';font-weight:400;src:local('DejaVu Serif'),local('DejaVuSerif');size-adjust:82.91%;ascent-override:88.65%;descent-override:31.96%;line-gap-override:0%}
:where(.svc-v2 main){--font-serif:'Newsreader','Newsreader Fallback T','Newsreader Fallback N','Newsreader Fallback D',serif;--navy:#143049;--navy-deep:#0c1f30;--teal:#2a8fa3;--teal-light:#4ab0c4;--cream:#eeeeee;--cream-warm:#e2e2e2;--paper:#f9f9f9;--ink:#1a1a1a;--ink-soft:#3a3a3a;--muted:#4f4f4f;--line:#d8d8d8;background:var(--paper);color:var(--ink);font-size:16px;line-height:1.55}
:where(.svc-v2 main *){padding:0}
:where(.svc-v2 main) :is(ul,ol){list-style:none}
:where(.svc-v2 main) a{color:inherit;text-decoration:none}
:where(.svc-v2 main) a:hover{color:inherit}
:where(.svc-v2 main) :is(h1,h2,h3,h4){font-family:inherit;font-size:revert;font-weight:bold;color:inherit;line-height:inherit;letter-spacing:normal;text-wrap:pretty}
:where(.svc-v2 main) :is(strong,b){font-weight:bolder;color:inherit}
:where(.svc-v2 main) svg{display:inline;max-width:none}
:where(.svc-v2 main) :is(picture,video){display:inline;max-width:none}
:where(.svc-v2 main) :is(input,button,textarea,select){font:revert;color:revert}
:where(.svc-v2 main) .cf-turnstile{margin:4px 0 14px;min-height:65px;max-width:100%}

/* Fallback faces for the heavier weights these pages use (Newsreader 500/600,
   Public Sans 600), measured like the 300/400 faces in base.html, so the
   web-font swap does not move headings or buttons. */
@font-face{font-family:'Newsreader Fallback T';font-weight:500;src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Tinos'),local('Liberation Serif');size-adjust:106.91%;ascent-override:68.75%;descent-override:24.79%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback T';font-weight:600;src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Tinos'),local('Liberation Serif');size-adjust:109.76%;ascent-override:66.96%;descent-override:24.14%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback N';font-weight:500;src:local('Noto Serif'),local('NotoSerif-Regular');size-adjust:91.65%;ascent-override:80.20%;descent-override:28.92%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback N';font-weight:600;src:local('Noto Serif'),local('NotoSerif-Regular');size-adjust:94.10%;ascent-override:78.11%;descent-override:28.16%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback D';font-weight:500;src:local('DejaVu Serif'),local('DejaVuSerif');size-adjust:84.70%;ascent-override:86.78%;descent-override:31.29%;line-gap-override:0%}
@font-face{font-family:'Newsreader Fallback D';font-weight:600;src:local('DejaVu Serif'),local('DejaVuSerif');size-adjust:86.96%;ascent-override:84.52%;descent-override:30.47%;line-gap-override:0%}
@font-face{font-family:'Public Sans Fallback A';font-weight:600;src:local('Arial'),local('ArialMT'),local('Arimo'),local('Liberation Sans');size-adjust:106.75%;ascent-override:88.99%;descent-override:21.08%;line-gap-override:0%}
@font-face{font-family:'Public Sans Fallback R';font-weight:600;src:local('Roboto'),local('Roboto-Regular');size-adjust:107.38%;ascent-override:88.47%;descent-override:20.95%;line-gap-override:0%}
@font-face{font-family:'Public Sans Fallback D';font-weight:600;src:local('DejaVu Sans'),local('DejaVuSans');size-adjust:92.96%;ascent-override:102.19%;descent-override:24.20%;line-gap-override:0%}

/* Tokens */
.svc-v2{--v2-ink:#0c1f30;--v2-navy:#143049;--v2-body:#2f2f2f;--v2-muted:#4f4f4f;--v2-teal-text:#1d6f80;--v2-teal-line:#2a8fa3;--v2-teal-light:#4ab0c4;--v2-rule:#d8d8d8;--v2-rule-2:#e2e2e2;--v2-tint:#e6f1f4;--v2-dark-text:#c9d4dc;--v2-dark-text-2:#d5dee5;--v2-frame:#cfd6da}

/* Layout: 1120px content, 80px sides (20px on phones), left aligned */
.svc-v2 .v2-wrap{position:relative;z-index:2;max-width:1280px;margin:0 auto;padding:0 clamp(20px,6.25vw,80px)}
.svc-v2 .v2-band{padding:96px 0}
.svc-v2 .v2-white{background:#fff;border-top:1px solid var(--v2-rule-2);border-bottom:1px solid var(--v2-rule-2)}
.svc-v2 .v2-white+.v2-white{border-top:0}
.svc-v2 main p{font-size:17px;line-height:1.65;color:var(--v2-body)}
.svc-v2 main [id]{scroll-margin-top:88px}
.svc-v2 .v2-h1{font-family:var(--font-serif);font-weight:500;font-size:64px;line-height:1.04;letter-spacing:-0.015em;color:var(--v2-ink)}
.svc-v2 .v2-h2{font-family:var(--font-serif);font-weight:500;font-size:44px;line-height:1.1;color:var(--v2-ink)}
.svc-v2 .v2-h2.v2-h2-lg{font-size:48px}
.svc-v2 .v2-h2-sm{font-family:var(--font-serif);font-weight:500;font-size:36px;line-height:1.15;color:var(--v2-ink)}
.svc-v2 main .v2-lede{font-size:19px;line-height:1.6}
.svc-v2 main .v2-muted{color:var(--v2-muted)}
.svc-v2 main .v2-fine{font-size:13px;line-height:1.55;color:var(--v2-muted)}
.svc-v2 .v2-label{font-family:var(--font-sans);font-size:14px;font-weight:600;line-height:1.4;color:var(--v2-teal-text)}
.svc-v2 main .v2-caption,.svc-v2 main figcaption{margin-top:12px;font-size:14px;line-height:1.5;color:var(--v2-muted)}
.svc-v2 .v2-link{color:var(--v2-navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.svc-v2 .v2-link-teal{color:var(--v2-teal-text);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* Hero: text left, figure right (page sets --v2-fig to the figure width) */
.svc-v2 .v2-hero{padding:72px 0 88px;background:var(--paper)}
.svc-v2 .v2-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) var(--v2-fig,560px);gap:56px;align-items:center}
.svc-v2 .v2-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:22px;font-size:14px;color:var(--v2-muted)}
.svc-v2 .v2-crumbs a{color:var(--v2-muted);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:2px;padding:12px 0;margin:-12px 0}
.svc-v2 .v2-crumbs a:hover{text-decoration-color:currentColor}
.svc-v2 .v2-crumbs [aria-current]{color:var(--v2-body)}

/* Section header row: heading left, intro right */
.svc-v2 .v2-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:56px}
.svc-v2 .v2-head-row .v2-h2{max-width:620px}
.svc-v2 main .v2-head-row p{font-size:16px;line-height:1.6;color:var(--v2-muted);max-width:420px}
/* Two columns, 5fr and 6fr */
.svc-v2 .v2-split{display:grid;grid-template-columns:5fr 6fr;gap:72px;align-items:start}
/* What-this-is statement: under a .v2-split, a 2px navy rule, then one large
   Newsreader statement in the right-hand column (left cell left empty) */
.svc-v2 .v2-pull{display:grid;grid-template-columns:5fr 6fr;gap:72px;margin-top:56px;padding-top:40px;border-top:2px solid var(--v2-navy)}
.svc-v2 main .v2-pull p{grid-column:2;font-family:var(--font-serif);font-weight:400;font-size:26px;line-height:1.45;color:var(--v2-ink)}
.svc-v2 main .v2-pull p a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* 380px heading column beside content */
.svc-v2 .v2-aside-grid{display:grid;grid-template-columns:380px minmax(0,1fr);gap:64px;align-items:start}

/* 1. Buttons: 52px, 6px radius, weight 600, no arrows, no lift */
.svc-v2 .v2-actions{display:flex;flex-wrap:wrap;gap:12px}
/* Call and Text (partials/contact_actions.html) as one group in a button
   row: side by side while both fit, stacked when they do not. */
.svc-v2 .v2-pair{display:flex;flex-wrap:wrap;gap:12px}
.svc-v2 main .v2-pair .v2-btn{flex:1 1 auto;width:auto}
.svc-v2 .v2-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:6px;border:1.5px solid transparent;font-family:var(--font-sans);font-size:16px;font-weight:600;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .15s ease,color .15s ease}
.svc-v2 .v2-btn-primary{background:var(--v2-navy);border-color:var(--v2-navy);color:#fff}
.svc-v2 .v2-btn-primary:hover{background:var(--v2-ink);border-color:var(--v2-ink)}
.svc-v2 .v2-btn-outline{background:transparent;border-color:var(--v2-navy);color:var(--v2-navy)}
.svc-v2 .v2-btn-outline:hover{background:rgba(20,48,73,.06)}
.svc-v2 .v2-btn-light{background:#fff;border-color:#fff;color:var(--v2-navy)}
.svc-v2 .v2-btn-light:hover{background:var(--v2-tint);border-color:var(--v2-tint)}
.svc-v2 .v2-btn-outline-light{background:transparent;border-color:var(--v2-teal-light);color:#fff}
.svc-v2 .v2-btn-outline-light:hover{background:rgba(74,176,196,.14)}

/* Focus: 2px teal ring, 2px offset (light-teal on dark and navy bands) */
.svc-v2 main a:focus-visible,.svc-v2 main button:focus-visible,.svc-v2 main summary:focus-visible{outline:2px solid var(--v2-teal-text);outline-offset:2px}
.svc-v2 main .v2-dark a:focus-visible,.svc-v2 main .v2-dark button:focus-visible,.svc-v2 main .v2-closing a:focus-visible,.svc-v2 main .v2-closing button:focus-visible,.svc-v2 main .v2-on-navy a:focus-visible,.svc-v2 main .v2-on-navy button:focus-visible{outline-color:var(--v2-teal-light)}

/* 2. Rule grid: 2px navy rule on top, no boxes */
.svc-v2 .v2-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 48px}
.svc-v2 .v2-rules.v2-rules-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.svc-v2 .v2-rule{border-top:2px solid var(--v2-navy);padding-top:18px}
.svc-v2 .v2-rule h3{font-family:var(--font-serif);font-weight:600;font-size:22px;line-height:1.25;color:var(--v2-ink);margin-bottom:10px}
.svc-v2 main .v2-rule p{font-size:15.5px;line-height:1.6}
.svc-v2 .v2-dark .v2-rule{border-top-color:var(--v2-teal-light)}
.svc-v2 .v2-dark .v2-rule h3{font-family:var(--font-sans);font-weight:600;font-size:18px;line-height:1.35;color:#fff}

/* 3. Statement rows: 28px heading (5fr) beside its paragraph (6fr) */
.svc-v2 .v2-statements{border-bottom:1px solid var(--v2-rule)}
.svc-v2 .v2-statement{display:grid;grid-template-columns:5fr 6fr;gap:48px;padding:32px 0;border-top:1px solid var(--v2-rule)}
.svc-v2 .v2-statement h3{font-family:var(--font-serif);font-weight:500;font-size:28px;line-height:1.25;color:var(--v2-ink)}

/* 4. Route: a real <ol>; 40px markers joined by a 3px dashed teal line */
/* The markers' z-index keeps them above the line. */
.svc-v2 .v2-route{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px;position:relative}
.svc-v2 .v2-stop{position:relative;min-width:0}
.svc-v2 .v2-route:not(.v2-route-vertical) .v2-stop:not(:last-child)::before{content:'';position:absolute;top:19px;left:20px;width:calc(100% + 36px);border-top:3px dashed var(--v2-teal-line)}
.svc-v2 .v2-marker{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:20px;border-radius:50%;background:var(--paper);border:3px solid var(--v2-navy);color:var(--v2-navy);font-family:var(--font-sans);font-size:16px;font-weight:700}
.svc-v2 .v2-white .v2-marker{background:#fff}
.svc-v2 .v2-marker.v2-marker-dashed{border-style:dashed}
.svc-v2 .v2-marker.v2-marker-solid{background:var(--v2-navy);color:#fff}
/* Step headings and text. A page sets its spec's heading size with
   --v2-stop-h3 (default 24px); on phones it is capped at 24px. */
.svc-v2 .v2-stop h3{font-family:var(--font-serif);font-weight:500;font-size:var(--v2-stop-h3,24px);line-height:1.25;color:var(--v2-ink);margin-bottom:10px}
.svc-v2 main .v2-stop p{font-size:15.5px;line-height:1.6}
/* Vertical: the markers sit on the left edge. Each stop but the last draws
   the line from its own marker's centre across the 36px row gap to the next
   marker's centre, so the line ends at the last marker. The heading's first
   line is centred on its marker: 20px (half the marker) less half of the
   1.25em line box. */
.svc-v2 .v2-route.v2-route-vertical{grid-template-columns:minmax(0,1fr);gap:36px}
.svc-v2 .v2-route.v2-route-vertical .v2-stop{padding-left:64px}
.svc-v2 .v2-route.v2-route-vertical .v2-stop:not(:last-child)::after{content:'';position:absolute;left:19px;top:20px;height:calc(100% + 36px);border-left:3px dashed var(--v2-teal-line)}
.svc-v2 .v2-route.v2-route-vertical .v2-marker{position:absolute;left:0;top:0;margin:0}
.svc-v2 .v2-route.v2-route-vertical .v2-stop h3{margin-top:calc(20px - .625em)}

/* 5. Dark band */
.svc-v2 .v2-dark{background:var(--v2-ink)}
.svc-v2 .v2-dark .v2-h2{color:#fff}
.svc-v2 main .v2-dark p{color:var(--v2-dark-text)}

/* 6. Closing band: text left, stacked full-width buttons right */
.svc-v2 .v2-closing{background:var(--v2-navy)}
.svc-v2 .v2-closing-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:64px;align-items:center}
.svc-v2 .v2-closing .v2-h2{color:#fff;margin-bottom:16px}
.svc-v2 main .v2-closing p{color:var(--v2-dark-text-2);max-width:600px}
.svc-v2 .v2-closing-actions{display:flex;flex-direction:column;gap:14px}
.svc-v2 .v2-book{align-self:flex-start;min-height:44px;padding:0;background:none;border:0;color:#fff;font-family:var(--font-sans);font-size:16px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* The booking link is an <a data-book>: keep the old button box (text centred in 44px, button line-height, default underline). */
.svc-v2 a.v2-book{display:inline-flex;align-items:center;line-height:normal;text-decoration-thickness:auto}

/* 7. Headshot line */
.svc-v2 .v2-author{display:flex;align-items:center;gap:14px;margin-top:28px;max-width:540px}
.svc-v2 .v2-author picture{flex:0 0 52px;display:block}
.svc-v2 .v2-author img{display:block;width:52px;height:52px;max-width:none;border-radius:50%;object-fit:cover;object-position:50% 20%}
.svc-v2 main .v2-author p{margin:0;font-size:14.5px;line-height:1.5;color:var(--v2-muted)}
.svc-v2 .v2-author strong{color:var(--v2-body);font-weight:600}
/* The About link's 44px tap area is a transparent ::before, 44px tall and
   centred on the text, so the link itself carries no padding and its focus
   ring hugs the text instead of crossing the line above. nowrap keeps the
   link on one line, so the ::before has one box to size against. */
.svc-v2 .v2-author a{position:relative;color:var(--v2-navy);font-weight:600;text-decoration:underline;text-underline-offset:2px;white-space:nowrap;display:inline-block}
.svc-v2 .v2-author a::before{content:'';position:absolute;left:0;right:0;top:50%;height:44px;transform:translateY(-50%)}

/* Panels */
.svc-v2 .v2-tint{background:var(--v2-tint);border-radius:10px;padding:32px}
.svc-v2 .v2-panel{background:#fff;border:1px solid var(--v2-rule);border-radius:10px;padding:28px}
.svc-v2 .v2-paper{background:#fff;border:1px solid var(--v2-frame);border-radius:4px;padding:40px}
.svc-v2 .v2-shot{display:block;border:1px solid var(--v2-rule);border-radius:8px;overflow:hidden}

/* "Often paired with": a 64px band (48px on phones; the page adds v2-white
   where the paper/white alternation needs it), then
   <h2 class="v2-paired-h">Often paired with</h2> and the .v2-links row. */
.svc-v2 .v2-band.v2-paired{padding:64px 0}
.svc-v2 .v2-paired-h{font-family:var(--font-serif);font-weight:500;font-size:28px;line-height:1.2;color:var(--v2-ink);margin-bottom:20px}
.svc-v2 .v2-links{display:flex;flex-wrap:wrap;gap:12px 36px}
.svc-v2 .v2-links a{display:inline-flex;align-items:center;min-height:44px;font-size:18px;font-weight:600;color:var(--v2-navy);text-decoration:underline;text-decoration-color:var(--v2-rule);text-underline-offset:4px}
.svc-v2 .v2-links a:hover{text-decoration-color:currentColor}
/* A short muted note under the links (the data handling line). Vertical
   padding on its inline link gives a 44px tap area without changing the
   line height or where the text wraps. */
.svc-v2 main .v2-note{margin-top:20px;font-size:15px;line-height:1.6;color:var(--v2-muted)}
.svc-v2 main .v2-note a{padding:13.5px 0}

/* Check lists: a drawn teal check before each item (v2-checks-light on navy) */
.svc-v2 .v2-checks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.svc-v2 main .v2-checks li{position:relative;padding-left:30px;font-size:15.5px;line-height:1.6;color:var(--v2-body)}
.svc-v2 .v2-checks li::before{content:'';position:absolute;left:5px;top:.3em;width:6px;height:12px;border:solid var(--v2-teal-text);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.svc-v2 main .v2-checks.v2-checks-light li{color:var(--v2-dark-text-2)}
.svc-v2 .v2-checks.v2-checks-light li::before{border-color:var(--v2-teal-light)}

/* FAQ: <details> rows, serif summary, plus that turns into a minus.
   A page can set --v2-faq-size (default 22px) on .v2-faq. */
.svc-v2 .v2-faq{border-bottom:1px solid var(--v2-rule)}
.svc-v2 .v2-faq details{border-top:1px solid var(--v2-rule)}
.svc-v2 .v2-faq summary{position:relative;display:block;list-style:none;padding:22px 48px 22px 0;cursor:pointer;font-family:var(--font-serif);font-weight:500;font-size:var(--v2-faq-size,22px);line-height:1.3;color:var(--v2-ink)}
.svc-v2 .v2-faq summary::-webkit-details-marker{display:none}
.svc-v2 .v2-faq summary::before,.svc-v2 .v2-faq summary::after{content:'';position:absolute;right:8px;top:calc(22px + var(--v2-faq-size,22px) * .65 - 1px);width:16px;height:2px;background:var(--v2-navy);transition:transform .15s ease}
.svc-v2 .v2-faq summary::after{transform:rotate(90deg)}
.svc-v2 .v2-faq details[open] summary::after{transform:rotate(0deg)}
.svc-v2 .v2-faq-a{padding:0 48px 26px 0}
.svc-v2 main .v2-faq-a p+p{margin-top:14px}

/* Fixed-size hero drawings, scaled down on phones without overflow.
   Markup: <div class="v2-draw-box"><div class="v2-draw">...</div></div>
   The page sets the unitless --v2-draw-w and --v2-draw-h (e.g. 540 and 470)
   on its .v2-draw-box rule. Below 600px the drawing scales to 350px wide,
   below 390px to 280px, and the box shrinks with it so nothing overflows. */
.svc-v2 .v2-draw-box{--v2-draw-s:1;position:relative;width:calc(var(--v2-draw-w) * var(--v2-draw-s) * 1px);height:calc(var(--v2-draw-h) * var(--v2-draw-s) * 1px)}
.svc-v2 .v2-draw{position:absolute;left:0;top:0;width:calc(var(--v2-draw-w) * 1px);height:calc(var(--v2-draw-h) * 1px);transform:scale(var(--v2-draw-s));transform-origin:0 0}
/* Skeleton text bars inside drawings (the page sets each bar's width) */
.svc-v2 .v2-skel{height:8px;border-radius:4px;background:var(--v2-rule-2)}

/* Show-more toggle. Items the script collapses get the hidden attribute;
   without JavaScript every item shows and the button stays hidden. */
.svc-v2 main [hidden]{display:none!important}
.svc-v2 .v2-toggle{margin-top:32px}

/* Website cards (/web-design #work, the /case-studies Work page): a 4:3
   screenshot, meta line, serif name, blurb, optional spec note, Visit site.
   Markup: partials/wd_card.html. Moved from /web-design 2026-09-27. */
.svc-v2 .wd-work{list-style:none;margin:64px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 40px}
.svc-v2 .wd-card{display:flex;flex-direction:column;min-width:0}
.svc-v2 .wd-card-shot{position:relative;aspect-ratio:4 / 3;background:var(--v2-navy)}
.svc-v2 .wd-card-shot picture{display:block;height:100%}
.svc-v2 .wd-card-shot img{display:block;width:100%;height:100%;object-fit:cover}
.svc-v2 .wd-card-ph{display:none;position:absolute;inset:0;align-items:center;justify-content:center;padding:20px;text-align:center;background:var(--v2-navy);color:#fff;font-family:var(--font-serif);font-size:19px;line-height:1.35}
.svc-v2 main .wd-card-meta{margin-top:18px;font-size:13.5px;line-height:1.45;color:var(--v2-muted)}
.svc-v2 .wd-card h3{margin-top:6px;font-family:var(--font-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--v2-ink)}
.svc-v2 .wd-card h3 a{color:inherit;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;padding:12px 0}
.svc-v2 .wd-card h3 a:hover{text-decoration-color:currentColor}
.svc-v2 main .wd-card-blurb{margin-top:10px;font-size:15.5px;line-height:1.6}
.svc-v2 main .wd-card-spec{margin-top:8px}
.svc-v2 .wd-card-visit{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;margin-top:auto;padding-top:6px;font-size:15px}
@media (max-width:900px){.svc-v2 .wd-work{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.svc-v2 .wd-work{grid-template-columns:minmax(0,1fr);gap:48px;margin-top:48px}}
/* End website cards */

@media (prefers-reduced-motion:reduce){.svc-v2 main *{transition:none!important;scroll-behavior:auto!important}}

@media (max-width:1100px){
  .svc-v2 .v2-hero-grid{grid-template-columns:minmax(0,1fr);gap:48px}
  .svc-v2 .v2-route:not(.v2-route-vertical){grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 36px}
  .svc-v2 .v2-route:not(.v2-route-vertical) .v2-stop:not(:last-child)::before{content:none}
}
@media (max-width:1000px){.svc-v2 .v2-rules{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .svc-v2 .v2-aside-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .svc-v2 .v2-split{grid-template-columns:minmax(0,1fr);gap:32px}
  .svc-v2 .v2-pull{grid-template-columns:minmax(0,1fr);gap:0;margin-top:40px;padding-top:32px}
  .svc-v2 main .v2-pull p{grid-column:1}
  .svc-v2 .v2-head-row{flex-direction:column;align-items:flex-start;gap:16px}
  .svc-v2 .v2-closing-grid{grid-template-columns:minmax(0,1fr);gap:32px}
}
@media (max-width:800px){.svc-v2 .v2-statement{grid-template-columns:minmax(0,1fr);gap:12px;padding:28px 0}}
@media (max-width:700px){
  .svc-v2 .v2-wrap{padding:0 20px}
  .svc-v2 .v2-band{padding:64px 0}
  .svc-v2 .v2-hero{padding:48px 0 64px}
  .svc-v2 .v2-h1{font-size:40px}
  .svc-v2 .v2-h2,.svc-v2 .v2-h2.v2-h2-lg{font-size:33px}
  .svc-v2 .v2-h2-sm{font-size:28px}
  .svc-v2 main .v2-lede{font-size:18px}
  .svc-v2 .v2-rules,.svc-v2 .v2-rules.v2-rules-2{grid-template-columns:minmax(0,1fr)}
  .svc-v2 .v2-actions .v2-btn{width:100%}
  .svc-v2 .v2-actions .v2-pair{width:100%}
  /* Every route runs vertically: per-stop connectors as on
     .v2-route-vertical (36px row gap), each heading's first line centred on
     its marker. */
  .svc-v2 .v2-route:not(.v2-route-vertical){grid-template-columns:minmax(0,1fr);gap:36px}
  .svc-v2 .v2-stop{padding-left:60px}
  .svc-v2 .v2-stop:not(:last-child)::after{content:'';position:absolute;left:19px;top:20px;height:calc(100% + 36px);border-left:3px dashed var(--v2-teal-line)}
  .svc-v2 .v2-marker{position:absolute;left:0;top:0;margin:0}
  .svc-v2 .v2-stop h3{font-size:min(var(--v2-stop-h3,24px),24px);margin-top:calc(20px - .625em)}
  .svc-v2 .v2-statement h3{font-size:24px}
  .svc-v2 .v2-closing-actions .v2-btn{width:100%}
  .svc-v2 .v2-paper{padding:28px 22px}
  .svc-v2 .v2-faq summary{padding-right:40px}
  .svc-v2 .v2-faq-a{padding-right:0}
  .svc-v2 .v2-toggle{width:100%}
  .svc-v2 main .v2-pull p{font-size:22px}
  .svc-v2 .v2-band.v2-paired{padding:48px 0}
  .svc-v2 .v2-paired-h{margin-bottom:24px}
  /* The page's last section (the closing band) keeps 150px below its
     content on phones, clear of the fixed call bar. */
  /* After the .v2-paired padding above, so it also wins on a last .v2-paired band. */
  .svc-v2 .v2-band.v2-last{padding-bottom:150px}
}
/* Phones, where base.html shows the call bar (Call and Text): anything
   marked v2-hide-phone (the hero's Call and Text pair) steps aside, so
   the hero keeps one full-width button. The scroll padding keeps a control
   reached with Tab clear of the fixed bar (78px of bar plus 10px), so its
   focus ring shows; the page scrolls, so it sits on the root element. */
@media (max-width:640px){
  .svc-v2 main .v2-hide-phone{display:none}
  html:has(body.svc-v2.has-mobile-cta-bar){scroll-padding-bottom:calc(88px + env(safe-area-inset-bottom))}
}
@media (max-width:600px){.svc-v2 .v2-draw-box{--v2-draw-s:calc(350 / var(--v2-draw-w))}}
@media (max-width:389px){.svc-v2 .v2-draw-box{--v2-draw-s:calc(280 / var(--v2-draw-w))}}

/* Nav drawer (base.html, 1200px and below): closed, it sits just past the
   right edge, where its shadow painted a grey band down these light pages
   and its links stayed in the Tab order. Closed: no shadow, and hidden once
   the .38s slide-out ends. Open: visible at once. The swipe-to-close
   script's inline transition and transform still take precedence.
   base.html sets visibility:visible on the drawer's service dropdowns (the
   phone accordion), which would keep their links in the Tab order; while
   the drawer is closed they follow the drawer instead. */
@media (max-width:1200px){
  .svc-v2 .nav-drawer-wrap:not(.open){box-shadow:none;visibility:hidden;transition:transform .38s cubic-bezier(0.16,1,0.3,1),visibility 0s linear .38s}
  .svc-v2 .nav-drawer-wrap:not(.open) .dropdown{visibility:inherit}
  .svc-v2 .nav-drawer-wrap.open{visibility:visible;transition:transform .38s cubic-bezier(0.16,1,0.3,1)}
}

/* ---------- ind-v2: Who we help pages (2026-09-27) ----------
   The hub and the five industry pages (body.svc-v2.ind-v2). Everything
   above is shared; these are only the new components: sample sheet, run
   demo, hours check, problem switcher and industry tiles, plus the talk
   band restore. Markup: partials/industry_v2.html, industries_all.html. */
.ind-v2{--ind-idle:#b9c2c8;--ind-row:#f4f7f8}
.ind-v2 main .ind-intro{max-width:560px;margin:22px 0 32px;font-size:18px;line-height:1.6}
.ind-v2 main .ind-hub-intro{max-width:720px;margin-bottom:0}
.ind-v2 .ind-sec-h{max-width:760px;margin-bottom:48px}
.ind-v2 .v2-band.ind-ruled{border-top:1px solid var(--v2-rule-2)}

/* 1. Sample sheet (hero figure) */
.ind-v2 .v2-hero-grid{--v2-fig:540px}
.ind-v2 .ind-sheet-fig{margin:0;min-width:0}
.ind-v2 .ind-sheet{box-sizing:border-box;background:#fff;border:1px solid var(--v2-frame);border-radius:14px;padding:28px}
.ind-v2 main .ind-sheet-label{font-size:12.5px;font-weight:600;line-height:1.4;color:var(--v2-teal-text)}
.ind-v2 main .ind-sheet-title{margin-top:6px;font-family:var(--font-serif);font-weight:500;font-size:26px;line-height:1.2;color:var(--v2-ink)}
.ind-v2 .ind-sheet-rows{margin:18px 0 20px;border-bottom:1px solid var(--v2-rule-2)}
.ind-v2 .ind-sheet-rows>div{padding:12px 0;border-top:1px solid var(--v2-rule-2)}
.ind-v2 .ind-sheet-rows dt{font-size:13px;line-height:1.4;color:var(--v2-muted)}
.ind-v2 .ind-sheet-rows dd{margin:2px 0 0;font-size:15.5px;font-weight:500;line-height:1.45;color:var(--v2-ink);overflow-wrap:anywhere}
.ind-v2 main .ind-sheet-flag{padding:12px 14px;border-radius:8px;background:var(--v2-tint);font-size:14.5px;line-height:1.45;color:var(--v2-ink)}
.ind-v2 main .ind-sheet-stamp{display:inline-block;margin-top:18px;padding:6px 14px;border:2px dashed var(--v2-teal-line);border-radius:999px;font-size:14px;font-weight:600;line-height:1.3;color:var(--v2-teal-text)}

/* Pills: variant picker, hours options, problem switcher */
.ind-v2 .ind-pills{display:flex;flex-wrap:wrap;gap:10px}
.ind-v2 .ind-pill{box-sizing:border-box;min-height:44px;padding:8px 20px;border-radius:999px;border:1.5px solid var(--v2-navy);background:#fff;color:var(--v2-navy);font-family:var(--font-sans);font-size:15.5px;font-weight:600;line-height:1.25;text-align:center;cursor:pointer;transition:background-color .15s ease,color .15s ease}
.ind-v2 .ind-pill:hover{background:rgba(20,48,73,.06)}
.ind-v2 .ind-pill[aria-pressed="true"]{background:var(--v2-navy);color:#fff}
.ind-v2 .ind-pill.ind-pill-lg{min-height:52px;padding:8px 12px}

/* 2. Workflow demo, run layout */
.ind-v2 .ind-variants{margin-bottom:32px}
.ind-v2 .ind-demo-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:48px;align-items:start}
.ind-v2 .ind-came-in{background:var(--ind-row);border:1px solid var(--v2-rule-2);border-radius:10px;padding:24px}
.ind-v2 .ind-came-in h3{margin-bottom:12px;font-family:var(--font-serif);font-weight:600;font-size:21px;line-height:1.25;color:var(--v2-ink)}
.ind-v2 .ind-came-in dl>div{padding:10px 0;border-top:1px solid var(--v2-rule-2)}
.ind-v2 .ind-came-in dt{font-size:13px;line-height:1.4;color:var(--v2-muted)}
.ind-v2 .ind-came-in dd{margin:2px 0 0;font-size:15.5px;font-weight:500;line-height:1.45;color:var(--v2-ink);overflow-wrap:anywhere}
.ind-v2 main .ind-sample-note{margin-top:14px;font-size:13px;line-height:1.5;color:var(--v2-muted)}
.ind-v2 .ind-steps{display:grid;gap:4px}
.ind-v2 .ind-step{display:grid;grid-template-columns:36px minmax(0,1fr);gap:18px;padding:18px 16px;border-radius:10px}
.ind-v2 .ind-step.is-latest{background:var(--ind-row)}
.ind-v2 .ind-num{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:2px solid var(--ind-idle);background:#fff;color:var(--v2-muted);font-size:15px;font-weight:700}
.ind-v2 .ind-step.is-run .ind-num{background:var(--v2-navy);border-color:var(--v2-navy);color:#fff}
.ind-v2 .ind-step-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-height:36px}
.ind-v2 .ind-step h3{font-family:var(--font-serif);font-weight:600;font-size:21px;line-height:1.25;color:var(--v2-ink)}
.ind-v2 .ind-tag{display:inline-block;padding:3px 10px;border-radius:999px;font-size:13px;font-weight:600;line-height:1.35}
.ind-v2 .ind-tag-auto{background:var(--v2-tint);color:var(--v2-teal-text)}
.ind-v2 .ind-tag-person{background:var(--v2-navy);color:#fff}
.ind-v2 main .ind-step p{margin-top:8px;font-size:15.5px;line-height:1.6}
.ind-v2 .ind-checks{min-width:0;margin:14px 0 0;border:0}
.ind-v2 .ind-checks legend{margin-bottom:4px;font-size:14.5px;font-weight:600;line-height:1.4;color:var(--v2-ink)}
.ind-v2 .ind-check{display:flex;align-items:center;gap:12px;min-height:44px}
.ind-v2 .ind-check input{flex:0 0 auto;width:22px;height:22px;margin:0;accent-color:var(--v2-navy);cursor:pointer}
.ind-v2 .ind-check input:disabled{cursor:default}
.ind-v2 .ind-check label{flex:1;padding:10px 0;font-size:15.5px;line-height:1.4;color:var(--v2-body);cursor:pointer}
.ind-v2 .ind-controls{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0 16px}
.ind-v2 .ind-controls .v2-btn:disabled{background:var(--v2-rule-2);border-color:var(--v2-rule-2);color:var(--v2-muted);cursor:not-allowed}
.ind-v2 .ind-summary{margin-top:24px}
.ind-v2 .ind-split{padding:24px 28px;border-radius:10px;background:var(--v2-navy)}
.ind-v2 .ind-split:focus-visible{outline:2px solid var(--v2-teal-light);outline-offset:2px}
.ind-v2 main .ind-split-label{font-size:13px;font-weight:600;line-height:1.4;color:var(--v2-teal-light)}
.ind-v2 main .ind-split-text{margin-top:8px;font-family:var(--font-serif);font-weight:400;font-size:22px;line-height:1.4;color:#fff}

/* 3. Hours check */
.ind-v2 .ind-hours{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:start}
.ind-v2 main .ind-hours-intro{margin-top:16px;max-width:560px}
.ind-v2 .ind-q{min-width:0;margin:32px 0 0;border:0}
.ind-v2 .ind-q legend{margin-bottom:12px;font-size:17px;font-weight:600;line-height:1.4;color:var(--v2-ink)}
.ind-v2 .ind-q-opts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ind-v2 .ind-result{box-sizing:border-box;background:#fff;border:1px solid var(--v2-rule);border-radius:14px;padding:28px}
.ind-v2 main .ind-result-task{font-size:14px;font-weight:600;line-height:1.4;color:var(--v2-teal-text)}
.ind-v2 main .ind-result-num{margin-top:8px;font-family:var(--font-serif);font-weight:500;font-size:36px;line-height:1.15;color:var(--v2-ink)}
.ind-v2 main .ind-result-num.is-empty{font-family:var(--font-sans);font-weight:400;font-size:17px;line-height:1.5;color:var(--v2-muted)}
.ind-v2 main .ind-result-msg{margin-top:14px;font-size:16px;line-height:1.55}
.ind-v2 .ind-result-book{margin-top:18px}
.ind-v2 main .ind-math{margin-top:20px;font-size:14.5px;line-height:1.5;color:var(--v2-ink)}
.ind-v2 main .ind-fine{margin-top:12px;font-size:13px;line-height:1.55;color:var(--v2-muted)}

/* What we'd build: the note under the rule grid; navy band group labels */
.ind-v2 main .ind-build-note{margin-top:40px;font-size:16px;line-height:1.6;color:var(--v2-muted)}
.ind-v2 .ind-group-label{margin:0 0 20px;font-family:var(--font-sans);font-size:16px;font-weight:600;line-height:1.4;color:var(--v2-teal-light)}
.ind-v2 .ind-keep+.ind-group-label{margin-top:56px}

/* 4. Problem switcher (hub) */
.ind-v2 .ind-switch-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:40px 28px;margin-top:40px}
.ind-v2 .ind-switch-cols li{min-width:0;padding-top:16px;border-top:2px solid var(--v2-navy)}
.ind-v2 main .ind-switch-name{font-size:13px;font-weight:600;line-height:1.4;color:var(--v2-teal-text)}
.ind-v2 main .ind-switch-ex{margin-top:8px;font-family:var(--font-serif);font-weight:400;font-size:21px;line-height:1.3;color:var(--v2-ink)}
.ind-v2 main .ind-switch-link{margin-top:28px}
.ind-v2 .ind-switch-link a{display:inline-block;padding:12px 0}

/* 5. Industry tiles (hub) */
.ind-v2 .ind-hub-hero{padding-bottom:96px}
.ind-v2 .ind-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:56px}
.ind-v2 .ind-tile{box-sizing:border-box;display:flex;flex-direction:column;height:100%;padding:28px;background:#fff;border:1px solid var(--v2-rule);border-radius:10px;color:var(--v2-body);transition:border-color .15s ease}
.ind-v2 .ind-tile:hover{border-color:var(--v2-navy)}
.ind-v2 .ind-tile-name{font-family:var(--font-serif);font-weight:500;font-size:28px;line-height:1.15;color:var(--v2-ink)}
.ind-v2 main .ind-tile-label{margin-top:16px;font-size:13px;line-height:1.4;color:var(--v2-muted)}
.ind-v2 main .ind-tile-task{margin-top:4px;font-size:17px;line-height:1.5;color:var(--v2-body)}
.ind-v2 main .ind-tile-go{margin-top:auto;padding-top:20px;font-size:16px;font-weight:600;line-height:1.4;color:var(--v2-teal-text)}
.ind-v2 .ind-tile-navy{background:var(--v2-navy);border-color:var(--v2-navy)}
.ind-v2 .ind-tile-navy:hover{border-color:var(--v2-teal-light)}
.ind-v2 .ind-tile-navy .ind-tile-name{color:#fff}
.ind-v2 main .ind-tile-navy .ind-tile-task{margin-top:16px;color:var(--v2-dark-text-2)}
.ind-v2 main .ind-tile-navy .ind-tile-go{color:var(--v2-teal-light)}
.ind-v2 main .ind-tile-navy:focus-visible{outline-color:var(--v2-navy)}

/* Hub: not listed */
.ind-v2 .ind-else{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:64px;align-items:center}
.ind-v2 main .ind-else .v2-h2+p{margin-top:16px;max-width:600px}
.ind-v2 .ind-else-actions{display:flex;flex-direction:column;gap:12px}

/* The shared talk band (partials/talk_band.html) sits inside <main>, where
   the svc-v2 compatibility resets above would turn its heading into the
   inherited sans face and its text dark on navy. These restore exactly what
   site.css gives it on every other page. */
.ind-v2 main .band--navy{--font-serif:'Source Serif 4','Serif Fallback G','Serif Fallback N','Serif Fallback D',Georgia,serif;font-size:var(--fs-body);line-height:var(--lh-body)}
.ind-v2 main .talk h2{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-h2);line-height:1.2;letter-spacing:-0.01em;color:var(--white);text-wrap:balance}
.ind-v2 main .talk p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--on-navy)}
.ind-v2 main .talk .talk__fine{font-size:var(--fs-small)}
.ind-v2 main .talk svg{display:block}

@media (max-width:1100px){
  .ind-v2 .ind-sheet-fig{width:100%}
  .ind-v2 .ind-hours{grid-template-columns:minmax(0,1fr) 360px;gap:40px}
}
@media (max-width:1000px){.ind-v2 .ind-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .ind-v2 .ind-demo-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .ind-v2 .ind-controls .v2-btn{width:100%}
  .ind-v2 .ind-hours{grid-template-columns:minmax(0,1fr);gap:32px}
  .ind-v2 .ind-else{grid-template-columns:minmax(0,1fr);gap:28px}
}
@media (max-width:800px){.ind-v2 .ind-switch-cols{grid-template-columns:minmax(0,1fr);gap:24px}}
@media (max-width:700px){
  .ind-v2 .ind-sec-h{margin-bottom:32px}
  .ind-v2 .ind-sheet{padding:22px}
  .ind-v2 .ind-step{gap:14px;padding:16px 10px}
  .ind-v2 .ind-controls{margin-left:0}
  .ind-v2 .ind-q-opts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ind-v2 .ind-result{padding:22px}
  .ind-v2 main .ind-result-num{font-size:30px}
  .ind-v2 .ind-hub-hero{padding-bottom:64px}
  .ind-v2 .ind-tiles{margin-top:40px}
  .ind-v2 .ind-else-actions .v2-btn{width:100%}
}
@media (max-width:640px){.ind-v2 .ind-tiles{grid-template-columns:minmax(0,1fr)}}