@font-face {
  font-family: "Noto Kufi Arabic";
  src: url("../fonts/noto-kufi-arabic/NotoKufiArabic-400-arabic.woff2")
    format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Noto Kufi Arabic";
  src: url("../fonts/noto-kufi-arabic/NotoKufiArabic-600-arabic.woff2")
    format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Noto Kufi Arabic";
  src: url("../fonts/noto-kufi-arabic/NotoKufiArabic-700-arabic.woff2")
    format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --sky: #2baae2;
  --blue: #1691d0;
  --navy: #15508a;
  --indigo: #283a83;
  --teal: #057590;
  --aqua: #3ac0c3;
  --green: #48ad48;
  --lime: #9ecc3b;
  --kafu-gold: #c9a437;
  --kafu-gold-dk: #9c7b1e;
  --kafu-gold-lt: #e8c863;
  --soft-gold-1: #fff9e8;
  --soft-gold-2: #f7efcb;
  --soft-gold-3: #efd98e;
  --soft-gold-4: #e8c863;
  --soft-gold-5: #c9a437;
  --soft-gold-6: #9c7b1e;
  --hero-text-dark: #2c2516;
  --hero-text-mid: #5a4b28;
  --text: #162033;
  --text-2: #4b5563;
  --text-3: #7a8392;
  --white: #ffffff;
  --page-bg: #fffcf3;
  --section-bg: #fff8e6;
  --card-bg: #ffffff;
  --border: rgba(201, 164, 55, 0.16);
  --font-base: "Noto Kufi Arabic", Tahoma, Arial, sans-serif;
  --container: 1200px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --shadow-sm: 0 4px 12px rgba(156, 123, 30, 0.06);
  --shadow-md: 0 12px 30px rgba(156, 123, 30, 0.1);
  --shadow-lg: 0 24px 60px rgba(156, 123, 30, 0.16);
  --transition: 0.25s ease;
  --section-gap: 84px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-base);
  background: var(--page-bg);
  color: var(--text);
  direction: rtl;
  text-align: right;
  line-height: 1.8;
  overflow-x: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

img,
svg {
  display: block;
  max-width: 100%;
}

button,
input {
  font-family: inherit;
}

button {
  border: 0;
}

:focus-visible {
  outline: 2px solid var(--soft-gold-5);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}

.container,
.kafu-container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 40px);
}

.section {
  padding-block: var(--section-gap);
}

.section-header {
  margin-bottom: 22px;
}

.section-header--center {
  text-align: center;
}

.section-header--center .section-body {
  margin-inline: auto;
}

.section-header--row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  font-size: 12px;
  font-weight: 600;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.18);
  padding: 5px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--soft-gold-5);
  border-radius: 50%;
}

.section-title {
  margin: 0 0 14px;
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.45;
  font-weight: 700;
  color: var(--hero-text-dark);
}

.section-body {
  margin: 0;
  max-width: 660px;
  color: var(--hero-text-mid);
  font-size: 15px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition:
    background var(--transition),
    color var(--transition),
    border-color var(--transition),
    transform var(--transition),
    box-shadow var(--transition);
  white-space: nowrap;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn:active {
  transform: scale(0.98);
}

.btn--primary {
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  color: #2b2416;
  box-shadow:
    0 14px 28px rgba(201, 164, 55, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
}

.btn--primary:hover {
  background: linear-gradient(135deg, #f0d676, var(--soft-gold-5));
}

.btn--ghost {
  background: rgba(255, 255, 255, 0.4);
  color: var(--hero-text-dark);
  border-color: rgba(201, 164, 55, 0.22);
  backdrop-filter: blur(10px);
}

.btn--ghost:hover {
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(201, 164, 55, 0.34);
}

.btn--lg {
  min-height: 50px;
  padding-inline: 30px;
  font-size: 14px;
}

body.kafu-portal {
  background: var(--page-bg);
}

.kafu-shell {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 6%, rgba(232, 200, 99, 0.1), transparent 28%),
    linear-gradient(180deg, #fffcf3 0%, #fff9ea 45%, #ffffff 100%);
}

.kafu-topbar {
  position: relative;
  z-index: 1000;
  min-height: 38px;
  background: linear-gradient(135deg, #2c2516 0%, #4a3815 100%);
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  border-bottom: 1px solid rgba(232, 200, 99, 0.18);
}

.kafu-topbar__inner {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.kafu-topbar__info,
.kafu-topbar__links {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.kafu-topbar__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--soft-gold-4);
  box-shadow: 0 0 0 6px rgba(232, 200, 99, 0.12);
}

.kafu-topbar__links a {
  color: rgba(255, 255, 255, 0.76);
  transition: color var(--transition);
}

.kafu-topbar__links a:hover {
  color: var(--soft-gold-4);
}

.kafu-header {
  position: sticky;
  top: 0;
  z-index: 950;
  background: rgba(255, 252, 243, 0.88);
  border-bottom: 1px solid rgba(201, 164, 55, 0.14);
  backdrop-filter: blur(18px);
  transition:
    background var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.kafu-header.is-scrolled,
.kafu-header.header--scrolled {
  background: rgba(255, 252, 243, 0.97);
  box-shadow: 0 18px 42px rgba(156, 123, 30, 0.1);
  border-color: rgba(201, 164, 55, 0.2);
}

.kafu-header__inner {
  height: 78px;
  display: flex;
  align-items: center;
  gap: 30px;
}

.kafu-brand {
  display: flex;
  align-items: center;
  gap: 13px;
  flex-shrink: 0;
}

.kafu-brand__logo {
  width: 66px;
  height: 66px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kafu-brand__logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.kafu-brand__text {
  display: flex;
  flex-direction: column;
  line-height: 1.55;
}

.kafu-brand__text strong {
  color: var(--hero-text-dark);
  font-size: 17px;
  font-weight: 700;
}

.kafu-brand__text span {
  color: var(--hero-text-mid);
  font-size: 11px;
}

.kafu-nav {
  flex: 1;
}

.kafu-nav__list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.kafu-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 42px;
  padding-inline: 16px;
  border-radius: 999px;
  color: var(--hero-text-mid);
  font-size: 14px;
  font-weight: 600;
  transition:
    background var(--transition),
    color var(--transition);
}

.kafu-nav__link:hover,
.kafu-nav__item.is-active .kafu-nav__link {
  color: var(--hero-text-dark);
  background: rgba(201, 164, 55, 0.1);
}

.kafu-nav__item.is-active .kafu-nav__link::after {
  content: "";
  position: absolute;
  right: 18px;
  left: 18px;
  bottom: 5px;
  height: 2px;
  border-radius: 999px;
  background: var(--soft-gold-5);
}

.kafu-header__actions {
  margin-inline-start: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.kafu-header__assistant {
  min-height: 43px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-inline: 18px;
  border-radius: 999px;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border: 1px solid rgba(156, 123, 30, 0.12);
  box-shadow:
    0 14px 28px rgba(201, 164, 55, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
  font-size: 12px;
  font-weight: 700;
  transition:
    transform var(--transition),
    box-shadow var(--transition);
}

.kafu-header__assistant:hover {
  transform: translateY(-1px);
  box-shadow:
    0 18px 36px rgba(201, 164, 55, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.38);
}

.kafu-header__assistant span {
  font-size: 15px;
}

.kafu-theme-toggle {
  width: 43px;
  height: 43px;
  border-radius: 15px;
  border: 1px solid rgba(201, 164, 55, 0.18);
  background: rgba(255, 255, 255, 0.68);
  color: var(--hero-text-dark);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow:
    0 12px 24px rgba(156, 123, 30, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transition:
    transform var(--transition),
    background var(--transition),
    border-color var(--transition),
    color var(--transition),
    box-shadow var(--transition);
}

.kafu-theme-toggle:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(201, 164, 55, 0.3);
  box-shadow:
    0 16px 30px rgba(156, 123, 30, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.kafu-theme-toggle__icon {
  font-size: 18px;
  line-height: 1;
}

.kafu-menu-toggle {
  width: 43px;
  height: 43px;
  border-radius: 15px;
  border: 1px solid rgba(201, 164, 55, 0.18);
  background: rgba(255, 255, 255, 0.66);
  color: var(--hero-text-dark);
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}

.kafu-menu-toggle span {
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transition: var(--transition);
}

.kafu-menu-toggle.is-active span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.kafu-menu-toggle.is-active span:nth-child(2) {
  opacity: 0;
}

.kafu-menu-toggle.is-active span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.kafu-mobile-nav {
  position: sticky;
  top: 78px;
  z-index: 900;
  background: rgba(255, 252, 243, 0.98);
  border-bottom: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: 0 18px 44px rgba(156, 123, 30, 0.12);
  backdrop-filter: blur(16px);
}

.kafu-mobile-nav__inner {
  padding-block: 14px;
  display: grid;
  gap: 6px;
}

.kafu-mobile-nav__link {
  display: flex;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  color: var(--hero-text-mid);
  font-size: 14px;
  font-weight: 600;
  transition:
    background var(--transition),
    color var(--transition);
}

.kafu-mobile-nav__link:hover {
  color: var(--hero-text-dark);
  background: rgba(201, 164, 55, 0.1);
}

.hero--dynamic {
  position: relative;
  min-height: 720px;
  overflow: hidden;
  color: var(--hero-text-dark);
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(255, 255, 255, 0.55),
      transparent 24%
    ),
    radial-gradient(
      circle at 82% 18%,
      rgba(232, 200, 99, 0.28),
      transparent 26%
    ),
    radial-gradient(
      circle at 68% 78%,
      rgba(201, 164, 55, 0.14),
      transparent 28%
    ),
    linear-gradient(135deg, #fffbef 0%, #f9f1d5 42%, #f3e5b0 78%, #ebcf78 100%);
}

.hero__scene {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(156, 123, 30, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(156, 123, 30, 0.05) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.85), transparent 86%);
}

.hero__beam {
  position: absolute;
  width: 620px;
  height: 130px;
  border-radius: 999px;
  filter: blur(42px);
  opacity: 0.28;
  transform: rotate(-18deg);
  animation: heroBeamMove 9s ease-in-out infinite alternate;
}

.hero__beam--one {
  top: 96px;
  right: -150px;
  background: rgba(255, 255, 255, 0.45);
}

.hero__beam--two {
  bottom: 130px;
  left: -170px;
  background: rgba(201, 164, 55, 0.22);
  animation-delay: 1.5s;
}

.hero__orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(6px);
  opacity: 0.34;
  animation: heroFloat 7s ease-in-out infinite;
}

.hero__orb--sky {
  width: 250px;
  height: 250px;
  background: rgba(255, 255, 255, 0.22);
  top: 24%;
  left: 8%;
}

.hero__orb--gold {
  width: 210px;
  height: 210px;
  background: rgba(201, 164, 55, 0.18);
  right: 46%;
  bottom: 18%;
  animation-delay: 1.2s;
}

.hero__watermark {
  position: absolute;
  left: 5%;
  top: 7%;
  font-size: clamp(110px, 18vw, 260px);
  font-weight: 700;
  line-height: 1;
  color: rgba(156, 123, 30, 0.07);
  user-select: none;
  white-space: nowrap;
}

.hero--dynamic .hero__inner {
  position: relative;
  z-index: 2;
  min-height: 620px;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items: center;
  gap: 64px;
  padding-block: 90px 90px;
}

.hero--dynamic .hero__content {
  max-width: 700px;
}

.hero--dynamic .hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  font-size: 13px;
  font-weight: 600;
  color: var(--soft-gold-6);
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid rgba(201, 164, 55, 0.2);
  padding: 7px 16px;
  border-radius: 999px;
  margin-bottom: 22px;
  backdrop-filter: blur(8px);
}

.hero--dynamic .hero__eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  background: var(--soft-gold-5);
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(201, 164, 55, 0.12);
}

.hero--dynamic .hero__title {
  margin: 0 0 20px;
  font-size: clamp(38px, 5.4vw, 70px);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -1px;
  color: var(--hero-text-dark);
}

.hero--dynamic .hero__title span {
  display: block;
  color: var(--soft-gold-6);
}

.hero--dynamic .hero__sub {
  margin: 0 0 34px;
  max-width: 610px;
  color: var(--hero-text-mid);
  font-size: clamp(15px, 1.7vw, 18px);
  line-height: 2;
}

.hero--dynamic .hero__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.hero__meta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 34px;
}

.hero__meta div {
  min-width: 120px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.42);
  border: 1px solid rgba(201, 164, 55, 0.16);
  backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.hero__meta strong {
  display: block;
  color: var(--soft-gold-6);
  font-size: 22px;
  line-height: 1.2;
  margin-bottom: 4px;
}

.hero__meta span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
}

.hero--dynamic .hero__visual {
  position: relative;
  min-height: 500px;
  overflow: visible;
}

.hero-assistant-card {
  position: absolute;
  top: 50%;
  right: 50%;
  width: min(440px, 92%);
  transform: translate(50%, -50%);
  border-radius: 34px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.76),
    rgba(255, 255, 255, 0.58)
  );
  border: 1px solid rgba(201, 164, 55, 0.2);
  box-shadow:
    0 28px 80px rgba(123, 93, 20, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.42);
  backdrop-filter: blur(18px);
  overflow: hidden;
}

.hero-assistant-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at 18% 0%,
      rgba(255, 255, 255, 0.34),
      transparent 30%
    ),
    radial-gradient(
      circle at 100% 18%,
      rgba(201, 164, 55, 0.12),
      transparent 34%
    );
  pointer-events: none;
}

.hero-assistant-card > * {
  position: relative;
  z-index: 1;
}

.hero-assistant-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(201, 164, 55, 0.12);
  background: rgba(255, 255, 255, 0.34);
}

.hero-assistant-card__bot {
  display: flex;
  align-items: center;
  gap: 12px;
}

.hero-assistant-card__avatar {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.98),
    rgba(255, 255, 255, 0.88)
  );
  border: 1px solid rgba(201, 164, 55, 0.18);
  padding: 8px;
  box-shadow: 0 12px 24px rgba(156, 123, 30, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-assistant-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.hero-assistant-card__bot span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
  margin-bottom: 2px;
}

.hero-assistant-card__bot strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 14px;
}

.hero-assistant-card__status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.hero-assistant-card__status i {
  width: 7px;
  height: 7px;
  background: var(--soft-gold-5);
  border-radius: 50%;
  box-shadow: 0 0 0 5px rgba(201, 164, 55, 0.1);
}

.hero-assistant-card__body {
  padding: 22px;
  display: grid;
  gap: 14px;
}

.assistant-msg {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.assistant-msg--user {
  justify-content: flex-start;
}

.assistant-msg--bot {
  justify-content: flex-end;
}

.assistant-msg__avatar {
  width: 34px;
  height: 34px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(201, 164, 55, 0.14);
  padding: 6px;
  flex-shrink: 0;
}

.assistant-msg__avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.assistant-msg__bubble {
  max-width: 78%;
  padding: 13px 15px;
  border-radius: 18px;
  font-size: 12px;
  line-height: 1.8;
  box-shadow: 0 10px 22px rgba(156, 123, 30, 0.08);
}

.assistant-msg__bubble span {
  display: block;
  font-weight: 700;
  margin-bottom: 2px;
}

.assistant-msg--bot .assistant-msg__bubble {
  color: var(--hero-text-dark);
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(201, 164, 55, 0.12);
  border-bottom-right-radius: 6px;
}

.assistant-msg--user .assistant-msg__bubble {
  color: #2b2416;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.7),
    rgba(201, 164, 55, 0.42)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  border-bottom-left-radius: 6px;
}

.assistant-suggestions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding-inline: 44px 0;
}

.assistant-suggestions a {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(255, 255, 255, 0.52);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 11px;
  font-weight: 600;
  transition:
    background var(--transition),
    transform var(--transition),
    border-color var(--transition);
}

.assistant-suggestions a:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(201, 164, 55, 0.24);
}

.hero-assistant-card__footer {
  padding: 0 22px 22px;
}

.hero-assistant-input {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 6px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.hero-assistant-input span {
  flex: 1;
  color: rgba(90, 75, 40, 0.72);
  font-size: 12px;
}

.hero-assistant-input a {
  height: 36px;
  padding-inline: 16px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 10px 20px rgba(201, 164, 55, 0.18);
  transition:
    transform var(--transition),
    box-shadow var(--transition);
}

.hero-assistant-input a:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(201, 164, 55, 0.24);
}

.hero-float-card {
  position: absolute;
  z-index: 3;
  min-width: 170px;
  padding: 17px 18px;
  border-radius: 22px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.95),
    rgba(255, 255, 255, 0.86)
  );
  color: var(--hero-text-dark);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: 0 18px 44px rgba(123, 93, 20, 0.12);
  animation: heroFloat 6.5s ease-in-out infinite;
}

.hero-float-card span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
  margin-bottom: 5px;
}

.hero-float-card strong {
  display: block;
  color: var(--soft-gold-6);
  font-size: 15px;
}

.hero-float-card--one {
  top: 62px;
  left: 16px;
}

.hero-float-card--two {
  right: -22px;
  bottom: 80px;
  animation-delay: 1.4s;
}

@keyframes heroFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}

@keyframes heroBeamMove {
  0% {
    transform: translateX(0) rotate(-18deg);
  }
  100% {
    transform: translateX(-60px) rotate(-12deg);
  }
}

.latest-news-section {
  position: relative;
  background: #fffcf3;
  padding-block: 62px;
}

.latest-news-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

.latest-news-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding-inline: 18px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 12px;
  font-weight: 700;
  box-shadow: var(--shadow-sm);
  transition:
    transform var(--transition),
    background var(--transition),
    border-color var(--transition);
}

.latest-news-more:hover {
  transform: translateY(-2px);
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(201, 164, 55, 0.28);
}

.latest-news-more span {
  transition: transform var(--transition);
}

.latest-news-more:hover span {
  transform: translateX(-4px);
}

.latest-news-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 22px;
}

.latest-news-card {
  position: relative;
  min-height: 250px;
  display: flex;
  gap: 18px;
  padding: 24px;
  border-radius: 28px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.88),
    rgba(255, 255, 255, 0.7)
  );
  border: 1px solid rgba(201, 164, 55, 0.15);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.latest-news-card::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  left: -90px;
  top: -90px;
  background: rgba(232, 200, 99, 0.16);
  transition:
    transform var(--transition),
    opacity var(--transition);
}

.latest-news-card::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.latest-news-card:hover {
  transform: translateY(-5px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.latest-news-card:hover::before {
  transform: scale(1.15);
  opacity: 0.95;
}

.latest-news-card:hover::after {
  transform: scaleX(1);
}

.latest-news-card > * {
  position: relative;
  z-index: 1;
}

.latest-news-card--main {
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(255, 255, 255, 0.46),
      transparent 26%
    ),
    linear-gradient(
      135deg,
      rgba(255, 250, 235, 0.96),
      rgba(239, 217, 142, 0.62)
    );
}

.latest-news-card__date {
  width: 64px;
  height: 76px;
  border-radius: 20px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.96),
    rgba(255, 255, 255, 0.76)
  );
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: 0 14px 28px rgba(156, 123, 30, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.latest-news-card__date strong {
  color: var(--soft-gold-6);
  font-size: 24px;
  line-height: 1.1;
}

.latest-news-card__date span {
  color: var(--hero-text-mid);
  font-size: 10px;
  font-weight: 600;
}

.latest-news-card__content {
  flex: 1;
}

.latest-news-card__tag {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding-inline: 11px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.15);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 12px;
}

.latest-news-card__content h3 {
  margin: 0 0 10px;
  color: var(--hero-text-dark);
  font-size: 17px;
  line-height: 1.65;
}

.latest-news-card--main .latest-news-card__content h3 {
  font-size: 20px;
}

.latest-news-card__content p {
  margin: 0 0 18px;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.latest-news-card__content a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.latest-news-card__content a span {
  transition: transform var(--transition);
}

.latest-news-card__content a:hover span {
  transform: translateX(-4px);
}

.services-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fff8e6;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.service-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 260px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(201, 164, 55, 0.14);
  border-radius: 26px;
  padding: 26px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.service-card::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.service-card:hover {
  transform: translateY(-5px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.service-card:hover::before {
  transform: scaleX(1);
}

.service-card--soon {
  opacity: 0.72;
}

.service-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}

.service-card__icon {
  width: 58px;
  height: 58px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.18),
    rgba(201, 164, 55, 0.1)
  );
  color: var(--soft-gold-6);
  font-size: 25px;
}

.chip {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding-inline: 11px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.chip--active {
  color: #176b35;
  background: rgba(72, 173, 72, 0.12);
  border: 1px solid rgba(72, 173, 72, 0.2);
}

.chip--soon {
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.13);
  border: 1px solid rgba(201, 164, 55, 0.24);
}

.service-card__body {
  flex: 1;
}

.service-card__body h3 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  color: var(--hero-text-dark);
}

.service-card__body p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.service-card__footer {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid rgba(201, 164, 55, 0.12);
}

.service-card__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.service-card__link span {
  transition: transform var(--transition);
}

.service-card__link:hover span {
  transform: translateX(-4px);
}

.service-card__disabled {
  color: var(--text-3);
  font-size: 13px;
}

.kafu-pulse-section {
  position: relative;
  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(232, 200, 99, 0.12),
      transparent 28%
    ),
    radial-gradient(
      circle at 88% 18%,
      rgba(255, 255, 255, 0.6),
      transparent 24%
    ),
    #fffcf3;
  overflow: hidden;
}

.kafu-pulse-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(156, 123, 30, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(156, 123, 30, 0.03) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.55), transparent 80%);
  pointer-events: none;
}

.kafu-pulse-section .container {
  position: relative;
  z-index: 1;
}

.kafu-pulse-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.kafu-pulse-card {
  position: relative;
  min-height: 340px;
  display: flex;
  flex-direction: column;
  padding: 26px;
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.88),
    rgba(255, 255, 255, 0.7)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.kafu-pulse-card::before {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  top: -90px;
  left: -80px;
  background: rgba(232, 200, 99, 0.18);
  transition:
    transform var(--transition),
    opacity var(--transition);
}

.kafu-pulse-card::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.kafu-pulse-card:hover {
  transform: translateY(-6px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.kafu-pulse-card:hover::before {
  transform: scale(1.12);
  opacity: 0.9;
}

.kafu-pulse-card:hover::after {
  transform: scaleX(1);
}

.kafu-pulse-card > * {
  position: relative;
  z-index: 1;
}

.kafu-pulse-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 26px;
}

.kafu-pulse-card__icon {
  width: 58px;
  height: 58px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(201, 164, 55, 0.1)
  );
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 25px;
  box-shadow: 0 14px 28px rgba(156, 123, 30, 0.08);
}

.kafu-pulse-card__tag {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 11px;
  font-weight: 700;
}

.kafu-pulse-card__body {
  margin-bottom: 20px;
}

.kafu-pulse-card__body h3 {
  margin: 0 0 10px;
  color: var(--hero-text-dark);
  font-size: 20px;
  line-height: 1.5;
}

.kafu-pulse-card__body p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.kafu-pulse-card__sample {
  margin-top: auto;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255, 250, 235, 0.78);
  border: 1px solid rgba(201, 164, 55, 0.13);
}

.kafu-pulse-card__sample span {
  display: block;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 7px;
}

.kafu-pulse-card__sample strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 13px;
  line-height: 1.8;
  font-weight: 600;
}

.kafu-pulse-card__link {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(201, 164, 55, 0.12);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.kafu-pulse-card__link span {
  transition: transform var(--transition);
}

.kafu-pulse-card__link:hover span {
  transform: translateX(-4px);
}

.kafu-pulse-card--thanks .kafu-pulse-card__icon {
  background: linear-gradient(
    135deg,
    rgba(255, 236, 176, 0.7),
    rgba(201, 164, 55, 0.12)
  );
}

.kafu-pulse-card--story .kafu-pulse-card__icon {
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.28),
    rgba(255, 255, 255, 0.42)
  );
}

.kafu-pulse-card--news .kafu-pulse-card__icon {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.7),
    rgba(201, 164, 55, 0.14)
  );
}

.cta-section {
  padding-block: 20px 90px;
  background: #fffcf3;
}

.cta-card {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: clamp(28px, 5vw, 48px);
  border-radius: 34px;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 15% 20%,
      rgba(255, 255, 255, 0.22),
      transparent 28%
    ),
    linear-gradient(135deg, #2c2516, #4a3815);
  color: var(--white);
  box-shadow: var(--shadow-lg);
}

.cta-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
  background-size: 44px 44px;
  opacity: 0.7;
}

.cta-card > * {
  position: relative;
  z-index: 1;
}

.cta-card .eyebrow {
  color: var(--soft-gold-4);
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.18);
}

.cta-card h2 {
  margin: 0 0 10px;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.5;
}

.cta-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 14px;
}

.kafu-footer {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(232, 200, 99, 0.12),
      transparent 30%
    ),
    linear-gradient(135deg, #2c2516 0%, #3b2e13 48%, #1f1a11 100%);
  color: rgba(255, 255, 255, 0.76);
}

.kafu-footer__bg {
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(232, 200, 99, 0.1);
  left: -160px;
  top: -160px;
  filter: blur(4px);
  pointer-events: none;
}

.kafu-footer__inner {
  position: relative;
  z-index: 1;
}

.kafu-footer__main {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 64px;
  padding-block: 64px 42px;
  border-bottom: 1px solid rgba(232, 200, 99, 0.12);
}

.kafu-footer__brand {
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.kafu-footer__logo {
  width: 110px;
  height: 110px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.kafu-footer__logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.kafu-footer__brand strong {
  display: block;
  color: var(--soft-gold-4);
  font-size: 18px;
  margin-bottom: 10px;
}

.kafu-footer__brand p {
  margin: 0;
  color: rgba(255, 255, 255, 0.64);
  font-size: 13px;
  line-height: 1.9;
}

.kafu-footer__cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px;
}

.kafu-footer__col h3 {
  margin: 0 0 16px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
}

.kafu-footer__col a {
  display: block;
  color: rgba(255, 255, 255, 0.58);
  font-size: 13px;
  margin-bottom: 10px;
  transition:
    color var(--transition),
    transform var(--transition);
}

.kafu-footer__col a:hover {
  color: var(--soft-gold-4);
  transform: translateX(-4px);
}

.kafu-footer__bottom {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.kafu-footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.48);
  font-size: 12px;
}

.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity 0.75s ease,
    transform 0.75s ease;
  will-change: opacity, transform;
}

.reveal--up {
  transform: translateY(34px);
}

.reveal--right {
  transform: translateX(34px);
}

.reveal--left {
  transform: translateX(-34px);
}

.reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

.hero__content.reveal.is-visible .hero__eyebrow {
  animation: kafuFadeUp 0.65s ease both;
}

.hero__content.reveal.is-visible .hero__title {
  animation: kafuFadeUp 0.75s ease 0.08s both;
}

