@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Mulish:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* ─── TOKENS ─── */
:root {
  --orange:        #FF6B00;
  --orange-l:      #FF8C33;
  --orange-dim:    rgba(255,107,0,0.10);
  --orange-brd:    rgba(255,107,0,0.28);
  --bg:            #18181b;
  --bg2:           #1f1f23;
  --surface:       #26262b;
  --surface2:      #2e2e34;
  --line:          rgba(255,255,255,0.07);
  --text:          #f2f2f2;
  --text2:         #a0a0a8;
  --text3:         #52525a;
  --green:         #22c55e;
  --red:           #ef4444;
  --nav-h:         62px;
  --bottom-nav-h:  68px;
  --ease:          cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{
  background:var(--bg);color:var(--text);
  font-family:'Mulish',sans-serif;font-weight:400;line-height:1.65;
  overflow-x:hidden;min-height:100vh;
}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font:inherit}
ul{list-style:none}
input{font:inherit}

::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--surface2);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--orange)}

/* ─── UTILS ─── */
.t-disp{font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;line-height:1.05}
.t-lbl{font-size:11px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--orange)}
.container{max-width:1140px;margin:0 auto;padding:0 5vw}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;
  letter-spacing:2px;text-transform:uppercase;
  padding:13px 26px;border-radius:6px;
  transition:.25s var(--ease);white-space:nowrap;
}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 4px 16px rgba(255,107,0,.2)}
.btn-primary:hover{background:var(--orange-l);transform:translateY(-2px);box-shadow:0 10px 28px rgba(255,107,0,.4)}
.btn-outline{border:1px solid var(--orange-brd);color:var(--orange)}
.btn-outline:hover{background:var(--orange-dim);transform:translateY(-2px)}
.btn-ghost{color:var(--text2);padding:13px 16px}
.btn-ghost:hover{color:var(--text)}

.card{
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.card:hover{border-color:var(--orange-brd);transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.3), 0 0 0 1px rgba(255,107,0,.05)}

section{padding:80px 0}
.sec-header{margin-bottom:48px}
.sec-label{margin-bottom:10px}
.sec-title{font-size:clamp(28px,4vw,42px);margin-bottom:12px}
.sec-line{width:48px;height:3px;background:var(--orange);border-radius:2px}

/* ═══════════════════════
   TOP NAV (desktop)
═══════════════════════ */
#nav{
  position:fixed;top:0;left:0;right:0;
  height:var(--nav-h);z-index:500;
  background:rgba(24,24,27,.90);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s var(--ease);
}
#nav.scrolled{box-shadow:0 4px 32px rgba(0,0,0,.4)}
.nav-inner{
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.nav-logo{display:flex;align-items:center;gap:12px;flex-shrink:0}
.nav-logo-icon{
  width:34px;height:34px;background:var(--orange-dim);
  border:1px solid var(--orange-brd);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
}
.nav-logo-text{font-family:'Oswald',sans-serif;font-size:18px;font-weight:700;color:#fff}
.nav-logo-text em{color:var(--orange);font-style:normal}
.nav-logo-sub{font-size:9px;letter-spacing:3px;color:var(--text3);text-transform:uppercase;display:block;margin-top:-2px}
.nav-logo-page{display:block;font-size:12px;color:#fff;font-weight:800;letter-spacing:.2px;text-transform:none;margin-top:1px;line-height:1.15;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-link{
  font-size:13px;font-weight:600;color:var(--text2);
  letter-spacing:.5px;padding:7px 13px;border-radius:5px;
  transition:.2s var(--ease);position:relative;
}
.nav-link:hover{color:var(--text);background:rgba(255,255,255,.04)}
.nav-link.active{color:var(--orange)}
.nav-link.active::after{
  content:'';position:absolute;bottom:-1px;left:13px;right:13px;
  height:2px;background:var(--orange);border-radius:2px;
}
.nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-phone{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;color:var(--orange)}
.nav-phone:hover{opacity:.8}

/* Login button in nav */
.nav-auth-btn{
  display:flex;align-items:center;gap:7px;
  background:var(--orange-dim);border:1px solid var(--orange-brd);
  color:var(--orange);font-family:'Oswald',sans-serif;
  font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  padding:7px 16px;border-radius:6px;transition:.2s var(--ease);
}
.nav-auth-btn:hover{background:rgba(255,107,0,.18)}
.nav-avatar{
  width:32px;height:32px;border-radius:50%;
  background:var(--orange);color:#fff;
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:.2s var(--ease);flex-shrink:0;
}
.nav-avatar:hover{opacity:.85;transform:scale(1.05)}

/* Burger */
.burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:38px;height:38px;padding:5px;border-radius:6px;
}
.burger:hover{background:rgba(255,255,255,.05)}
.burger span{display:block;width:100%;height:2px;background:var(--text);border-radius:2px;transition:.3s var(--ease);transform-origin:center}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ═══════════════════════
   BOTTOM NAV (mobile)
═══════════════════════ */
#bottom-nav{
  display:none;
  position:fixed;bottom:0;left:0;right:0;
  height:var(--bottom-nav-h);
  background:rgba(24,24,27,.96);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid var(--line);
  z-index:500;
  padding:0 4px;
  padding-bottom:env(safe-area-inset-bottom, 0px);
}
.bnav-inner{
  height:100%;display:flex;align-items:stretch;
}
.bnav-item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;padding:8px 4px;border-radius:8px;
  color:var(--text3);transition:.2s var(--ease);
  position:relative;cursor:pointer;
}
.bnav-item:hover{color:var(--text2)}
.bnav-item.active{color:var(--orange)}
.bnav-item.active .bnav-icon-wrap::after{
  content:'';position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;background:var(--orange);border-radius:50%;
}
.bnav-icon-wrap{position:relative;display:flex;align-items:center;justify-content:center}
.bnav-icon{font-size:22px;line-height:1;transition:.2s var(--ease)}
.bnav-item.active .bnav-icon{transform:translateY(-1px)}
.bnav-label{font-size:10px;font-weight:600;letter-spacing:.3px;line-height:1}
.bnav-badge{
  position:absolute;top:-4px;right:-8px;
  min-width:16px;height:16px;padding:0 4px;
  background:var(--orange);color:#fff;
  font-size:9px;font-weight:700;border-radius:99px;
  display:flex;align-items:center;justify-content:center;
  line-height:1;
}

#notifs-fab{
  position:fixed;
  right:16px;
  bottom:calc(var(--bottom-nav-h) + 16px);
  z-index:560;
  width:58px;height:58px;
  border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#ff7b1f 0%, #ff6b00 100%);
  color:#fff;
  box-shadow:0 14px 36px rgba(255,107,0,.34), 0 4px 18px rgba(0,0,0,.32);
  border:1px solid rgba(255,255,255,.18);
  transition:transform .2s var(--ease), opacity .2s var(--ease), box-shadow .2s var(--ease);
}
#notifs-fab.is-hidden{opacity:0;pointer-events:none;transform:translateY(14px) scale(.92)}
#notifs-fab.is-active{transform:translateY(-2px);box-shadow:0 18px 42px rgba(255,107,0,.42), 0 6px 20px rgba(0,0,0,.36)}
#notifs-fab:hover{transform:translateY(-2px) scale(1.02)}
#notifs-fab .notifs-fab-ico{font-size:24px;line-height:1}
#notifs-fab .bnav-badge{top:4px;right:4px;border:2px solid rgba(255,107,0,.95)}
@media (min-width: 901px){
  #notifs-fab{bottom:24px;right:24px}
}

/* ═══════════════════════
   MOBILE DRAWER
═══════════════════════ */
#drawer{
  position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
  background:var(--bg2);z-index:499;
  transform:translateX(100%);transition:transform .35s var(--ease);
  overflow-y:auto;display:flex;flex-direction:column;
}
#drawer.open{transform:translateX(0)}
.drawer-links{padding:20px 20px 0;flex:1}
.drawer-link{
  display:flex;align-items:center;gap:14px;padding:16px 0;
  border-bottom:1px solid var(--line);
  font-family:'Oswald',sans-serif;font-size:20px;font-weight:500;
  color:var(--text2);transition:.2s var(--ease);
}
.drawer-link:hover,.drawer-link.active{color:var(--orange)}
.dl-icon{
  width:38px;height:38px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;
}
.drawer-footer{padding:24px 20px;border-top:1px solid var(--line)}
.drawer-phone{font-family:'Oswald',sans-serif;font-size:26px;font-weight:700;color:var(--orange)}
.drawer-addr{font-size:13px;color:var(--text3);margin-top:6px}

/* ═══════════════════════
   AUTH OVERLAY
═══════════════════════ */
#auth-overlay{
  position:fixed;
  inset:0;
  z-index: 999;
  background: rgb(0 0 0 / 92%);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  animation:fadeIn .3s var(--ease) both;
  align-content: space-around;
  flex-wrap: wrap;
}
#auth-overlay.hidden{display:none}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.auth-modal{
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:16px;
  width:100%;max-width:400px;
  padding:36px 32px 32px;
  animation:slideUp .35s var(--ease) both;
}
@keyframes slideUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.auth-logo{
  display:flex;align-items:center;gap:10px;margin-bottom:28px;
}
.auth-logo-icon{
  width:42px;height:42px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:10px;display:flex;align-items:center;justify-content:center;
}
.auth-logo-name{font-family:'Oswald',sans-serif;font-size:22px;font-weight:700}
.auth-logo-name em{color:var(--orange);font-style:normal}

.auth-step{display:none}
.auth-step.active{display:block;animation:fadeIn .25s var(--ease) both}

.auth-title{font-family:'Oswald',sans-serif;font-size:22px;font-weight:700;margin-bottom:8px}
.auth-sub{font-size:14px;color:var(--text2);margin-bottom:28px;line-height:1.6}

.auth-label{font-size:12px;font-weight:600;color:var(--text3);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px;display:block}
.auth-input{
  width:100%;background:var(--surface);border:1px solid var(--line);
  border-radius:8px;padding:13px 16px;font-size:16px;color:var(--text);
  outline:none;transition:.2s var(--ease);
}
.auth-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.12)}
.auth-input::placeholder{color:var(--text3)}
.auth-input--phone{font-family:'Oswald',sans-serif;font-size:22px;letter-spacing:1.2px;font-weight:500;padding:15px 18px;min-height:54px}
.auth-input--phone::placeholder{letter-spacing:.2px;font-family:inherit}

/* OTP boxes */
.otp-row{display:flex;gap:12px;justify-content:center;margin-bottom:24px}
.otp-box{
  width:56px;height:64px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:10px;
  font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;
  color:var(--orange);text-align:center;outline:none;
  transition:.2s var(--ease);caret-color:var(--orange);
}
.otp-box:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.15)}
.otp-box.filled{border-color:var(--orange-brd);background:var(--orange-dim)}

.auth-btn{
  width:100%;background:var(--orange);color:#fff;
  font-family:'Oswald',sans-serif;font-size:14px;font-weight:600;
  letter-spacing:2px;text-transform:uppercase;
  padding:14px;border-radius:8px;margin-top:4px;
  transition:.2s var(--ease);
}
.auth-btn:hover{background:var(--orange-l);transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,107,0,.3)}
.auth-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}

.auth-hint{
  font-size:12px;color:var(--text3);text-align:center;
  margin-top:16px;line-height:1.6;
}
.auth-hint a{color:var(--orange);cursor:pointer}
.auth-hint a:hover{text-decoration:underline}

.auth-skip{
  display:flex;align-items:center;justify-content:center;
  gap:6px;margin-top:16px;font-size:13px;color:var(--text3);
  cursor:pointer;transition:.2s;
}
.auth-skip:hover{color:var(--text2)}

.otp-hint{
  text-align:center;font-size:13px;color:var(--text3);margin-bottom:6px;
}
.otp-hint strong{color:var(--orange);font-size:18px;letter-spacing:4px;font-family:'Oswald',sans-serif}

/* Success checkmark */
.auth-success{
  text-align:center;padding:20px 0;
}
.auth-check{
  width:72px;height:72px;border-radius:50%;
  background:rgba(34,197,94,.12);border:2px solid var(--green);
  display:flex;align-items:center;justify-content:center;
  font-size:32px;margin:0 auto 20px;
  animation:popIn .4s var(--ease) both;
}
@keyframes popIn{from{transform:scale(0)}to{transform:scale(1)}}

/* ═══════════════════════
   APP WRAPPER
═══════════════════════ */
#app{
  padding-top:var(--nav-h);
  padding-bottom:0;
  min-height:100vh;
}

.page{display:none;animation:pageIn .35s var(--ease) both}
.page.active{display:block}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ═══════════════════════
   HERO
═══════════════════════ */
.hero{
  min-height:calc(100svh - var(--nav-h));
  display:flex;align-items:center;
  position:relative;overflow:hidden;padding:56px 0;
}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,107,0,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,107,0,.04) 1px,transparent 1px);
  background-size:54px 54px;
  animation: gridShift 20s linear infinite;
}
@keyframes gridShift {
  0%   { background-position: 0 0; }
  100% { background-position: 54px 54px; }
}
.hero-glow{
  position:absolute;width:780px;height:780px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,107,0,.12) 0%,rgba(255,107,0,.04) 40%,transparent 65%);
  right:-180px;top:50%;transform:translateY(-50%);pointer-events:none;
  animation: glowPulse 4s ease-in-out infinite;
}
.hero-glow2{
  position:absolute;width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,107,0,.06) 0%,transparent 65%);
  left:-100px;bottom:-100px;pointer-events:none;
  animation: glowPulse 5s ease-in-out infinite reverse;
}
@keyframes glowPulse {
  0%,100% { opacity:1; transform:translateY(-50%) scale(1); }
  50%      { opacity:.7; transform:translateY(-50%) scale(1.08); }
}
.hero-body{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--orange-dim);border:1px solid var(--orange-brd);
  color:var(--orange);font-size:10px;font-weight:700;letter-spacing:3px;
  text-transform:uppercase;padding:7px 16px;border-radius:99px;margin-bottom:26px;
  box-shadow: 0 0 20px rgba(255,107,0,.15);
}
.hero-dot{width:6px;height:6px;background:var(--orange);border-radius:50%;animation:blink 2s infinite;box-shadow:0 0 6px rgba(255,107,0,.8)}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}
.hero-title{font-size:clamp(42px,5.5vw,78px);margin-bottom:20px;line-height:1.0}
.hero-title .acc{
  color:var(--orange);
  text-shadow: 0 0 40px rgba(255,107,0,.3);
}
.hero-desc{font-size:15px;color:var(--text2);max-width:450px;margin-bottom:36px;line-height:1.75}
.hero-btns{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px}
.hero-stats{display:flex;gap:32px;padding-top:36px;border-top:1px solid var(--line);flex-wrap:wrap}
.stat-num{font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;color:var(--orange);line-height:1.1}
.stat-lbl{font-size:12px;color:var(--text3);margin-top:3px;font-weight:500}

