/*
Theme Name: ST100 Child
Theme URI: https://st100.cloud
Description: Child theme for the ST100 industrial steam cleaning equipment website.
Author: Codex
Template: astra
Version: 0.1.0
Text Domain: st100-child
*/

:root {
  --st100-ink: #f4f7fb;
  --st100-ink-strong: #ffffff;
  --st100-text-dark: #16212b;
  --st100-accent: #ea6b1f;
  --st100-accent-deep: #bb4c0b;
  --st100-accent-soft: #f9e1d3;
  --st100-line: rgba(255, 255, 255, 0.14);
  --st100-line-dark: rgba(20, 35, 48, 0.1);
  --st100-bg: #0f1820;
  --st100-bg-soft: #151f28;
  --st100-card: #ffffff;
  --st100-card-alt: #f5f7f9;
  --st100-muted: #9db0bf;
  --st100-muted-dark: #60717f;
  --st100-shadow: 0 24px 60px rgba(3, 10, 18, 0.22);
}

body {
  background:
    radial-gradient(circle at top right, rgba(234, 107, 31, 0.12), transparent 28%),
    linear-gradient(180deg, #0c141b 0%, #121d26 22%, #eef2f5 22%, #eef2f5 100%);
  color: var(--st100-text-dark);
}

body,
button,
input,
select,
textarea,
.ast-button,
.ast-custom-button {
  font-family: "Manrope", "Segoe UI", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.site-title,
.site-title a,
.entry-content :where(h1,h2,h3,h4,h5,h6) {
  font-family: "Rajdhani", "Segoe UI", sans-serif;
  letter-spacing: 0.01em;
}

.ast-theme-transparent-header #masthead,
#masthead {
  background: linear-gradient(180deg, rgba(9, 16, 24, 0.96), rgba(12, 20, 28, 0.9));
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
}

.site-title a,
.ast-header-break-point .main-header-menu .menu-link,
.main-header-menu .menu-link,
.ast-builder-menu .menu-link {
  color: #f7fafc;
}

.main-header-menu .menu-link:hover,
.ast-builder-menu .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link,
.ast-builder-menu .current-menu-item > .menu-link {
  color: var(--st100-accent);
}

.site-below-footer-wrap,
.site-primary-footer-wrap {
  background: linear-gradient(180deg, #111a22, #0c141b);
  color: #c7d2dc;
}

.site-primary-footer-wrap a,
.site-below-footer-wrap a {
  color: #f0f4f8;
}

.site .entry-content {
  padding-top: 24px;
}

.container,
.site .entry-content > section > .container,
.st100-product-hero,
.st100-product-section,
.st100-product-related {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.site .entry-content > section {
  margin: 0 auto 28px;
  padding: 34px 28px;
  background: var(--st100-card);
  border: 1px solid var(--st100-line-dark);
  border-radius: 24px;
  box-shadow: var(--st100-shadow);
}

.site .entry-content > section h1,
.site .entry-content > section h2,
.site .entry-content > section h3 {
  color: var(--st100-text-dark);
}

.site .entry-content > section h1 {
  margin-bottom: 16px;
  font-size: clamp(2.1rem, 4.6vw, 3.8rem);
  line-height: 0.95;
}

.site .entry-content > section p,
.site .entry-content > section li {
  color: var(--st100-muted-dark);
  font-size: 1rem;
}

.site .entry-content > section ul {
  margin: 0;
  padding-left: 18px;
}

.site .entry-content > section a {
  color: var(--st100-accent);
  font-weight: 600;
}

.site .entry-content > section a:hover {
  color: var(--st100-accent-deep);
}

.site .entry-content > section .st100-product-card-grid {
  margin-top: 18px;
}

.site .entry-content > section:first-child,
.st100-hero,
.st100-page-header {
  background:
    radial-gradient(circle at top right, rgba(234, 107, 31, 0.16), transparent 34%),
    linear-gradient(135deg, #101821 0%, #17222d 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.site .entry-content > section:first-child h1,
.site .entry-content > section:first-child h2,
.st100-hero h1,
.st100-page-header h1 {
  color: var(--st100-ink-strong);
}

.site .entry-content > section:first-child p,
.site .entry-content > section:first-child li,
.st100-hero p,
.st100-page-header p {
  color: var(--st100-muted);
}

.st100-hero {
  position: relative;
  overflow: hidden;
}

.st100-hero::after,
.st100-page-header::after {
  content: "";
  position: absolute;
  inset: auto -10% -38% auto;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(234, 107, 31, 0.18), transparent 68%);
  pointer-events: none;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: #f3f6f9;
  border: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 20px;
}

.st100-grid {
  display: grid;
  gap: 20px;
}

.st100-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.st100-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.st100-card {
  height: 100%;
  padding: 24px;
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f6f8fa 100%);
  border: 1px solid rgba(18, 31, 40, 0.08);
  box-shadow: 0 14px 28px rgba(10, 19, 27, 0.08);
}

.st100-card h3 {
  margin-bottom: 10px;
  font-size: 1.45rem;
}

.st100-card p {
  margin-bottom: 16px;
}

.st100-section.alt {
  background:
    linear-gradient(180deg, rgba(245, 247, 249, 0.98), rgba(235, 240, 244, 0.98)),
    var(--st100-card-alt);
}

.st100-list li + li {
  margin-top: 8px;
}

.button,
.wp-block-button__link,
.ast-button,
.ast-custom-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--st100-accent);
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.button:hover,
.wp-block-button__link:hover,
.ast-button:hover,
.ast-custom-button:hover {
  background: var(--st100-accent-deep);
  color: #fff;
  transform: translateY(-1px);
}

.st100-product-hero,
.st100-product-section,
.st100-product-related {
  margin: 0 auto;
  padding: 28px 20px;
}

.st100-product-hero {
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
}

.st100-product-hero__media,
.st100-product-section__card {
  background: var(--st100-card);
  border: 1px solid var(--st100-line-dark);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 18px 42px rgba(7, 16, 24, 0.12);
}

.st100-product-hero__summary {
  display: grid;
  gap: 16px;
  align-content: start;
  padding: 28px;
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fb 100%);
  border: 1px solid var(--st100-line-dark);
  box-shadow: 0 18px 42px rgba(7, 16, 24, 0.12);
}

.st100-product-label {
  display: inline-flex;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--st100-accent-soft);
  color: var(--st100-accent-deep);
  font-size: 13px;
  font-weight: 700;
}