.hero__content.reveal.is-visible .hero__sub {
  animation: kafuFadeUp 0.75s ease 0.16s both;
}

.hero__content.reveal.is-visible .hero__actions {
  animation: kafuFadeUp 0.75s ease 0.24s both;
}

.hero__content.reveal.is-visible .hero__meta {
  animation: kafuFadeUp 0.75s ease 0.32s both;
}

.services-section.is-visible .service-card,
.features-section.is-visible .feature-card,
.latest-news-section.is-visible .latest-news-card {
  animation: kafuFadeUp 0.65s ease both;
}

.latest-news-section.is-visible .latest-news-card:nth-child(1) {
  animation-delay: 0.05s;
}

.latest-news-section.is-visible .latest-news-card:nth-child(2) {
  animation-delay: 0.12s;
}

.latest-news-section.is-visible .latest-news-card:nth-child(3) {
  animation-delay: 0.19s;
}

.services-section.is-visible .service-card:nth-child(1),
.features-section.is-visible .feature-card:nth-child(1),
.stats-section.is-visible .stat-card:nth-child(1) {
  animation-delay: 0.05s;
}

.services-section.is-visible .service-card:nth-child(2),
.features-section.is-visible .feature-card:nth-child(2),
.stats-section.is-visible .stat-card:nth-child(2) {
  animation-delay: 0.12s;
}

.services-section.is-visible .service-card:nth-child(3),
.features-section.is-visible .feature-card:nth-child(3),
.stats-section.is-visible .stat-card:nth-child(3) {
  animation-delay: 0.19s;
}

.services-section.is-visible .service-card:nth-child(4),
.stats-section.is-visible .stat-card:nth-child(4) {
  animation-delay: 0.26s;
}

.services-section.is-visible .service-card:nth-child(5) {
  animation-delay: 0.33s;
}

.services-section.is-visible .service-card:nth-child(6) {
  animation-delay: 0.4s;
}

