/*
 * KII design v3 (owner request 2026-11-09, round 3): Newsletter page, no black-and-white
 * filters, and a consistent spacing system. Loaded after kii-v2.css.
 */

:root {
  /* Spacing scale (4px base) used for the new sections and the rhythm fixes below. */
  --kii-space-1: 4px;
  --kii-space-2: 8px;
  --kii-space-3: 12px;
  --kii-space-4: 16px;
  --kii-space-5: 24px;
  --kii-space-6: 32px;
  --kii-space-7: 48px;
  --kii-space-8: 64px;
  --kii-space-9: 96px;
  --kii-section-y: clamp(48px, 6vw, 96px);
  --kii-measure: 68ch; /* comfortable line length for body text */
}

/* ---------------------------------------------- no black-and-white filters */
.kii-site img,
.kii-site .elementor-widget-image img,
.kii-site .elementor-post__thumbnail img,
.kii-site .elementor-image-box-img img {
  filter: none !important;
}

/* ------------------------------------------------------- spacing rhythm */
/* Widgets inside content columns get breathing room (the original kit used 0). */
.kii-main .elementor-widget-wrap > .elementor-widget:not(:last-child):not(.elementor-widget-spacer):not(.elementor-widget-divider) {
  margin-block-end: var(--kii-space-4);
}
.kii-main .elementor-widget-heading + .elementor-widget-text-editor,
.kii-main .elementor-widget-heading + .elementor-widget-divider {
  margin-block-start: var(--kii-space-1);
}
/* Headings: tighter leading, consistent space below. */
.kii-main .elementor-heading-title {
  line-height: 1.25;
  letter-spacing: -0.005em;
}
:lang(ar) .kii-main .elementor-heading-title,
:lang(ckb) .kii-main .elementor-heading-title {
  line-height: 1.5;
  letter-spacing: 0;
}
/* Body text: never smaller than 16px (several original blocks were 13-14px). */
.kii-main .elementor-widget-text-editor p,
.kii-main .elementor-widget-text-editor li {
  font-size: max(1rem, 1em);
}
.kii-main .elementor-widget-text-editor p:last-child {
  margin-block-end: 0;
}
.kii-main .elementor-widget-text-editor ul,
.kii-main .elementor-widget-text-editor ol {
  padding-inline-start: 1.25em;
  margin-block: 0 1em;
}
.kii-main .elementor-widget-text-editor li + li {
  margin-block-start: 0.35em;
}
/* Images: consistent corners and a subtle frame. */
.kii-main .elementor-widget-image img {
  box-shadow: 0 1px 2px rgb(16 24 40 / 0.06), 0 8px 24px rgb(16 24 40 / 0.08);
}
/* Boxed content never touches the screen edge on smaller screens. */
@media (max-width: 1440px) {
  .kii-main .elementor-section.elementor-section-boxed > .elementor-container {
    padding-inline: var(--kii-space-5);
  }
}
@media (max-width: 767px) {
  .kii-main .elementor-section.elementor-section-boxed > .elementor-container {
    padding-inline: var(--kii-space-4);
  }
  .kii-main .elementor-widget-wrap > .elementor-widget:not(:last-child):not(.elementor-widget-spacer):not(.elementor-widget-divider) {
    margin-block-end: var(--kii-space-3);
  }
}

/* Merged Business Model section on the home page: its own light band, directly after "Welcome". */
[data-elementor-type='wp-page-merged'] {
  background: var(--kii-surface-alt);
  border-block: 1px solid var(--kii-line);
}
[data-elementor-type='wp-page-merged'] > .elementor-section:first-child {
  margin-top: 0 !important; /* the original 130px only cleared the Business page's own banner */
  padding-top: var(--kii-space-8) !important;
}
[data-elementor-type='wp-page-merged'] > .elementor-section:last-child {
  padding-bottom: var(--kii-space-8) !important;
}

/* ------------------------------------------------------------ page hero */
.kii-page-hero__lead {
  max-width: 640px;
  margin: var(--kii-space-4) 0 0;
  font-size: clamp(1.05rem, 1rem + 0.4vw, 1.25rem);
  line-height: 1.6;
  color: rgb(255 255 255 / 0.88);
}

