/* Форд Трак Центр — Север */
:root{
  --ink:#16181d; --dark:#0e1116; --gray:#797474; --dark-surface:#171b22;
  --accent:#ee7203; --accent-hover:#c95d00; --accent-light:#ff9838;
  --muted:#55606f; --muted2:#8a93a0; --surface:#f5f6f8; --card:#eef0f3;
  --border:#e6e8ec; --input-border:#d9dde3; --nav:#e7e9ee; --footer:#e7e9ee;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover)}
img{max-width:100%;display:block}
h1,h2,h3{margin:0;font-family:Oswald,sans-serif;text-transform:uppercase;line-height:1.05}
p{margin:0}
.container{max-width:1580px;margin:0 auto;padding:0 31px}
.overline{font-family:Oswald,sans-serif;font-size:16px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}
.section{padding:100px 0}
.section h2{font-size:48px;font-weight:700;color:var(--ink);margin:13px 0 10px}
.section .lead{font-size:22px;color:var(--muted);max-width:815px;margin:0 0 46px}

/* buttons */
.btn{display:inline-block;font-weight:600;font-size:21px;padding:19px 38px;border-radius:8px;cursor:pointer;border:none;font-family:Manrope,sans-serif}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover);color:#fff}
.btn-ghost{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff}
.btn-ghost:hover{color:#fff;background:rgba(255,255,255,.18)}
.btn-outline{background:#fff;border:1px solid var(--input-border);color:var(--ink)}
.btn-outline:hover{color:var(--ink);border-color:var(--accent)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:var(--gray);border-bottom:1px solid rgba(255,255,255,.12)}
.site-header .container{display:flex;align-items:center;gap:36px;padding-top:14px;padding-bottom:14px}
.logo{display:flex;align-items:center;gap:14px;color:#fff}
.logo:hover{color:#fff}
.logo img{width:58px;height:auto;flex:none}
.logo .brand{line-height:1.05}
.logo .brand b{display:block;font-family:Oswald;font-weight:700;font-size:21px;letter-spacing:.02em;text-transform:uppercase}
.logo .brand span{display:block;font-family:Oswald;font-weight:600;font-size:16px;letter-spacing:.34em;color:#fff;text-transform:uppercase}
.nav{display:flex;gap:32px;margin-left:auto;font-size:19px;font-weight:500}
.nav a{color:var(--nav)}
.nav a:hover,.nav a.active{color:#fff}
.hphones{display:flex;flex-direction:column;align-items:flex-end;gap:2px;padding-left:16px;border-left:1px solid rgba(255,255,255,.18)}
.hphones a{color:#fff;font-family:Oswald;font-weight:600;font-size:19px}
.hphones a:hover{color:#fff}
.burger{display:none;background:none;border:none;cursor:pointer;margin-left:auto;padding:8px}
.burger span{display:block;width:28px;height:2px;background:#fff;margin:6px 0}

/* hero (home) */
.hero{position:relative;min-height:938px;display:flex;align-items:center;color:#fff;overflow:hidden}
.hero .bg{position:absolute;inset:0;background:#343b45 center/cover no-repeat}
.hero .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,13,18,.9) 0%,rgba(10,13,18,.7) 45%,rgba(10,13,18,.15) 100%)}
.hero .container{position:relative;padding-top:130px;padding-bottom:130px;width:100%}
.badge{display:inline-block;font-family:Oswald,sans-serif;font-size:18px;letter-spacing:.28em;text-transform:uppercase;color:var(--accent-light);background:rgba(238,114,3,.15);border:1px solid rgba(238,114,3,.4);padding:9px 18px;border-radius:5px}
.hero h1{font-weight:700;font-size:74px;line-height:1.04;margin:26px 0 0;max-width:1000px}
.hero p{font-size:27px;line-height:1.5;margin:26px 0 0;max-width:820px;color:#d9dde4;font-weight:500}
.hero .actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:40px}

/* banner hero (inner pages) */
.banner{position:relative;color:#fff;overflow:hidden;background:var(--dark)}
.banner .bg{position:absolute;inset:0;background:var(--dark) center/cover no-repeat}
.banner .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,13,18,.9) 0%,rgba(10,13,18,.78) 50%,rgba(10,13,18,.55) 100%)}
.banner .container{position:relative;padding:92px 31px}
.crumbs{font-size:16px;color:var(--muted2)}
.crumbs a{color:var(--muted2)}
.crumbs a:hover{color:#fff}
.banner h1{font-weight:700;font-size:58px;margin:18px 0 0}
.banner p{font-size:24px;color:#d9dde4;max-width:920px;margin:20px 0 0;line-height:1.5}

/* services grid */
.grid{display:grid;gap:23px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.svc-card{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:15px;overflow:hidden;background:#fff;color:var(--ink);transition:.2s}
.svc-card:hover{border-color:var(--accent);box-shadow:0 15px 38px rgba(16,20,30,.1);color:var(--ink)}
.svc-card .pic{height:191px;background:var(--card) center/cover no-repeat}
.svc-card .body{padding:19px 20px;font-weight:600;font-size:19px;line-height:1.3}
/* services page card (taller) */
.svc-lg .pic{height:242px}
.svc-lg .body{padding:28px;gap:13px;flex:1;display:flex;flex-direction:column}
.svc-lg .body h3{font-weight:700;font-size:25px;line-height:1.15}
.svc-lg .body .desc{font-size:18px;line-height:1.6;color:var(--muted);font-weight:400}
.svc-lg .body .more{margin-top:auto;font-weight:600;font-size:18px}
.svc-card{cursor:pointer}
.svc-card .more{color:var(--accent)}

/* service detail page */
.svc-detail{max-width:900px}
.svc-detail p{font-size:19px;line-height:1.75;color:var(--muted);margin:0 0 18px}
.svc-detail ul,.svc-detail ol{margin:0 0 22px;padding-left:24px;color:var(--muted);font-size:19px;line-height:1.7}
.svc-detail li{margin-bottom:8px}
.svc-detail h3.svc-sub{font-family:Oswald;font-weight:600;font-size:25px;color:var(--ink);text-transform:uppercase;letter-spacing:.02em;margin:34px 0 14px}
.svc-detail a{color:var(--accent);font-weight:600}
.svc-chips{display:flex;flex-wrap:wrap;gap:13px}
.svc-chips a{display:inline-block;padding:13px 22px;border:1px solid var(--border);border-radius:11px;background:#fff;color:var(--ink);font-weight:600;font-size:17px;transition:.2s}
.svc-chips a:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 10px 26px rgba(16,20,30,.08)}
.svc-photo{margin:28px 0 30px;border-radius:16px;overflow:hidden;box-shadow:0 18px 44px rgba(16,20,30,.12)}
.svc-photo img{display:block;width:100%;height:auto;max-height:470px;object-fit:cover}

/* why */
.why{background:var(--gray);color:#fff}
.why h2{color:#fff}
.why .overline{color:var(--accent-light)}
.why-card{border:1px solid rgba(255,255,255,.1);border-radius:15px;padding:33px 31px;background:rgba(255,255,255,.03)}
.why-card .ic{width:66px;height:66px;border-radius:13px;background:rgba(238,114,3,.14);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.why-card .ic svg{width:33px;height:33px}
.why-card h3{font-family:Manrope;text-transform:none;font-weight:700;font-size:22px;margin:0 0 8px;color:#fff}
.why-card p{font-size:18px;line-height:1.5;color:#fff}

/* booking */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:61px;align-items:center}
.phones-big a{display:block;font-family:Oswald;font-weight:600;font-size:28px;color:var(--ink);margin-top:13px}
.form{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:36px;display:flex;flex-direction:column;gap:15px}
.form input,.form select,.form textarea{padding:18px 20px;border:1px solid var(--input-border);border-radius:10px;font-size:19px;font-family:Manrope,sans-serif;background:#fff;width:100%}
.form textarea{resize:vertical;min-height:140px}
.form .agree{font-size:15px;color:#7a828e;display:flex;gap:10px;align-items:flex-start}

/* works */
.works{background:var(--surface)}
.work-tile{border-radius:15px;overflow:hidden;aspect-ratio:4/3;background:var(--border) center/cover no-repeat}

/* footer */
.site-footer{background:var(--gray);color:var(--footer)}
.site-footer .grid-cols{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:51px;padding:84px 0}
.site-footer .about p{font-size:18px;line-height:1.6;max-width:408px;margin:20px 0 0;color:var(--footer)}
.site-footer h4{font-family:Oswald;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.04em;margin:0 0 18px;font-size:19px}
.site-footer .col a,.site-footer .col div{display:block;color:var(--footer);font-size:19px;margin-bottom:0}
.site-footer .col .dim{color:#c6ccd4;font-size:18px}
.fbottom{border-top:1px solid rgba(255,255,255,.15)}
.fbottom .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:18px;padding-bottom:18px;font-size:17px;color:#c6ccd4}
.fbottom a{color:#c6ccd4}

/* cta */
.cta-center{text-align:center}
.cta-center h2{font-size:41px;font-weight:700;margin:0 0 15px}
.cta-center p{font-size:22px;color:var(--muted);margin:0 0 31px}
.actions-center{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}

/* about */
.about-photo{border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--card) center/cover no-repeat}
.about-text h2{font-size:43px;font-weight:700;margin:13px 0 20px}
.about-text p{font-size:20px;line-height:1.7;color:var(--muted);margin:0 0 18px}
.stats{background:var(--surface)}
.stats .row{display:grid;grid-template-columns:repeat(4,1fr);gap:25px;text-align:center}
.stats .num{font-family:Oswald;font-weight:700;font-size:56px;color:var(--accent)}
.stats .lbl{font-size:19px;color:var(--muted);margin-top:5px}

/* jobs */
.job-card{border:1px solid var(--border);border-radius:18px;padding:36px;display:flex;flex-direction:column;gap:15px}
.job-head{display:flex;align-items:baseline;justify-content:space-between;gap:15px}
.job-head .title{font-family:Oswald;font-weight:700;font-size:28px}
.job-head .salary{font-family:Oswald;font-weight:600;font-size:23px;color:var(--accent);white-space:nowrap}
.job-card .desc{font-size:19px;line-height:1.6;color:var(--muted)}
.tags{display:flex;gap:10px;flex-wrap:wrap}
.tags span{font-size:17px;background:#f2f4f6;color:var(--muted);padding:8px 15px;border-radius:999px}

/* contacts */
.contact-block{margin-bottom:33px}
.contact-block .overline{letter-spacing:.2em;margin-bottom:10px}
.contact-phones a{display:block;font-family:Oswald;font-weight:600;font-size:33px;color:var(--ink);margin-bottom:5px}
.contact-block .val{font-size:22px;color:var(--ink);line-height:1.6}
.map{border-radius:20px;overflow:hidden;height:535px}
.map iframe{width:100%;height:100%;border:0}

/* ---- entrance animations ---- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity 1.1s cubic-bezier(.22,1,.36,1),transform 1.1s cubic-bezier(.22,1,.36,1)}
.reveal.is-animating{will-change:opacity,transform}
.reveal.is-visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .reveal{transition:none!important;opacity:1!important;transform:none!important}
}

/* ---- Lenis smooth scroll ---- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* responsive */
@media(max-width:1380px){
  .grid-4{grid-template-columns:repeat(3,1fr)}
  .hero h1{font-size:58px}
}
@media(max-width:1050px){
  .section{padding:80px 0}
  .nav,.hphones{display:none}
  .burger{display:block}
  .grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}
  .two-col{grid-template-columns:1fr;gap:40px}
  .stats .row{grid-template-columns:repeat(2,1fr);gap:40px 25px}
  .site-footer .grid-cols{grid-template-columns:1fr 1fr;gap:40px}
  .hero h1{font-size:48px}
  .banner h1,.section h2{font-size:40px}
  /* mobile nav */
  .site-header .container.open{flex-wrap:wrap}
  .nav.open{display:flex;flex-direction:column;gap:18px;width:100%;margin:10px 0 5px}
  .hphones.open{display:flex;align-items:flex-start;border-left:0;padding-left:0}
}
@media(max-width:720px){
  .grid-4,.grid-3,.grid-2{grid-template-columns:1fr}
  .stats .row{grid-template-columns:1fr}
  .site-footer .grid-cols{grid-template-columns:1fr}
  .hero h1{font-size:38px}
  .banner h1{font-size:33px}
  .section h2{font-size:33px}
}