.hero-visual{display:flex;flex-direction:column;gap:12px}
.hv-card{
  padding:18px 22px;display:flex;align-items:center;gap:14px;
  transition:.3s var(--ease);
  animation: cardFloat 0s ease-in-out infinite;
}
.hv-card:nth-child(1){animation-duration:3.5s;animation-delay:0s}
.hv-card:nth-child(2){animation-duration:4.2s;animation-delay:.5s}
.hv-card:nth-child(3){animation-duration:3.8s;animation-delay:1s}
.hv-card:nth-child(4){animation-duration:4.5s;animation-delay:1.5s}
.hv-card:hover{
  border-color:var(--orange-brd);
  transform:translateX(4px);
  box-shadow:0 8px 28px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,107,0,.1);
}
@keyframes cardFloat {
  0%,100%{ transform:translateY(0) }
  50%    { transform:translateY(-3px) }
}
.hv-ico{
  width:42px;height:42px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;
  transition:.3s var(--ease);
}
.hv-card:hover .hv-ico{
  background:rgba(255,107,0,.18);
  box-shadow:0 0 16px rgba(255,107,0,.2);
}
.hv-t{font-family:'Oswald',sans-serif;font-size:15px;font-weight:600;text-transform:uppercase}
.hv-d{font-size:12px;color:var(--text2);margin-top:2px}

/* ═══════════════════════
   SERVICES TEASER
═══════════════════════ */
.st-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.st-card{
  padding:26px 20px;cursor:pointer;
  position:relative;overflow:hidden;
}
.st-card::before{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,107,0,.06) 0%,transparent 60%);
  opacity:0;transition:.3s var(--ease);
}
.st-card:hover::before{opacity:1}
.st-emoji{
  font-size:26px;margin-bottom:13px;display:block;
  transition:transform .3s var(--ease);
}
.st-card:hover .st-emoji{transform:scale(1.15) rotate(-5deg)}
.st-t{font-family:'Oswald',sans-serif;font-size:16px;font-weight:600;text-transform:uppercase;margin-bottom:7px}
.st-d{font-size:13px;color:var(--text2);line-height:1.6}
.st-arr{margin-top:14px;font-size:17px;color:var(--orange);opacity:0;transform:translateX(-6px);transition:.2s var(--ease);display:block}
.st-card:hover .st-arr{opacity:1;transform:none}

/* ═══════════════════════
   PRICING
═══════════════════════ */
.ptabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.ptab{
  font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:9px 20px;border-radius:6px;border:1px solid var(--line);
  color:var(--text2);background:var(--surface);transition:.2s var(--ease);
}
.ptab:hover,.ptab.active{color:var(--orange);border-color:var(--orange);background:var(--orange-dim)}
.ptbl-wrap{border-radius:8px;border:1px solid var(--line);overflow:hidden}
.ptbl{width:100%;border-collapse:collapse;display:none}
.ptbl.active{display:table}
.ptbl thead{background:var(--surface2)}
.ptbl th{padding:13px 22px;text-align:left;font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--orange)}
.ptbl th:last-child{text-align:right}
.ptbl td{padding:15px 22px;font-size:14px;border-top:1px solid var(--line)}
.ptbl td:nth-child(2){color:var(--text2);font-size:13px}
.ptbl td:last-child{text-align:right;font-family:'Oswald',sans-serif;font-size:16px;font-weight:600;color:var(--orange);white-space:nowrap}
.ptbl tbody tr:hover td{background:rgba(255,107,0,.04)}
.p-note{margin-top:18px;padding:13px 16px;background:var(--orange-dim);border:1px solid var(--orange-brd);border-radius:6px;font-size:13px;color:var(--text2);display:flex;align-items:center;gap:9px}

/* ═══════════════════════
   ABOUT
═══════════════════════ */
.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.about-text p{font-size:14px;color:var(--text2);line-height:1.8;margin-bottom:16px}
.af-list{display:flex;flex-direction:column;gap:13px;margin-top:28px}
.af-item{display:flex;gap:12px;align-items:flex-start}
.af-ico{
  width:36px;height:36px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;margin-top:2px;
}
.af-t{font-weight:700;font-size:13px;margin-bottom:2px}
.af-d{font-size:12px;color:var(--text2)}
.an-list{display:flex;flex-direction:column;gap:11px}
.an-card{padding:20px 24px;display:flex;align-items:center;gap:20px}
.an-num{font-family:'Oswald',sans-serif;font-size:34px;font-weight:700;color:var(--orange);line-height:1;min-width:72px}
.an-t{font-weight:700;font-size:13px;margin-bottom:2px}
.an-s{font-size:12px;color:var(--text3)}

/* ═══════════════════════
   REVIEWS
═══════════════════════ */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rv-card{padding:26px;position:relative}
.rv-stars{color:var(--orange);font-size:13px;letter-spacing:2px;margin-bottom:13px}
.rv-text{font-size:14px;color:#ccc;line-height:1.75;margin-bottom:18px;font-style:italic}
.rv-author{display:flex;align-items:center;gap:11px}
.rv-av{
  width:38px;height:38px;border-radius:50%;background:var(--orange-dim);border:1px solid var(--orange-brd);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;color:var(--orange);flex-shrink:0;
}
.rv-name{font-weight:700;font-size:13px}
.rv-date{font-size:11px;color:var(--text3);margin-top:2px}
.rv-q{position:absolute;top:16px;right:20px;font-size:48px;color:var(--orange);opacity:.07;font-family:Georgia,serif;line-height:1}

/* ═══════════════════════
   CONTACTS
═══════════════════════ */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.ci-list{display:flex;flex-direction:column;gap:12px}
.ci-card{padding:20px 22px;display:flex;align-items:center;gap:14px}
.ci-ico{
  width:44px;height:44px;background:var(--orange-dim);border:1px solid var(--orange-brd);
  border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;
}
.ci-lbl{font-size:11px;color:var(--text3);font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:3px}
.ci-val{font-size:14px;font-weight:600}
.ci-val a{color:var(--orange)}
.ci-val a:hover{text-decoration:underline}
.hours-wrap{border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-top:16px}
.hr-row{display:flex;justify-content:space-between;padding:12px 18px;font-size:13px;border-bottom:1px solid var(--line)}
.hr-row:last-child{border:none}
.hr-row .day{color:var(--text2)}
.hr-row .time{font-weight:600}
.hr-row .time.off{color:var(--text3)}
.hr-row.today{background:var(--orange-dim)}
.hr-row.today .day{color:var(--orange);font-weight:700}
.map-box{
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--text3);
}
.map-box .mi{font-size:44px;opacity:.35}
.map-box p{font-size:14px;font-weight:600;color:var(--text2)}
.map-box a{font-size:13px;color:var(--orange);border-bottom:1px solid var(--orange-brd)}

/* ═══════════════════════
   CABINET PAGE
═══════════════════════ */
.cab-hero{
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
  border-bottom:1px solid var(--line);
  padding:48px 0 40px;
}
.cab-profile-row{
  display:flex;align-items:center;gap:20px;margin-bottom:36px;flex-wrap:wrap;
}
.cab-avatar{
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,var(--orange),#cc4400);
  color:#fff;font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 0 0 3px rgba(255,107,0,.25);
}
.cab-name{font-family:'Oswald',sans-serif;font-size:24px;font-weight:700;margin-bottom:3px}
.cab-phone-lbl{font-size:13px;color:var(--text3)}

.cab-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--line);
  overflow-x:auto;scrollbar-width:none;
}
.cab-tabs::-webkit-scrollbar{display:none}
.cab-tab{
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  padding:12px 22px;color:var(--text2);border-bottom:2px solid transparent;
  transition:.2s var(--ease);white-space:nowrap;flex-shrink:0;
}
.cab-tab:hover{color:var(--text)}
.cab-tab.active{color:var(--orange);border-bottom-color:var(--orange)}

.cab-pane{display:none;padding:36px 0;animation:pageIn .25s var(--ease) both}
.cab-pane.active{display:block}

/* Profile pane */
.profile-form{max-width:480px;display:flex;flex-direction:column;gap:18px}
.pf-group{display:flex;flex-direction:column;gap:6px}
.pf-label{font-size:12px;font-weight:600;color:var(--text3);letter-spacing:1px;text-transform:uppercase}
.pf-input{
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:12px 16px;font-size:15px;color:var(--text);outline:none;transition:.2s var(--ease);
}
.pf-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.12)}
.pf-input:disabled{opacity:.5;cursor:not-allowed}
.pf-save{margin-top:4px;align-self:flex-start}
.pf-toast{
  display:none;align-items:center;gap:8px;
  padding:10px 16px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3);
  border-radius:6px;font-size:13px;color:var(--green);margin-top:8px;
}
.pf-toast.show{display:flex;animation:fadeIn .3s var(--ease) both}

/* History pane */
.hist-list{display:flex;flex-direction:column;gap:12px}
.hist-item{
  padding:18px 20px;
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
}
.hist-status{
  width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:4px;
}
.hist-status.done{background:var(--green)}
.hist-status.process{background:var(--orange);animation:blink 1.5s infinite}
.hist-status.wait{background:var(--text3)}
.hist-title{font-weight:600;font-size:14px;margin-bottom:3px}
.hist-meta{font-size:12px;color:var(--text3)}
.hist-price{font-family:'Oswald',sans-serif;font-size:17px;font-weight:600;color:var(--orange);white-space:nowrap}
.hist-badge{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  padding:3px 9px;border-radius:99px;margin-left:8px;
}
.hist-badge.done{background:rgba(34,197,94,.12);color:var(--green)}
.hist-badge.process{background:rgba(255,107,0,.12);color:var(--orange)}
.hist-badge.wait{background:rgba(255,255,255,.05);color:var(--text3)}

/* Notifications pane */
.notif-list{display:flex;flex-direction:column;gap:10px}
.notif-item{
  padding:16px 18px;display:flex;gap:14px;align-items:flex-start;
}
.notif-ico{
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:18px;
}
.notif-ico.info{background:rgba(99,179,237,.12);border:1px solid rgba(99,179,237,.2)}
.notif-ico.success{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.2)}
.notif-ico.warning{background:var(--orange-dim);border:1px solid var(--orange-brd)}
.notif-title{font-weight:700;font-size:14px;margin-bottom:4px}
.notif-text{font-size:13px;color:var(--text2);line-height:1.5}
.notif-time{font-size:11px;color:var(--text3);margin-top:5px}
.notif-item.unread{background:rgba(255,107,0,.04);border-color:rgba(255,107,0,.12)}
.notif-dot{
  width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0;margin-top:6px;
}

/* Empty state */
.empty-state{
  text-align:center;padding:60px 20px;
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.empty-icon{font-size:52px;opacity:.3}
.empty-t{font-family:'Oswald',sans-serif;font-size:18px;color:var(--text2)}
.empty-d{font-size:14px;color:var(--text3)}

/* Logout btn */
.logout-btn{
  display:flex;align-items:center;gap:8px;color:var(--red);font-size:13px;font-weight:600;
  padding:10px 14px;border-radius:6px;border:1px solid rgba(239,68,68,.2);
  background:rgba(239,68,68,.06);transition:.2s var(--ease);margin-top:24px;
}
.logout-btn:hover{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4)}

/* ═══════════════════════
   CTA
═══════════════════════ */
.cta-strip{
  background:linear-gradient(135deg,#FF6B00 0%,#e55200 60%,#c44600 100%);
  padding:68px 0;text-align:center;position:relative;overflow:hidden;
}
.cta-strip::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:36px 36px;
  animation: gridShift 15s linear infinite reverse;
}
.cta-strip::after{
  content:'';position:absolute;
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 65%);
  left:-150px;top:50%;transform:translateY(-50%);pointer-events:none;
}
.cta-inner{position:relative;z-index:1}
.cta-t{font-size:clamp(26px,4vw,44px);color:#fff;margin-bottom:10px}
.cta-s{font-size:15px;color:rgba(255,255,255,.72);margin-bottom:28px}
.cta-phone{
  display:block;font-family:'Oswald',sans-serif;
  font-size:clamp(34px,5.5vw,58px);font-weight:700;color:#fff;letter-spacing:2px;
  margin-bottom:22px;transition:opacity .2s, transform .2s;
}
.cta-phone:hover{opacity:.85;transform:scale(1.02)}
.cta-meta{font-size:13px;color:rgba(255,255,255,.55);display:flex;justify-content:center;gap:24px;flex-wrap:wrap}

/* ═══════════════════════
   FOOTER
═══════════════════════ */
footer{background:#111113;border-top:1px solid var(--line);padding:28px 0}
.foot-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.foot-brand{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;color:var(--text3)}
.foot-brand em{color:var(--orange);font-style:normal}
.foot-copy{font-size:12px;color:var(--text3)}
.foot-links{display:flex;gap:18px}
.foot-links a{font-size:12px;color:var(--text3);transition:.2s}
.foot-links a:hover{color:var(--orange)}

/* ═══════════════════════
   REVEAL
═══════════════════════ */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ═══════════════════════
   RESPONSIVE
═══════════════════════ */
@media(max-width:900px){
  .nav-links,.nav-phone{display:none}
  .burger{display:flex}
  #bottom-nav{display:flex}
  #app{padding-bottom:var(--bottom-nav-h)}
  footer{margin-bottom:0}

  .hero-body{grid-template-columns:1fr}
  .hero-visual{display:none}
  .st-grid{grid-template-columns:repeat(2,1fr)}
  .rv-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr;gap:36px}
  .ct-grid{grid-template-columns:1fr}
  .cab-profile-row{flex-direction:row}
}
@media(max-width:560px){
  section{padding:56px 0}
  .st-grid{grid-template-columns:1fr}
  .hero-btns{flex-direction:column}
  .btn{justify-content:center}
  .hero-stats{gap:18px}
  .cta-meta{flex-direction:column;gap:6px}
  .ptbl th:nth-child(2),.ptbl td:nth-child(2){display:none}
  .foot-links{display:none}
  .cab-tabs{margin:0 -5vw;padding:0 5vw}
  .hist-item{grid-template-columns:auto 1fr;grid-template-rows:auto auto}
  .hist-price{grid-column:2;justify-self:start}
}
@media(max-width:380px){
  .container{padding:0 14px}
  .otp-box{width:48px;height:58px;font-size:24px}
  .otp-row{gap:8px}
}

/* ══════════════════════════════════════════════
   MY ORDERS PAGE
══════════════════════════════════════════════ */

/* ─── Hero ─── */
.mo-hero {
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 44px 0 28px;
}
.mo-hero-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.mo-hero-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  line-height: 1.1;
  margin: 8px 0 6px;
}
.mo-hero-sub {
  font-size: 13px;
  color: var(--text3);
  margin-top: 2px;
}

