/* Korak Ka Udobnosti — shared visual theme */
:root {
  --kk-ink: #171717;
  --kk-ink-soft: #2a2926;
  --kk-gold: #f2b705;
  --kk-gold-light: #fff0b8;
  --kk-gold-dark: #a86f00;
  --kk-cream: #fffaf0;
  --kk-paper: #ffffff;
  --kk-line: #eadfbd;
  --kk-muted: #6d6656;
  --kk-shadow: 0 18px 48px rgba(67, 48, 9, 0.14);
  --kk-radius: 24px;
}

html {
  background: var(--kk-cream) !important;
}

body,
body.u-body {
  margin: 0;
  background: var(--kk-cream) !important;
  color: var(--kk-ink) !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
}

body,
button,
input,
select,
textarea {
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.u-heading-font,
.u-heading-font a {
  color: var(--kk-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  letter-spacing: -0.035em;
}

a {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

/* Header */
.u-header {
  z-index: 20;
  overflow: visible;
  background: var(--kk-paper) !important;
  box-shadow: 0 10px 28px rgba(43, 31, 9, 0.12) !important;
}

.u-header .u-section-rows > .u-section-row:first-child {
  background: var(--kk-ink) !important;
}

.u-header .u-section-row:first-child .u-text,
.u-header .u-section-row:first-child a {
  color: #fffdf7 !important;
}

.u-header .u-section-row-2 {
  background: var(--kk-paper) !important;
  border-bottom: 1px solid var(--kk-line) !important;
}

.u-header .u-text-2,
.u-header .u-text-2 a,
.u-header .u-text-palette-1-base,
.u-header .u-text-palette-2-base {
  color: var(--kk-ink) !important;
}

.u-header .u-text-2 a {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.u-header .u-nav-link,
.u-header .u-button-style.u-nav-link {
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  color: var(--kk-ink) !important;
  background: transparent !important;
}

.u-header .u-nav-link:hover,
.u-header .u-nav-link:focus,
.u-header .u-nav-link.u-active,
.u-header .u-nav-link.u-active-palette-2-base,
.u-header .u-nav-link.u-button-style:hover {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

.u-header .u-hamburger-link {
  border-radius: 999px !important;
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

.u-header .u-sidenav {
  background: var(--kk-ink) !important;
}

.u-header .u-sidenav .u-nav-link,
.u-header .u-sidenav .u-menu-close {
  color: #fffdf7 !important;
}

.u-header .u-sidenav .u-nav-link:hover,
.u-header .u-sidenav .u-nav-link:focus {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

/* Generated Nicepage pages */
.u-body > .u-section:not(.u-cookies-consent),
.u-body > main > .u-section:not(.u-cookies-consent) {
  background: var(--kk-paper) !important;
}

.u-body > .u-section:not(.u-cookies-consent) .u-sheet,
.u-body > main > .u-section:not(.u-cookies-consent) .u-sheet {
  border-radius: var(--kk-radius);
}

.u-body .u-btn,
.u-body a.u-btn,
.u-body button.u-btn {
  border-radius: 999px !important;
  font-weight: 700;
  box-shadow: 0 10px 24px rgba(71, 48, 3, 0.12);
}

.u-body .u-btn:hover,
.u-body a.u-btn:hover,
.u-body button.u-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(71, 48, 3, 0.18);
}

.u-body input,
.u-body select,
.u-body textarea,
.u-body .u-input,
.u-body .u-form-control {
  border: 1px solid var(--kk-line) !important;
  border-radius: 14px !important;
  background: #fffdf8 !important;
  color: var(--kk-ink) !important;
}

.u-body input:focus,
.u-body select:focus,
.u-body textarea:focus,
.u-body .u-input:focus {
  outline: 3px solid rgba(242, 183, 5, 0.25) !important;
  border-color: var(--kk-gold-dark) !important;
}

.u-body > .u-section:not(.u-cookies-consent) h1,
.u-body > .u-section:not(.u-cookies-consent) h2,
.u-body > .u-section:not(.u-cookies-consent) h3 {
  color: var(--kk-ink) !important;
}

.u-body > .u-section:not(.u-cookies-consent) .u-text,
.u-body > .u-section:not(.u-cookies-consent) p,
.u-body > .u-section:not(.u-cookies-consent) li {
  color: var(--kk-ink-soft);
}

.u-footer {
  border-top: 5px solid var(--kk-gold) !important;
  background: var(--kk-ink) !important;
  color: #fffdf7 !important;
}

.u-footer .u-text,
.u-footer p,
.u-footer a,
.u-footer .u-nav-link,
.u-footer .u-text-palette-1-base,
.u-footer .u-text-palette-2-base {
  color: #fffdf7 !important;
}

.u-footer a:hover,
.u-footer .u-nav-link:hover {
  color: var(--kk-gold) !important;
}

.u-cookies-consent {
  z-index: 10000 !important;
  border-top: 4px solid var(--kk-gold) !important;
  background: var(--kk-ink) !important;
  color: #fffdf7 !important;
  box-shadow: 0 -12px 30px rgba(23, 23, 23, 0.18) !important;
}

.u-cookies-consent .u-text,
.u-cookies-consent p,
.u-cookies-consent a {
  color: #fffdf7 !important;
}

.u-cookies-consent .u-btn,
.u-cookies-consent .u-btn-1 {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

/* Shared Herbolen content */
.hro-main {
  --hro-ink: var(--kk-ink) !important;
  --hro-green: var(--kk-gold-dark) !important;
  --hro-green-dark: #704800 !important;
  --hro-lime: #ffd85d !important;
  --hro-soft: #fff1bd !important;
  --hro-cream: var(--kk-cream) !important;
  --hro-line: var(--kk-line) !important;
  --hro-muted: var(--kk-muted) !important;
  background: var(--kk-cream) !important;
  color: var(--kk-ink) !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
}

.hro-main h1,
.hro-main h2,
.hro-main h3,
.hro-main h4,
.hro-main h5,
.hro-main h6 {
  font-family: Georgia, "Times New Roman", serif !important;
  letter-spacing: -0.04em;
}

.hro-hero,
.hro-page-hero,
.hro-order-shell {
  background: linear-gradient(135deg, #fffdf7 0%, #fff3c7 100%) !important;
}

.hro-section-soft {
  background: #fff3c9 !important;
}

.hro-section-dark,
.hro-final-cta {
  background: var(--kk-ink) !important;
  color: #fffdf7 !important;
}

.hro-section-dark h1,
.hro-section-dark h2,
.hro-section-dark h3,
.hro-section-dark p,
.hro-section-dark span,
.hro-final-cta h1,
.hro-final-cta h2,
.hro-final-cta h3,
.hro-final-cta p,
.hro-final-cta span {
  color: #fffdf7;
}

.hro-eyebrow,
.hro-card-kicker,
.hro-price-line strong,
.hro-option-price strong,
.hro-summary-total strong,
.hro-cart-total-line strong {
  color: var(--kk-gold-dark) !important;
}

.hro-eyebrow-light {
  color: var(--kk-gold) !important;
}

.hro-btn,
.hro-btn-primary,
.hro-cart-checkout,
.hro-order-cta,
.hro-payment-next,
.hro-payment-submit {
  border-radius: 999px !important;
  font-weight: 700;
}

.hro-btn-primary,
.hro-cart-checkout,
.hro-order-cta,
.hro-payment-next,
.hro-payment-submit {
  color: var(--kk-ink) !important;
  background: linear-gradient(135deg, var(--kk-gold) 0%, #ffd85d 100%) !important;
  border-color: var(--kk-gold) !important;
  box-shadow: 0 14px 30px rgba(168, 111, 0, 0.24) !important;
}

.hro-btn-primary:hover,
.hro-cart-checkout:hover,
.hro-order-cta:hover,
.hro-payment-next:hover,
.hro-payment-submit:hover {
  color: var(--kk-ink) !important;
  background: linear-gradient(135deg, #ffd85d 0%, var(--kk-gold) 100%) !important;
}

.hro-btn-secondary {
  color: var(--kk-ink) !important;
  border-color: var(--kk-gold-dark) !important;
  background: transparent !important;
}

.hro-btn-secondary:hover {
  color: var(--kk-ink) !important;
  background: var(--kk-gold-light) !important;
}

.hro-btn-light {
  color: var(--kk-ink) !important;
  background: #fffdf7 !important;
  border-color: #fffdf7 !important;
}

.hro-btn-light:hover {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

.hro-product-stage,
.hro-featured-image,
.hro-about-image,
.hro-order-media {
  border-radius: 32px !important;
  background: radial-gradient(circle at 50% 34%, #fffdf7 0%, #fff0b8 100%) !important;
  box-shadow: var(--kk-shadow) !important;
}

.hro-product-stage img,
.hro-featured-image img,
.hro-about-image img,
.hro-order-media > img {
  filter: drop-shadow(0 26px 20px rgba(47, 34, 6, 0.2)) !important;
}

.hro-benefit-card,
.hro-trust-card,
.hro-product-card,
.hro-info-card,
.hro-contact-info-card,
.hro-order-details,
.hro-order-summary,
.hro-payment-flow,
.hro-payment-summary,
.hro-payment-panel,
.hro-contact-form,
.hro-order-media {
  border: 1px solid var(--kk-line) !important;
  border-radius: var(--kk-radius) !important;
  box-shadow: var(--kk-shadow) !important;
}

.hro-benefit-card,
.hro-trust-card,
.hro-product-card,
.hro-info-card,
.hro-contact-info-card,
.hro-order-details,
.hro-order-summary,
.hro-payment-flow,
.hro-payment-summary,
.hro-payment-panel,
.hro-contact-form {
  background: rgba(255, 255, 255, 0.92) !important;
}

.hro-order-option {
  border-color: var(--kk-line) !important;
  border-radius: 18px !important;
  background: #fffdf8 !important;
}

.hro-order-option:hover,
.hro-order-option.is-selected {
  border-color: var(--kk-gold-dark) !important;
  background: #fff3c9 !important;
}

.hro-radio,
.hro-payment-step span,
.hro-payment-step.is-current span {
  border-color: var(--kk-gold-dark) !important;
}

.hro-order-option.is-selected .hro-radio,
.hro-payment-step.is-current span {
  background: var(--kk-gold) !important;
  box-shadow: inset 0 0 0 4px #fffdf7 !important;
}

.hro-order-divider,
.hro-summary-line,
.hro-cart-totals > div,
.hro-payment-steps,
.hro-cart-head {
  border-color: var(--kk-line) !important;
}

.hro-order-disclaimer,
.hro-cart-note,
.hro-payment-panel-lead,
.hro-order-footnotes,
.hro-order-details p {
  color: var(--kk-muted) !important;
}

/* Cart and checkout */
.hro-cart-layer {
  z-index: 10001 !important;
}

.hro-cart-backdrop {
  background: rgba(23, 23, 23, 0.72) !important;
}

.hro-cart-drawer {
  border-left: 5px solid var(--kk-gold) !important;
  border-radius: 28px 0 0 28px !important;
  background: #fffdf7 !important;
  box-shadow: -18px 0 48px rgba(23, 23, 23, 0.2) !important;
}

.hro-cart-close {
  color: var(--kk-ink) !important;
  border-color: var(--kk-line) !important;
  border-radius: 50% !important;
  background: var(--kk-gold-light) !important;
}

.hro-cart-promo,
.hro-cart-delivery {
  border: 1px solid var(--kk-line) !important;
  border-radius: 18px !important;
  background: #fff1bd !important;
}

.hro-cart-stepper {
  border-color: var(--kk-gold-dark) !important;
  border-radius: 14px !important;
  overflow: hidden;
}

.hro-cart-stepper button {
  color: var(--kk-ink) !important;
  background: var(--kk-gold-light) !important;
}

.hro-cart-stepper strong {
  color: var(--kk-ink) !important;
  background: #fffdf7 !important;
}

.hro-payment-section {
  background: linear-gradient(180deg, #fffaf0 0%, #fff2c2 100%) !important;
}

.hro-payment-secure {
  border-color: var(--kk-line) !important;
  background: #fff1bd !important;
}

.hro-payment-step.is-current strong,
.hro-payment-step.is-complete strong {
  color: var(--kk-gold-dark) !important;
}

.hro-payment-step-line {
  background: var(--kk-line) !important;
}

.hro-payment-form input,
.hro-payment-form select,
.hro-payment-form textarea,
.hro-form input,
.hro-form select,
.hro-form textarea {
  border: 1px solid var(--kk-line) !important;
  border-radius: 14px !important;
  background: #fffdf8 !important;
}

.hro-payment-form input:focus,
.hro-payment-form select:focus,
.hro-payment-form textarea:focus,
.hro-form input:focus,
.hro-form select:focus,
.hro-form textarea:focus {
  outline: 3px solid rgba(242, 183, 5, 0.23) !important;
  border-color: var(--kk-gold-dark) !important;
}

.hro-payment-summary {
  background: var(--kk-ink) !important;
  color: #fffdf7 !important;
}

.hro-payment-summary h3,
.hro-payment-summary p,
.hro-payment-summary span,
.hro-payment-summary strong {
  color: #fffdf7 !important;
}

.hro-payment-summary .hro-summary-total strong,
.hro-payment-summary .hro-summary-discount strong {
  color: var(--kk-gold) !important;
}

.hro-payment-final,
.hro-payment-success {
  border-color: var(--kk-gold) !important;
  border-radius: var(--kk-radius) !important;
  background: #fff3c9 !important;
}

@media (max-width: 900px) {
  .hro-cart-drawer {
    width: min(94vw, 520px) !important;
  }
}

@media (max-width: 640px) {
  .u-header .u-text-2 a {
    font-size: 1.05rem;
  }

  .hro-main .hro-container {
    width: calc(100% - 28px) !important;
  }

  .hro-product-stage,
  .hro-featured-image,
  .hro-about-image,
  .hro-order-media {
    border-radius: 24px !important;
  }

  .hro-cart-drawer {
    width: 100% !important;
    border-left: 0 !important;
    border-top: 5px solid var(--kk-gold) !important;
    border-radius: 24px 24px 0 0 !important;
  }
}

/* Final site-wide contrast pass.
   Nicepage palette utilities are deliberately overridden here so the shared
   gold, cream and ink theme is visible on every exported page. */
:root {
  --kk-ink: #171717;
  --kk-ink-soft: #28251f;
  --kk-gold: #f2b705;
  --kk-gold-light: #fff0b8;
  --kk-gold-dark: #8a5b00;
  --kk-cream: #fffaf0;
  --kk-paper: #fffdf7;
  --kk-line: #dfcc96;
  --kk-muted: #4c463a;
  --kk-shadow: 0 18px 48px rgba(67, 48, 9, 0.16);
}

html,
html body.u-body {
  background: var(--kk-cream) !important;
  color: var(--kk-ink) !important;
}

html body.u-body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Exported Nicepage pages: readable copy and the same paper surface. */
html body.u-body > .u-section:not(.u-cookies-consent),
html body.u-body > main > .u-section:not(.u-cookies-consent) {
  color: var(--kk-ink) !important;
  background: var(--kk-paper) !important;
  background-image: none !important;
}

html body.u-body > .u-section:not(.u-cookies-consent) h1,
html body.u-body > .u-section:not(.u-cookies-consent) h2,
html body.u-body > .u-section:not(.u-cookies-consent) h3,
html body.u-body > .u-section:not(.u-cookies-consent) h4,
html body.u-body > .u-section:not(.u-cookies-consent) h5,
html body.u-body > .u-section:not(.u-cookies-consent) h6,
html body.u-body > .u-section:not(.u-cookies-consent) .u-heading-font {
  color: var(--kk-ink) !important;
}

html body.u-body > .u-section:not(.u-cookies-consent) p,
html body.u-body > .u-section:not(.u-cookies-consent) li,
html body.u-body > .u-section:not(.u-cookies-consent) .u-text {
  color: var(--kk-ink-soft) !important;
}

html body.u-body > .u-section:not(.u-cookies-consent) a:not(.u-btn) {
  color: var(--kk-gold-dark) !important;
}

html body.u-body > .u-section:not(.u-cookies-consent) a:not(.u-btn):hover,
html body.u-body > .u-section:not(.u-cookies-consent) a:not(.u-btn):focus {
  color: var(--kk-ink) !important;
}

/* Nicepage's green utility classes are still present in the export. */
html body.u-body .u-text-palette-1-base,
html body.u-body .u-text-palette-2-base {
  color: var(--kk-ink) !important;
}

html body.u-body .u-text-hover-palette-1-base:hover,
html body.u-body .u-text-hover-palette-1-base:focus,
html body.u-body .u-text-hover-palette-1-base.hover,
html body.u-body .u-link.u-text-hover-palette-1-base:hover,
html body.u-body .u-link.u-text-hover-palette-1-base:focus {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .u-palette-2-base {
  color: var(--kk-ink) !important;
  background-color: var(--kk-gold) !important;
  background-image: none !important;
}

html body.u-body .u-palette-1-dark-3,
html body.u-body .u-black {
  color: #fffdf7 !important;
  background-color: var(--kk-ink) !important;
  background-image: none !important;
}

html body.u-body .u-white {
  color: var(--kk-ink) !important;
  background-color: var(--kk-paper) !important;
  background-image: none !important;
}

html body.u-body .u-grey-15 {
  color: var(--kk-ink) !important;
  background-color: #f2ead5 !important;
  background-image: none !important;
}

html body.u-body .u-button-style.u-palette-2-base,
html body.u-body .u-btn.u-palette-2-base {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-button-style.u-palette-2-base:hover,
html body.u-body .u-button-style.u-palette-2-base:focus,
html body.u-body .u-button-style.u-palette-2-base:active,
html body.u-body .u-btn.u-palette-2-base:hover,
html body.u-body .u-btn.u-palette-2-base:focus,
html body.u-body .u-btn.u-palette-2-base:active {
  color: var(--kk-ink) !important;
  background: #ffd85d !important;
  border-color: #ffd85d !important;
}

html body.u-body .u-border-palette-1-base,
html body.u-body .u-border-palette-2-base,
html body.u-body .u-border-hover-palette-2-base:hover,
html body.u-body .u-border-hover-palette-2-base:focus {
  border-color: var(--kk-gold-dark) !important;
  stroke: var(--kk-gold-dark) !important;
}

/* Header: same typography and palette, without changing its HTML or links. */
html body.u-body .u-header,
html body.u-body .u-header .u-section-row-2 {
  color: var(--kk-ink) !important;
  background: var(--kk-paper) !important;
  border-color: var(--kk-line) !important;
}

html body.u-body .u-header .u-section-rows > .u-section-row:first-child,
html body.u-body .u-header .u-section-rows > .u-section-row:first-child.u-palette-2-base {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
  border-color: var(--kk-ink) !important;
}

html body.u-body .u-header .u-section-rows > .u-section-row:first-child *,
html body.u-body .u-header .u-section-rows > .u-section-row:first-child a {
  color: #fffdf7 !important;
}

html body.u-body .u-header .u-text-2,
html body.u-body .u-header .u-text-2 a,
html body.u-body .u-header .u-text-2.u-text-palette-1-base,
html body.u-body .u-header .u-text-2 a.u-text-palette-2-base {
  color: var(--kk-ink) !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

html body.u-body .u-header .u-text-2 a {
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 700 !important;
}

html body.u-body .u-header .u-nav-link,
html body.u-body .u-header .u-nav-link.u-white {
  color: var(--kk-ink) !important;
  background: transparent !important;
  border-color: transparent !important;
}

html body.u-body .u-header .u-nav-link:hover,
html body.u-body .u-header .u-nav-link:focus,
html body.u-body .u-header .u-nav-link.u-active,
html body.u-body .u-header .u-nav-link.u-active-palette-2-base,
html body.u-body .u-header .u-nav-link.u-button-style:hover,
html body.u-body .u-header .u-nav-link.u-button-style:focus {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-header .u-hamburger-link {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-header .u-hamburger-link .u-svg-content,
html body.u-body .u-header .u-hamburger-link .u-svg-link {
  color: var(--kk-ink) !important;
  fill: var(--kk-ink) !important;
  stroke: var(--kk-ink) !important;
}

html body.u-body .u-header .u-sidenav {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
}

html body.u-body .u-header .u-sidenav .u-nav-link,
html body.u-body .u-header .u-sidenav .u-menu-close {
  color: #fffdf7 !important;
}

html body.u-body .u-header .u-sidenav .u-nav-link:hover,
html body.u-body .u-header .u-sidenav .u-nav-link:focus {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

/* Footer and cookie consent use a high-contrast ink surface. */
html body.u-body .u-footer,
html body.u-body .u-footer.u-black {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
  border-top-color: var(--kk-gold) !important;
}

html body.u-body .u-footer * {
  color: #fffdf7 !important;
}

html body.u-body .u-footer a:hover,
html body.u-body .u-footer a:focus,
html body.u-body .u-footer .u-nav-link:hover,
html body.u-body .u-footer .u-nav-link:focus {
  color: var(--kk-gold) !important;
}

html body.u-body .u-footer .u-hamburger-link {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-footer .u-hamburger-link .u-svg-content,
html body.u-body .u-footer .u-hamburger-link .u-svg-link {
  color: var(--kk-ink) !important;
  fill: var(--kk-ink) !important;
  stroke: var(--kk-ink) !important;
}

html body.u-body .u-footer .u-sidenav,
html body.u-body .u-footer .u-menu-overlay {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
}

html body.u-body .u-cookies-consent,
html body.u-body .u-cookies-consent.u-palette-1-dark-3 {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
  border-top-color: var(--kk-gold) !important;
}

html body.u-body .u-cookies-consent .u-sheet,
html body.u-body .u-cookies-consent .u-layout,
html body.u-body .u-cookies-consent .u-container-layout,
html body.u-body .u-cookies-consent .u-layout-cell {
  color: #fffdf7 !important;
  background: transparent !important;
}

html body.u-body .u-cookies-consent * {
  color: #fffdf7 !important;
}

html body.u-body .u-cookies-consent .u-container-layout-1 {
  padding: 24px 40px !important;
}

html body.u-body .u-cookies-consent .u-container-layout-2 {
  padding: 24px 32px !important;
}

html body.u-body .u-cookies-consent .u-btn-1,
html body.u-body .u-cookies-consent .u-btn-1 * {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-cookies-consent .u-btn-2,
html body.u-body .u-cookies-consent .u-btn-2 * {
  color: var(--kk-ink) !important;
  background: #fffdf7 !important;
  border-color: #fffdf7 !important;
}

/* Keep the HRO content dark on light panels and white on dark panels. */
html body.u-body .hro-main .hro-section-light,
html body.u-body .hro-main .hro-section-soft,
html body.u-body .hro-main .hro-order-shell,
html body.u-body .hro-main .hro-payment-section {
  color: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-section-light p,
html body.u-body .hro-main .hro-section-soft p,
html body.u-body .hro-main .hro-order-shell p,
html body.u-body .hro-main .hro-payment-section p,
html body.u-body .hro-main .hro-lead,
html body.u-body .hro-main .hro-section-heading > p:last-child,
html body.u-body .hro-main .hro-order-details p,
html body.u-body .hro-main .hro-order-footnotes,
html body.u-body .hro-main .hro-form-note p {
  color: var(--kk-ink-soft) !important;
}

html body.u-body .hro-main .hro-section-dark,
html body.u-body .hro-main .hro-final-cta {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-section-dark h1,
html body.u-body .hro-main .hro-section-dark h2,
html body.u-body .hro-main .hro-section-dark h3,
html body.u-body .hro-main .hro-section-dark p,
html body.u-body .hro-main .hro-section-dark span,
html body.u-body .hro-main .hro-final-cta h1,
html body.u-body .hro-main .hro-final-cta h2,
html body.u-body .hro-main .hro-final-cta h3,
html body.u-body .hro-main .hro-final-cta p,
html body.u-body .hro-main .hro-final-cta span {
  color: #fffdf7 !important;
}

html body.u-body .hro-main .hro-eyebrow,
html body.u-body .hro-main .hro-card-kicker,
html body.u-body .hro-main .hro-price-line strong,
html body.u-body .hro-main .hro-option-price strong,
html body.u-body .hro-main .hro-summary-total strong,
html body.u-body .hro-main .hro-cart-total-line strong,
html body.u-body .hro-main .hro-order-divider,
html body.u-body .hro-main .hro-order-back,
html body.u-body .hro-main .hro-order-footnotes b {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-eyebrow-light {
  color: var(--kk-gold) !important;
}

html body.u-body input::placeholder,
html body.u-body textarea::placeholder,
html body.u-body select:invalid {
  color: #625a4b !important;
  opacity: 1 !important;
}

/* Components that used fixed green fills in the original page CSS. */
html body.u-body .hro-main .hro-trust-strip,
html body.u-body .hro-main .hro-featured-product,
html body.u-body .hro-main .hro-catalog-card,
html body.u-body .hro-main .hro-value-card,
html body.u-body .hro-main .hro-offer-item {
  border-color: var(--kk-line) !important;
  background: var(--kk-paper) !important;
}

html body.u-body .hro-main .hro-product-portrait,
html body.u-body .hro-main .hro-howto-card,
html body.u-body .hro-main .hro-about-image {
  border-color: var(--kk-line) !important;
  background: radial-gradient(circle at 50% 35%, #fffdf7 0%, #fff0b8 100%) !important;
  box-shadow: var(--kk-shadow) !important;
}

html body.u-body .hro-main .hro-portrait-backdrop,
html body.u-body .hro-main .hro-about-image-backdrop,
html body.u-body .hro-main .hro-featured-blob {
  border-color: rgba(138, 91, 0, 0.2) !important;
  background: rgba(242, 183, 5, 0.2) !important;
}

html body.u-body .hro-main .hro-howto-shape {
  border-color: rgba(138, 91, 0, 0.22) !important;
}

html body.u-body .hro-main .hro-art-orbit-one {
  background: rgba(242, 183, 5, 0.18) !important;
  box-shadow: inset 0 0 0 28px rgba(255, 255, 255, 0.38) !important;
}

html body.u-body .hro-main .hro-art-orbit-two {
  border-color: rgba(138, 91, 0, 0.2) !important;
}

html body.u-body .hro-main .hro-page-hero-mark {
  color: var(--kk-ink) !important;
  border-color: rgba(138, 91, 0, 0.22) !important;
  background: rgba(242, 183, 5, 0.18) !important;
}

html body.u-body .hro-main .hro-page-hero-mark small,
html body.u-body .hro-main .hro-page-hero-mark-leaf span,
html body.u-body .hro-main .hro-portrait-caption,
html body.u-body .hro-main .hro-order-media-caption,
html body.u-body .hro-main .hro-note,
html body.u-body .hro-main .hro-price-line > span,
html body.u-body .hro-main .hro-product-buy > div > span,
html body.u-body .hro-main .hro-catalog-note,
html body.u-body .hro-main .hro-trust-number,
html body.u-body .hro-main .hro-card-index,
html body.u-body .hro-main .hro-catalog-bottom strong {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-stage-label,
html body.u-body .hro-main .hro-float,
html body.u-body .hro-main .hro-howto-label {
  color: var(--kk-ink) !important;
  border-color: var(--kk-line) !important;
  background: rgba(255, 253, 247, 0.95) !important;
  box-shadow: 0 14px 28px rgba(67, 48, 9, 0.14) !important;
}

html body.u-body .hro-main .hro-stage-label,
html body.u-body .hro-main .hro-howto-label span {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-check-list li,
html body.u-body .hro-main .hro-content-column > p:not(.hro-eyebrow),
html body.u-body .hro-main .hro-catalog-card-body > p:not(.hro-card-kicker),
html body.u-body .hro-main .hro-featured-copy > p:not(.hro-card-kicker),
html body.u-body .hro-main .hro-value-card p,
html body.u-body .hro-main .hro-offer-item p,
html body.u-body .hro-main .hro-trust-item span:last-child,
html body.u-body .hro-main .hro-catalog-bottom strong {
  color: var(--kk-ink-soft) !important;
}

html body.u-body .hro-main .hro-check-list li > span,
html body.u-body .hro-main .hro-form-note > span,
html body.u-body .hro-main .hro-offer-icon {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

html body.u-body .hro-main .hro-step > span,
html body.u-body .hro-main .hro-process-step > span {
  color: var(--kk-gold-dark) !important;
  border-color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-faq-list,
html body.u-body .hro-main .hro-faq-list details,
html body.u-body .hro-main .hro-process-list,
html body.u-body .hro-main .hro-process-step {
  border-color: var(--kk-line) !important;
}

html body.u-body .hro-main .hro-faq-list summary,
html body.u-body .hro-main .hro-faq-list summary::after {
  color: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-faq-list summary::after {
  color: var(--kk-gold-dark) !important;
}

/* Dark trust/process bands retain white copy with gold accents. */
html body.u-body .hro-main .hro-section-dark .hro-trust-card {
  color: #fffdf7 !important;
  border-color: rgba(242, 183, 5, 0.28) !important;
  background: rgba(255, 253, 247, 0.07) !important;
  box-shadow: none !important;
}

html body.u-body .hro-main .hro-section-dark .hro-trust-card h3,
html body.u-body .hro-main .hro-section-dark .hro-trust-card > p:not(.hro-card-kicker),
html body.u-body .hro-main .hro-section-dark .hro-trust-card .hro-card-meta,
html body.u-body .hro-main .hro-section-dark .hro-trust-card .hro-card-meta span,
html body.u-body .hro-main .hro-process-step h3,
html body.u-body .hro-main .hro-process-step p {
  color: #fffdf7 !important;
}

html body.u-body .hro-main .hro-section-dark .hro-trust-card .hro-card-kicker,
html body.u-body .hro-main .hro-section-dark .hro-trust-card .hro-card-meta,
html body.u-body .hro-main .hro-section-dark .hro-process-step > span,
html body.u-body .hro-main .hro-section-dark .hro-trust-sigil {
  color: var(--kk-gold) !important;
}

html body.u-body .hro-main .hro-section-dark .hro-trust-card .hro-card-meta,
html body.u-body .hro-main .hro-section-dark .hro-process-list,
html body.u-body .hro-main .hro-section-dark .hro-process-step {
  border-color: rgba(242, 183, 5, 0.28) !important;
}

html body.u-body .hro-main .hro-trust-sigil {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

html body.u-body .hro-main .hro-order-band {
  color: #fffdf7 !important;
  background: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-order-band h2,
html body.u-body .hro-main .hro-order-band p,
html body.u-body .hro-main .hro-order-band span {
  color: #fffdf7 !important;
}

html body.u-body .hro-main .hro-order-band .hro-eyebrow,
html body.u-body .hro-main .hro-order-band .hro-eyebrow-light {
  color: var(--kk-gold) !important;
}

/* The payment summary is intentionally dark, so its copy must not inherit
   the light-panel paragraph rule above. */
html body.u-body .hro-main .hro-payment-summary,
html body.u-body .hro-main .hro-payment-summary h3,
html body.u-body .hro-main .hro-payment-summary p,
html body.u-body .hro-main .hro-payment-summary span,
html body.u-body .hro-main .hro-payment-summary strong,
html body.u-body .hro-main .hro-payment-summary small {
  color: #fffdf7 !important;
  background-color: transparent;
}

html body.u-body .hro-main .hro-payment-summary .hro-payment-summary-total strong,
html body.u-body .hro-main .hro-payment-summary .hro-payment-savings strong {
  color: var(--kk-gold) !important;
}

/* The note at the bottom of the dark order summary is a light card. Keep its
   own copy dark instead of inheriting the summary's white text. */
html body.u-body .hro-main .hro-payment-summary .hro-payment-summary-note,
html body.u-body .hro-main .hro-payment-summary .hro-payment-summary-note strong,
html body.u-body .hro-main .hro-payment-summary .hro-payment-summary-note p {
  color: var(--kk-ink) !important;
  background: #fff8df !important;
  border-color: var(--kk-line) !important;
}

html body.u-body .hro-main .hro-payment-summary .hro-payment-summary-note p {
  color: var(--kk-ink-soft) !important;
}

/* Nicepage's generated hover/active selectors are more specific than a
   normal component rule. These selectors deliberately match that specificity
   for both the header and footer navigation. */
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:hover,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:focus,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:active,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base.hover,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:hover,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:focus,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base:active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-hover-palette-1-base.hover {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:hover,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:focus,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:hover,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:focus,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-hover-white:active {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-active-palette-2-base.active,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-active-palette-2-base.u-active,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.active > a.u-nav-link.u-active-palette-2-base,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-active-palette-2-base.active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-active-palette-2-base.u-active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.active > a.u-nav-link.u-active-palette-2-base {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
  border-color: var(--kk-gold) !important;
}

html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white.active,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white.u-active,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white:active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white.active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white.u-active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-text-active-white:active {
  color: var(--kk-ink) !important;
}

html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:hover,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:focus,
html body.u-body .u-header .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:active,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:hover,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:focus,
html body.u-body .u-footer .u-nav-container > ul.u-nav > li.u-nav-item > a.u-nav-link.u-border-hover-palette-2-base:active {
  color: var(--kk-ink) !important;
  border-color: var(--kk-gold) !important;
}

/* The order panel now has a real reading gutter on desktop, tablet and mobile. */
html body.u-body .hro-main .hro-order-details {
  min-width: 0 !important;
  max-width: 100% !important;
  padding: clamp(30px, 3.6vw, 48px) !important;
  overflow: hidden;
  background: var(--kk-paper) !important;
}

html body.u-body .hro-main .hro-order-details > * {
  max-width: 100% !important;
}

html body.u-body .hro-main .hro-order-details h1 {
  max-width: 100% !important;
  margin-right: 0 !important;
  color: var(--kk-ink) !important;
  font-size: clamp(2.55rem, 4vw, 4.15rem) !important;
  line-height: 1.01 !important;
  overflow-wrap: break-word;
}

html body.u-body .hro-main .hro-order-subtitle,
html body.u-body .hro-main .hro-order-description,
html body.u-body .hro-main .hro-order-details .hro-option-copy small,
html body.u-body .hro-main .hro-order-details .hro-summary-head span,
html body.u-body .hro-main .hro-order-details .hro-summary-line,
html body.u-body .hro-main .hro-order-details .hro-summary-line small,
html body.u-body .hro-main .hro-order-disclaimer {
  color: var(--kk-ink-soft) !important;
}

html body.u-body .hro-main .hro-order-badges > span {
  color: var(--kk-ink-soft) !important;
  border-color: var(--kk-line) !important;
  background: #fff8df !important;
}

html body.u-body .hro-main .hro-order-badges b {
  color: var(--kk-ink) !important;
  background: var(--kk-gold) !important;
}

html body.u-body .hro-main .hro-order-media,
html body.u-body .hro-main .hro-product-stage,
html body.u-body .hro-main .hro-featured-image,
html body.u-body .hro-main .hro-about-image {
  background: radial-gradient(circle at 50% 34%, #fffdf7 0%, #fff0b8 100%) !important;
  border-color: var(--kk-line) !important;
}

html body.u-body .hro-main .hro-order-media::after,
html body.u-body .hro-main .hro-art-orbit,
html body.u-body .hro-main .hro-portrait-backdrop {
  border-color: rgba(138, 91, 0, 0.22) !important;
}

html body.u-body .hro-main .hro-order-option {
  color: var(--kk-ink) !important;
  border-color: var(--kk-line) !important;
  background: #fffdf7 !important;
}

html body.u-body .hro-main .hro-order-option:hover,
html body.u-body .hro-main .hro-order-option.is-selected {
  color: var(--kk-ink) !important;
  border-color: var(--kk-gold-dark) !important;
  background: #fff3c9 !important;
}

html body.u-body .hro-main .hro-order-option .hro-option-copy strong,
html body.u-body .hro-main .hro-order-option .hro-option-price,
html body.u-body .hro-main .hro-order-summary,
html body.u-body .hro-main .hro-order-summary .hro-summary-line > span,
html body.u-body .hro-main .hro-order-summary .hro-summary-line strong {
  color: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-order-option .hro-option-price strong,
html body.u-body .hro-main .hro-order-summary .hro-summary-total strong,
html body.u-body .hro-main .hro-order-summary .hro-summary-discount > span,
html body.u-body .hro-main .hro-order-summary .hro-summary-discount > strong {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-radio,
html body.u-body .hro-main .hro-order-option input:checked + .hro-radio {
  border-color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-order-option input:checked + .hro-radio {
  border-width: 6px !important;
}

html body.u-body .hro-main .hro-order-summary,
html body.u-body .hro-main .hro-payment-panel,
html body.u-body .hro-main .hro-payment-flow,
html body.u-body .hro-main .hro-contact-form,
html body.u-body .hro-main .hro-form {
  border-color: var(--kk-line) !important;
  background: var(--kk-paper) !important;
}

html body.u-body .hro-main .hro-cart-drawer {
  color: var(--kk-ink) !important;
  background: var(--kk-paper) !important;
  border-left-color: var(--kk-gold) !important;
}

html body.u-body .hro-main .hro-cart-drawer h2,
html body.u-body .hro-main .hro-cart-drawer h3,
html body.u-body .hro-main .hro-cart-drawer p,
html body.u-body .hro-main .hro-cart-drawer span,
html body.u-body .hro-main .hro-cart-drawer strong,
html body.u-body .hro-main .hro-cart-drawer small {
  color: var(--kk-ink) !important;
}

html body.u-body .hro-main .hro-cart-drawer .hro-eyebrow,
html body.u-body .hro-main .hro-cart-drawer .hro-cart-total-line strong,
html body.u-body .hro-main .hro-cart-drawer .hro-cart-discount-line strong {
  color: var(--kk-gold-dark) !important;
}

html body.u-body .hro-main .hro-cart-promo,
html body.u-body .hro-main .hro-cart-delivery,
html body.u-body .hro-main .hro-payment-secure {
  border-color: var(--kk-line) !important;
  background: #fff3c9 !important;
}

html body.u-body .hro-main .hro-cart-close,
html body.u-body .hro-main .hro-cart-stepper button {
  color: var(--kk-ink) !important;
  background: var(--kk-gold-light) !important;
  border-color: var(--kk-line) !important;
}

html body.u-body .hro-main .hro-cart-stepper strong {
  color: var(--kk-ink) !important;
  background: var(--kk-paper) !important;
}

@media (max-width: 991px) {
  html body.u-body .hro-main .hro-order-details {
    width: 100% !important;
    padding: 32px !important;
  }
}

@media (max-width: 600px) {
  html body.u-body .hro-main .hro-order-details {
    padding: 24px 20px !important;
    border-radius: 24px !important;
  }

  html body.u-body .u-cookies-consent .u-container-layout-1,
  html body.u-body .u-cookies-consent .u-container-layout-2 {
    padding: 18px 16px !important;
  }
}
