@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Manrope:wght@600;700;800&display=swap');

:root{
  /* BRAND (replaceable) */
  --brand-primary: #c9a84c;
  --brand-secondary: #e8c96a;
  --brand-dark: #1a2744;
  --brand-light: #f5f0e8;

  /* System */
  --bg: #0b1222;
  --surface: rgba(255,255,255,.06);
  --surface-2: rgba(255,255,255,.10);
  --text: rgba(255,255,255,.88);
  --muted: rgba(255,255,255,.66);
  --darkText: #0f172a;
  --darkMuted: rgba(15,23,42,.68);
  --line: rgba(255,255,255,.12);
  --line-dark: rgba(15,23,42,.12);

  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;

  --shadow-1: 0 18px 50px rgba(0,0,0,.22);
  --shadow-2: 0 10px 30px rgba(0,0,0,.16);
  --shadow-soft: 0 18px 40px rgba(15,23,42,.12);

  --container: 1180px;
  --gutter: 18px;

  --ease: cubic-bezier(.2,.9,.2,1);
  --ease-2: cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background: radial-gradient(1100px 600px at 25% -5%, rgba(201,168,76,.20), rgba(201,168,76,0) 55%),
              radial-gradient(900px 520px at 80% 8%, rgba(232,201,106,.12), rgba(232,201,106,0) 55%),
              linear-gradient(180deg, #070b14, #0b1222 25%, #0b1222);
  overflow-x:hidden;
}
html, body{overscroll-behavior-y: none;}

/* Anchor only (no extra page height) */
#contact{
  display:block;
  height:0;
  margin:0;
  padding:0;
  overflow:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button, input, select, textarea{font:inherit}
::selection{background:rgba(201,168,76,.35)}

.container{
  width:min(var(--container), calc(100% - (var(--gutter) * 2)));
  margin-inline:auto;
}

/* Subtle geometric accents (CSS-only) */
.geo{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.9;
  overflow:hidden;
  mask-image: radial-gradient(500px 420px at 20% 10%, #000 30%, transparent 70%),
              radial-gradient(520px 420px at 80% 35%, #000 25%, transparent 70%),
              radial-gradient(600px 520px at 50% 95%, #000 20%, transparent 65%);
  mix-blend-mode: normal;
}
.geo::before, .geo::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,0) 55%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, rgba(255,255,255,0) 1px 22px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.045) 0 1px, rgba(255,255,255,0) 1px 22px);
  transform: rotate(-7deg);
  opacity:.55;
}
.geo::after{
  inset:-35%;
  background:
    radial-gradient(circle at 12% 22%, rgba(201,168,76,.22), transparent 45%),
    radial-gradient(circle at 78% 12%, rgba(232,201,106,.15), transparent 42%),
    radial-gradient(circle at 74% 62%, rgba(201,168,76,.12), transparent 50%),
    radial-gradient(circle at 20% 72%, rgba(255,255,255,.08), transparent 45%);
  transform: rotate(12deg);
  opacity:.9;
}

/* Typography */
.h0, h1, h2, h3{
  font-family:Manrope,Inter,system-ui,sans-serif;
  letter-spacing:-0.02em;
  margin:0;
}
.h0{
  font-size: clamp(40px, 6.2vw, 80px);
  line-height:1.02;
  font-weight:800;
}
h2{
  font-size: clamp(28px, 3.2vw, 46px);
  line-height:1.08;
  font-weight:800;
}
h3{
  font-size: clamp(18px, 2vw, 22px);
  line-height:1.2;
  font-weight:750;
}
.lead{
  font-size: clamp(16px, 1.45vw, 18px);
  line-height:1.65;
  color:var(--muted);
  margin:0;
}
.label{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.82);
  font-weight:600;
  font-size:13px;
  letter-spacing:.02em;
}
.label .dot{
  width:10px; height:10px; border-radius:10px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  box-shadow: 0 0 0 6px rgba(201,168,76,.12);
}