/* ─── Stats ─── */
.mo-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 24px 0 20px;
}
.mo-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 12px;
  text-align: center;
}
.mo-stat-num {
  font-family: 'Oswald', sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  color: var(--text);
}
.mo-stat-lbl {
  font-size: 11px;
  color: var(--text3);
  margin-top: 5px;
  font-weight: 600;
  letter-spacing: .5px;
}

/* ─── Filters ─── */
.mo-filters {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.mo-filters::-webkit-scrollbar { display: none; }
.mo-filter {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 13px;
  font-weight: 600;
  color: var(--text2);
  cursor: pointer;
  white-space: nowrap;
  transition: .2s var(--ease);
  flex-shrink: 0;
}
.mo-filter:active { transform: scale(.95); }
.mo-filter.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}
.mo-filter-cnt {
  background: var(--surface2);
  color: var(--text3);
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 99px;
  min-width: 18px;
  text-align: center;
}
.mo-filter.active .mo-filter-cnt {
  background: rgba(255,107,0,.2);
  color: var(--orange);
}

/* ─── Order Card ─── */
.mo-card {
  margin-bottom: 16px;
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  transition: .2s var(--ease);
}
.mo-card:active { transform: scale(.99); }

.mo-card-head {
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
}
.mo-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.mo-card-id {
  font-family: 'Oswald', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--text3);
  letter-spacing: 1px;
}
.mo-card-title {
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  margin-bottom: 5px;
}
.mo-card-car {
  font-size: 12px;
  color: var(--text3);
}

/* ─── Status badge ─── */
.mo-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 99px;
  white-space: nowrap;
}
.mo-status-badge.done      { background: rgba(34,197,94,.12); color: var(--green); }
.mo-status-badge.process   { background: rgba(255,107,0,.12); color: var(--orange); }
.mo-status-badge.new       { background: rgba(160,160,168,.12); color: var(--text2); }
.mo-status-badge.cancelled { background: rgba(239,68,68,.12); color: var(--red); }

/* ─── Card Meta ─── */
.mo-card-meta {
  padding: 14px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid var(--line);
}
.mo-meta-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text2);
}
.mo-meta-ico {
  font-size: 15px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

/* ─── Timeline ─── */
.mo-timeline {
  padding: 16px 20px;
  display: flex;
  align-items: flex-start;
  gap: 0;
  border-bottom: 1px solid var(--line);
}
.mo-tl-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
  gap: 6px;
}
.mo-tl-dot {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--surface2);
  border: 2px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: var(--text3);
  z-index: 1;
  flex-shrink: 0;
  transition: .25s var(--ease);
}
.mo-tl-dot.done {
  background: rgba(34,197,94,.12);
  border-color: var(--green);
  color: var(--green);
}
.mo-tl-line {
  position: absolute;
  top: 14px;
  left: calc(50% + 15px);
  right: calc(-50% + 15px);
  height: 2px;
  background: var(--line);
  z-index: 0;
  transition: .25s var(--ease);
}
.mo-tl-line.done { background: var(--green); }
.mo-tl-body {
  text-align: center;
  padding: 0 2px;
}
.mo-tl-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--text3);
  line-height: 1.3;
}
.mo-tl-item.done .mo-tl-label { color: var(--text2); }
.mo-tl-time {
  font-size: 10px;
  color: var(--text3);
  margin-top: 2px;
  white-space: nowrap;
}

/* ─── Card Actions ─── */
.mo-card-actions {
  padding: 14px 20px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ─── Mobile overrides ─── */
@media (max-width: 599px) {
  .mo-hero { padding: 28px 0 20px; }
  .mo-hero-row { flex-direction: column; gap: 12px; }
  .mo-hero-row .btn { width: 100%; justify-content: center; }
  .mo-stats { gap: 8px; margin: 16px 0 16px; }
  .mo-stat-card { padding: 12px 8px; }
  .mo-stat-num  { font-size: 22px; }
  .mo-stat-lbl  { font-size: 10px; }
  .mo-card-meta { padding: 12px 16px; }
  .mo-card-head { padding: 14px 16px 12px; }
  .mo-card-actions { padding: 12px 16px; }
  .mo-timeline { padding: 12px 16px; }
  .mo-card-actions .btn { flex: 1; justify-content: center; font-size: 11px; padding: 8px 10px; }
  .mo-tl-label { font-size: 10px; }
  .mo-tl-time  { display: none; }
}

/* ═══════════════════════
   SCROLL TO TOP
═══════════════════════ */
#scroll-top {
  position: fixed;
  right: 20px;
  bottom: calc(var(--bottom-nav-h) + 80px);
  z-index: 400;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1px solid var(--line);
  color: var(--text2);
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  opacity: 0; pointer-events: none;
  transform: translateY(12px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), background .2s;
  box-shadow: 0 4px 16px rgba(0,0,0,.3);
}
#scroll-top.vis {
  opacity: 1; pointer-events: all; transform: none;
}
#scroll-top:hover {
  background: var(--orange-dim);
  border-color: var(--orange-brd);
  color: var(--orange);
}
@media(min-width:901px){
  #scroll-top { bottom: 28px; right: 28px; }
}

/* ═══════════════════════
   IMPROVED REVIEWS
═══════════════════════ */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rv-card{
  padding:26px;position:relative;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.rv-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  border-color: var(--orange-brd);
}
.rv-stars{color:var(--orange);font-size:13px;letter-spacing:2px;margin-bottom:13px}
.rv-text{font-size:14px;color:#ccc;line-height:1.75;margin-bottom:18px;font-style:italic}
.rv-author{display:flex;align-items:center;gap:11px}
.rv-av{
  width:38px;height:38px;border-radius:50%;background:var(--orange-dim);border:1px solid var(--orange-brd);
  display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;color:var(--orange);flex-shrink:0;
}
.rv-name{font-weight:700;font-size:13px}
.rv-date{font-size:11px;color:var(--text3);margin-top:2px}
.rv-q{position:absolute;top:16px;right:20px;font-size:48px;color:var(--orange);opacity:.07;font-family:Georgia,serif;line-height:1}

/* ═══════════════════════
   NAV IMPROVEMENTS
═══════════════════════ */
#nav.scrolled {
  background: rgba(18,18,20,.97);
}

/* ═══════════════════════
   PAGE TRANSITIONS
═══════════════════════ */
@keyframes pageSlideIn {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:none; }
}
.page { animation: pageSlideIn .3s var(--ease) both; }

/* ═══════════════════════════════════════════
   CABINET v2 — улучшенный кабинет клиента
═══════════════════════════════════════════ */

/* Locked state */
.cab-locked {
  text-align: center;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 420px;
  margin: 0 auto;
}
.cab-locked-ico { font-size: 56px; margin-bottom: 16px; opacity: .8; }
.cab-locked-title {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  margin-bottom: 10px;
}
.cab-locked-sub {
  font-size: 14px; color: var(--text2);
  line-height: 1.7; max-width: 340px;
}

/* Avatar wrap with badge */
.cab-avatar-wrap { position: relative; flex-shrink: 0; }
.cab-av-badge {
  position: absolute;
  top: -4px; right: -4px;
  width: 20px; height: 20px;
  background: var(--orange);
  color: #fff;
  font-size: 10px; font-weight: 700;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--bg2);
}

/* Profile meta chips */
.cab-profile-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.cab-phone-chip, .cab-car-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text3);
  background: var(--surface2);
  border: 1px solid var(--line);
  padding: 3px 10px;
  border-radius: 99px;
}
.cab-profile-actions {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-end;
  flex-shrink: 0;
}
.cab-role-btn {
  font-size: 11px;
  padding: 7px 14px;
  color: var(--text2);
  border: 1px solid var(--line);
  border-radius: 6px;
}
.cab-role-btn:hover { color: var(--text); border-color: var(--orange-brd); }

/* Mini stats bar */
.cab-mini-stats {
  display: flex;
  align-items: center;
  gap: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 20px;
  margin-bottom: 28px;
  flex-wrap: wrap;
  row-gap: 12px;
}
.cab-ms-item {
  flex: 1;
  text-align: center;
  min-width: 70px;
}
.cab-ms-num {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700;
  line-height: 1.1;
}
.cab-ms-lbl {
  font-size: 10px;
  color: var(--text3);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 3px;
}
.cab-ms-sep {
  width: 1px; height: 32px;
  background: var(--line);
  flex-shrink: 0;
}

/* Tab badge */
.cab-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px; height: 18px;
  padding: 0 5px;
  border-radius: 99px;
  font-size: 10px; font-weight: 700;
  background: var(--surface2);
  color: var(--text3);
  margin-left: 5px;
}
.cab-tab-badge.orange {
  background: var(--orange);
  color: #fff;
  animation: blink 2s infinite;
}

/* Pane layout with side cards */
.cab-pane-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 24px;
  align-items: start;
}
@media(max-width:860px) {
  .cab-pane-layout { grid-template-columns: 1fr; }
  .cab-side-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
}
@media(max-width:480px) {
  .cab-side-cards { grid-template-columns: 1fr; }
}

/* Profile form card */
.profile-form-card {
  padding: 28px;
}
.pfc-title {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--text2);
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 10px;
}
.pfc-title::before {
  content: '';
  width: 3px; height: 16px;
  background: var(--orange);
  border-radius: 2px;
  flex-shrink: 0;
}

/* Quick cards */
.cab-side-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cab-quick-card {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: .2s var(--ease);
}
.cab-quick-card:hover {
  border-color: var(--orange-brd);
  transform: translateX(3px);
}
.cqc-ico {
  width: 38px; height: 38px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.cqc-body { flex: 1; min-width: 0; }
.cqc-title { font-weight: 700; font-size: 13px; }
.cqc-sub { font-size: 11px; color: var(--text3); margin-top: 2px; }
.cqc-arr {
  font-size: 16px; color: var(--text3);
  transition: transform .2s, color .2s;
}
.cab-quick-card:hover .cqc-arr { transform: translateX(3px); color: var(--orange); }

/* Loyalty hero */
.loyalty-hero {
  padding: 32px 28px;
  text-align: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 16px;
}
.loy-bg-glow {
  position: absolute; inset: 0;
  pointer-events: none;
}
.loy-level-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 6px 16px;
  border-radius: 99px;
  border: 1px solid;
  margin-bottom: 16px;
  position: relative;
}
.loy-pts {
  font-family: 'Oswald', sans-serif;
  font-size: 56px; font-weight: 700;
  line-height: 1;
  position: relative;
}
.loy-pts-sub {
  font-size: 13px; color: var(--text2);
  margin-top: 6px; margin-bottom: 20px;
  position: relative;
}
.loy-progress-wrap { position: relative; max-width: 480px; margin: 0 auto 20px; }
.loy-progress-bar {
  height: 8px;
  background: var(--surface2);
  border-radius: 99px;
  overflow: hidden;
}
.loy-progress-fill {
  height: 100%;
  border-radius: 99px;
  transition: width .8s cubic-bezier(.16,1,.3,1);
  box-shadow: 0 0 8px currentColor;
}
.loy-progress-labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text3);
  margin-top: 6px;
}

/* Loyalty levels */
.loy-levels {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.loy-lvl-card {
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: .2s var(--ease);
}
.loy-active {
  border-color: var(--orange-brd);
  background: var(--orange-dim);
}
.loy-locked { opacity: .5; }
.loy-lvl-emo { font-size: 24px; flex-shrink: 0; }
.loy-lvl-info { flex: 1; }
.loy-lvl-name { font-weight: 700; font-size: 14px; }
.loy-lvl-range { font-size: 11px; color: var(--text3); margin-top: 2px; }
.loy-you {
  font-size: 11px; color: var(--orange);
  font-weight: 600; margin-left: 6px;
}
.loy-lvl-disc {
  font-size: 13px; font-weight: 700;
  text-align: right; white-space: nowrap;
}

@media(max-width:560px) {
  .cab-mini-stats { padding: 12px 14px; gap: 0; }
  .cab-ms-num { font-size: 18px; }
  .loyalty-hero { padding: 24px 20px; }
  .loy-pts { font-size: 44px; }
  .cab-profile-row { flex-wrap: wrap; }
  .cab-profile-actions { flex-direction: row; margin-left: 0; width: 100%; }
  .logout-btn { margin-top: 0; }
}

/* ═══════════════════════════════════════════
   SERVICES — full cards
═══════════════════════════════════════════ */
.svc-full-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 1024px) {
  .svc-full-grid {
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
  }
}
.svc-full-card { padding: 28px; }
.sfc-head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.sfc-ico {
  width: 52px; height: 52px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; flex-shrink: 0;
}
.sfc-meta { flex: 1; min-width: 180px; }
.sfc-title {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  margin-bottom: 5px;
}
.sfc-desc { font-size: 13px; color: var(--text2); line-height: 1.6; }
.sfc-badge-wrap {
  display: flex; flex-direction: column; gap: 6px;
  align-items: flex-end; flex-shrink: 0;
}
.sfc-time-badge, .sfc-price-badge {
  font-size: 11px; font-weight: 700;
  padding: 4px 12px; border-radius: 99px;
  white-space: nowrap;
}
.sfc-time-badge  { background: rgba(96,165,250,.12); color: #60a5fa; border: 1px solid rgba(96,165,250,.2); }
.sfc-price-badge { background: var(--orange-dim); color: var(--orange); border: 1px solid var(--orange-brd); }

.sfc-why {
  font-size: 13px; color: var(--text3);
  font-style: italic;
  padding: 10px 14px;
  background: var(--surface2);
  border-left: 3px solid var(--orange-brd);
  border-radius: 0 6px 6px 0;
  margin-bottom: 20px;
  line-height: 1.6;
}
.sfc-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 22px;
}
.sfc-col-title {
  font-size: 11px; font-weight: 700;
  color: var(--text3); letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.sfc-steps {
  display: flex; flex-direction: column; gap: 8px;
  list-style: none; padding: 0;
}
.sfc-steps li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--text2);
}
.sfc-step-n {
  width: 22px; height: 22px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: 50%;
  font-family: 'Oswald', sans-serif;
  font-size: 11px; font-weight: 700; color: var(--orange);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.sfc-checklist {
  display: flex; flex-direction: column; gap: 8px;
  list-style: none; padding: 0;
}
.sfc-checklist li {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text2);
}
.sfc-check {
  color: var(--green); font-weight: 700; flex-shrink: 0;
}
.sfc-actions {
  display: flex; gap: 10px; flex-wrap: wrap;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
@media(max-width:560px){
  .sfc-body { grid-template-columns: 1fr; gap: 16px; }
  .sfc-badge-wrap { flex-direction: row; align-items: center; }
  .svc-full-card { padding: 20px 16px; }
}

/* ═══════════════════════════════════════════
   FAQ
═══════════════════════════════════════════ */
.faq-list {
  display: flex; flex-direction: column; gap: 8px;
  max-width: 760px;
}
.faq-item {
  padding: 0; cursor: pointer;
  overflow: hidden;
  transition: border-color .2s var(--ease);
}
.faq-item:hover { border-color: var(--orange-brd); }
.faq-q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
  padding: 16px 20px;
  font-weight: 700; font-size: 14px;
  user-select: none;
}
.faq-arr {
  color: var(--orange); font-size: 16px;
  transition: transform .25s var(--ease);
  flex-shrink: 0;
}
.faq-item.open .faq-arr { transform: rotate(180deg); }
.faq-a {
  max-height: 0; overflow: hidden;
  font-size: 13px; color: var(--text2); line-height: 1.7;
  padding: 0 20px;
  transition: max-height .35s var(--ease), padding .35s var(--ease);
}
.faq-item.open .faq-a {
  max-height: 200px;
  padding: 0 20px 16px;
}

