/* ===== Header/Footer layer (как в base.html + input.css) ===== */

:root{
  --bg:#0E1114;
  --card:#181C22;
  --accent:#F5C400;
  --accent-2:#EAECEF;
  --main:#EAECEF;
  --ink:#000000;
  --muted:#98A2AE;
  --muted-dark:#11151B;
  --muted-foreground:#98A2AE;
}

html,body{background:var(--bg);color:var(--main);}

/* логотип/название */
.footer-logo{height:56px;width:auto;}
.brand-logo{height:56px !important;width:auto;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15));}
.brand-title{
  font-family:'Oxanium',system-ui,sans-serif;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:1rem;
  line-height:1.15;
  max-width:10rem;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
@media (min-width:640px){
  .brand-title{font-size:1.15rem;max-width:12rem;}
}

/* NAV */
.nav-desktop{display:none;align-items:center;}
.main-nav{display:flex;gap:1.25rem;white-space:nowrap;}
@media (min-width:1024px){
  .nav-desktop{display:flex;}
  .main-nav{gap:2.25rem;}
}

.nav-link{
  position:relative;
  color:var(--accent-2);
  font-weight:700;
  letter-spacing:.02em;
  font-size:.95rem;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  padding:.15rem 0;
  transition:color .18s ease, transform .18s ease;
}
@media (min-width:1024px){ .nav-link{font-size:1.05rem;} }

.nav-link::after{
  content:"";
  position:absolute;
  left:0;right:0;
  bottom:-0.1rem;
  height:2px;
  border-radius:999px;
  background:var(--accent);
  transform-origin:left;
  transform:scaleX(0);
  opacity:0;
  transition:transform .2s ease, opacity .2s ease;
}
.nav-link:hover{color:var(--accent);transform:translateY(-1px);}
.nav-link:hover::after,
.nav-active::after{transform:scaleX(1);opacity:1;}
.nav-active{color:var(--accent);}

/* sticky header */
.site-header{
  position:sticky;
  top:0;
  z-index:30;
  background:var(--bg);
  color:var(--main);
  border-bottom:1px solid rgba(0,0,0,.55);
  -webkit-backdrop-filter:saturate(180%) blur(6px);
  backdrop-filter:saturate(180%) blur(6px);
}

/* mobile menu animation */
.mobile-menu{
  max-height:0;
  opacity:0;
  transform:translateY(-6px);
  pointer-events:none;
  overflow:hidden;
  transition:max-height .25s ease, opacity .25s ease, transform .25s ease;
}
.mobile-menu.is-open{
  max-height:480px;
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.mobile-nav-trigger{
  transition:transform .18s ease, opacity .18s ease;
}
.mobile-nav-trigger:active{transform:scale(.9);}
.mobile-nav-trigger.is-open{transform:rotate(90deg);}
@media (min-width:1024px){
  .mobile-nav-trigger{display:none;}
}

/* topbar */
.topbar-info{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.35rem 0;
  font-size:1.02rem;
  font-weight:600;
  letter-spacing:.02em;
}
@media (max-width:640px){
  .topbar-info{flex-direction:column;align-items:flex-start;}
}

.topbar-contacts{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.25rem;
}
@media (max-width:640px){
  .topbar-contacts{align-items:flex-start;width:100%;}
}

/* CTA pills */
.cta-link{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.3rem .9rem;
  border-radius:999px;
  background:rgba(15,23,42,.9);
  border:1px solid rgba(148,163,184,.45);
  box-shadow:0 10px 30px rgba(0,0,0,.6);
  text-decoration:none;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease;
}
.cta-link:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 40px rgba(0,0,0,.8);
  border-color:var(--accent);
  background:rgba(15,23,42,1);
}

.cta-link-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.75rem;
  height:1.75rem;
  border-radius:999px;
  background:rgba(15,23,42,1);
  font-size:.95rem;
  animation:cta-icon-pulse 1.6s ease-in-out infinite alternate;
}
.cta-link-text{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;}
.cta-link-label{
  display:block;
  font-size:.7rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:rgba(226,232,240,.8);
}
.cta-link-main{display:block;font-weight:700;font-size:.92rem;}

.cta-link--phone{color:var(--accent);}
.cta-link--address{color:#E5E7EB;}
.cta-link--phone .cta-link-icon{animation-delay:.12s;}

@keyframes cta-icon-pulse{
  0%{transform:translateY(0) scale(1);box-shadow:0 0 0 0 rgba(245,196,0,.35);}
  100%{transform:translateY(-1px) scale(1.08);box-shadow:0 0 0 8px rgba(245,196,0,0);}
}