/* Services surface: same MH DIGITAL system, with a denser consultation flow. */
:root { --svc-blue:#155eef; --svc-accent-text:var(--svc-blue); --svc-focus:var(--svc-blue); --svc-cyan:#08b9d7; --svc-ink:#10213f; --svc-muted:#5e6d86; --svc-bg:#f7f9fc; --svc-card:#fff; --svc-line:#e1e7f0; }
body { background:var(--svc-bg); color:var(--svc-ink); }
.skip-link { position:fixed; left:18px; top:12px; z-index:20; padding:10px 14px; border-radius:9px; color:#fff; background:var(--svc-blue); font-weight:850; transform:translateY(-150%); transition:transform 160ms cubic-bezier(.23,1,.32,1); }
.skip-link:focus { transform:translateY(0); }
.links button svg { width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.top { background:rgba(255,255,255,.94); box-shadow:0 5px 20px rgba(0,0,0,.05); backdrop-filter:blur(18px); }
.top .shell { max-width:1440px; gap:24px; }
.brand { width:112px !important; height:64px !important; display:grid; place-items:center; }
.brand img { width:112px !important; height:64px !important; object-fit:contain; }
.brand .logo-dark { display:none; }
.links a,.links button { border-radius:10px; transition:transform 160ms cubic-bezier(.23,1,.32,1), border-color 160ms ease, background 160ms ease; }
.links .page-label { padding:9px 11px; color:var(--svc-accent-text); font-size:13px; font-weight:850; }
.links a:hover,.links button:hover { transform:translateY(-1px); border-color:#a9c3ef; }
.links a:active,.links button:active { transform:scale(.97); }
.links .primary,.primary { background:var(--svc-blue) !important; border-color:var(--svc-blue) !important; }
main { padding-top:38px; }
.intro { grid-template-columns:1.25fr .75fr; margin-bottom:20px; }
.eyebrow { color:var(--svc-accent-text); letter-spacing:.03em; font-size:.78rem; }
.intro h1 { max-width:690px; font-size:clamp(42px,6vw,78px); color:var(--svc-ink); }
.intro p { font-size:17px; color:var(--svc-muted); }
.visual { height:310px; border-radius:18px; box-shadow:0 18px 44px rgba(0,0,0,.10); background:#eaf3ff; }
.section-head h2,.contact h2 { color:var(--svc-ink); }
.card { border-radius:16px; border-color:var(--svc-line); box-shadow:none; transition:transform 220ms cubic-bezier(.23,1,.32,1), box-shadow 220ms ease, border-color 220ms ease; }
.card:hover { transform:translateY(-4px); border-color:#bcd1f2; box-shadow:0 18px 44px rgba(0,0,0,.10); }
.card small { color:var(--svc-accent-text); letter-spacing:.03em; }
.card h3 { margin-top:20px; }
.contact { border-radius:18px; box-shadow:none; }
.contact { scroll-margin-top:96px; }
.form input:user-invalid,.form textarea:user-invalid { border-color:#b72d3c; box-shadow:0 0 0 3px rgba(183,45,60,.12); }
.form button:active { transform:scale(.97); }
@media (prefers-reduced-motion:reduce) { .links a,.links button,.card,.form button { transition:none; } .card:hover { transform:none; } }
[data-theme="dark"] { --svc-accent-text:#8bb8ff; --svc-focus:#8bb8ff; --svc-bg:#0c1220; --svc-card:#121b2b; --svc-ink:#f5f8ff; --svc-muted:#a7b4c8; --svc-line:#27354c; }
[data-theme="dark"] .top { background:rgba(12,18,32,.94); }
[data-theme="dark"] .brand .logo-light { display:none; }
[data-theme="dark"] .brand .logo-dark { display:block; }
.brand:focus-visible,.links a:focus-visible,.links button:focus-visible,.form input:focus-visible,.form textarea:focus-visible,.form button:focus-visible,footer a:focus-visible { outline:3px solid var(--svc-focus); outline-offset:3px; }
/* The external sheet follows the inline mobile rules and must preserve them. */
@media (max-width:820px) {
  .intro { grid-template-columns:1fr; }
  .visual { height:240px; }
}
@media (max-width:580px) {
  .top { height:auto; min-height:70px; }
  .top .shell { min-height:70px; gap:8px; flex-wrap:wrap; padding-block:8px; }
  .brand,.brand img { width:112px !important; height:64px !important; }
  .links { flex-wrap:wrap; }
  .links .page-label { padding:8px; }
  .visual { height:185px; }
}