/* ═══════════════════════════════════════════
   PARTS
═══════════════════════════════════════════ */
.parts-filter-row {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 24px;
}
.parts-cat {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 16px; border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 13px; font-weight: 600; color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: .2s var(--ease);
}
.parts-cat:hover { border-color: var(--orange-brd); color: var(--text); }
.parts-cat.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}
.parts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 28px;
}
.part-card {
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 8px;
  transition: .2s var(--ease);
}
.part-card:hover { border-color: var(--orange-brd); transform: translateY(-2px); }
.part-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px;
}
.part-sku {
  font-size: 10px; font-weight: 700; color: var(--text3);
  letter-spacing: 1.5px; text-transform: uppercase;
}
.part-stock {
  font-size: 10px; font-weight: 700; letter-spacing: .5px;
  padding: 3px 9px; border-radius: 99px; white-space: nowrap;
}
.part-stock.in  { background: rgba(34,197,94,.1);  color: var(--green); }
.part-stock.out { background: rgba(245,158,11,.1);  color: #f59e0b; }
.part-name {
  font-weight: 700; font-size: 14px; line-height: 1.3;
}
.part-note { font-size: 11px; color: var(--text3); }
.part-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line);
  gap: 8px;
}
.part-price {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 700; color: var(--orange);
}
.part-ask {
  font-size: 11px; font-weight: 700; color: var(--orange);
  background: var(--orange-dim); border: 1px solid var(--orange-brd);
  padding: 5px 12px; border-radius: 6px;
  cursor: pointer; transition: .2s; white-space: nowrap;
}
.part-ask:hover { background: rgba(255,107,0,.2); }
.parts-request-banner {
  padding: 20px 24px;
  display: flex; align-items: center; gap: 18px;
  flex-wrap: wrap;
}
@media(max-width:560px){
  .parts-request-banner { flex-direction: column; text-align: center; }
}

/* ═══════════════════════════════════════════
   ABOUT
═══════════════════════════════════════════ */
.about-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.about-facts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.about-fact {
  padding: 18px 16px;
  text-align: center;
}
.about-fact-num {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  color: var(--orange); line-height: 1.1;
}
.about-fact-lbl {
  font-size: 11px; color: var(--text3);
  margin-top: 4px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .5px;
}
.vals-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.val-card { padding: 24px; }
.val-ico  { font-size: 28px; margin-bottom: 12px; }
.val-t    { font-family:'Oswald',sans-serif; font-size:16px; font-weight:700; text-transform:uppercase; margin-bottom:8px; }
.val-d    { font-size:13px; color:var(--text2); line-height:1.65; }
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
}
.team-card {
  padding: 28px 20px;
  text-align: center;
  transition: .3s var(--ease);
}
.team-card:hover { transform: translateY(-4px); border-color: var(--orange-brd); }
.team-av {
  width: 68px; height: 68px;
  border-radius: 50%;
  border: 2px solid;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700;
  margin: 0 auto 14px;
}
.team-name { font-weight: 700; font-size: 15px; margin-bottom: 5px; }
.team-role { font-size: 12px; color: var(--text2); margin-bottom: 8px; line-height: 1.5; }
.team-exp  { font-size: 12px; color: var(--text3); }

@media(max-width:860px) {
  .about-intro-grid { grid-template-columns: 1fr; gap: 28px; }
  .vals-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:560px) {
  .vals-grid { grid-template-columns: 1fr; }
  .about-facts-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════
   CONTACTS — real map
═══════════════════════════════════════════ */
.ct-open-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; margin-top: 16px;
}
.ct-open-dot {
  width: 8px; height: 8px; border-radius: 50%;
  display: inline-block;
  animation: blink 2s infinite;
}
.ct-cta-row {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-top: 24px;
}
.map-frame-wrap {
  width: 100%; height: 340px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}
.map-links {
  display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap;
}
.map-link-btn {
  flex: 1;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px; font-weight: 600; color: var(--text2);
  cursor: pointer; text-decoration: none;
  transition: .2s var(--ease);
}
.map-link-btn:hover { border-color: var(--orange-brd); color: var(--orange); }

@media(max-width:860px) {
  .ct-grid { grid-template-columns: 1fr; }
  .map-frame-wrap { height: 260px; }
}

/* ═══════════════════════════════════════════
   SKELETON LOADING — page transitions
═══════════════════════════════════════════ */
@keyframes shimmer {
  0%   { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}
.skeleton {
  background: linear-gradient(90deg, var(--surface) 25%, var(--surface2) 50%, var(--surface) 75%);
  background-size: 1200px 100%;
  animation: shimmer 1.6s infinite linear;
  border-radius: 6px;
}
.sk-line  { height: 14px; margin-bottom: 10px; }
.sk-line.short { width: 40%; }
.sk-line.med   { width: 65%; }
.sk-title { height: 28px; width: 55%; margin-bottom: 16px; }
.sk-card  { height: 110px; border-radius: 12px; margin-bottom: 14px; }
.sk-hero  { height: 60px; width: 40%; margin-bottom: 14px; border-radius: 8px; }

/* Page skeleton wrapper (shown before page content) */
.page-skeleton {
  padding: 56px 0 28px;
}
.page-skeleton .container {
  display: flex; flex-direction: column; gap: 0;
}

/* Page exit / enter transitions */
.page { animation: pageSlideIn .28s var(--ease) both; }
@keyframes pageSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════
   ONBOARDING overlay
═══════════════════════════════════════════ */
#onboarding-overlay {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,.75);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; transition: opacity .35s var(--ease);
}
#onboarding-overlay.open { opacity: 1; }

.onb-box {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 36px 32px;
  max-width: 440px; width: 100%;
  text-align: center;
  transform: translateY(24px) scale(.97);
  transition: transform .35s var(--ease);
}
#onboarding-overlay.open .onb-box { transform: translateY(0) scale(1); }

.onb-logo {
  font-size: 52px; margin-bottom: 14px;
  animation: bounceIn .5s .2s var(--ease) both;
}
@keyframes bounceIn {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.15); }
  100% { transform: scale(1); opacity: 1; }
}
.onb-hi {
  font-family: 'Oswald', sans-serif;
  font-size: 26px; font-weight: 700;
  margin-bottom: 8px; line-height: 1.3;
}
.onb-hi span { color: var(--orange); }
.onb-sub {
  font-size: 13px; color: var(--text2);
  margin-bottom: 24px; line-height: 1.6;
}
.onb-features {
  display: flex; flex-direction: column; gap: 12px;
  text-align: left; margin-bottom: 28px;
}
.onb-feat {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  transition: .2s;
}
.onb-feat:hover { border-color: var(--orange-brd); }
.onb-feat-ico {
  font-size: 22px; flex-shrink: 0;
  width: 40px; height: 40px;
  background: var(--orange-dim);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
}
.onb-feat-t { font-weight: 700; font-size: 13px; }
.onb-feat-s { font-size: 11px; color: var(--text3); margin-top: 2px; }
.onb-btn { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════
   PRICING — book from row
═══════════════════════════════════════════ */
.ptbl th:last-child,
.ptbl td:last-child { width: 100px; text-align: right; }

.ptbl-price {
  font-family: 'Oswald', sans-serif;
  font-size: 15px; font-weight: 600;
  color: var(--orange); white-space: nowrap;
}
.ptbl-book-btn {
  font-size: 11px; font-weight: 700;
  padding: 5px 12px; border-radius: 6px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  color: var(--orange);
  cursor: pointer; white-space: nowrap;
  transition: .2s;
  opacity: 0;
  transform: translateX(4px);
}
.ptbl tr:hover .ptbl-book-btn {
  opacity: 1; transform: translateX(0);
}
@media(max-width:600px) {
  .ptbl-book-btn { opacity: 1; transform: none; font-size: 10px; padding: 4px 8px; }
  .ptbl th:last-child { display: none; }
  .ptbl td:last-child { padding-left: 6px; }
}

/* ═══════════════════════════════════════════
   REVIEWS — add-review form
═══════════════════════════════════════════ */
.rv-add-wrap {
  margin-top: 40px;
  max-width: 540px;
  margin-left: auto; margin-right: auto;
}
.rv-add-card {
  padding: 28px;
  text-align: center;
}
.rv-add-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 5px;
}
.rv-add-sub { font-size: 13px; color: var(--text3); margin-bottom: 18px; }

.rv-stars-pick {
  display: flex; justify-content: center; gap: 8px;
  font-size: 32px; cursor: pointer;
  margin-bottom: 14px;
}
.rv-star-btn {
  color: var(--surface2);
  transition: color .15s, transform .15s;
  user-select: none;
}
.rv-star-btn.active,
.rv-star-btn:hover { color: var(--orange); transform: scale(1.1); }

.rv-add-input {
  width: 100%; background: var(--surface);
  border: 1px solid var(--line); border-radius: 8px;
  padding: 12px 14px; font-size: 14px;
  color: var(--text); outline: none;
  font-family: 'Mulish', sans-serif;
  resize: vertical; min-height: 80px;
  transition: .2s;
}
.rv-add-input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.1); }

.rv-add-toast {
  display: none; padding: 10px 14px;
  background: rgba(34,197,94,.12); border: 1px solid rgba(34,197,94,.25);
  border-radius: 7px; color: var(--green); font-size: 13px;
  margin-top: 12px;
}
.rv-add-toast.show { display: block; animation: fadeIn .3s both; }

/* ═══════════════════════════════════════════
   SERVICE ILLUSTRATIONS — SVG icons in service cards
═══════════════════════════════════════════ */
.svc-illus {
  width: 100%; height: 80px;
  border-radius: 10px;
  background: var(--surface2);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
  overflow: hidden;
  position: relative;
}
.svc-illus svg { width: 100%; height: 100%; }

/* Push notif permission banner */
.push-banner {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  border-radius: 10px;
  margin: 0 0 16px;
  flex-wrap: wrap;
}
.push-banner-text { flex: 1; min-width: 180px; }
.push-banner-t { font-weight: 700; font-size: 13px; }
.push-banner-s { font-size: 11px; color: var(--text2); margin-top: 2px; }

/* ═══════════════════════════════════════════
   PARTS PAGE v2 — полный редизайн
═══════════════════════════════════════════ */

/* Hero */
.parts-hero {
  position: relative;
  background: var(--bg2);
  border-bottom: 1px solid var(--line);
  padding: 56px 0 48px;
  overflow: hidden;
}
.parts-hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 90% 50%, rgba(255,107,0,.06) 0%, transparent 60%),
    repeating-linear-gradient(
      -45deg,
      transparent 0px,
      transparent 24px,
      rgba(255,107,0,.025) 24px,
      rgba(255,107,0,.025) 25px
    );
  pointer-events: none;
}
.parts-hero-sub {
  font-size: 14px; color: var(--text2);
  max-width: 520px; line-height: 1.75;
  margin-top: 16px; margin-bottom: 24px;
}
.parts-hero-stats {
  display: flex; align-items: center;
  gap: 0; flex-wrap: wrap;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 24px;
  max-width: 580px;
}
.phs-item { flex: 1; min-width: 80px; text-align: center; }
.phs-num  {
  font-family: 'Oswald', sans-serif;
  font-size: 24px; font-weight: 700; line-height: 1;
}
.phs-lbl  { font-size: 10px; color: var(--text3); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-top: 4px; }
.phs-sep  { width: 1px; height: 36px; background: var(--line); flex-shrink: 0; }

/* Layout: catalog + form */
.parts-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 28px;
  align-items: start;
  padding-top: 28px;
}
@media(max-width:960px) {
  .parts-layout { grid-template-columns: 1fr; }
  .parts-form-col { order: -1; }
}

/* Search bar */
.parts-search-bar { margin-bottom: 14px; }
.parts-search-wrap {
  position: relative;
  display: flex; align-items: center;
}
.parts-search-ico {
  position: absolute; left: 14px;
  font-size: 15px; pointer-events: none;
  color: var(--text3);
}
.parts-search-input {
  width: 100%;
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 12px 44px 12px 42px;
  font-size: 14px; color: var(--text);
  outline: none; font-family: 'Mulish', sans-serif;
  transition: .2s var(--ease);
}
.parts-search-input:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,107,0,.1);
}
.parts-search-clear {
  position: absolute; right: 12px;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--surface2);
  border: 1px solid var(--line);
  font-size: 14px; color: var(--text3);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: .15s;
}
.parts-search-clear:hover { background: var(--orange-dim); color: var(--orange); }

/* Category pills */
.parts-filter-row {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 20px;
}
.parts-cat {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border-radius: 99px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  font-size: 12px; font-weight: 600; color: var(--text2);
  cursor: pointer; white-space: nowrap;
  transition: .18s var(--ease);
}
.parts-cat:hover { border-color: var(--orange-brd); color: var(--text); }
.parts-cat.active {
  background: var(--orange-dim);
  border-color: var(--orange);
  color: var(--orange);
}

