/** K3 per-stil inline CSS from source HTML landing files. Scoped to slotivo-kostur-c only. */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] {
  background-color: var(--background, #111111) !important;
  color: var(--on-background, #f0ece6) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Tailwind important prefix scopes utilities to descendants — body utilities need explicit rules */
body[class*='slotivo-kostur-c'].bg-background {
  background-color: var(--background) !important;
}
body[class*='slotivo-kostur-c'].text-on-background {
  color: var(--on-background) !important;
}

body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] {
  background-color: #131313 !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] {
  background-color: #131313 !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] {
  background-color: #131314 !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] {
  background-color: #0a0a0a !important;
}

/* HTML Tailwind: fontFamily/fontSize both named "body-lg" → .font-body-lg utility is empty */
@media (min-width: 768px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] .md\:text-display-lg,
  body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) .md\:text-display-lg {
    font-size: 72px;
    line-height: 1;
    letter-spacing: -0.04em;
    font-weight: 800;
  }
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] .md\:text-headline-lg,
  body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) .md\:text-headline-lg {
    font-size: 48px;
    line-height: 1.1;
    letter-spacing: -0.02em;
    font-weight: 800;
  }
}

/* Tailwind space-y uses [hidden] attribute — gradient stops must match source HTML rgba */
body[class*='slotivo-kostur-c'] .bg-gradient-to-r.from-background.via-background\/80.to-transparent {
  background-image: linear-gradient(
    to right,
    rgb(19, 19, 19),
    rgba(19, 19, 19, 0.8),
    transparent
  ) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] .bg-gradient-to-r.from-background.via-background\/80.to-transparent {
  background-image: linear-gradient(
    to right,
    rgb(19, 19, 19),
    rgba(19, 19, 19, 0.8),
    transparent
  ) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] .bg-gradient-to-r.from-background.via-background\/80.to-transparent {
  background-image: linear-gradient(
    to right,
    rgb(19, 19, 20),
    rgba(19, 19, 20, 0.8),
    transparent
  ) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] .bg-gradient-to-r.from-background.via-background\/90.to-transparent {
  background-image: linear-gradient(
    to right,
    rgb(10, 10, 10),
    rgba(10, 10, 10, 0.9),
    transparent
  ) !important;
}

/* Match source HTML: .font-body-lg on <body> is an empty Tailwind utility (name clash) */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'].font-body-lg,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c']:not([data-slotivo-stil]).font-body-lg {
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'].font-body-lg,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'].font-body-lg {
  font-family: 'Hanken Grotesk', system-ui, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'].font-body-lg {
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}

body[class*='slotivo-kostur-c'] .opacity-30 {
  opacity: 0.3 !important;
}
body[class*='slotivo-kostur-c'] .opacity-20 {
  opacity: 0.2 !important;
}

/* S1/S2 — tokens-c label utilities set fw 600/500; HTML font-bold wins at 700 */
body[class*='slotivo-kostur-c'] .font-bold.text-label-caps,
body[class*='slotivo-kostur-c'] .font-bold.font-label-caps,
body[class*='slotivo-kostur-c'] .font-bold.text-label-sm,
body[class*='slotivo-kostur-c'] .font-bold.font-label-sm {
  font-weight: 700 !important;
}

/* S1 — nav font-black must beat text-headline-lg-mobile fw 800 from tokens */
body[class*='slotivo-kostur-c'] nav a.font-black {
  font-weight: 900 !important;
}

/* S1 hero h1 — leading-none must beat tokens-c text-headline-lg-mobile line-height 1.1 (mobile only) */
@media (max-width: 767px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] h1.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] .font-display-lg.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) h1.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) .font-display-lg.text-headline-lg-mobile.leading-none {
    line-height: 1 !important;
  }
}

@media (min-width: 768px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main h1.leading-none,
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main h1.leading-none {
    line-height: 1.1 !important;
  }
}

/* S2 tattoo-barber — leading-none beats tokens-c text-headline-lg-mobile lh 1.2 (mobile only) */
@media (max-width: 767px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] h1.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] .font-headline-xl.text-headline-lg-mobile.leading-none {
    line-height: 1 !important;
  }
}

@media (min-width: 768px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main h1.leading-none {
    line-height: 1.1 !important;
  }
}

/* S1 hero CTAs — primary 40px; secondary with icon 44px (HTML natural) */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] main .flex.flex-col.sm\:flex-row > button.border-strong.px-md.py-sm:first-child,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) main .flex.flex-col.sm\:flex-row > button.border-strong.px-md.py-sm:first-child {
  height: 40px !important;
  min-height: 0 !important;
  max-height: 40px !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] main .flex.flex-col.sm\:flex-row > button.border-strong.px-md.py-sm:not(:first-child),
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) main .flex.flex-col.sm\:flex-row > button.border-strong.px-md.py-sm:not(:first-child) {
  height: 44px !important;
  min-height: 0 !important;
  max-height: 44px !important;
}