.st100-product-model { margin: 0; color: #617585; font-weight: 700; }
.st100-product-points,.st100-keyvalue-list { margin: 0; padding-left: 18px; }
.st100-product-section { display: grid; gap: 18px; }
.st100-product-section__card { padding: 24px; }
.st100-param-grid { display: grid; gap: 10px 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.st100-param-item { padding: 14px; border: 1px solid rgba(17, 32, 42, 0.08); border-radius: 14px; background: #fff; }
.st100-param-item strong { display: block; margin-bottom: 4px; color: var(--st100-text-dark); }
.st100-gallery-grid,.st100-product-card-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.st100-gallery-grid figure,.st100-product-card { margin: 0; background: #fff; border: 1px solid rgba(17, 32, 42, 0.08); border-radius: 18px; overflow: hidden; box-shadow: 0 12px 26px rgba(9, 18, 26, 0.08); }
.st100-gallery-card { min-height: 240px; }
.st100-gallery-grid figure img,
.st100-product-card__image img,
.st100-product-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.st100-product-card__image {
  position: relative;
  display: grid;
  min-height: 220px;
  background: linear-gradient(135deg, #edf2f7, #dce5ec);
}
.st100-product-card__image--placeholder,
.st100-media-placeholder {
  position: relative;
  overflow: hidden;
  display: grid;
  align-content: end;
  gap: 8px;
  min-height: 100%;
  padding: 22px;
  background:
    radial-gradient(circle at top right, rgba(234, 107, 31, 0.16), transparent 34%),
    linear-gradient(140deg, #12202c 0%, #1b2c3b 100%);
  color: #fff;
}
.st100-product-card__image--placeholder::before,
.st100-media-placeholder::before {
  content: "";
  position: absolute;
  inset: 16px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background:
    linear-gradient(90deg, transparent 0, transparent 46%, rgba(255,255,255,0.08) 46%, rgba(255,255,255,0.08) 54%, transparent 54%, transparent 100%),
    linear-gradient(transparent 0, transparent 58%, rgba(255,255,255,0.08) 58%, rgba(255,255,255,0.08) 66%, transparent 66%, transparent 100%);
}
.st100-product-card__image--placeholder > *,
.st100-media-placeholder > * {
  position: relative;
  z-index: 1;
}
.st100-product-card__eyebrow,
.st100-media-placeholder span {
  display: inline-flex;
  width: fit-content;
  min-height: 30px;
  align-items: center;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.st100-product-card__placeholder-model {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.92rem;
  font-weight: 700;
}
.st100-media-placeholder strong {
  max-width: 18rem;
  font-size: 1rem;
  line-height: 1.45;
}
.st100-media-placeholder--hero {
  min-height: 100%;
  border-radius: 22px;
}
.st100-product-card__body { padding: 16px; }
.st100-product-card__body h3 {
  margin-bottom: 8px;
  font-size: 1.35rem;
}
.st100-product-card__model { color: #617585; margin-bottom: 10px; }
.st100-product-card__body p:last-of-type {
  min-height: 3.2em;
}
.st100-product-card__actions {
  margin-top: 16px;
}
.st100-empty-note { padding: 16px; border: 1px dashed rgba(18, 31, 40, 0.18); border-radius: 12px; color: #5e6b76; background: #fff; }
.st100-cta-row { display: flex; flex-wrap: wrap; gap: 12px; }
.button.button-secondary {
  background: transparent;
  color: var(--st100-accent);
  border: 1px solid var(--st100-accent);
}
.st100-solution-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.st100-solution-links a {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--st100-accent-soft);
  color: var(--st100-accent-deep);
  text-decoration: none;
}
.st100-solution-links a:hover {
  background: #f1d2bf;
}
.st100-category-grid,
.st100-scene-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.st100-line-card {
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(220px, 0.95fr) minmax(0, 1.05fr);
  align-items: stretch;
}
.st100-line-card__visual {
  min-height: 280px;
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(234, 107, 31, 0.2), transparent 28%),
    linear-gradient(145deg, #111b24 0%, #203243 100%);
  position: relative;
  overflow: hidden;
}
.st100-line-card__visual::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.st100-line-card__visual::after {
  content: "";
  position: absolute;
  inset: auto 28px 28px auto;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(234, 107, 31, 0.22), transparent 70%);
}
.st100-line-card__copy {
  display: grid;
  gap: 16px;
  align-content: start;
}
.st100-line-card__copy h3 {
  margin-bottom: 0;
}
.st100-card-note {
  margin: 0;
  color: var(--st100-muted-dark);
}
.st100-scene-card {
  padding: 22px;
  border-radius: 18px;
  background: linear-gradient(180deg, #fff 0%, #f5f8fa 100%);
  border: 1px solid rgba(17, 32, 42, 0.08);
  box-shadow: 0 12px 26px rgba(9, 18, 26, 0.08);
}
.st100-scene-card h3 {
  margin-bottom: 8px;
}

.widget-title,
.footer-widget-area h2 {
  color: #ffffff;
}

@media (max-width: 900px) {
  .st100-product-hero { grid-template-columns: 1fr; }
  .st100-grid.two,
  .st100-grid.three,
  .st100-line-card {
    grid-template-columns: 1fr;
  }
  .site .entry-content > section { padding: 22px 18px; }
}