/* COSTAN V4.6 TRUE COMMON HEADER + FOOTER */
:root{
  --costan-font-display:'Michroma','Space Grotesk',sans-serif;
  --costan-font-body:'Space Grotesk',Arial,sans-serif;
  --costan-lime:#caff18;
  --costan-line:rgba(255,255,255,.11);
}
.common-topbar{
  height:30px!important;display:flex!important;align-items:center!important;justify-content:center!important;
  padding:0 18px!important;background:#000!important;color:#969690!important;border-bottom:1px solid rgba(255,255,255,.07)!important;
  font-family:var(--costan-font-display)!important;font-size:7px!important;line-height:1!important;letter-spacing:.14em!important;text-transform:uppercase!important;
}
.common-header{
  height:86px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;gap:24px!important;padding:0 clamp(18px,4vw,64px)!important;
  background:#050505!important;border-bottom:1px solid var(--costan-line)!important;position:relative!important;z-index:100!important;
}
.common-nav,.common-tools{display:flex!important;align-items:center!important;gap:24px!important}.common-tools{justify-content:flex-end!important}
.common-nav a,.common-tools a,.common-menu-btn{
  color:#f4f4ef!important;font-family:var(--costan-font-display)!important;font-size:9px!important;line-height:1!important;
  letter-spacing:.07em!important;text-transform:uppercase!important;text-decoration:none!important;white-space:nowrap!important;
}
.common-nav a:hover,.common-tools a:hover{color:var(--costan-lime)!important}
.common-logo{display:block!important;justify-self:center!important}.common-logo img{width:200px!important;height:auto!important;display:block!important}
.common-bag-count{display:inline-flex!important;min-width:18px!important;height:18px!important;align-items:center!important;justify-content:center!important;margin-left:4px!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:50%!important;font-family:var(--costan-font-body)!important;font-size:9px!important}
.common-menu-btn{display:none!important;background:transparent!important;border:0!important;padding:0!important;cursor:pointer!important}
.common-mobile-nav{display:none!important;background:#080808!important;border-bottom:1px solid var(--costan-line)!important;padding:12px 18px 18px!important;position:relative!important;z-index:99!important}
.common-mobile-nav a{display:block!important;padding:11px 0!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.07)!important;font-family:var(--costan-font-display)!important;font-size:9px!important;letter-spacing:.06em!important;text-transform:uppercase!important;text-decoration:none!important}