@keyframes kafuFadeUp {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body[data-theme="blue"] {
  --soft-gold-1: #eaf6fc;
  --soft-gold-2: #ddf2fb;
  --soft-gold-3: #bfe7f8;
  --soft-gold-4: var(--sky);
  --soft-gold-5: var(--blue);
  --soft-gold-6: var(--navy);
  --hero-text-dark: #123b5f;
  --hero-text-mid: #315b78;
  --page-bg: #f4fafe;
  --section-bg: #eaf6fc;
  --border: rgba(43, 170, 226, 0.18);
  --shadow-sm: 0 4px 12px rgba(21, 80, 138, 0.06);
  --shadow-md: 0 12px 30px rgba(21, 80, 138, 0.1);
  --shadow-lg: 0 24px 60px rgba(21, 80, 138, 0.16);
}

body[data-theme="blue"].kafu-portal {
  background: #f4fafe;
}

body[data-theme="blue"] .kafu-shell {
  background:
    radial-gradient(circle at 12% 6%, rgba(43, 170, 226, 0.1), transparent 28%),
    linear-gradient(180deg, #f4fafe 0%, #eaf6fc 45%, #ffffff 100%);
}

body[data-theme="blue"] .kafu-topbar {
  background: linear-gradient(
    135deg,
    var(--color-primary-dk, #0e3d70) 0%,
    var(--navy) 100%
  );
  border-bottom-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-topbar__dot {
  background: var(--sky);
  box-shadow: 0 0 0 6px rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-topbar__links a:hover {
  color: #bfe7f8;
}

body[data-theme="blue"] .kafu-header {
  background: rgba(244, 250, 254, 0.88);
  border-bottom-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-header.is-scrolled,
body[data-theme="blue"] .kafu-header.header--scrolled {
  background: rgba(244, 250, 254, 0.97);
  box-shadow: 0 18px 42px rgba(21, 80, 138, 0.1);
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-brand__logo,
body[data-theme="blue"] .kafu-theme-toggle,
body[data-theme="blue"] .kafu-menu-toggle {
  border-color: rgba(43, 170, 226, 0.2);
  box-shadow:
    0 14px 28px rgba(21, 80, 138, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body[data-theme="blue"] .kafu-nav__link:hover,
body[data-theme="blue"] .kafu-nav__item.is-active .kafu-nav__link {
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-nav__item.is-active .kafu-nav__link::after {
  background: var(--sky);
}

body[data-theme="blue"] .kafu-header__assistant,
body[data-theme="blue"] .btn--primary {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow:
    0 14px 28px rgba(22, 145, 208, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

body[data-theme="blue"] .kafu-header__assistant:hover,
body[data-theme="blue"] .btn--primary:hover {
  background: linear-gradient(135deg, var(--blue), var(--navy));
}

body[data-theme="blue"] .hero--dynamic {
  background:
    radial-gradient(
      circle at 14% 16%,
      rgba(255, 255, 255, 0.58),
      transparent 24%
    ),
    radial-gradient(
      circle at 82% 18%,
      rgba(43, 170, 226, 0.24),
      transparent 26%
    ),
    radial-gradient(
      circle at 68% 78%,
      rgba(58, 192, 195, 0.13),
      transparent 28%
    ),
    linear-gradient(135deg, #f7fcff 0%, #eaf6fc 42%, #d8f0fa 78%, #bee6f7 100%);
}

body[data-theme="blue"] .hero__grid {
  background-image:
    linear-gradient(rgba(21, 80, 138, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21, 80, 138, 0.045) 1px, transparent 1px);
}

body[data-theme="blue"] .hero__beam--one {
  background: rgba(255, 255, 255, 0.45);
}

body[data-theme="blue"] .hero__beam--two {
  background: rgba(43, 170, 226, 0.2);
}

body[data-theme="blue"] .hero__orb--gold {
  background: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .hero__watermark {
  color: rgba(21, 80, 138, 0.07);
}

body[data-theme="blue"] .hero-assistant-card,
body[data-theme="blue"] .hero-float-card,
body[data-theme="blue"] .stat-card,
body[data-theme="blue"] .service-card,
body[data-theme="blue"] .feature-card,
body[data-theme="blue"] .kafu-pulse-card {
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 18px 44px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .hero-assistant-card::before {
  background:
    radial-gradient(
      circle at 18% 0%,
      rgba(255, 255, 255, 0.34),
      transparent 30%
    ),
    radial-gradient(
      circle at 100% 18%,
      rgba(43, 170, 226, 0.12),
      transparent 34%
    );
}

body[data-theme="blue"] .hero-assistant-card__head,
body[data-theme="blue"] .hero-assistant-card__footer,
body[data-theme="blue"] .hero-assistant-input,
body[data-theme="blue"] .assistant-msg--bot .assistant-msg__bubble,
body[data-theme="blue"] .assistant-msg__avatar,
body[data-theme="blue"] .hero-assistant-card__avatar {
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .assistant-msg--user .assistant-msg__bubble {
  color: #ffffff;
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.86),
    rgba(21, 80, 138, 0.72)
  );
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .assistant-suggestions a,
body[data-theme="blue"] .hero-assistant-card__status,
body[data-theme="blue"] .chip--soon,
body[data-theme="blue"] .kafu-pulse-card__tag {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .hero-assistant-card__status i {
  background: var(--sky);
  box-shadow: 0 0 0 5px rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .hero-assistant-input a {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow: 0 10px 20px rgba(22, 145, 208, 0.18);
}

body[data-theme="blue"] .stats-section,
body[data-theme="blue"] .about-section,
body[data-theme="blue"] .cta-section,
body[data-theme="blue"] .kafu-pulse-section {
  background: #f4fafe;
}

body[data-theme="blue"] .services-section,
body[data-theme="blue"] .features-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #eaf6fc;
}

body[data-theme="blue"] .stats-grid {
  background: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .service-card::before,
body[data-theme="blue"] .kafu-pulse-card::after {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .service-card__icon,
body[data-theme="blue"] .quick-link__icon,
body[data-theme="blue"] .kafu-pulse-card__icon,
body[data-theme="blue"] .about-pillar > span {
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(58, 192, 195, 0.12)
  );
  color: var(--navy);
}

body[data-theme="blue"] .service-card:hover,
body[data-theme="blue"] .feature-card:hover,
body[data-theme="blue"] .kafu-pulse-card:hover {
  border-color: rgba(43, 170, 226, 0.28);
}

body[data-theme="blue"] .section-more-link {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-pulse-section {
  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(43, 170, 226, 0.11),
      transparent 28%
    ),
    radial-gradient(
      circle at 88% 18%,
      rgba(255, 255, 255, 0.6),
      transparent 24%
    ),
    #f4fafe;
}

body[data-theme="blue"] .kafu-pulse-section::before {
  background-image:
    linear-gradient(rgba(21, 80, 138, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21, 80, 138, 0.03) 1px, transparent 1px);
}

body[data-theme="blue"] .kafu-pulse-card::before {
  background: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-pulse-card__sample {
  background: rgba(234, 246, 252, 0.78);
  border-color: rgba(43, 170, 226, 0.13);
}

body[data-theme="blue"] .cta-card,
body[data-theme="blue"] .kafu-footer {
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(43, 170, 226, 0.12),
      transparent 30%
    ),
    linear-gradient(135deg, #0e3d70 0%, #15508a 48%, #071d3c 100%);
}

body[data-theme="blue"] .cta-card .eyebrow {
  color: #bfe7f8;
}

body[data-theme="blue"] .kafu-footer__bg {
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-footer__brand strong,
body[data-theme="blue"] .kafu-footer__col a:hover {
  color: #bfe7f8;
}

body[data-theme="blue"] .latest-news-section {
  background: #f4fafe;
}

body[data-theme="blue"] .latest-news-card {
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 18px 44px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .latest-news-card::before {
  background: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .latest-news-card::after {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .latest-news-card--main {
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(255, 255, 255, 0.52),
      transparent 26%
    ),
    linear-gradient(
      135deg,
      rgba(244, 250, 254, 0.96),
      rgba(191, 231, 248, 0.62)
    );
}

body[data-theme="blue"] .latest-news-more,
body[data-theme="blue"] .latest-news-card__date,
body[data-theme="blue"] .latest-news-card__tag {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .latest-news-card__tag {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .story-card::before {
  background: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .stories-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #eaf6fc;
}

body[data-theme="blue"] .stories-filter,
body[data-theme="blue"] .story-card,
body[data-theme="blue"] .stories-empty {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .stories-filter.is-active,
body[data-theme="blue"] .story-card__avatar {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .story-card::after {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .story-card__type {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .story-card__icon {
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(255, 255, 255, 0.46)
  );
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .story-card__text::before,
body[data-theme="blue"] .story-card__text::after {
  color: var(--blue);
}

body[data-theme="blue"] .offers-page-head {
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(43, 170, 226, 0.16),
      transparent 28%
    ),
    linear-gradient(135deg, #eaf6fc 0%, #ddf2fb 55%, #f4fafe 100%);
  border-bottom-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .offers-page-head::before {
  background: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .offers-page-head::after {
  background: rgba(58, 192, 195, 0.14);
}

body[data-theme="blue"] .offers-page-head__eyebrow {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .offers-page-head__eyebrow::before {
  background: var(--blue);
}

body[data-theme="blue"] .offers-page-head h1 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .offers-page-head h1 span {
  color: var(--navy);
}

body[data-theme="blue"] .offers-page-head p {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .offers-page-head__badge {
  background: rgba(255, 255, 255, 0.74);
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 12px 28px rgba(21, 80, 138, 0.08);
}

body[data-theme="blue"] .offers-page-head__badge span {
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .offers-page-head__badge span i {
  color: var(--navy);
}

body[data-theme="blue"] .offers-page-head__badge strong {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .intro-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #eaf6fc;
}

body[data-theme="blue"] .intro-step,
body[data-theme="blue"] .intro-reader-card,
body[data-theme="blue"] .intro-quiz-card,
body[data-theme="blue"] .intro-cert-form,
body[data-theme="blue"] .intro-certificate-wrap,
body[data-theme="blue"] .intro-unlock-card,
body[data-theme="blue"] .intro-question,
body[data-theme="blue"] .intro-cert-input input {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .intro-step span,
body[data-theme="blue"] .intro-slide__content span,
body[data-theme="blue"] .intro-secondary-btn {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-step.is-active span,
body[data-theme="blue"] .intro-primary-btn,
body[data-theme="blue"] .intro-download,
body[data-theme="blue"] .intro-nav-btn--primary {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .intro-slide {
  background:
    radial-gradient(
      circle at 12% 15%,
      rgba(255, 255, 255, 0.58),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(244, 250, 254, 0.96),
      rgba(191, 231, 248, 0.48)
    );
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .intro-slide::before {
  background: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .intro-progress div {
  background: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .intro-progress i {
  background: linear-gradient(90deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .intro-certificate {
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .intro-certificate__body > span {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .intro-certificate__body strong,
body[data-theme="blue"] .intro-certificate__top span {
  color: var(--navy);
}

body[data-theme="blue"] .intro-option {
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-option.is-selected {
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.24);
}

body[data-theme="blue"] .intro-section {
  background:
    radial-gradient(
      circle at 85% 0%,
      rgba(43, 170, 226, 0.14),
      transparent 34%
    ),
    radial-gradient(
      circle at 10% 25%,
      rgba(58, 192, 195, 0.12),
      transparent 32%
    ),
    linear-gradient(180deg, #f5fafd 0%, #ffffff 100%);
}

body[data-theme="blue"] .intro-step {
  background: rgba(255, 255, 255, 0.86);
  border-color: rgba(43, 170, 226, 0.16);
  color: #5e7692;
}

body[data-theme="blue"] .intro-step span {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
}

body[data-theme="blue"] .intro-step.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  border-color: transparent;
  box-shadow: 0 14px 30px rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .intro-step.is-active span {
  color: var(--blue);
  background: #ffffff;
}

body[data-theme="blue"] .intro-step.is-done,
body[data-theme="blue"] .intro-step.done {
  color: var(--green);
  border-color: rgba(72, 173, 72, 0.28);
  background: rgba(72, 173, 72, 0.08);
}

body[data-theme="blue"] .intro-reader-card,
body[data-theme="blue"] .intro-quiz-card,
body[data-theme="blue"] .intro-cert-form,
body[data-theme="blue"] .intro-certificate-wrap {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.96),
    rgba(255, 255, 255, 0.82)
  );
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 18px 44px rgba(21, 80, 138, 0.08);
}

body[data-theme="blue"] .intro-reader-card__head,
body[data-theme="blue"] .intro-quiz-card__head {
  border-bottom-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .intro-download {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow: 0 12px 24px rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .intro-download:hover {
  box-shadow: 0 16px 32px rgba(43, 170, 226, 0.3);
}

body[data-theme="blue"] .intro-progress {
  color: var(--navy);
}

body[data-theme="blue"] .intro-progress i {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--aqua));
}

body[data-theme="blue"] .intro-slide--image {
  background:
    radial-gradient(
      circle at 20% 10%,
      rgba(255, 255, 255, 0.14),
      transparent 28%
    ),
    linear-gradient(135deg, #15508a, #057590);
}

body[data-theme="blue"] .intro-slide--image img {
  background: #ffffff;
  box-shadow: 0 18px 44px rgba(0, 42, 80, 0.26);
}

body[data-theme="blue"] .intro-slide:not(.intro-slide--image) {
  background:
    radial-gradient(
      circle at 85% 10%,
      rgba(43, 170, 226, 0.13),
      transparent 30%
    ),
    linear-gradient(180deg, #ffffff, #f5fafd);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-slide__number {
  color: var(--blue);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .intro-slide__content span {
  color: var(--blue);
}

body[data-theme="blue"] .intro-nav-btn,
body[data-theme="blue"] .intro-secondary-btn {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.08);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .intro-nav-btn:hover:not(:disabled),
body[data-theme="blue"] .intro-secondary-btn:hover:not(:disabled) {
  color: var(--blue);
  background: rgba(43, 170, 226, 0.12);
  border-color: rgba(43, 170, 226, 0.26);
}

body[data-theme="blue"] .intro-nav-btn--primary,
body[data-theme="blue"] .intro-primary-btn {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  border-color: transparent;
  box-shadow: 0 12px 24px rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .intro-nav-btn--primary:hover:not(:disabled),
body[data-theme="blue"] .intro-primary-btn:hover:not(:disabled) {
  box-shadow: 0 16px 32px rgba(43, 170, 226, 0.3);
}

body[data-theme="blue"] .intro-page-indicator {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .intro-unlock-card {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .intro-unlock-card i {
  color: var(--blue);
}

body[data-theme="blue"] .intro-unlock-card .is-open,
body[data-theme="blue"] .intro-unlock-card.is-open {
  color: #176b35;
  background: rgba(72, 173, 72, 0.1);
  border-color: rgba(72, 173, 72, 0.18);
}

body[data-theme="blue"] .intro-question {
  background: rgba(245, 250, 253, 0.72);
  border-color: rgba(43, 170, 226, 0.13);
}

body[data-theme="blue"] .intro-question h3 {
  color: var(--navy);
}

body[data-theme="blue"] .intro-options,
body[data-theme="blue"] .intro-question label {
  color: #33506e;
}

body[data-theme="blue"] .intro-option,
body[data-theme="blue"] .intro-question label {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-option:hover,
body[data-theme="blue"] .intro-question label:hover {
  border-color: rgba(43, 170, 226, 0.28);
  background: rgba(43, 170, 226, 0.06);
}

body[data-theme="blue"] .intro-option input,
body[data-theme="blue"] .intro-question input {
  accent-color: var(--blue);
}

body[data-theme="blue"] .intro-option.is-selected {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.26);
}

body[data-theme="blue"] .intro-option.is-correct {
  color: #176b35;
  background: rgba(72, 173, 72, 0.12);
  border-color: rgba(72, 173, 72, 0.24);
}

body[data-theme="blue"] .intro-option.is-wrong {
  color: #8a1f1f;
  background: rgba(220, 38, 38, 0.09);
  border-color: rgba(220, 38, 38, 0.18);
}

body[data-theme="blue"] .intro-result--success,
body[data-theme="blue"] .intro-result.success {
  color: #176b35;
  background: rgba(72, 173, 72, 0.1);
  border-color: rgba(72, 173, 72, 0.2);
}

body[data-theme="blue"] .intro-result--error,
body[data-theme="blue"] .intro-result.error {
  color: #8a1f1f;
  background: rgba(220, 38, 38, 0.08);
  border-color: rgba(220, 38, 38, 0.18);
}

body[data-theme="blue"] .intro-certificate {
  background: linear-gradient(180deg, #ffffff 0%, #f5fafd 100%);
  border-color: rgba(43, 170, 226, 0.26);
}

body[data-theme="blue"] .intro-certificate::before {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .intro-certificate h2,
body[data-theme="blue"] .intro-certificate h3 {
  color: var(--navy);
}

body[data-theme="blue"] .intro-certificate__name {
  color: var(--blue);
}

body[data-theme="blue"] .intro-certificate__seal {
  color: var(--blue);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.2);
}

body[data-theme="blue"] .intro-certificate__seal--kafu {
  background: radial-gradient(
    circle,
    #ffffff 0%,
    #eef8fd 68%,
    rgba(43, 170, 226, 0.14) 100%
  );
  border-color: rgba(43, 170, 226, 0.38);
  box-shadow:
    0 12px 28px rgba(21, 80, 138, 0.1),
    inset 0 0 0 7px rgba(43, 170, 226, 0.07);
}

body[data-theme="blue"] .intro-certificate__slogan {
  color: var(--blue);
  border-top-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .intro-certificate__slogan::before,
body[data-theme="blue"] .intro-certificate__slogan::after {
  background: rgba(43, 170, 226, 0.34);
}

body[data-theme="blue"] .virtual-faq-search input {
  border-color: rgba(43, 170, 226, 0.18);
  box-shadow: 0 4px 12px rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .virtual-faq-search input:focus {
  border-color: rgba(43, 170, 226, 0.36);
  box-shadow: 0 0 0 4px rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .virtual-faq-search i {
  color: var(--navy);
}

body[data-theme="blue"] .virtual-faq-empty {
  background: rgba(255, 255, 255, 0.86);
  border-color: rgba(43, 170, 226, 0.24);
}

body[data-theme="blue"] .virtual-faq-empty i {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .virtual-gate-section {
  background: #f4fafe;
}

body[data-theme="blue"] .virtual-gate-card {
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(43, 170, 226, 0.15),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.94),
      rgba(234, 246, 252, 0.78)
    );
  border-color: rgba(43, 170, 226, 0.18);
  box-shadow: 0 12px 30px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .virtual-gate-card__icon {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .virtual-gate-card span {
  color: var(--navy);
}

.offers-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fff8e6;
}

.offers-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 360px) 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 30px;
}

.offers-search {
  height: 50px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-inline: 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.offers-search span {
  font-size: 16px;
}

.offers-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--hero-text-dark);
  font-size: 13px;
}

.offers-search input::placeholder {
  color: rgba(90, 75, 40, 0.56);
}

.offers-filters {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
}

.offers-filter {
  height: 38px;
  padding-inline: 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(201, 164, 55, 0.14);
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition:
    background var(--transition),
    color var(--transition),
    border-color var(--transition),
    transform var(--transition);
}

.offers-filter:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.86);
  border-color: rgba(201, 164, 55, 0.24);
}

.offers-filter.is-active {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border-color: transparent;
}

.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.offer-card {
  position: relative;
  min-height: 330px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.9),
    rgba(255, 255, 255, 0.72)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.offer-card::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  left: -80px;
  top: -80px;
  background: rgba(232, 200, 99, 0.17);
  transition:
    transform var(--transition),
    opacity var(--transition);
}

.offer-card::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.offer-card:hover {
  transform: translateY(-6px);
  border-color: rgba(201, 164, 55, 0.3);
  box-shadow: var(--shadow-md);
}

.offer-card:hover::before {
  transform: scale(1.12);
  opacity: 0.95;
}

.offer-card:hover::after {
  transform: scaleX(1);
}

.offer-card > * {
  position: relative;
  z-index: 1;
}

.offer-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 20px;
}

.offer-card__category {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.15);
  font-size: 11px;
  font-weight: 700;
}

.offer-card__discount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 36px;
  padding-inline: 12px;
  border-radius: 999px;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  font-size: 16px;
  font-weight: 700;
  box-shadow: 0 12px 24px rgba(201, 164, 55, 0.18);
}

.offer-card__icon {
  width: 60px;
  height: 60px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(255, 255, 255, 0.46)
  );
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 28px;
}

.offer-card h3 {
  margin: 0 0 10px;
  color: var(--hero-text-dark);
  font-size: 19px;
  line-height: 1.55;
}

.offer-card p {
  margin: 0 0 20px;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.offer-card__meta {
  display: grid;
  gap: 10px;
  margin-top: auto;
  padding: 16px;
  border-radius: 20px;
  background: rgba(255, 250, 235, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.12);
}

.offer-card__meta span {
  display: block;
  color: rgba(90, 75, 40, 0.68);
  font-size: 10.5px;
  margin-bottom: 2px;
}

.offer-card__meta strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 12px;
}

.offer-card__link {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(201, 164, 55, 0.12);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.offer-card__link span {
  transition: transform var(--transition);
}

.offer-card__link:hover span {
  transform: translateX(-4px);
}

.offers-empty {
  margin-top: 24px;
  padding: 46px 24px;
  border-radius: 30px;
  text-align: center;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.offers-empty div {
  font-size: 38px;
  margin-bottom: 12px;
}

.offers-empty strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 18px;
  margin-bottom: 6px;
}

.offers-empty p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
}

.offer-card.is-clickable {
  cursor: pointer;
}

.offer-card.is-clickable .story-card__thumb {
  position: relative;
}

.offer-card.is-clickable .story-card__thumb::after {
  content: "\F62C";
  font-family: "bootstrap-icons";
  position: absolute;
  inset-inline-end: 6px;
  bottom: 6px;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(17, 24, 39, 0.62);
  color: #fff;
  font-size: 12px;
}

.offer-modal[hidden] {
  display: none;
}

.offer-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
}

.offer-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(8px);
}

.offer-modal__dialog {
  position: relative;
  width: min(520px, 100%);
  max-height: calc(100vh - 48px);
  border-radius: 30px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
  animation: offerModalIn 0.22s ease both;
}

.offer-modal__close {
  position: absolute;
  top: 14px;
  inset-inline-start: 14px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--hero-text-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.offer-modal__image {
  padding: 24px;
  background: #f8fbfe;
}

.offer-modal__image img {
  display: block;
  width: 100%;
  max-height: 58vh;
  object-fit: contain;
}

.offer-modal__content {
  padding: 18px 22px 22px;
  text-align: center;
}

.offer-modal__content span {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 11px;
  font-weight: 900;
}

.offer-modal__content h3 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 20px;
  font-weight: 900;
}

.offer-modal__content p {
  margin: 6px 0 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 800;
}

.offer-modal__meta {
  margin-top: 12px;
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}

.offer-modal__meta strong,
.offer-modal__meta small {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

.offer-modal__meta strong {
  background: #fff1f2;
  color: #be123c;
  border: 1px solid #fecdd3;
}

.offer-modal__meta small {
  background: #ecfdf3;
  color: #027a48;
  border: 1px solid #d1fadf;
}

body[data-theme="blue"] .offer-modal__content span {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

@keyframes offerModalIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

body[data-theme="blue"] .offer-card::before,
body[data-theme="blue"] .latest-news-card::before {
  background: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .offers-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #eaf6fc;
}

body[data-theme="blue"] .offers-search,
body[data-theme="blue"] .offers-filter,
body[data-theme="blue"] .offer-card,
body[data-theme="blue"] .offer-card__meta,
body[data-theme="blue"] .offers-empty {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .offers-filter.is-active,
body[data-theme="blue"] .offer-card__discount {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .offer-card::after {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .offer-card__category {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .offer-card__icon {
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(255, 255, 255, 0.46)
  );
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .virtual-flow-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.08),
      transparent 30%
    ),
    #f4fafe;
}

body[data-theme="blue"] .virtual-flow-head h2 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .virtual-flow-head h2 span {
  color: var(--navy);
}

body[data-theme="blue"] .virtual-flow-head p {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .virtual-flow::before {
  background: linear-gradient(
    90deg,
    rgba(43, 170, 226, 0.1),
    rgba(43, 170, 226, 0.42),
    rgba(43, 170, 226, 0.1)
  );
}

body[data-theme="blue"] .virtual-flow-item {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(43, 170, 226, 0.15);
  box-shadow: 0 4px 12px rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .virtual-flow-item:hover {
  border-color: rgba(43, 170, 226, 0.28);
  box-shadow: 0 12px 30px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .virtual-flow-item::before {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .virtual-flow-item__icon {
  color: var(--navy);
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(58, 192, 195, 0.12)
  );
}

body[data-theme="blue"] .virtual-flow-item__num {
  color: rgba(21, 80, 138, 0.16);
}

body[data-theme="blue"] .virtual-flow-item h3 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .virtual-flow-item p {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .virtual-flow-item--action {
  background:
    radial-gradient(
      circle at 16% 16%,
      rgba(255, 255, 255, 0.58),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(244, 250, 254, 0.96),
      rgba(221, 242, 251, 0.82)
    );
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .virtual-flow-item--action .virtual-flow-item__icon {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .virtual-flow-item--action h3 {
  color: var(--navy);
}

.calendar-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fff8e6;
}

.calendar-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}

.calendar-download {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  height: 44px;
  padding-inline: 18px;
  border-radius: 999px;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border: 1px solid rgba(201, 164, 55, 0.12);
  box-shadow: 0 14px 28px rgba(201, 164, 55, 0.16);
  font-size: 12px;
  font-weight: 700;
  transition:
    transform var(--transition),
    box-shadow var(--transition);
}

.calendar-download:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(201, 164, 55, 0.22);
}

.calendar-featured {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 24px;
}

.calendar-featured-card {
  position: relative;
  padding: 22px;
  border-radius: 26px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.88),
    rgba(255, 255, 255, 0.68)
  );
  border: 1px solid rgba(201, 164, 55, 0.15);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    border-color var(--transition),
    box-shadow var(--transition);
}

.calendar-featured-card::before {
  content: "";
  position: absolute;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  left: -70px;
  top: -70px;
  background: rgba(232, 200, 99, 0.16);
}

.calendar-featured-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.calendar-featured-card > * {
  position: relative;
  z-index: 1;
}

.calendar-featured-card__date {
  display: inline-flex;
  height: 28px;
  align-items: center;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 14px;
}

.calendar-featured-card strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 16px;
  margin-bottom: 8px;
}

.calendar-featured-card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  line-height: 1.9;
}

.calendar-legend {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.calendar-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 13px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(201, 164, 55, 0.13);
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  box-shadow: var(--shadow-sm);
}

.calendar-legend__item i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.calendar-year {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.calendar-month-card {
  position: relative;
  padding: 18px;
  border-radius: 28px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 255, 255, 0.72)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.calendar-month-card::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--month-color), var(--month-color-2));
}

.calendar-month-card:hover {
  transform: translateY(-5px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.calendar-month-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.calendar-month-card__head strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 18px;
}

.calendar-month-card__head span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 10px;
  letter-spacing: 0.08em;
  margin-top: 2px;
}

.calendar-month-card__head em {
  font-style: normal;
  height: 28px;
  padding-inline: 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 10px;
  font-weight: 700;
}

.calendar-mini {
  padding: 14px;
  border-radius: 20px;
  background: rgba(255, 250, 235, 0.7);
  border: 1px solid rgba(201, 164, 55, 0.11);
}

.calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  margin-bottom: 8px;
}

.calendar-weekdays span {
  color: rgba(90, 75, 40, 0.72);
  font-size: 9.5px;
  font-weight: 700;
  text-align: center;
}

.calendar-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}

.calendar-day {
  height: 28px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(58, 48, 24, 0.72);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.08);
  font-size: 10px;
  font-weight: 700;
}

.calendar-day--event {
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 8px 16px rgba(90, 75, 40, 0.1);
}

.calendar-events {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.calendar-event {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: var(--hero-text-mid);
  font-size: 11.5px;
  line-height: 1.7;
}

.calendar-event i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 7px;
  flex-shrink: 0;
}

.calendar-event b {
  color: var(--hero-text-dark);
  font-weight: 700;
}

.calendar-empty-month {
  color: rgba(90, 75, 40, 0.58);
  font-size: 11.5px;
  line-height: 1.7;
}

.calendar-document-card {
  margin-top: 30px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 22px;
  border-radius: 28px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.88),
    rgba(255, 255, 255, 0.7)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.calendar-document-card__icon {
  width: 58px;
  height: 58px;
  border-radius: 21px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(255, 255, 255, 0.46)
  );
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 26px;
}

.calendar-document-card h3 {
  margin: 0 0 5px;
  color: var(--hero-text-dark);
  font-size: 17px;
}

.calendar-document-card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  line-height: 1.8;
}

.calendar-document-card a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding-inline: 16px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 12px;
  font-weight: 700;
}

body[data-theme="blue"] .calendar-featured-card::before {
  background: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .calendar-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #eaf6fc;
}

body[data-theme="blue"] .calendar-featured-card,
body[data-theme="blue"] .calendar-legend__item,
body[data-theme="blue"] .calendar-month-card,
body[data-theme="blue"] .calendar-mini,
body[data-theme="blue"] .calendar-document-card,
body[data-theme="blue"] .calendar-document-card a {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .calendar-download {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow: 0 14px 28px rgba(22, 145, 208, 0.18);
}

body[data-theme="blue"] .calendar-featured-card__date,
body[data-theme="blue"] .calendar-month-card__head em,
body[data-theme="blue"] .calendar-document-card a {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .calendar-mini {
  background: rgba(244, 250, 254, 0.74);
}

body[data-theme="blue"] .calendar-document-card__icon {
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(255, 255, 255, 0.46)
  );
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .latest-news-section--soon {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    #f4fafe;
}

body[data-theme="blue"] .news-soon-card {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .news-soon-card::before {
  background: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .news-soon-card::after {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .news-soon-card__items span {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .news-soon-card__visual {
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255, 255, 255, 0.65),
      transparent 35%
    ),
    linear-gradient(135deg, rgba(43, 170, 226, 0.18), rgba(21, 80, 138, 0.1));
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .news-soon-card__icon {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .virtual-hero {
  background:
    radial-gradient(
      circle at 14% 18%,
      rgba(43, 170, 226, 0.18),
      transparent 26%
    ),
    radial-gradient(
      circle at 88% 12%,
      rgba(58, 192, 195, 0.16),
      transparent 28%
    ),
    linear-gradient(135deg, #f7fcff 0%, #eaf6fc 48%, #ddf2fb 100%);
}

body[data-theme="blue"] .virtual-hero__grid {
  background-image:
    linear-gradient(rgba(21, 80, 138, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21, 80, 138, 0.04) 1px, transparent 1px);
}

body[data-theme="blue"] .virtual-hero__orb--one {
  background: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .virtual-hero__orb--two {
  background: rgba(58, 192, 195, 0.15);
}

body[data-theme="blue"] .virtual-hero__watermark {
  color: rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .virtual-hero__eyebrow {
  color: var(--navy);
  background: rgba(255, 255, 255, 0.62);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .virtual-hero h1 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .virtual-hero h1 span,
body[data-theme="blue"] .virtual-hero__lead strong,
body[data-theme="blue"] .virtual-hero__meta strong {
  color: var(--navy);
}

body[data-theme="blue"] .virtual-hero__lead,
body[data-theme="blue"] .virtual-hero__meta span {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .virtual-hero__meta div {
  background: rgba(255, 255, 255, 0.64);
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 4px 12px rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .virtual-booking-preview {
  background: rgba(255, 255, 255, 0.86);
  border-color: rgba(43, 170, 226, 0.18);
  box-shadow: 0 28px 70px rgba(21, 80, 138, 0.14);
}

body[data-theme="blue"] .virtual-booking-preview__top {
  border-bottom-color: rgba(43, 170, 226, 0.12);
  background: rgba(255, 255, 255, 0.46);
}

body[data-theme="blue"] .virtual-booking-preview__row {
  background: rgba(234, 246, 252, 0.72);
  border-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .virtual-booking-preview__time {
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow: 0 16px 34px rgba(22, 145, 208, 0.2);
}

body[data-theme="blue"] .virtual-booking-preview__footer span {
  background: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .virtual-floating-card {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 12px 30px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .virtual-floating-card i {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .virtual-step-card,
body[data-theme="blue"] .virtual-leader-card,
body[data-theme="blue"] .virtual-executive-card,
body[data-theme="blue"] .virtual-faq-item,
body[data-theme="blue"] .virtual-faq-side {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(43, 170, 226, 0.15);
  box-shadow: 0 4px 12px rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .virtual-step-card:hover,
body[data-theme="blue"] .virtual-leader-card:hover {
  border-color: rgba(43, 170, 226, 0.28);
  box-shadow: 0 12px 30px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .virtual-step-card__num {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .virtual-leaders-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.07),
      transparent 30%
    ),
    var(--section-bg);
}

body[data-theme="blue"] .virtual-executive-card__icon,
body[data-theme="blue"] .virtual-leader-card__icon,
body[data-theme="blue"] .virtual-handbook-card__icon {
  color: var(--navy);
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.18),
    rgba(58, 192, 195, 0.12)
  );
}

body[data-theme="blue"] .virtual-executive-card span {
  color: var(--navy);
}

body[data-theme="blue"] .virtual-executive-card a,
body[data-theme="blue"] .virtual-leader-card a {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .virtual-executive-card a:hover,
body[data-theme="blue"] .virtual-leader-card a:hover {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .virtual-handbook-section {
  background: #f4fafe;
}

body[data-theme="blue"] .virtual-handbook-card {
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(43, 170, 226, 0.14),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.94),
      rgba(234, 246, 252, 0.78)
    );
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 12px 30px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .virtual-handbook-card__content span {
  color: var(--navy);
}

body[data-theme="blue"] .virtual-faq-side button {
  color: var(--hero-text-mid);
  background: rgba(43, 170, 226, 0.07);
}

body[data-theme="blue"] .virtual-faq-side button.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
}

body[data-theme="blue"] .virtual-faq-item summary::before {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .virtual-faq-item[open] summary::before {
  color: #ffffff;
  background: var(--blue);
}

body[data-theme="blue"] .virtual-book-card {
  background:
    radial-gradient(
      circle at 12% 20%,
      rgba(58, 192, 195, 0.18),
      transparent 28%
    ),
    linear-gradient(135deg, #0e3d70, var(--navy));
  box-shadow: 0 24px 60px rgba(21, 80, 138, 0.16);
}

body[data-theme="blue"] .virtual-book-card .eyebrow {
  color: #bfe7f8;
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.16);
}

.latest-news-section--soon {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fffcf3;
  padding-block: 70px;
}

.news-soon-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 36px;
  align-items: center;
  padding: 34px;
  border-radius: 34px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.9),
    rgba(255, 255, 255, 0.7)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.news-soon-card::before {
  content: "";
  position: absolute;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  left: -100px;
  top: -100px;
  background: rgba(232, 200, 99, 0.18);
}

.news-soon-card::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 5px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
}

.news-soon-card > * {
  position: relative;
  z-index: 1;
}

.news-soon-card__content .section-title {
  margin-bottom: 12px;
}

.news-soon-card__items {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.news-soon-card__items span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding-inline: 14px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.15);
  font-size: 12px;
  font-weight: 700;
}

.news-soon-card__visual {
  min-height: 220px;
  border-radius: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255, 255, 255, 0.65),
      transparent 35%
    ),
    linear-gradient(135deg, rgba(232, 200, 99, 0.28), rgba(201, 164, 55, 0.12));
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
  text-align: center;
}

.news-soon-card__icon {
  width: 74px;
  height: 74px;
  border-radius: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 34px;
  margin-bottom: 18px;
}

.news-soon-card__visual strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 26px;
  margin-bottom: 4px;
}

.news-soon-card__visual span {
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.stories-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fff8e6;
}

.stories-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

.stories-head .section-body {
  max-width: 620px;
}

/* Stories Filters */

.stories-filters {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 26px;
}

.stories-filter {
  min-height: 36px;
  padding: 8px 15px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: 1px solid rgba(226, 236, 244, 0.95);
  background: #fff;
  color: var(--navy);
  font-family: inherit;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: 0.2s ease;
}

.stories-filter:hover {
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.3);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(201, 164, 55, 0.08);
}

.stories-filter.is-active {
  background: rgba(201, 164, 55, 0.14);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.34);
  box-shadow: 0 8px 18px rgba(201, 164, 55, 0.08);
}

/* Blue Theme */
body[data-theme="blue"] .stories-filter:hover,
body[data-theme="blue"] .stories-filter.is-active {
  background: rgba(43, 170, 226, 0.12);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.3);
  box-shadow: 0 8px 18px rgba(43, 170, 226, 0.08);
}

.stories-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.story-card {
  position: relative;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  padding: 26px;
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 255, 255, 0.72)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.story-card::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  left: -90px;
  top: -90px;
  background: rgba(232, 200, 99, 0.16);
  transition:
    transform var(--transition),
    opacity var(--transition);
}

.story-card::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.story-card:hover {
  transform: translateY(-6px);
  border-color: rgba(201, 164, 55, 0.3);
  box-shadow: var(--shadow-md);
}

.story-card:hover::before {
  transform: scale(1.12);
  opacity: 0.95;
}

.story-card:hover::after {
  transform: scaleX(1);
}

.story-card > * {
  position: relative;
  z-index: 1;
}

.story-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 26px;
}

.story-card__icon {
  width: 58px;
  height: 58px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(255, 255, 255, 0.46)
  );
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 26px;
}

.story-card__type {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.15);
  font-size: 11px;
  font-weight: 700;
}

.story-card__text {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 15px;
  line-height: 2.05;
  font-weight: 500;
}

.story-card__text::before {
  content: "“";
  color: var(--soft-gold-5);
  font-size: 34px;
  line-height: 0;
  vertical-align: -10px;
  margin-left: 4px;
}

.story-card__text::after {
  content: "”";
  color: var(--soft-gold-5);
  font-size: 34px;
  line-height: 0;
  vertical-align: -14px;
  margin-right: 4px;
}

.story-card__author {
  margin-top: auto;
  padding-top: 22px;
  border-top: 1px solid rgba(201, 164, 55, 0.12);
  display: flex;
  align-items: center;
  gap: 12px;
}

.story-card__avatar {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
}

.story-card__author strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 13px;
  margin-bottom: 2px;
}

.story-card__author span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
}

.story-card--thanks .story-card__icon {
  background: linear-gradient(
    135deg,
    rgba(255, 236, 176, 0.72),
    rgba(201, 164, 55, 0.12)
  );
}

.story-card--success .story-card__icon {
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.26),
    rgba(255, 255, 255, 0.46)
  );
}

.stories-empty {
  margin-top: 24px;
  padding: 46px 24px;
  border-radius: 30px;
  text-align: center;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.stories-empty div {
  font-size: 38px;
  margin-bottom: 12px;
}

.stories-empty strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 18px;
  margin-bottom: 6px;
}

.stories-empty p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
}

.section-header__action {
  max-width: 430px;
}

.section-more-link {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.section-more-link span {
  transition: transform var(--transition);
}

.section-more-link:hover span {
  transform: translateX(-4px);
}

.stories-grid--preview .story-card {
  min-height: 300px;
}

body {
  font-size: 13px;
  line-height: 1.7;
}

:root {
  --section-gap: 58px;
}

.section-title {
  font-size: clamp(19px, 2.2vw, 28px);
  line-height: 1.45;
  margin-bottom: 10px;
}

.section-body {
  font-size: 12px;
  line-height: 1.85;
}

.eyebrow {
  font-size: 10px;
  padding: 4px 11px;
  margin-bottom: 11px;
}

.btn {
  min-height: 36px;
  padding: 8px 17px;
  font-size: 11px;
}

.btn--lg {
  min-height: 42px;
  padding-inline: 22px;
  font-size: 12px;
}

.kafu-topbar {
  min-height: 32px;
  font-size: 10px;
}

.kafu-topbar__inner {
  min-height: 32px;
}

.kafu-header__inner {
  height: 64px;
  gap: 22px;
}

.kafu-brand {
  gap: 10px;
}

.kafu-brand__logo {
  width: 48px;
  height: 48px;
}

.kafu-brand__text strong {
  font-size: 13px;
}

.kafu-brand__text span {
  font-size: 9px;
}

.kafu-nav__link {
  height: 34px;
  padding-inline: 11px;
  font-size: 12.5px;
  font-weight: 600;
}

.kafu-header__assistant {
  min-height: 36px;
  padding-inline: 13px;
  font-size: 10px;
}

.kafu-theme-toggle,
.kafu-menu-toggle {
  width: 36px;
  height: 36px;
  border-radius: 13px;
}

.hero--dynamic {
  min-height: 590px;
}

.hero--dynamic .hero__inner {
  min-height: 520px;
  gap: 48px;
  padding-block: 60px 66px;
}

.hero--dynamic .hero__eyebrow {
  font-size: 10.5px;
  padding: 5px 12px;
  margin-bottom: 15px;
}

.hero--dynamic .hero__title {
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.28;
  margin-bottom: 13px;
  letter-spacing: -0.5px;
}

.hero--dynamic .hero__sub {
  max-width: 560px;
  font-size: clamp(12px, 1.25vw, 14px);
  line-height: 1.9;
  margin-bottom: 24px;
}

.hero--dynamic .hero__visual {
  min-height: 450px;
}

.hero-assistant-card {
  width: min(380px, 92%);
  border-radius: 26px;
}

.hero-assistant-card__head {
  padding: 15px 17px;
}

.hero-assistant-card__avatar {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  padding: 6px;
}

.hero-assistant-card__bot strong {
  font-size: 11.5px;
}

.hero-assistant-card__bot span {
  font-size: 9px;
}

.hero-assistant-card__status {
  height: 26px;
  padding-inline: 10px;
  font-size: 9.5px;
}

.hero-assistant-card__body {
  padding: 17px;
  gap: 11px;
}

.assistant-msg__avatar {
  width: 30px;
  height: 30px;
  border-radius: 11px;
}

.assistant-msg__bubble {
  font-size: 10.5px;
  padding: 10px 12px;
  border-radius: 15px;
  line-height: 1.75;
}

.assistant-suggestions a {
  height: 27px;
  padding-inline: 10px;
  font-size: 9.5px;
}

.hero-assistant-card__footer {
  padding: 0 17px 17px;
}

.hero-assistant-input {
  height: 40px;
}

.hero-assistant-input span,
.hero-assistant-input a {
  font-size: 10px;
}

.hero-assistant-input a {
  height: 31px;
  padding-inline: 13px;
}

.hero-float-card {
  min-width: 132px;
  padding: 12px 13px;
  border-radius: 17px;
}

.hero-float-card span {
  font-size: 9px;
}

.hero-float-card strong {
  font-size: 12px;
}

.services-grid,
.stories-grid,
.offers-grid {
  gap: 20px;
}

.service-card {
  min-height: 215px;
  padding: 20px;
  border-radius: 22px;
}

.service-card__head {
  margin-bottom: 18px;
}

.service-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 17px;
  font-size: 20px;
}

.service-card__body h3 {
  font-size: 14.5px;
  margin-bottom: 7px;
}

.service-card__body p {
  font-size: 11.5px;
  line-height: 1.8;
}

.service-card__footer {
  margin-top: 20px;
  padding-top: 14px;
}

.service-card__link,
.service-card__disabled {
  font-size: 11px;
}

.story-card,
.kafu-pulse-card {
  min-height: 260px;
  padding: 20px;
  border-radius: 23px;
}

.story-card__head,
.kafu-pulse-card__head {
  margin-bottom: 20px;
}

.story-card__icon,
.kafu-pulse-card__icon {
  width: 46px;
  height: 46px;
  border-radius: 17px;
  font-size: 21px;
}

.story-card__type,
.kafu-pulse-card__tag {
  height: 25px;
  padding-inline: 10px;
  font-size: 9.5px;
}

.story-card__text {
  font-size: 12px;
  line-height: 1.85;
}

.story-card__author {
  padding-top: 18px;
}

.story-card__avatar {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  font-size: 13px;
}

.story-card__author strong {
  font-size: 11px;
}

.story-card__author span {
  font-size: 9.5px;
}

.offer-card {
  min-height: 295px;
  padding: 20px;
  border-radius: 24px;
}

.offer-card__icon {
  width: 50px;
  height: 50px;
  border-radius: 18px;
  font-size: 23px;
}

.offer-card h3 {
  font-size: 15px;
}

.offer-card p {
  font-size: 11.5px;
}

.offer-card__discount {
  height: 32px;
  min-width: 50px;
  font-size: 13px;
}

.offer-card__category {
  height: 25px;
  font-size: 9.5px;
}

.calendar-featured-card {
  padding: 19px;
  border-radius: 23px;
}

.calendar-featured-card strong {
  font-size: 14px;
}

.calendar-featured-card p {
  font-size: 11px;
}

.calendar-month-card {
  padding: 15px;
  border-radius: 23px;
}

.calendar-month-card__head strong {
  font-size: 15px;
}

.calendar-day {
  height: 25px;
  font-size: 9px;
}

.calendar-event {
  font-size: 10.5px;
}

.cta-card {
  border-radius: 28px;
}

.cta-card h2 {
  font-size: clamp(19px, 2.5vw, 27px);
}

.cta-card p {
  font-size: 12px;
}

.kafu-footer__main {
  padding-block: 50px 34px;
}

.kafu-footer__logo {
  width: 54px;
  height: 54px;
}

.kafu-footer__brand strong {
  font-size: 14px;
}

.kafu-footer__brand p,
.kafu-footer__col a {
  font-size: 11px;
}

.kafu-footer__col h3 {
  font-size: 12px;
}

.offers-page-head {
  position: relative;
  padding-block: 30px;
  background:
    radial-gradient(
      circle at 14% 20%,
      rgba(255, 255, 255, 0.45),
      transparent 28%
    ),
    linear-gradient(135deg, #fff3c8 0%, #f3e0a6 50%, #fff8e6 100%);
  border-bottom: 1px solid rgba(201, 164, 55, 0.22);
  overflow: hidden;
}

.offers-page-head::after {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  left: -80px;
  bottom: -110px;
  border-radius: 50%;
  background: rgba(232, 200, 99, 0.12);
  pointer-events: none;
}

.offers-page-head__inner {
  position: relative;
  z-index: 1;
  min-height: 132px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.offers-page-head__content {
  max-width: 680px;
}

.offers-page-head__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  margin-bottom: 10px;
  padding: 4px 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 11px;
  font-weight: 600;
}

.offers-page-head__eyebrow::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--soft-gold-5);
}

.offers-page-head h1 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: clamp(25px, 3vw, 36px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: -0.4px;
}

.offers-page-head h1 span {
  color: var(--soft-gold-6);
}

.offers-page-head p {
  margin: 8px 0 0;
  max-width: 560px;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.offers-page-head__badge {
  flex-shrink: 0;
  min-width: 178px;
  min-height: 78px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: 0 12px 28px rgba(156, 123, 30, 0.07);
  backdrop-filter: blur(10px);
}

.offers-page-head__badge span {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(201, 164, 55, 0.1);
  font-size: 19px;
}

.offers-page-head__badge strong {
  color: var(--hero-text-dark);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.offers-page-head::before {
  background: rgba(201, 164, 55, 0.16);
}

.news-soon-card__items span i {
  margin-left: 7px;
  color: var(--soft-gold-6);
  font-size: 15px;
  vertical-align: -1px;
}

.news-soon-card__icon i,
.service-card__icon i {
  line-height: 1;
  color: var(--soft-gold-6);
}

.offers-page-head__badge span i,
.offers-search span i,
.offers-empty div i {
  line-height: 1;
  color: var(--soft-gold-6);
}

.offers-search span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.offers-empty div {
  width: 54px;
  height: 54px;
  margin: 0 auto 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  font-size: 24px;
}

.offers-page-head__badge span i,
.calendar-document-card__icon i {
  line-height: 1;
  color: var(--soft-gold-6);
}

.calendar-document-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--soft-gold-6);
}

.calendar-document-card__icon i {
  font-size: 24px;
}

.offers-page-head__badge span i,
.stories-empty div i {
  line-height: 1;
  color: var(--soft-gold-6);
}

.stories-empty div {
  width: 54px;
  height: 54px;
  margin: 0 auto 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  font-size: 24px;
}

.virtual-hero {
  position: relative;
  overflow: hidden;
  padding-block: 86px 72px;
  background:
    radial-gradient(
      circle at 14% 18%,
      rgba(232, 200, 99, 0.22),
      transparent 26%
    ),
    radial-gradient(
      circle at 88% 12%,
      rgba(43, 170, 226, 0.16),
      transparent 28%
    ),
    linear-gradient(135deg, #fff8e6 0%, #f7efcb 48%, #fff9e8 100%);
}

.virtual-hero__scene {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.virtual-hero__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(156, 123, 30, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(156, 123, 30, 0.04) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.65), transparent 88%);
}

.virtual-hero__orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(6px);
}

.virtual-hero__orb--one {
  width: 240px;
  height: 240px;
  right: -90px;
  top: 80px;
  background: rgba(201, 164, 55, 0.16);
}

.virtual-hero__orb--two {
  width: 190px;
  height: 190px;
  left: 8%;
  bottom: 40px;
  background: rgba(58, 192, 195, 0.14);
}

.virtual-hero__watermark {
  position: absolute;
  left: 6%;
  top: 8%;
  color: rgba(156, 123, 30, 0.06);
  font-size: clamp(110px, 16vw, 230px);
  font-weight: 700;
  line-height: 1;
}

.virtual-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items: center;
  gap: 60px;
}

.virtual-hero__eyebrow {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 6px 14px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(255, 255, 255, 0.56);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 12px;
  font-weight: 700;
}

.virtual-hero h1 {
  margin: 0 0 18px;
  color: var(--hero-text-dark);
  font-size: clamp(34px, 5vw, 62px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.8px;
}

.virtual-hero h1 span {
  display: block;
  color: var(--soft-gold-6);
}

.virtual-hero__lead {
  margin: 0;
  max-width: 650px;
  color: var(--hero-text-mid);
  font-size: 16px;
  line-height: 2;
}

.virtual-hero__lead strong {
  color: var(--soft-gold-6);
  font-weight: 700;
}

.virtual-hero__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 30px;
}

.virtual-hero__meta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.virtual-hero__meta div {
  min-width: 130px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.58);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-sm);
}

.virtual-hero__meta strong {
  display: block;
  color: var(--soft-gold-6);
  font-size: 22px;
  line-height: 1.2;
  margin-bottom: 4px;
}

.virtual-hero__meta span {
  color: var(--hero-text-mid);
  font-size: 11px;
}

.virtual-hero__visual {
  position: relative;
  min-height: 460px;
}

.virtual-booking-preview {
  position: absolute;
  top: 50%;
  right: 50%;
  width: min(430px, 96%);
  transform: translate(50%, -50%);
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: 0 28px 70px rgba(156, 123, 30, 0.15);
  backdrop-filter: blur(18px);
  overflow: hidden;
}

.virtual-booking-preview__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px;
  border-bottom: 1px solid rgba(201, 164, 55, 0.12);
  background: rgba(255, 255, 255, 0.42);
}

.virtual-booking-preview__top span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
  margin-bottom: 3px;
}

.virtual-booking-preview__top strong {
  color: var(--hero-text-dark);
  font-size: 15px;
}

.virtual-booking-preview__top i {
  color: var(--green);
  font-size: 26px;
}

.virtual-booking-preview__body {
  display: grid;
  gap: 12px;
  padding: 22px;
}

.virtual-booking-preview__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  border-radius: 16px;
  background: rgba(255, 250, 235, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.1);
}

.virtual-booking-preview__row span {
  color: var(--hero-text-mid);
  font-size: 12px;
}

.virtual-booking-preview__row strong {
  color: var(--hero-text-dark);
  font-size: 13px;
}

.virtual-booking-preview__time {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border-radius: 20px;
  color: #fff;
  background: linear-gradient(135deg, var(--soft-gold-5), var(--soft-gold-6));
  box-shadow: 0 16px 34px rgba(156, 123, 30, 0.16);
}

.virtual-booking-preview__time i {
  font-size: 24px;
}

.virtual-booking-preview__time span {
  display: block;
  font-size: 11px;
  opacity: 0.86;
}

.virtual-booking-preview__time strong {
  display: block;
  font-size: 14px;
}

.virtual-booking-preview__footer {
  display: flex;
  gap: 8px;
  padding: 0 22px 22px;
}

.virtual-booking-preview__footer span {
  height: 8px;
  flex: 1;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.16);
}

.virtual-floating-card {
  position: absolute;
  z-index: 2;
  min-width: 175px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 16px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-md);
}

.virtual-floating-card i {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 15px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 19px;
}

.virtual-floating-card span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
}

.virtual-floating-card strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 13px;
}

.virtual-floating-card--one {
  top: 66px;
  left: 0;
}

.virtual-floating-card--two {
  right: 0;
  bottom: 70px;
}

.virtual-flow-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fffcf3;
}

.virtual-flow-head {
  max-width: 780px;
  margin-bottom: 42px;
}

.virtual-flow-head h2 {
  margin: 0 0 12px;
  color: var(--hero-text-dark);
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 700;
  line-height: 1.45;
}

.virtual-flow-head h2 span {
  color: var(--soft-gold-6);
}

.virtual-flow-head p {
  margin: 0;
  max-width: 680px;
  color: var(--hero-text-mid);
  font-size: 14px;
  line-height: 2;
}

.virtual-flow {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.virtual-flow::before {
  content: "";
  position: absolute;
  top: 42px;
  right: 8%;
  left: 8%;
  height: 2px;
  background: linear-gradient(
    90deg,
    rgba(201, 164, 55, 0.12),
    rgba(201, 164, 55, 0.38),
    rgba(201, 164, 55, 0.12)
  );
  z-index: 0;
}

.virtual-flow-item {
  position: relative;
  z-index: 1;
  min-height: 230px;
  padding: 24px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.virtual-flow-item::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--transition);
}

.virtual-flow-item:hover {
  transform: translateY(-5px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.virtual-flow-item:hover::before {
  transform: scaleX(1);
}

.virtual-flow-item__icon {
  width: 58px;
  height: 58px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  color: var(--soft-gold-6);
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(201, 164, 55, 0.1)
  );
  font-size: 24px;
}

.virtual-flow-item__num {
  position: absolute;
  top: 22px;
  left: 22px;
  color: rgba(156, 123, 30, 0.18);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}

.virtual-flow-item h3 {
  margin: 0 0 10px;
  color: var(--hero-text-dark);
  font-size: 17px;
  font-weight: 700;
}

.virtual-flow-item p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.virtual-flow-item--action {
  background:
    radial-gradient(
      circle at 16% 16%,
      rgba(255, 255, 255, 0.58),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(255, 248, 230, 0.96),
      rgba(239, 217, 142, 0.56)
    );
  border-color: rgba(201, 164, 55, 0.22);
}

.virtual-leaders-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    var(--section-bg);
}

.virtual-executive-card {
  display: grid;
  grid-template-columns: 62px 1fr auto;
  align-items: center;
  gap: 18px;
  margin-bottom: 20px;
  padding: 24px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.virtual-executive-card__icon,
.virtual-leader-card__icon,
.virtual-handbook-card__icon {
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  color: var(--soft-gold-6);
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.22),
    rgba(201, 164, 55, 0.1)
  );
  font-size: 24px;
}

.virtual-executive-card span {
  display: block;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 4px;
}

.virtual-executive-card h3 {
  margin: 0 0 6px;
  color: var(--hero-text-dark);
  font-size: 20px;
}

.virtual-executive-card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
}

.virtual-executive-card a,
.virtual-leader-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 38px;
  padding-inline: 16px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 12px;
  font-weight: 700;
}

.virtual-leaders-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
}

.virtual-leader-card__icon {
  margin-bottom: 18px;
}

.virtual-leader-card a {
  margin-top: 18px;
}

.virtual-handbook-section {
  background: #fffcf3;
}

.virtual-handbook-card {
  display: grid;
  grid-template-columns: 70px 1fr auto;
  align-items: center;
  gap: 22px;
  padding: 30px;
  border-radius: 30px;
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(232, 200, 99, 0.16),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.92),
      rgba(255, 248, 230, 0.74)
    );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-md);
}

.virtual-handbook-card__content span {
  display: block;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 6px;
}

.virtual-handbook-card__content h2 {
  margin: 0 0 8px;
  color: var(--hero-text-dark);
  font-size: 24px;
  line-height: 1.5;
}

.virtual-handbook-card__content p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.virtual-faq-layout {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 22px;
  align-items: start;
}

.virtual-faq-side {
  position: sticky;
  top: 100px;
  display: grid;
  gap: 8px;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-sm);
}

.virtual-faq-side strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 13px;
  margin-bottom: 8px;
}

.virtual-faq-side button {
  min-height: 38px;
  padding-inline: 14px;
  border-radius: 999px;
  text-align: right;
  color: var(--hero-text-mid);
  background: rgba(201, 164, 55, 0.06);
  font-size: 12px;
  font-weight: 700;
}

.virtual-faq-side button.is-active {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
}

.virtual-faq-list {
  display: grid;
  gap: 12px;
}

.virtual-faq-item {
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(201, 164, 55, 0.12);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.virtual-faq-item summary {
  cursor: pointer;
  padding: 12px 16px;
  color: var(--hero-text-dark);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.7;
  list-style: none;
  display: flex;
  align-items: center;
}

.virtual-faq-item summary::-webkit-details-marker {
  display: none;
}

.virtual-faq-item summary::before {
  content: "+";
  width: 22px;
  height: 22px;
  margin-left: 8px;
  flex: 0 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.virtual-faq-item[open] summary::before {
  content: "−";
  color: #fff;
  background: var(--soft-gold-5);
}

.virtual-faq-item p {
  margin: 0;
  padding: 0 46px 14px 16px;
  color: var(--hero-text-mid);
  font-size: 11.8px;
  line-height: 1.9;
}

.virtual-faq-list {
  gap: 9px;
}

.kafu-nav__item {
  position: relative;
}

.kafu-nav__item--has-menu .kafu-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.kafu-nav__item--has-menu .kafu-nav__link i {
  font-size: 10px;
  transition: transform 0.2s ease;
}

.kafu-nav__dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 50;
  min-width: 230px;
  margin: 0;
  padding: 8px;
  list-style: none;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: 0.2s ease;
}

.kafu-nav__item--has-menu:hover .kafu-nav__dropdown,
.kafu-nav__item--has-menu:focus-within .kafu-nav__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.kafu-nav__item--has-menu:hover .kafu-nav__link i,
.kafu-nav__item--has-menu:focus-within .kafu-nav__link i {
  transform: rotate(180deg);
}

.kafu-nav__dropdown a {
  display: block;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.kafu-nav__dropdown a:hover,
.kafu-nav__dropdown a.is-active {
  background: rgba(201, 164, 55, 0.12);
  color: var(--kafu-gold-dk);
}

.kafu-nav__link.is-disabled {
  opacity: 0.55;
  cursor: default;
  pointer-events: none;
}

.kafu-mobile-nav__group {
  width: 100%;
  padding-top: 8px;
  margin-top: 8px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.kafu-mobile-nav__group-title {
  margin: 0 0 6px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--kafu-gold-dk);
}

.kafu-mobile-nav__link.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.kafu-nav__link {
  white-space: nowrap;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kafu-nav__item--has-menu .kafu-nav__link {
  max-width: 170px;
}

.kafu-answer-page-head {
  position: relative;
}

.kafu-answer-hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.kafu-answer-hero-actions .btn,
.kafu-answer-final-cta .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.kafu-answer-section {
  padding-top: 34px;
}

.kafu-answer-grid {
  display: grid;
  grid-template-columns: 1.25fr repeat(3, 1fr);
  gap: 14px;
}

.kafu-answer-card {
  padding: 22px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-sm);
}

.kafu-answer-card--main {
  background:
    radial-gradient(
      circle at top right,
      rgba(201, 164, 55, 0.14),
      transparent 38%
    ),
    #ffffff;
}

.kafu-answer-card__icon {
  width: 42px;
  height: 42px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: #fff;
  background: var(--kafu-gold);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.22);
}

.kafu-answer-card h2,
.kafu-answer-card h3 {
  margin: 0 0 10px;
  color: var(--hero-text-dark);
  font-size: 17px;
  font-weight: 700;
}

.kafu-answer-card h2 {
  font-size: 21px;
}

.kafu-answer-card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 12.5px;
  line-height: 1.9;
}

.kafu-answer-examples-section {
  padding-top: 26px;
}

.kafu-answer-examples {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.kafu-answer-example {
  min-height: 82px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid rgba(201, 164, 55, 0.12);
  box-shadow: var(--shadow-sm);
  color: var(--hero-text-dark);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.7;
}

.kafu-answer-example i {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  color: var(--kafu-gold-dk);
  background: rgba(201, 164, 55, 0.1);
}

.kafu-answer-final-cta {
  margin-top: 18px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-radius: 24px;
  background: linear-gradient(
    135deg,
    rgba(201, 164, 55, 0.12),
    rgba(255, 255, 255, 0.95)
  );
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: var(--shadow-sm);
}

.kafu-answer-final-cta strong {
  display: block;
  margin-bottom: 4px;
  color: var(--hero-text-dark);
  font-size: 16px;
  font-weight: 700;
}

.kafu-answer-final-cta p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 12.5px;
}

body[data-theme="blue"] .kafu-answer-card,
body[data-theme="blue"] .kafu-answer-example,
body[data-theme="blue"] .kafu-answer-final-cta {
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-answer-card--main {
  background:
    radial-gradient(
      circle at top right,
      rgba(43, 170, 226, 0.13),
      transparent 38%
    ),
    #ffffff;
}

body[data-theme="blue"] .kafu-answer-card__icon {
  background: var(--blue);
  box-shadow: 0 10px 22px rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-answer-example i {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-answer-final-cta {
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.1),
    rgba(255, 255, 255, 0.95)
  );
}

@media (max-width: 1024px) {
  .kafu-answer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kafu-answer-examples {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .kafu-answer-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .kafu-answer-grid,
  .kafu-answer-examples {
    grid-template-columns: 1fr;
  }

  .kafu-answer-final-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .kafu-answer-final-cta .btn {
    width: 100%;
  }
}

.virtual-book-section {
  padding-block-start: 20px;
}

.virtual-book-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 36px;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(
      circle at 12% 20%,
      rgba(232, 200, 99, 0.18),
      transparent 28%
    ),
    linear-gradient(135deg, #2c2516, #4a3815);
  box-shadow: var(--shadow-lg);
}

.virtual-book-card h2 {
  margin: 0 0 10px;
  font-size: 28px;
  line-height: 1.5;
}

.virtual-book-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 14px;
}

.virtual-book-card .eyebrow {
  color: var(--soft-gold-4);
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.16);
}

.virtual-book-card__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.virtual-faq-search {
  position: relative;
  margin-bottom: 24px;
}

.virtual-faq-search input {
  width: 100%;
  height: 56px;
  padding: 0 54px 0 20px;
  border-radius: 999px;
  border: 1px solid rgba(201, 164, 55, 0.18);
  background: rgba(255, 255, 255, 0.88);
  color: var(--hero-text-dark);
  font-size: 14px;
  box-shadow: var(--shadow-sm);
}

.virtual-faq-search input:focus {
  outline: none;
  border-color: rgba(201, 164, 55, 0.36);
  box-shadow: 0 0 0 4px rgba(201, 164, 55, 0.1);
}

.virtual-faq-search i {
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--soft-gold-6);
  font-size: 18px;
}

.virtual-faq-empty {
  margin-top: 22px;
  padding: 28px;
  text-align: center;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px dashed rgba(201, 164, 55, 0.24);
  color: var(--hero-text-mid);
}

.virtual-faq-empty i {
  display: inline-flex;
  width: 52px;
  height: 52px;
  margin-bottom: 12px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 22px;
}

.virtual-faq-empty strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 15px;
  margin-bottom: 6px;
}

.virtual-faq-empty p {
  margin: 0;
  font-size: 13px;
}

.virtual-gate-section {
  padding-block: 20px 70px;
  background: #fffcf3;
}

.virtual-gate-card {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  align-items: center;
  gap: 20px;
  padding: 28px;
  border-radius: 30px;
  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(232, 200, 99, 0.18),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.94),
      rgba(255, 248, 230, 0.78)
    );
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: var(--shadow-md);
}

.virtual-gate-card__icon {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 22px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 28px;
}

.virtual-gate-card span {
  display: block;
  margin-bottom: 5px;
  color: var(--soft-gold-6);
  font-size: 12px;
  font-weight: 700;
}

.virtual-gate-card h2 {
  margin: 0 0 8px;
  color: var(--hero-text-dark);
  font-size: 24px;
  line-height: 1.5;
}

.virtual-gate-card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.kafu-training-intro {
  background: #fffcf3;
}

.kafu-training-intro__card {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 20px;
  padding: 30px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-md);
}

.kafu-training-intro__icon {
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 24px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 30px;
}

.kafu-training-intro__card span {
  display: block;
  margin-bottom: 8px;
  color: var(--soft-gold-6);
  font-size: 12px;
  font-weight: 700;
}

.kafu-training-intro__card p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 14px;
  line-height: 2;
}

.kafu-training-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 18px;
}

.kafu-training-stats div {
  padding: 22px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(201, 164, 55, 0.12);
  box-shadow: var(--shadow-sm);
}

.kafu-training-stats strong {
  display: block;
  margin-bottom: 6px;
  color: var(--soft-gold-6);
  font-size: 30px;
  line-height: 1;
}

.kafu-training-stats span {
  color: var(--hero-text-mid);
  font-size: 12px;
}

.kafu-training-calendar {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.06),
      transparent 28%
    ),
    var(--section-bg);
}

