/* /next8 shared components: on the standalone homepage (html.x8) and inside inner pages (.x8-scope). Pixel units only:
   inner pages are drawn on the 1440px proportional canvas, where viewport units would scale twice. */
.x8, .x8-scope {
    --x-ink:#041b18; --x-ink-2:#072a25; --x-deep:#0b4a43; --x-green:#007b67; --x-mint:#8fe0c6; --x-mint-2:#d4f7ea;
    --x-paper:#f3f8f6; --x-text:#0f2a3f; --x-muted:#51665f; --x-line:#d6e5df; --x-amber:#fff1cc;
    --x-head:'Poppins','Poppins Fallback',system-ui,sans-serif; --x-body:'Work Sans','Work Sans Fallback',system-ui,sans-serif;
}
.x8-scope { color:var(--x-text); font:400 17px/1.6 var(--x-body); }
.x8-scope *, .x8-scope *::before, .x8-scope *::after { box-sizing:border-box; }
.x8-scope h1, .x8-scope h2, .x8-scope h3 { font-family:var(--x-head); color:var(--x-text); }
.x8-scope .x-eyebrow { margin:0 0 14px; color:var(--x-green); font:600 13px/1.3 var(--x-body); letter-spacing:.18em; text-transform:uppercase; }
.x8-scope .x-btn, .x8 .x-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 26px; border:0; border-radius:99px; font:600 16px/1.1 var(--x-body); text-decoration:none; cursor:pointer; transition:transform .2s, background .2s; }
.x8-scope .x-btn-mint, .x8 .x-btn-mint { background:var(--x-mint); color:var(--x-ink) !important; }
.x8-scope .x-btn-mint:hover, .x8 .x-btn-mint:hover { background:#b4f0db; transform:translateY(-1px); }
.x8-quiet { padding:0; border:0; background:none; color:var(--x-green); font:600 15px/1.4 var(--x-body); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.x8-quiet:hover { color:var(--x-deep); }
.x8-sr, .x8-meta, .staging-demo-honeypot { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* The header bar, identical on the homepage and inner pages. */
.x8-topbar { color:#e8f4ef; background:#041b18; box-shadow:0 1px 0 #ffffff14; font-family:var(--x-body); }
.x8-topbar .x-wrap { width:min(1280px, 100% - 48px); margin-inline:auto; }
.x8-topbar a { text-decoration:none; }
.x8-topbar .x-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.x8-topbar .x-nav-row { display:flex; align-items:center; justify-content:space-between; height:72px; }
.x8-topbar .x-logo img { display:block; width:124px; height:auto; }
.x8-topbar .x-menu { display:flex; align-items:center; gap:24px; margin:0; font:500 15px/1 var(--x-body); }
.x8-topbar .x-menu > a:not(.x-btn) { color:#e8f4ef; }
.x8-topbar .x-menu > a:not(.x-btn):hover, .x8-topbar .x-solutions summary:hover { color:var(--x-mint); }
.x8-topbar .x-solutions { position:relative; }
.x8-topbar .x-solutions summary { display:flex; align-items:center; gap:7px; color:#e8f4ef; list-style:none; cursor:pointer; }
.x8-topbar .x-solutions summary::-webkit-details-marker { display:none; }
.x8-topbar .x-solutions summary::after { content:''; width:7px; height:7px; border:solid currentColor; border-width:0 2px 2px 0; transform:translateY(-2px) rotate(45deg); transition:transform .2s; }
.x8-topbar .x-solutions[open] summary::after { transform:translateY(2px) rotate(-135deg); }
.x8-topbar .x-solutions-panel { position:absolute; top:calc(100% + 24px); left:-24px; display:grid; grid-template-columns:repeat(3,max-content); gap:10px 44px; padding:26px 30px; border-radius:20px; background:#fff; color:var(--x-text); box-shadow:0 40px 80px -30px #000a; }
.x8-topbar .x-solutions-panel p { margin:0 0 8px; color:var(--x-green); font:600 12px/1.2 var(--x-body); letter-spacing:.14em; text-transform:uppercase; }
.x8-topbar .x-solutions-panel a { display:block; padding:6px 0; color:var(--x-text); font:500 15px/1.3 var(--x-body); }
.x8-topbar .x-solutions-panel a:hover { color:var(--x-green); }
.x8-topbar .x-menu-toggle { display:none; width:46px; height:46px; padding:0; border:1px solid #ffffff40; border-radius:12px; background:transparent; cursor:pointer; }
.x8-topbar .x-menu-toggle span:not(.x-sr) { display:block; width:20px; height:2px; margin:5px auto; background:#fff; transition:transform .25s; }
.x8-topbar .x-menu-toggle[aria-expanded="true"] span:nth-child(1) { transform:translateY(3.5px) rotate(45deg); }
.x8-topbar .x-menu-toggle[aria-expanded="true"] span:nth-child(2) { transform:translateY(-3.5px) rotate(-45deg); }
.x8-topbar .x-btn { display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:99px; font:600 15px/1.1 var(--x-body); cursor:pointer; transition:transform .2s, background .2s; }
.x8-topbar .x-btn-mint { background:var(--x-mint); color:var(--x-ink) !important; }
.x8-topbar .x-btn-mint:hover { background:#b4f0db; }
.x8-topbar .x-nav-cta { padding:12px 20px; }
@media (max-width:1180px) { .x8-topbar .x-menu { gap:16px; font-size:14px; } }
@media (max-width:1060px) {
    .x8-topbar .x-menu-toggle { display:block; }
    .x8-topbar .x-menu { position:fixed; inset:72px 0 auto; display:none; flex-direction:column; align-items:stretch; gap:0; max-height:calc(100svh - 72px); overflow:auto; padding:12px 24px 28px; background:var(--x-ink); box-shadow:0 30px 60px #0008; }
    .x8-topbar .x-menu.is-open { display:flex; }
    .x8-topbar .x-menu > a, .x8-topbar .x-solutions summary { padding:16px 0; border-bottom:1px solid #ffffff14; font-size:17px; }
    .x8-topbar .x-solutions-panel { position:static; grid-template-columns:1fr 1fr; gap:6px 24px; margin:6px 0 10px; padding:18px; }
    .x8-topbar .x-nav-cta { margin-top:18px; }
}
@media (max-width:720px) { .x8-topbar .x-wrap { width:calc(100% - 32px); } }

/* The footer, identical on the homepage and inner pages. */
.x-footer { padding:64px 0 56px; background:#031512; color:#9fbab2; font:400 15px/1.6 var(--x-body); }
.x-footer .x-wrap { width:min(1280px, 100% - 48px); margin-inline:auto; }
.x-footer a { color:inherit; text-decoration:none; }
.x-footer a:hover { color:var(--x-mint); }
.x-footer-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr .7fr 1fr; gap:28px; }
.x-footer img { display:block; height:auto; }
.x8-footer-brand > img { width:120px; }
.x-footer p { margin:14px 0 0; }
.x-footer nav p { margin:0 0 12px; color:#fff; font-weight:600; }
.x-footer-grid nav a { display:block; padding:4px 0; }
.x8-footer-badges { display:flex; flex-wrap:wrap; gap:8px; }
.x8-footer-badges span { padding:5px 11px; border:1px solid #ffffff24; border-radius:99px; color:#d6e9e3; font-size:12.5px; }
.x8-footer-apps { display:flex; flex-wrap:wrap; gap:10px; }
.x8-footer-apps img { width:auto; height:40px; }
.x8-footer-reviews { display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; margin-top:36px !important; padding-top:24px; border-top:1px solid #ffffff14; }
.x8-footer-reviews a { display:inline-flex; padding:6px 10px; border-radius:10px; background:#fff; }
.x8-footer-reviews img { width:auto; height:30px; }
.x8-footer-reviews .x8-footer-review-text { align-items:center; height:42px; padding:6px 14px; color:#0f2a3f !important; font:700 15px/1 var(--x-body); }
.x8-footer-reviews small { flex:1 1 280px; color:#7f9a92; font-size:11.5px; line-height:1.45; }
.x-footer .x-legal { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 24px; margin-top:24px; padding-top:20px; border-top:1px solid #ffffff14; font-size:13px; }
.x-footer .x-legal p { margin:0; }
.x-footer .x-legal nav { display:flex; flex-wrap:wrap; gap:6px 18px; }
.x-footer .x-legal nav button { padding:0; border:0; background:none; color:inherit; font:inherit; cursor:pointer; }
.x-footer .x-legal nav button:hover { color:var(--x-mint); }

/* Cookie banner and choices (CookieYes sets its colours inline, hence !important): the site's type and colours.
   Reject All and Accept All stay identical so neither choice is nudged. The banner sits outside .x8-scope. */
#cookie-law-info-bar { border-top:1px solid #04140f14; box-shadow:0 -10px 30px #04140f1f; font-family:var(--x-body, 'Work Sans', system-ui, sans-serif) !important; }
#cookie-law-info-bar .cli-bar-message { color:var(--x-text, #0f2a3f); font-size:14.5px; line-height:1.55; }
#cookie-law-info-bar .cli-plugin-button { padding:11px 20px !important; border-radius:99px !important; font:600 14.5px/1 var(--x-body, 'Work Sans', system-ui, sans-serif) !important; }
#cookie-law-info-bar .wt-cli-reject-btn, #cookie-law-info-bar .wt-cli-accept-all-btn, #cliSettingsPopup .cli_setting_save_button { background:var(--x-ink, #041b18) !important; color:#fff !important; }
#cookie-law-info-bar .cli_settings_button { background:transparent !important; color:var(--x-ink, #041b18) !important; box-shadow:inset 0 0 0 1px #04140f40; }
#cookie-law-info-again { padding:6px 14px !important; border-radius:10px 10px 0 0; font:600 13px/1.4 var(--x-body, 'Work Sans', system-ui, sans-serif) !important; }
#cliSettingsPopup { font-family:var(--x-body, 'Work Sans', system-ui, sans-serif); }
#cliSettingsPopup .cli_setting_save_button { padding:11px 20px; border-radius:99px; font:600 14px/1 var(--x-body, 'Work Sans', system-ui, sans-serif); }
@media (max-width:1060px) { .x-footer-grid { grid-template-columns:1fr 1fr 1fr; } .x8-footer-brand { grid-column:1 / -1; } }
@media (max-width:720px) { .x-footer .x-wrap { width:calc(100% - 32px); } .x-footer-grid { grid-template-columns:1fr 1fr; } }

/* Screens in a realistic browser window, and on a laptop for the lead screen (Elle's DEV Site list). */
.x8-shot { position:relative; margin:0; }
.x8-shot figcaption { margin-top:10px; color:var(--x-muted); font:500 13px/1.3 var(--x-body); text-align:center; }
.x8-shot small { display:inline-block; margin-left:6px; padding:2px 8px; border-radius:99px; background:var(--x-amber); color:#6e4c00; font:600 11px/1.5 var(--x-body); }
.x8-browser { overflow:hidden; border-radius:10px; background:#fff; box-shadow:0 40px 80px -36px #000c, 0 0 0 1px #0000001a; }
.x8-tabs { display:flex; align-items:flex-end; gap:2px; height:30px; padding:0 8px; background:#dfe5e3; font:500 10.5px/1 var(--x-body); color:#3d4b47; }
.x8-lights { display:flex; gap:5px; align-self:center; margin-right:10px; }
.x8-lights i { width:9px; height:9px; border-radius:50%; background:#ff5f57; }
.x8-lights i:nth-child(2) { background:#febc2e; }
.x8-lights i:nth-child(3) { background:#28c840; }
.x8-tab { display:flex; align-items:center; gap:6px; max-width:180px; height:24px; padding:0 12px; overflow:hidden; border-radius:7px 7px 0 0; white-space:nowrap; text-overflow:ellipsis; }
.x8-tab.is-active { background:#fff; color:#17211f; }
.x8-favicon { flex:none; width:10px; height:10px; border-radius:3px; background:var(--x-green); box-shadow:inset 0 0 0 2.5px #fff6; }
.x8-newtab { align-self:center; padding:0 6px; color:#66736f; font-size:14px; }
.x8-toolbar { display:flex; align-items:center; gap:10px; height:28px; padding:0 10px; border-bottom:1px solid #e3e8e6; background:#fff; }
.x8-arrows { display:flex; gap:9px; color:#8a9692; font:600 13px/1 var(--x-body); }
.x8-arrows i { font-style:normal; }
.x8-address { flex:1; display:flex; align-items:center; gap:6px; height:19px; padding:0 10px; border-radius:99px; background:#eef2f1; color:#3d4b47; font:500 10.5px/1 var(--x-body); }
.x8-address svg { width:10px; height:10px; fill:none; stroke:#3d4b47; stroke-width:1.5; }
.x8-screen { display:block; width:100%; padding:0; border:0; background:#fff; cursor:zoom-in; }
.x8-screen img { display:block; max-width:none; height:auto; }
.x8-laptop .x8-lid { padding:10px 10px 12px; border-radius:16px 16px 6px 6px; background:#151b1a; box-shadow:0 0 0 1px #2f3836, inset 0 0 0 2px #0c100f; }
.x8-laptop .x8-lid::before { content:''; display:block; width:6px; height:6px; margin:-5px auto 4px; border-radius:50%; background:#2c3533; }
.x8-laptop .x8-browser { border-radius:4px; box-shadow:none; }
.x8-base { position:relative; height:14px; margin:0 -7%; border-radius:0 0 14px 14px; background:linear-gradient(180deg,#c9d1ce 0%,#9aa5a1 70%,#7d8885 100%); box-shadow:0 30px 50px -24px #000c; }
.x8-base i { position:absolute; left:50%; top:0; width:16%; height:5px; border-radius:0 0 8px 8px; background:#7d8885; transform:translateX(-50%); }
.x8-phone > button { display:block; padding:0; border:0; background:none; cursor:zoom-in; }
.x8-phone-frame { position:relative; display:block; padding:5.5%; border-radius:17% / 8%; background:#0d1412; box-shadow:0 40px 70px -30px #000e, inset 0 0 0 2px #2c3734; }
.x8-phone-island { position:absolute; z-index:1; top:4.6%; left:50%; width:30%; height:2.4%; border-radius:99px; background:#0d1412; transform:translateX(-50%); }
.x8-phone-screen { display:block; overflow:hidden; aspect-ratio:9 / 19; border-radius:13% / 6%; background:#fff; }
.x8-phone-screen img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; padding-top:9%; background:#fff; }

/* Savings estimate. */
.x8-estimate { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:28px; align-items:stretch; }
.x8-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-content:start; margin:0; padding:26px; border:1px solid var(--x-line); border-radius:24px; background:#fff; }
.x8-field { display:grid; gap:6px; align-content:end; }
.x8-inputs.is-full { grid-template-columns:repeat(6,minmax(0,1fr)); }
.x8-inputs.is-full .x8-field { grid-column:span 2; }
.x8-inputs.is-full .x8-field:nth-of-type(n+4) { grid-column:span 3; }
.x8-field > span { color:var(--x-text); font:600 14px/1.3 var(--x-body); }
.x8-field input { width:100%; min-width:0; height:56px; padding:0 14px; border:1.5px solid #b9cec7; border-radius:14px; background:#fff; color:var(--x-text); font:600 24px/1 var(--x-head); }
.x8-field input:focus { outline:3px solid #8fe0c680; border-color:var(--x-green); }
.x8-field small { color:var(--x-muted); font-size:12.5px; line-height:1.4; }
.x8-hour { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 12px; padding:14px 16px 16px; border-radius:16px; background:var(--x-paper); font:600 14px/1.3 var(--x-body); }
.x8-hour-range { flex:1 0 100%; height:22px; margin:2px 0 0; background:transparent; accent-color:var(--x-green); cursor:pointer; -webkit-appearance:none; appearance:none; }
.x8-hour-range::-webkit-slider-runnable-track { height:6px; border-radius:6px; background:linear-gradient(90deg,var(--x-green) var(--fill,6.4%),#cfe0da var(--fill,6.4%)); }
.x8-hour-range::-moz-range-track { height:6px; border-radius:6px; background:#cfe0da; }
.x8-hour-range::-moz-range-progress { height:6px; border-radius:6px; background:var(--x-green); }
.x8-hour-range::-webkit-slider-thumb { -webkit-appearance:none; width:22px; height:22px; margin-top:-8px; border:3px solid #fff; border-radius:50%; background:var(--x-green); box-shadow:0 2px 6px #0f3b3666; }
.x8-hour-range::-moz-range-thumb { width:16px; height:16px; border:3px solid #fff; border-radius:50%; background:var(--x-green); box-shadow:0 2px 6px #0f3b3666; }
.x8-hour-range:focus-visible { outline:3px solid #8fe0c6; outline-offset:4px; border-radius:8px; }
.x8-stepper { display:flex; align-items:center; gap:4px; }
.x8-stepper button { width:40px; height:40px; border:1.5px solid #b9cec7; border-radius:50%; background:#fff; color:var(--x-deep); font:600 22px/1 var(--x-body); cursor:pointer; }
.x8-stepper button:hover { border-color:var(--x-green); }
.x8-stepper output { min-width:112px; color:var(--x-deep); font:700 18px/1 var(--x-head); text-align:center; }
.x8-answer { display:flex; flex-direction:column; padding:28px 30px; border-radius:24px; background:var(--x-ink); color:#e6f2ee; }
.x8-big { margin:0; color:#cfe3dc; font:500 17px/1.3 var(--x-body); }
.x8-big b { display:block; margin-bottom:4px; color:#fff; font:700 64px/1 var(--x-head); letter-spacing:-.04em; }
.x8-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:22px 0 0; }
.x8-kpis div { padding:14px; border:1px solid #ffffff1f; border-radius:16px; background:#ffffff0a; }
.x8-kpis dt { color:#a9c6bd; font-size:13px; }
.x8-kpis dd { margin:4px 0 0; color:var(--x-mint); font:700 21px/1.15 var(--x-head); }
.x8-basis { grid-column:1 / -1; margin:4px 0 0; color:var(--x-muted); font-size:14px; line-height:1.6; }
.x8-basis a { color:var(--x-green); }
.x8-answer-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; margin-top:auto; padding-top:24px; }
.x8-answer .x8-quiet { color:var(--x-mint); }
.x8-status { min-height:1em; margin:8px 0 0; color:var(--x-mint); font-size:14px; }

/* Report form, opened in place. */
.x8-report { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:36px; margin-top:22px; padding:32px; border:1px solid var(--x-line); border-radius:24px; background:#fff; scroll-margin-top:96px; }
.x8-report[hidden] { display:none; }
.x8-report-intro h3, .x8-done h3 { margin:0; font:700 26px/1.15 var(--x-head); letter-spacing:-.02em; }
.x8-report-intro p, .x8-done p { margin:12px 0 0; color:var(--x-muted); font-size:16px; line-height:1.6; }
.x8-done { grid-column:1 / -1; max-width:620px; outline:none; }
.x8-done[hidden] { display:none; }
.x8-done-icon { display:grid; place-items:center; width:52px; height:52px; margin-bottom:14px; border-radius:50%; background:var(--x-mint-2); color:var(--x-deep); }
.x8-done-icon svg { width:26px; height:26px; }
.x8-done .x-btn { margin-top:20px; }

/* Contact Form 7 forms in the /next8 style. */
.x8-cf7 { margin:0; }
.x8-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.x8-f { display:grid; gap:6px; margin:0; }
.x8-f > span:first-child { color:var(--x-text); font:600 14px/1.3 var(--x-body); }
.x8-f-wide { grid-column:1 / -1; }
.x8-cf7 .wpcf7-form-control-wrap { display:block; }
.x8-cf7 input[type="text"], .x8-cf7 input[type="email"], .x8-cf7 input[type="tel"], .x8-cf7 input[type="number"], .x8-cf7 select, .x8-cf7 textarea {
    width:100%; min-height:50px; margin:0; padding:12px 14px; border:1.5px solid #b9cec7; border-radius:12px; background:#fff; color:var(--x-text); font:400 16px/1.3 var(--x-body); box-shadow:none;
}
.x8-cf7 textarea { min-height:74px; resize:vertical; }
.x8-cf7 input:focus, .x8-cf7 select:focus, .x8-cf7 textarea:focus { outline:3px solid #8fe0c680; border-color:var(--x-green); }
.x8-cf7 fieldset { min-width:0; margin:20px 0 0; padding:0; border:0; }
.x8-cf7 legend { margin-bottom:10px; padding:0; color:var(--x-text); font:600 15px/1.3 var(--x-body); }
.x8-problems .wpcf7-checkbox { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.x8-problems .wpcf7-list-item { display:block; margin:0; }
.x8-problems label { display:flex; align-items:flex-start; gap:10px; height:100%; padding:10px 12px; border:1.5px solid var(--x-line); border-radius:12px; font-size:14.5px; line-height:1.35; cursor:pointer; transition:border-color .2s, background .2s; }
.x8-problems label:hover { border-color:#9fc4b8; }
.x8-problems label:has(input:checked) { border-color:var(--x-green); background:#eefaf5; }
.x8-problems input, .x8-consent input { flex:none; width:18px; height:18px; margin:1px 0 0; accent-color:var(--x-green); }
.x8-optional { padding:16px !important; border-radius:16px !important; background:var(--x-paper) !important; }
.x8-optional legend { float:left; width:100%; margin-bottom:12px; color:var(--x-muted); font-weight:500; }
/* The legend floats so it sits inside the box. The grid starts its own layout, so without clear it squeezes in beside the float. */
.x8-optional .x8-fields { clear:both; }
.x8-consent { margin:18px 0 0; font-size:14.5px; }
.x8-consent .wpcf7-list-item { margin:0; }
.x8-consent label { display:flex; align-items:flex-start; gap:10px; cursor:pointer; }
.x8-privacy { margin:10px 0 0; color:var(--x-muted); font-size:13.5px; }
.x8-privacy a { color:var(--x-green); }
.x8-cf7 .wpcf7-submit { margin-top:18px; padding:16px 30px; border:0; border-radius:99px; background:var(--x-ink); color:#fff; font:600 16px/1 var(--x-body); cursor:pointer; transition:background .2s; }
.x8-cf7 .wpcf7-submit:hover { background:var(--x-deep); }
.x8-cf7 .wpcf7-spinner { margin:18px 0 0 12px; vertical-align:middle; }
.x8-cf7 .wpcf7-not-valid-tip { margin-top:4px; color:#a3251b; font-size:13px; }
.x8-cf7 .wpcf7-not-valid { border-color:#c4483d !important; }
.x8-cf7 .wpcf7-response-output { margin:16px 0 0 !important; padding:12px 14px !important; border-radius:12px; font-size:14.5px; }
/* Where Google's spam check is on (live), it loads only after Functional cookies: the consent script holds the button and shows this note. */
.x8-cf7 .wpcf7-submit:disabled { opacity:.45; cursor:not-allowed; }
.x8-cf7 .collabit-captcha-notice { margin-top:14px; padding:12px 14px; border-radius:12px; background:var(--x-paper); color:var(--x-muted); font-size:13.5px; line-height:1.5; }
.x8-cf7 .collabit-captcha-notice p { margin:0; }
.x8-cf7 .collabit-captcha-notice a { color:var(--x-green); }
.x8-cf7 .collabit-captcha-notice button { margin-top:6px; padding:0; border:0; background:none; color:var(--x-green); font:600 13.5px/1.4 var(--x-body); text-decoration:underline; cursor:pointer; }
.x8-fallback { padding:16px; border-radius:14px; background:var(--x-paper); }

/* Free consultation. */
.x8-consult { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:40px; padding:44px; border-radius:32px; background:radial-gradient(70% 80% at 0% 100%,#0f4a42 0,transparent 60%), var(--x-ink); color:#e6f2ee; }
.x8-consult .x-eyebrow { color:var(--x-mint); }
.x8-consult-title { margin:0; color:#fff !important; font:700 44px/1.04 var(--x-head); letter-spacing:-.035em; }
.x8-consult-title span { display:block; color:var(--x-mint); }
.x8-consult-lead { margin:18px 0 0; color:#c6ddd5; font-size:17px; }
.x8-promises { display:grid; gap:10px; margin:18px 0 0; padding:0; list-style:none; }
.x8-promises li { display:flex; gap:12px; align-items:flex-start; color:#eaf5f1; font-size:16.5px; line-height:1.4; }
.x8-promises svg { flex:none; width:22px; height:22px; padding:3px; border-radius:50%; background:#8fe0c626; color:var(--x-mint); }
.x8-people { display:flex; flex-wrap:wrap; gap:14px; margin:22px 0 0; padding:0; list-style:none; }
.x8-people li { display:flex; align-items:center; gap:10px; }
.x8-people img { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.x8-people span { display:grid; color:#a9c6bd; font-size:13px; line-height:1.35; }
.x8-people b { color:#fff; font-size:14.5px; }
.x8-next { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:24px 0 0; padding:0; list-style:none; counter-reset:n; }
.x8-next li { counter-increment:n; padding:14px; border:1px solid #ffffff1f; border-radius:16px; color:#a9c6bd; font-size:13.5px; line-height:1.45; }
.x8-next li::before { content:counter(n); display:grid; place-items:center; width:24px; height:24px; margin-bottom:8px; border-radius:50%; background:var(--x-mint); color:var(--x-ink); font:700 12px/1 var(--x-head); }
.x8-next b { display:block; margin-bottom:2px; color:#fff; font-size:14.5px; }
.x8-reply { display:flex; gap:10px; align-items:center; margin:20px 0 0; color:#c6ddd5; font-size:15px; }
.x8-quick { margin:12px 0 0; color:#a9c6bd; font-size:14.5px; line-height:1.55; }
.x8-quick a { color:var(--x-mint); text-decoration:underline; text-underline-offset:3px; }
.x8-reply svg { flex:none; width:20px; height:20px; color:var(--x-mint); }
.x8-consult-book { padding:28px; border-radius:24px; background:#fff; color:var(--x-text); }
.x8-slots { margin:0 0 18px; padding:0; border:0; }
.x8-slots legend { display:flex; gap:8px; align-items:center; margin-bottom:12px; font:600 16px/1.3 var(--x-body); }
.x8-slots legend svg { width:20px; height:20px; color:var(--x-green); }
.x8-days { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px; }
.x8-day { display:grid; justify-items:center; gap:1px; padding:8px 2px; border:1.5px solid var(--x-line); border-radius:12px; background:#fff; color:var(--x-text); cursor:pointer; }
.x8-day small { color:var(--x-muted); font:500 11px/1.2 var(--x-body); }
.x8-day b { font:700 18px/1.2 var(--x-head); }
.x8-times { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-top:8px; }
.x8-time { padding:10px 4px; border:1.5px solid var(--x-line); border-radius:12px; background:#fff; color:var(--x-text); font:600 14px/1 var(--x-body); cursor:pointer; }
.x8-day:hover, .x8-time:hover { border-color:#9fc4b8; }
.x8-day[aria-checked="true"], .x8-time[aria-checked="true"] { border-color:var(--x-green); background:var(--x-green); color:#fff; }
.x8-day[aria-checked="true"] small { color:#d4f7ea; }
.x8-slot-note { margin:8px 0 0; color:var(--x-muted); font-size:12.5px; }
.x8-consult-book .x8-done { padding:8px 0; }

/* Customer results. */
.x8-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0; padding:0; list-style:none; }
.x8-card { display:flex; flex-direction:column; padding:22px; border:1px solid var(--x-line); border-radius:22px; background:#fff; }
.x8-card-top { display:flex; align-items:center; height:48px; }
.x8-card-top img { max-width:150px; max-height:44px; width:auto; height:auto; object-fit:contain; }
.x8-card-name { color:var(--x-text); font:700 17px/1.2 var(--x-head); letter-spacing:-.01em; }
.x8-card-summary { margin:14px 0 0; color:var(--x-text); font-size:15.5px; line-height:1.5; }
.x8-consult-quote { margin:26px 0 0; padding:18px 20px; border-left:3px solid var(--x-mint); background:#ffffff0d; border-radius:0 14px 14px 0; }
.x8-consult-quote p { margin:0; color:#eaf5f1; font:500 16px/1.5 var(--x-body); }
.x8-consult-quote footer { margin-top:8px; padding:0; color:#a9c6bd; font-size:13.5px; }
.x8-card-sector { margin:12px 0 0; color:var(--x-green); font:600 11.5px/1.3 var(--x-body); letter-spacing:.12em; text-transform:uppercase; }
.x8-card-figure { margin:12px 0 0; color:var(--x-muted); font-size:14.5px; line-height:1.4; }
.x8-card-figure b { display:block; color:var(--x-deep); font:700 34px/1.05 var(--x-head); letter-spacing:-.03em; }
.x8-card blockquote { margin:14px 0 0; padding:0; border:0; }
.x8-card blockquote p { margin:0; color:var(--x-text); font:500 15.5px/1.5 var(--x-body); }
.x8-card-by { display:grid; margin:14px 0 0; color:var(--x-muted); font-size:13px; line-height:1.4; }
.x8-card-by b { color:var(--x-text); font-size:14px; }
.x8-card a { margin-top:auto; padding-top:14px; color:var(--x-green); font:600 14px/1.3 var(--x-body); text-decoration:none; }
.x8-card a:hover { text-decoration:underline; }

/* A button for every sector. */
.x8-sectors { display:grid; grid-template-columns:1.2fr 1.4fr .7fr; gap:26px; }
.x8-sector-group h3 { margin:0 0 12px; color:var(--x-muted); font:600 12px/1.3 var(--x-body); letter-spacing:.16em; text-transform:uppercase; }
.x8-sector-group ul { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.x8-sector-group a { display:inline-flex; align-items:center; gap:8px; padding:11px 16px; border:1.5px solid var(--x-line); border-radius:99px; background:#fff; color:var(--x-text); font:600 15px/1.1 var(--x-body); text-decoration:none; transition:border-color .2s, background .2s, color .2s; }
.x8-sector-group a svg { width:16px; height:16px; color:var(--x-green); }
.x8-sector-group a:hover { border-color:var(--x-green); background:var(--x-ink); color:#fff; }
.x8-sector-group a:hover svg { color:var(--x-mint); }

@media (max-width:1060px) {
    .x8-estimate, .x8-report, .x8-consult { grid-template-columns:minmax(0,1fr); }
    .x8-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .x8-sectors { grid-template-columns:1fr; gap:20px; }
}
@media (max-width:640px) {
    .x8-inputs { grid-template-columns:1fr 1fr; padding:18px; }
    .x8-inputs .x8-field:nth-child(3) { grid-column:1 / -1; }
    .x8-inputs.is-full { grid-template-columns:1fr 1fr; }
    .x8-inputs.is-full .x8-field, .x8-inputs.is-full .x8-field:nth-of-type(n+4) { grid-column:auto; }
    .x8-inputs.is-full .x8-field:nth-of-type(3) { grid-column:1 / -1; }
    .x8-answer, .x8-report, .x8-consult-book { padding:20px; }
    .x8-consult { padding:26px 18px; border-radius:24px; }
    .x8-consult-title { font-size:34px; }
    .x8-big b { font-size:48px; }
    .x8-kpis { grid-template-columns:1fr; }
    .x8-fields, .x8-problems .wpcf7-checkbox { grid-template-columns:1fr; }
    .x8-days { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .x8-next { grid-template-columns:1fr; gap:8px; }
    .x8-next li { display:grid; grid-template-columns:24px 1fr; column-gap:12px; padding:12px 14px; }
    .x8-next li::before { grid-row:span 2; margin:0; }
    .x8-times { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .x8-cards { display:flex; overflow-x:auto; gap:12px; margin:0 -16px; padding:0 16px 8px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
    .x8-card { flex:0 0 84%; scroll-snap-align:start; }
    /* Phones: the time picker and form follow the promises; the specialists, next steps and quote come after them. */
    .x8-consult { row-gap:0; }
    .x8-consult-copy { display:contents; }
    .x8-consult-copy > * { order:2; }
    .x8-consult-copy > :is(.x-eyebrow, .x8-consult-title, .x8-consult-lead, .x8-promises) { order:0; }
    .x8-consult-book { order:1; margin-top:24px; }
    /* "Request my free consultation" can wrap on the narrowest phones instead of widening the page. */
    .x8-cf7 .wpcf7-submit { max-width:100%; white-space:normal; line-height:1.25; }
}