/* ============================================================
   Velocity Star Logistics — Executive Gold Glass Design System
   Typography: Inter  |  Primary: #000000  |  Accent: #FDBE0E
   Background: Warm Ivory #FDFCF8  |  Glass: white 55–75%
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* ── Executive Gold Glass tokens ── */
  --ink:        #000000;            /* primary brand black */
  --ink-hover:  #222222;
  --primary:    #fdbe0e;            /* gold accent */
  --primary-dark:#b1850a;
  --accent:     #7f5f07;            /* deep gold for small text on light */
  --bg:         #fdfcf8;            /* warm ivory */
  --surface:    #faf7ef;            /* soft cream */
  --surface-2:  #f7f1df;            /* champagne */
  --text:       #111111;
  --text-muted: #4c4c4c;
  --border:     #ece5d3;            /* outline-variant */
  --border-warm:rgba(253,190,14,.15);
  --border-warm-strong:rgba(253,190,14,.25);
  --gold-tint:  #fff6d6;            /* secondary container */

  /* ── Glass surfaces ── */
  --glass:      rgba(255,255,255,.55);
  --glass-elev: rgba(255,255,255,.75);
  --glass-input:rgba(255,255,255,.65);
  --glass-shadow:0 8px 32px rgba(0,0,0,.06);
  --glass-shadow-elev:0 20px 60px rgba(0,0,0,.08);

  /* ── System ── */
  --maxw:  1240px;
  --ease:  cubic-bezier(.19,1,.22,1);
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --radius:    8px;
  --radius-lg: 16px;   /* cards */
  --radius-xl: 24px;   /* buttons & inputs */
  --radius-pill: 9999px;
}

/* ── RESET & BASE ──────────────────────────────────────────── */
*  { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior:smooth }
body {
  font-family:'Inter', sans-serif;
  font-size:16px;
  color:var(--text-muted);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  line-height:1.6;
  font-weight:400;
}
h1,h2,h3 {
  font-family:'Inter', sans-serif;
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--text);
}
h4,h5 {
  font-family:'Inter', sans-serif;
  font-weight:600;
  line-height:1.3;
  letter-spacing:-.01em;
  color:var(--text);
}
a { text-decoration:none; color:inherit; transition:color .25s }
img { max-width:100%; display:block }
ul { list-style:none }
section { position:relative }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 32px }
.sec { padding:50px 0 }
.sec-tight { padding:64px 0 }

/* alternate section bg — barely perceptible warm dark */
.sec-alt { background:var(--surface-2) }
/* kept for existing HTML compat */
.sec-light { background:var(--surface-2) }
.sec-dark  { background:var(--bg) }

/* ── SECTION HEADER ───────────────────────────────────────── */
.sh { margin-bottom:56px; max-width:680px }
.sh h2 { font-size:clamp(2.16rem,3.3vw,3.24rem); margin-bottom:16px }
.sh p  { font-size:.95rem; color:var(--text-muted); line-height:1.72 }
.sh.center { margin-left:auto; margin-right:auto; text-align:center }
.sh.center p { margin:0 auto }

