/* Shared SP Studios navigation: one desktop layout and the same mobile menu on every public page. */
.site-header {
  width: var(--page, min(1320px, calc(100% - 100px)));
  max-width: 1320px;
  height: 84px;
  min-height: 84px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(10px, 1vw, 18px);
  position: relative;
  z-index: 100;
  overflow: visible;
  border-bottom: 1px solid var(--line, rgba(245,245,243,.2));
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: clamp(11px, .75vw, 13px);
}
.site-header > .wordmark {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  width: max-content;
  margin: 0;
  flex: 0 0 auto;
  white-space: nowrap;
  line-height: 1.2;
}
.site-header > .mobile-menu-toggle { display: none; }
.site-header > nav#site-navigation {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  align-self: center;
  display: flex !important;
  flex: 0 0 auto;
  flex-direction: row !important;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 1.15vw, 22px);
  width: max-content;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  position: static;
  order: 0;
  font: inherit;
  white-space: nowrap;
}
.site-header > nav#site-navigation > a,
.site-header > nav#site-navigation > details {
  flex: 0 0 auto;
  white-space: nowrap;
}
.site-header > nav#site-navigation > a {
  display: inline-flex;
  align-items: center;
  color: inherit;
}
.site-header > nav#site-navigation details.nav-company {
  position: relative;
}
.site-header > nav#site-navigation details.nav-company > summary {
  display: block;
  position: relative;
  list-style: none;
  cursor: pointer;
  color: #d0d0c9;
  outline-offset: 5px;
  white-space: nowrap;
}
.site-header > nav#site-navigation details.nav-company > summary::-webkit-details-marker { display: none; }
.site-header > nav#site-navigation details.nav-company > summary::before {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -7px;
  height: 1px;
  background: currentColor;
  transition: right .25s ease;
}
.site-header > nav#site-navigation details.nav-company:hover > summary::before,
.site-header > nav#site-navigation details.nav-company:focus-within > summary::before,
.site-header > nav#site-navigation details.nav-company.has-current-page > summary::before { right: 0; }
.site-header > nav#site-navigation details.nav-company.has-current-page > summary {
  color: var(--accent, #f5f5f3);
}
.site-header > nav#site-navigation .nav-company-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: -14px;
  z-index: 110;
  width: 200px;
  display: flex !important;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 7px;
  border: 1px solid var(--line, rgba(245,245,243,.2));
  background: #171815;
  box-shadow: 0 14px 34px rgba(0,0,0,.38);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: none;
  transition: opacity .16s ease, visibility 0s linear 1s;
}
.site-header > nav#site-navigation details.nav-company:hover > .nav-company-menu,
.site-header > nav#site-navigation details.nav-company:focus-within > .nav-company-menu,
.site-header > nav#site-navigation details.nav-company[open] > .nav-company-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s, 0s;
}
.site-header > nav#site-navigation .nav-company-menu > a {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 13px;
  color: #d0d0c9;
  font-size: inherit;
  white-space: nowrap;
  text-decoration: none;
}
.site-header > nav#site-navigation .nav-company-menu > a:hover,
.site-header > nav#site-navigation .nav-company-menu > a[aria-current="page"] {
  background: #22231f;
  color: var(--accent, #f5f5f3);
}
.site-header > .site-header-actions {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(12px, 1.5vw, 24px);
  min-width: 0;
}
.site-header-actions > .nav-contact {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  position: relative;
  inset: auto;
  margin: 0;
  white-space: nowrap;
}
 .site-header-actions .nav-account-trigger {
  appearance: none;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #f5f5f3;
  cursor: pointer;
  transition: color .22s ease, transform .3s cubic-bezier(.2,.78,.22,1), filter .24s ease;
}
.site-header-actions .nav-account-trigger svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.site-header-actions .nav-account-trigger:hover {
  color: var(--accent, #b9e7ee);
  transform: translateY(-2px);
}
.site-header-actions .nav-account-trigger:focus-visible {
  outline: 1px solid rgba(185,231,238,.55);
  outline-offset: 3px;
}
.site-header > .site-header-actions > .store-account-control {
  flex: 0 0 38px;
  width: 38px;
  height: 40px;
}
.site-header .sp-header-voice-trigger {
  appearance: none;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #f5f5f3;
  cursor: pointer;
  transition: color .22s ease, transform .3s cubic-bezier(.2,.78,.22,1), filter .24s ease;
}
.site-header .sp-header-voice-trigger svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.site-header .sp-header-voice-trigger:hover:not(:disabled) { color: var(--accent, #b9e7ee); transform: translateY(-2px); }
.site-header .sp-header-voice-trigger:focus-visible { outline: 1px solid rgba(185,231,238,.55); outline-offset: 3px; }
.site-header .sp-header-voice-trigger:disabled { opacity: .55; cursor: wait; }
.site-header > .mobile-menu-toggle {
  border-radius: 0;
}
@media (max-width: 1024px) {
  .site-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-rows: auto auto;
    align-items: center;
    justify-content: initial;
    gap: 10px;
    width: var(--page, calc(100% - 36px));
    height: auto;
    min-height: 74px;
    margin: 0 auto;
    padding: 15px 0;
  }
  .site-header > .wordmark { grid-column: 1; grid-row: 1; order: 0; margin: 0; }
  .site-header > .mobile-menu-toggle {
    grid-column: 3;
    grid-row: 1;
    order: 0;
    display: flex;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0;
    border: 1px solid rgba(245,245,243,.32);
    background: transparent;
    color: #f5f5f3;
    cursor: pointer;
    touch-action: manipulation;
  }
  .mobile-menu-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    background: currentColor;
    transition: transform .18s ease, opacity .18s ease;
  }
  .site-header.mobile-menu-open > .mobile-menu-toggle span:first-child { transform: translateY(7px) rotate(45deg); }
  .site-header.mobile-menu-open > .mobile-menu-toggle span:nth-child(2) { opacity: 0; }
  .site-header.mobile-menu-open > .mobile-menu-toggle span:last-child { transform: translateY(-7px) rotate(-45deg); }
  .site-header > nav#site-navigation {
    display: none !important;
    grid-column: 1 / -1;
    grid-row: 2;
    order: 0;
    flex: 0 0 100%;
    flex-direction: column !important;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 4px 0 0;
    padding: 8px 0 10px;
    border-top: 1px solid var(--line, rgba(245,245,243,.2));
    position: static;
    white-space: normal;
  }
  .site-header.mobile-menu-open > nav#site-navigation { display: flex !important; }
  .site-header > nav#site-navigation > a,
  .site-header > nav#site-navigation details > summary {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 10px 4px;
    color: #f5f5f3;
    text-decoration: none;
  }
  .site-header > nav#site-navigation > a { width: 100%; }
  .site-header > nav#site-navigation details.nav-company { position: static; }
  .site-header > nav#site-navigation details.nav-company:not([open]) > .nav-company-menu { display: none !important; }
  .site-header > nav#site-navigation details.nav-company[open] > .nav-company-menu {
    position: static;
    inset: auto;
    display: flex !important;
    flex-direction: column;
    gap: 0;
    width: auto;
    min-width: 0;
    margin: 0 0 10px 10px;
    padding: 0 0 0 14px;
    border: 0;
    border-left: 1px solid rgba(245,245,243,.24);
    background: transparent;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
    transition: none;
  }
  .site-header > nav#site-navigation details.nav-company > summary::before { display: none; }
  .site-header > nav#site-navigation .nav-company-menu > a {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 8px 4px;
    color: #bdbdb6;
    text-decoration: none;
  }
  .site-header > .site-header-actions { grid-column: 2; grid-row: 1; order: 0; margin: 0; gap: 8px; flex: 0 0 auto; }
  .site-header > .mobile-menu-toggle { margin: 0; align-self: center; }
  .site-header-actions > .nav-contact { display: none !important; }
  .site-header-actions > .nav-account-trigger { flex-basis: 40px; width: 40px; height: 42px; }
  .site-header .sp-header-voice-trigger { flex-basis: 34px; width: 34px; height: 38px; }
}
.site-nav-contact-mobile{display:none}
@media (max-width: 1024px){.site-header > nav#site-navigation > .site-nav-contact-mobile{display:flex;align-items:center;min-height:46px;margin-top:8px;padding:12px 4px;border-top:1px solid rgba(245,245,243,.2);color:#f5f5f3;font:600 11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-decoration:none}}
.sp-contact-dialog{position:fixed;z-index:100500;inset:0;display:grid;place-items:center;padding:18px;background:rgba(0,0,0,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#f5f5f3;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
.sp-contact-dialog[hidden]{display:none}
.sp-contact-panel{width:min(700px,100%);max-height:min(90dvh,820px);overflow:auto;border:1px solid rgba(245,245,243,.24);background:#111210;box-shadow:0 28px 100px rgba(0,0,0,.6)}
.sp-contact-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:26px 30px 20px;border-bottom:1px solid rgba(245,245,243,.16)}
.sp-contact-eyebrow{margin:0 0 12px;color:#aaa9a3;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}
.sp-contact-head h2{margin:0;font-size:clamp(32px,5vw,48px);line-height:1;letter-spacing:-.055em}
.sp-contact-close{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid rgba(245,245,243,.3);background:transparent;color:inherit;font-size:25px;cursor:pointer}
.sp-contact-body{padding:22px 30px 30px}.sp-contact-body>p{margin:0 0 22px;color:#c9c8c3;line-height:1.55;max-width:58ch}
.sp-contact-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sp-contact-form label{display:grid;gap:8px;color:#e7e6e1;font:13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}
.sp-contact-form label>span{color:#a9e8e8}.sp-contact-form label small{display:inline;color:#989891;font:inherit;letter-spacing:0}
.sp-contact-form input,.sp-contact-form textarea{width:100%;min-height:48px;box-sizing:border-box;border:1px solid rgba(245,245,243,.22);border-radius:0;background:#1b1c19;color:#f5f5f3;padding:12px 13px;font:16px/1.45 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:normal;outline:none}
.sp-contact-form textarea{min-height:112px;resize:vertical}.sp-contact-form input:focus,.sp-contact-form textarea:focus{border-color:#a9e8e8;box-shadow:0 0 0 1px #a9e8e8}.sp-contact-form .sp-contact-message,.sp-contact-form .sp-contact-note,.sp-contact-form .sp-contact-submit{grid-column:1/-1}
.sp-contact-note{margin:0;color:#aaa9a3;font-size:12px;line-height:1.5}.sp-contact-submit{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:50px;padding:0 16px;border:1px solid #f5f5f3;background:#f5f5f3;color:#111210;font:600 11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;cursor:pointer}.sp-contact-submit:hover{background:#a9e8e8;border-color:#a9e8e8}
@media(max-width:600px){.sp-contact-dialog{padding:10px}.sp-contact-panel{max-height:92dvh}.sp-contact-head{padding:20px 18px 16px}.sp-contact-body{padding:18px}.sp-contact-form{grid-template-columns:1fr;gap:13px}.sp-contact-form .sp-contact-message,.sp-contact-form .sp-contact-note,.sp-contact-form .sp-contact-submit{grid-column:auto}}
@media (prefers-reduced-motion: reduce) {
  .mobile-menu-toggle span,
  .site-header > nav#site-navigation details.nav-company > summary::before { transition: none; }
}
@media(max-width:760px){.store-mobile-decorative-arrow{display:none!important}}

/* Wide, hover-first navigation panels used across the main SP Studios site. */
.site-header>nav#site-navigation details.nav-mega{position:static!important}
.site-header>nav#site-navigation details.nav-mega>.nav-mega-menu{
  position:absolute!important;top:calc(100% - 1px)!important;right:auto!important;bottom:auto!important;left:50%!important;z-index:1201!important;
  display:block!important;width:100vw!important;min-width:100vw!important;max-width:100vw!important;max-height:calc(100svh - 84px);box-sizing:border-box;
  margin:0!important;padding:0!important;overflow:auto;border:0!important;border-top:1px solid rgba(245,245,243,.13)!important;border-bottom:1px solid rgba(245,245,243,.16)!important;
  background:#171815!important;box-shadow:0 26px 52px rgba(0,0,0,.36)!important;opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(-50%,9px)!important;transition:opacity .26s ease,transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s linear .32s!important
}
.site-header>nav#site-navigation details.nav-mega:hover>.nav-mega-menu,
.site-header>nav#site-navigation details.nav-mega:focus-within>.nav-mega-menu,
.site-header>nav#site-navigation details.nav-mega[open]>.nav-mega-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)!important;transition-delay:0s!important}
.site-header>nav#site-navigation details.nav-mega>summary{color:#c9c9c2;transition:color .2s ease}
@media(min-width:1025px){.site-header>nav#site-navigation details.nav-mega>summary::after{display:none!important}}
.site-header>nav#site-navigation details.nav-mega:hover>summary,
.site-header>nav#site-navigation details.nav-mega:focus-within>summary,
.site-header>nav#site-navigation details.nav-mega.has-current-page>summary{color:#f5f5f3}
@media(min-width:1025px){.site-header>nav#site-navigation{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(13px,.95vw,15px);font-weight:450;letter-spacing:-.015em}}
.site-header>nav#site-navigation .nav-mega-inner{display:grid;grid-template-columns:minmax(250px,.94fr) minmax(0,1.3fr);gap:clamp(36px,7vw,110px);width:min(1320px,calc(100% - clamp(48px,9vw,160px)));min-height:min(78svh,720px);box-sizing:border-box;margin:0 auto;padding:clamp(36px,4.5vw,64px) 0 clamp(44px,5.5vw,78px)}
.site-header>nav#site-navigation .nav-mega-lead{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.site-header>nav#site-navigation .nav-mega-eyebrow,.site-header>nav#site-navigation .nav-mega-column-title{margin:0 0 18px;color:#85867f;font:500 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase}
.site-header>nav#site-navigation .nav-mega-description{max-width:36ch;margin:0 0 24px;color:#9a9b94;font:14px/1.55 Inter,ui-sans-serif,system-ui,sans-serif;white-space:normal}
.site-header>nav#site-navigation .nav-mega-featured{display:flex;flex-direction:column;align-items:stretch;gap:9px;width:100%}
.site-header>nav#site-navigation .nav-mega-featured-link{display:flex;align-items:baseline;justify-content:space-between;gap:20px;color:#f2f2ee;font:560 clamp(25px,2.5vw,38px)/1.06 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.055em;text-decoration:none;white-space:normal;transition:color .2s ease,transform .24s cubic-bezier(.2,.7,.2,1)}
.site-header>nav#site-navigation .nav-mega-featured-link span{flex:0 0 auto;color:#85867f;font:15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;transition:color .2s ease,transform .24s ease}
.site-header>nav#site-navigation .nav-mega-featured-link:hover,.site-header>nav#site-navigation .nav-mega-featured-link[aria-current="page"]{color:#fff;transform:translateX(3px)}
.site-header>nav#site-navigation .nav-mega-featured-link:hover span{color:#f5f5f3;transform:translate(2px,-2px)}
.site-header>nav#site-navigation .nav-mega-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4.5vw,70px);align-content:start;padding-top:35px}
.site-header>nav#site-navigation .nav-mega-store .nav-mega-columns{grid-template-columns:repeat(3,minmax(0,1fr))}
.site-header>nav#site-navigation .nav-mega-column{min-width:0}
.site-header>nav#site-navigation .nav-mega-column-title{margin-bottom:17px}
.site-header>nav#site-navigation .nav-mega-column-links{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.site-header>nav#site-navigation .nav-mega-link{display:inline-flex;align-items:center;min-height:34px;color:#d0d0c9;font:500 14px/1.45 Inter,ui-sans-serif,system-ui,sans-serif;text-decoration:none;white-space:normal;transition:color .18s ease,transform .2s ease}
.site-header>nav#site-navigation .nav-mega-link:hover,.site-header>nav#site-navigation .nav-mega-link[aria-current="page"]{color:#fff;transform:translateX(2px)}
@media(min-width:1025px) and (max-width:1240px){
  .site-header>nav#site-navigation{gap:clamp(6px,.8vw,11px);font-size:clamp(12px,.95vw,13px)}
  .site-header>.site-header-actions{gap:clamp(8px,1vw,14px)}
}
@media(max-width:1024px){
  .site-header>nav#site-navigation details.nav-mega{position:static!important}
  .site-header>nav#site-navigation details.nav-mega:not([open])>.nav-mega-menu{display:none!important}
  .site-header>nav#site-navigation details.nav-mega[open]>.nav-mega-menu{
    position:static!important;inset:auto!important;display:block!important;width:auto!important;min-width:0!important;max-width:none!important;max-height:none;overflow:visible;
    margin:0 0 12px 10px!important;padding:10px 0 12px 14px!important;border:0!important;border-left:1px solid rgba(245,245,243,.2)!important;
    background:transparent!important;box-shadow:none!important;opacity:1;visibility:visible;pointer-events:auto;transform:none!important;transition:none!important
  }
  .site-header>nav#site-navigation .nav-mega-inner{display:grid;grid-template-columns:1fr;gap:22px;width:auto;min-height:0;margin:0;padding:8px 12px 8px 0}
  .site-header>nav#site-navigation .nav-mega-eyebrow,.site-header>nav#site-navigation .nav-mega-column-title{margin-bottom:10px;font-size:10px}
  .site-header>nav#site-navigation .nav-mega-description{max-width:45ch;margin-bottom:13px;font-size:13px}
  .site-header>nav#site-navigation .nav-mega-featured{gap:6px}
  .site-header>nav#site-navigation .nav-mega-featured-link{font-size:clamp(21px,5vw,27px)}
  .site-header>nav#site-navigation .nav-mega-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:0}
  .site-header>nav#site-navigation .nav-mega-column-links{gap:1px}
  .site-header>nav#site-navigation .nav-mega-link{min-height:36px;font-size:13px}
}
@media(max-width:420px){.site-header>nav#site-navigation .nav-mega-columns{grid-template-columns:1fr;gap:14px}}
@media(prefers-reduced-motion:reduce){
  .site-header>nav#site-navigation details.nav-mega>.nav-mega-menu,
  .site-header>nav#site-navigation .nav-mega-featured-link,
  .site-header>nav#site-navigation .nav-mega-featured-link span,
  .site-header>nav#site-navigation .nav-mega-link{transition:none!important}
}

.sp-contact-honeypot{display:none!important}.sp-contact-status{margin:0;font-size:13px;line-height:1.5}.sp-contact-status[data-state="success"]{color:#b9e7c4}.sp-contact-status[data-state="error"]{color:#f0b2a8}.sp-contact-status[data-state="sending"]{color:#aaa9a3}.sp-contact-submit:disabled{opacity:.6;cursor:wait}

/* Keep the shared header stable on phones, even when the search receives focus. */
@media (max-width: 760px) {
  .site-header {
    box-sizing: border-box !important;
    grid-template-columns: minmax(0, 1fr) auto 42px !important;
    grid-template-rows: auto auto !important;
    gap: 6px 8px !important;
    width: var(--page, calc(100% - 32px)) !important;
    max-width: none !important;
    min-height: 70px !important;
    padding: 12px 0 !important;
  }
  .site-header > .wordmark {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: clamp(13px, 4vw, 16px) !important;
  }
  .site-header > .site-header-actions,
  .site-header > .store-header-tools {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    gap: 6px !important;
    flex: 0 1 auto !important;
  }
  .site-header > .mobile-menu-toggle {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
  }
  .site-header .site-header-actions .store-header-search,
  .site-header > .store-header-tools .store-header-search {
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
    width: clamp(72px, 24vw, 112px) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 38px !important;
    padding-right: 8px !important;
    padding-left: 9px !important;
    transition: width .42s cubic-bezier(.2,.7,.2,1), flex-basis .42s cubic-bezier(.2,.7,.2,1), border-color .3s ease, background-color .3s ease, box-shadow .3s ease !important;
  }
  .site-header .site-header-actions .store-header-search:hover,
  .site-header .site-header-actions .store-header-search:focus-within,
  .site-header > .store-header-tools .store-header-search:hover,
  .site-header > .store-header-tools .store-header-search:focus-within {
    width: min(clamp(110px, 42vw, 250px), calc(100vw - 200px)) !important;
    max-width: calc(100vw - 200px) !important;
  }
  .site-header-actions > .nav-account-trigger,
  .site-header-actions > .store-account-control {
    box-sizing: border-box !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 38px !important;
  }
  .site-header .sp-header-voice-trigger { flex-basis: 30px !important; width: 30px !important; height: 38px !important; }
  .site-header > .store-header-tools .store-header-tool {
    box-sizing: border-box !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 30px !important;
  }
}
@media (max-width: 380px) {
  .site-header {
    grid-template-columns: minmax(0, 1fr) auto 38px !important;
    column-gap: 4px !important;
  }
  .site-header > .wordmark { font-size: clamp(12px, 3.7vw, 14px) !important; }
  .site-header > .wordmark .store-wordmark-suffix { display: none !important; }
  .site-header > .mobile-menu-toggle {
    flex-basis: 38px !important;
    width: 38px !important;
    height: 38px !important;
  }
  .site-header > .site-header-actions,
  .site-header > .store-header-tools { gap: 4px !important; }
  .site-header .site-header-actions .store-header-search,
  .site-header > .store-header-tools .store-header-search {
    width: clamp(68px, 23vw, 82px) !important;
  }
  .site-header-actions > .nav-account-trigger,
  .site-header-actions > .store-account-control { flex-basis: 28px !important; width: 28px !important; }
  .site-header .sp-header-voice-trigger { flex-basis: 28px !important; width: 28px !important; }
  .site-header > .store-header-tools .store-header-tool { flex-basis: 20px !important; width: 20px !important; }
}

@media(prefers-reduced-motion:reduce){.site-header .sp-header-voice-trigger{transition:none!important}}