.kafu-training-timeline {
  position: relative;
  display: grid;
  gap: 26px;
  margin-top: 38px;
}

.kafu-training-timeline::before {
  content: "";
  position: absolute;
  top: 10px;
  bottom: 10px;
  right: 130px;
  width: 2px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(201, 164, 55, 0.34),
    transparent
  );
}

.kafu-training-course {
  position: relative;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 28px;
  align-items: start;
}

.kafu-training-course__date {
  position: sticky;
  top: 100px;
  display: grid;
  gap: 8px;
  padding: 20px;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-sm);
}

.kafu-training-course__date i {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 20px;
}

.kafu-training-course__date strong {
  color: var(--hero-text-dark);
  font-size: 19px;
}

.kafu-training-course__date span {
  width: fit-content;
  padding: 5px 11px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 11px;
  font-weight: 700;
}

.kafu-training-course__card {
  position: relative;
  padding: 28px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: var(--shadow-md);
}

.kafu-training-course__card::before {
  content: "";
  position: absolute;
  right: -38px;
  top: 32px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--soft-gold-5);
  box-shadow: 0 0 0 8px rgba(201, 164, 55, 0.12);
}

.kafu-training-course__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.kafu-training-course__head span {
  display: inline-flex;
  margin-bottom: 7px;
  padding: 5px 11px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 11px;
  font-weight: 700;
}

.kafu-training-course__head h3 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 24px;
  line-height: 1.5;
}

.kafu-training-course__badge {
  min-width: 130px;
  height: 40px;
  padding-inline: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 999px;
  color: var(--hero-text-mid);
  background: rgba(201, 164, 55, 0.06);
  border: 1px solid rgba(201, 164, 55, 0.12);
  font-size: 11px;
  font-weight: 700;
}

.kafu-training-trainer {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 22px;
  padding: 16px;
  border-radius: 20px;
  background: rgba(201, 164, 55, 0.06);
  border: 1px solid rgba(201, 164, 55, 0.1);
}

.kafu-training-trainer i {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 18px;
}

.kafu-training-trainer strong,
.kafu-training-trainer span {
  display: block;
}

.kafu-training-trainer strong {
  color: var(--hero-text-dark);
  font-size: 14px;
  margin-bottom: 4px;
}

.kafu-training-trainer span {
  color: var(--hero-text-mid);
  font-size: 12px;
  line-height: 1.8;
}

.kafu-training-points h4 {
  margin: 0 0 12px;
  color: var(--hero-text-dark);
  font-size: 15px;
}

.kafu-training-points ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kafu-training-points li {
  position: relative;
  padding-right: 22px;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 1.9;
}

.kafu-training-points li::before {
  content: "";
  position: absolute;
  right: 0;
  top: 12px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--soft-gold-5);
}

