/* BASE PrimeTech company site. Fonts are self-hosted (no third-party requests). */
@font-face { font-family: Poppins; font-weight: 400; font-display: swap; src: url(/fonts/poppins-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: Poppins; font-weight: 500; font-display: swap; src: url(/fonts/poppins-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: Poppins; font-weight: 600; font-display: swap; src: url(/fonts/poppins-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: Poppins; font-weight: 700; font-display: swap; src: url(/fonts/poppins-latin-700-normal.woff2) format("woff2"); }
/* The logo weight blocks briefly instead of swapping, so the logo never flashes in a fallback font. */
@font-face { font-family: Poppins; font-weight: 800; font-display: block; src: url(/fonts/poppins-latin-800-normal.woff2) format("woff2"); }

:root { --brand:#1463ff; --brand2:#0b4fd6; --ink:#0b0f1a; --muted:#5b6475; --line:#e6eaf2; --soft:#f4f7ff; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:84px; }
body { font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:#fff; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
svg.lucide { display:block; }
.wrap { max-width:1180px; margin:0 auto; padding:0 20px; }
h1,h2,h3,h4,.display { font-family:Poppins,sans-serif; letter-spacing:-.02em; }
.eyebrow { font:600 12px/1 Poppins,sans-serif; letter-spacing:.18em; text-transform:uppercase; color:var(--brand); }
.btn { display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:999px; font:600 15px Poppins,sans-serif; transition:.2s; border:0; cursor:pointer; }
.btn svg { width:18px; height:18px; }
.btn-primary { background:var(--brand); color:#fff; box-shadow:0 8px 24px -8px rgba(20,99,255,.6); }
.btn-primary:hover { background:var(--brand2); }
.btn-primary:disabled { opacity:.6; cursor:wait; }
.btn-ghost { border:1.5px solid var(--line); background:#fff; }
.btn-ghost:hover { border-color:var(--brand); color:var(--brand); }
:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
.skip { position:absolute; left:-999px; top:8px; background:#fff; padding:8px 14px; border-radius:8px; z-index:50; }
.skip:focus { left:8px; }

/* Logo: B mark + BASᵉ PrimeTech + lined tagline */
.logo { display:flex; align-items:center; gap:10px; }
.logo img { width:46px; height:46px; flex:none; }
.logo-name { display:block; font:800 25px/1 Poppins,sans-serif; letter-spacing:-.03em; white-space:nowrap; }
.logo-name .e { position:relative; top:-.556em; font-size:.62em; color:var(--brand); margin-left:1px; }
.logo-name .pt { color:var(--brand); }
.logo-tag { display:flex; align-items:center; gap:6px; margin-top:5px; font:700 8px/1 Poppins,sans-serif; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.logo-tag::before,.logo-tag::after { content:""; flex:1; min-width:10px; height:1px; background:currentColor; }

/* Header */
header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
header .wrap { display:flex; align-items:center; justify-content:space-between; height:76px; gap:20px; }
nav.main { display:flex; gap:26px; font:500 14px Poppins,sans-serif; }
nav.main a { color:#30384a; }
nav.main a:hover { color:var(--brand); }
.menu-btn { display:none; background:none; border:0; padding:8px; cursor:pointer; color:var(--ink); }
.menu-btn svg { width:26px; height:26px; }
.mobile-nav { display:none; border-top:1px solid var(--line); background:#fff; padding:10px 20px 20px; }
.mobile-nav a { display:block; padding:12px 0; font:500 16px Poppins,sans-serif; border-bottom:1px solid var(--line); }
.mobile-nav .btn { display:flex; margin-top:16px; width:100%; justify-content:center; border-bottom:0; }
header.open .mobile-nav { display:block; }

/* Hero */
.hero { position:relative; overflow:hidden; background:linear-gradient(180deg,#fff 0%,var(--soft) 100%); }
.hero::before { content:""; position:absolute; right:-160px; top:-120px; width:620px; height:620px; border-radius:50%; background:radial-gradient(closest-side,rgba(20,99,255,.16),transparent); }
.hero .wrap { position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; padding-top:80px; padding-bottom:90px; }
.hero h1 { font-size:clamp(38px,5.4vw,64px); line-height:1.05; font-weight:800; margin:18px 0 20px; }
.hero h1 span { color:var(--brand); display:block; }
.hero p.lead { font-size:19px; color:var(--muted); max-width:540px; }
.hero .ctas { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.hero .note { margin-top:18px; font-size:14px; color:var(--muted); display:flex; align-items:center; gap:8px; }
.hero .note svg { width:16px; height:16px; color:var(--brand); }
.chart { width:100%; height:auto; }

/* Services strip (brand board row) */
.strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }
.strip .wrap { display:grid; grid-template-columns:repeat(6,1fr); }
.strip a { display:flex; flex-direction:column; align-items:center; gap:10px; padding:26px 8px; text-align:center; font:500 14px/1.3 Poppins,sans-serif; border-right:1px solid var(--line); transition:.2s; }
.strip a:last-child { border-right:0; }
.strip a:hover { color:var(--brand); background:var(--soft); }
.strip svg { width:34px; height:34px; color:var(--brand); stroke-width:1.6; }

section { padding:96px 0; }
.head { max-width:720px; margin:0 auto 52px; text-align:center; }
.head h2 { font-size:clamp(30px,3.6vw,44px); line-height:1.12; font-weight:700; margin-top:12px; }
.head p { margin-top:14px; font-size:17px; color:var(--muted); }
.bg-soft { background:var(--soft); }

/* Service divisions */
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.card { border:1px solid var(--line); border-radius:20px; padding:28px; background:#fff; transition:.25s; }
.card:hover { transform:translateY(-3px); border-color:#c7d7ff; box-shadow:0 18px 40px -20px rgba(20,99,255,.35); }
.ico { width:52px; height:52px; flex:none; border-radius:14px; display:grid; place-items:center; background:#eaf1ff; color:var(--brand); }
.ico svg { width:26px; height:26px; }
.card h3 { font-size:19px; font-weight:700; margin:18px 0 8px; }
.card p { color:var(--muted); font-size:15px; }
.tags { list-style:none; margin-top:14px; display:flex; flex-wrap:wrap; gap:6px; }
.tags li { font-size:12.5px; background:var(--soft); color:#33405c; padding:4px 10px; border-radius:999px; }

/* Product band */
.product { background:linear-gradient(120deg,#0b4fd6,#1463ff 55%,#3b82f6); color:#fff; border-radius:28px; padding:48px; display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:center; }
.appicon { width:112px; height:112px; border-radius:28px; background:#fff; display:grid; place-items:center; box-shadow:0 20px 40px -16px rgba(0,0,0,.4); }
.appicon img { width:76px; height:76px; }
.product .eyebrow { color:#cfe0ff; }
.product h3 { font-size:28px; font-weight:700; margin-top:8px; }
.product p { opacity:.92; margin-top:8px; max-width:560px; }
.product .btn { background:#fff; color:var(--brand); }

/* Industries */
.ind { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; list-style:none; }
.ind li { display:flex; gap:14px; align-items:flex-start; padding:20px; border-radius:16px; background:#fff; border:1px solid var(--line); }
.ind svg { flex:none; width:24px; height:24px; color:var(--brand); margin-top:2px; }
.ind b { font-family:Poppins,sans-serif; display:block; }
.ind span { font-size:14px; color:var(--muted); }

/* Approach */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; position:relative; list-style:none; }
.steps::before { content:""; position:absolute; top:36px; left:12%; right:12%; height:2px; background:repeating-linear-gradient(90deg,var(--brand) 0 8px,transparent 8px 16px); }
.step { text-align:center; padding:0 10px; }
.step .num { width:72px; height:72px; margin:0 auto; border-radius:50%; display:grid; place-items:center; background:#fff; border:2px solid var(--brand); color:var(--brand); position:relative; z-index:1; }
.step .num svg { width:30px; height:30px; }
.step h3 { font-size:20px; margin:16px 0 6px; }
.step p { color:var(--muted); font-size:15px; }

/* Packages */
.pk { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.pk .card { display:flex; flex-direction:column; }
.pk .card.hl { border:2px solid var(--brand); }
.pk .tag { font:600 11px Poppins,sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); }
.pk h3 { margin-top:8px; }
.list { list-style:none; margin-top:14px; display:grid; gap:8px; font-size:14px; color:#33405c; }
.list li { display:flex; gap:8px; }
.list svg { width:16px; height:16px; flex:none; color:var(--brand); margin-top:3px; }
.pk .foot { margin-top:auto; padding-top:20px; font-size:13px; color:var(--muted); }
.small { text-align:center; margin-top:22px; color:var(--muted); font-size:14px; }

/* Free assessment */
.offer { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; border:1px solid var(--line); border-radius:28px; padding:48px; background:#fff; box-shadow:0 30px 60px -40px rgba(20,99,255,.45); }
.offer h2 { font-size:34px; line-height:1.15; margin-top:12px; }
.offer .sub { color:var(--muted); margin:14px 0 26px; }
.offer ol { list-style:none; display:grid; gap:12px; counter-reset:o; }
.offer li { counter-increment:o; display:flex; gap:14px; align-items:center; padding:14px 16px; border-radius:14px; background:var(--soft); font-weight:500; }
.offer li::before { content:counter(o); width:30px; height:30px; flex:none; border-radius:50%; background:var(--brand); color:#fff; display:grid; place-items:center; font:700 14px Poppins,sans-serif; }

/* Portfolio */
.grid2 { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.pf-label { font:600 13px Poppins,sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin:8px 0 14px; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.pf-label small { font-weight:400; letter-spacing:0; text-transform:none; font-size:13px; }
.pf + .pf-label { margin-top:44px; }
.work { display:flex; flex-direction:column; border-radius:20px; overflow:hidden; border:1px solid var(--line); background:#fff; transition:transform .2s, box-shadow .2s; }
.work:hover { transform:translateY(-4px); box-shadow:0 24px 50px -28px rgba(11,15,26,.35); }
.work .shot { position:relative; aspect-ratio:16/10; background:#eef2fb; border-bottom:1px solid var(--line); overflow:hidden; }
.work .shot img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .4s; }
.work:hover .shot img { transform:scale(1.03); }
.work .badge { position:absolute; top:14px; left:14px; background:rgba(11,15,26,.82); color:#fff; font:600 11px Poppins,sans-serif; letter-spacing:.08em; text-transform:uppercase; padding:5px 10px; border-radius:999px; }
.work .badge.live { background:#1463ff; }
.work .body { padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.work h3 { font-size:18px; }
.work p { color:var(--muted); font-size:14px; margin-top:6px; flex:1; }
.work .more { margin-top:14px; display:inline-flex; align-items:center; gap:6px; color:#1463ff; font-weight:600; font-size:14px; }
.work .more svg { width:16px; height:16px; }

/* About */
.about { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.vm { border-radius:20px; padding:32px; background:#fff; }
.vm h3 { font-size:22px; margin:16px 0 10px; }
.vm p { color:#33405c; }
.principles { margin-top:24px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; list-style:none; }
.principles li { display:flex; gap:10px; font-size:15px; }
.principles svg { width:20px; height:20px; flex:none; color:var(--brand); margin-top:2px; }

/* Contact */
.contact { display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; }
.contact h2 { font-size:clamp(30px,3.6vw,42px); line-height:1.12; margin-top:12px; }
.contact .sub { color:var(--muted); margin-top:14px; }
.ways { display:grid; gap:14px; margin-top:28px; }
.ways a { display:flex; gap:14px; align-items:center; padding:16px 18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.ways a:hover { border-color:var(--brand); }
.ways b { font-family:Poppins,sans-serif; }
.ways small { display:block; color:var(--muted); font-size:14px; }
form { border:1px solid var(--line); border-radius:24px; padding:32px; background:#fff; display:grid; grid-template-columns:1fr 1fr; gap:14px; align-content:start; }
form label { font:500 13px Poppins,sans-serif; display:grid; gap:6px; }
form .full { grid-column:1/-1; }
input,select,textarea { font:15px system-ui,sans-serif; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:#fbfcff; color:var(--ink); width:100%; }
input:focus,select:focus,textarea:focus { outline:2px solid #c7d7ff; border-color:var(--brand); }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.status { font-size:14px; }
.status.ok { color:#0a7a3d; }
.status.err { color:#c0262d; }

/* Footer */
footer { background:#0b0f1a; color:#c9d0de; padding:64px 0 30px; }
footer .logo-name { color:#fff; }
.fgrid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px; }
footer h4 { font:600 14px Poppins,sans-serif; color:#fff; margin-bottom:14px; }
footer ul { list-style:none; display:grid; gap:8px; font-size:14px; }
footer a:hover { color:#fff; }
footer .about-line { margin-top:18px; font-size:14px; max-width:320px; }
.copy { border-top:1px solid #222a3b; margin-top:44px; padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:13px; }

/* Simple text pages (404) */
.page { min-height:60vh; display:grid; place-items:center; text-align:center; padding:80px 20px; }
.page h1 { font-size:clamp(34px,5vw,52px); margin:14px 0; }
.page p { color:var(--muted); margin-bottom:28px; }

@media (max-width:1024px) {
  nav.main, header .wrap > .btn { display:none; }
  .menu-btn { display:block; }
  .hero .wrap, .offer, .contact, .about { grid-template-columns:1fr; }
  .strip .wrap { grid-template-columns:repeat(3,1fr); }
  .strip a:nth-child(3) { border-right:0; }
  .strip a:nth-child(-n+3) { border-bottom:1px solid var(--line); }
  .grid3, .ind { grid-template-columns:repeat(2,1fr); }
  .pk { grid-template-columns:repeat(2,1fr); }
  .product { grid-template-columns:1fr; text-align:center; justify-items:center; }
  .fgrid { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px) {
  section { padding:68px 0; }
  .wrap { padding:0 16px; }
  .hero .wrap { padding-top:48px; padding-bottom:60px; }
  .strip .wrap { grid-template-columns:repeat(2,1fr); }
  .strip a, .strip a:nth-child(3) { border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .strip a:nth-child(2n) { border-right:0; }
  .grid3, .grid2, .ind, .pk, .principles { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr 1fr; row-gap:36px; }
  .steps::before { display:none; }
  .offer, .product { padding:30px 22px; }
  form { grid-template-columns:1fr; padding:22px; }
  .fgrid { grid-template-columns:1fr; }
  .logo-name { font-size:21px; }
  .logo img { width:40px; height:40px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }
