/* Black header with one centered logo + breadcrumb navigation group. */
.topbar{height:auto;min-height:0;display:flex;align-items:center;justify-content:center;padding:70px 40px 0;background:#000;color:#fff;overflow:visible}.brand-nav{display:flex;align-items:center;justify-content:center;gap:30px;max-width:100%}.brand{position:static;display:block;flex:0 0 auto;width:270px;color:inherit}.brand-logo{display:block;width:100%;height:auto}.header-nav{display:flex;align-items:center;gap:30px;min-width:0;color:#fff;font-size:38px;font-weight:700;line-height:1;white-space:nowrap}.header-nav a,.header-nav span{color:inherit}.header-nav a{text-decoration:none;transition:color .18s ease}.header-nav a:hover,.header-nav a:focus-visible{color:#b5ef39}.header-nav .nav-section{color:#8a8a8a;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px}.header-nav .nav-divider{color:#8a8a8a;font-weight:700;opacity:1}
.stack{margin-top:70px}.catalog{width:min(1050px,calc(100% - 100px));margin:70px auto;padding-bottom:120px;display:flex;flex-wrap:wrap;justify-content:center;gap:50px}.catalog-card{display:flex;flex:0 0 500px;flex-direction:column;padding:16px}.catalog-card h2{height:126px;display:flex;align-items:center;justify-content:center;margin:0;font-size:31px}
.product{margin-top:70px}
.gallery{padding:0;background:transparent;border-radius:0;overflow:visible}.gallery-viewport{cursor:zoom-in}.gallery-nav{color:#fff}
.product-preview{position:relative;width:100%;aspect-ratio:1;margin:0 0 65px}.product-shot{display:block;width:100%;height:100%;object-fit:cover;border-radius:50px;margin:0;cursor:zoom-in}.size-card{position:absolute;inset:0;background:#fff;color:#000;border-radius:50px;padding:70px 55px 45px}.size-card h2{font-size:42px;margin:0 0 8px}.size-card p{font-size:20px;color:#666;margin:0 0 45px}.size-card table{width:100%;border-collapse:collapse;font-size:23px}.size-card th,.size-card td{padding:22px 12px;border-bottom:1px solid #ccc;text-align:center}.size-card td:first-child,.size-card th:first-child{text-align:left}.size-close{position:absolute;right:30px;top:25px;width:52px;height:52px;border:0;border-radius:50%;background:#eee;font-size:38px;line-height:1}
.controls{gap:16px}.swatch{position:relative;width:56px;height:56px;border:0!important;border-radius:50%;background:var(--swatch);box-shadow:none!important;padding:0}.swatch.active{box-shadow:none!important}.swatch.active::after{content:"";position:absolute;width:26px;height:26px;border-radius:50%;background:#000;left:50%;top:50%;transform:translate(-50%,-50%)}.size-help{width:50px;height:50px;border:0;background:transparent;color:#fff;font-size:30px;font-weight:700}.field{border:1px solid #303030;border-radius:12px;background:#111;color:#fff;-webkit-text-fill-color:#fff;caret-color:#fff;outline:0}.field:focus{border-color:#777}.field::placeholder{color:#8b8b8b;-webkit-text-fill-color:#8b8b8b;opacity:1}.field-short{width:145px}
.lightbox{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:0;border:0;background:rgba(0,0,0,.94);color:#fff;overflow:hidden}.lightbox::backdrop{background:#000}.lightbox-stage{position:relative;width:100%;height:100%;overflow:hidden;touch-action:none;cursor:crosshair}.lightbox-stage img{position:absolute!important;left:50%;top:50%;display:block!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;object-fit:contain!important;transform-origin:center;transition:none;user-select:none;-webkit-user-drag:none;will-change:transform;pointer-events:auto}.lightbox-close{position:fixed;z-index:2;right:24px;top:20px;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;border-radius:50%;background:#000;color:#fff;font-size:48px;font-weight:300;line-height:1;box-shadow:none}
@media(pointer:coarse){.lightbox-stage{cursor:grab}.lightbox-stage:active{cursor:grabbing}}
@media(max-width:900px){.topbar{height:auto;min-height:0;padding:34px 14px 0}.brand-nav{width:100%;flex-direction:column;gap:34px}.brand{width:min(250px,calc((100vw - 40px)/2));overflow:visible}.brand-logo{width:100%;height:auto;object-fit:contain}.header-nav{width:100%;justify-content:center;gap:12px;max-width:100%;font-size:36px;line-height:1.12;white-space:normal;text-align:center}.header-nav>span,.header-nav>a{min-width:0;overflow-wrap:anywhere}.header-nav .nav-section{text-decoration-thickness:2px;text-underline-offset:6px}.stack{margin-top:34px}.catalog{width:calc(100% - 40px);margin-top:34px;gap:28px}.product{margin-top:34px}.catalog-card{flex-basis:min(500px,100%)}.catalog-card h2{height:82px;font-size:28px;margin:0}.gallery{padding:0}.product-shot,.size-card{border-radius:28px}.size-card{padding:48px 20px 20px}.size-card h2{font-size:25px}.size-card p{font-size:14px;margin-bottom:20px}.size-card table{font-size:14px}.size-card th,.size-card td{padding:13px 5px}.size-close{right:14px;top:13px;width:38px;height:38px;font-size:27px}.field-short{width:90px}.size-help{width:42px;height:42px;font-size:22px}.product-preview{margin-bottom:42px}}
@media(max-width:430px){.topbar{padding-inline:10px}.header-nav{gap:8px;font-size:30px;letter-spacing:-.02em}}
/* v69: keep the constructor form in the normal grid so row spacing is preserved. */
.product-block-flow{display:grid}.wishes-row{display:block;width:100%}.wishes-field{display:block;width:100%;min-height:108px;resize:none;overflow:hidden;line-height:1.45}.product-block-flow>.copy,.product-block-flow>.gallery{width:100%}
.order-fields{display:grid;gap:65px}
.order-field-group{display:grid;gap:34px;min-width:0}
.product-price-row .price{font-size:inherit}
.standalone-price{width:100%;margin:34px 0;font-size:60px;line-height:1;text-align:center;font-weight:700}
@media(max-width:900px){.standalone-price{margin:24px 0;font-size:32px}.order-fields{gap:30px}.order-field-group{gap:8px}}
.product-price-row .price{display:inline-block;transform-origin:center bottom;transition:color .2s ease}
.product-price-row .price.price-is-base{color:#fff}
.product-price-row .price.price-has-extra{color:#b5ef39}
.product-price-row .price.price-changed{animation:price-changed .55s ease}
@keyframes price-changed{0%{transform:translateY(0);text-shadow:none}35%{transform:translateY(-8px);text-shadow:0 0 22px rgba(181,239,57,.35)}100%{transform:translateY(0);text-shadow:none}}
/* v71: hide hints while a field is active; an empty field shows its hint again on blur. */
.field:focus::placeholder{color:transparent;-webkit-text-fill-color:transparent;opacity:0}

/* v122: one real section gap in dynamic product cards.
   Text blocks keep their natural height; no grid gap is added on top of margins. */
.product-block-flow{
  --product-section-gap:65px;
  row-gap:0;
}
.product-block-flow>.formatted-copy,
.product-block-flow>.gallery,
.product-block-flow>.standalone-price,
.product-block-flow>.product-preview{
  align-self:start;
  min-height:0;
  margin-top:0;
  margin-bottom:var(--product-section-gap);
}
.product-block-flow>.formatted-copy{
  height:auto;
  text-align:justify;
}
.product-block-flow>.gallery + .product-description-block{
  margin:0;
  padding:var(--product-section-gap) 0;
}
.product-block-flow>.gallery:has(+.product-description-block){
  margin-bottom:0;
}
.product-block-flow>.formatted-copy strong,
.product-block-flow>.formatted-copy b{
  font-weight:700;
}
.product-block-flow>.standalone-price{
  line-height:1;
}
@media(max-width:900px){
  .product-block-flow>.formatted-copy{
    text-align:left;
  }
  .product-block-flow{--product-section-gap:42px}
}

/* v212: every section logo uses the same visual height as the primary logo. */
.brand{
  width:auto;
  height:142px;
  max-width:calc(100vw - 40px);
}
.brand-logo{
  width:auto;
  max-width:100%;
  height:100%;
  object-fit:contain;
}

/* v123: spacing only in the bottom part of dynamic product cards. */
.product-block-flow .wishes-row{
  align-self:start;
  min-height:0;
}
.product-block-flow .wishes-row>.wishes-field{
  box-sizing:border-box;
  height:auto;
  min-height:0;
  padding:10px 22px;
  overflow-y:hidden;
  resize:none;
}
.product-block-flow>.order-note{
  display:block;
  height:auto;
  min-height:0;
  margin:0;
}
.product-block-flow>.order-note:empty{
  display:none;
}
.product-block-flow>#error:empty{
  display:none;
}
.product-block-flow>.submit{
  position:static;
  align-self:auto;
  justify-self:center;
  width:max-content;
  max-width:100%;
  margin:0;
  flex:0 0 auto;
  transition:border-color .18s ease,color .18s ease;
}
.product-order-page{
  padding-bottom:60px;
}
.product-order-page>.product-block-flow{
  margin-top:0;
  margin-bottom:25px;
}
@media(max-width:900px){
  .product-order-page{padding-bottom:60px}
  .product-order-page>.product-block-flow{margin-bottom:25px}
}
.product-block-flow>.submit:hover,
.product-block-flow>.submit:focus-visible{
  border-color:#b5ef39;
  color:#b5ef39;
}
.product-in-development .development-link{display:flex;background:#777;color:#222;text-decoration:none;cursor:pointer}
.product-in-development .development-link:hover,.product-in-development .development-link:focus-visible{background:#8b8b8b;color:#222}

/* v124: the bottom form is one grid item, so its outside gap belongs here.
   This keeps both sides of every explanatory text block at the same 65px. */
.product-block-flow>.order-fields{
  margin:0 0 var(--product-section-gap);
}
.lightbox-close{
  position:fixed;
  -webkit-appearance:none;
  appearance:none;
  border:0!important;
  outline:0!important;
  background:#000!important;
  color:transparent;
  font-size:0;
  box-shadow:none!important;
  text-shadow:none;
}
.lightbox-close::before,
.lightbox-close::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:27px;
  height:3px;
  border-radius:3px;
  background:#fff;
  transform-origin:center;
}
.lightbox-close::before{transform:translate(-50%,-50%) rotate(45deg)}
.lightbox-close::after{transform:translate(-50%,-50%) rotate(-45deg)}

.size-card.size-card-reworked{padding:45px 55px 35px}
.size-card.size-card-reworked table{font-size:23px}
.size-card.size-card-reworked th:first-child,
.size-card.size-card-reworked td:first-child{width:43%}
.size-card.size-card-reworked .size-fit-note{
  margin:18px 0 0;
  color:#666;
  font-size:20px;
  font-weight:400;
  line-height:1.3;
  text-align:left;
}
.size-card.size-card-reworked .size-close{
  position:absolute;
  left:50%;
  right:auto;
  top:auto;
  bottom:35px;
  display:block;
  width:auto;
  height:78px;
  margin:0;
  padding:0 45px;
  border:0;
  border-radius:40px;
  background:#000;
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:27px;
  font-weight:700;
  line-height:78px;
  box-shadow:none;
  transform:translateX(-50%);
}
@media(max-width:900px){
  .size-card.size-card-reworked{padding:28px 20px 20px}
  .size-card.size-card-reworked table{font-size:14px}
  .size-card.size-card-reworked .size-fit-note{margin-top:12px;font-size:14px}
  .size-card.size-card-reworked .size-close{bottom:20px;height:63px;padding:0 36px;font-size:22px;line-height:63px}
}

.size-help{
  border-radius:50%;
  box-shadow:inset 0 0 0 2px #666;
  transition:box-shadow .15s ease;
}
.size-help:hover,
.size-help:focus-visible{
  box-shadow:inset 0 0 0 2px #fff;
}

/* v131: order confirmation uses the same visual language as the admin area. */
.success.order-success{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:center;
  padding:70px 40px 110px;
  font-family:Arial,sans-serif;
}
.success-logo{
  display:block;
  width:270px;
}
.success-logo img{
  display:block;
  width:100%;
  height:auto;
}
.success-content{
  width:min(800px,100%);
  margin-top:110px;
  text-align:center;
}
.success.order-success h1{
  margin:0 0 42px;
  font-size:54px;
  font-weight:700;
  line-height:.95;
  letter-spacing:-.04em;
}
.success-message{
  width:min(650px,100%);
  margin:0 auto;
  color:#8b8b8b;
  font-size:25px;
  font-weight:300;
  line-height:1.5;
  text-align:center;
}
.success-label{
  margin:0 0 16px;
  color:#8b8b8b;
  font-size:13px;
  font-weight:400;
  letter-spacing:.14em;
}
.success.order-success code{
  display:block;
  margin:0;
  color:#fff;
  font:700 42px/1 Arial,sans-serif;
}
.success-track{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  margin-top:48px;
  padding:0 24px;
  border-radius:999px;
  background:#fff;
  color:#000!important;
  font-size:16px;
  font-weight:700;
  text-decoration:none;
}
@media(max-width:900px){
  .success.order-success{
    padding:34px 20px 70px;
  }
  .success-logo{
    width:min(250px,calc((100vw - 40px)/2));
  }
  .success-content{
    margin-top:72px;
  }
  .success.order-success h1{
    margin-bottom:34px;
    font-size:40px;
  }
  .success-message{
    width:min(560px,100%);
    font-size:20px;
    line-height:1.5;
  }
  .success.order-success code{
    font-size:32px;
  }
}

.topbar {
  background: #111111;
}

/* v195: the logo stays centered; breadcrumbs use their own row below it. */
.brand-nav{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  justify-items:center;
  align-items:start;
  row-gap:70px;
}
.brand{
  grid-row:1;
  justify-self:center;
  width:min(270px,calc(100vw - 40px));
}
.header-nav{
  grid-row:2;
  justify-self:center;
  justify-content:center;
}
@media(max-width:900px){
  .brand-nav{
    row-gap:34px;
  }
  .brand{
    width:min(270px,calc(100vw - 40px));
  }
}

/* v197: mobile breadcrumbs may scale or wrap between items, never inside a word. */
@media(max-width:900px){
  .header-nav{
    width:auto;
    max-width:100%;
    flex-wrap:wrap;
    gap:10px;
    padding-inline:4px;
    font-size:clamp(22px,7vw,30px);
    line-height:1.12;
    white-space:normal;
  }
  .header-nav>span,
  .header-nav>a{
    flex:0 0 auto;
    min-width:auto;
    white-space:nowrap;
    overflow-wrap:normal;
    word-break:keep-all;
    hyphens:none;
  }
}
@media(max-width:430px){
  .header-nav{
    gap:8px;
    letter-spacing:-.02em;
  }
}

/* v213: keep the main logo height; wider section marks expand sideways. */
.brand{
  width:auto;
  height:142px;
  max-width:none;
}
.brand-logo{
  width:auto;
  height:100%;
  max-width:none;
}

/* v272: disabled products stay visible in the catalog but cannot be opened. */
.catalog-card-disabled{
  cursor:default;
  user-select:none;
}
.catalog-card-disabled:hover{
  transform:none;
}
.catalog-card-disabled .card-media{
  position:relative;
  overflow:hidden;
}
.catalog-card-disabled .catalog-card-cover{
  filter:grayscale(1);
}
.catalog-card-disabled .catalog-card-development-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}
@media (hover:hover) and (pointer:fine){
  .catalog-card-disabled:hover .card-media img{
    transform:none;
  }
}

/* v441: product preview cards with type label and animated enter icon. */
.catalog-card{
  text-align:left;
}
.catalog-card-info{
  min-height:126px;
  padding:31px 27px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.catalog-card-info>div{
  min-width:0;
}
.catalog-card-type{
  display:block;
  min-height:15px;
  color:#8b8b8b;
  font-size:14px;
  font-weight:700;
  line-height:1;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.catalog-card .catalog-card-info h2{
  height:auto;
  justify-content:flex-start;
  margin:10px 0 0;
  font-size:31px;
  line-height:1;
  text-align:left;
}
.catalog-card-enter{
  flex:0 0 45px;
  width:45px;
  height:45px;
  background:#8b8b8b;
  -webkit-mask:url('enter_icon.svg') center/contain no-repeat;
  mask:url('enter_icon.svg') center/contain no-repeat;
  transition:background-color .55s cubic-bezier(.2,.7,.2,1);
}
@media (hover:hover) and (pointer:fine){
  .catalog-card:not(.catalog-card-disabled):hover .catalog-card-enter{
    background:#b5ef39;
  }
}
@media(max-width:599px){
  .catalog-card-info{min-height:100px;padding:25px 18px 18px;gap:16px}
  .catalog-card-type{font-size:11px}
  .catalog-card .catalog-card-info h2{margin-top:8px;font-size:28px}
  .catalog-card-enter{flex-basis:42px;width:42px;height:42px}
}
/* v444: one compact global header for every public page. */
.topbar{padding:45px 0 0;background:#111}
.brand-nav{width:min(1050px,calc(100% - 100px));margin:0 auto;display:flex;align-items:center;justify-content:flex-end;gap:24px}
.brand{width:auto;height:58px;flex:0 0 auto}.brand-logo{width:auto;height:100%;display:block}
.header-nav{font-size:18px;gap:12px;margin-right:auto;order:-1}
.site-links{display:flex;align-items:center;gap:22px;margin-left:8px;white-space:nowrap}
.site-links a{color:#8b8b8b;text-decoration:none;font-size:14px;font-weight:700;transition:color .35s ease}
.site-links a:hover,.site-links a:focus-visible{color:#fff}
.header-telegram{display:grid;place-items:center;width:46px;height:46px;flex:0 0 46px;border:1px solid #555;border-radius:50%;color:#8b8b8b;transition:color .35s ease,border-color .35s ease}
.header-telegram:hover,.header-telegram:focus-visible{color:#fff;border-color:#fff}.header-telegram svg{width:22px;height:22px;fill:currentColor}
.formatted-copy strong,.formatted-copy b{font-weight:700}
.static-page-content{width:min(1050px,calc(100% - 100px));margin:100px auto 0;display:grid;gap:45px}
.static-page-content h1{margin:0 0 15px;font-size:clamp(44px,7vw,82px);line-height:.95}.static-page-text{margin:0;font-size:24px;line-height:1.5;text-align:justify}.static-page-image{display:block;width:100%;height:auto;border-radius:30px}
.formatted-copy .rich-heading{display:block;margin:.65em 0 .35em;font-size:28px;font-weight:700;line-height:1;letter-spacing:.02em}
@media(max-width:900px){.topbar{padding:28px 0 0}.brand-nav{width:calc(100% - 40px);display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;gap:15px}.brand{width:auto;height:44px}.site-links{gap:13px;margin-left:0}.site-links a{font-size:11px}.header-telegram{width:40px;height:40px;flex-basis:40px}.header-nav{width:100%;order:2;margin:8px 0 0;justify-content:flex-end;font-size:20px}.static-page-content{width:calc(100% - 40px);margin-top:65px;gap:30px}.static-page-text{font-size:19px;text-align:left}.static-page-image{border-radius:20px}}
@media(max-width:900px){.formatted-copy .rich-heading{font-size:23px}}

/* v445: full-size logo on the left, page links distributed through the header. */
.brand-nav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;justify-content:stretch;column-gap:30px}
.brand{grid-column:1;grid-row:1;justify-self:start;width:270px;height:142px}
.site-links{grid-column:2;grid-row:1;width:100%;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;justify-items:center;gap:0}
.site-links a{font-size:31px;line-height:1}
.header-telegram{grid-column:3;grid-row:1;width:58px;height:58px;justify-self:end}
.header-nav{grid-column:1/-1;grid-row:2;justify-self:center;margin:32px 0 0;order:initial}
@media(max-width:900px){
  .brand-nav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:12px;row-gap:18px}
  .brand{width:133px;height:70px}
  .site-links{display:grid;grid-template-columns:1fr;justify-items:center;gap:8px}
  .site-links a{font-size:clamp(14px,4vw,20px)}
  .header-telegram{width:46px;height:46px}
  .header-nav{grid-column:1/-1;grid-row:2;width:auto;margin:0;justify-self:center;justify-content:center}
}

/* v446: tighten the logo hitbox and simplify the header controls. */
.site-links a{font-size:21px;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px}
.header-telegram{border:0;border-radius:0;background:transparent}
.header-telegram:hover,.header-telegram:focus-visible{border-color:transparent}
.header-telegram svg{width:44px;height:44px}
@media(max-width:900px){.site-links a{font-size:16px;text-underline-offset:5px}.header-telegram svg{width:36px;height:36px}}

/* v447: three icon links, with the current content page held in its hover state. */
.brand-nav{grid-template-columns:270px minmax(0,1fr)}
.site-links{grid-column:2;grid-template-columns:repeat(3,minmax(0,1fr))}
.site-links a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  min-width:0;
  color:#8b8b8b;
  text-decoration:none;
  font-size:21px;
  transition:color .35s ease;
}
.site-links a:hover,
.site-links a:focus-visible,
.site-links a.is-active{color:#fff}
.site-links svg{
  width:28px;
  height:28px;
  flex:0 0 28px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
@media(max-width:900px){
  .brand-nav{grid-template-columns:133px minmax(0,1fr)}
  .site-links{grid-column:2;grid-template-columns:1fr;justify-items:start;gap:9px}
  .site-links a{justify-content:flex-start;font-size:14px}
  .site-links svg{width:22px;height:22px;flex-basis:22px}
}

/* v448: restore the original section/product breadcrumb scale. */
.header-nav{font-size:38px;gap:30px}
@media(max-width:900px){.header-nav{font-size:36px;gap:12px}}
@media(max-width:430px){.header-nav{font-size:30px;gap:8px}}

/* v450: mobile header stacks the full-size logo above a centered wrapping link row. */
@media(max-width:900px){
  .brand-nav{
    grid-template-columns:minmax(0,1fr);
    row-gap:28px;
  }
  .brand{
    grid-column:1;
    grid-row:1;
    justify-self:center;
    width:270px;
    height:142px;
    max-width:calc(100vw - 40px);
  }
  .site-links{
    grid-column:1;
    grid-row:2;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:18px 28px;
    width:100%;
  }
  .site-links a{
    flex:0 0 auto;
    justify-content:center;
    white-space:nowrap;
  }
  .header-nav{
    grid-column:1;
    grid-row:3;
  }
}

/* v452 final: restore the original section-aware logo header. */
.topbar{padding:70px 40px 0}
.brand-nav{width:100%;margin:0;display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:start;row-gap:70px}
.brand{grid-column:1;grid-row:1;justify-self:center;width:auto;height:142px;max-width:none}
.header-nav{grid-column:1;grid-row:2;justify-self:center;justify-content:center;margin:0;order:initial;font-size:38px;gap:30px}
@media(max-width:900px){
  .topbar{padding:34px 14px 0}
  .brand-nav{row-gap:34px}
  .brand{width:auto;height:142px;max-width:none}
  .header-nav{grid-column:1;grid-row:2;margin:0;font-size:clamp(22px,7vw,30px);gap:10px}
}
@media(max-width:430px){.header-nav{gap:8px}}
