/* =========================================================
   PREMIUM EFFECTS — camada exclusivamente visual
   Usa somente os tokens semânticos da empresa.
   Não altera estrutura, conteúdo, fluxo ou dimensões base.
========================================================= */

html.sv-company-theme {
  --premium-glow: color-mix(in srgb, var(--ui-primary, var(--brand)) 38%, transparent);
  --premium-glow-soft: color-mix(in srgb, var(--ui-primary, var(--brand)) 16%, transparent);
  --premium-accent-glow: color-mix(in srgb, var(--ui-accent, var(--accent)) 24%, transparent);
  --premium-highlight: color-mix(in srgb, #fff 44%, transparent);
  --premium-shadow: color-mix(in srgb, #000 30%, transparent);
  --premium-ease: cubic-bezier(.2,.75,.25,1);
}

/* ---------- Botões: profundidade + reflexo ---------- */
html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action, .krj-plan-tab, .krj-section-tab) {
  position: relative;
  isolation: isolate;
  transition:
    transform .22s var(--premium-ease),
    box-shadow .28s ease,
    border-color .28s ease,
    filter .28s ease;
}

html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action) {
  overflow: hidden;
}

html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action)::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -55%;
  left: -42%;
  width: 28%;
  height: 210%;
  pointer-events: none;
  opacity: 0;
  transform: translateX(-180%) rotate(18deg);
  background: linear-gradient(90deg, transparent, var(--premium-highlight), transparent);
  transition: transform .62s var(--premium-ease), opacity .2s ease;
}

html.sv-company-theme :where(.k-btn--primary, .k-actions .k-btn, .krj-hero__cta, .krj-home-card__action) {
  box-shadow:
    0 10px 24px var(--premium-glow-soft),
    0 5px 14px var(--premium-shadow),
    inset 0 1px 0 color-mix(in srgb, #fff 24%, transparent) !important;
}

@media (hover:hover) and (pointer:fine) {
  html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action):hover {
    transform: translateY(-2px);
  }

  html.sv-company-theme :where(.k-btn--primary, .k-actions .k-btn, .krj-hero__cta, .krj-home-card__action):hover {
    box-shadow:
      0 15px 32px var(--premium-glow),
      0 7px 18px var(--premium-shadow),
      inset 0 1px 0 color-mix(in srgb, #fff 34%, transparent) !important;
  }

  html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action):hover::before {
    opacity: .72;
    transform: translateX(620%) rotate(18deg);
  }

  html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action):hover i {
    transform: translateX(2px);
  }
}

html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action):active {
  transform: translateY(0) scale(.985);
}

html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action) i {
  transition: transform .22s var(--premium-ease);
}

html.sv-company-theme :where(.k-btn, .btn, .krj-hero__cta, .krj-home-card__action):focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--ui-bg, var(--bg)) 82%, transparent),
    0 0 0 6px color-mix(in srgb, var(--ui-accent, var(--accent)) 62%, transparent),
    0 12px 28px var(--premium-glow-soft) !important;
}

/* ---------- Títulos: acabamento premium sem mudar layout ---------- */
html.sv-company-theme :where(.hero__title, .k-section__title, .section-title, .krj-sales__title, .krj-section-head__title) {
  text-wrap: balance;
  text-shadow: 0 8px 26px color-mix(in srgb, var(--ui-primary, var(--brand)) 10%, transparent);
}

html.sv-company-theme .hero__title .em {
  color: transparent !important;
  background: linear-gradient(
    115deg,
    color-mix(in srgb, var(--ui-accent, var(--accent)) 88%, #fff 12%),
    color-mix(in srgb, var(--ui-primary, var(--brand)) 86%, #fff 14%),
    color-mix(in srgb, var(--ui-accent, var(--accent)) 78%, #fff 22%)
  );
  background-size: 180% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 8px 20px var(--premium-accent-glow));
  animation: premium-title-shift 7s ease-in-out infinite alternate;
}

html.sv-company-theme :where(.k-section__title, .section-title, .krj-sales__title, .krj-section-head__title) {
  position: relative;
}

html.sv-company-theme :where(.k-section__title, .section-title, .krj-sales__title, .krj-section-head__title)::after {
  content: "";
  display: block;
  width: clamp(34px, 7vw, 68px);
  height: 2px;
  margin-top: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    var(--ui-primary, var(--brand)),
    var(--ui-accent, var(--accent)),
    transparent
  );
  box-shadow: 0 0 14px var(--premium-glow-soft);
  opacity: .88;
}

/* ---------- Cards: elevação e borda na identidade da empresa ---------- */
html.sv-company-theme :where(.k-card, .aluguel-card, .krj-sales-card, .krj-product) {
  transition:
    transform .3s var(--premium-ease),
    box-shadow .32s ease,
    border-color .32s ease,
    background-color .32s ease;
  box-shadow:
    0 10px 28px color-mix(in srgb, #000 13%, transparent),
    inset 0 1px 0 color-mix(in srgb, #fff 5%, transparent);
}

@media (hover:hover) and (pointer:fine) {
  html.sv-company-theme :where(.k-card, .aluguel-card, .krj-sales-card, .krj-product):hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--ui-primary, var(--brand)) 42%, var(--ui-border, var(--line)) 58%) !important;
    box-shadow:
      0 18px 42px color-mix(in srgb, #000 20%, transparent),
      0 0 24px var(--premium-glow-soft),
      inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent);
  }
}