/* Parts grid */
.parts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.part-card {
  padding: 16px 18px;
  display: flex; flex-direction: column; gap: 8px;
  transition: .2s var(--ease);
  cursor: default;
}
.part-card:hover {
  border-color: var(--orange-brd);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.part-head {
  display: flex; justify-content: space-between; align-items: center; gap: 6px;
}
.part-sku {
  font-size: 9px; font-weight: 700; color: var(--text3);
  letter-spacing: 1.5px; text-transform: uppercase;
  background: var(--surface2); padding: 2px 7px; border-radius: 4px;
}
.part-stock {
  font-size: 10px; font-weight: 700; letter-spacing: .3px;
  display: flex; align-items: center; gap: 4px;
  white-space: nowrap;
}
.part-stock.in  { color: var(--green); }
.part-stock.out { color: #f59e0b; }
.part-stock-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green); flex-shrink: 0;
}
.part-stock-dot.out { background: #f59e0b; animation: blink 2s infinite; }
.part-name {
  font-weight: 700; font-size: 13px; line-height: 1.35;
  flex: 1;
}
.part-note { font-size: 11px; color: var(--text3); }
.part-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: auto; padding-top: 10px;
  border-top: 1px solid var(--line); gap: 6px;
}
.part-price {
  font-family: 'Oswald', sans-serif;
  font-size: 14px; font-weight: 700; color: var(--orange);
  white-space: nowrap;
}
.part-order-btn {
  font-size: 11px; font-weight: 700;
  padding: 5px 11px; border-radius: 6px;
  background: var(--orange-dim);
  border: 1px solid var(--orange-brd);
  color: var(--orange);
  cursor: pointer; transition: .18s; white-space: nowrap;
}
.part-order-btn:hover { background: rgba(255,107,0,.22); transform: scale(1.03); }

/* Empty state */
.parts-empty {
  flex-direction: column; align-items: center;
  padding: 48px 20px; text-align: center;
  font-size: 14px; font-weight: 600;
  color: var(--text2);
}

/* ── ORDER FORM ── */
.parts-order-form {
  padding: 0;
  overflow: hidden;
  transition: box-shadow .3s var(--ease);
  position: static; top: 80px;
}
.parts-order-form.pof-highlight {
  box-shadow: 0 0 0 3px var(--orange), 0 12px 40px rgba(255,107,0,.15);
}

.pof-header {
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, var(--orange-dim), transparent);
}
.pof-title {
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; margin-bottom: 4px;
}
.pof-sub { font-size: 12px; color: var(--text2); line-height: 1.5; }

/* Selected part pill */
.pof-selected {
  margin: 16px 24px 0;
  padding: 12px 14px;
  background: rgba(255,107,0,.07);
  border: 1px solid var(--orange-brd);
  border-radius: 10px;
  position: relative;
}
.pof-sel-label { font-size: 10px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.pof-sel-name  { font-weight: 700; font-size: 14px; margin-bottom: 5px; }
.pof-sel-row   { display: flex; gap: 10px; align-items: center; }
.pof-sel-sku   { font-size: 10px; color: var(--text3); background: var(--surface2); padding: 2px 7px; border-radius: 4px; }
.pof-sel-price { font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 700; color: var(--orange); }
.pof-sel-clear {
  position: absolute; top: 10px; right: 12px;
  font-size: 12px; color: var(--text3); background: none; border: none;
  cursor: pointer; padding: 2px 6px; border-radius: 4px;
  transition: .15s;
}
.pof-sel-clear:hover { color: var(--red); background: rgba(239,68,68,.1); }

/* Form fields */
.pof-fields { padding: 16px 24px 0; display: flex; flex-direction: column; gap: 13px; }
.pof-group  { display: flex; flex-direction: column; gap: 5px; }
.pof-label  { font-size: 11px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: .8px; }
.pof-label .req { color: var(--orange); }
.pof-input  {
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: 8px;
  padding: 10px 13px;
  font-size: 13px; color: var(--text);
  outline: none; font-family: 'Mulish', sans-serif;
  transition: .18s var(--ease);
}
.pof-input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255,107,0,.1); }
.pof-input[readonly] { opacity: .6; cursor: not-allowed; }
.pof-textarea { resize: vertical; min-height: 70px; }

.pof-submit {
  margin: 18px 24px 0;
  width: calc(100% - 48px);
  justify-content: center;
  font-size: 14px; padding: 13px;
  border-radius: 10px;
}
.pof-hint {
  text-align: center;
  font-size: 11px; color: var(--text3);
  padding: 10px 24px 20px;
  line-height: 1.6;
}

/* Submit toast */
.pof-toast {
  display: none;
  margin: 0 24px 20px;
  padding: 14px 16px;
  background: rgba(34,197,94,.1);
  border: 1px solid rgba(34,197,94,.25);
  border-radius: 10px;
}
.pof-toast.show { display: block; animation: fadeIn .35s both; }
.pof-toast-inner {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 13px; color: var(--green);
}

/* Why card */
.parts-why-card {
  padding: 20px 22px;
  margin-top: 14px;
}
.pwy-title {
  font-family: 'Oswald', sans-serif;
  font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--text3);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.pwy-row {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}
.pwy-row:last-child { border-bottom: none; }
.pwy-ico {
  width: 34px; height: 34px; border-radius: 8px;
  background: var(--orange-dim);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}
.pwy-t { font-weight: 700; font-size: 13px; }
.pwy-s { font-size: 11px; color: var(--text3); margin-top: 1px; }

@media(max-width:560px) {
  .parts-hero-stats { padding: 12px 16px; }
  .phs-num { font-size: 20px; }
  .parts-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:380px) {
  .parts-grid { grid-template-columns: 1fr; }
}

/* ── Service card scroll highlight ─────────────────────── */
.svc-highlight {
  animation: svc-pulse 1.2s ease-out;
}
@keyframes svc-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,107,0,.4), var(--card-shadow, none); }
  50%  { box-shadow: 0 0 0 8px rgba(255,107,0,.15), var(--card-shadow, none); }
  100% { box-shadow: 0 0 0 0 rgba(255,107,0,0), var(--card-shadow, none); }
}

/* ── hv-card clickable ──────────────────────────────────── */
.hv-card { cursor: pointer; }

.vehicle-editor-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 14px}
.vehicle-editor-steps .step{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:16px;padding:12px 14px;display:grid;gap:4px;transition:.2s ease}
.vehicle-editor-steps .step span{width:26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);color:var(--text2);font-weight:800;font-size:12px}
.vehicle-editor-steps .step b{font-size:14px}
.vehicle-editor-steps .step small{font-size:12px;color:var(--text3)}
.vehicle-editor-steps .step.active{border-color:rgba(245,158,11,.34);box-shadow:0 16px 36px rgba(0,0,0,.22), inset 0 0 0 1px rgba(245,158,11,.12);background:linear-gradient(180deg,rgba(245,158,11,.10),rgba(255,255,255,.03))}
.vehicle-editor-steps .step.active span{background:rgba(245,158,11,.18);color:#ffd18a}
.profile-hint{font-size:13px;line-height:1.5;color:var(--text2);padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}

/* ═══════════════════════════════════════════════════════════════════
   NEWS PORTAL STYLES
═══════════════════════════════════════════════════════════════════ */
.news-page { padding-bottom: 60px; }

/* Hero section */
.news-hero-section { background: var(--bg2); border-bottom: 1px solid var(--line); padding: 56px 0 40px; }
.news-hero-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 32px; }
.news-hero-title { font-family: 'Oswald', sans-serif; font-size: clamp(32px,5vw,54px); font-weight: 700; line-height: 1.1; margin: 8px 0 10px; }
.news-hero-sub { font-size: 14px; color: var(--text2); max-width: 440px; line-height: 1.7; }
.news-stat-pills { display: flex; gap: 12px; flex-shrink: 0; }
.nsp { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 16px; text-align: center; }
.nsp span { display: block; font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; color: var(--orange); }
.nsp { font-size: 11px; color: var(--text3); margin-top: 2px; }

/* Hero cards grid */
.news-hero-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; }

/* Category bar */
.news-main { padding: 32px 0 0; }
.news-cat-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.news-cat-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 99px; border: 1.5px solid color-mix(in srgb, var(--chip-c) 40%, transparent); background: color-mix(in srgb, var(--chip-c) 8%, transparent); color: var(--text2); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .2s; white-space: nowrap; }
.news-cat-chip:hover { background: color-mix(in srgb, var(--chip-c) 16%, transparent); color: var(--chip-c); }
.news-cat-chip.active { background: var(--chip-c); color: #fff; border-color: var(--chip-c); }
.ncc-count { font-size: 11px; opacity: .75; margin-left: 2px; }

/* News grid */
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; padding-bottom: 40px; }

/* Card base */
.news-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s; }
.news-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,.18); border-color: var(--orange); }

/* Cover */
.nc-cover { height: 200px; background-size: cover; background-position: center; background-color: var(--bg2); position: relative; }
.nc-cover--sm { height: 160px; }
.nc-cover-placeholder { height: 80px; display: flex; align-items: center; justify-content: center; font-size: 32px; background: color-mix(in srgb, var(--orange) 8%, transparent); }
.nc-cover-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.65) 0%, transparent 55%); }
.nc-featured-badge { position: absolute; top: 12px; right: 12px; background: #f59e0b; color: #fff; font-size: 10px; font-weight: 700; padding: 4px 9px; border-radius: 99px; }
.nc-cover-meta { position: absolute; bottom: 12px; left: 14px; }

/* Hero card specifics */
.news-card--hero .nc-cover { height: 260px; }
.news-card--hero .nc-title--hero { font-size: 20px; }

/* Category badge */
.nc-cat-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 99px; border: 1px solid; }
.nc-cat-badge--lg { font-size: 13px; padding: 6px 14px; }

/* Card body */
.nc-body { padding: 16px 18px 18px; }
.nc-meta-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.nc-date, .nc-read-time, .nc-views { font-size: 11px; color: var(--text3); }
.nc-title { font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 700; line-height: 1.3; margin-bottom: 8px; }
.nc-intro { font-size: 13px; color: var(--text2); line-height: 1.6; }
.nc-intro--sm { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nc-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.nc-read-link { font-size: 12px; font-weight: 700; color: var(--orange); }
.nc-author-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.nc-author-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--orange)22; color: var(--orange); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; flex-shrink: 0; }
.nc-author-name { font-size: 12px; color: var(--text2); font-weight: 600; }

/* ── News Article MODAL ───────────────────────────────────────── */
.news-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.7); z-index: 8000; display: flex; align-items: flex-start; justify-content: center; padding: 20px 12px 40px; overflow-y: auto; opacity: 0; pointer-events: none; transition: opacity .25s; }
.news-modal-overlay.open { opacity: 1; pointer-events: all; }
.news-modal-box { background: var(--bg); border-radius: 18px; width: 100%; max-width: 780px; overflow: hidden; position: relative; margin: auto; box-shadow: 0 24px 80px rgba(0,0,0,.45); transform: translateY(20px); transition: transform .25s; }
.news-modal-overlay.open .news-modal-box { transform: translateY(0); }
.news-modal-close { position: absolute; top: 14px; right: 14px; z-index: 10; width: 36px; height: 36px; border-radius: 50%; background: rgba(0,0,0,.45); border: none; color: #fff; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.news-modal-close:hover { background: rgba(0,0,0,.7); }
.news-modal-cover { height: 280px; background-size: cover; background-position: center; position: relative; }
.news-modal-cover-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.15) 60%); }
.news-modal-cover-inner { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px 28px; }
.news-modal-title { font-family: 'Oswald', sans-serif; font-size: clamp(20px,3vw,32px); font-weight: 700; color: #fff; line-height: 1.2; margin-top: 10px; }
.news-modal-title-nocov { font-family: 'Oswald', sans-serif; font-size: clamp(22px,3.5vw,36px); font-weight: 700; line-height: 1.2; margin-bottom: 6px; }
.news-modal-body { padding: 24px 28px 32px; }
.news-modal-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text3); margin-bottom: 16px; }
.news-modal-author { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--surface); border-radius: 10px; border: 1px solid var(--line); margin-bottom: 20px; }
.news-modal-av { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; flex-shrink: 0; }
.news-modal-av-name { font-weight: 700; font-size: 14px; }
.news-modal-av-role { font-size: 12px; color: var(--text3); margin-top: 2px; }
.news-modal-intro { font-size: 15px; font-weight: 600; color: var(--text2); line-height: 1.7; margin-bottom: 20px; padding-left: 14px; border-left: 3px solid var(--orange); }
.news-modal-content { font-size: 15px; line-height: 1.85; color: var(--text); }
.news-modal-content h3 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 700; margin: 22px 0 10px; color: var(--text); }
.news-modal-content p { margin: 0 0 14px; }
.news-modal-content ul, .news-modal-content ol { padding-left: 20px; margin: 0 0 14px; }
.news-modal-content li { margin-bottom: 6px; }
.news-modal-content strong { font-weight: 700; }
.news-modal-content em { font-style: italic; color: var(--text2); }
.news-modal-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); }