.kafu-training-course blockquote {
  margin: 22px 0 0;
  padding: 18px 20px;
  border-radius: 20px;
  color: #2b2416;
  background: linear-gradient(
    135deg,
    rgba(232, 200, 99, 0.24),
    rgba(201, 164, 55, 0.1)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 13px;
  line-height: 1.9;
  font-weight: 700;
}

.kafu-training-head .offers-page-head__content p {
  max-width: 880px;
  line-height: 2.05;
}

.page-head-icon-badge {
  width: 150px;
  min-height: 150px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.page-head-icon-badge span {
  width: 86px;
  height: 86px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 30px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.12);
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: 0 14px 28px rgba(201, 164, 55, 0.12);
  font-size: 38px;
}

.page-head-icon-badge strong {
  display: none;
}

body[data-theme="blue"] .page-head-icon-badge {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body[data-theme="blue"] .page-head-icon-badge span {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.12);
  border-color: rgba(43, 170, 226, 0.18);
  box-shadow: 0 14px 28px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .kafu-training-intro__card span,
body[data-theme="blue"] .kafu-training-stats strong,
body[data-theme="blue"] .kafu-training-course__date i,
body[data-theme="blue"] .kafu-training-course__date span,
body[data-theme="blue"] .kafu-training-course__head span,
body[data-theme="blue"] .kafu-training-trainer i {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-intro__card,
body[data-theme="blue"] .kafu-training-stats div,
body[data-theme="blue"] .kafu-training-course__date,
body[data-theme="blue"] .kafu-training-course__card {
  border-color: rgba(43, 170, 226, 0.15);
  box-shadow: 0 10px 30px rgba(21, 80, 138, 0.08);
}

body[data-theme="blue"] .kafu-training-intro {
  background: #f4fafe;
}

body[data-theme="blue"] .kafu-training-calendar {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(43, 170, 226, 0.06),
      transparent 28%
    ),
    var(--section-bg);
}

body[data-theme="blue"] .kafu-training-timeline::before {
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(43, 170, 226, 0.34),
    transparent
  );
}

body[data-theme="blue"] .kafu-training-course__card::before,
body[data-theme="blue"] .kafu-training-points li::before {
  background: var(--blue);
  box-shadow: 0 0 0 8px rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-training-course blockquote {
  color: var(--navy);
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.14),
    rgba(58, 192, 195, 0.1)
  );
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-training-course__head span {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-training-course__badge {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.07);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-training-course__badge i {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-trainer {
  background: rgba(43, 170, 226, 0.07);
  border-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-training-trainer i {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-training-trainer strong {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .kafu-training-trainer span {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .kafu-training-timeline::before {
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(43, 170, 226, 0.34),
    transparent
  );
}

body[data-theme="blue"] .kafu-training-course__date {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(43, 170, 226, 0.15);
  box-shadow: 0 10px 30px rgba(21, 80, 138, 0.08);
}

body[data-theme="blue"] .kafu-training-course__date i {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-training-course__date strong {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .kafu-training-course__date span {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-training-course__card {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(43, 170, 226, 0.15);
  box-shadow: 0 12px 34px rgba(21, 80, 138, 0.09);
}

body[data-theme="blue"] .kafu-training-course__card::before {
  background: var(--blue);
  box-shadow: 0 0 0 8px rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-training-course__head h3 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .kafu-training-points h4 {
  color: var(--hero-text-dark);
}

body[data-theme="blue"] .kafu-training-points li {
  color: var(--hero-text-mid);
}

body[data-theme="blue"] .kafu-training-points li::before {
  background: var(--blue);
}

body[data-theme="blue"] .kafu-training-course blockquote {
  color: var(--navy);
  background: linear-gradient(
    135deg,
    rgba(43, 170, 226, 0.14),
    rgba(58, 192, 195, 0.1)
  );
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-training-intro__icon {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-training-intro__icon i {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-calendar .eyebrow {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.16);
}

@media (max-width: 1024px) {
  .page-head-icon-badge {
    width: 100%;
    min-height: 110px;
    justify-content: flex-start;
  }

  .hero-float-card--two {
    right: 0;
    bottom: 64px;
  }

  .hero--dynamic .hero__inner {
    grid-template-columns: 1fr;
    gap: 42px;
    padding-block: 72px 80px;
  }

  .hero--dynamic .hero__visual {
    min-height: 500px;
  }

  .services-grid,
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .kafu-pulse-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .calendar-intro {
    align-items: flex-start;
    flex-direction: column;
  }

  .calendar-featured {
    grid-template-columns: 1fr;
  }

  .calendar-year {
    grid-template-columns: repeat(2, 1fr);
  }

  .calendar-document-card {
    grid-template-columns: auto 1fr;
  }

  .calendar-document-card a {
    grid-column: 1 / -1;
    width: fit-content;
  }

  .stories-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .stories-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .latest-news-grid {
    grid-template-columns: 1fr;
  }

  .latest-news-card {
    min-height: auto;
  }

  .offers-toolbar {
    grid-template-columns: 1fr;
  }

  .offers-filters {
    justify-content: flex-start;
  }

  .offers-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .intro-reader-card__head {
    align-items: flex-start;
    flex-direction: column;
  }

  .intro-steps {
    grid-template-columns: 1fr;
  }

  .kafu-training-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .kafu-training-course {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .kafu-training-timeline::before,
  .kafu-training-course__card::before {
    display: none;
  }

  .kafu-training-course__date {
    position: static;
    display: flex;
    align-items: center;
    gap: 12px;
  }
}

@media (max-width: 980px) {
  .kafu-nav {
    display: none;
  }

  .kafu-menu-toggle {
    display: inline-flex;
  }

  .kafu-header__assistant {
    display: none;
  }

  .kafu-footer__main {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .virtual-hero__inner {
    grid-template-columns: 1fr;
  }

  .virtual-hero__visual {
    min-height: 420px;
  }

  .virtual-steps-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .virtual-leaders-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .virtual-faq-layout {
    grid-template-columns: 1fr;
  }

  .virtual-faq-side {
    position: static;
  }

  .virtual-handbook-card {
    grid-template-columns: 60px 1fr;
  }

  .virtual-handbook-card .btn {
    grid-column: 1 / -1;
    width: fit-content;
  }
}

@media (max-width: 900px) {
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .kafu-topbar__inner {
    justify-content: center;
    text-align: center;
  }

  .kafu-topbar__links {
    display: none;
  }

  .kafu-header__inner {
    height: 70px;
  }

  .kafu-brand__logo {
    width: 48px;
    height: 48px;
    border-radius: 17px;
  }

  .kafu-brand__text strong {
    font-size: 15px;
  }

  .kafu-brand__text span {
    font-size: 10px;
  }

  .kafu-mobile-nav {
    top: 70px;
  }

  .kafu-footer__cols {
    grid-template-columns: 1fr;
  }

  .kafu-footer__brand {
    flex-direction: column;
  }

  .kafu-footer__bottom {
    justify-content: center;
    text-align: center;
  }
}

@media (max-width: 640px) {
  :root {
    --section-gap: 58px;
  }

  .container,
  .kafu-container {
    padding-inline: 16px;
  }

  .hero--dynamic {
    min-height: auto;
  }

  .hero--dynamic .hero__inner {
    padding-block: 52px 72px;
  }

  .hero--dynamic .hero__title {
    font-size: 36px;
  }

  .hero--dynamic .hero__sub {
    font-size: 14px;
  }

  .hero--dynamic .hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero--dynamic .hero__actions .btn {
    width: 100%;
  }

  .hero__meta {
    gap: 10px;
  }

  .hero__meta div {
    min-width: 0;
    flex: 1;
  }

  .hero--dynamic .hero__visual {
    min-height: 470px;
  }

  .page-head-icon-badge {
    min-height: 90px;
  }

  .page-head-icon-badge span {
    width: 68px;
    height: 68px;
    border-radius: 24px;
    font-size: 30px;
  }

  .hero-assistant-card {
    width: 94%;
    border-radius: 28px;
  }

  .hero-assistant-card__head {
    padding: 18px;
  }

  .hero-assistant-card__body {
    padding: 18px;
  }

  .hero-assistant-card__footer {
    padding: 0 18px 18px;
  }

  .assistant-msg__bubble {
    max-width: 82%;
  }

  .hero-float-card {
    min-width: 145px;
    padding: 13px 14px;
    border-radius: 18px;
  }

  .hero-float-card--one {
    top: 12px;
    left: 0;
  }

  .hero-float-card--two {
    right: 0;
    bottom: 24px;
  }

  .hero--dynamic .hero__quick {
    margin-top: -62px;
  }

  .stats-grid,
  .services-grid,
  .features-grid {
    grid-template-columns: 1fr;
  }

  .service-card,
  .feature-card {
    padding: 22px;
  }

  .kafu-pulse-grid {
    grid-template-columns: 1fr;
  }

  .kafu-pulse-card {
    min-height: auto;
    padding: 22px;
    border-radius: 24px;
  }

  .cta-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .cta-card .btn {
    width: 100%;
  }

  .calendar-year {
    grid-template-columns: 1fr;
  }

  .calendar-download {
    width: 100%;
    justify-content: center;
  }

  .calendar-month-card {
    border-radius: 24px;
  }

  .calendar-document-card {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }

  .calendar-document-card a {
    width: 100%;
    justify-content: center;
  }

  .stories-grid {
    grid-template-columns: 1fr;
  }

  .story-card {
    min-height: auto;
    padding: 22px;
    border-radius: 24px;
  }

  .stories-filters {
    width: 100%;
  }

  .stories-filter {
    flex: 1;
    justify-content: center;
  }

  .latest-news-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .latest-news-more {
    width: 100%;
    justify-content: center;
  }

  .latest-news-card {
    flex-direction: column;
    padding: 22px;
  }

  .latest-news-card__date {
    width: 60px;
    height: 70px;
  }

  .offers-grid {
    grid-template-columns: 1fr;
  }

  .offer-card {
    min-height: auto;
    padding: 22px;
    border-radius: 24px;
  }

  .offers-toolbar {
    margin-bottom: 22px;
  }

  .offers-filters {
    gap: 7px;
  }

  .offers-filter {
    height: 36px;
    padding-inline: 13px;
    font-size: 11px;
  }

  .offers-page-head {
    padding-block: 24px;
  }

  .offers-page-head__inner {
    min-height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }

  .offers-page-head h1 {
    font-size: 26px;
  }

  .offers-page-head p {
    font-size: 12px;
  }

  .offers-page-head__badge {
    width: 100%;
    min-height: 66px;
    padding: 14px 16px;
    border-radius: 18px;
  }

  .intro-reader-card,
  .intro-quiz-card,
  .intro-cert-form,
  .intro-certificate-wrap {
    padding: 20px;
    border-radius: 24px;
  }

  .intro-slide {
    min-height: 290px;
    padding: 26px;
    border-radius: 22px;
  }

  .intro-slide__number {
    font-size: 54px;
    left: 22px;
    top: 18px;
  }

  .intro-slide__content h3 {
    font-size: 20px;
  }

  .intro-reader-card__foot,
  .intro-quiz-actions,
  .intro-cert-input {
    flex-direction: column;
    align-items: stretch;
  }

  .intro-nav-btn,
  .intro-primary-btn,
  .intro-secondary-btn,
  .intro-download {
    width: 100%;
  }

  .intro-certificate {
    padding: 26px;
    border-radius: 24px;
  }

  .intro-certificate__top,
  .intro-certificate__foot {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .intro-certificate__body h2 {
    font-size: 21px;
  }

  .intro-certificate__body strong {
    font-size: 23px;
  }

  .virtual-hero {
    padding-block: 54px 46px;
  }

  .virtual-hero__inner {
    gap: 34px;
  }

  .virtual-hero__visual {
    min-height: 390px;
  }

  .virtual-hero__actions,
  .virtual-book-card__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .virtual-hero__actions .btn,
  .virtual-book-card__actions .btn {
    width: 100%;
  }

  .virtual-steps-grid,
  .virtual-leaders-grid {
    grid-template-columns: 1fr;
  }

  .virtual-executive-card {
    grid-template-columns: 1fr;
  }

  .virtual-executive-card a {
    width: 100%;
  }

  .virtual-handbook-card {
    grid-template-columns: 1fr;
  }

  .virtual-book-card {
    flex-direction: column;
    align-items: stretch;
    padding: 28px;
  }

  .virtual-floating-card {
    display: none;
  }

  .kafu-training-stats {
    grid-template-columns: 1fr;
  }

  .kafu-training-intro__card {
    grid-template-columns: 1fr;
  }

  .kafu-training-course__head {
    flex-direction: column;
  }

  .kafu-training-course__badge {
    width: fit-content;
  }

  .kafu-training-course__card {
    padding: 22px;
    border-radius: 26px;
  }

  .kafu-training-course__head h3 {
    font-size: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal,
  .reveal--up,
  .reveal--right,
  .reveal--left {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .reveal *,
  .services-section.is-visible .service-card,
  .features-section.is-visible .feature-card,
  .stats-section.is-visible .stat-card {
    animation: none !important;
  }
}

.intro-section {
  background:
    radial-gradient(
      circle at 90% 0%,
      rgba(201, 164, 55, 0.07),
      transparent 30%
    ),
    #fff8e6;
}

.intro-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 28px;
}

.intro-step {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(201, 164, 55, 0.14);
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition:
    transform var(--transition),
    background var(--transition),
    border-color var(--transition);
}

.intro-step span {
  width: 30px;
  height: 30px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 11px;
  font-weight: 700;
}

.intro-step:hover:not(:disabled),
.intro-step.is-active {
  transform: translateY(-2px);
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(201, 164, 55, 0.26);
}

.intro-step.is-active span {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
}

.intro-step:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.intro-stage {
  display: none;
}

.intro-stage.is-active {
  display: block;
}

.intro-reader-card,
.intro-quiz-card,
.intro-cert-form,
.intro-certificate-wrap {
  padding: 28px;
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 255, 255, 0.72)
  );
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.intro-reader-card__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.intro-download,
.intro-primary-btn,
.intro-secondary-btn,
.intro-nav-btn {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-inline: 16px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform var(--transition),
    background var(--transition),
    border-color var(--transition),
    box-shadow var(--transition);
}

.intro-download,
.intro-primary-btn,
.intro-nav-btn--primary {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border: 1px solid rgba(201, 164, 55, 0.12);
  box-shadow: 0 12px 24px rgba(201, 164, 55, 0.16);
}

.intro-secondary-btn,
.intro-nav-btn {
  color: var(--soft-gold-6);
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid rgba(201, 164, 55, 0.16);
}

.intro-download:hover,
.intro-primary-btn:hover,
.intro-secondary-btn:hover,
.intro-nav-btn:hover:not(:disabled) {
  transform: translateY(-2px);
}

.intro-nav-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.intro-progress {
  display: grid;
  gap: 8px;
  margin-bottom: 18px;
}

.intro-progress span {
  color: var(--hero-text-mid);
  font-size: 11px;
  font-weight: 700;
}

.intro-progress div {
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(201, 164, 55, 0.12);
}

.intro-progress i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--soft-gold-4), var(--soft-gold-5));
  transition: width var(--transition);
}

.intro-slide {
  position: relative;
  min-height: 340px;
  padding: 36px;
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 12% 15%,
      rgba(255, 255, 255, 0.58),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      rgba(255, 250, 235, 0.96),
      rgba(239, 217, 142, 0.48)
    );
  border: 1px solid rgba(201, 164, 55, 0.15);
  overflow: hidden;
}

.intro-slide::before {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  left: -120px;
  top: -120px;
  background: rgba(232, 200, 99, 0.2);
}

.intro-slide__number {
  position: absolute;
  left: 30px;
  top: 24px;
  color: rgba(156, 123, 30, 0.14);
  font-size: 74px;
  font-weight: 700;
  line-height: 1;
}

.intro-slide__content {
  position: relative;
  z-index: 1;
  max-width: 680px;
}

.intro-slide__content span {
  display: inline-flex;
  height: 28px;
  align-items: center;
  padding-inline: 12px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.15);
  font-size: 10px;
  font-weight: 700;
  margin-bottom: 20px;
}

.intro-slide__content h3 {
  margin: 0 0 14px;
  color: var(--hero-text-dark);
  font-size: 26px;
  line-height: 1.5;
}

.intro-slide__content p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 2;
}

.intro-reader-card__foot {
  margin-top: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.intro-page-indicator {
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
}

.intro-unlock-card {
  margin-top: 16px;
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.14);
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
}

.intro-unlock-card div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.intro-unlock-card .is-open {
  color: #176b35;
}

.intro-quiz-card__head {
  margin-bottom: 24px;
}

.intro-result {
  margin-bottom: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  font-size: 12px;
  font-weight: 700;
}

.intro-result--success {
  color: #176b35;
  background: rgba(72, 173, 72, 0.12);
  border: 1px solid rgba(72, 173, 72, 0.2);
}

.intro-result--error {
  color: #8a1f1f;
  background: rgba(220, 38, 38, 0.09);
  border: 1px solid rgba(220, 38, 38, 0.16);
}

.intro-question {
  padding: 18px;
  border-radius: 22px;
  background: rgba(255, 250, 235, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.12);
  margin-bottom: 14px;
}

.intro-question h3 {
  margin: 0 0 14px;
  color: var(--hero-text-dark);
  font-size: 14px;
}

.intro-question label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  cursor: pointer;
}

.intro-question input {
  accent-color: var(--soft-gold-5);
}

.intro-quiz-actions {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.intro-cert-input {
  margin-top: 22px;
  display: flex;
  gap: 12px;
}

.intro-cert-input input {
  min-height: 44px;
  flex: 1;
  padding-inline: 16px;
  border-radius: 999px;
  border: 1px solid rgba(201, 164, 55, 0.16);
  background: rgba(255, 255, 255, 0.8);
  outline: none;
  color: var(--hero-text-dark);
  font-size: 12px;
}

.intro-certificate {
  max-width: 860px;
  margin-inline: auto;
  padding: 42px;
  border-radius: 30px;
  background:
    radial-gradient(
      circle at 15% 15%,
      rgba(232, 200, 99, 0.15),
      transparent 30%
    ),
    #ffffff;
  border: 1px solid rgba(201, 164, 55, 0.22);
  box-shadow: var(--shadow-md);
}

.intro-certificate__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 34px;
}

.intro-certificate__top img {
  width: 70px;
  height: 70px;
  object-fit: contain;
}

.intro-certificate__top span {
  color: var(--soft-gold-6);
  font-size: 13px;
  font-weight: 700;
}

.intro-certificate__body {
  text-align: center;
}

.intro-certificate__body > span {
  display: inline-flex;
  padding: 5px 16px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 18px;
}

.intro-certificate__body h2 {
  margin: 0 0 24px;
  color: var(--hero-text-dark);
  font-size: 28px;
}

.intro-certificate__body p {
  margin: 0 auto 18px;
  max-width: 620px;
  color: var(--hero-text-mid);
  font-size: 13px;
  line-height: 2;
}

.intro-certificate__body strong {
  display: block;
  color: var(--soft-gold-6);
  font-size: 30px;
  margin-bottom: 20px;
}

.intro-certificate__foot {
  margin-top: 26px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding-top: 22px;
}

.intro-certificate__foot span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 10px;
  margin-bottom: 4px;
}

.intro-certificate__foot strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 12px;
}

.intro-cert-actions {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.intro-slide--image {
  min-height: auto;
  padding: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #566678;
}

.intro-slide--image::before,
.intro-slide--image .intro-slide__number {
  display: none;
}

.intro-slide--image img {
  width: 100%;
  max-width: 900px;
  height: auto;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
}

.intro-options {
  margin-top: 12px;
  display: grid;
  gap: 9px;
}

.intro-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(201, 164, 55, 0.13);
  color: var(--hero-text-mid);
  font-size: 12px;
  cursor: pointer;
  transition:
    background var(--transition),
    border-color var(--transition),
    color var(--transition);
}

.intro-option input {
  accent-color: var(--soft-gold-5);
  flex-shrink: 0;
}

.intro-option.is-selected {
  color: var(--hero-text-dark);
  background: rgba(201, 164, 55, 0.1);
  border-color: rgba(201, 164, 55, 0.24);
}

.intro-option.is-correct {
  color: #176b35;
  background: rgba(72, 173, 72, 0.12);
  border-color: rgba(72, 173, 72, 0.24);
  font-weight: 700;
}

.intro-option.is-wrong {
  color: #8a1f1f;
  background: rgba(220, 38, 38, 0.09);
  border-color: rgba(220, 38, 38, 0.18);
  font-weight: 700;
}

.intro-reader-card__head--simple {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 14px;
}

.intro-unlock-card--inline {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.intro-unlock-card--inline > div {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  color: #6f5719;
  background: rgba(201, 164, 55, 0.08);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.intro-unlock-card--inline i {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #fff;
  background: var(--kafu-gold);
  font-size: 10px;
  line-height: 1;
}
.intro-unlock-card--inline i::before {
  display: inline-block;
  color: #fff;
  font-size: 10px;
  line-height: 1;
}
.intro-result-next-btn {
  margin-top: 14px;
}

body[data-theme="blue"] .intro-unlock-card--inline i {
  background: var(--blue);
}

body[data-theme="blue"] .intro-unlock-card--inline i::before {
  color: #fff;
}

.intro-unlock-card--inline .is-open {
  color: #247030;
  background: rgba(72, 173, 72, 0.1);
  border-color: rgba(72, 173, 72, 0.18);
}

.intro-unlock-card--inline .is-open i {
  background: #48ad48;
}

body[data-theme="blue"] .intro-unlock-card--inline > div {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.08);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .intro-unlock-card--inline i {
  background: var(--blue);
}

body[data-theme="blue"] .intro-unlock-card--inline .is-open {
  color: #247030;
  background: rgba(72, 173, 72, 0.1);
  border-color: rgba(72, 173, 72, 0.18);
}

body[data-theme="blue"] .intro-unlock-card--inline .is-open i {
  background: #48ad48;
}

@media (max-width: 640px) {
  .intro-reader-card__head--simple {
    align-items: flex-start;
    flex-direction: column;
  }

  .intro-unlock-card--inline > div {
    white-space: normal;
    border-radius: 18px;
  }
}

.intro-certificate-wrap {
  margin-top: 26px;
}

.intro-certificate {
  position: relative;
  max-width: 980px;
  min-height: 620px;
  margin: 0 auto;
  padding: 42px 52px;
  overflow: hidden;
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(201, 164, 55, 0.08),
      transparent 34%
    ),
    linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
  border: 2px solid rgba(201, 164, 55, 0.38);
  box-shadow: 0 24px 70px rgba(70, 52, 13, 0.12);
}

.intro-certificate::before {
  content: "";
  position: absolute;
  inset: 16px;
  border-radius: 20px;
  border: 1px solid rgba(201, 164, 55, 0.28);
  pointer-events: none;
}

.intro-certificate::after {
  content: "";
  position: absolute;
  inset: 28px;
  border-radius: 16px;
  border: 1px dashed rgba(201, 164, 55, 0.18);
  pointer-events: none;
}

.intro-certificate__watermark {
  position: absolute;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%) rotate(-18deg);
  font-size: 150px;
  font-weight: 700;
  color: rgba(201, 164, 55, 0.045);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

.intro-certificate__top {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 150px 1fr 150px;
  align-items: center;
  gap: 24px;
  margin-bottom: 48px;
}

.intro-certificate__logo {
  display: flex;
  align-items: center;
}

.intro-certificate__logo--cluster {
  justify-content: flex-start;
}

.intro-certificate__logo--kafu {
  justify-content: flex-end;
}

.intro-certificate__logo img {
  max-height: 94px;
  width: auto;
  object-fit: contain;
}

.intro-certificate__logo--kafu img {
  max-height: 78px;
}

.intro-certificate__title {
  text-align: center;
}

.intro-certificate__title span {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 6px 16px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.18);
  font-size: 12px;
  font-weight: 700;
}

.intro-certificate__title strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -0.8px;
}

.intro-certificate__body {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}

.intro-certificate__eyebrow {
  display: block;
  color: var(--hero-text-mid);
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 14px;
}

.intro-certificate__name {
  display: inline-block;
  min-width: 360px;
  max-width: 100%;
  padding: 8px 26px 16px;
  margin-bottom: 18px;
  color: var(--soft-gold-6);
  font-size: 38px;
  font-weight: 700;
  line-height: 1.4;
  border-bottom: 2px solid rgba(201, 164, 55, 0.38);
}

.intro-certificate__body p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 14px;
  line-height: 1.9;
}

.intro-certificate__body h2 {
  margin: 10px 0 12px;
  color: var(--hero-text-dark);
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -0.4px;
}

.intro-certificate__desc {
  max-width: 620px;
  margin: 0 auto !important;
}

.intro-certificate__foot {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 110px 1fr;
  align-items: end;
  gap: 24px;
  margin-top: 56px;
}

.intro-certificate__meta {
  text-align: center;
}

.intro-certificate__meta span {
  display: block;
  color: var(--hero-text-mid);
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 7px;
}

.intro-certificate__meta strong {
  display: inline-flex;
  min-width: 150px;
  justify-content: center;
  padding-top: 9px;
  color: var(--hero-text-dark);
  border-top: 1px solid rgba(201, 164, 55, 0.28);
  font-size: 13px;
  font-weight: 700;
}

.intro-certificate__seal {
  width: 104px;
  height: 104px;
  margin: 0 auto;
  border-radius: 50%;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  color: var(--soft-gold-6);
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.92),
    rgba(201, 164, 55, 0.11)
  );
  border: 2px solid rgba(201, 164, 55, 0.38);
}

.intro-certificate__seal i {
  font-size: 34px;
}

.intro-certificate__seal span {
  font-size: 10px;
  font-weight: 700;
}

.intro-cert-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}

.intro-certificate__seal--kafu {
  width: 112px;
  height: 112px;
  padding: 14px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: radial-gradient(
    circle,
    #ffffff 0%,
    #fff9e6 68%,
    rgba(201, 164, 55, 0.16) 100%
  );
  border: 2px solid rgba(201, 164, 55, 0.42);
  box-shadow:
    0 12px 28px rgba(70, 52, 13, 0.1),
    inset 0 0 0 7px rgba(201, 164, 55, 0.07);
}

.intro-certificate__seal--kafu img {
  width: 76px;
  height: 76px;
  object-fit: contain;
}

.intro-certificate__slogan {
  position: relative;
  z-index: 2;
  margin-top: 14px;
  padding-top: 18px;
  text-align: center;
  color: var(--soft-gold-6);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.2px;
}

.intro-certificate__slogan::before,
.intro-certificate__slogan::after {
  content: "";
  display: inline-block;
  width: 34px;
  height: 1px;
  margin: 0 12px 4px;
  background: rgba(201, 164, 55, 0.35);
}

@media (max-width: 700px) {
  .intro-certificate {
    min-height: auto;
    padding: 30px 22px;
    border-radius: 22px;
  }

  .intro-certificate::before {
    inset: 10px;
    border-radius: 16px;
  }

  .intro-certificate::after {
    display: none;
  }

  .intro-certificate__watermark {
    font-size: 84px;
  }

  .intro-certificate__top {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 34px;
  }

  .intro-certificate__logo,
  .intro-certificate__logo--cluster,
  .intro-certificate__logo--kafu {
    justify-content: center;
  }

  .intro-certificate__logo img {
    max-height: 62px;
  }

  .intro-certificate__title strong {
    font-size: 26px;
  }

  .intro-certificate__name {
    min-width: 0;
    width: 100%;
    font-size: 28px;
  }

  .intro-certificate__body h2 {
    font-size: 20px;
  }

  .intro-certificate__foot {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 38px;
  }

  .intro-certificate__seal {
    order: -1;
  }
}

body[data-theme="blue"] .btn--ghost {
  color: var(--navy);
  background: rgba(255, 255, 255, 0.56);
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .btn--ghost:hover {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(43, 170, 226, 0.34);
}

body[data-theme="blue"] .kafu-mobile-nav {
  background: rgba(244, 250, 254, 0.98);
  border-bottom-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 18px 44px rgba(21, 80, 138, 0.12);
}

body[data-theme="blue"] .kafu-mobile-nav__link:hover,
body[data-theme="blue"] .kafu-mobile-nav__link.is-active {
  color: var(--hero-text-dark);
  background: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .hero__meta div {
  background: rgba(255, 255, 255, 0.46);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .hero__meta strong,
body[data-theme="blue"] .latest-news-card__content a,
body[data-theme="blue"] .service-card__link,
body[data-theme="blue"] .kafu-pulse-card__link,
body[data-theme="blue"] .offer-card__link {
  color: var(--navy);
}

body[data-theme="blue"] .service-card__footer,
body[data-theme="blue"] .kafu-pulse-card__link,
body[data-theme="blue"] .offer-card__link,
body[data-theme="blue"] .story-card__author,
body[data-theme="blue"] .intro-certificate__foot,
body[data-theme="blue"] .intro-certificate__slogan {
  border-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-footer__main {
  border-bottom-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-footer__logo {
  border-color: rgba(43, 170, 226, 0.18);
  box-shadow: 0 12px 24px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .calendar-day {
  color: rgba(21, 80, 138, 0.72);
}

body[data-theme="blue"] .intro-certificate__watermark {
  color: rgba(21, 80, 138, 0.05);
}

body[data-theme="blue"] .intro-certificate__title span,
body[data-theme="blue"] .intro-certificate__meta strong {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.08);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-certificate__slogan::before,
body[data-theme="blue"] .intro-certificate__slogan::after {
  background: rgba(43, 170, 226, 0.35);
}

.offers-page-head__badge.page-head-icon-badge,
body[data-theme="blue"] .offers-page-head__badge.page-head-icon-badge {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body[data-theme="blue"] .eyebrow {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .eyebrow::before {
  background: var(--blue);
  box-shadow: 0 0 0 6px rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .offers-section .offer-card .offer-card__meta {
  background: rgba(244, 250, 254, 0.88) !important;
  border-color: rgba(43, 170, 226, 0.16) !important;
}

body[data-theme="blue"] .offers-section .offer-card .offer-card__meta span {
  color: rgba(49, 91, 120, 0.72) !important;
}

body[data-theme="blue"] .offers-section .offer-card .offer-card__meta strong {
  color: var(--navy) !important;
}

@media (max-width: 640px) {
  .offers-page-head__badge.page-head-icon-badge {
    width: 100%;
    min-height: 72px;
    padding: 0;
    justify-content: flex-start;
    border-radius: 0;
  }

  .offers-page-head__badge.page-head-icon-badge span {
    width: 68px;
    height: 68px;
    border-radius: 24px;
    font-size: 30px;
  }
}

.kafu-booking-page {
  padding-block: 38px 90px;
  background: #fffcf3;
}

.kafu-booking-page-head .kafu-booking-back {
  width: fit-content;
  margin-bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--soft-gold-6);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.kafu-booking-page-head .kafu-booking-back i {
  font-size: 14px;
}

.kafu-booking-page-head .kafu-booking-back:hover {
  color: var(--kafu-gold-dk);
}

.kafu-booking-form {
  margin: 0;
}

.kafu-booking-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: flex-start;
}

.kafu-booking-card {
  display: grid;
  gap: 18px;
}

.kafu-booking-block,
.kafu-booking-ticket {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 250, 235, 0.72)
  );
  border: 1px solid rgba(201, 164, 55, 0.14);
  box-shadow: 0 16px 38px rgba(156, 123, 30, 0.07);
}

.kafu-booking-block {
  padding: 22px;
  border-radius: 28px;
}

.kafu-booking-block__head {
  margin-bottom: 16px;
  padding-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(201, 164, 55, 0.12);
}

.kafu-booking-block--appointment .kafu-booking-block__head {
  margin-bottom: 4px !important;
  padding-bottom: 6px !important;
}

.kafu-booking-block__head > span {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  box-shadow: 0 10px 20px rgba(201, 164, 55, 0.15);
  font-size: 12px;
  font-weight: 700;
}

.kafu-booking-block__head h2 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}

.kafu-booking-options {
  width: 100%;
}

.kafu-booking-loading,
.kafu-booking-empty {
  width: 100%;
  padding: 14px;
  border-radius: 16px;
  color: var(--hero-text-mid);
  background: rgba(255, 255, 255, 0.64);
  border: 1px dashed rgba(201, 164, 55, 0.18);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

.kafu-booking-options--departments {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.kafu-booking-department {
  width: auto !important;
  min-width: auto;
  max-width: 100%;
  min-height: 38px;
  padding: 8px 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  color: var(--hero-text-dark);
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  transition:
    background var(--transition),
    border-color var(--transition),
    color var(--transition),
    box-shadow var(--transition),
    transform var(--transition);
}

.kafu-booking-department:hover {
  transform: translateY(-1px);
  background: rgba(201, 164, 55, 0.08);
  border-color: rgba(201, 164, 55, 0.26);
}

.kafu-booking-department.is-selected {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border-color: rgba(156, 123, 30, 0.18);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.16);
}

.kafu-booking-appointment-grid {
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.kafu-booking-calendar,
.kafu-booking-slots-panel {
  padding: 14px;
  border-radius: 22px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.92),
    rgba(255, 250, 235, 0.74)
  );
  border: 1px solid rgba(201, 164, 55, 0.13);
  box-shadow: 0 12px 28px rgba(156, 123, 30, 0.055);
}

.kafu-booking-slots-panel__head {
  height: 30px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--hero-text-dark);
  font-size: 12px;
  font-weight: 700;
}

.kafu-booking-slots-panel__head i {
  color: var(--soft-gold-6);
  font-size: 15px;
}

.kafu-booking-calendar__empty,
#bookingSlots .kafu-booking-empty {
  min-height: 54px;
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap !important;
}

.kafu-booking-calendar__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.kafu-booking-calendar__top strong {
  color: var(--hero-text-dark);
  font-size: 13px;
  font-weight: 700;
}

.kafu-booking-calendar__top button {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  cursor: pointer;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
}

.kafu-booking-calendar__weekdays,
.kafu-booking-calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}

.kafu-booking-calendar__weekdays {
  margin-bottom: 8px;
}

.kafu-booking-calendar__weekdays span {
  text-align: center;
  color: var(--hero-text-mid);
  font-size: 9px;
  font-weight: 700;
}

.kafu-booking-calendar__day {
  min-height: 32px;
  border-radius: 10px;
  cursor: default;
  color: rgba(90, 75, 40, 0.4);
  background: rgba(255, 255, 255, 0.52);
  border: 1px solid rgba(201, 164, 55, 0.08);
  font-size: 11px;
  font-weight: 700;
}

.kafu-booking-calendar__day.is-empty {
  background: transparent;
  border-color: transparent;
}

.kafu-booking-calendar__day.is-available {
  cursor: pointer;
  color: var(--hero-text-dark);
  background: rgba(201, 164, 55, 0.09);
  border-color: rgba(201, 164, 55, 0.18);
}

.kafu-booking-calendar__day.is-available:hover {
  background: rgba(201, 164, 55, 0.14);
}

.kafu-booking-calendar__day.is-selected {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border-color: rgba(156, 123, 30, 0.18);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.18);
}

.kafu-booking-options--times {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.kafu-booking-time {
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 13px;
  cursor: pointer;
  color: var(--hero-text-dark);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 12px;
  font-weight: 700;
  transition:
    background var(--transition),
    border-color var(--transition),
    color var(--transition),
    box-shadow var(--transition),
    transform var(--transition);
}

.kafu-booking-time:hover {
  transform: translateY(-1px);
  background: rgba(201, 164, 55, 0.09);
  border-color: rgba(201, 164, 55, 0.24);
}

.kafu-booking-time.is-selected {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  border-color: rgba(156, 123, 30, 0.18);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.16);
}

.kafu-booking-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.kafu-booking-fields label {
  color: var(--hero-text-dark);
  font-size: 12px;
  font-weight: 700;
}

.kafu-booking-fields__full {
  grid-column: 1 / -1;
}

.kafu-booking-fields input,
.kafu-booking-fields textarea {
  width: 100%;
  margin-top: 7px;
  padding: 12px 14px;
  border-radius: 16px;
  color: var(--hero-text-dark);
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-family: var(--font-base);
  font-size: 12px;
  font-weight: 600;
  outline: none;
  transition:
    border-color var(--transition),
    box-shadow var(--transition),
    background var(--transition);
}

.kafu-booking-fields textarea {
  min-height: 106px;
  resize: vertical;
}

.kafu-booking-fields input:focus,
.kafu-booking-fields textarea:focus {
  border-color: rgba(201, 164, 55, 0.36);
  box-shadow: 0 0 0 4px rgba(201, 164, 55, 0.08);
  background: rgba(255, 255, 255, 0.96);
}

.kafu-booking-ticket {
  position: sticky;
  top: 110px;
  padding: 20px;
  border-radius: 28px;
}

.kafu-booking-ticket__top {
  margin-bottom: 14px;
  padding-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px dashed rgba(201, 164, 55, 0.22);
}

.kafu-booking-ticket__top span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--hero-text-dark);
  font-size: 13px;
  font-weight: 700;
}