/* ------------------------------------------------------- newsletter page */
.kii-news {
  padding: var(--kii-space-7) 0 var(--kii-section-y);
}
.kii-news__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: var(--kii-space-7);
  align-items: start;
}
@media (max-width: 1024px) {
  .kii-news__layout {
    grid-template-columns: 1fr;
  }
}
.kii-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--kii-space-2);
  margin-bottom: var(--kii-space-5);
  padding-bottom: var(--kii-space-4);
  border-bottom: 1px solid var(--kii-line);
}
.kii-site .kii-tab {
  min-height: 40px;
  padding: 0 18px !important;
  border: 1px solid var(--kii-line) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--kii-ink) !important;
  font: 500 14px/1 'Poppins', 'Segoe UI', Tahoma, sans-serif !important;
  cursor: pointer;
  box-shadow: none !important;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.kii-site .kii-tab:hover {
  border-color: var(--kii-blue) !important;
  color: var(--kii-blue) !important;
}
.kii-site .kii-tab[aria-selected='true'] {
  background: var(--kii-blue) !important;
  border-color: var(--kii-blue) !important;
  color: #fff !important;
}
.kii-news__list {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.kii-article-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--kii-space-2) var(--kii-space-3);
}
.kii-article-card__summary {
  margin: 0;
  color: var(--kii-ink-muted);
  line-height: 1.6;
}
.kii-chip {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.kii-chip--weekly {
  background: var(--kii-blue-tint);
  color: var(--kii-blue-deep);
}
.kii-chip--event {
  background: var(--kii-yellow);
  color: var(--kii-ink);
}
.kii-chip--project {
  background: var(--kii-green-tint);
  color: var(--kii-green-deep);
}
.kii-empty {
  margin: 0;
  padding: var(--kii-space-6) var(--kii-space-5);
  border: 1px dashed var(--kii-line);
  border-radius: 14px;
  color: var(--kii-ink-muted);
  text-align: center;
}
.kii-news__aside {
  display: grid;
  gap: var(--kii-space-5);
  position: sticky;
  top: 150px;
}
@media (max-width: 1024px) {
  .kii-news__aside {
    position: static;
  }
}
.kii-panel {
  padding: var(--kii-space-5);
  border: 1px solid var(--kii-line);
  border-radius: 16px;
  background: #fff;
}
.kii-panel__title {
  margin: 0 0 var(--kii-space-4);
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--kii-ink);
}
.kii-panel .kii-empty {
  padding: var(--kii-space-4);
  font-size: 0.95rem;
}
.kii-panel--accent {
  border: 0;
  color: #fff;
  background:
    radial-gradient(500px 220px at 100% 0%, rgb(58 134 39 / 0.35), transparent 60%),
    linear-gradient(140deg, var(--kii-blue-deep), var(--kii-blue));
}
.kii-panel--accent .kii-panel__title {
  color: #fff;
}
.kii-panel--accent > p {
  margin: 0 0 var(--kii-space-4);
  color: rgb(255 255 255 / 0.85);
  line-height: 1.6;
}
.kii-newsletter__form--page .kii-newsletter__row {
  flex-direction: column;
}
.kii-site .kii-newsletter__form--page input[type='email'] {
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid rgb(255 255 255 / 0.35) !important;
  border-radius: 999px !important;
  background: rgb(255 255 255 / 0.12) !important;
  color: #fff !important;
}
.kii-newsletter__form--page input::placeholder {
  color: rgb(255 255 255 / 0.75);
}
.kii-newsletter__form--page .kii-newsletter__note {
  margin: var(--kii-space-3) 0 0;
  font-size: 12px;
  color: rgb(255 255 255 / 0.7);
}
.kii-newsletter__form--page .kii-field-error,
.kii-newsletter__form--page .kii-form-status {
  color: var(--kii-yellow);
}
.kii-newsletter__more {
  margin-top: var(--kii-space-3) !important;
}
.kii-newsletter__more a {
  color: var(--kii-yellow);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Upcoming events list */
.kii-upcoming__list {
  display: grid;
  gap: var(--kii-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.kii-upcoming__list:empty {
  display: none;
}
.kii-event__link {
  display: flex;
  gap: var(--kii-space-4);
  align-items: center;
  padding: var(--kii-space-3);
  border-radius: 12px;
  color: var(--kii-ink) !important;
  text-decoration: none !important;
  transition: background-color 0.15s;
}
.kii-event__link:hover {
  background: var(--kii-blue-tint);
}
.kii-event__date {
  flex: none;
  display: grid;
  place-items: center;
  width: 56px;
  height: 60px;
  border-radius: 12px;
  background: var(--kii-blue);
  color: #fff;
  line-height: 1;
}
.kii-event__day {
  font-size: 1.35rem;
  font-weight: 700;
}
.kii-event__month {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.kii-event__text {
  display: grid;
  gap: 4px;
}
.kii-event__title {
  font-weight: 600;
  line-height: 1.35;
}
.kii-event__meta {
  font-size: 13px;
  color: var(--kii-ink-muted);
}

/* Article cards: images always sit in a fixed 16:9 frame. */
.kii-article-card__media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
}
.kii-site .kii-article-card__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Vertical rhythm: the original used tall empty spacer blocks; cap them so section gaps stay consistent. */
.kii-main .elementor-widget-spacer .elementor-spacer-inner {
  height: min(var(--spacer-size, 50px), 40px) !important;
}
/* Full-width sections: content keeps a gutter from the screen edge (backgrounds still go edge to edge). */
.kii-main .elementor-section.elementor-section-full_width > .elementor-container {
  padding-inline: clamp(16px, 3vw, 40px);
}
.kii-main .elementor-section.elementor-section-full_width:has(.elementor-background-slideshow, .swiper-slide-bg) > .elementor-container {
  padding-inline: 0;
}

/* ---------------------------------------------- round 4: header languages */
.kii-site .kii-lang-item {
  display: flex;
  align-items: center;
  margin-inline-start: var(--kii-space-3);
  padding-inline-start: var(--kii-space-4);
  border-inline-start: 1px solid var(--kii-line);
}
.kii-lang {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.elementor-location-header .kii-lang a.kii-lang__link[data-locale-link] {
  display: inline-block;
  padding: 6px 9px;
  border-radius: 8px;
  color: var(--kii-ink-muted) !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: color 0.15s, background-color 0.15s;
}
.elementor-location-header .kii-lang a.kii-lang__link[data-locale-link]:hover {
  color: var(--kii-blue) !important;
  background: var(--kii-blue-tint);
}
.elementor-location-header .kii-lang a.kii-lang__link[data-locale-link][aria-current='true'] {
  color: var(--kii-blue) !important;
  background: var(--kii-blue-tint);
}
/* Only the desktop bar shows it; the mobile menu has its own language list. */
.elementor-nav-menu--dropdown .kii-lang-item {
  display: none !important;
}

/* ------------------------------------------------- "Coming soon" states */
.kii-empty--soon {
  display: grid;
  justify-items: center;
  gap: var(--kii-space-3);
  padding: var(--kii-space-7) var(--kii-space-5);
  border: 1px dashed var(--kii-line);
  background: var(--kii-surface-alt);
}
.kii-empty--soon[hidden] {
  display: none;
}
.kii-empty--soon p {
  margin: 0;
  max-width: 46ch;
  color: var(--kii-ink-muted);
  line-height: 1.6;
}
.kii-panel .kii-empty--soon {
  padding: var(--kii-space-5) var(--kii-space-4);
}

/* ---------- Round 6 (2026-11-10): Projects page list and article videos/galleries from the Workbench ---------- */
.kii-projects { padding: 40px 0 8px; }
.kii-projects__list:empty { display: none; }
.kii-projects:has(.kii-projects__list:empty) { padding: 0; }
.kii-article__video {
  position: relative;
  aspect-ratio: 16 / 9;
  margin: 28px 0;
  border-radius: var(--kii-radius-lg);
  overflow: hidden;
  background: var(--kii-blue-ink);
}
.kii-article__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.kii-article__clip {
  display: block;
  width: 100%;
  max-height: 70vh;
  margin: 28px 0;
  border-radius: var(--kii-radius-lg);
  background: var(--kii-blue-ink);
}
.kii-article__gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin: 28px 0 8px;
}
.kii-article__gallery img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--kii-radius);
  box-shadow: var(--kii-shadow-sm);
}