@media (max-width: 640px) {
  .news-hero-grid { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .news-modal-cover { height: 200px; }
  .news-modal-body { padding: 18px 18px 24px; }
  .news-hero-top { flex-direction: column; align-items: flex-start; }
  .news-stat-pills { gap: 8px; }
}


.news-section-group { margin-bottom: 28px; }
.news-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin: 6px 0 18px; }
.news-section-kicker { color: var(--orange); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; }
.news-section-title { font-family: 'Oswald', sans-serif; font-size: clamp(24px, 3.2vw, 34px); line-height: 1.1; margin: 0 0 8px; }
.news-section-sub { margin: 0; color: var(--text2); max-width: 820px; line-height: 1.7; }
.news-categories-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; padding-bottom: 8px; }
.news-category-card { width: 100%; text-align: left; border: 1px solid color-mix(in srgb, var(--cat-c) 24%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--cat-c) 10%, var(--surface)) 0%, var(--surface) 100%); border-radius: 22px; padding: 22px; cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s; color: inherit; box-shadow: 0 8px 28px rgba(0,0,0,.10); }
.news-category-card:hover { transform: translateY(-4px); border-color: var(--cat-c); box-shadow: 0 16px 36px rgba(0,0,0,.16); }
.news-category-card__top { display:grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items:center; margin-bottom: 14px; }
.news-category-card__icon { width: 60px; height: 60px; border-radius: 18px; display:flex; align-items:center; justify-content:center; font-size: 28px; background: color-mix(in srgb, var(--cat-c) 16%, transparent); }
.news-category-card__label { font-size: 12px; color: var(--text3); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.news-category-card__title { font-family: 'Oswald', sans-serif; font-size: 28px; line-height: 1; }
.news-category-card__count { min-width: 58px; height: 58px; border-radius: 18px; display:flex; align-items:center; justify-content:center; background: var(--cat-c); color: #fff; font-size: 22px; font-weight: 800; }
.news-category-card__desc { color: var(--text2); line-height: 1.75; min-height: 56px; margin-bottom: 14px; }
.news-category-card__stats { display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 16px; }
.news-category-card__stats span { display:inline-flex; align-items:center; gap:6px; padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); font-size: 12px; color: var(--text2); }
.news-category-card__cta { margin-top: 14px; color: var(--cat-c); font-weight: 700; }
.news-category-focus { display:grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: stretch; border: 1px solid color-mix(in srgb, var(--cat-c) 26%, var(--line)); background: linear-gradient(135deg, color-mix(in srgb, var(--cat-c) 12%, var(--surface)) 0%, var(--surface) 72%); border-radius: 24px; padding: 22px; margin-bottom: 24px; }
.news-back-btn { margin-bottom: 16px; }
.news-category-focus__badge { display:inline-flex; align-items:center; gap:8px; padding: 8px 12px; border-radius: 999px; background: color-mix(in srgb, var(--cat-c) 16%, transparent); border: 1px solid color-mix(in srgb, var(--cat-c) 28%, transparent); color: var(--cat-c); font-weight: 700; margin-bottom: 12px; }
.news-category-focus__title { font-family: 'Oswald', sans-serif; font-size: clamp(30px, 4vw, 44px); line-height: 1; margin: 0 0 10px; }
.news-category-focus__sub { margin: 0; color: var(--text2); max-width: 760px; line-height: 1.8; }
.news-category-focus__stats { display:grid; grid-template-columns: repeat(3, minmax(110px,1fr)); gap: 12px; }
.news-category-focus__stat { min-width: 118px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid var(--line); padding: 16px 18px; }
.news-category-focus__stat strong { font-size: 28px; line-height: 1; margin-bottom: 6px; }
.news-category-focus__stat span { color: var(--text3); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.news-list-head { display:flex; align-items:center; justify-content:space-between; gap: 12px; margin: 0 0 16px; }
.news-list-head__title { font-family: 'Oswald', sans-serif; font-size: 26px; }
.news-list-head__count { min-width: 44px; height: 44px; border-radius: 14px; display:flex; align-items:center; justify-content:center; background: var(--surface2); border: 1px solid var(--line); font-weight: 800; }
.news-page--article .spa-content { padding-top: 18px; }
.news-article-shell { display: grid; gap: 22px; }
.news-article-topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.news-article-topbar-nav { display:flex; gap:10px; flex-wrap:wrap; }
.news-article-page { overflow:hidden; border-radius: 24px; border:1px solid var(--line); }
.news-article-hero { min-height: 360px; background-size: cover; background-position: center; position: relative; }
.news-article-hero__overlay { position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.16) 0%, rgba(0,0,0,.72) 100%); }
.news-article-hero__inner { position:absolute; left:0; right:0; bottom:0; padding: 30px 32px; z-index:1; }
.news-article-page__head { padding: 30px 32px 0; }
.news-article-page__title { font-family:'Oswald',sans-serif; font-size: clamp(28px, 4vw, 46px); line-height: 1.05; color:#fff; margin: 14px 0 0; }
.news-article-page__title--nohero { color: var(--text); margin-top: 14px; }
.news-article-page__body { padding: 28px 32px 34px; }
.news-article-page__meta { display:flex; flex-wrap:wrap; gap:10px 16px; color:var(--text3); font-size:12px; margin-bottom:18px; }
.news-article-page__author { display:flex; align-items:center; gap:12px; padding: 12px 16px; background:var(--surface); border:1px solid var(--line); border-radius: 14px; margin-bottom: 20px; }
.news-article-page__intro { font-size: 17px; line-height: 1.8; color: var(--text2); font-weight: 600; border-left: 4px solid var(--orange); padding-left: 16px; margin-bottom: 22px; }
.news-article-page__content { font-size:16px; line-height:1.9; }
.news-article-page__content img { max-width:100%; height:auto; border-radius:18px; margin: 18px 0; }
.news-article-more__head { margin-bottom: 16px; }
@media (max-width: 980px){
  .news-categories-grid { grid-template-columns: 1fr; }
  .news-category-focus { grid-template-columns: 1fr; }
  .news-category-focus__stats { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .news-article-hero { min-height: 280px; }
  .news-article-hero__inner, .news-article-page__body, .news-article-page__head { padding-left: 20px; padding-right: 20px; }
}
@media (max-width: 640px){
  .news-category-card { padding: 18px; border-radius: 18px; }
  .news-category-card__top { grid-template-columns: auto 1fr; }
  .news-category-card__count { grid-column: 1 / -1; width: 100%; height: 44px; border-radius: 14px; justify-content: flex-start; padding: 0 14px; }
  .news-category-card__title { font-size: 24px; }
  .news-category-focus { padding: 18px; border-radius: 18px; }
  .news-category-focus__stats { grid-template-columns: 1fr; }
  .news-list-head { align-items:flex-start; flex-direction: column; }
  .news-article-topbar, .news-article-topbar-nav { width:100%; }
  .news-article-topbar-nav .btn { flex:1; justify-content:center; }
  .news-article-page { border-radius: 18px; }
  .news-article-hero { min-height: 220px; }
  .news-article-page__title { font-size: clamp(24px, 8vw, 34px); }
  .news-article-page__intro, .news-article-page__content { font-size: 15px; }
}


.svc-cat-nav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;width:100%}
.svc-cat-nav-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;width:100%;text-align:left;padding:18px 18px;border-radius:18px;border:1px solid color-mix(in srgb, var(--fc) 26%, var(--line));background:linear-gradient(180deg,color-mix(in srgb, var(--fc) 10%, var(--surface)) 0%,var(--surface) 100%);color:inherit;cursor:pointer;transition:.2s var(--ease);box-shadow:0 10px 28px rgba(0,0,0,.10)}
.svc-cat-nav-card:hover:not(:disabled),.svc-cat-nav-card.active{transform:translateY(-2px);border-color:var(--fc);box-shadow:0 16px 34px rgba(0,0,0,.16)}
.svc-cat-nav-card:disabled{opacity:.52;cursor:not-allowed;filter:saturate(.7)}
.svc-cat-nav-card__emoji{font-size:28px;line-height:1;width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb, var(--fc) 16%, transparent);border:1px solid color-mix(in srgb, var(--fc) 24%, transparent)}
.svc-cat-nav-card__title{font-family:'Oswald',sans-serif;font-size:22px;line-height:1.05;margin-bottom:6px}
.svc-cat-nav-card__desc{font-size:12px;line-height:1.55;color:var(--text2)}
.svc-cat-nav-card__count{min-width:46px;height:46px;padding:0 10px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--fc);color:#fff;font-size:18px;font-weight:800}
.svc-cat-nav-card--price .svc-cat-nav-card__count{font-size:22px}
@media (max-width:900px){.svc-cat-nav-grid{grid-template-columns:1fr}}
@media (max-width:560px){.svc-cat-nav-card{grid-template-columns:auto 1fr;}.svc-cat-nav-card__count{grid-column:1/-1;width:100%;justify-content:flex-start;padding-left:14px}}


.parts-filter-sticky{position:static;top:78px;z-index:28;background:rgba(10,14,22,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);box-shadow:0 10px 24px rgba(0,0,0,.12)}
.parts-filter-sticky .container{padding-top:12px;padding-bottom:12px}
.pf-row-cats{margin-top:10px}
.svc-active-category{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin:0 0 18px;padding:18px 20px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(135deg,var(--surface2),var(--surface))}
.svc-active-category__badge{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:999px;background:var(--orange-dim);border:1px solid var(--orange-brd);color:var(--orange);font-weight:700}
.svc-active-category__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1;margin-bottom:6px}
.svc-active-category__desc{color:var(--text2);line-height:1.65}
.svc-active-category__count{min-width:118px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.svc-active-category__count strong{font-size:28px;line-height:1;margin-bottom:4px}
.svc-active-category__count span{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em}
.svc-cat-empty-global,.svc-cat-empty-inline{padding:18px 20px;border:1px dashed var(--line);border-radius:18px;color:var(--text2);background:rgba(255,255,255,.03)}
.svc-cat-empty-global{margin:0 0 18px}
.svc-cat-empty-inline{margin-top:14px}
.svc-cat-nav-card.is-empty{opacity:.92}
@media (max-width:900px){.svc-active-category{grid-template-columns:1fr}.parts-filter-sticky{top:68px}}
@media (max-width:560px){.parts-filter-sticky .container{padding-top:10px;padding-bottom:10px}.svc-active-category__title{font-size:24px}}

.services-level--categories{display:grid;gap:22px}.svc-cat-nav-grid--page{margin-top:8px}.services-level--category-open{display:grid;gap:22px}.svc-active-category--page{align-items:start}.svc-active-category__main{display:grid;gap:12px}.svc-cards-grid--category{margin-top:8px}
.svc-active-category__actions{display:flex;gap:10px;flex-wrap:wrap}
.booking-prefill-note{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 14px;margin-bottom:12px;border-radius:12px;border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.1);text-align:left;cursor:pointer;transition:.16s border-color,.16s background,.16s transform}
.booking-prefill-note:hover{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.42);transform:translateY(-1px)}
.booking-prefill-note__emoji{font-size:18px;line-height:1.2;font-weight:800;color:#fff}
.booking-prefill-note__title{font-weight:800;color:#fff}
.booking-prefill-note__desc{font-size:12px;color:var(--text2);margin-top:2px}
.booking-empty-services{padding:14px 16px;border-radius:12px;border:1px dashed var(--line);color:var(--text2);background:rgba(255,255,255,.03)}


@media (min-width: 631px) {
  .services-level__head { display: none !important; }
}


.about-level-cards{margin-top:28px}
.about-level-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.about-level-card{width:100%;text-align:left;border:1px solid var(--line);background:linear-gradient(180deg,var(--surface),var(--bg2));border-radius:22px;padding:22px;cursor:pointer;transition:.18s transform,.18s border-color,.18s box-shadow;color:inherit}
.about-level-card:hover{transform:translateY(-4px);border-color:var(--orange-brd);box-shadow:0 16px 34px rgba(0,0,0,.16)}
.about-level-card__icon{font-size:34px;margin-bottom:14px}
.about-level-card__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1.05;margin-bottom:10px}
.about-level-card__desc{color:var(--text2);line-height:1.75;min-height:54px}
.about-level-card__cta{margin-top:16px;color:var(--orange);font-weight:700}
.about-level-cards__head{margin-bottom:18px}
.about-level-backline{display:flex;justify-content:flex-start;margin-bottom:18px}
@media (max-width: 760px){.about-level-grid{grid-template-columns:1fr}.about-level-card{padding:18px;border-radius:18px}.about-level-card__title{font-size:24px}}


.about-route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:12px}
.about-route-card{width:100%;text-align:left;background:linear-gradient(180deg,var(--surface),var(--bg2));border:1px solid var(--line);border-radius:22px;padding:22px;cursor:pointer;transition:.18s transform,.18s box-shadow,.18s border-color;color:inherit}
.about-route-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,0,0,.18);border-color:var(--orange-brd)}
.about-route-card__icon{font-size:34px;margin-bottom:14px}
.about-route-card__title{font-family:'Oswald',sans-serif;font-size:28px;line-height:1.05;margin-bottom:10px}
.about-route-card__desc{font-size:14px;line-height:1.7;color:var(--text2);min-height:48px}
.about-route-card__cta{margin-top:14px;color:var(--orange);font-weight:700;font-size:13px}
.about-level-page{padding-top:6px}
@media (max-width: 760px){.about-route-grid{grid-template-columns:1fr}.about-route-card{padding:18px;border-radius:18px}.about-route-card__title{font-size:24px}}


.news-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom: 0; }
.news-toolbar__search { position:relative; flex:1 1 auto; min-width:0; display:flex; align-items:center; }
.news-toolbar__search .pf-search-ico { position:absolute; left:14px; z-index:2; }
.news-toolbar__search .pf-search-input { width:100%; padding-left:42px; }
.news-cats-track { display:flex; gap:10px; flex-wrap:wrap; }
@media (max-width: 720px){
  .news-toolbar { flex-direction:column; align-items:stretch; }
  .news-toolbar .pf-info-btn { width:100%; justify-content:center; }
}


.parts-detail-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.parts-breadcrumb { display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--text3); font-size:13px; }
.parts-breadcrumb__link { background:none; border:none; padding:0; color:var(--orange); cursor:pointer; font:inherit; }
.parts-breadcrumb__current { color:var(--text); font-weight:700; }
.parts-breadcrumb__sep { color:var(--text3); }
.parts-share-btn { white-space:nowrap; }
@media (max-width: 640px){
  .parts-detail-tools { align-items:flex-start; flex-direction:column; }
  .parts-share-btn { width:100%; justify-content:center; }
}

.svc-cta-note {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text3);
}


@media (max-width: 631px) {
  .news-category-focus__stats {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
  }
  .news-category-focus__stat {
    border-radius: 14px;
    padding: 12px 12px;
    min-width: 0;
  }
  .news-category-focus__stat:last-child {
    grid-column: 1 / -1;
  }
  .news-category-focus__stat strong {
    font-size: 22px;
  }
  .news-category-focus__stat span {
    font-size: 10px;
  }
}
.services-toolbar, .parts-toolbar, .about-toolbar { margin-bottom: 18px; }


