/* ==========================================================================
   W3Staffing theme - loaded after site.css by Views/Shared/_Layoutw3s.cshtml only.
   Re-colours the shared public-site design with the W3Staffing logo palette:
     navy  #0a2a6b (the "Staffing" word)      royal #0b5ad6 (the "W")
     sky   #1aa3f5 (the "3" highlight)        green #5dbb2e / orange #ff8a1f (the people)
   SoftGoWay (site.css) and AlphaVisionLabs are not affected.
   ========================================================================== */

:root {
    --brand: #0b5ad6;          /* logo royal blue - primary actions */
    --brand-600: #0a4cb6;
    --brand-700: #083d94;
    --brand-50: #eaf2ff;
    --brand-100: #d3e4ff;
    --blue: #1aa3f5;           /* logo sky blue - gradients, highlights */
    --blue-50: #e7f6ff;
    --navy: #0a2a6b;           /* logo navy - headings, dark bands */
    --green: #5dbb2e;          /* logo people - small accents only */
    --orange: #ff8a1f;
    --yellow: #ffb020;
    --red: #e5484d;

    --ink: #0a1f44;
    --ink-2: #33415c;
    --muted: #5a6882;
    --line: #e1e8f3;
    --soft: #f4f8fe;
    --ink-bg: #071a40;         /* footer, CTA band */

    --w3-grad: linear-gradient(100deg, #0a2a6b 0%, #0b5ad6 45%, #1aa3f5 100%);
    --w3-grad-soft: linear-gradient(160deg, #eaf2ff, #e7f6ff);
    --w3-ring: rgba(11, 90, 214, .35);
    --w3-glow: rgba(11, 90, 214, .55);
}

/* ---------- base */
.w3s :focus-visible { outline-color: var(--w3-ring); }
.w3s ::selection { background: #cfe1ff; color: var(--navy); }

/* ---------- header */
.w3s .site-logo img { height: 46px; width: auto; }
.w3s .scroll-progress { background: var(--w3-grad); }
.w3s .site-nav .nav-a.active { color: var(--brand-700); background: var(--brand-50); }

/* ---------- buttons */
.w3s .btn-sgw { background: var(--w3-grad); background-size: 140% 100%; background-position: 0 0; box-shadow: 0 10px 22px -10px var(--w3-glow); }
.w3s .btn-sgw:hover { background-position: 100% 0; box-shadow: 0 14px 28px -10px var(--w3-glow); }
.w3s .btn-sgw.btn-light { background: #fff; color: var(--navy) !important; }
.w3s .btn-sgw.btn-light::after { background: linear-gradient(120deg, transparent, rgba(11, 90, 214, .15), transparent); }
.w3s .btn-sgw-outline { border-color: var(--brand-100); color: var(--brand-700) !important; }
.w3s .btn-sgw-outline:hover { border-color: var(--brand); }

/* ---------- gradient text / eyebrow / badges */
.w3s .text-grad { background: var(--w3-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.w3s .eyebrow .dot { background: var(--green); }
.w3s .hero-badge b { background: var(--w3-grad); }

/* ---------- hero + page heroes: blue wash instead of green */
.w3s .hero::before {
    background:
        radial-gradient(900px 480px at 85% 10%, rgba(26, 163, 245, .14), transparent 60%),
        radial-gradient(700px 420px at 5% 30%, rgba(11, 90, 214, .12), transparent 60%),
        url("../img/grid-pattern.svg") center top / 1400px auto no-repeat;
}
.w3s .hero .glow.g1 { background: #bcd6ff; }
.w3s .hero .glow.g2 { background: #b8e6ff; }
.w3s .hero .glow.g3 { background: #d7f0c6; opacity: .45; }
.w3s .page-hero::before {
    background:
        radial-gradient(760px 380px at 92% 0%, rgba(26, 163, 245, .14), transparent 62%),
        radial-gradient(640px 360px at 0% 30%, rgba(11, 90, 214, .12), transparent 62%) !important;
}

/* ---------- cards, tiles, stats */
.w3s .card-sgw::after, .w3s .step::after { background: var(--w3-grad); }
.w3s .card-sgw:hover { box-shadow: 0 18px 36px -18px rgba(11, 90, 214, .35); }
.w3s .icon-tile { background: var(--brand-50); color: var(--brand); }
.w3s .icon-tile.blue { background: var(--blue-50); color: #0b86d1; }
.w3s .icon-tile.orange { background: #fff1e4; color: #e5700a; }
.w3s .icon-tile.yellow { background: #fff6e0; color: #c98a00; }
.w3s .icon-tile.red { background: #fdecec; color: var(--red); }
.w3s .icon-tile.ink { background: #e8edf7; color: var(--navy); }
.w3s .split-art { background: var(--w3-grad-soft); }
.w3s .stat .num, .w3s .hero-proof strong { color: var(--navy); }
.w3s .tech-tile:hover { box-shadow: 0 16px 32px -14px rgba(11, 90, 214, .45); border-color: var(--brand-100); }

/* ---------- CTA band + footer: deep navy with the logo blues */
.w3s .cta-band {
    background:
        radial-gradient(600px 300px at 90% 0%, rgba(26, 163, 245, .40), transparent 60%),
        radial-gradient(500px 300px at 0% 100%, rgba(11, 90, 214, .45), transparent 60%),
        var(--ink-bg);
}
.w3s .site-footer a:hover { color: #7cc8ff; }
.w3s .foot-logo img { height: 48px; width: auto; }

/* ---------- forms, alerts, blog thumbs */
.w3s .form-sgw .form-control:focus, .w3s .form-sgw .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(11, 90, 214, .12); }
.w3s .post-thumb.t-green { background: linear-gradient(135deg, #0a2a6b, #0b5ad6); }
.w3s .post-thumb.t-blue { background: linear-gradient(135deg, #0b5ad6, #1aa3f5); }

/* ---------- dark mode (theme.js sets <html data-theme="dark">) */
html[data-theme="dark"] .w3s {
    --brand: #3d8bff;
    --brand-600: #2f7bf0;
    --brand-700: #7fb2ff;
    --brand-50: rgba(61, 139, 255, .14);
    --brand-100: rgba(61, 139, 255, .26);
    --blue: #38b6ff;
    --blue-50: rgba(56, 182, 255, .15);
    --navy: #e7eefb;
    --ink: #e7eefb;
    --ink-2: #c2cde0;
    --muted: #8f9db6;
    --line: #1c2a45;
    --soft: #0c1730;
    --white: #081226;
    --surface: #0f1c38;
    --ink-bg: #050d1f;
    --header-glass: rgba(8, 18, 38, .82);
    --glass: rgba(15, 28, 56, .9);
    --w3-grad: linear-gradient(100deg, #2f7bf0 0%, #38b6ff 100%);
    --w3-grad-soft: linear-gradient(160deg, rgba(61, 139, 255, .14), rgba(56, 182, 255, .10));
    --w3-glow: rgba(61, 139, 255, .45);
}
html[data-theme="dark"] .w3s .hero::before {
    background:
        radial-gradient(900px 480px at 85% 10%, rgba(56, 182, 255, .16), transparent 60%),
        radial-gradient(700px 420px at 5% 30%, rgba(61, 139, 255, .18), transparent 60%);
}
html[data-theme="dark"] .w3s .hero .glow { opacity: .22; }
html[data-theme="dark"] .w3s .page-hero { background: linear-gradient(180deg, #0a1735, var(--white)); }
html[data-theme="dark"] .w3s .page-hero::before {
    background:
        radial-gradient(760px 380px at 92% 0%, rgba(56, 182, 255, .18), transparent 62%),
        radial-gradient(640px 360px at 0% 30%, rgba(61, 139, 255, .20), transparent 62%) !important;
}
html[data-theme="dark"] .w3s .btn-sgw.btn-light { background: #e7eefb; }
html[data-theme="dark"] .w3s .icon-tile.ink { background: rgba(231, 238, 251, .08); color: #c2cde0; }