.kafu-booking-ticket__top span i {
  color: var(--soft-gold-6);
  font-size: 17px;
}

.kafu-booking-ticket__top > strong {
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.kafu-booking-ticket__items {
  display: grid;
  gap: 9px;
  margin-bottom: 18px;
}

.kafu-booking-ticket__item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px;
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.66);
  border: 1px solid rgba(201, 164, 55, 0.1);
}

.kafu-booking-ticket__item > i {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  color: var(--soft-gold-6);
  background: rgba(201, 164, 55, 0.1);
  font-size: 14px;
}

.kafu-booking-ticket__item span {
  display: block;
  margin-bottom: 2px;
  color: var(--hero-text-mid);
  font-size: 10px;
  font-weight: 700;
}

.kafu-booking-ticket__item strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.6;
}

.kafu-booking-submit {
  width: 100%;
}

.kafu-booking-result {
  margin-top: 14px;
  padding: 11px 13px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.8;
}

.kafu-booking-result i {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 14px;
}

.kafu-booking-result span {
  flex: 1;
}

.kafu-booking-result.is-success {
  color: #276331;
  background: rgba(72, 173, 72, 0.08);
  border: 1px solid rgba(72, 173, 72, 0.16);
}

.kafu-booking-result.is-success i {
  color: #ffffff;
  background: #48ad48;
}

.kafu-booking-result.is-error {
  color: #9f2d2d;
  background: rgba(220, 53, 69, 0.07);
  border: 1px solid rgba(220, 53, 69, 0.13);
}

.kafu-booking-result.is-error i {
  color: #ffffff;
  background: #dc3545;
}

body[data-theme="blue"] .kafu-booking-page {
  background: #f7fbfe;
}

body[data-theme="blue"] .kafu-booking-page-head .kafu-booking-back {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-booking-page-head .kafu-booking-back:hover {
  color: var(--blue);
}

body[data-theme="blue"] .kafu-booking-block,
body[data-theme="blue"] .kafu-booking-ticket,
body[data-theme="blue"] .kafu-booking-calendar,
body[data-theme="blue"] .kafu-booking-slots-panel {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.96),
    rgba(244, 250, 254, 0.86)
  );
  border-color: rgba(43, 170, 226, 0.14);
  box-shadow: 0 16px 38px rgba(21, 80, 138, 0.065);
}

body[data-theme="blue"] .kafu-booking-block__head {
  border-bottom-color: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-booking-block__head > span,
body[data-theme="blue"] .kafu-booking-department.is-selected,
body[data-theme="blue"] .kafu-booking-calendar__day.is-selected,
body[data-theme="blue"] .kafu-booking-time.is-selected {
  color: #ffffff;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  border-color: rgba(21, 80, 138, 0.16);
  box-shadow: 0 10px 22px rgba(21, 80, 138, 0.16);
}

body[data-theme="blue"] .kafu-booking-loading,
body[data-theme="blue"] .kafu-booking-empty {
  color: var(--navy);
  background: rgba(244, 250, 254, 0.9);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .kafu-booking-department,
body[data-theme="blue"] .kafu-booking-calendar__day.is-available,
body[data-theme="blue"] .kafu-booking-time,
body[data-theme="blue"] .kafu-booking-fields input,
body[data-theme="blue"] .kafu-booking-fields textarea {
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.15);
}

body[data-theme="blue"] .kafu-booking-department:hover,
body[data-theme="blue"] .kafu-booking-calendar__day.is-available:hover,
body[data-theme="blue"] .kafu-booking-time:hover {
  background: rgba(43, 170, 226, 0.09);
  border-color: rgba(43, 170, 226, 0.26);
}

body[data-theme="blue"] .kafu-booking-calendar__top strong,
body[data-theme="blue"] .kafu-booking-slots-panel__head {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-booking-calendar__top button,
body[data-theme="blue"] .kafu-booking-ticket__item > i,
body[data-theme="blue"] .kafu-booking-ticket__top > strong {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-booking-slots-panel__head i,
body[data-theme="blue"] .kafu-booking-ticket__top span i {
  color: var(--blue);
}

body[data-theme="blue"] .kafu-booking-fields input:focus,
body[data-theme="blue"] .kafu-booking-fields textarea:focus {
  border-color: rgba(43, 170, 226, 0.36);
  box-shadow: 0 0 0 4px rgba(43, 170, 226, 0.08);
}

body[data-theme="blue"] .kafu-booking-ticket__top {
  border-bottom-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-booking-ticket__item {
  border-color: rgba(43, 170, 226, 0.1);
}

body[data-theme="blue"] .kafu-booking-result.is-success {
  color: var(--navy);
  background: rgba(43, 170, 226, 0.08);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-booking-result.is-success i {
  background: var(--blue);
}

.kafu-booking-calendar [hidden],
.kafu-booking-calendar__empty[hidden],
.kafu-booking-calendar__panel[hidden] {
  display: none !important;
}

body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day {
  color: rgba(21, 80, 138, 0.38) !important;
  background: rgba(255, 255, 255, 0.62) !important;
  border-color: rgba(43, 170, 226, 0.08) !important;
}

body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-available {
  color: var(--navy) !important;
  background: rgba(43, 170, 226, 0.09) !important;
  border-color: rgba(43, 170, 226, 0.18) !important;
}

body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-available:hover {
  color: var(--navy) !important;
  background: rgba(43, 170, 226, 0.15) !important;
  border-color: rgba(43, 170, 226, 0.28) !important;
}

body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-selected,
body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-selected:hover,
body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-selected:focus,
body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-selected:active {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--sky), var(--blue)) !important;
  border-color: rgba(21, 80, 138, 0.22) !important;
  box-shadow: 0 10px 22px rgba(21, 80, 138, 0.18) !important;
}

body[data-theme="blue"]
  .kafu-booking-calendar
  button.kafu-booking-calendar__day.is-empty {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.intro-rating-card {
  max-width: 760px;
  margin-inline: auto;
  padding: 34px;
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: 0 18px 48px rgba(156, 123, 30, 0.08);
  text-align: center;
}

.intro-rating-card .eyebrow {
  margin-inline: auto;
}

.intro-rating-card .section-body {
  margin-inline: auto;
}

.intro-rating-stars {
  margin: 26px 0 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  direction: ltr;
}

.intro-rating-star {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  cursor: pointer;
  color: rgba(156, 123, 30, 0.3);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.14);
  font-size: 30px;
  line-height: 1;
  transition:
    color var(--transition),
    background var(--transition),
    border-color var(--transition),
    transform var(--transition),
    box-shadow var(--transition);
}

.intro-rating-star:hover,
.intro-rating-star.is-active {
  color: var(--soft-gold-5);
  background: rgba(201, 164, 55, 0.1);
  border-color: rgba(201, 164, 55, 0.26);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.12);
  transform: translateY(-1px);
}

.intro-rating-result {
  margin: 0 auto 18px;
  max-width: 420px;
  padding: 10px 14px;
  border-radius: 16px;
  font-size: 12px;
  font-weight: 700;
}

.intro-rating-result--success {
  color: #1f6b2b;
  background: rgba(72, 173, 72, 0.1);
  border: 1px solid rgba(72, 173, 72, 0.18);
}

.intro-rating-result--error {
  color: #9f2d2d;
  background: rgba(220, 53, 69, 0.08);
  border: 1px solid rgba(220, 53, 69, 0.14);
}

.intro-rating-actions {
  display: flex;
  justify-content: center;
}

body[data-theme="blue"] .intro-rating-card {
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 18px 48px rgba(21, 80, 138, 0.07);
}

body[data-theme="blue"] .intro-rating-star {
  color: rgba(21, 80, 138, 0.3);
  border-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .intro-rating-star:hover,
body[data-theme="blue"] .intro-rating-star.is-active {
  color: var(--blue);
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.26);
  box-shadow: 0 10px 22px rgba(21, 80, 138, 0.12);
}

@media (max-width: 640px) {
  .intro-rating-card {
    padding: 24px 18px;
    border-radius: 24px;
  }

  .intro-rating-star {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    font-size: 25px;
  }
}

@media (max-width: 1024px) {
  .kafu-booking-layout {
    grid-template-columns: 1fr;
  }

  .kafu-booking-ticket {
    position: static;
  }
}

@media (max-width: 860px) {
  .kafu-booking-appointment-grid {
    grid-template-columns: 1fr;
  }

  .kafu-booking-options--times {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kafu-booking-fields {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .kafu-booking-page {
    padding-block: 30px 64px;
  }

  .kafu-booking-block,
  .kafu-booking-ticket {
    padding: 16px;
    border-radius: 22px;
  }

  .kafu-booking-block__head > span {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
    border-radius: 12px;
  }

  .kafu-booking-department {
    min-height: 36px;
    padding: 7px 12px;
    font-size: 11px;
  }

  .kafu-booking-calendar__empty,
  #bookingSlots .kafu-booking-empty {
    white-space: normal !important;
  }
}

/* Portal nav cleanup overrides */
.kafu-nav__link {
  white-space: nowrap;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kafu-nav__item--has-menu .kafu-nav__link {
  max-width: 170px;
}

.kafu-mobile-nav__group {
  width: 100%;
  padding-top: 8px;
  margin-top: 8px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.kafu-mobile-nav__group-title {
  margin: 0 0 6px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--kafu-gold-dk);
}

.kafu-mobile-nav__link.is-disabled,
.kafu-nav__link.is-disabled {
  opacity: 0.55;
  pointer-events: none;
  cursor: default;
}

.kafu-nav__item--featured .kafu-nav__link--featured {
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  color: #2b2416;
  border: 1px solid rgba(156, 123, 30, 0.18);
  box-shadow: 0 12px 26px rgba(201, 164, 55, 0.2);
  gap: 7px;
}

.kafu-nav__item--featured .kafu-nav__link--featured:hover,
.kafu-nav__item--featured.is-active .kafu-nav__link--featured {
  background: linear-gradient(135deg, var(--soft-gold-3), var(--soft-gold-5));
  color: #2b2416;
  box-shadow: 0 16px 34px rgba(201, 164, 55, 0.28);
}

.kafu-nav__item--featured.is-active .kafu-nav__link--featured::after {
  display: none;
}

.kafu-mobile-nav__link--featured {
  margin-top: 8px;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  color: #2b2416;
  border: 1px solid rgba(156, 123, 30, 0.18);
  box-shadow: 0 12px 26px rgba(201, 164, 55, 0.18);
}

.kafu-mobile-nav__link--featured:hover,
.kafu-mobile-nav__link--featured.is-active {
  color: #2b2416;
  background: linear-gradient(135deg, var(--soft-gold-3), var(--soft-gold-5));
}

body[data-theme="blue"] .kafu-nav__item--featured .kafu-nav__link--featured,
body[data-theme="blue"] .kafu-mobile-nav__link--featured {
  background: linear-gradient(135deg, var(--sky), var(--blue));
  color: #ffffff;
  border-color: rgba(43, 170, 226, 0.28);
  box-shadow: 0 12px 26px rgba(21, 80, 138, 0.18);
}

body[data-theme="blue"]
  .kafu-nav__item--featured
  .kafu-nav__link--featured:hover,
body[data-theme="blue"]
  .kafu-nav__item--featured.is-active
  .kafu-nav__link--featured,
body[data-theme="blue"] .kafu-mobile-nav__link--featured:hover,
body[data-theme="blue"] .kafu-mobile-nav__link--featured.is-active {
  background: linear-gradient(135deg, var(--blue), var(--navy));
  color: #ffffff;
  box-shadow: 0 16px 34px rgba(21, 80, 138, 0.24);
}

.kafu-mobile-nav .kafu-mobile-nav__link.kafu-mobile-nav__link--featured {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, var(--soft-gold-4), var(--soft-gold-5));
  color: #2b2416;
  border: 1px solid rgba(156, 123, 30, 0.18);
  box-shadow: 0 12px 26px rgba(201, 164, 55, 0.18);
  font-weight: 700;
}

.kafu-mobile-nav .kafu-mobile-nav__link.kafu-mobile-nav__link--featured:hover,
.kafu-mobile-nav
  .kafu-mobile-nav__link.kafu-mobile-nav__link--featured.is-active {
  background: linear-gradient(135deg, var(--soft-gold-3), var(--soft-gold-5));
  color: #2b2416;
}

body[data-theme="blue"]
  .kafu-mobile-nav
  .kafu-mobile-nav__link.kafu-mobile-nav__link--featured {
  background: linear-gradient(135deg, var(--sky), var(--blue));
  color: #ffffff;
  border-color: rgba(43, 170, 226, 0.28);
  box-shadow: 0 12px 26px rgba(21, 80, 138, 0.18);
}

body[data-theme="blue"]
  .kafu-mobile-nav
  .kafu-mobile-nav__link.kafu-mobile-nav__link--featured:hover,
body[data-theme="blue"]
  .kafu-mobile-nav
  .kafu-mobile-nav__link.kafu-mobile-nav__link--featured.is-active {
  background: linear-gradient(135deg, var(--blue), var(--navy));
  color: #ffffff;
}

/* =========================================================
   HOME PAGE - MOBILE FIX
   ========================================================= */

@media (max-width: 980px) {
  .hero--dynamic {
    min-height: auto;
    padding-block: 0;
  }

  .hero--dynamic .hero__inner {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 34px;
    padding-block: 54px 44px;
  }

  .hero--dynamic .hero__content {
    max-width: 100%;
    text-align: center;
  }

  .hero--dynamic .hero__eyebrow {
    margin-inline: auto;
  }

  .hero--dynamic .hero__sub {
    margin-inline: auto;
    max-width: 620px;
  }

  .hero--dynamic .hero__actions {
    justify-content: center;
  }

  .hero__meta {
    justify-content: center;
  }

  .hero--dynamic .hero__visual {
    min-height: auto;
    width: 100%;
  }

  .hero-assistant-card {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    max-width: 520px;
    margin-inline: auto;
    transform: none;
  }

  .hero-float-card--two {
    right: auto;
    left: 50%;
    bottom: -22px;
    transform: translateX(-50%);
  }

  .latest-news-section,
  .services-section,
  .kafu-pulse-section,
  .cta-section {
    overflow: hidden;
  }
}

@media (max-width: 760px) {
  .hero--dynamic {
    background:
      radial-gradient(
        circle at 20% 10%,
        rgba(255, 255, 255, 0.45),
        transparent 26%
      ),
      linear-gradient(135deg, #fffbef 0%, #f7edcf 58%, #ecd484 100%);
  }

  body[data-theme="blue"] .hero--dynamic {
    background:
      radial-gradient(
        circle at 20% 10%,
        rgba(255, 255, 255, 0.28),
        transparent 28%
      ),
      linear-gradient(135deg, #f4fbff 0%, #dff3ff 56%, #b7e5fb 100%);
  }

  .hero__grid,
  .hero__beam,
  .hero__orb,
  .hero__watermark {
    display: none;
  }

  .hero--dynamic .hero__inner {
    padding-block: 38px 34px;
    gap: 26px;
  }

  .hero--dynamic .hero__title {
    font-size: clamp(30px, 9vw, 42px);
    line-height: 1.35;
    letter-spacing: 0;
  }

  .hero--dynamic .hero__sub {
    font-size: 13px;
    line-height: 1.9;
  }

  .hero__meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 24px;
  }

  .hero__meta div {
    min-width: 0;
    padding: 12px 14px;
  }

  .hero-assistant-card {
    border-radius: 24px;
  }

  .hero-assistant-card__head {
    align-items: flex-start;
    padding: 16px;
    gap: 10px;
  }

  .hero-assistant-card__bot {
    align-items: flex-start;
  }

  .hero-assistant-card__avatar {
    width: 42px;
    height: 42px;
    border-radius: 15px;
  }

  .hero-assistant-card__bot strong {
    font-size: 12px;
    line-height: 1.7;
  }

  .hero-assistant-card__status {
    height: 26px;
    padding-inline: 9px;
    font-size: 10px;
  }

  .hero-assistant-card__body {
    padding: 16px;
    gap: 12px;
  }

  .assistant-msg__bubble {
    max-width: 88%;
    font-size: 11px;
    padding: 11px 13px;
  }

  .assistant-suggestions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .assistant-suggestions a {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .hero-assistant-card__footer {
    padding: 14px 16px 16px;
  }

  .hero-assistant-input {
    gap: 10px;
  }

  .hero-assistant-input span {
    font-size: 11px;
  }

  .hero-assistant-input a {
    flex: 0 0 auto;
  }

  .hero-float-card--two {
    display: none;
  }

  .news-soon-card {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .news-soon-card__content .eyebrow {
    margin-inline: auto;
  }

  .news-soon-card__items {
    justify-content: center;
  }

  .news-soon-card__visual {
    margin-inline: auto;
  }

  .section-header--row {
    align-items: flex-start;
    text-align: center;
  }

  .section-header--row > div,
  .section-header--row .section-body,
  .section-header__action {
    width: 100%;
    margin-inline: auto;
  }

  .section-header--row .eyebrow {
    margin-inline: auto;
  }

  .services-grid,
  .stories-grid--preview {
    grid-template-columns: 1fr;
  }

  .cta-card {
    text-align: center;
    align-items: center;
  }

  .cta-card .eyebrow {
    margin-inline: auto;
  }
}

@media (max-width: 420px) {
  .hero--dynamic .hero__inner {
    padding-block: 30px;
  }

  .hero-assistant-card__head {
    flex-direction: column;
  }

  .hero-assistant-card__status {
    align-self: flex-start;
  }

  .assistant-msg__bubble {
    max-width: 100%;
  }

  .btn--lg {
    width: 100%;
  }

  .hero__actions {
    width: 100%;
  }

  .hero__actions .btn {
    width: 100%;
  }
}

/* =========================================================
   VIRTUAL KAFU PAGE - MOBILE FIX
   ========================================================= */

@media (max-width: 980px) {
  .virtual-hero {
    min-height: auto;
    overflow: hidden;
  }

  .virtual-hero__inner {
    grid-template-columns: 1fr;
    gap: 34px;
    padding-block: 54px 44px;
  }

  .virtual-hero__content {
    max-width: 100%;
    text-align: center;
  }

  .virtual-hero__eyebrow,
  .virtual-hero__lead {
    margin-inline: auto;
  }

  .virtual-hero__actions {
    justify-content: center;
  }

  .virtual-hero__meta {
    justify-content: center;
  }

  .virtual-hero__visual {
    width: 100%;
    min-height: auto;
  }

  .virtual-booking-preview {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: 520px;
    margin-inline: auto;
    transform: none;
  }

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

  .virtual-faq-layout {
    grid-template-columns: 1fr;
  }

  .virtual-faq-side {
    position: relative;
    top: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 8px;
  }

  .virtual-faq-side strong {
    flex: 0 0 auto;
  }

  .virtual-faq-side button {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .virtual-handbook-card,
  .virtual-book-card {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .virtual-handbook-card__icon {
    margin-inline: auto;
  }

  .virtual-book-card__actions {
    justify-content: center;
  }
}

@media (max-width: 760px) {
  .virtual-hero__grid,
  .virtual-hero__orb,
  .virtual-hero__watermark {
    display: none;
  }

  .virtual-hero__inner {
    padding-block: 38px 34px;
    gap: 26px;
  }

  .virtual-hero__content h1 {
    font-size: clamp(30px, 9vw, 42px);
    line-height: 1.35;
  }

  .virtual-hero__lead {
    font-size: 13px;
    line-height: 1.9;
  }

  .virtual-hero__actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .virtual-hero__actions .btn {
    width: 100%;
  }

  .virtual-hero__meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 22px;
  }

  .virtual-hero__meta div {
    min-width: 0;
    padding: 12px 14px;
  }

  .virtual-booking-preview {
    border-radius: 24px;
  }

  .virtual-booking-preview__top,
  .virtual-booking-preview__body {
    padding-inline: 16px;
  }

  .virtual-flow-head {
    text-align: center;
  }

  .virtual-flow-head .eyebrow {
    margin-inline: auto;
  }

  .virtual-flow {
    grid-template-columns: 1fr;
  }

  .virtual-faq-search {
    min-height: 48px;
  }

  .virtual-faq-search input {
    font-size: 12px;
  }

  .virtual-faq-side {
    margin-bottom: 14px;
  }

  .virtual-faq-item summary {
    font-size: 12px;
    line-height: 1.8;
  }

  .virtual-faq-answer {
    font-size: 12px;
  }

  .virtual-handbook-card,
  .virtual-book-card {
    padding: 22px;
    border-radius: 24px;
  }

  .virtual-handbook-card .btn,
  .virtual-book-card__actions .btn {
    width: 100%;
  }

  .virtual-book-card__actions {
    display: grid;
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .virtual-hero__inner {
    padding-block: 30px;
  }

  .virtual-booking-preview__top {
    flex-direction: column;
    align-items: flex-start;
  }

  .virtual-booking-preview__time {
    align-items: flex-start;
  }

  .virtual-faq-side {
    margin-inline: -16px;
    padding-inline: 16px;
  }

  .virtual-handbook-card,
  .virtual-book-card {
    padding: 18px;
  }
}

@media (max-width: 760px) {
  .calendar-year {
    grid-template-columns: 1fr;
  }

  .calendar-legend {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 6px;
  }

  .calendar-legend__item {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .calendar-document-card {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .calendar-document-card__icon {
    margin-inline: auto;
  }

  .calendar-document-card a {
    width: 100%;
    justify-content: center;
  }
}

/* =========================================================
   INTRO PAGE - MOBILE ONLY FIX
   لا يؤثر على الكمبيوتر
   ========================================================= */

@media (max-width: 760px) {
  html,
  body,
  .kafu-shell,
  .kafu-main {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .intro-section {
    overflow-x: hidden;
  }

  .intro-section .container {
    max-width: 100%;
    overflow-x: hidden;
  }

  .intro-stage {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .intro-stage:not(.is-active) {
    display: none !important;
  }

  .intro-steps {
    display: flex;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 8px;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .intro-steps::-webkit-scrollbar {
    display: none;
  }

  .intro-step {
    flex: 0 0 auto;
    white-space: nowrap;
    min-width: max-content;
  }

  .intro-reader-card,
  .intro-quiz-card,
  .intro-rating-card,
  .intro-cert-form,
  .intro-certificate-wrap,
  .intro-certificate {
    width: 100%;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden;
  }

  .intro-slide,
  .intro-slide--image,
  .intro-slide img,
  #introSlideImage {
    width: 100%;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto;
    object-fit: contain;
  }

  .intro-reader-card__foot,
  .intro-quiz-actions,
  .intro-rating-actions,
  .intro-cert-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .intro-nav-btn,
  .intro-primary-btn,
  .intro-secondary-btn {
    width: 100%;
    justify-content: center;
  }

  #stageQuiz,
  #stageQuiz .intro-quiz-card,
  #stageQuiz .intro-question,
  #stageQuiz .intro-options,
  #stageQuiz .intro-option {
    width: 100%;
    max-width: 100%;
    min-width: 0 !important;
    overflow-x: hidden;
  }

  #stageQuiz .intro-question h3,
  #stageQuiz .intro-option span,
  #stageQuiz .intro-result {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.9;
  }

  #stageQuiz .intro-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
    gap: 8px;
  }

  #stageQuiz .intro-result-next-btn {
    width: 100%;
    margin-top: 12px;
  }

  .intro-cert-input {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .intro-cert-input input,
  .intro-cert-input button {
    width: 100%;
    min-width: 0;
  }

  .intro-certificate {
    padding: 22px 16px !important;
    border-radius: 22px;
  }

  .intro-certificate__top,
  .intro-certificate__foot {
    display: grid !important;
    grid-template-columns: 1fr;
    text-align: center;
    gap: 14px;
  }

  .intro-certificate__logo,
  .intro-certificate__seal {
    width: 100%;
    max-width: 150px !important;
    height: auto !important;
    margin-inline: auto;
    flex: none !important;
  }

  .intro-certificate__logo img,
  .intro-certificate__seal img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }

  .intro-certificate__body,
  .intro-certificate__desc,
  .intro-certificate__slogan,
  .intro-certificate__name,
  .intro-certificate__meta {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .intro-certificate__name {
    font-size: clamp(22px, 7vw, 34px);
    line-height: 1.7;
  }

  .intro-certificate__body h2 {
    font-size: clamp(20px, 6vw, 30px);
    line-height: 1.6;
  }
}

@media (max-width: 420px) {
  .intro-certificate {
    padding: 18px 12px !important;
  }

  .intro-certificate__logo,
  .intro-certificate__seal {
    max-width: 120px !important;
  }
}

.kafu-footer__bottom--simple {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.kafu-footer__main-credit {
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.72);
}

.kafu-footer__main-credit span {
  font-size: 13px;
  font-weight: 600;
}

.kafu-footer__main-credit .footer-separator {
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.42);
  margin-inline: 4px;
}

.kafu-footer__dev-credit {
  margin: 0;
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.42);
  direction: ltr;
  letter-spacing: 0.2px;
}

@media (max-width: 640px) {
  .kafu-footer__bottom--simple {
    justify-content: center;
    text-align: center;
  }

  .kafu-footer__main-credit,
  .kafu-footer__dev-credit {
    width: 100%;
  }
}

/* =========================================================
   404 PAGE
   ========================================================= */

.kafu-error-page {
  min-height: 68vh;
  display: flex;
  align-items: center;
}

.kafu-error-card {
  max-width: 720px;
  margin-inline: auto;
  padding: 54px 34px;
  border-radius: 34px;
  text-align: center;
  background:
    radial-gradient(
      circle at top right,
      rgba(201, 164, 55, 0.16),
      transparent 36%
    ),
    rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: 0 26px 70px rgba(31, 42, 55, 0.08);
}

.kafu-error-code {
  font-size: clamp(72px, 14vw, 140px);
  font-weight: 900;
  line-height: 1;
  color: var(--soft-gold-6);
  letter-spacing: -4px;
  margin-bottom: 18px;
}

.kafu-error-card h1 {
  margin: 14px 0 12px;
  font-size: clamp(26px, 4vw, 42px);
  color: var(--navy);
}

.kafu-error-card p {
  max-width: 520px;
  margin: 0 auto 28px;
  font-size: 14px;
  line-height: 2;
  color: rgba(31, 42, 55, 0.68);
}

.kafu-error-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

body[data-theme="blue"] .kafu-error-card {
  background:
    radial-gradient(
      circle at top right,
      rgba(43, 170, 226, 0.16),
      transparent 36%
    ),
    rgba(255, 255, 255, 0.94);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-error-code {
  color: var(--blue);
}

@media (max-width: 640px) {
  .kafu-error-page {
    min-height: 60vh;
  }

  .kafu-error-card {
    padding: 42px 22px;
    border-radius: 26px;
  }

  .kafu-error-actions .btn {
    width: 100%;
  }
}

.kafu-pulse-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.kafu-add-thanks-btn {
  min-height: 40px;
  padding: 9px 15px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.24);
  font-size: 12px;
  font-weight: 900;
  transition: 0.22s ease;
}

.kafu-add-thanks-btn:hover {
  background: rgba(201, 164, 55, 0.16);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.36);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(201, 164, 55, 0.12);
}

.kafu-add-thanks-btn__icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(201, 164, 55, 0.18);
  color: var(--kafu-gold-dk);
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
}

.kafu-pulse-note {
  margin-top: 8px;
  color: rgba(31, 42, 55, 0.58);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.8;
}

body[data-theme="blue"] .kafu-add-thanks-btn {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-add-thanks-btn:hover {
  background: rgba(43, 170, 226, 0.16);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.34);
  box-shadow: 0 10px 22px rgba(21, 80, 138, 0.1);
}

body[data-theme="blue"] .kafu-add-thanks-btn__icon {
  background: rgba(43, 170, 226, 0.16);
  color: var(--navy);
}

@media (max-width: 760px) {
  .kafu-pulse-actions {
    justify-content: center;
  }

  .kafu-pulse-actions .section-more-link,
  .kafu-add-thanks-btn {
    width: 100%;
  }

  .kafu-pulse-note {
    text-align: center;
  }
}

/* =========================================================
   KAFU PULSE - HOME SLIDER
   ========================================================= */

.kafu-add-thanks-small-btn {
  width: fit-content;
  min-height: 32px;
  margin-top: 12px;
  padding: 6px 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-decoration: none;
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.24);
  font-size: 11px;
  font-weight: 900;
  transition: 0.2s ease;
}

.kafu-add-thanks-small-btn span {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(201, 164, 55, 0.18);
  color: var(--kafu-gold-dk);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}

.kafu-add-thanks-small-btn:hover {
  background: rgba(201, 164, 55, 0.16);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.34);
  transform: translateY(-1px);
}

.kafu-pulse-slider {
  overflow: hidden;
}

.kafu-pulse-section .kafu-pulse-track {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 4px 2px 14px;
  scrollbar-width: none;
  direction: ltr;
}

.kafu-pulse-section .kafu-pulse-track::-webkit-scrollbar {
  display: none;
}

.kafu-pulse-section .story-card {
  display: flex;
  flex-direction: column;
  flex: 0 0 calc((100% - 28px) / 3);
  scroll-snap-align: start;
  min-width: 0;
  min-height: 230px;
  padding: 16px;
  border-radius: 20px;
  direction: rtl;
}

.kafu-pulse-section .story-card__flow {
  flex: 1;
  display: flow-root;
  margin-bottom: 14px;
}

.kafu-pulse-section .story-card__author {
  margin-top: auto;
  padding-top: 12px;
  clear: both;
}

.kafu-pulse-section .story-card__thumb {
  float: left;
  width: 104px;
  height: 82px;
  margin: 0 0 10px 14px;
  border-radius: 17px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(201, 164, 55, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
}

.kafu-pulse-section .story-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.kafu-pulse-section .story-card__title {
  margin: 0 0 7px;
  color: var(--navy);
  font-size: 12.5px;
  font-weight: 900;
  line-height: 1.75;
}

.kafu-pulse-section .story-card__text {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.9;
  color: rgba(31, 42, 55, 0.7);
}

.kafu-pulse-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.kafu-pulse-more-link {
  min-height: 36px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(201, 164, 55, 0.18);
  box-shadow: 0 8px 18px rgba(31, 42, 55, 0.05);
}

body[data-theme="blue"] .kafu-pulse-more-link {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(43, 170, 226, 0.2);
  color: var(--navy);
  box-shadow: 0 8px 18px rgba(21, 80, 138, 0.06);
}

body[data-theme="blue"] .kafu-pulse-more-link:hover {
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.34);
  color: var(--navy);
}

body[data-theme="blue"] .kafu-pulse-more-link span {
  color: var(--blue);
}
.kafu-pulse-more-link:hover {
  background: rgba(201, 164, 55, 0.1);
  border-color: rgba(201, 164, 55, 0.3);
}

body[data-theme="blue"] .kafu-add-thanks-small-btn {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.24);
}

body[data-theme="blue"] .kafu-add-thanks-small-btn span {
  background: rgba(43, 170, 226, 0.16);
  color: var(--navy);
}

body[data-theme="blue"] .kafu-add-thanks-small-btn:hover {
  background: rgba(43, 170, 226, 0.16);
  border-color: rgba(43, 170, 226, 0.34);
}

body[data-theme="blue"] .kafu-pulse-section .story-card__thumb {
  border-color: rgba(43, 170, 226, 0.18);
}

@media (max-width: 980px) {
  .kafu-pulse-section .story-card {
    flex-basis: calc((100% - 14px) / 2);
  }
}

@media (max-width: 640px) {
  .kafu-pulse-section .story-card {
    flex-basis: 82%;
  }

  .kafu-pulse-section .kafu-pulse-track {
    gap: 12px;
  }

  .kafu-pulse-footer {
    justify-content: center;
  }

  .kafu-pulse-more-link {
    width: 100%;
    justify-content: center;
  }
}

.kafu-pulse-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 8px;
}

.kafu-pulse-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.24);
  cursor: pointer;
  transition: 0.2s ease;
}