/* Mobile typography regulation for inner content pages */
@media (max-width: 631px) {
  .spa-page-hero { padding-top: 12px; }
  .spa-hero-title { font-size: clamp(22px, 6.2vw, 28px) !important; line-height: 1.08; }
  .spa-hero-sub { font-size: 13px !important; line-height: 1.6; }
  .spa-hero-label { font-size: 10px !important; }
  .spa-hero-stat-num { font-size: 18px !important; }
  .spa-hero-stat-lbl { font-size: 10px !important; }

  .news-section-title,
  .services-level__title,
  .parts-category-focus__title,
  .news-category-focus__title,
  .about-level-title,
  .svc-active-category__title {
    font-size: clamp(20px, 5.8vw, 24px) !important;
    line-height: 1.12 !important;
  }

  .news-section-sub,
  .parts-category-focus__sub,
  .news-category-focus__sub,
  .about-level-sub,
  .svc-active-category__sub,
  .services-level__sub {
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .news-category-card,
  .svc-cat-nav-card,
  .part-card-v2,
  .news-card,
  .about-nav-card,
  .services-level-card,
  .news-article-page,
  .part-details-modal-card {
    border-radius: 16px !important;
  }

  .news-category-card__title,
  .svc-cat-nav-card__title,
  .about-nav-card__title,
  .services-level-card__title,
  .part-card-v2-name,
  .nc-title,
  .svc-card-title {
    font-size: 15px !important;
    line-height: 1.28 !important;
  }

  .news-category-card__desc,
  .svc-cat-nav-card__desc,
  .about-nav-card__desc,
  .services-level-card__desc,
  .part-note-v2,
  .nc-intro,
  .svc-card-sub,
  .part-details-text,
  .news-article-page__content,
  .news-article-page__intro {
    font-size: 12px !important;
    line-height: 1.58 !important;
  }

  .part-price-v2,
  .part-details-price,
  .svc-card-price,
  .news-list-head__title {
    font-size: 20px !important;
    line-height: 1.05 !important;
  }

  .part-sku-v2,
  .part-shop-v2,
  .nc-date, .nc-read-time, .nc-views,
  .news-article-page__meta,
  .svc-card-meta,
  .about-mini-meta,
  .news-category-card__label,
  .part-details-meta-card span,
  .news-list-head__count {
    font-size: 10px !important;
  }

  .part-details-meta-card strong,
  .news-modal-av-name,
  .news-article-page__author,
  .svc-card-meta strong,
  .about-team-card__name {
    font-size: 13px !important;
  }

  .btn,
  .part-details-actions .btn,
  .news-article-topbar .btn,
  .news-article-topbar-nav .btn,
  .svc-card-actions .btn,
  .part-card-v2-actions .btn {
    font-size: 12px !important;
    padding: 10px 12px !important;
    min-height: 40px;
  }

  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head,
  .services-level__head {
    padding: 14px !important;
    gap: 10px !important;
    border-radius: 16px !important;
  }

  .news-category-focus__stat,
  .parts-category-focus__stat,
  .svc-active-category__stat,
  .about-level-stat,
  .services-level__stat {
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }

  .news-category-focus__stat strong,
  .parts-category-focus__stat strong,
  .svc-active-category__stat strong,
  .about-level-stat strong,
  .services-level__stat strong {
    font-size: 18px !important;
  }

  .news-category-focus__stat span,
  .parts-category-focus__stat span,
  .svc-active-category__stat span,
  .about-level-stat span,
  .services-level__stat span {
    font-size: 10px !important;
  }

  .news-article-page__body,
  .part-details-main,
  .about-page-section,
  .services-level__body {
    gap: 12px !important;
  }
}

@media (max-width: 420px) {
  .spa-hero-title { font-size: 20px !important; }
  .news-section-title,
  .services-level__title,
  .parts-category-focus__title,
  .news-category-focus__title,
  .about-level-title,
  .svc-active-category__title { font-size: 18px !important; }

  .news-category-card__title,
  .svc-cat-nav-card__title,
  .about-nav-card__title,
  .services-level-card__title,
  .part-card-v2-name,
  .nc-title,
  .svc-card-title { font-size: 14px !important; }

  .part-price-v2,
  .part-details-price,
  .svc-card-price { font-size: 18px !important; }

  .btn,
  .part-details-actions .btn,
  .news-article-topbar .btn,
  .news-article-topbar-nav .btn,
  .svc-card-actions .btn,
  .part-card-v2-actions .btn {
    font-size: 11px !important;
    padding: 9px 10px !important;
    min-height: 38px;
  }

  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head,
  .services-level__head { padding: 12px !important; }
}


/* unified responsive UI/typography reglament for news/services/parts/about */
:root{
  --ui-h1: 28px;
  --ui-h2: 22px;
  --ui-title: 17px;
  --ui-body: 13.5px;
  --ui-meta: 11.5px;
  --ui-price: 22px;
  --ui-btn: 13px;
  --ui-pad: 16px;
  --ui-gap: 16px;
  --ui-radius: 16px;
}
@media (min-width:1440px){
  :root{
    --ui-h1: 32px;
    --ui-h2: 24px;
    --ui-title: 18px;
    --ui-body: 14px;
    --ui-meta: 12px;
    --ui-price: 24px;
    --ui-btn: 14px;
    --ui-pad: 18px;
    --ui-gap: 18px;
    --ui-radius: 18px;
  }
}
@media (max-width:1023px){
  :root{
    --ui-h1: 24px;
    --ui-h2: 20px;
    --ui-title: 16px;
    --ui-body: 13px;
    --ui-meta: 11px;
    --ui-price: 20px;
    --ui-btn: 13px;
    --ui-pad: 14px;
    --ui-gap: 14px;
    --ui-radius: 15px;
  }
}
@media (max-width:767px){
  :root{
    --ui-h1: 20px;
    --ui-h2: 17px;
    --ui-title: 14px;
    --ui-body: 12px;
    --ui-meta: 10px;
    --ui-price: 18px;
    --ui-btn: 12px;
    --ui-pad: 12px;
    --ui-gap: 12px;
    --ui-radius: 14px;
  }
}
@media (max-width:430px){
  :root{
    --ui-h1: 18px;
    --ui-h2: 16px;
    --ui-title: 13px;
    --ui-body: 11px;
    --ui-meta: 10px;
    --ui-price: 16px;
    --ui-btn: 11.5px;
    --ui-pad: 10px;
    --ui-gap: 10px;
    --ui-radius: 12px;
  }
}

.news-page .spa-hero-title,
.services-page .spa-hero-title,
.parts-page .spa-hero-title,
.about-page .spa-hero-title,
#about-page-root .spa-hero-title{font-size:var(--ui-h1)!important;line-height:1.1!important;}
.news-section-title,
.news-article-page__title,
.parts-category-focus__title,
.svc-active-category__title,
.about-level-title,
.about-card-title,
.services-level__title,
.services-level__head h2,
.parts-details-price{font-size:var(--ui-h2)!important;line-height:1.15!important;}
.news-category-card__title,
.parts-category-card__title,
.svc-card-title,
.svc-card h3,
.part-card-v2-name,
.about-card h3,
.about-link-card__title,
.news-list-head__title,
.news-article-page__title--nohero{font-size:var(--ui-title)!important;line-height:1.25!important;}
.news-section-sub,
.news-category-card__desc,
.news-category-focus__sub,
.parts-category-focus__sub,
.svc-active-category__desc,
.news-article-page__content,
.news-article-page__intro,
.part-details-text,
.part-note-v2,
.part-desc-v2,
.about-card p,
.about-level-sub,
.services-level__sub,
.svc-card-desc{font-size:var(--ui-body)!important;line-height:1.6!important;}
.news-category-card__label,
.news-category-card__latest-label,
.news-category-card__latest-date,
.news-article-page__meta,
.news-article-page__author .news-modal-av-role,
.parts-category-focus__stat span,
.svc-active-category__count span,
.part-sku-v2,
.part-shop-v2,
.part-details-section-title,
.part-details-rating,
.about-card small,
.about-level-kicker,
.services-level__kicker,
.pf-search-input::placeholder{font-size:var(--ui-meta)!important;}
.part-price-v2,
.part-details-price,
.svc-price,
.svc-card-price,
.news-category-focus__stat strong,
.parts-category-focus__stat strong,
.svc-active-category__count strong{font-size:var(--ui-price)!important;line-height:1.05!important;}
.news-toolbar .pf-search-input,
.news-toolbar .pf-search-clear,
.news-toolbar .pf-info-btn,
.news-toolbar .svc-filter-btn-label,
.parts-inline-tools .pf-search-input,
.parts-inline-tools .pf-search-clear,
.parts-inline-tools .pf-info-btn,
.parts-inline-tools .svc-filter-btn-label,
.svc-inline-tools .pf-search-input,
.svc-inline-tools .pf-search-clear,
.svc-inline-tools .pf-info-btn,
.svc-inline-tools .svc-filter-btn-label,
.about-inline-tools .pf-search-input,
.about-inline-tools .pf-search-clear,
.about-inline-tools .pf-info-btn,
.about-inline-tools .svc-filter-btn-label,
.btn,
.part-details-actions .btn,
.part-card-v2-actions .btn,
.news-article-topbar .btn{font-size:var(--ui-btn)!important;}

.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools,
.news-category-card,
.parts-category-card,
.part-card-v2,
.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.news-article-page,
.part-details-meta-card,
.about-card,
.about-link-card,
.svc-card{border-radius:var(--ui-radius)!important;}
.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools,
.news-category-card,
.parts-category-card,
.part-card-v2,
.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.news-article-page__body,
.news-article-page__head,
.part-details-meta-card,
.about-card,
.about-link-card,
.svc-card{padding:var(--ui-pad)!important;}
.news-categories-grid,
.parts-categories-grid,
.news-grid,
.svc-cards-grid,
.svc-cards-grid--category,
.about-links-grid,
.about-cards-grid{gap:var(--ui-gap)!important;}

@media (max-width:767px){
  .news-toolbar,
  .parts-inline-tools,
  .svc-inline-tools,
  .about-inline-tools{margin-bottom:12px!important;}
  .news-toolbar .pf-info-btn,
  .parts-inline-tools .pf-info-btn,
  .svc-inline-tools .pf-info-btn,
  .about-inline-tools .pf-info-btn{min-height:40px!important;padding:0 12px!important;}
  .news-toolbar .pf-search-input,
  .parts-inline-tools .pf-search-input,
  .svc-inline-tools .pf-search-input,
  .about-inline-tools .pf-search-input{min-height:40px!important;}
}
@media (max-width:430px){
  .news-page .spa-hero-title,
  .services-page .spa-hero-title,
  .parts-page .spa-hero-title,
  .about-page .spa-hero-title,
  #about-page-root .spa-hero-title{font-size:var(--ui-h1)!important;}
  .news-category-focus,
  .parts-category-focus,
  .svc-active-category,
  .about-level-head{gap:8px!important;}
  .news-article-page__body,
  .news-article-page__head{padding:var(--ui-pad)!important;}
}


/* unified spacing/card reglament for news/services/parts/about */
:root{
  --ui-toolbar-min-h: 44px;
  --ui-toolbar-gap: 14px;
  --ui-summary-pad: 18px;
  --ui-summary-gap: 16px;
  --ui-summary-stat-pad: 14px;
  --ui-card-pad: 16px;
  --ui-card-gap: 12px;
  --ui-detail-pad: 20px;
  --ui-btn-h: 42px;
  --ui-grid-gap: var(--ui-gap);
}
@media (min-width:1440px){
  :root{
    --ui-toolbar-min-h: 46px;
    --ui-toolbar-gap: 16px;
    --ui-summary-pad: 20px;
    --ui-summary-gap: 18px;
    --ui-summary-stat-pad: 16px;
    --ui-card-pad: 18px;
    --ui-card-gap: 14px;
    --ui-detail-pad: 22px;
    --ui-btn-h: 44px;
  }
}
@media (max-width:1023px){
  :root{
    --ui-toolbar-min-h: 42px;
    --ui-toolbar-gap: 12px;
    --ui-summary-pad: 16px;
    --ui-summary-gap: 14px;
    --ui-summary-stat-pad: 12px;
    --ui-card-pad: 14px;
    --ui-card-gap: 10px;
    --ui-detail-pad: 18px;
    --ui-btn-h: 40px;
  }
}
@media (max-width:767px){
  :root{
    --ui-toolbar-min-h: 40px;
    --ui-toolbar-gap: 10px;
    --ui-summary-pad: 12px;
    --ui-summary-gap: 10px;
    --ui-summary-stat-pad: 10px;
    --ui-card-pad: 12px;
    --ui-card-gap: 8px;
    --ui-detail-pad: 14px;
    --ui-btn-h: 38px;
  }
}
@media (max-width:430px){
  :root{
    --ui-toolbar-min-h: 38px;
    --ui-toolbar-gap: 8px;
    --ui-summary-pad: 10px;
    --ui-summary-gap: 8px;
    --ui-summary-stat-pad: 8px;
    --ui-card-pad: 10px;
    --ui-card-gap: 6px;
    --ui-detail-pad: 12px;
    --ui-btn-h: 36px;
  }
}

.news-toolbar,
.parts-inline-tools,
.svc-inline-tools,
.about-inline-tools{
  gap: var(--ui-toolbar-gap) !important;
  margin-bottom: var(--ui-gap) !important;
}
.news-toolbar .pf-search-input,
.parts-inline-tools .pf-search-input,
.svc-inline-tools .pf-search-input,
.about-inline-tools .pf-search-input,
.news-toolbar .pf-info-btn,
.parts-inline-tools .pf-info-btn,
.svc-inline-tools .pf-info-btn,
.about-inline-tools .pf-info-btn,
.btn,
.part-details-actions .btn,
.part-card-v2-actions .btn,
.news-article-topbar .btn,
.services-level__head .btn,
.parts-detail-tools .btn{
  min-height: var(--ui-btn-h) !important;
}

.news-category-focus,
.parts-category-focus,
.svc-active-category,
.about-level-head,
.services-level__head{
  padding: var(--ui-summary-pad) !important;
  gap: var(--ui-summary-gap) !important;
  margin-bottom: var(--ui-gap) !important;
}
.news-category-focus__stats,
.parts-category-focus__stats,
.svc-active-category__stats,
.about-level-stats{
  gap: calc(var(--ui-summary-gap) - 4px) !important;
}
.news-category-focus__stat,
.parts-category-focus__stat,
.svc-active-category__count,
.about-level-stat{
  padding: var(--ui-summary-stat-pad) !important;
  border-radius: calc(var(--ui-radius) - 2px) !important;
}

.news-category-card,
.parts-category-card,
.part-card-v2,
.svc-card,
.about-card,
.about-link-card,
.news-article-page,
.part-details-meta-card{
  padding: var(--ui-card-pad) !important;
}
.news-category-card__top,
.parts-category-card__top,
.part-card-v2,
.svc-card,
.about-card,
.about-link-card,
.part-details-main,
.news-article-shell,
.news-article-topbar{
  gap: var(--ui-card-gap) !important;
}

.news-grid,
.news-categories-grid,
.parts-grid-v2,
.parts-categories-grid,
.svc-cards-grid,
.svc-cards-grid--category,
.about-links-grid,
.about-cards-grid{
  gap: var(--ui-grid-gap) !important;
}

.news-article-page__body,
.news-article-page__head,
.news-article-hero__inner,
.part-details-layout,
.part-details-meta-card,
.parts-detail-tools,
.about-level-page,
.services-level-page{
  padding: var(--ui-detail-pad) !important;
}

.part-details-layout{gap: var(--ui-summary-gap) !important;}
.parts-detail-tools{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-card-gap)!important;flex-wrap:wrap;}
.parts-breadcrumb{gap:6px;row-gap:4px;}
.news-article-page__author{padding: var(--ui-card-pad) !important;}
.news-article-page__meta{gap: 8px 12px !important;}