/* Buttons */
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 14px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor:pointer;
  user-select:none;
  transition: transform .25s var(--ease), filter .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease);
  white-space:nowrap;
  font-weight:700;
  letter-spacing:-.01em;
}
.btn:focus-visible{outline:3px solid rgba(232,201,106,.35); outline-offset:3px}
.btn:hover{transform: scale(1.03); filter: brightness(1.04)}
.btn:active{transform: scale(.99)}
.btn.primary{
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  color:#1a1f2b;
  box-shadow: 0 14px 40px rgba(201,168,76,.20);
}
.btn.outline{
  background: transparent;
  border-color: rgba(255,255,255,.20);
  color: rgba(255,255,255,.92);
}
.btn.ghost{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
}
.btn.sm{padding: 10px 14px; font-weight:800; font-size:13px}
.btn.pulse{
  animation: pulse 5s var(--ease) infinite;
}
@keyframes pulse{
  0%, 75%, 100%{box-shadow: 0 14px 40px rgba(201,168,76,.16)}
  82%{box-shadow: 0 18px 54px rgba(201,168,76,.28)}
  90%{box-shadow: 0 14px 40px rgba(201,168,76,.18)}
}

/* Navbar */
.nav-wrap{
  position:sticky;
  top:0;
  z-index:50;
  background: transparent;
  transition: background .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  border-bottom: 1px solid rgba(255,255,255,0);
  backdrop-filter: blur(0px);
}
.nav-wrap.scrolled{
  background: rgba(245,240,232,.92);
  border-bottom: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 12px 30px rgba(15,23,42,.10);
  backdrop-filter: none;
}
.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 14px 0;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width: 190px;
}
.logo-text{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 8px 12px;
  border-radius: 14px;
  font-family: Manrope,Inter,sans-serif;
  font-weight: 1000;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1;
  background: linear-gradient(180deg, rgba(232,201,106,.18), rgba(201,168,76,.10));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
  color: rgba(255,255,255,.96);
}
.nav-wrap.scrolled .logo-text{
  background: linear-gradient(180deg, rgba(201,168,76,.18), rgba(201,168,76,.10));
  border-color: rgba(15,23,42,.10);
  box-shadow: 0 10px 20px rgba(15,23,42,.10);
  color: rgba(15,23,42,.92);
}
.brand strong{
  font-family:Manrope,Inter,sans-serif;
  letter-spacing:-.03em;
  font-weight:800;
  font-size:14px;
  line-height:1.1;
}
.brand span{
  display:block;
  font-size:12px;
  color: rgba(255,255,255,.70);
  margin-top:2px;
  font-weight:600;
}
.nav-wrap.scrolled .brand strong{color: #0b1222}
.nav-wrap.scrolled .brand span{color: rgba(15,23,42,.64)}

.nav-links{
  display:none;
  gap:22px;
  align-items:center;
  justify-content:center;
  flex:1;
}
.nav-links a{
  font-weight:700;
  font-size:13px;
  letter-spacing:.01em;
  opacity:.88;
  position:relative;
  padding:10px 6px;
  transition: opacity .2s var(--ease);
}
.nav-links a::after{
  content:"";
  position:absolute;
  left:8px; right:8px; bottom:6px;
  height:2px;
  transform: scaleX(0);
  transform-origin:left;
  background: linear-gradient(90deg, var(--brand-secondary), var(--brand-primary));
  transition: transform .25s var(--ease);
  border-radius:10px;
}
.nav-links a:hover{opacity:1}
.nav-links a:hover::after{transform: scaleX(1)}
.nav-wrap.scrolled .nav-links a{color: rgba(15,23,42,.78)}
.nav-wrap.scrolled .nav-links a:hover{color: rgba(15,23,42,.92)}

.nav-right{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-end;
  min-width:190px;
}
.phone{
  display:none;
  font-weight:800;
  font-size:13px;
  letter-spacing:.02em;
  opacity:.9;
}
.nav-wrap.scrolled .phone{color: rgba(15,23,42,.80)}

.burger{
  width:44px; height:44px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform .2s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
}
.burger:hover{transform: translateY(-1px); background: rgba(255,255,255,.11)}
.nav-wrap.scrolled .burger{
  border-color: rgba(15,23,42,.12);
  background: rgba(15,23,42,.04);
}
.burger-lines{
  width:18px; height:12px;
  position:relative;
}
.burger-lines span{
  position:absolute;
  left:0; right:0;
  height:2px;
  border-radius: 20px;
  background: rgba(255,255,255,.92);
  transition: transform .25s var(--ease), top .25s var(--ease), opacity .25s var(--ease), background .25s var(--ease);
}
.burger-lines span:nth-child(1){top:0}
.burger-lines span:nth-child(2){top:5px; opacity:.9}
.burger-lines span:nth-child(3){top:10px}
.nav-wrap.scrolled .burger-lines span{background: rgba(15,23,42,.86)}
.burger[aria-expanded="true"] .burger-lines span:nth-child(1){top:5px; transform: rotate(45deg)}
.burger[aria-expanded="true"] .burger-lines span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] .burger-lines span:nth-child(3){top:5px; transform: rotate(-45deg)}