/* HTML inline styles — glow + border-strong (file:// has no slotivo-tokens-c.css) */
body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] .glow-accent,
body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) .glow-accent {
  box-shadow: 0 0 15px 2px rgba(255, 92, 0, 0.4) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S1'] .border-strong,
body[class*='slotivo-kostur-c']:not([data-slotivo-stil]) .border-strong {
  border-width: 2px !important;
  border-color: #e5e2e1 !important;
}

/* S2 inline styles from HTML */
body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] .glow-accent {
  box-shadow: 0 0 15px 2px rgba(204, 51, 0, 0.4) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] .border-strong {
  border-width: 2px !important;
  border-color: #5b4039 !important;
}

/* S2 hero tattoo CTAs — primary 40px, secondary with icon 44px */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main .flex.flex-col.sm\:flex-row > button.tattoo-border:first-child,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main .flex.flex-col.sm\:flex-row > a.tattoo-border:first-child {
  height: 40px !important;
  min-height: 0 !important;
  max-height: 40px !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main .flex.flex-col.sm\:flex-row > button.tattoo-border:not(:first-child),
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S2'] main .flex.flex-col.sm\:flex-row > a.tattoo-border:not(:first-child) {
  height: 44px !important;
  min-height: 0 !important;
  max-height: 44px !important;
}

/* S3 neon-underground — leading-none beats tokens-c text-headline-lg-mobile lh 1.2 (mobile only) */
@media (max-width: 767px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] h1.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] .font-headline-xl.text-headline-lg-mobile.leading-none {
    line-height: 1 !important;
  }
}

@media (min-width: 768px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main h1.leading-none {
    line-height: 1.1 !important;
  }
}

body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] .glow-accent {
  box-shadow: 0 0 15px 2px rgba(0, 240, 255, 0.4) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] .border-strong {
  border-width: 1px !important;
  border-color: #3b494b !important;
}

html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main .flex.flex-col.sm\:flex-row > button.tattoo-border:first-child,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main .flex.flex-col.sm\:flex-row > a.tattoo-border:first-child {
  height: 40px !important;
  min-height: 0 !important;
  max-height: 40px !important;
  line-height: 14.4px !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main .flex.flex-col.sm\:flex-row > button.tattoo-border:not(:first-child),
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S3'] main .flex.flex-col.sm\:flex-row > a.tattoo-border:not(:first-child) {
  height: 42px !important;
  min-height: 0 !important;
  max-height: 42px !important;
  line-height: 14.4px !important;
}

/* S4 fade-culture — leading-none beats tokens-c text-headline-lg-mobile lh 1.1 (mobile only) */
@media (max-width: 767px) {
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] h1.text-headline-lg-mobile.leading-none,
  body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] .font-display-lg.text-headline-lg-mobile.leading-none {
    line-height: 1 !important;
  }
}

body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] .glow-accent {
  box-shadow: 0 0 15px 1px rgba(0, 242, 255, 0.4) !important;
}
body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] .border-strong {
  border-width: 1px !important;
  border-color: #333333 !important;
}

/* S4 hero CTAs — primary 38px, secondary 42px (HTML natural) */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] main .flex.flex-col.sm\:flex-row > button.border-strong:first-child,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] main .flex.flex-col.sm\:flex-row > a.border-strong:first-child {
  height: 38px !important;
  min-height: 0 !important;
  max-height: 38px !important;
}
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] main .flex.flex-col.sm\:flex-row > button:not(:first-child),
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] main .flex.flex-col.sm\:flex-row > a:not(:first-child) {
  height: 42px !important;
  min-height: 0 !important;
  max-height: 42px !important;
}

/* Platform globals-post.css .bg-grid uses indigo grid — S4 fade-culture needs white 3% lines */
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'].bg-grid {
  background-size: 40px 40px !important;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px) !important;
}

body[class*='slotivo-kostur-c'] .space-y-xs > :not([hidden]) ~ :not([hidden]) {
  margin-top: var(--xs);
}

body[class*='slotivo-kostur-c'] main button.font-label-caps.text-label-caps,
body[class*='slotivo-kostur-c'] main a.font-label-caps.text-label-caps {
  line-height: 12px;
}

html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] main button.border-strong.px-md.py-sm:not(.w-full),
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] main a.border-strong.px-md.py-sm:not(.w-full) {
  box-sizing: border-box;
  height: 44px;
  min-height: 0;
  max-height: 44px;
  padding-top: var(--sm);
  padding-bottom: var(--sm);
  line-height: 12px;
}

html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] form button.w-full.border-strong.px-md.py-sm,
html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] form button.w-full.tattoo-border {
  box-sizing: border-box;
  height: 40px;
  min-height: 0;
  max-height: 40px;
  padding-top: var(--sm);
  padding-bottom: var(--sm);
  line-height: 12px;
}

html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'][data-slotivo-stil='S4'] form button.w-full.border-strong.px-md.py-sm {
  height: 38px;
  max-height: 38px;
}

html[data-slotivo-template-ready] body[class*='slotivo-kostur-c'] .space-y-xs > label {
  display: inline;
  margin: 0;
}