html.sv-company-theme .k-card__icon {
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 14%, transparent),
    0 8px 18px var(--premium-glow-soft);
  transition: transform .28s var(--premium-ease), box-shadow .28s ease;
}

@media (hover:hover) and (pointer:fine) {
  html.sv-company-theme .k-card:hover .k-card__icon {
    transform: translateY(-2px) scale(1.035);
    box-shadow:
      inset 0 1px 0 color-mix(in srgb, #fff 20%, transparent),
      0 10px 24px var(--premium-glow);
  }
}

/* ---------- Abas: mesma linguagem premium, cor dinâmica ---------- */
html.sv-company-theme :where(.krj-plan-tab.is-active, .krj-section-tab.is-active) {
  border-color: color-mix(in srgb, var(--ui-primary, var(--brand)) 62%, transparent) !important;
  background: linear-gradient(135deg,
    var(--ui-primary, var(--brand)),
    var(--ui-primary-2, var(--brand-2))
  ) !important;
  color: var(--ui-on-primary, #fff) !important;
  box-shadow:
    0 10px 24px var(--premium-glow-soft),
    inset 0 1px 0 color-mix(in srgb, #fff 20%, transparent) !important;
}

html.sv-company-theme :where(.krj-plan-tab, .krj-section-tab):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ui-accent, var(--accent)) 72%, transparent);
  outline-offset: 2px;
}

/* ---------- Header: vidro + linha de luz muito discreta ---------- */
html.sv-company-theme .k-header {
  box-shadow: 0 10px 28px color-mix(in srgb, #000 10%, transparent);
}

html.sv-company-theme .k-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg,
    transparent 2%,
    color-mix(in srgb, var(--ui-primary, var(--brand)) 18%, transparent) 28%,
    color-mix(in srgb, var(--ui-accent, var(--accent)) 30%, transparent) 50%,
    color-mix(in srgb, var(--ui-primary, var(--brand)) 18%, transparent) 72%,
    transparent 98%
  );
}

/* Links de navegação: underline de luz, sem alterar a caixa do link */
html.sv-company-theme .k-nav a {
  position: relative;
}

html.sv-company-theme .k-nav a::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 4px;
  height: 1px;
  border-radius: 999px;
  transform: scaleX(0);
  transform-origin: center;
  background: var(--ui-accent, var(--accent));
  box-shadow: 0 0 10px var(--premium-accent-glow);
  transition: transform .24s var(--premium-ease);
}

@media (hover:hover) and (pointer:fine) {
  html.sv-company-theme .k-nav a:hover::after {
    transform: scaleX(1);
  }
}

/* ---------- Hero: apenas acabamento, sem mudar fundo/conteúdo ---------- */
html.sv-company-theme .hero__kicker {
  box-shadow:
    0 10px 28px color-mix(in srgb, #000 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent),
    0 0 24px var(--premium-glow-soft);
}

@keyframes premium-title-shift {
  from { background-position: 0% 50%; }
  to { background-position: 100% 50%; }
}

/* Mobile: mantém acabamento, reduz custo visual e movimento. */
@media (max-width: 760px) {
  html.sv-company-theme :where(.k-card, .aluguel-card, .krj-sales-card, .krj-product) {
    box-shadow:
      0 8px 20px color-mix(in srgb, #000 12%, transparent),
      inset 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
  }

  html.sv-company-theme :where(.k-btn--primary, .k-actions .k-btn, .krj-hero__cta, .krj-home-card__action) {
    box-shadow:
      0 8px 18px var(--premium-glow-soft),
      inset 0 1px 0 color-mix(in srgb, #fff 18%, transparent) !important;
  }
}

/* Acessibilidade: sem animações para quem solicitou menos movimento. */
@media (prefers-reduced-motion: reduce) {
  html.sv-company-theme *,
  html.sv-company-theme *::before,
  html.sv-company-theme *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}