/* ===========================================================
   KAYLAR EXPERTS — Header / Ticker / Footer styles
   =========================================================== */

/* ---- Ticker ---- */
.ticker{ background:var(--brand-deep); color:rgba(255,255,255,.92); overflow:hidden; height:38px; display:flex; align-items:center; }
.tick__track{ display:flex; white-space:nowrap; will-change:transform; animation:tickmove 38s linear infinite; }
.tick__item{ display:inline-flex; align-items:center; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:0 2px; }
.tick__dot{ color:var(--mint); margin:0 22px; font-size:8px; transform:translateY(-1px); }
@keyframes tickmove{ from{ transform:translateX(0); } to{ transform:translateX(-33.333%); } }
.hdr:hover .tick__track{ animation-play-state:paused; }
@media (prefers-reduced-motion:reduce){ .tick__track{ animation:none; } }

/* ---- Header ---- */
.hdr{ position:sticky; top:0; z-index:60; }
.hdr__bar{ background:rgba(255,255,255,.86); backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid transparent; transition:.25s ease; }
.hdr--scrolled .hdr__bar{ border-bottom-color:var(--line); box-shadow:0 6px 24px rgba(12,40,42,.06); }
.hdr__inner{ display:flex; align-items:center; gap:24px; height:74px; }
.hdr--scrolled .hdr__inner{ height:66px; transition:height .25s; }
.hdr__nav{ display:flex; align-items:center; gap:4px; margin-left:14px; }
.hdr__link{ position:relative; display:inline-flex; align-items:center; padding:9px 14px; font-size:15px; font-weight:550; color:var(--ink-2); border-radius:var(--r-sm); transition:.18s; cursor:pointer; }
.hdr__link:hover{ color:var(--brand); }
.hdr__link.is-active{ color:var(--brand); }
.hdr__link.is-active::after{ content:""; position:absolute; left:14px; right:14px; bottom:1px; height:2px; background:var(--mint); border-radius:2px; }
.hdr__cta{ margin-left:auto; display:flex; }
.hdr__cta .btn{ padding:11px 20px; font-size:14.5px; }
.hdr__burger{ display:none; margin-left:auto; background:none; border:0; color:var(--ink); cursor:pointer; padding:6px; }

/* dropdown */
.hdr__hasmenu{ position:relative; }
.hdr__menu{ position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(8px); width:560px; max-width:78vw;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); padding:12px;
  opacity:0; visibility:hidden; transition:.2s ease; }
.hdr__menu.open{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.hdr__menu::before{ content:""; position:absolute; top:-14px; left:0; right:0; height:14px; }
.hdr__menugrid{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.hdr__mcard{ display:flex; gap:13px; align-items:flex-start; padding:13px; border-radius:var(--r); transition:.16s; }
.hdr__mcard:hover{ background:var(--paper-2); }
.hdr__mcard.is-active{ background:var(--mint-soft); }
.hdr__micon{ flex:none; width:40px; height:40px; border-radius:9px; background:var(--mint-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; }
.hdr__mcard b{ display:block; font-size:15px; color:var(--ink); font-weight:600; }
.hdr__mcard em{ display:block; font-style:normal; font-size:12.5px; color:var(--muted); margin-top:2px; line-height:1.4; }

/* ---- mobile nav ---- */
.mnav{ position:fixed; inset:0 0 0 0; top:0; background:#fff; z-index:55; transform:translateX(100%); transition:transform .3s cubic-bezier(.2,.7,.2,1); overflow-y:auto; padding-top:112px; }
.mnav.open{ transform:translateX(0); }
.mnav__inner{ display:flex; flex-direction:column; padding:8px var(--gutter) 40px; }
.mnav__link{ display:flex; align-items:center; justify-content:space-between; padding:18px 4px; font-size:21px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line); background:none; border-left:0; border-right:0; border-top:0; text-align:left; cursor:pointer; font-family:inherit; }
.mnav__link.is-active{ color:var(--brand); }
.mnav__acc{ width:100%; }
.mnav__sub{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s ease; }
.mnav__sub.open{ grid-template-rows:1fr; }
.mnav__sub > *{ overflow:hidden; }
.mnav__sublink{ display:flex; align-items:center; gap:12px; padding:14px 4px 14px 16px; font-size:17px; color:var(--ink-2); border-bottom:1px solid var(--line-2); }
.mnav__sublink.is-active{ color:var(--brand); }
.mnav__sublink svg{ color:var(--brand); }
.mnav__btn{ margin-top:26px; width:100%; }

/* ---- Footer ---- */
.ft{ background:var(--brand-night); color:rgba(255,255,255,.72); padding:clamp(56px,7vw,84px) 0 28px; }
.ft__top{ display:grid; grid-template-columns:1.3fr 2fr; gap:48px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,.1); }
.ft__base{ margin:18px 0 14px; font-size:14.5px; line-height:1.6; max-width:38ch; color:rgba(255,255,255,.66); }
.ft__loc{ display:flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.06em; color:#fff; font-weight:600; margin-bottom:26px; }
.ft__loc i{ color:var(--mint); font-style:normal; }
.ft__offices{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.ft__offices b{ display:block; color:#fff; font-size:13px; font-weight:600; margin-bottom:6px; }
.ft__offices span{ display:block; font-size:13.5px; line-height:1.55; color:rgba(255,255,255,.64); }
.ft__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.ft__h{ color:#fff; font-size:13px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; margin-bottom:16px; }
.ft__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.ft__list a{ font-size:14.5px; color:rgba(255,255,255,.7); transition:.16s; }
.ft__list a:hover{ color:var(--mint); }
.ft__bottom{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:24px; font-size:12.5px; color:rgba(255,255,255,.5); }

@media (max-width:1080px){
  .hdr__nav{ display:none; }
  .hdr__cta{ display:none; }
  .hdr__burger{ display:inline-flex; }
}
@media (max-width:860px){
  .ft__top{ grid-template-columns:1fr; gap:36px; }
  .ft__cols{ grid-template-columns:1fr 1fr; }
}
@media (max-width:520px){
  .ft__offices{ grid-template-columns:1fr; }
  .ft__cols{ grid-template-columns:1fr; gap:26px; }
}