.kafu-pulse-dot.is-active {
  width: 22px;
  background: var(--kafu-gold);
}

.kafu-pulse-dot:hover {
  background: var(--kafu-gold);
}

body[data-theme="blue"] .kafu-pulse-dot {
  background: rgba(43, 170, 226, 0.24);
}

body[data-theme="blue"] .kafu-pulse-dot.is-active,
body[data-theme="blue"] .kafu-pulse-dot:hover {
  background: var(--blue);
}

/* =========================================================
   THANKS CREATE PAGE
   ========================================================= */

.thanks-page-head .page-head-icon-badge span {
  background: rgba(201, 164, 55, 0.14);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.22);
}
body[data-theme="blue"] .thanks-page-head .page-head-icon-badge span {
  background: rgba(43, 170, 226, 0.12);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.22);
}
.kafu-thanks-section {
  background:
    radial-gradient(
      circle at top right,
      rgba(201, 164, 55, 0.06),
      transparent 34%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(43, 170, 226, 0.06),
      transparent 32%
    );
}
body[data-theme="blue"] .kafu-thanks-section {
  background:
    radial-gradient(
      circle at top right,
      rgba(43, 170, 226, 0.08),
      transparent 34%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(21, 80, 138, 0.05),
      transparent 32%
    );
}
.kafu-thanks-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}
.kafu-thanks-form-card,
.kafu-thanks-side-card {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(226, 236, 244, 0.95);
  border-radius: 28px;
  box-shadow: 0 18px 45px rgba(10, 38, 71, 0.08);
}
.kafu-thanks-form-card {
  padding: 26px;
}
.kafu-form-section-title {
  margin-bottom: 16px;
  color: var(--navy);
  font-size: 14px;
  font-weight: 900;
}
.kafu-form-section-title--space {
  margin-top: 28px;
}
.kafu-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.kafu-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.kafu-field--full {
  grid-column: 1 / -1;
}
.kafu-field label {
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
}
.kafu-field label span {
  color: #b42318;
}
.kafu-field input,
.kafu-field textarea {
  width: 100%;
  border: 1px solid rgba(226, 236, 244, 1);
  border-radius: 16px;
  background: #fff;
  color: #0a1a2c;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  outline: none;
  transition: 0.18s ease;
}
.kafu-field input {
  min-height: 44px;
  padding: 0 14px;
}
.kafu-field textarea {
  padding: 13px 14px;
  resize: vertical;
  line-height: 1.9;
}
.kafu-field input:focus,
.kafu-field textarea:focus {
  border-color: rgba(201, 164, 55, 0.42);
  box-shadow: 0 0 0 4px rgba(201, 164, 55, 0.1);
}
body[data-theme="blue"] .kafu-field input:focus,
body[data-theme="blue"] .kafu-field textarea:focus {
  border-color: rgba(43, 170, 226, 0.42);
  box-shadow: 0 0 0 4px rgba(43, 170, 226, 0.1);
}
.kafu-thanks-alert {
  margin-top: 22px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.2);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.9;
}
body[data-theme="blue"] .kafu-thanks-alert {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.22);
}
.kafu-thanks-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}
.kafu-thanks-submit-btn,
.kafu-thanks-back-btn {
  min-height: 42px;
  padding: 9px 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-family: inherit;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  transition: 0.2s ease;
}
.kafu-thanks-submit-btn {
  border: 1px solid rgba(201, 164, 55, 0.3);
  background: rgba(201, 164, 55, 0.14);
  color: var(--kafu-gold-dk);
}
.kafu-thanks-submit-btn:hover {
  background: rgba(201, 164, 55, 0.2);
  border-color: rgba(201, 164, 55, 0.42);
  transform: translateY(-1px);
}
body[data-theme="blue"] .kafu-thanks-submit-btn {
  background: rgba(43, 170, 226, 0.12);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.28);
}
body[data-theme="blue"] .kafu-thanks-submit-btn:hover {
  background: rgba(43, 170, 226, 0.18);
  border-color: rgba(43, 170, 226, 0.38);
}
.kafu-thanks-back-btn {
  border: 1px solid rgba(226, 236, 244, 1);
  background: #fff;
  color: var(--navy);
}
.kafu-thanks-back-btn:hover {
  background: #f8fbfe;
  transform: translateY(-1px);
}
.kafu-thanks-side {
  display: grid;
  gap: 16px;
}
.kafu-thanks-guide {
  position: sticky;
  top: 100px;
}

.kafu-thanks-guide__card {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border-radius: 28px;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.96),
    rgba(255, 252, 242, 0.9)
  );
  border: 1px solid rgba(201, 164, 55, 0.22);
  box-shadow: 0 18px 45px rgba(10, 38, 71, 0.08);
}

.kafu-thanks-guide__card::before {
  content: "";
  position: absolute;
  inset-block-start: -60px;
  inset-inline-end: -60px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(201, 164, 55, 0.12);
}

.kafu-thanks-guide__card::after {
  content: "";
  position: absolute;
  inset-block-end: -45px;
  inset-inline-start: -45px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(43, 170, 226, 0.07);
}

.kafu-thanks-guide__label {
  position: relative;
  z-index: 1;
  width: fit-content;
  min-height: 28px;
  padding: 5px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  background: rgba(201, 164, 55, 0.12);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.22);
  font-size: 11px;
  font-weight: 900;
}

.kafu-thanks-guide__card h3 {
  position: relative;
  z-index: 1;
  margin: 14px 0 8px;
  color: var(--navy);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.6;
}

.kafu-thanks-guide__intro {
  position: relative;
  z-index: 1;
  margin: 0 0 18px;
  color: rgba(31, 42, 55, 0.68);
  font-size: 12px;
  font-weight: 700;
  line-height: 2;
}

.kafu-thanks-guide__list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
}

.kafu-thanks-guide__item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  padding: 13px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(226, 236, 244, 0.85);
}

.kafu-thanks-guide__item > span {
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(201, 164, 55, 0.14);
  color: var(--kafu-gold-dk);
  font-size: 13px;
  font-weight: 900;
}

.kafu-thanks-guide__item strong {
  display: block;
  margin-bottom: 3px;
  color: var(--navy);
  font-size: 12.5px;
  font-weight: 900;
}

.kafu-thanks-guide__item p {
  margin: 0;
  color: rgba(31, 42, 55, 0.65);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.9;
}

/* Blue Theme */
body[data-theme="blue"] .kafu-thanks-guide__card {
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.96),
    rgba(243, 250, 255, 0.92)
  );
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .kafu-thanks-guide__card::before {
  background: rgba(43, 170, 226, 0.12);
}

body[data-theme="blue"] .kafu-thanks-guide__label,
body[data-theme="blue"] .kafu-thanks-guide__item > span {
  background: rgba(43, 170, 226, 0.12);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.22);
}

@media (max-width: 980px) {
  .kafu-thanks-guide {
    position: static;
  }
}

@media (max-width: 640px) {
  .kafu-thanks-guide__card {
    padding: 20px;
    border-radius: 22px;
  }
}
.kafu-hidden-field {
  position: absolute;
  inset-inline-start: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
@media (max-width: 980px) {
  .kafu-thanks-layout {
    grid-template-columns: 1fr;
  }
  .kafu-thanks-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .kafu-thanks-form-card {
    padding: 20px;
    border-radius: 22px;
  }
  .kafu-form-grid,
  .kafu-thanks-side {
    grid-template-columns: 1fr;
  }
  .kafu-thanks-actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .kafu-thanks-submit-btn,
  .kafu-thanks-back-btn {
    width: 100%;
  }
}

/* =========================================================
   FLASH MESSAGES
   ========================================================= */

.kafu-flash {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 18px;
  margin-bottom: 18px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid transparent;
  background: #fff;
  box-shadow: 0 10px 24px rgba(10, 38, 71, 0.06);
}

.kafu-flash .flash-icon {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 900;
  flex-shrink: 0;
}

.kafu-flash strong {
  display: block;
  font-size: 12.5px;
  font-weight: 900;
  margin-bottom: 2px;
}

.kafu-flash p {
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.9;
  color: inherit;
}

.kafu-flash.success {
  background: rgba(72, 173, 72, 0.1);
  color: #207a32;
  border-color: rgba(72, 173, 72, 0.24);
}

.kafu-flash.success .flash-icon {
  background: rgba(72, 173, 72, 0.22);
  color: #207a32;
}

.kafu-flash.error {
  background: #fff1f1;
  color: #b42318;
  border-color: #ffd7d7;
}

.kafu-flash.error .flash-icon {
  background: #ffd7d7;
  color: #b42318;
}

.kafu-flash.warning {
  background: rgba(201, 164, 55, 0.12);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.26);
}

.kafu-flash.warning .flash-icon {
  background: rgba(201, 164, 55, 0.22);
  color: var(--kafu-gold-dk);
}

.kafu-flash.info {
  background: rgba(43, 170, 226, 0.1);
  border-color: rgba(43, 170, 226, 0.24);
  color: var(--navy);
}

.kafu-flash.info .flash-icon {
  background: rgba(43, 170, 226, 0.18);
  color: var(--navy);
}

/* =========================================================
   KAFU NEWS PULSE
   ========================================================= */

.kafu-news-pulse-section {
  background:
    radial-gradient(
      circle at top right,
      rgba(43, 170, 226, 0.07),
      transparent 34%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(201, 164, 55, 0.06),
      transparent 32%
    );
}

.kafu-news-track {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 4px 2px 14px;
  scrollbar-width: none;
  direction: ltr;
}

.kafu-news-track .story-card:first-child {
  margin-left: auto;
}

.kafu-news-track::-webkit-scrollbar {
  display: none;
}

.kafu-news-pulse-section .story-card {
  display: flex;
  flex-direction: column;
  flex: 0 0 calc((100% - 28px) / 3);
  scroll-snap-align: start;
  min-width: 0;
  min-height: 230px;
  padding: 16px;
  border-radius: 20px;
  direction: rtl;
}

.kafu-news-pulse-section .story-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.story-card__date {
  color: rgba(31, 42, 55, 0.52);
  font-size: 10.5px;
  font-weight: 900;
  white-space: nowrap;
}

.kafu-news-pulse-section .story-card__flow {
  flex: 1;
  display: flow-root;
  margin-bottom: 14px;
}

.kafu-news-pulse-section .story-card__thumb {
  float: left;
  width: 104px;
  height: 82px;
  margin: 0 0 10px 14px;
  border-radius: 17px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(43, 170, 226, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
}

.kafu-news-pulse-section .story-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.kafu-news-pulse-section .story-card__title {
  margin: 0 0 7px;
  color: var(--navy);
  font-size: 12.5px;
  font-weight: 900;
  line-height: 1.75;
}

.kafu-news-pulse-section .story-card__text {
  margin: 0;
  font-size: 11.5px;
  line-height: 1.9;
  color: rgba(31, 42, 55, 0.7);
}

.kafu-news-pulse-section .story-card__author {
  clear: both;
  margin-top: auto;
  padding-top: 12px;
}

.kafu-news-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 8px;
}

.kafu-news-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(43, 170, 226, 0.24);
  cursor: pointer;
  transition: 0.2s ease;
}

.kafu-news-dot.is-active {
  width: 22px;
  background: var(--blue);
}

.kafu-news-dot:hover {
  background: var(--blue);
}

body[data-theme="gold"] .kafu-news-dot {
  background: rgba(201, 164, 55, 0.24);
}

body[data-theme="gold"] .kafu-news-dot.is-active,
body[data-theme="gold"] .kafu-news-dot:hover {
  background: var(--kafu-gold);
}

@media (max-width: 980px) {
  .kafu-news-pulse-section .story-card {
    flex-basis: calc((100% - 14px) / 2);
  }
}

@media (max-width: 640px) {
  .kafu-news-pulse-section .story-card {
    flex-basis: 82%;
  }

  .kafu-news-track {
    gap: 12px;
  }
}

.kafu-pulse-track .story-card:first-child {
  margin-left: auto;
}

.kafu-news-pulse-section .story-card__bottom {
  clear: both;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(226, 236, 244, 0.95);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.kafu-news-pulse-section .story-card__bottom .story-card__author {
  clear: none;
  margin-top: 0;
  padding-top: 0;
  min-width: 0;
  flex: 1;
  border-top: 0;
}

.kafu-news-pulse-section .story-card__action {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
  flex-shrink: 0;
}

.kafu-news-pulse-section .story-card__read-more {
  min-height: 30px;
  padding: 6px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none;
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border: 1px solid rgba(43, 170, 226, 0.22);
  font-size: 10.5px;
  font-weight: 900;
  white-space: nowrap;
  transition: 0.2s ease;
}

.kafu-news-pulse-section .story-card__read-more:hover {
  background: rgba(43, 170, 226, 0.16);
  border-color: rgba(43, 170, 226, 0.34);
  color: var(--navy);
  transform: translateY(-1px);
}

body[data-theme="gold"] .kafu-news-pulse-section .story-card__read-more {
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.22);
}

body[data-theme="gold"] .kafu-news-pulse-section .story-card__read-more:hover {
  background: rgba(201, 164, 55, 0.16);
  border-color: rgba(201, 164, 55, 0.34);
  color: var(--kafu-gold-dk);
}

@media (max-width: 420px) {
  .kafu-news-pulse-section .story-card__bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .kafu-news-pulse-section .story-card__action,
  .kafu-news-pulse-section .story-card__read-more {
    width: 100%;
  }

  .kafu-news-pulse-section .story-card__read-more {
    justify-content: center;
  }
}

.stories-section .story-card {
  display: flex;
  flex-direction: column;
}

.stories-section .story-card__flow {
  flex: 1;
  display: flow-root;
  margin-bottom: 14px;
}

.stories-section .story-card__thumb {
  float: left;
  width: 104px;
  height: 82px;
  margin: 0 0 10px 14px;
  border-radius: 17px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(226, 236, 244, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
}

.stories-section .story-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.stories-section .story-card__date {
  color: rgba(31, 42, 55, 0.52);
  font-size: 10.5px;
  font-weight: 900;
  white-space: nowrap;
}

.stories-section .story-card__author {
  clear: both;
  margin-top: auto;
}

.stories-grid .story-card[hidden] {
  display: none !important;
}

/* =========================================================
   STORIES PAGE CARD BOTTOM / READ MORE
   ========================================================= */

.stories-section .story-card {
  display: flex;
  flex-direction: column;
}

.stories-section .story-card__flow {
  flex: 1;
  display: flow-root;
  margin-bottom: 14px;
}

.stories-section .story-card__bottom {
  clear: both;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(226, 236, 244, 0.95);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.stories-section .story-card__bottom .story-card__author {
  clear: none;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  min-width: 0;
  flex: 1;
}

.stories-section .story-card__action {
  margin-top: 0;
  display: flex;
  justify-content: flex-end;
  flex-shrink: 0;
}

.stories-section .story-card__read-more {
  min-height: 30px;
  padding: 6px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none;
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border: 1px solid rgba(43, 170, 226, 0.22);
  font-size: 10.5px;
  font-weight: 900;
  white-space: nowrap;
  transition: 0.2s ease;
}

.stories-section .story-card__read-more:hover {
  background: rgba(43, 170, 226, 0.16);
  border-color: rgba(43, 170, 226, 0.34);
  color: var(--navy);
  transform: translateY(-1px);
}

body[data-theme="gold"] .stories-section .story-card__read-more {
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.22);
}

body[data-theme="gold"] .stories-section .story-card__read-more:hover {
  background: rgba(201, 164, 55, 0.16);
  border-color: rgba(201, 164, 55, 0.34);
  color: var(--kafu-gold-dk);
}

@media (max-width: 420px) {
  .stories-section .story-card__bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .stories-section .story-card__action,
  .stories-section .story-card__read-more {
    width: 100%;
  }

  .stories-section .story-card__read-more {
    justify-content: center;
  }
}

/* Pagination */

.kafu-pagination {
  margin-top: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.kafu-pagination__pages {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex-wrap: wrap;
}

.kafu-pagination__btn,
.kafu-pagination__page {
  min-height: 34px;
  padding: 7px 13px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #fff;
  color: var(--navy);
  border: 1px solid rgba(226, 236, 244, 0.95);
  font-size: 12px;
  font-weight: 900;
  transition: 0.2s ease;
}

.kafu-pagination__page {
  min-width: 34px;
  padding-inline: 10px;
}

.kafu-pagination__btn:hover,
.kafu-pagination__page:hover {
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.26);
  transform: translateY(-1px);
}

.kafu-pagination__page.is-active {
  background: rgba(201, 164, 55, 0.14);
  color: var(--kafu-gold-dk);
  border-color: rgba(201, 164, 55, 0.3);
}

.kafu-pagination__btn.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
  background: #f6f8fa;
  color: rgba(31, 42, 55, 0.5);
}

body[data-theme="blue"] .kafu-pagination__btn:hover,
body[data-theme="blue"] .kafu-pagination__page:hover,
body[data-theme="blue"] .kafu-pagination__page.is-active {
  background: rgba(43, 170, 226, 0.12);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.26);
}

/* =========================================================
   KAFU POST SHOW
   ========================================================= */

.kafu-post-show-page {
  background:
    radial-gradient(
      circle at top right,
      rgba(201, 164, 55, 0.07),
      transparent 34%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(43, 170, 226, 0.06),
      transparent 32%
    );
}

.kafu-post-show-layout {
  max-width: 920px;
  margin-inline: auto;
}

.kafu-post-show-card {
  overflow: hidden;
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(226, 236, 244, 0.95);
  box-shadow: 0 20px 52px rgba(10, 38, 71, 0.09);
}

.kafu-post-show-head {
  padding: 34px 36px 24px;
}

.kafu-post-show-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.kafu-post-show-type {
  min-height: 30px;
  padding: 6px 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  background: rgba(201, 164, 55, 0.12);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.24);
  font-size: 11px;
  font-weight: 900;
}

.kafu-post-show-meta time {
  color: rgba(31, 42, 55, 0.55);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.kafu-post-show-head h1 {
  margin: 0;
  color: var(--navy);
  font-size: 30px;
  font-weight: 900;
  line-height: 1.7;
}

.kafu-post-show-summary {
  margin: 14px 0 0;
  color: rgba(31, 42, 55, 0.68);
  font-size: 14px;
  font-weight: 700;
  line-height: 2;
}

.kafu-post-show-image {
  width: calc(100% - 72px);
  height: 360px;
  margin: 0 36px 26px;
  border-radius: 26px;
  overflow: hidden;
  background: #f4f8fb;
  border: 1px solid rgba(226, 236, 244, 0.95);
}

.kafu-post-show-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.kafu-post-show-content {
  padding: 0 36px 34px;
  color: rgba(31, 42, 55, 0.82);
  font-size: 14px;
  font-weight: 700;
  line-height: 2.25;
}

.kafu-post-show-footer {
  padding: 20px 36px;
  border-top: 1px solid rgba(226, 236, 244, 0.95);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: rgba(248, 251, 254, 0.7);
}

.kafu-post-show-footer .story-card__author {
  margin: 0;
  padding: 0;
  border: 0;
}

.kafu-post-show-back {
  min-height: 34px;
  padding: 7px 14px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-decoration: none;
  background: rgba(201, 164, 55, 0.1);
  color: var(--kafu-gold-dk);
  border: 1px solid rgba(201, 164, 55, 0.24);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
  transition: 0.2s ease;
}

.kafu-post-show-back:hover {
  background: rgba(201, 164, 55, 0.16);
  border-color: rgba(201, 164, 55, 0.34);
  color: var(--kafu-gold-dk);
  transform: translateY(-1px);
}

/* Blue Theme */
body[data-theme="blue"] .kafu-post-show-page {
  background:
    radial-gradient(
      circle at top right,
      rgba(43, 170, 226, 0.08),
      transparent 34%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(21, 80, 138, 0.05),
      transparent 32%
    );
}

body[data-theme="blue"] .kafu-post-show-type,
body[data-theme="blue"] .kafu-post-show-back {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.24);
}

body[data-theme="blue"] .kafu-post-show-back:hover {
  background: rgba(43, 170, 226, 0.16);
  border-color: rgba(43, 170, 226, 0.34);
  color: var(--navy);
}

@media (max-width: 760px) {
  .kafu-post-show-head {
    padding: 26px 22px 20px;
  }

  .kafu-post-show-head h1 {
    font-size: 22px;
  }

  .kafu-post-show-image {
    width: calc(100% - 44px);
    height: 230px;
    margin: 0 22px 22px;
    border-radius: 22px;
  }

  .kafu-post-show-content {
    padding: 0 22px 28px;
    font-size: 13px;
  }

  .kafu-post-show-footer {
    padding: 18px 22px;
    align-items: flex-start;
    flex-direction: column;
  }

  .kafu-post-show-back {
    width: 100%;
  }
}

.offers-grid .offer-card[hidden] {
  display: none !important;
}

.offers-empty-static {
  grid-column: 1 / -1;
  padding: 28px;
  border-radius: 24px;
  text-align: center;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(226, 236, 244, 0.95);
  box-shadow: 0 12px 28px rgba(10, 38, 71, 0.055);
}

.offers-empty-static strong {
  display: block;
  color: var(--navy);
  font-size: 15px;
  font-weight: 900;
}