@media (max-width:767px){
  .news-toolbar,
  .parts-inline-tools,
  .svc-inline-tools,
  .about-inline-tools{padding:0 !important;}
  .news-category-focus__stats,
  .parts-category-focus__stats,
  .svc-active-category__stats,
  .about-level-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .news-category-focus__stat:last-child,
  .parts-category-focus__stat:last-child,
  .svc-active-category__count:last-child,
  .about-level-stat:last-child{grid-column:1 / -1;}
  .parts-detail-tools{align-items:stretch;}
  .parts-share-btn{width:100%;justify-content:center;}
}
@media (max-width:430px){
  .news-toolbar .svc-filter-btn-label,
  .parts-inline-tools .svc-filter-btn-label,
  .svc-inline-tools .svc-filter-btn-label,
  .about-inline-tools .svc-filter-btn-label{display:none !important;}
  .news-toolbar .pf-info-btn,
  .parts-inline-tools .pf-info-btn,
  .svc-inline-tools .pf-info-btn,
  .about-inline-tools .pf-info-btn{padding-inline:10px !important;}
  .news-category-card,
  .parts-category-card,
  .part-card-v2,
  .svc-card,
  .about-card,
  .about-link-card{padding: var(--ui-card-pad) !important;}
  .parts-breadcrumb{font-size: var(--ui-meta) !important;}
}


.part-product-page .spa-content{padding-top:18px;}
.ecommerce-tools{margin-bottom:18px;}
.ecommerce-tools__actions{display:flex;gap:10px;flex-wrap:wrap;}
.product-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:22px;align-items:start;margin-bottom:18px;}
.product-gallery,.product-buybox,.product-specs,.product-details{border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 10px 24px rgba(0,0,0,.08);}
.product-gallery{padding:16px;}
.product-gallery__stage{border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#111827,#1f2937);border:1px solid rgba(255,255,255,.06);aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;}
.product-gallery__img{width:100%;height:100%;object-fit:cover;display:block;}
.product-gallery__caption{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px;}
.product-buybox{padding:22px;display:flex;flex-direction:column;gap:16px;position:sticky;top:12px;}
.product-buybox__sku{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;}
.product-buybox__title{font-family:'Oswald',sans-serif;font-size:30px;line-height:1.08;margin:6px 0 0;}
.product-buybox__rating{font-size:13px;color:var(--text2);margin-top:8px;}
.product-buybox__price{font-family:'Oswald',sans-serif;font-size:36px;line-height:1;color:var(--orange);}
.product-buybox__sub{font-size:12px;line-height:1.55;color:var(--text3);}
.product-buybox__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.product-buybox__actions .btn{min-height:46px;justify-content:center;}
.product-buybox__trust{display:grid;gap:8px;padding-top:8px;border-top:1px solid var(--line);}
.product-buybox__trust-item{font-size:12px;color:var(--text2);line-height:1.45;}
.product-buybox__shortdesc{padding:12px 14px;border-radius:14px;background:var(--bg2);font-size:13px;line-height:1.6;color:var(--text2);}
.product-content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.product-specs,.product-details{padding:20px;}
.product-card__head{margin-bottom:16px;}
.product-card__kicker{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;}
.product-card__title{font-family:'Oswald',sans-serif;font-size:24px;line-height:1.1;margin:0;}
.product-specs__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.product-spec{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--bg2);display:flex;flex-direction:column;gap:8px;}
.product-spec span{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-spec strong{font-size:14px;line-height:1.4;color:var(--text);}
.product-details__section + .product-details__section{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);}
.product-details__label{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-weight:700;}
.product-details__text,.product-details__empty{font-size:14px;line-height:1.7;color:var(--text2);}
.part-empty-card{padding:20px;border-radius:18px;}
.product-related-grid .part-card-v2{width:100%;min-width:0;}
@media (max-width: 1023px){
  .product-layout{grid-template-columns:1fr;}
  .product-buybox{position:static;}
  .product-content-grid{grid-template-columns:1fr;}
}
@media (max-width: 767px){
  #hero-part{display:none!important;}
  .ecommerce-tools{margin-bottom:12px;}
  .ecommerce-tools__actions{width:100%;display:grid;grid-template-columns:1fr 1fr;}
  .ecommerce-tools__actions .btn{min-height:40px;padding:10px 12px;font-size:12px;}
  .product-layout{gap:14px;}
  .product-gallery,.product-buybox,.product-specs,.product-details{border-radius:16px;}
  .product-gallery,.product-specs,.product-details{padding:12px;}
  .product-buybox{padding:14px;gap:12px;}
  .product-gallery__stage{border-radius:14px;aspect-ratio:16 / 13;}
  .product-buybox__title{font-size:22px;}
  .product-buybox__price{font-size:26px;}
  .product-buybox__sub,.product-buybox__trust-item,.product-buybox__shortdesc{font-size:11px;line-height:1.5;}
  .product-buybox__actions{grid-template-columns:1fr;gap:8px;}
  .product-buybox__actions .btn{min-height:42px;font-size:12px;}
  .product-card__title{font-size:18px;}
  .product-specs__grid{grid-template-columns:1fr;gap:8px;}
  .product-spec{padding:10px 12px;border-radius:12px;gap:6px;}
  .product-spec span{font-size:10px;}
  .product-spec strong{font-size:12px;}
  .product-details__text,.product-details__empty{font-size:12px;line-height:1.55;}
  .product-related-grid{gap:12px;}
}
@media (max-width: 420px){
  .parts-breadcrumb{font-size:10px;gap:4px;}
  .ecommerce-tools__actions{grid-template-columns:1fr;}
  .product-buybox__title{font-size:19px;}
  .product-buybox__price{font-size:23px;}
}


.part-product-page .spa-content{padding-top:10px;}
.product-shell{display:grid;gap:16px;}
.product-tools{margin-bottom:8px;}
.product-top{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:18px;align-items:start;}
.product-media-card,.product-buybox--shop,.product-specs,.product-details,.product-merchant{border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:none;}
.product-media-card{padding:14px;display:grid;gap:12px;}
.product-media-frame{border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#0f172a,#1f2937);border:1px solid rgba(255,255,255,.06);aspect-ratio:1/1;}
.product-media-main{display:block;width:100%;height:100%;object-fit:cover;}
.product-media-meta{display:grid;gap:10px;}
.product-media-badges{display:flex;flex-wrap:wrap;gap:8px;}
.product-media-chip{display:inline-flex;align-items:center;padding:8px 10px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);font-size:12px;color:var(--text2);line-height:1.2;}
.product-media-note{font-size:12px;color:var(--text3);line-height:1.5;}
.product-buybox--shop{padding:18px;display:grid;gap:12px;}
.product-buybox__title{font-family:'Oswald',sans-serif;font-size:26px;line-height:1.08;margin:2px 0 0;color:var(--text);}
.product-buybox__price{font-family:'Oswald',sans-serif;font-size:32px;line-height:1;color:var(--orange);}
.product-buybox__sub{font-size:13px;line-height:1.6;color:var(--text2);padding:0;margin:0;background:none;}
.product-buybox__rating{font-size:12px;color:var(--text2);}
.product-buybox__status{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--bg2);border:1px solid var(--line);}
.product-buybox__status-note{font-size:12px;line-height:1.45;color:var(--text3);}
.product-buybox__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.product-buybox__actions .btn{min-height:44px;justify-content:center;}
.product-buybox__trust{display:grid;gap:8px;padding-top:6px;}
.product-buybox__trust-item{font-size:12px;color:var(--text2);line-height:1.45;}
.product-merchant{padding:12px 14px;display:grid;gap:4px;background:var(--bg2);}
.product-merchant__label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;}
.product-merchant__name{font-size:14px;font-weight:700;color:var(--text);}
.product-merchant__meta{font-size:12px;color:var(--text3);}
.product-info-pill{padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);display:grid;gap:6px;}
.product-info-pill span{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-info-pill strong{font-size:13px;line-height:1.35;color:var(--text);}
.product-content-grid--shop{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:16px;}
.product-specs,.product-details{padding:18px;}
.product-card__title{font-family:'Oswald',sans-serif;font-size:20px;line-height:1.1;margin:0;}
.product-card__head{margin-bottom:14px;}
.product-details__text,.product-details__empty{font-size:13px;line-height:1.7;color:var(--text2);}
.product-details__section + .product-details__section{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);}
.product-specs__grid--shop{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.product-spec{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--bg2);display:grid;gap:6px;}
.product-spec span{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}
.product-spec strong{font-size:13px;line-height:1.4;color:var(--text);}
.ecommerce-related-card{border-radius:16px;box-shadow:none;}
.product-related-section .news-section-head{margin-bottom:10px;}
@media (max-width: 1023px){
  .product-top,.product-content-grid--shop{grid-template-columns:1fr;}
}
@media (max-width: 767px){
  #hero-part{display:none!important;}
  .part-product-page .spa-content{padding-top:8px;}
  .product-shell{gap:12px;}
  .product-tools{margin-bottom:4px;}
  .parts-breadcrumb{font-size:10px;gap:4px;white-space:normal;}
  .ecommerce-tools__actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .ecommerce-tools__actions .btn{min-height:38px;padding:8px 10px;font-size:11px;}
  .product-top{gap:12px;}
  .product-media-card,.product-buybox--shop,.product-specs,.product-details{border-radius:14px;}
  .product-media-card,.product-specs,.product-details{padding:10px;}
  .product-buybox--shop{padding:12px;gap:10px;}
  .product-media-frame{border-radius:12px;aspect-ratio:1/1;}
  .product-media-badges{gap:6px;}
  .product-media-chip{padding:6px 8px;font-size:10px;}
  .product-media-note{font-size:10px;line-height:1.4;}
  .product-buybox__sku{font-size:10px;}
  .product-buybox__title{font-size:18px;}
  .product-buybox__rating{font-size:11px;}
  .product-buybox__price{font-size:24px;}
  .product-buybox__sub,.product-buybox__status-note,.product-buybox__trust-item,.product-merchant__meta,.product-details__text,.product-details__empty{font-size:11px;line-height:1.55;}
  .product-buybox__status{padding:10px;border-radius:12px;}
  .product-buybox__actions{grid-template-columns:1fr 1fr;gap:8px;}
  .product-buybox__actions .btn{min-height:40px;font-size:11px;}
  .product-merchant{padding:10px 12px;border-radius:12px;}
  .product-merchant__name{font-size:12px;}
  .product-info-pill{padding:10px;border-radius:12px;gap:4px;}
  .product-info-pill span{font-size:9px;}
  .product-info-pill strong{font-size:11px;}
  .product-card__title{font-size:16px;}
  .product-card__head{margin-bottom:10px;}
  .product-specs__grid--shop{grid-template-columns:1fr;gap:8px;}
  .product-spec{padding:10px;border-radius:12px;}
  .product-spec strong{font-size:12px;}
}
@media (max-width: 420px){
  .ecommerce-tools__actions{grid-template-columns:1fr;}
  .product-buybox__actions{grid-template-columns:1fr;}
  .product-buybox__title{font-size:16px;}
  .product-buybox__price{font-size:21px;}
}

.product-gallery-thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,72px));gap:10px;}
.product-gallery-thumb{padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);cursor:pointer;aspect-ratio:1/1;transition:border-color .18s, transform .18s, box-shadow .18s;}
.product-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.product-gallery-thumb:hover{border-color:var(--orange-brd);transform:translateY(-1px);}
.product-gallery-thumb.active{border-color:var(--orange);box-shadow:0 0 0 1px rgba(255,153,0,.18);}
@media (min-width:1024px){
  .product-buybox--shop{position:sticky;top:16px;}
}
@media (max-width:1023px){
  .product-buybox--shop{position:static;}
}
@media (max-width:767px){
  .product-gallery-thumbs{grid-template-columns:repeat(auto-fit,minmax(54px,60px));gap:8px;}
  .product-gallery-thumb{border-radius:12px;}
}

.booking-categories-grid.is-hidden-by-prefill{display:none !important}


.booking-multi-picked{margin-bottom:14px;padding:12px 14px;border:1px solid rgba(245,158,11,.22);background:rgba(245,158,11,.08);border-radius:14px}
.booking-multi-picked__title{font-weight:800;color:#fff;margin-bottom:10px}
.booking-multi-picked__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.booking-multi-picked__title{margin-bottom:0}
.booking-picked-clear{border:1px solid rgba(245,158,11,.28);background:transparent;color:#fff;border-radius:999px;padding:7px 12px;font-weight:800;cursor:pointer}
.booking-picked-clear:hover{background:rgba(245,158,11,.12)}
.booking-multi-picked__note{margin-top:8px;font-size:12px;color:var(--text3)}
.booking-multi-picked__list{display:flex;flex-wrap:wrap;gap:8px}
.booking-picked-chip{border:1px solid rgba(245,158,11,.28);background:#161616;color:#fff;border-radius:999px;padding:8px 12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.booking-picked-chip span{color:var(--orange);font-size:14px;line-height:1}
.booking-service-card.active{box-shadow:0 0 0 1px rgba(245,158,11,.35) inset}

.booking-time-mode-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px}
.booking-time-mode-card{width:100%;display:flex;align-items:flex-start;gap:12px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:14px 16px;color:var(--text);cursor:pointer;transition:border-color .18s,transform .18s,box-shadow .18s}
.booking-time-mode-card:hover{border-color:var(--orange-brd);transform:translateY(-1px)}
.booking-time-mode-card.selected{border-color:var(--orange);box-shadow:0 0 0 1px rgba(255,153,0,.16) inset;background:rgba(255,153,0,.06)}
.booking-time-mode-card__emoji{font-size:20px;line-height:1;flex-shrink:0;margin-top:2px}
.booking-time-mode-card__body{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.booking-time-mode-card__title{font-weight:800;color:var(--text)}
.booking-time-mode-card__desc{font-size:12px;color:var(--text3);line-height:1.45}
.booking-time-mode-card__check{width:22px;min-width:22px;text-align:right;color:var(--orange);font-weight:900;font-size:16px}
.booking-time-mode-note{padding:12px 14px;border-radius:12px;border:1px solid rgba(255,153,0,.18);background:rgba(255,153,0,.06);font-size:13px;color:var(--text2);line-height:1.5}


.onb-next-btn{
  width:100%;
  min-height:44px;
  justify-content:center;
  margin-top:12px;
}