/* ── BUTTONS ──────────────────────────────────────────────── */
.btn {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-family:'Inter', sans-serif;
  font-weight:600;
  font-size:.72rem;
  padding:0 24px;
  height:48px;
  border-radius:var(--radius-xl);
  cursor:pointer;
  border:1.5px solid transparent;
  transition:all .3s var(--ease);
  white-space:nowrap;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.btn-primary { background:var(--ink); color:#fff }
.btn-primary:hover { background:var(--ink-hover); transform:translateY(-2px);
  box-shadow:0 12px 32px -8px rgba(0,0,0,.3), 0 0 24px rgba(253,190,14,.2) }
.btn-dark { background:var(--ink); color:#fff; border-color:var(--border-warm) }
.btn-dark:hover { background:var(--ink-hover); border-color:var(--border-warm-strong); color:#fff }
.btn-white { background:rgba(255,255,255,.45); color:var(--ink);
  backdrop-filter:blur(20px); border-color:var(--border-warm) }
.btn-white:hover { background:var(--primary); border-color:var(--primary); color:#111111 }
.btn-outline { background:rgba(255,255,255,.45); color:var(--text); border-color:var(--border);
  backdrop-filter:blur(20px) }
.btn-outline:hover { border-color:var(--primary); color:var(--accent) }
.btn-outline-dark { background:transparent; color:var(--text); border-color:var(--border) }
.btn-outline-dark:hover { border-color:var(--primary); color:var(--accent) }
.btn .arr { transition:transform .3s var(--ease) }
.btn:hover .arr { transform:translateX(4px) }

/* ── TOPBAR ───────────────────────────────────────────────── */
.topbar {
  background:var(--bg);
  color:rgba(17,17,17,.65);
  font-family:'Inter', sans-serif;
  font-size:.68rem;
  border-bottom:1px solid var(--border);
}
.topbar .wrap { display:flex; align-items:center; justify-content:space-between; height:40px; gap:16px }
.tb-left,.tb-right { display:flex; align-items:center; gap:22px }
.tb-item { display:inline-flex; align-items:center; gap:7px; color:rgba(17,17,17,.65); transition:color .25s }
.tb-item:hover { color:var(--primary) }
.tb-item svg { width:12px; height:12px; color:var(--primary); flex-shrink:0 }
.tb-sep { width:1px; height:16px; background:var(--border) }
.tb-socials { display:flex; gap:10px }
.tb-socials a { width:26px; height:26px; border-radius:var(--radius); background:transparent;
  border:1px solid var(--border); display:flex; align-items:center; justify-content:center;
  color:rgba(17,17,17,.55); transition:all .25s }
.tb-socials a:hover { background:var(--primary); border-color:var(--primary); color:#111111 }
.tb-socials svg { width:11px; height:11px }
@media(max-width:880px) { .tb-left .tb-item:last-child { display:none } }
@media(max-width:620px) { .topbar { display:none } }

/* ── HEADER ───────────────────────────────────────────────── */
header {
  position:sticky; top:0; z-index:60;
  background:var(--glass-elev);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border-warm);
  transition:border-color .3s, box-shadow .3s;
}
header.scrolled { border-bottom-color:var(--border-warm-strong); box-shadow:var(--glass-shadow) }
.nav { display:flex; align-items:center; height:92px; gap:28px }
.brand { display:flex; align-items:center; flex-shrink:0 }
.logo-img { height:72px; width:auto; max-width:180px; object-fit:contain; display:block }
nav.menu { display:flex; align-items:center; gap:2px; flex:1; justify-content:center }
nav.menu a {
  font-family:'Inter', sans-serif;
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text-muted);
  padding:9px 16px;
  border-radius:var(--radius);
  transition:color .25s, background .25s;
  position:relative;
}
nav.menu a:hover { color:var(--text) }
nav.menu a.active { color:var(--text) }
nav.menu a.active::after {
  content:'';
  position:absolute; bottom:2px; left:16px; right:16px;
  height:1.5px; background:var(--primary); border-radius:2px;
}
.nav-end { display:flex; align-items:center; gap:12px; flex-shrink:0 }
.nav-phone { display:flex; align-items:center; gap:10px }
.nav-phone .pic {
  width:36px; height:36px; border-radius:var(--radius);
  background:var(--surface); border:1px solid var(--border-warm);
  display:flex; align-items:center; justify-content:center; color:var(--primary);
}
.nav-phone .pic svg { width:16px; height:16px }
.nav-phone .pt { display:flex; flex-direction:column; line-height:1.2 }
.nav-phone .pl { font-family:'Inter', sans-serif; font-size:.6rem; color:rgba(17,17,17,.55); font-weight:600; text-transform:uppercase; letter-spacing:.1em }
.nav-phone .pn { font-size:.88rem; font-weight:600; color:var(--text) }
.burger { display:none; flex-direction:column; gap:5px;
  background:none; border:0; cursor:pointer; padding:8px }
.burger span { width:22px; height:1.5px; background:var(--text); border-radius:2px; transition:.3s }
@media(max-width:1100px) { .nav-phone { display:none } }
@media(max-width:980px) {
  nav.menu {
    position:fixed; inset:0 0 0 auto; width:min(300px,80vw);
    background:rgba(255,255,255,.85); backdrop-filter:blur(40px);
    -webkit-backdrop-filter:blur(40px);
    border-left:1px solid var(--border-warm-strong);
    flex-direction:column; align-items:flex-start;
    padding:90px 24px 30px; gap:2px;
    transform:translateX(100%); transition:transform .4s var(--ease);
    z-index:70; justify-content:flex-start;
  }
  nav.menu.open { transform:translateX(0) }
  nav.menu a { width:100%; font-size:.75rem; padding:12px 14px }
  nav.menu a.active::after { display:none }
  .burger { display:flex; z-index:80 }
  .nav-end .btn { display:none }
  body.lock { overflow:hidden }
  .scrim { position:fixed; inset:0; background:rgba(0,0,0,.18);
    opacity:0; visibility:hidden; transition:.3s; z-index:65 }
  .scrim.show { opacity:1; visibility:visible }
}

/* ── HERO ─────────────────────────────────────────────────── */
.hero {
  position:relative; isolation:isolate;
  background:var(--bg); overflow:hidden;
  min-height:92vh; display:flex; align-items:center;
  padding:40px 0 40px;
}
/* Warm gold atmospheric glow */
.hero::before {
  content:'';
  position:absolute;
  top:-10%;
  left:50%;
  transform:translateX(-30%);
  width:1000px; height:900px;
  background:radial-gradient(ellipse at 55% 30%,
    rgba(253,190,14,.18) 0%,
    rgba(253,190,14,.08) 45%,
    transparent 70%);
  z-index:0;
  pointer-events:none;
  filter:blur(2px);
}
.hero-bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:-2; opacity:.92;
}
.hero-overlay {
  position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg,
    rgba(255,255,255,.9) 0%,
    rgba(250,247,239,.8) 55%,
    rgba(247,241,223,.35) 100%);
}
.hero-inner {
  position:relative; z-index:1; max-width:760px;
}
.hero h1 {
  font-size:clamp(2rem, 4.44vw, 4rem);
  font-weight:700; line-height:1.07;
  color:var(--text); letter-spacing:-.04em;
  margin-bottom:26px;
}
.hero h1 .hl {
  color:var(--primary-dark);
  position:relative; display:inline-block;
}
.hero h1 .hl::after {
  content:'';
  position:absolute; left:0; right:0; bottom:.04em;
  height:3px; background:var(--primary); border-radius:2px;
}
.hero .lead {
  font-size:1.02rem; color:var(--text-muted);
  max-width:540px; margin-bottom:38px; line-height:1.72;
}
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:32px }
.hero-track {
  display:flex; gap:0; max-width:480px;
  border:1px solid var(--border-warm-strong); border-radius:var(--radius-xl); overflow:hidden;
  background:var(--glass-input);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-shadow:var(--glass-shadow);
}
.hero-track input {
  flex:1; padding:13px 20px;
  background:transparent; border:0;
  font-family:'Inter', sans-serif;
  font-size:.8rem; color:var(--text); letter-spacing:.04em;
}
.hero-track input::placeholder { color:rgba(17,17,17,.55) }
.hero-track input:focus { outline:0; background:rgba(253,190,14,.08) }
.hero-track button { border-radius:0; padding:13px 22px; border:0 }
.hero-trust {
  font-family:'Inter', sans-serif;
  font-size:.65rem; color:rgba(17,17,17,.55);
  letter-spacing:.1em; margin-top:22px;
  display:flex; align-items:center; gap:10px;
}
.hero-trust::before {
  content:''; width:6px; height:6px;
  background:var(--primary); border-radius:50%;
}
@media(max-width:640px) {
  .hero { min-height:auto; padding:70px 0 80px }
  .hero h1 { font-size:3.2rem }
  .hero-track { display:none }
}

/* ── FEATURE BAR ─────────────────────────────────────────── */
.feat-bar {
  background:var(--glass);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border-warm);
  border-radius:var(--radius-lg);
  box-shadow:var(--glass-shadow);
  margin-top:0;
  margin-bottom:0;
  overflow:hidden;
}
.feat-bar-inner {
  display:grid; grid-template-columns:repeat(3,1fr);
}
.fb-item {
  padding:32px 30px;
  display:flex; gap:18px; align-items:flex-start;
  border-right:1px solid var(--border-warm-strong);
  transition:background .3s;
}
.fb-item:last-child { border-right:0 }
.fb-item:hover { background:rgba(253,190,14,.08) }
.fb-icon {
  width:46px; height:46px;
  border-radius:var(--radius);
  background:rgba(253,190,14,.12);
  border:1px solid var(--border-warm);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; color:var(--primary);
  font-family:'Inter', sans-serif;
  font-size:.8rem; font-weight:600; letter-spacing:.06em;
}
.fb-item h4 { font-size:1rem; color:var(--text); margin-bottom:4px; font-weight:600 }
.fb-item p  { font-size:.87rem; color:var(--text-muted); line-height:1.55 }
@media(max-width:760px) {
  .feat-bar-inner { grid-template-columns:1fr }
  .fb-item { border-right:0; border-bottom:1px solid var(--border-warm) }
  .fb-item:last-child { border-bottom:0 }
}