.offers-empty-static p {
  margin: 8px 0 0;
  color: rgba(31, 42, 55, 0.65);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.9;
}

.offers-section .story-card {
  display: flex;
  flex-direction: column;
}

.offers-section .story-card__flow {
  flex: 1;
  display: flow-root;
  margin-bottom: 14px;
}

.offers-section .story-card__thumb {
  float: left;
  width: 104px;
  height: 82px;
  margin: 0 0 10px 14px;
  border-radius: 17px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(226, 236, 244, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3px;
}

.offers-section .story-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.offers-section .story-card__author {
  clear: both;
  margin-top: auto;
}

.offers-section .story-card__thumb--offer {
  position: relative;
}

.offers-section .story-card__head {
  align-items: center;
}

.offers-section .story-card__discount-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 12px;
  border-radius: 999px;
  background: #fff1f2;
  color: #be123c;
  border: 1px solid #fecdd3;
  font-size: 11px;
  font-weight: 900;
  box-shadow: none;
}

.offers-section .story-card__badges {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.offers-section .story-card__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

.offers-section .story-card__status--active {
  color: #176b35;
  background: rgba(72, 173, 72, 0.13);
  border: 1px solid rgba(72, 173, 72, 0.22);
}

.offers-section .story-card__status--expired {
  color: #9b1c1c;
  background: rgba(220, 38, 38, 0.1);
  border: 1px solid rgba(220, 38, 38, 0.18);
}

.story-card__flow .story-card__title {
  margin: 0 0 7px;
  color: var(--navy);
  font-size: 12.5px;
  font-weight: 900;
  line-height: 1.75;
}

.offers-section .story-card__validity {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 4px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #ecfdf3;
  color: #027a48;
  border-color: #d1fadf;
  font-size: 11px;
  font-weight: 900;
}

figure.kafu-post-show-image--newspaper {
  float: left;
  width: 280px;
  height: auto;
  margin: 6px 0 18px 24px;
  padding: 0;
  border-radius: 20px;
  overflow: hidden;
  background: #f8fbfe;
  border: 1px solid rgba(226, 236, 244, 0.95);
}

figure.kafu-post-show-image--newspaper img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 20px;
}
.kafu-post-show-content--newspaper {
  display: flow-root;
}

.kafu-post-show-footer {
  clear: both;
}

@media (max-width: 700px) {
  figure.kafu-post-show-image--newspaper {
    float: none;
    width: 100%;
    margin: 0 0 18px;
  }
}

.kafu-nav__dropdown-title {
  padding: 9px 14px 5px;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 900;
  pointer-events: none;
  opacity: 0.9;
}

.kafu-nav__dropdown-title:not(:first-child) {
  margin-top: 6px;
  border-top: 1px solid rgba(201, 164, 55, 0.14);
}
.kafu-nav__dropdown-title {
  padding: 9px 14px 5px;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 900;
  pointer-events: none;
  opacity: 0.95;
}

.kafu-nav__dropdown-title:not(:first-child) {
  margin-top: 6px;
  border-top: 1px solid rgba(201, 164, 55, 0.14);
}

.kafu-mobile-nav__sub-title {
  margin: 10px 0 4px;
  padding: 8px 12px 4px;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 900;
  border-top: 1px solid rgba(201, 164, 55, 0.14);
}

.kafu-mobile-nav__sub-title:first-of-type {
  margin-top: 4px;
  border-top: 0;
}

body[data-theme="blue"] .kafu-nav__dropdown-title,
body[data-theme="blue"] .kafu-mobile-nav__sub-title {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-nav__dropdown-title:not(:first-child),
body[data-theme="blue"] .kafu-mobile-nav__sub-title {
  border-color: rgba(43, 170, 226, 0.18);
}

.kafu-nav__dropdown a.is-disabled {
  color: #8d98a6;
  cursor: not-allowed;
  pointer-events: none;
}

body[data-theme="blue"] .kafu-nav__dropdown a.is-disabled {
  color: #7b90a9;
}

body[data-theme="blue"] .kafu-mobile-nav__group-title {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-mobile-nav__sub-title {
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .hero--dynamic .hero__eyebrow {
  color: var(--navy);
  background: rgba(255, 255, 255, 0.46);
  border-color: rgba(43, 170, 226, 0.22);
}

body[data-theme="blue"] .hero--dynamic .hero__eyebrow::before {
  background: var(--sky);
  box-shadow: 0 0 0 6px rgba(43, 170, 226, 0.12);
}

/* =========================================================
   Kafu Star Archive
========================================================= */

.kafu-star-archive-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.kafu-star-filter-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  padding: 14px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.kafu-star-filter-form .field {
  min-width: 150px;
}

.kafu-star-filter-form label {
  display: block;
  margin-bottom: 6px;
  color: var(--hero-text-mid);
  font-size: 11px;
  font-weight: 800;
}

.kafu-star-filter-form select {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 14px;
  border: 1px solid rgba(201, 164, 55, 0.18);
  background: #fff;
  color: var(--hero-text-dark);
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
}

/* =========================================================
   Period Group
========================================================= */

.kafu-star-period {
  margin-top: 0px;
}

.kafu-star-period + .kafu-star-period {
  margin-top: 34px;
  padding-top: 34px;
  border-top: 1px solid rgba(201, 164, 55, 0.14);
}

.kafu-star-period__head {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.kafu-star-period__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 5px 13px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.18);
  font-size: 11px;
  font-weight: 900;
}

.kafu-star-period__head h3 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: clamp(20px, 2.4vw, 30px);
  line-height: 1.5;
}

.kafu-star-period__count {
  width: 76px;
  min-height: 62px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(201, 164, 55, 0.16);
  color: var(--soft-gold-6);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 900;
  box-shadow: var(--shadow-sm);
}

.kafu-star-period__count span {
  margin-top: 2px;
  color: var(--hero-text-mid);
  font-size: 10px;
  font-weight: 800;
}

/* =========================================================
   Cards Grid
========================================================= */

.kafu-star-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.kafu-star-card {
  position: relative;
  min-height: auto;
  padding: 18px;
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 16% 0%,
      rgba(232, 200, 99, 0.14),
      transparent 30%
    ),
    rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.kafu-star-card::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
}

.kafu-star-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}

.kafu-star-card__department {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  margin-bottom: 14px;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 10.5px;
  font-weight: 900;
}

.kafu-star-card__body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  text-align: right;
}

.kafu-star-card__photo {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border-radius: 22px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: 0 14px 28px rgba(156, 123, 30, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
}

.kafu-star-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kafu-star-card__photo span {
  color: var(--soft-gold-6);
  font-size: 28px;
  font-weight: 900;
}

.kafu-star-card__content {
  flex: 1;
  min-width: 0;
}

.kafu-star-card__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  color: var(--soft-gold-6);
  font-size: 10.5px;
  font-weight: 900;
}

.kafu-star-card__content h4 {
  margin: 6px 0 3px;
  color: var(--hero-text-dark);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.5;
}

.kafu-star-card__job {
  margin-bottom: 7px;
  color: var(--hero-text-mid);
  font-size: 11.5px;
  font-weight: 800;
}

.kafu-star-card__content p {
  margin: 0;
  color: var(--hero-text-mid);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.8;
}

/* =========================================================
   Empty State
========================================================= */

.kafu-star-empty {
  padding: 34px;
  border-radius: 28px;
  text-align: center;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
}

.kafu-star-empty div {
  width: 58px;
  height: 58px;
  margin: 0 auto 14px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  font-size: 24px;
}

.kafu-star-empty strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 16px;
  font-weight: 900;
}

.kafu-star-empty p {
  margin: 8px 0 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
}

/* =========================================================
   Blue Theme
========================================================= */

body[data-theme="blue"] .kafu-star-filter-form,
body[data-theme="blue"] .kafu-star-period__count,
body[data-theme="blue"] .kafu-star-card,
body[data-theme="blue"] .kafu-star-empty {
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-star-filter-form select {
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .kafu-star-period + .kafu-star-period {
  border-top-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .kafu-star-period__label,
body[data-theme="blue"] .kafu-star-card__department,
body[data-theme="blue"] .kafu-star-empty div {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .kafu-star-card {
  background:
    radial-gradient(
      circle at 16% 0%,
      rgba(43, 170, 226, 0.12),
      transparent 30%
    ),
    rgba(255, 255, 255, 0.86);
}

body[data-theme="blue"] .kafu-star-card::before {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .kafu-star-card__photo {
  border-color: rgba(43, 170, 226, 0.16);
  box-shadow: 0 14px 28px rgba(21, 80, 138, 0.08);
}

body[data-theme="blue"] .kafu-star-card__photo span,
body[data-theme="blue"] .kafu-star-card__badge,
body[data-theme="blue"] .kafu-star-period__count {
  color: var(--navy);
}

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1200px) {
  .kafu-star-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .kafu-star-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .kafu-star-archive-toolbar {
    align-items: stretch;
  }

  .kafu-star-filter-form {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .kafu-star-period__head {
    align-items: flex-start;
  }
}

@media (max-width: 600px) {
  .kafu-star-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .kafu-star-card__body {
    display: grid;
    gap: 12px;
  }

  .kafu-star-card__photo {
    width: 76px;
    height: 76px;
  }
}

.kafu-star-card.is-clickable {
  cursor: pointer;
}

.kafu-star-card.is-clickable .kafu-star-card__photo {
  position: relative;
}

.kafu-star-card.is-clickable .kafu-star-card__photo::after {
  content: "\F62C";
  font-family: "bootstrap-icons";
  position: absolute;
  inset-inline-end: 6px;
  bottom: 6px;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(17, 24, 39, 0.62);
  color: #fff;
  font-size: 12px;
}

.kafu-star-modal[hidden] {
  display: none;
}

.kafu-star-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
}

.kafu-star-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(8px);
}

.kafu-star-modal__dialog {
  position: relative;
  width: min(520px, 100%);
  max-height: calc(100vh - 48px);
  border-radius: 30px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
  animation: kafuStarModalIn 0.22s ease both;
}

.kafu-star-modal__close {
  position: absolute;
  top: 14px;
  inset-inline-start: 14px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--hero-text-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.kafu-star-modal__image {
  background: #f8fbfe;
}

.kafu-star-modal__image img {
  display: block;
  width: 100%;
  max-height: 68vh;
  object-fit: contain;
}

.kafu-star-modal__content {
  padding: 18px 22px 22px;
  text-align: center;
}

.kafu-star-modal__content span {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  font-size: 11px;
  font-weight: 900;
}

.kafu-star-modal__content h3 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 20px;
  font-weight: 900;
}

.kafu-star-modal__content p {
  margin: 6px 0 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 800;
}

body[data-theme="blue"] .kafu-star-modal__content span {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

@keyframes kafuStarModalIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* =========================================================
   Salaries Page - مسوغات ونماذج الرواتب
========================================================= */

.salaries-section {
  position: relative;
}

/* Header inside section */
.salaries-docs-head {
  margin-bottom: 24px;
}

.salaries-docs-head .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.salaries-docs-head .section-title {
  margin: 0;
}

.salaries-docs-head .section-body {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  line-height: 2;
}


/* Grid */
.salaries-docs-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}


/* Card */
.salary-service-card {
  position: relative;
  padding: 22px;
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 14% 0%,
      rgba(232, 200, 99, 0.13),
      transparent 34%
    ),
    rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.salary-service-card::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--soft-gold-4),
    var(--soft-gold-5),
    var(--soft-gold-6)
  );
}

.salary-service-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 164, 55, 0.28);
  box-shadow: var(--shadow-md);
}


/* Card Head */
.salary-service-card__head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.salary-service-card__icon {
  width: 50px;
  height: 50px;
  border-radius: 18px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex: 0 0 auto;
}

.salary-service-card__head span {
  display: inline-flex;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 4px;
}

.salary-service-card__head h3 {
  margin: 0;
  color: var(--hero-text-dark);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.5;
}


/* Sections */
.salary-service-card__section {
  position: relative;
  z-index: 1;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(201, 164, 55, 0.12);
}

.salary-service-card__section h4 {
  margin: 0 0 12px;
  color: var(--hero-text-dark);
  font-size: 13px;
  font-weight: 900;
  display: flex;
  align-items: center;
  gap: 8px;
}

.salary-service-card__section h4 i {
  color: var(--soft-gold-6);
}


/* Requirements List */
.salary-service-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.salary-service-card li {
  position: relative;
  padding-inline-start: 20px;
  color: var(--hero-text-mid);
  font-size: 12px;
  font-weight: 700;
  line-height: 2;
}

.salary-service-card li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 13px;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--soft-gold-5);
}


/* Forms Links */
.salary-forms-list {
  display: grid;
  gap: 10px;
}

.salary-form-link {
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(248, 251, 254, 0.86);
  border: 1px solid rgba(226, 236, 244, 0.95);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  color: var(--hero-text-dark);
  text-decoration: none;
  transition:
    transform var(--transition),
    border-color var(--transition),
    background var(--transition);
}

.salary-form-link i {
  color: var(--soft-gold-6);
  font-size: 18px;
}

.salary-form-link span {
  color: var(--hero-text-dark);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.6;
}

.salary-form-link small {
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.salary-form-link:not(.is-disabled):hover {
  transform: translateY(-2px);
  border-color: rgba(201, 164, 55, 0.28);
  background: #fff;
}

.salary-form-link.is-disabled {
  cursor: not-allowed;
  opacity: 0.72;
  pointer-events: none;
}


/* =========================================================
   Blue Theme
========================================================= */

body[data-theme="blue"] .salary-service-card {
  border-color: rgba(43, 170, 226, 0.16);
  background:
    radial-gradient(
      circle at 14% 0%,
      rgba(43, 170, 226, 0.12),
      transparent 34%
    ),
    rgba(255, 255, 255, 0.88);
}

body[data-theme="blue"] .salary-service-card::before {
  background: linear-gradient(90deg, var(--sky), var(--blue), var(--navy));
}

body[data-theme="blue"] .salary-service-card__icon {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .salary-service-card__head span,
body[data-theme="blue"] .salary-service-card__section h4 i,
body[data-theme="blue"] .salary-form-link i {
  color: var(--navy);
}

body[data-theme="blue"] .salary-service-card__section {
  border-top-color: rgba(43, 170, 226, 0.14);
}

body[data-theme="blue"] .salary-service-card li::before {
  background: var(--sky);
}

body[data-theme="blue"] .salary-form-link small {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}


/* =========================================================
   Responsive
========================================================= */

@media (max-width: 1024px) {
  .salaries-docs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .salaries-docs-grid {
    grid-template-columns: 1fr;
  }

  .salary-service-card {
    padding: 18px;
    border-radius: 24px;
  }

  .salary-service-card__head {
    align-items: flex-start;
  }

  .salary-service-card__icon {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    font-size: 20px;
  }

  .salary-form-link {
    grid-template-columns: auto 1fr;
  }

  .salary-form-link small {
    grid-column: 2;
  }
}


/* Compact Salary Cards */
.salary-service-card--compact {
  padding: 18px;
}

.salary-service-card--compact .salary-service-card__head {
  margin-bottom: 10px;
}

.salary-service-card--compact .salary-service-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  font-size: 20px;
}

.salary-service-card--compact .salary-service-card__head h3 {
  font-size: 16px;
}

.salary-service-card__desc {
  position: relative;
  z-index: 1;
  margin: 0 0 14px;
  color: var(--hero-text-mid);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.9;
}

.salary-card-actions {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 10px;
}

.salary-card-detail {
  border-radius: 16px;
  background: rgba(248, 251, 254, 0.86);
  border: 1px solid rgba(226, 236, 244, 0.95);
  overflow: hidden;
}

.salary-card-detail summary {
  min-height: 44px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--hero-text-dark);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.salary-card-detail summary::-webkit-details-marker {
  display: none;
}

.salary-card-detail summary::after {
  content: "\F282";
  font-family: "bootstrap-icons";
  margin-inline-start: auto;
  color: var(--hero-text-mid);
  font-size: 12px;
  transition: transform var(--transition);
}

.salary-card-detail[open] summary::after {
  transform: rotate(180deg);
}

.salary-card-detail summary i {
  color: var(--soft-gold-6);
  font-size: 15px;
}

.salary-card-detail__body {
  padding: 0 12px 12px;
}

.salary-card-detail__body ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.salary-card-detail__body li {
  position: relative;
  padding-inline-start: 18px;
  color: var(--hero-text-mid);
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.9;
}

.salary-card-detail__body li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 12px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--soft-gold-5);
}

/* Compact forms inside details */
.salary-card-detail .salary-forms-list {
  gap: 8px;
}

.salary-card-detail .salary-form-link {
  min-height: 42px;
  border-radius: 14px;
  padding: 8px 10px;
}

/* Blue Theme */
body[data-theme="blue"] .salary-card-detail summary i {
  color: var(--navy);
}

body[data-theme="blue"] .salary-card-detail__body li::before {
  background: var(--sky);
}

/* Blue Theme - Form Link Hover */
body[data-theme="blue"] .salary-form-link:not(.is-disabled):hover {
  border-color: rgba(43, 170, 226, 0.28);
  background: rgba(43, 170, 226, 0.06);
}

body[data-theme="blue"] .salary-form-link:not(.is-disabled):hover i {
  color: var(--blue);
}

body[data-theme="blue"] .salary-form-link:not(.is-disabled):hover small {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
}

/* =========================================================
   Blue Theme - Header / Navigation Hover
========================================================= */

/* Main nav links */
body[data-theme="blue"] .kafu-nav__item:not(.kafu-nav__item--featured) > .kafu-nav__link:hover,
body[data-theme="blue"] .kafu-nav__item:not(.kafu-nav__item--featured).is-active > .kafu-nav__link {
  background: rgba(43, 170, 226, 0.10);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

/* Main nav icon */
body[data-theme="blue"] .kafu-nav__item:not(.kafu-nav__item--featured) > .kafu-nav__link:hover i,
body[data-theme="blue"] .kafu-nav__item:not(.kafu-nav__item--featured).is-active > .kafu-nav__link i {
  color: var(--navy);
}

/* Dropdown menu links */
body[data-theme="blue"] .kafu-nav__dropdown a:not(.is-disabled):hover,
body[data-theme="blue"] .kafu-nav__dropdown a.is-active {
  background: rgba(43, 170, 226, 0.10);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

/* Dropdown title */
body[data-theme="blue"] .kafu-nav__dropdown-title {
  color: var(--navy);
}

/* Any small hover line / marker inside dropdown */
body[data-theme="blue"] .kafu-nav__dropdown a:not(.is-disabled):hover::before,
body[data-theme="blue"] .kafu-nav__dropdown a.is-active::before {
  background: var(--blue);
}

/* Mobile nav links */
body[data-theme="blue"] .kafu-mobile-nav__link:not(.is-disabled):hover,
body[data-theme="blue"] .kafu-mobile-nav__link.is-active {
  background: rgba(43, 170, 226, 0.10);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

/* Mobile group titles */
body[data-theme="blue"] .kafu-mobile-nav__group-title,
body[data-theme="blue"] .kafu-mobile-nav__sub-title {
  color: var(--navy);
}

/* Theme toggle hover */
body[data-theme="blue"] .kafu-theme-toggle:hover {
  background: rgba(43, 170, 226, 0.10);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

/* =========================================================
   Kafu Training - Next Course Mini Card
========================================================= */

.kafu-training-next-mini {
  margin-bottom: 26px;
  padding: 16px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(232, 200, 99, 0.13), transparent 34%),
    rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(201, 164, 55, 0.16);
  box-shadow: var(--shadow-sm);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
}

.kafu-training-next-mini__icon {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

.kafu-training-next-mini__content {
  min-width: 0;
}

.kafu-training-next-mini__content span {
  display: block;
  margin-bottom: 3px;
  color: var(--soft-gold-6);
  font-size: 11px;
  font-weight: 900;
}

.kafu-training-next-mini__content strong {
  display: block;
  color: var(--hero-text-dark);
  font-size: 16px;
  font-weight: 900;
  line-height: 1.6;
}

.kafu-training-next-mini__content div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.kafu-training-next-mini__content small {
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(248, 251, 254, 0.9);
  border: 1px solid rgba(226, 236, 244, 0.95);
  color: var(--hero-text-mid);
  font-size: 10.5px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
}

.kafu-training-next-mini a {
  min-height: 38px;
  padding: 8px 13px;
  border-radius: 999px;
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border: 1px solid rgba(201, 164, 55, 0.18);
  text-decoration: none;
  font-size: 11px;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  transition:
    transform var(--transition),
    background var(--transition),
    border-color var(--transition);
}

.kafu-training-next-mini a:hover {
  transform: translateY(-2px);
  background: rgba(201, 164, 55, 0.16);
  border-color: rgba(201, 164, 55, 0.26);
}


/* =========================================================
   Training Course Status - Clean Label
========================================================= */

.kafu-training-course__badges {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* شارة الحالة النصية */
.kafu-training-course__state {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 8px;
  background: rgba(201, 164, 55, 0.1);
  border: 1px solid rgba(201, 164, 55, 0.18);
  color: var(--soft-gold-6);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

/* إخفاء أي أيقونة قديمة داخل الحالة */
.kafu-training-course__state i {
  display: none;
}

/* قادمة - ذهبي افتراضي */
.kafu-training-course__state--upcoming {
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border-color: rgba(201, 164, 55, 0.18);
}

/* تقام اليوم */
.kafu-training-course__state--today {
  background: rgba(72, 173, 72, 0.1);
  color: #157347;
  border-color: rgba(72, 173, 72, 0.22);
}

/* أقيمت سابقًا */
.kafu-training-course__state--ended {
  background: #f1f5f9;
  color: #64748b;
  border-color: #e2e8f0;
}

/* أيقونة التاريخ - ذهبي افتراضي */
.kafu-training-course__date i,
.kafu-training-next-mini__icon i {
  color: var(--soft-gold-6);
}


/* =========================================================
   Ended / Next Course Visual
========================================================= */

/* الكرت المنتهي */
.kafu-training-course--ended {
  opacity: 0.8;
}

.kafu-training-course--ended .kafu-training-course__card {
  background:
    radial-gradient(circle at 14% 0%, rgba(148, 163, 184, 0.08), transparent 34%),
    rgba(255, 255, 255, 0.78);
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow: none;
}

/* إزالة اللمسة الذهبية من الشريط العلوي للكرت المنتهي */
.kafu-training-course--ended .kafu-training-course__card::before {
  background: linear-gradient(90deg, #cbd5e1, #94a3b8);
}

.kafu-training-course--ended .kafu-training-course__date {
  opacity: 0.72;
  filter: grayscale(1);
}

/* الدورة القادمة */
.kafu-training-course--next:not(.kafu-training-course--ended) .kafu-training-course__card {
  border-color: rgba(201, 164, 55, 0.32);
  box-shadow: 0 18px 44px rgba(156, 123, 30, 0.12);
}


/* =========================================================
   Blue Theme
========================================================= */

body[data-theme="blue"] .kafu-training-next-mini {
  border-color: rgba(43, 170, 226, 0.16);
  background:
    radial-gradient(circle at 12% 0%, rgba(43, 170, 226, 0.12), transparent 34%),
    rgba(255, 255, 255, 0.86);
}

body[data-theme="blue"] .kafu-training-next-mini__icon {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .kafu-training-next-mini__icon i {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-next-mini__content span {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-next-mini a {
  background: rgba(43, 170, 226, 0.1);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.18);
}

body[data-theme="blue"] .kafu-training-next-mini a:hover {
  background: rgba(43, 170, 226, 0.16);
  border-color: rgba(43, 170, 226, 0.26);
}

body[data-theme="blue"] .kafu-training-course__date i {
  color: var(--navy);
}

body[data-theme="blue"] .kafu-training-course__state,
body[data-theme="blue"] .kafu-training-course__state--upcoming {
  background: rgba(43, 170, 226, 0.08);
  color: var(--navy);
  border-color: rgba(43, 170, 226, 0.16);
}

body[data-theme="blue"] .kafu-training-course__state--today {
  background: rgba(72, 173, 72, 0.1);
  color: #157347;
  border-color: rgba(72, 173, 72, 0.22);
}

body[data-theme="blue"] .kafu-training-course__state--ended {
  background: #f1f5f9;
  color: #64748b;
  border-color: #e2e8f0;
}

body[data-theme="blue"] .kafu-training-course--next:not(.kafu-training-course--ended) .kafu-training-course__card {
  border-color: rgba(43, 170, 226, 0.3);
  box-shadow: 0 18px 44px rgba(21, 80, 138, 0.12);
}


/* =========================================================
   Strong Gold Theme Fix
   يستخدم فقط إذا كان الثيم ليس أزرق
========================================================= */

body:not([data-theme="blue"]) .kafu-training-course__state,
body:not([data-theme="blue"]) .kafu-training-course__state--upcoming {
  background: rgba(201, 164, 55, 0.1);
  color: var(--soft-gold-6);
  border-color: rgba(201, 164, 55, 0.18);
}

body:not([data-theme="blue"]) .kafu-training-course__date i,
body:not([data-theme="blue"]) .kafu-training-next-mini__icon i {
  color: var(--soft-gold-6);
}

/* =========================================================
   Fix - Next Course Mini Details Colors
========================================================= */

/* الثيم الذهبي الافتراضي */
body:not([data-theme="blue"]) .kafu-training-next-mini__content small {
  background: rgba(201, 164, 55, 0.08) !important;
  border-color: rgba(201, 164, 55, 0.16) !important;
  color: var(--soft-gold-6) !important;
}

/* النص داخل البطاقة */
body:not([data-theme="blue"]) .kafu-training-next-mini__content > span {
  color: var(--soft-gold-6) !important;
}

body:not([data-theme="blue"]) .kafu-training-next-mini__icon,
body:not([data-theme="blue"]) .kafu-training-next-mini a {
  background: rgba(201, 164, 55, 0.10) !important;
  color: var(--soft-gold-6) !important;
  border-color: rgba(201, 164, 55, 0.18) !important;
}

body:not([data-theme="blue"]) .kafu-training-next-mini__icon i,
body:not([data-theme="blue"]) .kafu-training-next-mini a i {
  color: var(--soft-gold-6) !important;
}

/* الثيم الأزرق فقط */
body[data-theme="blue"] .kafu-training-next-mini__content small {
  background: rgba(43, 170, 226, 0.08) !important;
  border-color: rgba(43, 170, 226, 0.16) !important;
  color: var(--navy) !important;
}


/* =========================================================
   Responsive
========================================================= */

@media (max-width: 760px) {
  .kafu-training-next-mini {
    grid-template-columns: auto 1fr;
  }

  .kafu-training-next-mini a {
    grid-column: 1 / -1;
    width: fit-content;
  }

  .kafu-training-course__badges {
    justify-content: flex-start;
    margin-top: 10px;
  }
}

@media (max-width: 520px) {
  .kafu-training-next-mini {
    grid-template-columns: 1fr;
  }
}