.drawer{
  display:grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s var(--ease);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.nav-wrap.scrolled .drawer{border-bottom-color: rgba(15,23,42,.10)}
.drawer-inner{
  overflow:hidden;
}
.drawer-content{
  padding: 0 0 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.drawer a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  font-weight:800;
  letter-spacing:.01em;
}
.nav-wrap.scrolled .drawer a{
  background: rgba(15,23,42,.03);
  border-color: rgba(15,23,42,.10);
  color: rgba(15,23,42,.86);
}
.drawer a:hover{transform: translateY(-1px)}
.drawer-open .drawer{grid-template-rows: 1fr;}

/* Sections */
section{position:relative}
.section{
  padding: clamp(70px, 7.5vw, 110px) 0;
}
.section.light{
  color: var(--darkText);
  background:
    radial-gradient(700px 380px at 20% 10%, rgba(201,168,76,.18), rgba(201,168,76,0) 60%),
    radial-gradient(800px 520px at 90% 30%, rgba(232,201,106,.12), rgba(232,201,106,0) 60%),
    linear-gradient(180deg, #ffffff, #fbfbfd 60%, #ffffff);
}
.section.dark{
  color: var(--text);
  background:
    radial-gradient(900px 520px at 65% 8%, rgba(201,168,76,.16), rgba(201,168,76,0) 55%),
    radial-gradient(900px 600px at 10% 40%, rgba(232,201,106,.08), rgba(232,201,106,0) 60%),
    linear-gradient(180deg, #0b1222, #0b1222);
}
.section.brand{
  background:
    radial-gradient(900px 520px at 15% 10%, rgba(255,255,255,.16), rgba(255,255,255,0) 55%),
    radial-gradient(900px 520px at 90% 35%, rgba(0,0,0,.12), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #16284d, var(--brand-dark));
  color: rgba(255,255,255,.92);
}

/* Reveal animation */
.reveal{
  opacity:0;
  transform: translateY(22px);
  transition: opacity .7s var(--ease-2), transform .7s var(--ease-2);
  will-change: transform, opacity;
}
.reveal.in{
  opacity:1;
  transform: translateY(0);
}

/* HERO */
.hero{
  min-height: calc(100svh - 74px);
  padding: clamp(34px, 5vw, 72px) 0 clamp(44px, 5vw, 76px);
  display:flex;
  align-items:center;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 34px;
  align-items:center;
  position:relative;
}
.hero-left .h0{
  margin-top:16px;
  color: rgba(255,255,255,.95);
}
.hero-left .lead{
  margin-top: 16px;
  max-width: 58ch;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top: 22px;
}
.trust{
  display:flex;
  flex-wrap:wrap;
  gap: 10px 16px;
  margin-top: 18px;
  color: rgba(255,255,255,.80);
  font-weight:700;
  font-size:13px;
  letter-spacing:.01em;
}
.trust .pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
}
.trust .pill i{
  width:8px; height:8px;
  border-radius:10px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  display:inline-block;
  box-shadow: 0 0 0 6px rgba(201,168,76,.12);
}

.hero-right{
  position:relative;
  height: 360px;
  border-radius: var(--radius-lg);
  overflow:hidden;
  background: transparent;
  border: 0;
  box-shadow: none;
  isolation:isolate;
}
.hero-mark{
  position:absolute;
  inset: 0;
  padding: 18% 8%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-family: Manrope,Inter,sans-serif;
  font-weight: 1000;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: clamp(32px, 5.2vw, 60px);
  line-height: 1.05;
  color: transparent;
  background: linear-gradient(180deg, rgba(232,201,106,.98), rgba(201,168,76,.92));
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow:
    0 18px 50px rgba(201,168,76,.18),
    0 26px 70px rgba(0,0,0,.22);
  filter: drop-shadow(0 18px 44px rgba(201,168,76,.12));
  user-select:none;
}
.hero-mark::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,.10), transparent 56%),
    radial-gradient(circle at 70% 70%, rgba(201,168,76,.10), transparent 62%);
  z-index:-1;
}
.hero-right .floating{
  position:absolute;
  inset:0;
  opacity:.75;
}
.floating::before, .floating::after{
  content:"";
  position:absolute;
  width: 180px;
  height: 180px;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.05);
  transform: rotate(18deg);
  backdrop-filter: blur(10px);
}
.floating::before{top:22px; left:22px}
.floating::after{bottom:20px; right:18px; width: 220px; height: 150px; border-radius: 28px}

