/* Kids TouchTable — extracted from Designs/kids-touchtable-feature-upgrade */

.emkokids-page {
      --emkokids-brand: #0072ba;
      --emkokids-brand-light: #3ba4ff;
      --emkokids-brand-dark: #005f98;
      --emkokids-text: #111827;
      --emkokids-muted: #66758a;
      --emkokids-soft: #f5f8fb;
      --emkokids-white: #ffffff;
      --emkokids-container: 1140px;
      --emkokids-radius-large: 38px;
      --emkokids-radius-medium: 24px;
      margin: 0;
      overflow: hidden;
      background: #fff;
      color: var(--emkokids-text);
      font-family: "Plus Jakarta Sans", Arial, sans-serif;
      font-size: 16px;
      line-height: 1.65;
    }

    .emkokids-page,
    .emkokids-page * {
      box-sizing: border-box;
    }

    .emkokids-page img,
    .emkokids-page video {
      display: block;
      max-width: 100%;
    }

    .emkokids-page a {
      text-decoration: none;
    }

    .emkokids-container {
      width: min(var(--emkokids-container), calc(100% - 48px));
      margin-inline: auto;
    }

    .emkokids-button,
    .emkokids-page a.emkokids-button,
    .emkokids-page a.emkokids-button:visited {
      min-height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 25px;
      border-radius: 9px;
      font-family: inherit;
      font-size: 15px;
      font-weight: 700;
      line-height: 1;
      transition: background-color .2s ease, transform .2s ease;
    }

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

    .emkokids-button-primary,
    .emkokids-page a.emkokids-button-primary,
    .emkokids-page a.emkokids-button-primary:visited,
    .emkokids-page a.emkokids-button-primary:hover,
    .emkokids-page a.emkokids-button-primary:focus {
      background: var(--emkokids-brand) !important;
      color: #fff !important;
      -webkit-text-fill-color: #fff !important;
    }

    .emkokids-page a.emkokids-button-primary:hover {
      background: var(--emkokids-brand-dark) !important;
    }

    .emkokids-button-white,
    .emkokids-page a.emkokids-button-white,
    .emkokids-page a.emkokids-button-white:visited,
    .emkokids-page a.emkokids-button-white:hover,
    .emkokids-page a.emkokids-button-white:focus {
      background: #fff !important;
      color: var(--emkokids-brand) !important;
      -webkit-text-fill-color: var(--emkokids-brand) !important;
    }

    .emkokids-button-outline,
    .emkokids-page a.emkokids-button-outline,
    .emkokids-page a.emkokids-button-outline:visited,
    .emkokids-page a.emkokids-button-outline:hover,
    .emkokids-page a.emkokids-button-outline:focus {
      background: transparent !important;
      color: #fff !important;
      -webkit-text-fill-color: #fff !important;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75);
    }

    .emkokids-hero {
      min-height: 820px;
      overflow: hidden;
      border-radius: 0 0 58px 58px;
      background: linear-gradient(117deg, rgba(0, 114, 186, .96), rgba(59, 164, 255, .94));
      box-shadow: 0 5px 12px rgba(13, 59, 92, .2);
      color: #fff;
    }

    .emkokids-breadcrumb {
      padding-top: 26px;
      color: rgba(255, 255, 255, .9);
      font-size: 13px;
      font-weight: 500;
    }

    .emkokids-breadcrumb a {
      color: inherit;
    }

    .emkokids-breadcrumb a:hover {
      color: #fff;
    }

    .emkokids-hero-inner {
      padding: 26px 0 65px;
      text-align: center;
    }

    .emkokids-title {
      margin: 0;
      color: #fff;
      font-size: clamp(38px, 4.8vw, 60px);
      font-weight: 800;
      letter-spacing: -.045em;
      line-height: 1.05;
    }

    .emkokids-hero-slider {
      position: relative;
      width: min(720px, 88vw);
      margin: 18px auto 0;
    }

    .emkokids-hero-visual {
      position: relative;
      height: 425px;
      overflow: hidden;
      border-radius: 24px;
      touch-action: pan-y;
    }

    .emkokids-hero-track {
      display: flex;
      height: 100%;
      transition: transform .42s cubic-bezier(.22, .61, .36, 1);
      will-change: transform;
    }

    .emkokids-hero-slide {
      min-width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 8px 54px;
    }

    .emkokids-hero-product {
      width: 100%;
      height: 100%;
      object-fit: contain;
      filter: drop-shadow(0 18px 22px rgba(0, 38, 68, .18));
      user-select: none;
      -webkit-user-drag: none;
    }

    .emkokids-slider-button {
      position: absolute;
      top: 50%;
      z-index: 4;
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, .94);
      color: var(--emkokids-brand-dark);
      font: inherit;
      font-size: 28px;
      line-height: 1;
      cursor: pointer;
      transform: translateY(-50%);
      transition: background-color .2s ease, transform .2s ease;
      box-shadow: 0 5px 15px rgba(0, 51, 89, .14);
    }

    .emkokids-slider-button:hover {
      background: #fff;
      transform: translateY(-50%) scale(1.04);
    }

    .emkokids-slider-button:focus-visible,
    .emkokids-slider-dot:focus-visible {
      outline: 3px solid rgba(255, 255, 255, .9);
      outline-offset: 3px;
    }

    .emkokids-slider-button-prev {
      left: 0;
    }

    .emkokids-slider-button-next {
      right: 0;
    }

    .emkokids-slider-dots {
      display: flex;
      justify-content: center;
      gap: 9px;
      margin-top: 12px;
    }

    .emkokids-slider-dot {
      width: 9px;
      height: 9px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(255, 255, 255, .46);
      cursor: pointer;
      transition: width .2s ease, background-color .2s ease;
    }

    .emkokids-slider-dot[aria-current="true"] {
      width: 26px;
      border-radius: 8px;
      background: #fff;
    }

    .emkokids-size-badge {
      position: absolute;
      top: 46px;
      left: 2%;
      width: 58px;
      height: 58px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      background: #fff;
      color: var(--emkokids-brand-dark);
      font-size: 20px;
      font-weight: 700;
      box-shadow: 0 5px 15px rgba(0, 51, 89, .15);
    }

    .emkokids-hero-heading {
      max-width: 820px;
      margin: 6px auto 0;
      color: #fff;
      font-size: clamp(27px, 3.2vw, 40px);
      font-weight: 700;
      letter-spacing: -.035em;
      line-height: 1.15;
    }

    .emkokids-hero-subtitle {
      max-width: 880px;
      margin: 20px auto 0;
      color: rgba(255, 255, 255, .92);
      font-size: 17px;
      line-height: 1.65;
    }

    .emkokids-hero-actions {
      margin-top: 28px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 14px;
    }

    .emkokids-section {
      padding: 94px 0;
    }

    .emkokids-section-compact {
      padding-top: 72px;
    }

    .emkokids-gradient-title {
      max-width: 920px;
      margin: 0 auto 48px;
      text-align: center;
      font-size: clamp(38px, 5vw, 62px);
      font-weight: 800;
      letter-spacing: -.05em;
      line-height: 1.08;
      background: linear-gradient(150deg, var(--emkokids-brand), var(--emkokids-brand-light));
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      -webkit-text-fill-color: transparent;
    }

    .emkokids-video-card {
      overflow: hidden;
      border-radius: var(--emkokids-radius-large);
      background: #fff;
      box-shadow: 0 8px 28px rgba(25, 55, 80, .12);
    }

    .emkokids-video-card video {
      width: 100%;
      height: 620px;
      object-fit: cover;
      background: #eef3f6;
    }

    .emkokids-feature-stack {
      display: grid;
      gap: 34px;
    }

    .emkokids-feature-card {
      min-height: 530px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      overflow: hidden;
      border-radius: var(--emkokids-radius-large);
      background: #fff;
      box-shadow: 0 7px 24px rgba(25, 55, 80, .1);
    }

    .emkokids-feature-card:nth-child(even) .emkokids-feature-media {
      order: 2;
    }

    .emkokids-feature-media {
      height: 100%;
      min-height: 530px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 46px;
      background: #f3f7fa;
    }

    .emkokids-feature-media img {
      width: 100%;
      height: 100%;
      max-height: 420px;
      object-fit: contain;
    }

    .emkokids-feature-copy {
      padding: 58px 62px;
    }

    .emkokids-feature-title {
      margin: 0;
      color: var(--emkokids-brand);
      font-size: clamp(28px, 3vw, 42px);
      font-weight: 800;
      letter-spacing: -.04em;
      line-height: 1.14;
    }

    .emkokids-feature-text {
      margin: 22px 0 0;
      color: var(--emkokids-muted);
      font-size: 17px;
    }

    .emkokids-feature-card-safety {
      --emkokids-feature-accent: #15916f;
      --emkokids-feature-soft: #eff9f5;
    }

    .emkokids-feature-card-performance {
      --emkokids-feature-accent: #0072ba;
      --emkokids-feature-soft: #edf7fd;
    }

    .emkokids-feature-card-usage {
      --emkokids-feature-accent: #7457c8;
      --emkokids-feature-soft: #f5f1ff;
    }

    .emkokids-feature-card-connectivity {
      --emkokids-feature-accent: #d56b18;
      --emkokids-feature-soft: #fff5eb;
    }

    .emkokids-feature-card .emkokids-feature-media {
      background: var(--emkokids-feature-soft, #f3f7fa);
    }

    .emkokids-feature-card .emkokids-feature-title {
      color: var(--emkokids-feature-accent, var(--emkokids-brand));
    }

    .emkokids-feature-list-title {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-top: 28px;
      color: var(--emkokids-text);
      font-size: 15px;
      font-weight: 800;
      letter-spacing: -.01em;
    }

    .emkokids-feature-list-title::before {
      content: "";
      width: 8px;
      height: 8px;
      flex: 0 0 auto;
      border-radius: 50%;
      background: var(--emkokids-feature-accent, var(--emkokids-brand));
    }

    .emkokids-safety-grid,
    .emkokids-use-grid,
    .emkokids-port-grid,
    .emkokids-spec-grid {
      margin-top: 16px;
    }

    .emkokids-safety-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .emkokids-safety-item {
      min-height: 66px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 13px 14px;
      border-radius: 14px;
      background: var(--emkokids-feature-soft);
      color: var(--emkokids-muted);
      font-size: 14px;
      font-weight: 600;
      line-height: 1.35;
    }

    .emkokids-safety-icon {
      width: 30px;
      height: 30px;
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      border-radius: 10px;
      background: #fff;
      color: var(--emkokids-feature-accent);
      font-size: 17px;
      font-weight: 800;
      box-shadow: 0 3px 10px rgba(17, 56, 47, .07);
    }

    .emkokids-spec-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .emkokids-spec-item {
      min-height: 96px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 14px;
      border-radius: 15px;
      background: var(--emkokids-feature-soft);
    }

    .emkokids-spec-value {
      color: var(--emkokids-feature-accent);
      font-size: 18px;
      font-weight: 800;
      letter-spacing: -.025em;
      line-height: 1.15;
    }

    .emkokids-spec-label {
      margin-top: 5px;
      color: var(--emkokids-muted);
      font-size: 12px;
      font-weight: 600;
      line-height: 1.35;
    }

    .emkokids-use-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      counter-reset: emkokids-use;
    }

    .emkokids-use-item {
      min-height: 62px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 14px;
      border-radius: 14px;
      background: var(--emkokids-feature-soft);
      color: var(--emkokids-muted);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.3;
      counter-increment: emkokids-use;
    }

    .emkokids-use-item::before {
      content: counter(emkokids-use, decimal-leading-zero);
      width: 32px;
      height: 32px;
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      border-radius: 10px;
      background: #fff;
      color: var(--emkokids-feature-accent);
      font-size: 11px;
      font-weight: 800;
      box-shadow: 0 3px 10px rgba(50, 36, 91, .07);
    }

    .emkokids-port-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .emkokids-port-item {
      min-height: 58px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 12px;
      border-radius: 14px;
      background: var(--emkokids-feature-soft);
      color: var(--emkokids-muted);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.25;
    }

    .emkokids-port-code {
      min-width: 45px;
      min-height: 32px;
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      padding: 0 7px;
      border-radius: 9px;
      background: #fff;
      color: var(--emkokids-feature-accent);
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .02em;
      box-shadow: 0 3px 10px rgba(89, 50, 19, .07);
    }

    .emkokids-multi-image {
      overflow: hidden;
      border-radius: var(--emkokids-radius-large);
      box-shadow: 0 8px 28px rgba(25, 55, 80, .11);
    }

    .emkokids-multi-image img {
      width: 100%;
      height: 620px;
      object-fit: cover;
    }

    .emkokids-multi-text {
      max-width: 980px;
      margin: 34px auto 0;
      color: var(--emkokids-muted);
      text-align: center;
      font-size: 18px;
    }

    .emkokids-draw-layout {
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 80px;
      align-items: center;
    }

    .emkokids-draw-title {
      margin: 0;
      color: var(--emkokids-brand);
      font-size: clamp(34px, 4vw, 54px);
      font-weight: 800;
      letter-spacing: -.05em;
      line-height: 1.08;
    }

    .emkokids-draw-text {
      margin: 24px 0 0;
      color: var(--emkokids-muted);
      font-size: 18px;
    }

    .emkokids-draw-actions {
      margin-top: 30px;
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .emkokids-chip-area {
      position: relative;
      min-height: 430px;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      align-content: center;
    }

    .emkokids-chip-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      z-index: 2;
      width: 142px;
      height: 142px;
      padding: 22px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 9px 30px rgba(0, 83, 139, .16);
      transform: translate(-50%, -50%);
    }

    .emkokids-chip-icon img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .emkokids-chip {
      min-height: 90px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px;
      border-radius: 18px;
      background: linear-gradient(135deg, #eef8ff, #dff2ff);
      color: var(--emkokids-brand-dark);
      text-align: center;
      font-size: 16px;
      font-weight: 700;
    }

    .emkokids-cta-panel {
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      align-items: center;
      overflow: hidden;
      border-radius: var(--emkokids-radius-large);
      background: #fff;
      box-shadow: 0 8px 28px rgba(25, 55, 80, .12);
    }

    .emkokids-cta-copy {
      padding: 65px;
    }

    .emkokids-cta-title {
      margin: 0;
      color: var(--emkokids-brand);
      font-size: clamp(31px, 3.5vw, 48px);
      font-weight: 800;
      letter-spacing: -.045em;
      line-height: 1.1;
    }

    .emkokids-cta-copy p {
      margin: 24px 0 0;
      color: var(--emkokids-muted);
      font-size: 17px;
    }

    .emkokids-cta-copy p a,
    .emkokids-cta-copy p a:visited {
      color: var(--emkokids-brand) !important;
    }

    .emkokids-cta-copy .emkokids-button {
      margin-top: 30px;
    }

    .emkokids-cta-image {
      height: 100%;
      min-height: 520px;
    }

    .emkokids-cta-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    @media (max-width: 900px) {
      .emkokids-hero {
        min-height: auto;
      }

      .emkokids-hero-visual {
        height: 360px;
      }

      .emkokids-hero-slide {
        padding-inline: 46px;
      }

      .emkokids-video-card video,
      .emkokids-multi-image img {
        height: 470px;
      }

      .emkokids-feature-card,
      .emkokids-draw-layout,
      .emkokids-cta-panel {
        grid-template-columns: 1fr;
      }

      .emkokids-feature-card:nth-child(even) .emkokids-feature-media {
        order: 0;
      }

      .emkokids-feature-media {
        min-height: 390px;
      }

      .emkokids-draw-layout {
        gap: 40px;
      }

      .emkokids-cta-image {
        min-height: 400px;
      }
    }

    @media (max-width: 620px) {
      .emkokids-container {
        width: min(var(--emkokids-container), calc(100% - 28px));
      }

      .emkokids-hero {
        border-radius: 0 0 34px 34px;
      }

      .emkokids-breadcrumb {
        padding-top: 18px;
        font-size: 12px;
      }

      .emkokids-hero-inner {
        padding: 24px 0 50px;
      }

      .emkokids-hero-slider {
        width: 100%;
        margin-top: 10px;
      }

      .emkokids-hero-visual {
        height: 260px;
      }

      .emkokids-hero-slide {
        padding: 6px 36px;
      }

      .emkokids-slider-button {
        width: 36px;
        height: 36px;
        font-size: 23px;
      }

      .emkokids-slider-button-prev {
        left: -2px;
      }

      .emkokids-slider-button-next {
        right: -2px;
      }

      .emkokids-size-badge {
        top: 20px;
        left: 0;
        width: 50px;
        height: 50px;
        font-size: 17px;
      }

      .emkokids-hero-subtitle {
        font-size: 15px;
      }

      .emkokids-hero-actions .emkokids-button {
        width: 100%;
      }

      .emkokids-section {
        padding: 66px 0;
      }

      .emkokids-gradient-title {
        margin-bottom: 30px;
      }

      .emkokids-video-card,
      .emkokids-feature-card,
      .emkokids-multi-image,
      .emkokids-cta-panel {
        border-radius: 24px;
      }

      .emkokids-video-card video,
      .emkokids-multi-image img {
        height: 330px;
      }

      .emkokids-feature-card {
        min-height: 0;
      }

      .emkokids-feature-media {
        min-height: 280px;
        padding: 26px;
      }

      .emkokids-feature-copy,
      .emkokids-cta-copy {
        padding: 34px 28px;
      }

      .emkokids-safety-grid,
      .emkokids-use-grid,
      .emkokids-port-grid {
        grid-template-columns: 1fr;
      }

      .emkokids-spec-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .emkokids-multi-text,
      .emkokids-draw-text,
      .emkokids-cta-copy p {
        font-size: 16px;
      }

      .emkokids-chip-area {
        min-height: 0;
        grid-template-columns: 1fr;
      }

      .emkokids-chip-icon {
        position: static;
        width: 110px;
        height: 110px;
        margin: 4px auto;
        transform: none;
      }

      .emkokids-cta-image {
        min-height: 300px;
      }
    }