/* ── MEDIA ROW ───────────────────────────────────────────── */
.media-row { display:grid; grid-template-columns:1.05fr 1fr; gap:72px; align-items:center }
.media-row.rev .mr-fig { order:2 }
.media-row.rev .mr-txt { order:1 }
.why-block  { display:grid; grid-template-columns:1fr 1.05fr; gap:72px; align-items:center }
.mr-fig, .why-block > .mr-fig { position:relative }
.img-main { position:relative; border-radius:var(--radius); overflow:hidden }
.img-main img { width:100%; aspect-ratio:4/3.2; object-fit:cover; display:block;
  transition:transform .8s var(--ease) }
.img-main:hover img { transform:scale(1.03) }
.img-float {
  position:absolute; right:-26px; bottom:-26px; width:48%;
  border-radius:var(--radius); overflow:hidden;
  border:3px solid var(--bg);
  box-shadow:0 12px 40px rgba(17,17,17,.12);
}
.img-float img { width:100%; aspect-ratio:1.4; object-fit:cover }
.experience-tag {
  position:absolute; top:22px; right:-18px;
  background:var(--ink);
  color:var(--primary);
  padding:10px 18px;
  border-radius:var(--radius);
  border:1px solid var(--border-warm-strong);
  font-family:'Inter', sans-serif;
  font-size:.68rem; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase;
  box-shadow:0 10px 28px rgba(0,0,0,.25);
}
.mr-txt h2 { font-size:clamp(2.2rem,3.6vw,3.2rem); margin-bottom:18px }
.mr-txt p  { font-size:.95rem; margin-bottom:14px; line-height:1.72 }
.ticks { list-style:none; display:grid; gap:10px; margin:20px 0 28px }
.ticks li {
  display:flex; gap:11px; align-items:flex-start;
  font-weight:500; color:var(--text); font-size:.93rem;
}
.ticks li::before {
  content:'→';
  color:var(--primary); flex-shrink:0;
  font-family:'Inter', sans-serif;
  font-size:.78rem; margin-top:3px;
}
.ticks.two { grid-template-columns:1fr 1fr }
@media(max-width:900px) {
  .media-row,.why-block { grid-template-columns:1fr; gap:48px }
  .media-row.rev .mr-fig,.media-row.rev .mr-txt { order:unset }
  .img-float { right:-12px; bottom:-12px }
  .experience-tag { right:12px }
  .ticks.two { grid-template-columns:1fr }
}