/* Who we are */
.split{
  display:grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items:start;
}
.section-number{
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  font-size: clamp(58px, 9vw, 116px);
  line-height:1;
  color: rgba(201,168,76,.65);
  letter-spacing:-.04em;
  margin: 0 0 10px;
}
.kicker{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  font-size:12px;
  color: rgba(15,23,42,.56);
  margin-bottom: 14px;
}
.kicker .line{
  height:1px;
  flex:1;
  background: linear-gradient(90deg, rgba(201,168,76,.55), rgba(201,168,76,0));
}
.light .lead{color: var(--darkMuted)}

.metrics{
  display:grid;
  gap: 14px;
}
.metric-card{
  padding: 18px 18px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: var(--shadow-soft);
  position:relative;
  overflow:hidden;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.metric-card::before{
  content:"";
  position:absolute;
  top:14px; bottom:14px; left:14px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  opacity: .95;
}
.metric-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 24px 60px rgba(15,23,42,.14);
  border-color: rgba(201,168,76,.25);
}
.metric-card .num{
  padding-left: 14px;
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  font-size: 36px;
  letter-spacing:-.03em;
  color: rgba(15,23,42,.92);
}
.metric-card .txt{
  padding-left: 14px;
  margin-top: 4px;
  color: rgba(15,23,42,.62);
  font-weight:700;
}

/* Services */
.section-head{
  display:flex;
  flex-direction:column;
  gap: 12px;
  margin-bottom: 26px;
}
.section-label{
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:12px;
  color: rgba(255,255,255,.72);
}
.dark .section-label{color: rgba(255,255,255,.70)}
.light .section-label{color: rgba(15,23,42,.58)}

