/* DevShuora home page, white theme (2026-10-25). Loaded AFTER home-dark.css when Settings → home_theme is "light" (the default).
   It only changes colours: same sections, same words, same layout. Palette: white + soft grey-blue sections, navy text and buttons,
   one calm teal for highlights. Three navy blocks (why-us band, UK head office card, final call to action) give the page rhythm. */

body.hd-page {
  --hd-bg: #ffffff;
  --hd-bg-2: #f5f8fb;
  --hd-card: #ffffff;
  --hd-card-2: #f7f9fb;
  --hd-line: #e3e9f0;
  --hd-text: #0b1b30;
  --hd-muted: #55667b;
  --hd-cyan-2: #06757e;
  --hd-light: #f5f8fb;
  --lt-accent: #06757e;
  --lt-accent-bg: #e8f5f6;
  --lt-accent-line: #c6e7ea;
  --lt-navy: #0b2545;
  --lt-navy-2: #0d3a63;
  --lt-shadow: 0 1px 2px rgba(11, 37, 69, .04), 0 8px 24px rgba(11, 37, 69, .06);
  --lt-shadow-hover: 0 2px 4px rgba(11, 37, 69, .05), 0 18px 40px rgba(11, 37, 69, .1);
}
body.hd-page ::selection { background: var(--lt-accent); color: #fff; }

/* ---------- shared ---------- */
body.hd-page .hd-eyebrow,
body.hd-page .hd-sec .eyebrow,
body.hd-page .hd-light .hd-eyebrow,
body.hd-page .hd-kicker { color: #066f78; background: var(--lt-accent-bg); border-color: var(--lt-accent-line); }
body.hd-page .hd-eyebrow::before, body.hd-page .hd-sec .eyebrow::before { background: var(--lt-accent); box-shadow: 0 0 0 4px rgba(8, 132, 142, .14); }
body.hd-page .hd-kicker i { color: var(--lt-accent); }
body.hd-page .hd-sec .section-title { color: var(--hd-text); }
body.hd-page .hd-grad, body.hd-page .accent-word { color: var(--lt-accent); }
body.hd-page .hd-mark { color: var(--lt-accent); }
body.hd-page .hd-mark::after { background: rgba(8, 132, 142, .16); }

/* buttons: navy primary, white outline secondary */
body.hd-page .hd-btn-primary { background: var(--lt-navy); color: #fff; box-shadow: 0 6px 16px rgba(11, 37, 69, .16); }
body.hd-page .hd-btn-primary:hover { background: var(--lt-navy-2); color: #fff; box-shadow: 0 10px 22px rgba(11, 37, 69, .22); }
body.hd-page .hd-btn-ghost,
body.hd-page .hd-sec .btn-outline-glow { color: var(--hd-text); background: #fff; border: 1px solid #cfd8e3; }
body.hd-page .hd-btn-ghost:hover,
body.hd-page .hd-sec .btn-outline-glow:hover { color: var(--lt-accent); background: #fff; border-color: var(--lt-accent); }

/* ---------- hero ---------- */
body.hd-page .hd-hero { background: linear-gradient(180deg, #f3f7fb 0%, #ffffff 70%); color: var(--hd-text); }
body.hd-page .hd-glow { display: none; }
body.hd-page .hd-dots {
  background-image: linear-gradient(rgba(11, 37, 69, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 37, 69, .05) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 65%); mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 65%);
}
body.hd-page .hd-h1-main { color: var(--hd-text); }
body.hd-page .hd-type-text { color: var(--lt-accent); }
body.hd-page .hd-type-text::before { background: rgba(8, 132, 142, .22); }
body.hd-page .hd-type::after { background: var(--lt-accent); }
body.hd-page .hd-proof li { color: #22344b; }
body.hd-page .hd-proof i { color: var(--lt-accent); }

/* example dashboard: a clean white app screen */
body.hd-page .hd-dash { background: #fff; border-color: var(--hd-line); box-shadow: 0 30px 70px rgba(11, 37, 69, .14), 0 2px 6px rgba(11, 37, 69, .05); }
body.hd-page .hd-dash-bar { background: #f7f9fb; border-bottom-color: var(--hd-line); }
body.hd-page .hd-dash-title { color: #5c6b7e; }
body.hd-page .hd-dash-side { background: #f7f9fb; border-right-color: var(--hd-line); }
body.hd-page .hd-dash-side span { color: #8a96a6; }
body.hd-page .hd-dash-side span.on { background: var(--lt-accent-bg); color: var(--lt-accent); }
body.hd-page .hd-dash-top small { color: #5c6b7e; }
body.hd-page .hd-dash-top b { color: var(--hd-text); }
body.hd-page .hd-dash-search { background: #fff; border-color: var(--hd-line); color: #5c6b7e; }
body.hd-page .hd-kpi, body.hd-page .hd-chart, body.hd-page .hd-feed { background: #f9fbfc; border-color: var(--hd-line); }
body.hd-page .hd-kpi small { color: #55667b; }
body.hd-page .hd-kpi b { color: var(--hd-text); }
body.hd-page .hd-kpi span { color: #15803d; }
body.hd-page .hd-kpi span.note { color: #5c6b7e; }
body.hd-page .hd-card-head b { color: var(--hd-text); }
body.hd-page .hd-card-head small { color: #5c6b7e; }
body.hd-page .hd-live, body.hd-page .hd-card-head .hd-live { background: #e7f6ec; color: #15803d; }
body.hd-page .hd-bars {
  background: linear-gradient(rgba(11, 37, 69, .07) 1px, transparent 1px) 0 26px / 100% 31px no-repeat, linear-gradient(rgba(11, 37, 69, .07) 1px, transparent 1px) 0 57px / 100% 31px no-repeat,
              linear-gradient(rgba(11, 37, 69, .07) 1px, transparent 1px) 0 88px / 100% 31px no-repeat, linear-gradient(rgba(11, 37, 69, .07) 1px, transparent 1px) 0 119px / 100% 31px no-repeat;
}
body.hd-page .hd-bars span { background: #b9e3e6; }
body.hd-page .hd-bars span.now { background: var(--lt-accent); }
body.hd-page .hd-bars span i { color: #5c6b7e; }
body.hd-page .hd-bars span em { background: var(--lt-navy); color: #fff; }
body.hd-page .hd-feed-list li { background: #fff; border: 1px solid var(--hd-line); color: #22344b; }
body.hd-page .hd-feed-list li > i { background: var(--lt-accent-bg); color: var(--lt-accent); }
body.hd-page .hd-feed-list li em { color: #5c6b7e; }
body.hd-page .hd-float { box-shadow: 0 18px 40px rgba(11, 37, 69, .16); }
body.hd-page .hd-float.f1 { border: 1px solid var(--hd-line); }
body.hd-page a.hd-float:hover { box-shadow: 0 18px 40px rgba(11, 37, 69, .16), 0 0 0 3px rgba(8, 132, 142, .35); }
body.hd-page .hd-float.f2 { background: var(--lt-navy); border-color: var(--lt-navy); }

/* client logos */
body.hd-page .hd-trust { background: #fff; border-color: var(--hd-line); box-shadow: var(--lt-shadow); }
body.hd-page .hd-trust p { color: #55667b; }
body.hd-page .hd-logos span { border: 1px solid #edf1f5; }

/* services strip: calm navy band, no tilt */
body.hd-page .ds-ticker { background: var(--lt-navy); transform: none; margin: 0; box-shadow: none; }
body.hd-page .ds-ticker::before { background: linear-gradient(90deg, var(--lt-navy), rgba(11, 37, 69, 0)) !important; }
body.hd-page .ds-ticker::after { background: linear-gradient(270deg, var(--lt-navy), rgba(11, 37, 69, 0)) !important; }
body.hd-page .ds-ticker a { color: rgba(255, 255, 255, .92); font-weight: 700; letter-spacing: .05em; }
body.hd-page .ds-ticker a i { color: #6fd6dd; }
body.hd-page .ds-ticker a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
body.hd-page .ds-ticker a:hover i { color: #6fd6dd; }

/* ---------- about ---------- */
body.hd-page .hd-big { border-left-color: var(--lt-accent); }
body.hd-page .hd-stats b { color: var(--lt-navy); }

/* ---------- services ---------- */
body.hd-page .hd-svc { color: var(--hd-text); box-shadow: var(--lt-shadow); }
body.hd-page .hd-svc::before { background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(8, 132, 142, .06), transparent 60%); }
body.hd-page .hd-svc:hover { color: var(--hd-text); border-color: rgba(8, 132, 142, .45); box-shadow: var(--lt-shadow-hover); }
body.hd-page .hd-svc small { color: #5c6b7e; }
body.hd-page .hd-svc-ic { background: var(--lt-accent-bg); border-color: var(--lt-accent-line); color: var(--lt-accent); }
body.hd-page .hd-more { color: var(--lt-accent); }
body.hd-page .hd-svc em { -webkit-text-stroke-color: rgba(11, 37, 69, .07); }
body.hd-page .hd-svc:hover em { -webkit-text-stroke-color: rgba(8, 132, 142, .22); }
body.hd-page .hd-svc.is-hot { background: var(--lt-navy); box-shadow: 0 18px 40px rgba(11, 37, 69, .2); color: #fff; }
body.hd-page .hd-svc.is-hot:hover { color: #fff; }
body.hd-page .hd-svc.is-hot .hd-svc-ic { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .25); color: #fff; }
body.hd-page .hd-svc.is-hot em { -webkit-text-stroke-color: rgba(255, 255, 255, .14); }
body.hd-page .hd-svc.is-light { background: #f2f9fa; border-color: var(--lt-accent-line); }
body.hd-page .hd-svc.is-light .hd-svc-ic { background: #fff; color: var(--lt-accent); }
body.hd-page .hd-svc.is-light .hd-more { color: var(--lt-accent); }
body.hd-page .hd-chips span { color: #5c6b7e; }
body.hd-page .hd-chips a { color: #22344b; background: #fff; border-color: var(--hd-line); }
body.hd-page .hd-chips a:hover { color: var(--lt-accent); border-color: var(--lt-accent); background: #fff; }

/* ---------- why choose us: navy band, white table ---------- */
body.hd-page .hd-brand { background: var(--lt-navy); }
body.hd-page .hd-table-wrap { background: #fff; border-color: transparent; box-shadow: 0 30px 70px rgba(0, 0, 0, .28); }
body.hd-page .hd-table th, body.hd-page .hd-table td { border-top-color: #eef2f6; }
body.hd-page .hd-table thead th { color: #5c6b7e; }
body.hd-page .hd-table thead th.hd-us { background: var(--lt-accent-bg); color: var(--lt-navy); border-bottom-color: var(--lt-accent); }
body.hd-page .hd-table thead th.hd-us small { color: #066f78; }
body.hd-page .hd-table tbody th { color: var(--hd-text); }
body.hd-page .hd-table td.hd-us { background: #f3fafb; }
body.hd-page .hd-table tbody tr:hover { background: #f8fafc; }
body.hd-page .hd-y { color: #15803d; background: #e7f6ec; border-color: #b7e2c4; }
body.hd-page .hd-s { color: #b45309; background: #fdf3e1; border-color: #f3d29b; }
body.hd-page .hd-n { color: #8a96a6; background: #f1f4f7; border-color: #dfe5ec; }
body.hd-page .hd-legend { border-top-color: #eef2f6; color: #55667b; }

/* ---------- process ---------- */
body.hd-page .hd-step { background: #fff; border-color: var(--hd-line); box-shadow: var(--lt-shadow); }
body.hd-page .hd-step:hover { border-color: rgba(8, 132, 142, .4); box-shadow: var(--lt-shadow-hover); }
body.hd-page .hd-step small { color: #066f78; }
body.hd-page .hd-step::after { background: var(--lt-accent); }

/* ---------- industries ---------- */
body.hd-page .hd-ind { color: var(--hd-text); box-shadow: var(--lt-shadow); }
body.hd-page .hd-ind:hover { color: var(--hd-text); background: #fff; border-color: rgba(8, 132, 142, .45); box-shadow: var(--lt-shadow-hover); }
body.hd-page .hd-ind-ic { background: var(--lt-accent-bg); border-color: var(--lt-accent-line); color: var(--lt-accent); }
body.hd-page .hd-ind-go { color: #9aa6b5; }

/* ---------- ready-made products ---------- */
body.hd-page .hd-prod { color: var(--hd-text); background: #fff; box-shadow: var(--lt-shadow); }
body.hd-page .hd-prod::after { background: radial-gradient(circle, rgba(8, 132, 142, .08), transparent 70%); }
body.hd-page .hd-prod:hover { color: var(--hd-text); border-color: rgba(8, 132, 142, .45); box-shadow: var(--lt-shadow-hover); }
body.hd-page .hd-prod-ic { background: var(--lt-navy); box-shadow: none; }
body.hd-page .hd-tags i { background: #f1f5f9; border-color: var(--hd-line); color: #22344b; }

/* ---------- case studies, reviews, blog (automatic blocks) ---------- */
body.hd-page .hd-sec .cs-card, body.hd-page .hd-sec .bl-card, body.hd-page .hd-sec .rv-card { background: #fff; color: var(--hd-text); box-shadow: var(--lt-shadow); }
body.hd-page .hd-sec .cs-card:hover, body.hd-page .hd-sec .bl-card:hover { color: var(--hd-text); border-color: rgba(8, 132, 142, .45); box-shadow: var(--lt-shadow-hover); }
body.hd-page .hd-sec .cs-thumb { background: #eef2f6; }
body.hd-page .hd-sec .cs-thumb::before { background: radial-gradient(circle at 16px 15px, #ff5f57 4px, transparent 4.5px), radial-gradient(circle at 32px 15px, #febc2e 4px, transparent 4.5px), radial-gradient(circle at 48px 15px, #28c840 4px, transparent 4.5px), #eef2f6; }
body.hd-page .hd-sec .cs-ind, body.hd-page .hd-sec .bl-cat { color: #066f78; }
body.hd-page .hd-sec .cs-body h3 { color: var(--hd-text); }
body.hd-page .hd-sec .cs-client { color: #55667b; }
body.hd-page .hd-sec .cs-mini span { background: #f5f8fb; color: #22344b; }
body.hd-page .hd-sec .cs-mini b, body.hd-page .hd-sec .cs-link { color: var(--lt-accent); }
body.hd-page .hd-sec .rv-card::before { color: rgba(8, 132, 142, .18); }
body.hd-page .hd-sec .rv-card blockquote { color: #22344b; }
body.hd-page .hd-sec .rv-card figcaption b { color: var(--hd-text); }
body.hd-page .hd-sec .rv-card figcaption small, body.hd-page .hd-sec .rv-card figcaption small a, body.hd-page .hd-sec .rv-src { color: #55667b; }

/* ---------- our offices ---------- */
body.hd-page .hd-hq { background: var(--lt-navy); box-shadow: 0 24px 56px rgba(11, 37, 69, .22); }
body.hd-page .hd-hq-pin { color: var(--lt-navy); }
body.hd-page .hd-hq .hd-btn-ghost { color: #fff; background: transparent; border-color: rgba(255, 255, 255, .35); }
body.hd-page .hd-hq .hd-btn-ghost:hover { color: #fff; border-color: #fff; background: rgba(255, 255, 255, .08); }
body.hd-page .hd-serve { background: #f7f9fb; }
body.hd-page .hd-serve-title { color: var(--hd-text); }
body.hd-page .hd-serve-title i, body.hd-page .hd-serve-note i { color: var(--lt-accent); }
body.hd-page .hd-region h4 { color: #55667b; }
body.hd-page .hd-cty { background: #fff; border-color: var(--hd-line); color: #22344b; }
body.hd-page .hd-cty:hover { border-color: rgba(8, 132, 142, .45); background: #fff; }
body.hd-page .hd-cty b { background: var(--lt-accent-bg); color: #066f78; }
body.hd-page .hd-serve-note { color: #55667b; }
body.hd-page .hd-trustrow > div { box-shadow: var(--lt-shadow); }
body.hd-page .hd-trustrow i { background: var(--lt-accent-bg); border-color: var(--lt-accent-line); color: var(--lt-accent); }
body.hd-page .hd-trustrow b { color: var(--hd-text); }
body.hd-page .hd-trustrow span { color: #55667b; }

/* ---------- FAQ ---------- */
body.hd-page .hd-faq-item summary { color: var(--hd-text); }
body.hd-page .hd-faq-item summary:hover { color: var(--lt-accent); }
body.hd-page .hd-faq-item summary i { border-color: #cfd8e3; color: var(--lt-accent); background: #fff; }
body.hd-page .hd-faq-item[open] summary i { background: var(--lt-accent-bg); border-color: var(--lt-accent-line); }

/* ---------- final call to action: navy panel ---------- */
body.hd-page .hd-cta { background: linear-gradient(120deg, var(--lt-navy) 0%, var(--lt-navy-2) 100%); box-shadow: 0 30px 70px rgba(11, 37, 69, .22); }
body.hd-page .hd-cta-word { -webkit-text-stroke-color: rgba(255, 255, 255, .1); }
body.hd-page .hd-cta .hd-btn-dark { background: #fff; color: var(--lt-navy); }
body.hd-page .hd-cta .hd-btn-dark:hover { background: #eef6f8; color: var(--lt-navy); box-shadow: none; }
body.hd-page .hd-cta .hd-btn-white { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .4); }
body.hd-page .hd-cta .hd-btn-white:hover { background: rgba(255, 255, 255, .08); color: #fff; border-color: #fff; }
body.hd-page .hd-talk li { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .14); }
body.hd-page .hd-talk li:hover { background: rgba(255, 255, 255, .1); }

/* ---------- footer: the normal light footer ---------- */
body.hd-page .site-footer { background: #f5f8fb !important; color: var(--hd-text); border-top: 1px solid var(--hd-line); }
body.hd-page .footer-logo img { display: block; }
body.hd-page .footer-logo .logo-on-dark { display: none; }
body.hd-page .site-footer .footer-title { color: var(--hd-text); }
body.hd-page .footer-copy, body.hd-page .footer-links a, body.hd-page .footer-contact li,
body.hd-page .footer-contact a, body.hd-page .footer-contact span, body.hd-page .footer-bottom p { color: #55667b !important; }
body.hd-page .footer-links a:hover, body.hd-page .footer-contact a:hover { color: var(--lt-accent) !important; }
body.hd-page .footer-contact i, body.hd-page .footer-bottom span { color: var(--lt-accent) !important; }
body.hd-page .social-links a { border-color: var(--hd-line) !important; color: #22344b !important; background: #fff !important; }
body.hd-page .social-links a:hover { background: var(--lt-navy) !important; color: #fff !important; border-color: var(--lt-navy) !important; }

/* card icons: solid teal tile on hover (2026-10-27) */
body.hd-page .hd-svc-ic, body.hd-page .hd-ind-ic { transition: background .25s ease, color .25s ease, border-color .25s ease, transform .35s ease; }
body.hd-page .sg-card:hover .hd-svc-ic, body.hd-page .ab-value:hover .hd-svc-ic, body.hd-page .hd-ind:hover .hd-ind-ic,
body.hd-page .hd-svc:not(.is-hot):hover .hd-svc-ic { background: var(--lt-accent); border-color: var(--lt-accent); color: #fff; }

/* links inside text: clearly links (2026-10-31) */
body.hd-page .hd-sub a, body.hd-page .hd-text a, body.hd-page .hd-big a { color: var(--lt-accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
body.hd-page .hd-sub a.hd-btn { text-decoration: none; }
/* old gradient text on pages now in the new design: solid accent colour */
body.hd-page .text-gradient { background: none; -webkit-text-fill-color: currentColor; color: var(--lt-accent); }
/* phones: links inside text and the start-here list get a bigger tap area */
@media (max-width: 767.98px) { body.hd-page .hd-text a, body.hd-page .hd-sub a:not(.hd-btn) { display: inline-block; padding: 9px 0; margin: -9px 0; } body.hd-page .sv-incl a { display: inline-flex; align-items: center; min-height: 40px; } }