/* Header variants from admin settings: classic / centered / minimal layouts, glass / solid style, sticky toggle, long logo names, product photos. */

/* style + stickiness */
.site-header.style-solid { background: var(--bg); backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom-color: var(--line); }
.site-header.not-sticky { position: relative; }
:root.nav-static { --sticky-top: 0px; }
:root.nav-centered { --sticky-top: calc(var(--header-h) + 48px); }
:root.nav-centered.nav-static { --sticky-top: 0px; }

/* long site names: tighter tracking so the header still fits */
.logo-word.long { font-size: 18px; letter-spacing: .14em; white-space: nowrap; }
.logo-img { height: 34px; width: auto; max-width: 160px; object-fit: contain; }
.drawer-head .logo-word { letter-spacing: .12em; }

/* links-type dropdown: a narrow single column */
.mega.mega-links { width: 300px; grid-template-columns: 1fr; }
.mega.mega-links a { padding: 10px 12px; }

/* centered: logo in the middle of row one, links on row two */
.layout-centered .header-row { display: grid; grid-template-columns: 1fr auto 1fr; }
.layout-centered .header-left { display: flex; align-items: center; gap: 6px; }
.layout-centered .logo { justify-self: center; }
.layout-centered .header-actions { justify-self: end; margin-left: 0; }
.header-nav-row { display: flex; justify-content: center; height: 48px; align-items: center; border-top: 1px solid var(--line); }
.layout-centered .main-nav { flex-wrap: wrap; justify-content: center; }
.layout-centered .mega { left: 50%; transform: translate(-50%, -6px); }
.layout-centered .nav-item:hover .mega, .layout-centered .nav-item:focus-within .mega { transform: translate(-50%, 0); }

/* minimal: hamburger on every width, links only in the drawer */
.layout-minimal .menu-btn { display: grid; }
.layout-minimal .main-nav { display: none; }

/* admin-uploaded product photos sit where the drawn gem would */
.p-photo { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }
.stage .p-photo { width: 78%; height: auto; aspect-ratio: 1; border-radius: 18px; transition: transform .2s; }
.thumb .p-photo { border-radius: 10px; }
/* videos: whole frame on the product stage, play badge on thumbnails */
.stage video.p-photo { object-fit: contain; background: #000; }
.thumb, .cert-shot { position: relative; overflow: hidden; }
.is-video::after { content: ''; position: absolute; inset: 0; margin: auto; width: 22px; height: 22px; border-radius: 50%; pointer-events: none;
  background: rgb(14 11 18 / .72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.5 7v10l8-5z' fill='%23fff'/%3E%3C/svg%3E") center / 16px no-repeat; }

/* a long name plus six links leaves no room for the full search pill: show the icon */
@media (max-width: 1440px) {
  .layout-classic .search-trigger { flex: none; min-width: 0; width: 42px; padding: 0; justify-content: center; margin-right: 0; }
  .layout-classic .search-trigger span, .layout-classic .search-trigger kbd { display: none; }
}
@media (max-width: 1100px) {
  .header-nav-row { display: none; }
  :root.nav-centered { --sticky-top: var(--header-h); }
  .layout-centered .header-row { grid-template-columns: auto 1fr auto; gap: 8px; }
  .layout-centered .logo { justify-self: start; }
}
@media (max-width: 640px) {
  /* phones: theme and currency move to the menu drawer, and a long name wraps onto two lines */
  .site-header #cur-btn, .site-header #theme-btn { display: none; }
  .logo-word.long { font-size: 12.5px; letter-spacing: .1em; white-space: normal; line-height: 1.15; max-width: 9.5em; }
  .logo { min-width: 0; }
  .logo-img { height: 28px; max-width: 120px; }
}
@media (max-width: 400px) {
  .logo-word.long { font-size: 11.5px; letter-spacing: .06em; }
}