.cards{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.service-card{
  padding: 18px 18px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 24px rgba(0,0,0,.16);
  position:relative;
  overflow:hidden;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease), background .28s var(--ease);
  min-height: 140px;
}
.service-card::after{
  content:"";
  position:absolute;
  inset: -2px;
  border-radius: calc(var(--radius-md) + 2px);
  border: 1px solid rgba(201,168,76,0);
  transition: border-color .28s var(--ease);
  pointer-events:none;
}
.service-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 24px 56px rgba(0,0,0,.24);
  background: rgba(255,255,255,.07);
}
.service-card:hover::after{border-color: rgba(201,168,76,.55)}
.service-top{
  display:flex;
  align-items:flex-start;
  gap: 14px;
}
.icon{
  width:44px; height:44px;
  border-radius: 14px;
  background: rgba(201,168,76,.14);
  border: 1px solid rgba(201,168,76,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 auto;
  color: var(--brand-secondary);
  box-shadow: 0 18px 30px rgba(201,168,76,.10);
}
.service-card p{
  margin:10px 0 0;
  color: rgba(255,255,255,.70);
  line-height:1.6;
}

/* Team */
.team-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
  margin-top: 22px;
}
.team-card{
  background: white;
  border-radius: var(--radius-md);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.team-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(15,23,42,.14);
  border-color: rgba(201,168,76,.35);
}
.team-photo{
  width: 100%;
  height: 220px;
  object-fit: contain;
  object-position: center top;
  background: rgba(15,23,42,.04);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.team-body{padding: 18px;}
.team-name{
  margin: 0;
  font-family: Manrope,Inter,sans-serif;
  font-weight: 900;
  color: rgba(15,23,42,.92);
  letter-spacing: -.02em;
}
.team-title{
  font-size: 13px;
  font-weight: 700;
  color: rgba(15,23,42,.62);
  margin-top: 4px;
}
.team-bio{
  color: rgba(15,23,42,.66);
  font-weight: 650;
  line-height: 1.6;
  margin-top: 8px;
}
.team-card .btn{margin-top: 14px; width: 100%;}

/* Vacancies */
.vacancy-card{
  padding: 0;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 24px rgba(0,0,0,.16);
  position:relative;
  overflow:hidden;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease), background .28s var(--ease);
  min-height: 0;
  display:flex;
  flex-direction:column;
  gap: 0;
}
.vacancy-card::after{
  content:"";
  position:absolute;
  inset: -2px;
  border-radius: calc(var(--radius-md) + 2px);
  border: 1px solid rgba(201,168,76,0);
  transition: border-color .28s var(--ease);
  pointer-events:none;
}
.vacancy-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 24px 56px rgba(0,0,0,.24);
  background: rgba(255,255,255,.07);
}
.vacancy-card:hover::after{border-color: rgba(201,168,76,.55)}
.vacancy-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
}
.vacancy-title{
  margin:0;
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  letter-spacing:-.02em;
  font-size: 18px;
  color: rgba(255,255,255,.92);
  line-height:1.2;
}
.vacancy-meta{
  display:grid;
  gap: 6px;
  color: rgba(255,255,255,.70);
  font-weight:700;
  line-height:1.45;
  margin-top: 2px;
}
.vacancy-meta span{
  display:flex;
  align-items:center;
  gap:10px;
}
.vacancy-meta i{
  width:8px; height:8px;
  border-radius:10px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  display:inline-block;
  box-shadow: 0 0 0 6px rgba(201,168,76,.12);
  flex:0 0 auto;
}
.vacancy-cta{
  margin-top:auto;
  display:flex;
  justify-content:flex-start;
  padding: 14px 18px 18px;
}

#vacancies .vacancy-card img{
  width: 100%;
  height: auto;
  max-height: 720px;
  object-fit: contain;
  background: rgba(0,0,0,.35);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}