/* ── SERVICE LIST ROWS (homepage) ────────────────────────── */
.svc-list { border-top:1px solid var(--border); margin-top:48px }
.svc-row {
  display:grid;
  grid-template-columns:64px 1fr auto 40px;
  gap:24px; align-items:center;
  padding:28px 0;
  border-bottom:1px solid var(--border);
  border-radius:0;
  text-decoration:none;
  color:inherit;
  transition:all .28s var(--ease-out);
  position:relative;
  overflow:hidden;
}
.svc-row::before {
  content:'';
  position:absolute; left:0; top:0; bottom:0; width:0;
  background:var(--primary); transition:width .3s var(--ease);
}
.svc-row:hover { padding-left:14px; background:rgba(253,190,14,.05) }
.svc-row:hover::before { width:3px }
.svc-num {
  font-family:'Inter', sans-serif;
  font-size:.72rem; font-weight:600; color:var(--primary-dark);
  letter-spacing:.12em;
}
.svc-main h3 { font-size:1.35rem; color:var(--text); margin-bottom:5px; font-weight:500 }
.svc-main p { font-size:.88rem; color:var(--text-muted); line-height:1.6 }
.svc-chips { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end }
.svc-chips span {
  font-family:'Inter', sans-serif;
  font-size:.62rem; font-weight:600;
  color:var(--accent); background:var(--gold-tint);
  border:1px solid var(--border-warm-strong);
  border-radius:var(--radius-pill); padding:4px 10px;
  text-transform:uppercase; letter-spacing:.08em;
}
.svc-arr {
  color:var(--text-muted); font-size:1.2rem;
  transition:transform .28s var(--ease), color .28s;
  display:flex; align-items:center; justify-content:center;
}
.svc-row:hover .svc-arr { color:var(--primary-dark); transform:translateX(4px) }
@media(max-width:780px) {
  .svc-row { grid-template-columns:40px 1fr 24px; gap:16px }
  .svc-chips { display:none }
}
@media(max-width:480px) {
  .svc-row { grid-template-columns:36px 1fr 20px; gap:12px }
  .svc-main p { display:none }
}

/* ── SERVICE CARDS (about/services pages) ────────────────── */
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--border); border:1px solid var(--border-warm-strong); border-radius:var(--radius-lg); overflow:hidden; margin-top:56px;
  box-shadow:var(--glass-shadow) }
.svc-card {
  background:var(--bg); overflow:hidden;
  transition:background .3s; display:flex; flex-direction:column;
}
.svc-card:hover { background:var(--surface) }
.svc-img { position:relative; aspect-ratio:16/10; overflow:hidden }
.svc-img img { width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease) }
.svc-card:hover .svc-img img { transform:scale(1.05) }
.svc-icon-tag {
  position:absolute; left:18px; bottom:-20px;
  width:48px; height:48px; border-radius:var(--radius);
  background:var(--ink); color:var(--primary);
  border:1px solid var(--border-warm-strong);
  display:flex; align-items:center; justify-content:center;
  font-family:'Inter', sans-serif; font-size:.75rem; font-weight:600;
}
.svc-body { padding:40px 24px 28px; flex:1; display:flex; flex-direction:column }
.svc-body h3 { font-size:1.2rem; margin-bottom:8px; font-weight:500 }
.svc-body p  { font-size:.88rem; flex:1; color:var(--text-muted) }
@media(max-width:860px) { .svc-grid { grid-template-columns:repeat(2,1fr) } }
@media(max-width:560px) { .svc-grid { grid-template-columns:1fr } }

/* ── WHY FEATS ───────────────────────────────────────────── */
.why-feats { display:grid; gap:20px; margin-top:32px }
.why-feat { display:flex; gap:16px; align-items:flex-start;
  padding:20px;
  background:var(--glass);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border-warm); border-radius:var(--radius-lg);
  box-shadow:var(--glass-shadow);
  transition:border-color .3s, background .3s;
}
.why-feat:hover { border-color:var(--border-warm-strong); background:var(--glass-elev) }
.wf-num {
  font-family:'Inter', sans-serif;
  font-size:.72rem; font-weight:600; color:var(--primary-dark);
  letter-spacing:.1em; flex-shrink:0; margin-top:2px;
  width:30px;
}
.why-feat h4 { font-size:1rem; margin-bottom:4px; font-weight:600 }
.why-feat p  { font-size:.88rem; color:var(--text-muted); line-height:1.6 }
/* two-column variant (industries: cargo preparation methods) */
.why-feats.cols-2 { grid-template-columns:1fr 1fr; margin-top:48px }
@media(max-width:760px) { .why-feats.cols-2 { grid-template-columns:1fr } }

/* ── DOCUMENTATION CARDS (industries) ────────────────────── */
.doc-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:48px }
.doc-card {
  background:var(--glass);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border-warm);
  border-radius:var(--radius-lg);
  padding:36px 32px;
  box-shadow:var(--glass-shadow);
  transition:border-color .3s, background .3s;
}
.doc-card:hover { background:var(--glass-elev); border-color:var(--border-warm-strong) }
.doc-card h3 { font-size:1.35rem; margin:16px 0 6px; font-weight:600 }
.doc-card .ticks { margin-bottom:0 }
@media(max-width:760px) { .doc-grid { grid-template-columns:1fr } }