.common-footer{padding:62px clamp(18px,4.5vw,72px) 26px!important;background:#050505!important;border-top:1px solid var(--costan-line)!important;color:#f4f4ef!important;font-family:var(--costan-font-body)!important}
.common-footer-grid{display:grid!important;grid-template-columns:1.4fr 1fr 1fr 1fr!important;gap:42px!important}
.common-footer-brand img{width:210px!important;height:auto!important;display:block!important;margin-bottom:18px!important}.common-footer-brand p{max-width:440px!important;margin:0!important;color:#808079!important;font-size:15px!important;line-height:1.68!important}
.common-footer-col h4{margin:0 0 13px!important;color:#777!important;font-family:var(--costan-font-display)!important;font-size:9px!important;font-weight:400!important;letter-spacing:.11em!important;text-transform:uppercase!important}
.common-footer-col a{display:block!important;padding:5px 0!important;color:#c8c8c1!important;font-family:var(--costan-font-body)!important;font-size:13px!important;line-height:1.6!important;text-decoration:none!important}.common-footer-col a:hover{color:var(--costan-lime)!important}
.common-footer-bottom{display:flex!important;justify-content:space-between!important;gap:20px!important;margin-top:44px!important;padding-top:17px!important;border-top:1px solid var(--costan-line)!important;color:#686862!important;font-family:var(--costan-font-display)!important;font-size:7px!important;letter-spacing:.08em!important;text-transform:uppercase!important}
@media(max-width:900px){
  .common-header{height:76px!important;grid-template-columns:auto 1fr auto!important;padding:0 18px!important;gap:15px!important}
  .common-menu-btn{display:block!important;grid-column:1!important}.common-nav{display:none!important}.common-logo{grid-column:2!important;justify-self:center!important}.common-logo img{width:155px!important}
  .common-tools{grid-column:3!important;gap:12px!important}.common-tools a:first-child,.common-tools a:nth-child(2){display:none!important}.common-tools a{font-size:8px!important}
  .common-mobile-nav.open{display:block!important}
  .common-footer-grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:700px){.common-footer-grid{grid-template-columns:1fr!important}.common-footer-bottom{display:block!important;line-height:2!important}}


/* =========================================================
   COSTAN V5 — FINAL TRUE COMMON HEADER SIZE
   Same exact header dimensions on every public page.
   ========================================================= */
.common-topbar{
  height:30px!important;
  min-height:30px!important;
  padding:0 18px!important;
}
.common-header{
  width:100%!important;
  height:82px!important;
  min-height:82px!important;
  max-height:82px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:22px!important;
  padding:0 36px!important;
  margin:0!important;
}
.common-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:82px!important;
}
.common-logo img{
  width:190px!important;
  max-width:190px!important;
  height:auto!important;
  max-height:42px!important;
  object-fit:contain!important;
}
.common-nav,.common-tools{
  height:82px!important;
  display:flex!important;
  align-items:center!important;
}
.common-nav a,.common-tools a,.common-menu-btn{
  font-size:12px!important;
  line-height:1!important;
  font-family:var(--ct-font-heading,'Michroma','Space Grotesk',sans-serif)!important;
}
.common-bag-count{
  min-width:20px!important;
  height:20px!important;
  font-size:11px!important;
}

/* Footer font scale aligned with the website typography */
.common-footer-brand p,
.common-footer-col a{
  font-size:18px!important;
  line-height:1.65!important;
}
.common-footer-col h4{
  font-size:20px!important;
  line-height:1.3!important;
}
.common-footer-bottom{
  font-size:12px!important;
  line-height:1.5!important;
}

/* ---------- tablet ---------- */
@media(max-width:1024px){
  .common-header{
    height:76px!important;
    min-height:76px!important;
    max-height:76px!important;
    padding:0 22px!important;
    grid-template-columns:auto 1fr auto!important;
  }
  .common-logo{height:76px!important}
  .common-logo img{width:165px!important;max-width:165px!important;max-height:38px!important}
  .common-nav{display:none!important}
  .common-menu-btn{display:block!important}
  .common-tools{
    height:76px!important;
    gap:14px!important;
  }
  .common-tools a{
    font-size:11px!important;
  }
  .common-mobile-nav.open{display:block!important}
}

/* ---------- mobile ---------- */
@media(max-width:700px){
  .common-topbar{
    height:26px!important;
    min-height:26px!important;
    font-size:9px!important;
    padding:0 10px!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  .common-header{
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
    padding:0 14px!important;
    gap:10px!important;
  }
  .common-menu-btn{
    display:block!important;
    font-size:11px!important;
  }
  .common-logo{height:68px!important}
  .common-logo img{
    width:145px!important;
    max-width:145px!important;
    max-height:34px!important;
  }
  .common-tools{
    height:68px!important;
    gap:8px!important;
  }
  .common-tools a{
    font-size:10px!important;
  }
  .common-tools a:first-child,
  .common-tools a:nth-child(2){
    display:none!important;
  }
  .common-bag-count{
    min-width:18px!important;
    height:18px!important;
    font-size:10px!important;
  }

  .common-mobile-nav{
    padding:8px 14px 14px!important;
  }
  .common-mobile-nav a{
    font-size:12px!important;
    padding:13px 0!important;
  }

  .common-footer{
    padding:48px 18px 22px!important;
  }
  .common-footer-grid{
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  .common-footer-brand img{
    width:170px!important;
  }
  .common-footer-brand p,
  .common-footer-col a{
    font-size:16px!important;
    line-height:1.6!important;
  }
  .common-footer-col h4{
    font-size:18px!important;
  }
  .common-footer-bottom{
    font-size:11px!important;
    display:block!important;
  }
}


/* COSTAN V5.1 header sizing */
.common-topbar{
  font-size:10px!important;
  letter-spacing:.13em!important;
}
.common-logo img{
  width:225px!important;
  max-width:225px!important;
  max-height:48px!important;
}
@media(max-width:1024px){
  .common-logo img{
    width:185px!important;
    max-width:185px!important;
    max-height:42px!important;
  }
  .common-topbar{font-size:9px!important}
}
@media(max-width:700px){
  .common-logo img{
    width:158px!important;
    max-width:158px!important;
    max-height:38px!important;
  }
  .common-topbar{
    font-size:9px!important;
    letter-spacing:.08em!important;
  }
}

/* V6.9 GLOBAL HEADER ICONS + SEARCH */
.common-icon-btn{width:42px;height:42px;padding:0!important;border:0;background:transparent;color:#f4f4ef!important;display:inline-flex!important;align-items:center;justify-content:center;position:relative;cursor:pointer;text-decoration:none!important}
.common-icon-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.common-icon-btn:hover{color:var(--costan-lime)!important}.common-icon-btn .common-bag-count{position:absolute;right:-2px;top:1px;margin:0!important;background:#050505}.common-tools{gap:10px!important}
.common-search-overlay{position:fixed;inset:0;z-index:9999;background:rgba(4,4,4,.98);display:flex;align-items:flex-start;justify-content:center;padding:16vh 6vw 6vw;opacity:0;visibility:hidden;transition:.25s}.common-search-overlay.open{opacity:1;visibility:visible}.common-search-overlay form{width:min(900px,100%)}.common-search-overlay label{font-family:var(--costan-font-display);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#888}.search-line{display:grid;grid-template-columns:1fr 54px;border-bottom:1px solid #555;margin-top:18px}.search-line input{width:100%;background:transparent;border:0;outline:0;color:#fff;font:400 clamp(30px,6vw,72px)/1.15 var(--costan-font-body);padding:12px 0 18px}.search-line button,.search-close{border:0;background:transparent;color:#fff;cursor:pointer}.search-line svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5}.search-close{position:absolute;right:32px;top:24px;font-size:42px;font-weight:200}
@media(max-width:700px){.common-tools{display:flex!important;gap:2px!important}.common-icon-btn{width:32px;height:38px}.common-icon-btn svg{width:19px;height:19px}.common-icon-btn .common-bag-count{min-width:16px!important;height:16px!important;font-size:8px!important;right:-1px;top:2px}.common-header{grid-template-columns:auto 1fr auto!important}.common-search-overlay{padding:18vh 20px 30px}.search-close{right:18px;top:18px}}