#reviews [aria-label="Текстовые отзывы соискателей"] .review{
  padding: 0 !important;
}
#reviews [aria-label="Текстовые отзывы соискателей"] .review img{
  width: 100% !important;
  height: auto !important;
  max-height: 720px;
  object-fit: contain !important;
  background: rgba(0,0,0,.35) !important;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
  margin: 0 !important;
}
#reviews [aria-label="Текстовые отзывы соискателей"] .review p{
  margin: 0 !important;
}
#reviews [aria-label="Текстовые отзывы соискателей"] .review .review-body{
  padding: 18px 18px 0;
}
#reviews [aria-label="Текстовые отзывы соискателей"] .review .review-meta{
  padding: 12px 18px 16px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}

/* How we work */
.timeline{
  position:relative;
  margin-top: 22px;
}
.timeline-line{
  display:none;
  position:absolute;
  left: 40px;
  right: 40px;
  top: 42px;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(15,23,42,.22) 0 6px, rgba(15,23,42,0) 6px 14px);
}
.steps{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.step{
  padding: 18px 18px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 18px 46px rgba(15,23,42,.10);
  display:flex;
  gap: 14px;
  align-items:flex-start;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.step:hover{
  transform: translateY(-6px);
  box-shadow: 0 26px 66px rgba(15,23,42,.14);
  border-color: rgba(201,168,76,.24);
}
.step-num{
  width: 44px; height: 44px;
  border-radius: 16px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  color:#101827;
  flex:0 0 auto;
  box-shadow: 0 18px 40px rgba(201,168,76,.22);
}
.step .t{
  color: rgba(15,23,42,.92);
  font-weight:900;
  font-family:Manrope,Inter,sans-serif;
  letter-spacing:-.02em;
  font-size: 18px;
}
.step .d{
  margin-top: 6px;
  color: rgba(15,23,42,.66);
  line-height:1.6;
  font-weight:650;
}
.step-ico{
  width: 36px; height: 36px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-left:auto;
  color: rgba(15,23,42,.80);
}

/* Why us */
.why-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 18px;
}
.why-card{
  padding: 18px 18px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.0);
  box-shadow: 0 18px 44px rgba(0,0,0,.16);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
  display:flex;
  gap: 14px;
  align-items:flex-start;
}
.why-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 70px rgba(0,0,0,.20);
}
.why-icon{
  width:44px; height:44px;
  border-radius: 16px;
  background: rgba(201,168,76,.18);
  border: 1px solid rgba(201,168,76,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(15,23,42,.86);
  font-size: 18px;
  flex:0 0 auto;
}
.why-card .tt{
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  color: rgba(15,23,42,.92);
  letter-spacing:-.02em;
  margin:0;
  font-size: 18px;
}
.why-card .dd{
  margin-top: 6px;
  color: rgba(15,23,42,.64);
  font-weight:650;
  line-height:1.6;
}

/* Reviews carousel */
.carousel-wrap{
  margin-top: 18px;
}
.carousel{
  display:flex;
  gap: 14px;
  overflow:auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 10px;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}
.carousel::-webkit-scrollbar{height:10px}
.carousel::-webkit-scrollbar-thumb{
  background: rgba(15,23,42,.14);
  border-radius: 999px;
}
.review{
  min-width: min(420px, 88vw);
  scroll-snap-align: start;
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 20px 60px rgba(15,23,42,.10);
  padding: 18px 18px;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.review:hover{
  transform: translateY(-6px);
  box-shadow: 0 30px 86px rgba(15,23,42,.14);
}
.review-top{
  display:flex;
  gap: 12px;
  align-items:center;
}
.avatar{
  width:44px; height:44px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--brand-secondary), var(--brand-primary));
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:1000;
  font-family:Manrope,Inter,sans-serif;
  letter-spacing:-.02em;
  box-shadow: 0 14px 30px rgba(201,168,76,.20);
  flex:0 0 auto;
}
.review .name{
  font-weight:900;
  color: rgba(15,23,42,.92);
  letter-spacing:-.02em;
}
.review .role{
  color: rgba(15,23,42,.62);
  font-weight:700;
  font-size: 13px;
  margin-top: 2px;
}
.stars{
  margin-left:auto;
  color: rgba(201,168,76,.95);
  font-weight:900;
  letter-spacing:.04em;
  font-size: 13px;
  white-space:nowrap;
}
.review p{
  margin: 12px 0 0;
  color: rgba(15,23,42,.70);
  line-height:1.7;
  font-weight:650;
}
.dots{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  margin-top: 14px;
}
.dotbtn{
  width:8px; height:8px;
  border-radius:999px;
  border:0;
  background: rgba(15,23,42,.18);
  cursor:pointer;
  transition: width .25s var(--ease), background .25s var(--ease), transform .25s var(--ease);
}
.dotbtn[aria-current="true"]{
  width: 26px;
  background: linear-gradient(90deg, var(--brand-secondary), var(--brand-primary));
}