/* ── PROCESS (intro + vertical timeline) ─────────────────── */
.proc-block {
  display:grid; grid-template-columns:.85fr 1.15fr;
  gap:72px; align-items:start;
}
.proc-intro { position:sticky; top:130px }
.proc-kicker {
  display:inline-block;
  font-size:.68rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  background:var(--gold-tint);
  border:1px solid var(--border-warm-strong);
  border-radius:var(--radius-pill);
  padding:6px 14px; margin-bottom:18px;
}
.proc-intro h2 { font-size:clamp(2.2rem,3.6vw,3.2rem); margin-bottom:16px }
.proc-intro p  { font-size:.95rem; color:var(--text-muted); line-height:1.72; max-width:420px }
.proc-timeline { position:relative; display:grid; gap:14px }
/* gold connector line running behind the step numbers */
.proc-timeline::before {
  content:'';
  position:absolute; left:43px; top:28px; bottom:28px; width:2px;
  background:linear-gradient(to bottom,
    var(--primary) 0%,
    rgba(253,190,14,.35) 60%,
    rgba(253,190,14,.12) 100%);
  border-radius:2px;
}
.proc-item {
  position:relative;
  display:flex; gap:20px; align-items:flex-start;
  padding:22px 24px;
  background:var(--glass);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--border-warm);
  border-radius:var(--radius-lg);
  box-shadow:var(--glass-shadow);
  transition:all .35s var(--ease-out);
}
.proc-item:hover {
  background:var(--glass-elev);
  border-color:var(--border-warm-strong);
  transform:translateX(6px);
  box-shadow:var(--glass-shadow-elev);
}
.pi-num {
  width:40px; height:40px; border-radius:50%;
  background:var(--ink); color:var(--primary);
  border:1px solid var(--border-warm-strong);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  font-size:.72rem; font-weight:600; letter-spacing:.06em;
  transition:box-shadow .35s var(--ease-out);
}
.proc-item:hover .pi-num { box-shadow:0 0 20px rgba(253,190,14,.35) }
.pi-body h4 { font-size:1rem; margin-bottom:5px; color:var(--text); font-weight:600 }
.pi-body p  { font-size:.87rem; color:var(--text-muted); line-height:1.6 }
@media(max-width:900px) {
  .proc-block { grid-template-columns:1fr; gap:40px }
  .proc-intro { position:static }
}
@media(max-width:480px) {
  .proc-item { padding:18px 16px; gap:14px }
  .proc-timeline::before { left:35px }
  .pi-num { width:36px; height:36px }
}

/* ── INDUSTRIES GRID (image tiles) ──────────────────────── */
.ind-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--border); border-radius:var(--radius-lg); overflow:hidden; margin-top:48px;
  box-shadow:var(--glass-shadow) }
.ind-tile {
  position:relative; aspect-ratio:3/3.6; overflow:hidden; cursor:default;
}
.ind-tile img { width:100%; height:100%; object-fit:cover;
  transition:transform .8s var(--ease) }
.ind-tile:hover img { transform:scale(1.08) }
.ind-tile::after {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(to top,
    rgba(0,0,0,.95) 0%, rgba(0,0,0,.55) 45%, transparent 75%);
  transition:background .4s;
}
.ind-tile:hover::after {
  background:linear-gradient(to top,
    rgba(0,0,0,.98) 0%, rgba(0,0,0,.7) 45%,
    rgba(253,190,14,.15) 80%);
}
.ind-content {
  position:absolute; left:18px; right:18px; bottom:20px; z-index:1;
}
.ind-content h4 { color:#fff; font-size:1.06rem; font-weight:600; margin-bottom:4px }
.ind-content p  { font-size:.82rem; color:rgba(255,255,255,.78); line-height:1.5 }
.ind-tag {
  position:absolute; top:14px; left:14px; z-index:1;
  background:rgba(0,0,0,.85); color:var(--primary);
  backdrop-filter:blur(8px);
  border:1px solid var(--border-warm-strong);
  font-family:'Inter', sans-serif;
  font-size:.62rem; font-weight:600; letter-spacing:.1em;
  padding:4px 9px; border-radius:var(--radius);
}
@media(max-width:1000px) { .ind-grid { grid-template-columns:repeat(3,1fr) } }
@media(max-width:700px)  { .ind-grid { grid-template-columns:repeat(2,1fr) } }
@media(max-width:460px)  { .ind-grid { grid-template-columns:1fr } .ind-tile { aspect-ratio:16/9 } }

/* ── INDUSTRY CARDS (industries page) ───────────────────── */
.ind-detail {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:var(--border);
  border:1px solid var(--border-warm-strong); border-radius:var(--radius-lg);
  overflow:hidden; margin-top:48px;
  box-shadow:var(--glass-shadow);
}
.ind-card { background:var(--bg); overflow:hidden; transition:background .3s }
.ind-card:hover { background:var(--surface) }
.ind-card .ic-img { aspect-ratio:16/10; overflow:hidden }
.ind-card .ic-img img { width:100%; height:100%; object-fit:cover;
  transition:transform .8s var(--ease) }
.ind-card:hover .ic-img img { transform:scale(1.05) }
.ind-card .ic-body { padding:24px; border-top:2px solid transparent; transition:border-color .3s }
.ind-card:hover .ic-body { border-top-color:var(--primary) }
.ic-icon {
  font-family:'Inter', sans-serif;
  font-size:.72rem; font-weight:600; letter-spacing:.1em;
  color:var(--accent); display:inline-block;
  margin-bottom:10px; text-transform:uppercase;
}
.ind-card h3 { font-size:1.22rem; margin-bottom:7px; font-weight:500 }
.ind-card p  { font-size:.87rem; color:var(--text-muted); line-height:1.62 }
@media(max-width:860px) { .ind-detail { grid-template-columns:repeat(2,1fr) } }
@media(max-width:540px) { .ind-detail { grid-template-columns:1fr } }

/* ── CTA BAND ────────────────────────────────────────────── */
.cta-band {
  position:relative; isolation:isolate; overflow:hidden;
  padding:50px 0;
}
.cta-band .band-bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:-2; opacity:.14;
}
.cta-band::before {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.94) 0%, rgba(250,247,239,.95) 60%);
  z-index:-1;
}
/* gold glow on cta */
.cta-band::after {
  content:'';
  position:absolute; top:-30%; right:10%;
  width:600px; height:600px;
  background:radial-gradient(ellipse, rgba(253,190,14,.18) 0%, rgba(253,190,14,.08) 40%, transparent 65%);
  z-index:-1; pointer-events:none;
}
.cta-band h2 { color:var(--text); font-size:clamp(2rem,4.2vw,3.6rem); margin-bottom:16px; max-width:640px }
.cta-band p  { color:var(--text-muted); font-size:.96rem; max-width:480px; margin:0 0 34px; line-height:1.72 }
.cta-band .btns { display:flex; gap:12px; flex-wrap:wrap }

