/* Art direction: dependable remote operations support → crisp, practical, business-first.
   Palette: original Quicky navy and gold; Typography: Cabinet Grotesk + General Sans; Density: balanced. */
:root {
  --text-xs: clamp(.75rem,.7rem + .25vw,.875rem); --text-sm: clamp(.875rem,.8rem + .35vw,1rem); --text-base: clamp(1rem,.95rem + .25vw,1.125rem); --text-lg: clamp(1.125rem,1rem + .75vw,1.5rem); --text-xl: clamp(1.5rem,1.2rem + 1.25vw,2.25rem); --text-2xl: clamp(2rem,1.2rem + 2.5vw,3.5rem); --text-3xl: clamp(2.5rem,1rem + 4vw,5rem);
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem; --space-32:8rem;
  --radius-sm:.375rem; --radius-md:.5rem; --radius-lg:.75rem; --radius-xl:1rem; --radius-full:9999px; --transition-interactive:180ms cubic-bezier(.16,1,.3,1); --ease-out:cubic-bezier(.16,1,.3,1); --content-wide:1200px; --font-display:'Cabinet Grotesk','Inter',sans-serif; --font-body:'General Sans','Inter',sans-serif;
}
:root,[data-theme="light"] { --color-bg:#fff; --color-surface:#f7f7f8; --color-surface-2:#eeeff2; --color-surface-offset:#e6e7ea; --color-divider:#d8dae0; --color-border:#c9ccd4; --color-text:#1a1a2e; --color-text-muted:#565b69; --color-text-faint:#767c8c; --color-text-inverse:#fff; --color-primary:#1a1a2e; --color-primary-hover:#303048; --color-primary-active:#0f0f1c; --color-accent:#e8a817; --color-accent-hover:#d49a10; --color-accent-active:#b8860f; --color-accent-soft:#fdf3dc; --color-success:#147d4b; --color-error:#b42318; --shadow-sm:0 1px 3px rgba(26,26,46,.08); --shadow-md:0 8px 24px rgba(26,26,46,.1); --shadow-lg:0 20px 52px rgba(26,26,46,.14); }
[data-theme="dark"] { --color-bg:#0f0f1c; --color-surface:#161628; --color-surface-2:#1f1f34; --color-surface-offset:#292941; --color-divider:#34344d; --color-border:#454562; --color-text:#f0f0f5; --color-text-muted:#b6b6c7; --color-text-faint:#9797ad; --color-text-inverse:#0f0f1c; --color-primary:#f0f0f5; --color-primary-hover:#fff; --color-primary-active:#d4d4df; --color-accent:#f0b832; --color-accent-hover:#e8a817; --color-accent-active:#d49a10; --color-accent-soft:#2c281b; --color-success:#48c78e; --color-error:#ff7a70; --shadow-sm:0 1px 4px rgba(0,0,0,.35); --shadow-md:0 8px 24px rgba(0,0,0,.4); --shadow-lg:0 20px 52px rgba(0,0,0,.5); }
.container { max-width:var(--content-wide); margin-inline:auto; padding-inline:var(--space-4); }
.section-padding { padding-block:clamp(var(--space-16),7vw,var(--space-24)); }
.skip-link:focus { position:fixed; width:auto; height:auto; clip:auto; margin:0; z-index:999; top:var(--space-2); left:var(--space-2); padding:var(--space-3) var(--space-4); background:var(--color-accent); color:#1a1a2e; }
.header { position:sticky; top:0; z-index:100; background:color-mix(in oklab,var(--color-bg) 92%,transparent); backdrop-filter:blur(14px); border-bottom:1px solid color-mix(in oklab,var(--color-text) 9%,transparent); }
.header--scrolled { box-shadow:var(--shadow-sm); }
.header-inner { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); }
.logo { display:flex; align-items:center; text-decoration:none; }
.logo img { width:138px; height:52px; object-fit:contain; object-position:left center; }
[data-theme="dark"] .logo img,.footer .logo img { filter:invert(1); }
.nav-desktop { display:none; align-items:center; gap:var(--space-6); }
.nav-desktop a { color:var(--color-text-muted); font-size:var(--text-sm); font-weight:600; text-decoration:none; min-height:44px; display:flex; align-items:center; }
.nav-desktop a:hover { color:var(--color-text); }
.header-actions { display:flex; align-items:center; gap:var(--space-2); }
.theme-toggle,.mobile-menu-btn { width:44px; height:44px; display:grid; place-items:center; color:var(--color-text-muted); border-radius:var(--radius-md); }
.theme-toggle:hover,.mobile-menu-btn:hover { background:var(--color-surface-2); color:var(--color-text); }
.header-cta { display:none!important; }
.btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); padding:var(--space-3) var(--space-6); border-radius:var(--radius-md); text-decoration:none; font-size:var(--text-sm); line-height:1.2; font-weight:700; }
.btn:hover { transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn--primary { color:#fff; background:#1a1a2e; }
.btn--primary:hover { background:#303048; box-shadow:var(--shadow-md); }
[data-theme="dark"] .btn--primary { color:#10101b; background:#f0f0f5; }
.btn--accent { color:#1a1a2e; background:var(--color-accent); }
.btn--accent:hover { background:var(--color-accent-hover); box-shadow:var(--shadow-md); }
.btn--light { color:#fff; border:1px solid rgba(255,255,255,.55); background:rgba(255,255,255,.08); }
.btn--light:hover { background:rgba(255,255,255,.16); }
.btn--outline { border:1px solid var(--color-border); color:var(--color-text); }
.btn--lg { min-height:52px; padding:var(--space-4) var(--space-8); font-size:var(--text-base); }
.mobile-nav { display:none; position:fixed; inset:72px 0 0; z-index:99; background:var(--color-bg); padding:var(--space-6) var(--space-4); flex-direction:column; gap:var(--space-2); }
.mobile-nav.open { display:flex; }
.mobile-nav a:not(.btn) { min-height:52px; display:flex; align-items:center; color:var(--color-text); font-size:var(--text-lg); font-weight:600; text-decoration:none; border-bottom:1px solid var(--color-divider); }
.hero { position:relative; min-height:min(780px,calc(100vh - 72px)); display:flex; align-items:center; overflow:hidden; color:#fff; background:#1a1a2e; }
.hero::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(14,14,28,.96) 0%,rgba(20,20,37,.83) 43%,rgba(20,20,37,.28) 75%,rgba(20,20,37,.08) 100%); }
.hero-bg { position:absolute; inset:0; }
.hero-bg img { width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-content { position:relative; z-index:2; padding-block:var(--space-24); max-width:750px; }
.hero-badge { display:inline-flex; align-items:center; gap:var(--space-2); width:fit-content; padding:var(--space-2) var(--space-4); margin-bottom:var(--space-6); border:1px solid rgba(255,255,255,.2); border-radius:var(--radius-full); background:rgba(255,255,255,.09); color:rgba(255,255,255,.9); font-size:var(--text-xs); font-weight:600; }
.pulse { width:8px; height:8px; border-radius:50%; background:#5bd39a; box-shadow:0 0 0 5px rgba(91,211,154,.14); }
.hero h1 { max-width:780px; margin-bottom:var(--space-5); font:800 var(--text-3xl)/1.02 var(--font-display); letter-spacing:-.035em; }
.hero h1 span { color:var(--color-accent); }
.hero-sub { max-width:670px; margin-bottom:var(--space-8); color:rgba(255,255,255,.82); font-size:var(--text-base); line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:var(--space-3); margin-bottom:var(--space-8); }
.trust-badges { display:flex; flex-wrap:wrap; gap:var(--space-5); }
.trust-badges span { display:flex; align-items:center; gap:var(--space-2); color:rgba(255,255,255,.72); font-size:var(--text-sm); font-weight:500; }
.trust-badges svg { color:var(--color-accent); width:18px; }
.section-header { max-width:760px; margin-bottom:clamp(var(--space-8),5vw,var(--space-16)); }
.section-label { margin-bottom:var(--space-3); color:#a87100; text-transform:uppercase; letter-spacing:.13em; font-size:var(--text-xs); font-weight:800; }
[data-theme="dark"] .section-label { color:var(--color-accent); }
.section-title { margin-bottom:var(--space-4); color:var(--color-text); font:800 var(--text-2xl)/1.08 var(--font-display); letter-spacing:-.025em; }
.section-desc,.workflow-intro>p,.coverage-copy>p,.request-copy>p { color:var(--color-text-muted); font-size:var(--text-base); line-height:1.7; }
.services { background:var(--color-surface); }
.services-layout { display:grid; gap:var(--space-5); }
.service-feature,.service-card,.service-wide { background:var(--color-bg); border:1px solid color-mix(in oklab,var(--color-text) 11%,transparent); box-shadow:var(--shadow-sm); }
.service-feature { padding:clamp(var(--space-6),4vw,var(--space-10)); }
.service-number { color:var(--color-text-faint); font-size:var(--text-xs); font-weight:800; letter-spacing:.1em; }
.service-feature>svg { width:38px; height:38px; margin:var(--space-8) 0 var(--space-4); color:#a87100; }
.service-feature h3,.service-card h3,.service-wide h3 { font:700 var(--text-lg)/1.2 var(--font-display); color:var(--color-text); }
.service-feature>p,.service-wide p { margin-top:var(--space-3); color:var(--color-text-muted); }
.service-feature ul,.service-card ul,.service-wide ul { margin-top:var(--space-6); display:grid; gap:var(--space-3); }
.service-feature li,.service-card li,.service-wide li { position:relative; padding-left:var(--space-5); color:var(--color-text-muted); font-size:var(--text-sm); }
.service-feature li::before,.service-card li::before,.service-wide li::before { content:""; position:absolute; left:0; top:.68em; width:6px; height:6px; border-radius:50%; background:var(--color-accent); }
.service-stack { display:grid; gap:var(--space-5); }
.service-card { padding:var(--space-6); }
.service-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-5); }
.service-card-head svg { color:#a87100; }
.service-wide { display:grid; gap:var(--space-6); align-items:start; padding:var(--space-6); }
.service-wide>div:first-child { display:flex; justify-content:space-between; }
.service-wide>div:first-child svg { color:#a87100; }
.service-link { display:inline-flex; align-items:center; gap:var(--space-2); width:fit-content; margin-top:var(--space-6); color:var(--color-text); font-size:var(--text-sm); font-weight:700; text-decoration:none; }
.service-link:hover { color:#8b5f00; }
.service-link svg { width:16px; }
.workflow { background:var(--color-bg); }
.workflow-grid { display:grid; gap:var(--space-12); }
.workflow-intro .btn { margin-top:var(--space-6); }
.steps { display:grid; }
.step { display:grid; grid-template-columns:56px 1fr; gap:var(--space-5); padding-block:var(--space-6); border-top:1px solid var(--color-divider); }
.step:last-child { border-bottom:1px solid var(--color-divider); }
.step>span { color:#a87100; font:700 var(--text-sm) var(--font-display); }
.step h3 { margin-bottom:var(--space-2); color:var(--color-text); font:700 var(--text-lg) var(--font-display); }
.step p { color:var(--color-text-muted); font-size:var(--text-sm); }
.coverage { position:relative; overflow:hidden; color:#fff; background:#1a1a2e; }
.coverage .section-title,.coverage .section-label { color:#fff; }
.coverage .section-label { color:var(--color-accent); }
.coverage-copy>p { color:rgba(255,255,255,.72); }
.coverage-grid { display:grid; gap:var(--space-12); }
.coverage-points { display:grid; grid-template-columns:1fr; border:1px solid rgba(255,255,255,.14); }
.coverage-points div { min-height:150px; padding:var(--space-6); display:flex; flex-direction:column; justify-content:flex-end; border-bottom:1px solid rgba(255,255,255,.14); }
.coverage-points div:last-child { border-bottom:0; }
.coverage-points svg { margin-bottom:auto; color:var(--color-accent); }
.coverage-points strong { font:700 var(--text-lg) var(--font-display); }
.coverage-points span { color:rgba(255,255,255,.62); font-size:var(--text-sm); }
.request { background:var(--color-surface); }
.request-grid { display:grid; gap:var(--space-10); align-items:start; }
.request-notes { margin-top:var(--space-8); display:grid; gap:var(--space-3); }
.request-notes span { display:flex; align-items:center; gap:var(--space-3); color:var(--color-text-muted); font-size:var(--text-sm); }
.request-notes svg { width:18px; color:var(--color-success); }
.form-card { background:var(--color-bg); border:1px solid color-mix(in oklab,var(--color-text) 10%,transparent); box-shadow:var(--shadow-lg); }
.request-form { padding:clamp(var(--space-6),4vw,var(--space-10)); }
.form-row { display:grid; gap:var(--space-4); }
.form-group { margin-bottom:var(--space-4); }
.form-group label { display:block; margin-bottom:var(--space-2); color:var(--color-text); font-size:var(--text-sm); font-weight:700; }
.form-group label span { color:var(--color-text-faint); font-weight:500; }
.form-group input,.form-group select,.form-group textarea { width:100%; min-height:48px; padding:var(--space-3) var(--space-4); color:var(--color-text); background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--radius-md); font-size:var(--text-base); }
.form-group textarea { min-height:132px; resize:vertical; }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { outline:none; border-color:#a87100; box-shadow:0 0 0 3px color-mix(in oklab,var(--color-accent) 28%,transparent); }
.form-submit { width:100%; margin-top:var(--space-2); }
.form-note { margin:var(--space-3) auto 0; color:var(--color-text-faint); text-align:center; font-size:var(--text-xs); }
.form-success { display:none; padding:var(--space-12) var(--space-8); text-align:center; }
.form-success.show { display:flex; flex-direction:column; align-items:center; }
.form-success>svg { width:52px; height:52px; margin-bottom:var(--space-5); color:var(--color-success); }
.form-success h3 { margin-bottom:var(--space-3); color:var(--color-text); font:700 var(--text-xl) var(--font-display); }
.form-success p { margin:0 auto var(--space-6); color:var(--color-text-muted); }
.footer { padding-block:var(--space-16) var(--space-6); color:rgba(255,255,255,.72); background:#10101c; }
.footer-grid { display:grid; gap:var(--space-10); }
.footer-logo img { width:150px; height:58px; }
.footer-brand p { max-width:430px; margin-top:var(--space-4); font-size:var(--text-sm); }
.footer h3 { margin-bottom:var(--space-4); color:#fff; font:700 var(--text-sm) var(--font-display); text-transform:uppercase; letter-spacing:.08em; }
.footer ul { display:grid; gap:var(--space-3); }
.footer a { color:rgba(255,255,255,.65); text-decoration:none; font-size:var(--text-sm); }
.footer a:hover { color:var(--color-accent); }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-3); margin-top:var(--space-12); padding-top:var(--space-6); border-top:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.45); font-size:var(--text-xs); }
.sticky-mobile-cta { position:fixed; inset:auto 0 0; z-index:90; display:flex; padding:var(--space-3) var(--space-4); background:color-mix(in oklab,var(--color-bg) 94%,transparent); backdrop-filter:blur(12px); box-shadow:0 -6px 20px rgba(0,0,0,.12); border-top:1px solid var(--color-divider); }
.sticky-mobile-cta .btn { width:100%; }
body { padding-bottom:68px; }
.fade-in { opacity:1; }
.js-reveal { opacity:0; transform:translateY(14px); transition:opacity .55s var(--ease-out),transform .55s var(--ease-out); }
.js-reveal.visible { opacity:1; transform:none; }
@media (min-width:600px) { .form-row { grid-template-columns:1fr 1fr; } .coverage-points { grid-template-columns:1fr 1fr; } .coverage-points div { border-right:1px solid rgba(255,255,255,.14); } .coverage-points div:nth-child(2n) { border-right:0; } .coverage-points div:nth-last-child(-n+2) { border-bottom:0; } .service-wide { grid-template-columns:.55fr 1.2fr 1.2fr; } .service-wide .service-link { grid-column:2; } }
@media (min-width:768px) { .container { padding-inline:var(--space-8); } .nav-desktop { display:flex; } .mobile-menu-btn { display:none; } .header-cta { display:inline-flex!important; } .services-layout { grid-template-columns:1.02fr 1.15fr; } .service-feature { grid-row:span 1; } .service-wide { grid-column:1/-1; } .workflow-grid,.coverage-grid,.request-grid { grid-template-columns:.8fr 1.2fr; gap:clamp(var(--space-12),7vw,var(--space-24)); } .workflow-intro,.coverage-copy,.request-copy { position:sticky; top:120px; align-self:start; } .footer-grid { grid-template-columns:2fr 1fr 1fr; } .sticky-mobile-cta { display:none; } body { padding-bottom:0; } }
@media (min-width:1024px) { .service-feature { padding:var(--space-10); } .service-card { padding:var(--space-8); } .service-wide { padding:var(--space-8); grid-template-columns:.45fr 1.1fr 1.35fr auto; } .service-wide .service-link { grid-column:auto; margin-top:0; align-self:end; } }
@media (max-width:599px) { .hero { min-height:720px; align-items:flex-end; } .hero::before { background:linear-gradient(0deg,rgba(14,14,28,.98) 0%,rgba(14,14,28,.88) 58%,rgba(14,14,28,.4) 100%); } .hero-bg img { object-position:66% center; } .hero-content { padding-block:var(--space-16); } .hero-actions .btn { width:100%; } .trust-badges { gap:var(--space-3); } }
@media (prefers-reduced-motion:reduce) { .js-reveal { opacity:1; transform:none; } }
