/* ARACO — chrome: header, drawer, footer, mobile bar */

/* ---------------- header ---------------- */
.hdr{
  position:fixed; top:0; left:0; right:0; z-index:60;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.hdr--solid{
  background:rgba(244,242,236,.88);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom-color:var(--border);
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset;
}
.hdr-in{
  display:flex; align-items:center; gap:28px;
  height:var(--header-h);
}
.hdr--solid .hdr-in{ height:68px; }
.hdr-logo{ flex:0 0 auto; }
.hdr-logo .logo-txt{ transition:opacity .3s; }
.hdr-nav{ display:flex; gap:6px; margin-left:auto; }
.hdr-link{
  font-size:14.5px; font-weight:600; letter-spacing:.01em;
  padding:9px 14px; border-radius:2px; color:#fff;
  position:relative; transition:color .25s, background .25s;
  text-shadow:0 1px 12px rgba(0,0,0,.45);
}
.hdr--solid .hdr-link{ color:var(--ink-soft); text-shadow:none; }
.hdr-link::after{
  content:""; position:absolute; left:14px; right:14px; bottom:4px; height:1.5px;
  background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.hdr-link:hover::after, .hdr-link.is-active::after{ transform:scaleX(1); }
.hdr-link.is-active{ color:#fff; }
.hdr--solid .hdr-link.is-active{ color:var(--accent); }

.hdr-cta{ display:flex; align-items:center; gap:18px; }
.hdr-call{
  display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:14px;
  color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.45); white-space:nowrap;
}
.hdr-call svg{ color:var(--accent); }
.hdr--solid .hdr-call{ color:var(--ink); text-shadow:none; }
.hdr-btn{ padding:12px 20px; min-height:44px; font-size:14px; }

.hdr-burger{ display:none; background:none; border:0; width:46px; height:46px; padding:11px; margin-left:auto; }
.hdr-burger span{ display:block; height:2px; background:#fff; margin:5px 0; border-radius:2px; transition:.3s; box-shadow:0 1px 6px rgba(0,0,0,.4); }
.hdr--solid .hdr-burger span{ background:var(--ink); box-shadow:none; }

@media (max-width:1080px){
  .hdr-btn{ display:none; }
  .hdr-call span{ display:none; }
}
@media (max-width:880px){
  .hdr-nav, .hdr-cta{ display:none; }
  .hdr-burger{ display:block; }
  .hdr-logo .logo-txt span:last-child{ display:none; }
}

/* ---------------- drawer ---------------- */
.drawer{
  position:fixed; top:0; right:0; bottom:0; width:min(420px,86vw); z-index:90;
  background:var(--bg); transform:translateX(100%); transition:transform .42s var(--ease);
  display:flex; flex-direction:column; box-shadow:var(--shadow-lg);
}
.drawer.is-open{ transform:none; }
.drawer-scrim{ position:fixed; inset:0; z-index:80; background:rgba(15,22,38,.5); backdrop-filter:blur(2px); animation:fade .3s; }
@keyframes fade{ from{opacity:0} to{opacity:1} }
.drawer-top{ display:flex; align-items:center; justify-content:space-between; height:68px; border-bottom:1px solid var(--border); }
.drawer-x{ background:none; border:1px solid var(--border-2); width:42px; height:42px; border-radius:2px; display:grid; place-items:center; color:var(--ink); }
.drawer-x svg{ width:20px; height:20px; }
.drawer-nav{ display:flex; flex-direction:column; padding:8px 0; flex:1; }
.drawer-link{
  display:flex; align-items:center; gap:16px; padding:19px var(--gut);
  font-family:var(--font-head); font-size:23px; font-weight:700; color:var(--ink);
  border-bottom:1px solid var(--border); transition:background .2s, color .2s;
}
.drawer-link .idx{ color:var(--faint); font-size:12px; }
.drawer-link:hover, .drawer-link.is-active{ background:var(--surface); color:var(--accent); }
.drawer-link:hover .idx, .drawer-link.is-active .idx{ color:var(--accent); }
.drawer-foot{ padding-block:22px; display:flex; flex-direction:column; gap:14px; background:var(--bg-deep); }
.drawer-contact{ display:inline-flex; align-items:center; gap:11px; font-weight:600; color:var(--ink); }
.drawer-contact svg{ width:18px; height:18px; color:var(--accent); }

/* ---------------- footer ---------------- */
.ftr{ padding-block:clamp(56px,7vw,88px) 28px; }
.ftr-grid{ display:grid; grid-template-columns:1.7fr 1fr 1fr 1.3fr; gap:48px; }
.ftr-tag{ color:rgba(234,235,239,.6); margin-top:22px; max-width:38ch; font-size:15.5px; line-height:1.7; }
.ftr-social{ display:flex; gap:12px; margin-top:24px; }
.ftr-social a{ width:42px; height:42px; border:1px solid rgba(255,255,255,.18); border-radius:2px; display:grid; place-items:center; color:rgba(255,255,255,.7); transition:.3s; }
.ftr-social a:hover{ background:var(--accent); border-color:var(--accent); color:#fff; transform:translateY(-2px); }
.ftr-h{ font-family:var(--font-mono); font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:700; margin-bottom:20px; }
.ftr-col{ display:flex; flex-direction:column; gap:13px; }
.ftr-link{ color:rgba(234,235,239,.66); font-size:15px; transition:color .2s, padding .2s; width:fit-content; }
.ftr-link:hover{ color:#fff; }
.ftr-link--lg{ font-size:20px; font-weight:600; color:#fff; font-family:var(--font-head); letter-spacing:.01em; }
.ftr-addr{ color:rgba(234,235,239,.66); font-size:15px; line-height:1.75; margin-bottom:16px; }
.ftr-rule{ height:1px; background:rgba(255,255,255,.12); border:0; margin:clamp(40px,5vw,64px) 0 22px; }
.ftr-base{ display:flex; justify-content:space-between; gap:16px; font-size:13px; color:rgba(234,235,239,.45); font-family:var(--font-mono); letter-spacing:.04em; }

@media (max-width:880px){
  .ftr-grid{ grid-template-columns:1fr 1fr; gap:40px 32px; }
  .ftr-brand{ grid-column:1/-1; }
}
@media (max-width:560px){
  .ftr-grid{ grid-template-columns:1fr; }
  .ftr-base{ flex-direction:column; gap:6px; }
}

/* ---------------- mobile action bar ---------------- */
.mbar{ display:none; }
@media (max-width:880px){
  .mbar{
    display:grid; grid-template-columns:1fr 1fr 1.5fr; gap:1px;
    position:fixed; left:0; right:0; bottom:0; z-index:70;
    background:var(--border); border-top:1px solid var(--border);
    box-shadow:0 -8px 24px rgba(25,36,58,.12);
    padding-bottom:env(safe-area-inset-bottom,0);
  }
  .mbar-btn{
    display:flex; align-items:center; justify-content:center; gap:8px;
    background:var(--surface); color:var(--ink); font-weight:600; font-size:14px;
    min-height:56px; padding:8px;
  }
  .mbar-btn svg{ width:18px; height:18px; color:var(--accent); }
  .mbar-btn--accent{ background:var(--accent); color:#fff; }
  .mbar-btn--accent svg{ color:#fff; }
  body{ padding-bottom:57px; }
  .drawer-foot{ padding-bottom:78px; }
}
