:root {
  --premium-radius: 12px;
  --premium-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .06);
  --premium-shadow-hover: 0 2px 4px rgba(0, 0, 0, .04), 0 10px 24px rgba(0, 0, 0, .09);
}

body {
  line-height: 1.65;
}

a,
button,
input,
select,
textarea {
  transition: all .2s ease;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: -.02em;
  line-height: 1.2;
}

p {
  line-height: 1.85;
}

.hero h1,
.section-head h2,
.about h2,
.contact h2,
.product-copy h1 {
  line-height: 1.18;
}

.hero-text,
.intro,
.product-description,
.description,
.contact-intro,
.section-aside,
.brand-card-description,
.info-card p {
  line-height: 1.85;
}

section {
  scroll-margin-top: 40px;
}

.hero {
  padding-block: 112px;
}

.categories,
.products,
.about,
.contact,
.site-info {
  padding-block: 112px;
}

.brand-catalog + .brand-catalog {
  margin-top: 56px;
  padding-top: 48px;
}

main.shell {
  padding-block: 112px;
}

.product-layout {
  gap: 48px;
  margin-top: 40px;
}

.shell {
  scroll-margin-top: 40px;
}

.brand-card,
.product-card,
.product-art,
.gallery-main,
.gallery-thumb,
.cart-panel,
.info-card,
.cart,
.product-pack,
.gallery-placeholder,
.product-related-link,
.product-compatible-item,
.product-related-placeholder {
  border-radius: var(--premium-radius);
}

.brand-card,
.product-card,
.cart-panel,
.info-card,
.cart,
.gallery-main,
.related-product-card,
.floating-cart,
.site-fab,
.hero-product,
.product-pack,
.gallery-placeholder {
  box-shadow: var(--premium-shadow);
}

.brand-card,
.product-card {
  transition: all .2s ease;
}

.brand-card:hover,
.brand-card:focus-visible,
.product-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--premium-shadow-hover);
}

.product-art--image img,
.gallery-main img,
.gallery-thumb img {
  border-radius: 8px;
  object-fit: contain;
}

.gallery-main img[hidden] {
  display: none;
}

.nav-links a,
.nav-contact,
.button-dark,
.hero-actions .quiet-link,
.button,
.checkout,
.product-category-link,
.product-actions button,
.back-link,
.dispenser-filters button,
.grass-filters button {
  border-radius: var(--premium-radius);
  font-weight: 600;
}

.nav-contact,
.button-dark,
.hero-actions .quiet-link,
.button,
.checkout {
  padding: 12px 24px;
}

.nav-links a,
.product-category-link,
.product-actions button,
.back-link,
.dispenser-filters button,
.grass-filters button {
  transition: all .2s ease;
}

.nav-contact:hover,
.button-dark:hover,
.hero-actions .quiet-link:hover,
.button:hover,
.checkout:hover:not(:disabled),
.product-category-link:hover,
.product-actions button:hover,
.back-link:hover {
  transform: translateY(-2px);
}

.nav-contact:active,
.button-dark:active,
.hero-actions .quiet-link:active,
.button:active,
.checkout:active:not(:disabled),
.product-category-link:active,
.product-actions button:active,
.back-link:active,
.nav-links a:active {
  transform: scale(.98);
}

input,
select,
textarea {
  padding: 12px 16px;
  border-radius: var(--premium-radius);
  transition: all .2s ease;
}

input::placeholder,
textarea::placeholder {
  opacity: .5;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 1px solid var(--blue);
  outline-offset: 0;
  box-shadow: 0 0 0 4px rgba(82, 127, 131, .14);
}

.field input,
.field select,
.field textarea {
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: var(--premium-radius);
  background: var(--white);
}

.order-fields input {
  min-height: 48px;
  padding: 12px 16px;
}

.product-related-link,
.product-compatible-item {
  transition: all .2s ease;
}

.product-related-link:hover {
  box-shadow: var(--premium-shadow);
}

.hero-product svg,
.site-fab svg {
  stroke-width: 1.5;
}

.scroll-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .5s ease-out, transform .5s ease-out;
}

.scroll-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 760px) {
  .hero,
  .categories,
  .products,
  .about,
  .contact,
  .site-info {
    padding-block: 64px;
  }

  main.shell {
    padding-block: 64px;
  }

  .brand-catalog + .brand-catalog {
    margin-top: 40px;
    padding-top: 40px;
  }
}

@media (max-width: 540px) {
  .nav-contact,
  .button-dark,
  .hero-actions .quiet-link,
  .button,
  .checkout {
    padding: 12px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-reveal,
  .scroll-reveal.is-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.site-fab.site-fab--cart {
  color: #1f5fbf;
  background: rgba(255, 255, 255, .18);
  border-color: rgba(31, 95, 191, .35);
  box-shadow: 0 4px 16px rgba(31, 95, 191, .12), inset 0 0 0 1px rgba(255, 255, 255, .4);
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  backdrop-filter: saturate(180%) blur(16px);
}
.site-fab.site-fab--cart:hover { background: rgba(255, 255, 255, .32); }
.site-fab--cart .site-fab-count { background: #1f5fbf; }