/* Split CTA */
.split-cta{
  padding: 0;
}
.split-cta-grid{
  display:grid;
  grid-template-columns: 1fr;
}
.half{
  padding: clamp(48px, 6vw, 86px) var(--gutter);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.half.brand{
  background:
    radial-gradient(800px 520px at 20% 10%, rgba(255,255,255,.16), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, rgba(232,201,106,.22), rgba(201,168,76,.0) 45%),
    linear-gradient(180deg, #d9b85f, var(--brand-primary));
  color:#151a25;
}
.half.dark{
  background:
    radial-gradient(900px 520px at 75% 10%, rgba(201,168,76,.18), rgba(201,168,76,0) 55%),
    linear-gradient(180deg, #0b1222, #081022);
  color: rgba(255,255,255,.92);
}
.half .content{
  width:min(var(--container), calc(100% - (var(--gutter) * 0)));
  margin-inline:auto;
  position:relative;
  z-index:2;
}
.half h2{margin:0}
.bullets{
  margin: 14px 0 22px;
  padding: 0;
  list-style:none;
  display:grid;
  gap: 10px;
}
.bullets li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-weight:750;
  line-height:1.55;
  opacity:.92;
}
.bullets li i{
  width: 20px; height: 20px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  margin-top: 2px;
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.22);
}
.half.brand .bullets li i{background: rgba(26,39,68,.10); border-color: rgba(26,39,68,.10)}
.split-divider{
  display:none;
  position:absolute;
  top:0; bottom:0;
  left:50%;
  width: 3px;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
  transform: translateX(-50%);
  z-index:3;
}

/* Contact */
.contact-grid{
  display:grid;
  gap: 18px;
  margin-top: 18px;
}
.form{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 16px;
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}
.field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.field label{
  font-weight:800;
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color: rgba(255,255,255,.70);
}
.control{
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
  padding: 0 14px;
  transition: border-color .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease);
  outline:none;
}
select.control{padding-right: 42px}
.control:focus{
  border-color: rgba(201,168,76,.70);
  box-shadow: 0 0 0 4px rgba(201,168,76,.18);
  background: rgba(255,255,255,.08);
}
.control.invalid{
  border-color: rgba(239,68,68,.90);
  box-shadow: 0 0 0 4px rgba(239,68,68,.16);
}
.confirm{
  display:none;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(16,185,129,.12);
  border: 1px solid rgba(16,185,129,.22);
  color: rgba(255,255,255,.88);
  font-weight:750;
}
.confirm.show{display:flex}
.confirm i{
  width: 22px; height: 22px;
  border-radius: 999px;
  background: rgba(16,185,129,.22);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}

.contacts{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 16px;
}
.contact-card{
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  padding: 14px 14px;
  display:flex;
  align-items:center;
  gap: 12px;
  transition: transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
}
.contact-card:hover{transform: translateY(-4px); background: rgba(255,255,255,.06); border-color: rgba(201,168,76,.28)}
.contact-ico{
  width:42px; height:42px;
  border-radius: 16px;
  background: rgba(201,168,76,.14);
  border: 1px solid rgba(201,168,76,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.92);
  flex:0 0 auto;
}
.contact-card strong{display:block; font-weight:900; letter-spacing:-.01em}
.contact-card span{display:block; margin-top:2px; color: rgba(255,255,255,.66); font-weight:650; font-size:13px}