/* ── PAGE BANNER ─────────────────────────────────────────── */
.pg-banner {
  position:relative; isolation:isolate;
  padding:110px 0 80px; background:var(--bg); overflow:hidden;
}
.pg-banner .pb-bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:-2; opacity:.2;
}
.pg-banner::before {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(110deg, rgba(255,255,255,.95), rgba(247,241,223,.9));
  z-index:-1;
}
/* gold glow on page banner */
.pg-banner::after {
  content:'';
  position:absolute; top:-20%; right:15%; width:700px; height:700px;
  background:radial-gradient(ellipse, rgba(253,190,14,.18) 0%, rgba(253,190,14,.08) 40%, transparent 65%);
  z-index:0; pointer-events:none;
}
.pg-banner > .wrap { position:relative; z-index:1 }
.pg-banner h1 {
  color:var(--text); font-size:clamp(2.6rem,5.5vw,4.2rem);
  font-weight:700; letter-spacing:-.04em; margin-bottom:14px;
}
.crumbs {
  display:flex; align-items:center; gap:8px;
  font-family:'Inter', sans-serif;
  font-size:.65rem; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:rgba(17,17,17,.45);
  margin-bottom:22px;
}
.crumbs a:hover { color:var(--primary-dark) }
.crumbs .sep { color:var(--primary) }
.pg-banner p.pb-sub {
  color:var(--text-muted); font-size:.95rem;
  max-width:520px; margin-top:8px; line-height:1.72;
}

/* ── SERVICE DETAIL ROW (services page) ─────────────────── */
.sd-row {
  display:grid; grid-template-columns:1fr 1fr;
  gap:64px; align-items:center; padding:64px 0;
  border-bottom:1px solid var(--border);
}
.sd-row:last-child { border-bottom:0 }
.sd-row.rev .sd-text { order:2 }
.sd-row.rev .sd-fig  { order:1 }
.sd-fig .imgw { border-radius:var(--radius); overflow:hidden }
.sd-fig .imgw img {
  width:100%; aspect-ratio:3/2.2; object-fit:cover;
  transition:transform .8s var(--ease);
}
.sd-fig .imgw:hover img { transform:scale(1.03) }
.sd-text .sd-icon {
  font-family:'Inter', sans-serif;
  font-size:.72rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  background:var(--gold-tint);
  border:1px solid var(--border-warm-strong);
  display:inline-block; padding:6px 12px;
  border-radius:var(--radius); margin-bottom:18px;
}
.sd-text h3 { font-size:clamp(1.8rem,3vw,2.6rem); margin-bottom:14px; font-weight:500 }
.sd-text p  { font-size:.9rem; line-height:1.72; color:var(--text-muted) }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px }
.chip {
  font-family:'Inter', sans-serif;
  font-size:.65rem; font-weight:600;
  color:var(--accent); background:var(--gold-tint);
  border:1px solid var(--border-warm-strong);
  border-radius:var(--radius-pill); padding:5px 12px;
  text-transform:uppercase; letter-spacing:.08em;
}
@media(max-width:900px) { .sd-row { grid-template-columns:1fr; gap:32px; padding:48px 0 }
  .sd-row.rev .sd-text,.sd-row.rev .sd-fig { order:unset } }

