:root{
  --brand:#0b3fa8; --brand-2:#2563eb; --brand-dark:#062559; --accent:#f97316; --green:#0f9d58; --purple:#6d28d9;
  --ink:#0b1220; --muted:#64748b; --line:#e6ecf5; --soft:#eef4ff;
  --radius:16px;
  --shadow-sm:0 1px 2px rgba(11,18,32,.06),0 2px 8px rgba(11,18,32,.05);
  --shadow-md:0 10px 24px rgba(11,63,168,.10);
  --shadow-lg:0 22px 48px rgba(11,63,168,.16);
  --grad-brand:linear-gradient(135deg,#0b3fa8,#2563eb 60%,#3b82f6);
}
*{-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden;max-width:100%}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.65}
img{max-width:100%;height:auto}
h1,h2,h3,h4,h5,h6,.navbar-brand{font-family:'Manrope','Poppins',sans-serif;font-weight:800;letter-spacing:-.02em;line-height:1.18}
h1,.display-5{font-size:clamp(1.9rem,1.2rem + 2.6vw,3.15rem)}
.display-6{font-size:clamp(1.6rem,1.1rem + 2vw,2.5rem)}
h2,.h4{letter-spacing:-.02em}
p{color:#334155}
a{text-decoration:none;transition:color .2s ease}
:focus-visible{outline:3px solid rgba(37,99,235,.45);outline-offset:2px;border-radius:8px}

/* ---------- header ---------- */
.topbar{background:var(--brand-dark);color:#cfe0ff;font-size:.82rem}
.topbar a{color:#cfe0ff}
.topbar a:hover{color:#fff}
.navbar{background:rgba(255,255,255,.88)!important;backdrop-filter:saturate(160%) blur(12px);box-shadow:0 1px 0 var(--line)}
.navbar.scrolled{box-shadow:0 8px 24px rgba(11,18,32,.08)}
.navbar .nav-link{font-weight:600;color:var(--ink);font-size:.95rem;padding:.55rem .85rem;border-radius:10px;position:relative}
.navbar .nav-link:hover{color:var(--brand);background:var(--soft)}
.navbar .nav-link.active{color:var(--brand);background:var(--soft)}
.navbar .nav-link.active::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:.25rem;height:3px;border-radius:3px;background:var(--grad-brand)}
.navbar-toggler{border:1px solid var(--line);border-radius:10px;padding:.35rem .55rem}
.navbar-toggler:focus{box-shadow:none}
.brand-mark{width:42px;height:42px;flex:0 0 42px;border-radius:13px;background:var(--grad-brand);display:grid;place-items:center;color:#fff;font-size:1.25rem;box-shadow:var(--shadow-md)}
.navbar-brand{white-space:normal}

/* ---------- buttons ---------- */
.btn{border-radius:12px;font-weight:600;transition:transform .18s ease,box-shadow .2s ease,background .2s ease}
.btn-brand{background:var(--grad-brand);color:#fff;border:0;box-shadow:0 8px 18px rgba(11,63,168,.25)}
.btn-brand:hover,.btn-brand:focus{color:#fff;transform:translateY(-2px);box-shadow:0 14px 26px rgba(11,63,168,.32)}
.btn-outline-brand{border:1.5px solid rgba(11,63,168,.35);color:var(--brand);background:#fff}
.btn-outline-brand:hover{background:var(--brand);border-color:var(--brand);color:#fff;transform:translateY(-2px)}
.btn-accent{background:var(--accent);color:#fff;border:0}
.btn-accent:hover{background:#ea6a08;color:#fff;transform:translateY(-2px)}
.btn:active{transform:translateY(0)}

/* ---------- hero ---------- */
.hero{position:relative;background:radial-gradient(1200px 500px at 12% -10%,#dbe8ff 0%,transparent 60%),linear-gradient(180deg,#f6f9ff,#eaf1ff)}
.hero::after{content:"";position:absolute;inset:auto -10% -40% auto;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 70%);pointer-events:none}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--line);color:var(--brand);font-weight:700;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:.4rem .8rem;border-radius:999px;box-shadow:var(--shadow-sm)}
.hero-media{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg)}
.hero-media img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .6s ease}
.hero-media:hover img{transform:scale(1.04)}
.hero-badge{position:absolute;left:12px;bottom:12px;right:12px;background:rgba(255,255,255,.94);backdrop-filter:blur(6px);border-radius:14px;padding:.7rem .9rem;box-shadow:var(--shadow-sm);font-size:.82rem}
.search-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:.75rem;box-shadow:var(--shadow-md)}
.form-control,.form-select{border-radius:11px;border-color:var(--line);padding:.65rem .85rem}
.form-control:focus,.form-select:focus{border-color:var(--brand-2);box-shadow:0 0 0 .2rem rgba(37,99,235,.15)}
.trust-pill{display:inline-flex;align-items:center;gap:.4rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.35rem .75rem;font-size:.8rem;color:#475569;box-shadow:var(--shadow-sm)}

.text-brand{color:var(--brand)!important} .text-accent{color:var(--accent)!important} .text-green{color:var(--green)!important} .text-purple{color:var(--purple)!important}
.bg-brand-soft{background:var(--soft)}
.section{padding:clamp(44px,6vw,84px) 0}
.section-title{font-size:clamp(1.35rem,1.05rem + 1vw,2rem)}

/* ---------- cards ---------- */
.quick-card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;height:100%}
.quick-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:rgba(37,99,235,.25)}
.icon-badge{width:46px;height:46px;flex:0 0 46px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;color:#fff;box-shadow:var(--shadow-sm)}
.cat-tile{border:1px solid var(--line);border-radius:14px;padding:1.1rem .5rem;text-align:center;background:#fff;transition:.25s ease;display:block;color:var(--ink);box-shadow:var(--shadow-sm);height:100%}
.cat-tile:hover{border-color:transparent;background:var(--grad-brand);color:#fff;transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.cat-tile:hover i{color:#fff}
.cat-tile i{font-size:1.6rem;color:var(--brand);transition:.25s}
.job-row{border-bottom:1px solid var(--line);border-radius:12px;padding-inline:.5rem;transition:background .2s ease}
.job-row:hover{background:var(--soft)}
.job-row:last-child{border-bottom:0}
.badge-new{background:#dcfce7;color:#166534;font-weight:600}
.stat-strip{background:var(--grad-brand);color:#fff}
.stat-strip .h3,.stat-strip h3{color:#fff}

.material-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;height:100%;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column}
.material-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px)}
.material-card .thumb{aspect-ratio:16/9;display:grid;place-items:center;font-size:2.6rem;color:#fff;position:relative;overflow:hidden}
.material-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.22),transparent 60%)}
.material-card > .p-3,.material-card > div:last-child{flex:1;display:flex;flex-direction:column}
.price{font-weight:800;color:var(--brand)}
.media-card{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-md)}
.media-card img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;transition:transform .6s ease}
.media-card:hover img{transform:scale(1.05)}
.ratio-cover{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:18px;box-shadow:var(--shadow-md)}

.cta-band{position:relative;border-radius:24px;overflow:hidden;background:var(--brand-dark);color:#fff;box-shadow:var(--shadow-lg)}
.cta-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.cta-band .cta-inner{position:relative;background:linear-gradient(90deg,rgba(6,37,89,.95) 35%,rgba(6,37,89,.35));padding:clamp(1.5rem,3vw,3rem)}
.cta-band h2,.cta-band p{color:#fff}

/* ---------- footer ---------- */
footer{background:linear-gradient(180deg,#0a1b3d,#061229);color:#c7d5f0}
footer a{color:#c7d5f0;font-size:.92rem}
footer a:hover{color:#fff;padding-left:3px}
footer h5,footer h6{color:#fff}
footer .social a{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.08);transition:.2s}
footer .social a:hover{background:var(--brand-2);color:#fff;transform:translateY(-3px);padding-left:0}

/* ---------- animation ---------- */
.reveal{opacity:0;transform:translateY(18px)}
.reveal.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal.in{opacity:1;transform:none;transition:none}
  *{animation:none!important}
}

/* ---------- responsive ---------- */
@media (max-width:991.98px){
  .navbar-collapse{background:#fff;border:1px solid var(--line);border-radius:16px;padding:.75rem;margin-top:.75rem;box-shadow:var(--shadow-md)}
  .navbar .nav-link.active::after{display:none}
  .hero::after{display:none}
}
@media (max-width:575.98px){
  body{font-size:.95rem}
  .section{padding:36px 0}
  .btn{width:auto}
  .job-row{flex-wrap:wrap}
  .job-row .text-end{text-align:left!important}
  .cta-band img{opacity:.25}
  .cta-band .cta-inner{background:linear-gradient(180deg,rgba(6,37,89,.92),rgba(6,37,89,.96))}
  .icon-badge{width:42px;height:42px;flex:0 0 42px}
}