/* Footer */
footer{
  background: linear-gradient(180deg, #081022, #060b16);
  color: rgba(255,255,255,.86);
  border-top: 1px solid rgba(255,255,255,.10);
}
.footer-top{
  padding: 44px 0 18px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 22px;
}
.footer-brand{
  display:flex;
  gap: 12px;
  align-items:flex-start;
}
.footer-brand .logo-text{
  margin-top: 2px;
  padding: 9px 13px;
  border-color: rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(232,201,106,.14), rgba(201,168,76,.08));
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
  color: rgba(255,255,255,.94);
}
.footer-brand strong{
  font-family:Manrope,Inter,sans-serif;
  font-weight:900;
  letter-spacing:-.03em;
}
.footer-brand p{
  margin: 8px 0 0;
  color: rgba(255,255,255,.64);
  line-height:1.6;
  font-weight:650;
  max-width: 44ch;
}
.footer-cols{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.foot-col{
  border-radius: var(--radius-md);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  padding: 14px 14px;
}
.foot-col h4{
  margin:0 0 10px;
  font-weight:900;
  font-family:Manrope,Inter,sans-serif;
  letter-spacing:-.02em;
}
.foot-col a{
  display:block;
  padding: 8px 0;
  color: rgba(255,255,255,.70);
  font-weight:700;
  transition: color .2s var(--ease), transform .2s var(--ease);
}
.foot-col a:hover{color: rgba(255,255,255,.92); transform: translateX(2px)}

.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.10);
  padding: 16px 0;
  display:flex;
  flex-direction:column;
  gap: 12px;
  align-items:flex-start;
  justify-content:space-between;
}
.footer-bottom small{
  color: rgba(255,255,255,.62);
  font-weight:650;
}
.social{
  display:flex;
  gap: 10px;
  align-items:center;
}
.social a{
  width: 40px; height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.05);
  display:flex;
  align-items:center;
  justify-content:center;
  transition: transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
}
.social a:hover{transform: translateY(-3px); background: rgba(255,255,255,.08); border-color: rgba(201,168,76,.30)}
.social svg{width:18px; height:18px; fill: rgba(255,255,255,.90)}

/* Responsive */
@media (min-width: 820px){
  .nav-links{display:flex;}
  .phone{display:inline-flex;}
  .burger{display:none;}
  .drawer{display:none;}
  .hero-grid{grid-template-columns: 1.35fr .9fr; gap: 34px;}
  .hero-right{height: 520px;}
  .split{grid-template-columns: 1.1fr .9fr; gap: 34px;}
  .cards{grid-template-columns: repeat(2, 1fr); gap: 16px;}
  .steps{grid-template-columns: repeat(4, 1fr); gap: 16px;}
  .step{flex-direction:column; min-height: 220px;}
  .step-ico{margin-left:0; margin-top: 14px;}
  .timeline-line{display:block;}
  .why-grid{grid-template-columns: repeat(2, 1fr); gap: 16px;}
  .form{grid-template-columns: 1fr 1fr 1fr auto; align-items:end;}
  .form .btn{height:48px;}
  .contacts{grid-template-columns: repeat(3, 1fr);}
  .footer-top{grid-template-columns: 1.2fr .8fr; align-items:start;}
  .footer-cols{grid-template-columns: repeat(3, 1fr);}
  .footer-bottom{flex-direction:row; align-items:center;}
  .split-cta-grid{grid-template-columns: 1fr 1fr;}
  .split-divider{display:block;}
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important}
  .reveal{transition:none !important}
  .btn, .service-card, .metric-card, .step, .why-card, .review, .contact-card, .social a{transition:none !important}
  .btn.pulse{animation:none !important}
}