/* ── CONTACT ─────────────────────────────────────────────── */
.contact-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:start }
.ci-item {
  display:flex; gap:14px; align-items:flex-start;
  padding:18px 0; border-bottom:1px solid var(--border);
}
.ci-item:last-child { border-bottom:0 }
.cii {
  width:44px; height:44px; border-radius:var(--radius);
  background:var(--surface); border:1px solid var(--border-warm);
  color:var(--primary); display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  font-family:'Inter', sans-serif;
  font-size:.68rem; font-weight:600; letter-spacing:.06em;
}
.ci-item .cil {
  font-family:'Inter', sans-serif;
  font-size:.65rem; color:var(--text-muted); text-transform:uppercase;
  letter-spacing:.12em; font-weight:600; margin-bottom:3px;
}
.ci-item .civ { font-weight:600; color:var(--text); font-size:.93rem; line-height:1.45 }
.ci-item a.civ:hover { color:var(--primary) }
.cmap {
  border-radius:var(--radius); overflow:hidden;
  border:1px solid var(--border); height:220px; margin-top:28px;
  filter:saturate(.55) contrast(.97);
}
.cmap iframe { width:100%; height:100%; border:0 }
.cform {
  background:var(--glass-elev);
  backdrop-filter:blur(40px);
  -webkit-backdrop-filter:blur(40px);
  border:1px solid var(--border-warm-strong);
  border-radius:var(--radius-lg); padding:40px 36px;
  box-shadow:var(--glass-shadow-elev);
}
.cform h3 {
  font-family:'Inter', sans-serif; font-weight:500;
  font-size:2rem; color:var(--text); margin-bottom:4px;
}
.cform .fsub { font-size:.87rem; margin-bottom:24px; color:var(--text-muted) }
.field { margin-bottom:14px }
.field label {
  display:block;
  font-family:'Inter', sans-serif;
  font-size:.65rem; font-weight:600; color:rgba(17,17,17,.65);
  margin-bottom:5px; text-transform:uppercase; letter-spacing:.1em;
}
.field input,.field textarea,.field select {
  width:100%; padding:12px 20px;
  border:1px solid var(--border);
  font-family:'Inter', sans-serif;
  font-size:.9rem; color:var(--text);
  background:var(--glass-input);
  transition:all .25s;
  border-radius:var(--radius-xl);
}
.field input::placeholder,.field textarea::placeholder { color:rgba(17,17,17,.35) }
.field input:focus,.field textarea:focus,.field select:focus {
  outline:0; border-color:var(--primary); background:#fff;
  box-shadow:0 0 0 3px rgba(253,190,14,.18);
}
.field select option { background:#fff; color:#111 }
.field textarea { resize:vertical; min-height:120px; border-radius:var(--radius-lg) }
.frow { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.cform .note {
  font-family:'Inter', sans-serif;
  font-size:.65rem; color:rgba(17,17,17,.55);
  margin-top:12px; text-align:center; letter-spacing:.04em;
}
.cform button { width:100%; justify-content:center; margin-top:4px }
.cform button:disabled { opacity:.6; cursor:not-allowed; transform:none }
.form-status {
  font-family:'Inter', sans-serif;
  font-size:.8rem; text-align:center;
  margin-top:14px; min-height:1em;
}
.form-status.success { color:#1a7d3a }
.form-status.error { color:#c0392b }
@media(max-width:900px) { .contact-grid { grid-template-columns:1fr; gap:40px } }
@media(max-width:440px) { .frow { grid-template-columns:1fr } }

/* ── FOOTER ───────────────────────────────────────────────── */
footer { background:var(--surface); border-top:1px solid var(--border); position:relative }
.foot-top { padding:72px 0 52px; border-bottom:1px solid var(--border) }
.foot-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:48px }
.fc-brand .foot-logo {
  height:72px; width:auto; max-width:180px;
  object-fit:contain; margin-bottom:18px; display:block;
  filter:brightness(1.1);
}
.fc-brand .fn {
  font-family:'Inter', sans-serif;
  font-size:.65rem; font-weight:600;
  color:rgba(17,17,17,.55);
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:10px;
}
.fc-brand p { font-size:.85rem; color:rgba(17,17,17,.65); line-height:1.72; margin-bottom:22px }
.foot-socials { display:flex; gap:6px }
.foot-socials a {
  width:34px; height:34px; border-radius:var(--radius);
  background:transparent; border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  color:rgba(17,17,17,.55); transition:all .25s;
}
.foot-socials a:hover { background:var(--primary); border-color:var(--primary); color:#111111 }
.foot-socials svg { width:13px; height:13px }
.fc h4 {
  font-family:'Inter', sans-serif;
  font-size:.8rem; font-weight:600; color:rgba(17,17,17,.95);
  margin-bottom:18px; text-transform:uppercase; letter-spacing:.18em;
}
.fc ul { display:grid; gap:10px }
.fc ul a { font-size:.88rem; color:rgba(17,17,17,.55); transition:all .25s; display:inline-block }
.fc ul a:hover { color:var(--primary); padding-left:6px }
.fc-contact li {
  display:flex; gap:10px; align-items:flex-start;
  font-size:.88rem; color:rgba(17,17,17,.55); margin-bottom:12px; line-height:1.5;
}
.fc-contact .fc-ic { width:6px; height:6px; background:var(--primary); flex-shrink:0; margin-top:8px; border-radius:50% }
.fc-contact a:hover { color:var(--primary) }
.foot-bar { padding:18px 0; display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap }
.foot-bar p { font-family:'Inter', sans-serif; font-size:.65rem; color:rgba(17,17,17,.55); letter-spacing:.06em }
.foot-bar .fl { display:flex; gap:18px }
.foot-bar .fl a { font-family:'Inter', sans-serif; font-size:.65rem; color:rgba(17,17,17,.55) }
.foot-bar .fl a:hover { color:var(--primary) }
@media(max-width:900px) { .foot-grid { grid-template-columns:1fr 1fr; gap:32px } }
@media(max-width:480px) { .foot-grid { grid-template-columns:1fr } .foot-bar { flex-direction:column; text-align:center } }

/* ── REVEAL ───────────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(14px); transition:opacity .7s var(--ease), transform .7s var(--ease) }
.reveal.in { opacity:1; transform:none }
.reveal.d1 { transition-delay:.08s }
.reveal.d2 { transition-delay:.16s }
.reveal.d3 { transition-delay:.24s }
.reveal.d4 { transition-delay:.32s }
.reveal.d5 { transition-delay:.40s }
@media(prefers-reduced-motion:reduce) { .reveal { opacity:1; transform:none; transition:none } }

/* ── IMAGE FALLBACK ──────────────────────────────────────── */
img.ph { width:100%; height:100%; object-fit:cover; display:block }
img.img-failed { opacity:0 }

/* ── TESTIMONIALS ────────────────────────────────────────── */
.testi-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:var(--border);
  border:1px solid var(--border-warm-strong); border-radius:var(--radius-lg);
  overflow:hidden; margin-top:48px;
  box-shadow:var(--glass-shadow);
}
.testi-card {
  background:var(--bg); padding:36px 28px;
  display:flex; flex-direction:column; gap:24px;
  transition:background .3s;
}
.testi-card:hover { background:var(--surface) }
.testi-text {
  font-size:.93rem; line-height:1.78; color:var(--text-muted);
  flex:1; font-style:italic;
  position:relative; padding-top:20px;
}
.testi-text::before {
  content:'\201C';
  position:absolute; top:-4px; left:0;
  font-size:3rem; line-height:1; color:var(--primary);
  font-family:'Inter', sans-serif; font-style:normal;
}
.testi-author { display:flex; align-items:center; gap:14px }
.testi-avatar {
  width:46px; height:46px; border-radius:50%;
  background:var(--ink); color:var(--primary);
  border:1px solid var(--border-warm-strong);
  display:flex; align-items:center; justify-content:center;
  font-family:'Inter', sans-serif;
  font-size:.7rem; font-weight:600; flex-shrink:0;
  letter-spacing:.06em;
}
.testi-info .name { font-weight:600; color:var(--text); font-size:.9rem; margin-bottom:2px }
.testi-info .role {
  font-family:'Inter', sans-serif;
  font-size:.62rem; color:var(--text-muted);
  letter-spacing:.08em; text-transform:uppercase;
}
@media(max-width:860px) { .testi-grid { grid-template-columns:1fr 1fr } }
@media(max-width:540px) { .testi-grid { grid-template-columns:1fr } }

/* ── LEGAL PAGES ──────────────────────────────────────────── */
.legal-wrap { max-width:840px; margin:0 auto }
.legal-updated {
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Inter', sans-serif; font-size:.65rem; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; color:var(--accent);
  background:var(--surface); border:1px solid var(--border-warm);
  border-radius:var(--radius-pill); padding:8px 16px; margin-bottom:36px;
}
.legal-intro { font-size:.95rem; line-height:1.8; margin-bottom:10px }
.legal-sec { padding:34px 0; border-bottom:1px solid var(--border) }
.legal-sec:last-of-type { border-bottom:0 }
.legal-sec h2 {
  display:flex; align-items:center; gap:16px;
  font-size:1.4rem; margin-bottom:16px;
}
.legal-sec h2 .num {
  flex-shrink:0; width:38px; height:38px; border-radius:50%;
  background:var(--ink); color:var(--primary);
  display:flex; align-items:center; justify-content:center;
  font-family:'Inter', sans-serif; font-size:.85rem; font-weight:700;
}
.legal-sec p { font-size:.92rem; line-height:1.8; color:var(--text-muted); margin-bottom:14px }
.legal-sec p:last-child { margin-bottom:0 }
.legal-sec ul { list-style:none; display:grid; gap:10px; margin:6px 0 18px; padding-left:54px }
.legal-sec ul:last-child { margin-bottom:0 }
.legal-sec ul li {
  position:relative; font-size:.92rem; line-height:1.7; color:var(--text-muted);
}
.legal-sec ul li::before {
  content:''; position:absolute; left:-18px; top:9px;
  width:6px; height:6px; border-radius:50%; background:var(--primary);
}
.legal-sec ul li strong { color:var(--text) }
.legal-contact { padding-left:54px }
.legal-contact .ci-item:first-child { padding-top:22px }
@media(max-width:640px) {
  .legal-sec ul, .legal-contact { padding-left:0 }
}

/* ── UTILITY ──────────────────────────────────────────────── */
.gap-top  { margin-top:28px }
.text-white  { color:#fff }
.text-center { text-align:center }
