/* Renai Hair V16 — fixed mobile conversion header.
   Desktop/tablet navigation remains unchanged. */

.mobile-header-cta{display:none}

@media (max-width:760px){
  :root{--mobile-header-h:72px}

  html{scroll-padding-top:calc(var(--mobile-header-h) + 12px)}
  body{padding-top:var(--mobile-header-h)}
  #inquiry{scroll-margin-top:calc(var(--mobile-header-h) + 12px)}

  .site-header,
  .site-header.is-scrolled{
    position:fixed!important;
    top:0;
    left:0;
    right:0;
    width:100%;
    z-index:1000;
    background:rgba(255,252,247,.965);
    border-bottom:1px solid rgba(128,91,51,.12);
    box-shadow:0 7px 24px rgba(62,39,25,.055);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }

  .nav-shell,
  .site-header.is-scrolled .nav-shell{
    height:var(--mobile-header-h)!important;
    grid-template-columns:minmax(0,1fr) auto 42px!important;
    gap:8px!important;
    align-items:center;
  }

  .brand strong{font-size:27px}
  .brand span{max-width:190px}

  .mobile-header-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 15px;
    border:1px solid rgba(151,101,39,.34);
    border-radius:999px;
    background:linear-gradient(135deg,#c89646,#a36f2b);
    color:#fff;
    font-family:Inter,system-ui,sans-serif;
    font-size:11px;
    line-height:1;
    font-weight:700;
    letter-spacing:.015em;
    white-space:nowrap;
    box-shadow:0 7px 18px rgba(137,91,31,.16);
    transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
  }
  .mobile-header-cta:active{transform:translateY(1px);box-shadow:0 4px 12px rgba(137,91,31,.13)}
  .mobile-header-cta:focus-visible{outline:2px solid #b77d31;outline-offset:3px}

  .menu-toggle{
    width:42px!important;
    height:42px!important;
    justify-self:end;
    flex:0 0 42px;
  }

  .mobile-nav{
    position:fixed!important;
    top:var(--mobile-header-h)!important;
    left:0!important;
    right:0!important;
    max-height:calc(100dvh - var(--mobile-header-h));
    overflow-y:auto;
    overscroll-behavior:contain;
    z-index:999!important;
  }
}

@media (max-width:480px){
  :root{--mobile-header-h:68px}

  .nav-shell,
  .site-header.is-scrolled .nav-shell{
    grid-template-columns:minmax(0,1fr) auto 40px!important;
    gap:6px!important;
  }

  .brand strong{font-size:24px!important;letter-spacing:-.015em}
  .brand span{display:none!important}

  .mobile-header-cta{
    min-height:38px;
    padding:0 12px;
    font-size:10.5px;
  }

  .menu-toggle{width:40px!important;height:40px!important;flex-basis:40px}
}

@media (prefers-reduced-motion:reduce){
  .mobile-header-cta{transition:none}
}