
.km-main{ padding-top:24px; }

.km-hero{ text-align:center; margin-top:48px; display:flex;
  flex-direction:column; align-items:center; }
.km-title{ margin:22px 0 0; max-width:760px;
  font-weight:900;font-style:italic;font-size:44px;line-height:1.08;
  text-transform:uppercase;color:var(--ink); }
.km-lead{ margin:20px auto 0; max-width:620px;
  font-weight:500;font-size:17px;line-height:26px;color:var(--ink-2); }

.km-section{ text-align:center; margin-top:96px; display:flex;
  flex-direction:column; align-items:center; }
.km-h2{ margin-top:20px; }

.km-grid{ margin-top:48px; width:100%;
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.km-static{ margin:0; position:relative; }
.km-static img{ width:100%; aspect-ratio:4/5; object-fit:cover;
  border-radius:18px; box-shadow:var(--shadow-card); background:var(--card); }
.km-static__cap{ margin:14px 4px 0; text-align:center;
  font-weight:600;font-size:14px;line-height:20px;color:var(--ink-2); }

.km-videos{ margin:48px auto 0; width:100%; max-width:720px;
  display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.km-video{ margin:0; position:relative; }
.km-video video{ width:100%; aspect-ratio:9/16; object-fit:cover; display:block;
  border-radius:18px; box-shadow:var(--shadow-card); background:#000; }
.km-video__cap{ margin:14px 4px 0; text-align:center;
  font-weight:600;font-size:14px;line-height:20px;color:var(--ink-2); }

.km-carousels{ max-width:1360px; margin:112px auto 0; padding-inline:24px; }
.km-carousels__head{ text-align:center; display:flex;
  flex-direction:column; align-items:center; }

.km-carousel-block{ margin-top:64px; }
.km-carousel-block__intro{ text-align:center; max-width:640px;
  margin:0 auto 28px; }
.km-carousel-block__title{ margin:0;
  font-weight:900;font-style:italic;font-size:24px;line-height:1.15;
  text-transform:uppercase;color:var(--indigo); }
.km-carousel-block__desc{ margin:10px 0 0;
  font-weight:500;font-size:16px;line-height:24px;color:var(--ink-2); }

.km-carousel{ position:relative; text-align:center; --km-slide-w:520px; }
.km-carousel__viewport{ overflow:hidden; }
.km-carousel__track{ display:flex; gap:32px; align-items:center;
  transition:transform .55s cubic-bezier(.22,.7,.3,1); will-change:transform; }
.km-slide{ flex:0 0 auto; width:var(--km-slide-w); margin:0; position:relative;
  border-radius:22px; overflow:hidden; background:var(--card);
  box-shadow:var(--shadow-card);
  transform:scale(.82); opacity:.42;
  transition:transform .55s cubic-bezier(.22,.7,.3,1), opacity .55s ease; }
.km-slide img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
.km-slide.is-active{ transform:scale(1); opacity:1; }

.km-dl{ position:absolute; top:12px; right:12px; z-index:3;
  width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  border:none; border-radius:50%; cursor:pointer;
  background:rgba(255,255,255,.94); color:var(--ink);
  box-shadow:0 4px 14px rgba(19,19,19,.18);
  transition:transform .2s ease, background .2s ease, opacity .3s ease; }
.km-dl svg{ width:20px; height:20px; }
.km-dl:hover{ background:#fff; transform:scale(1.1); }

.km-dl-group{ display:inline-flex; align-items:center; gap:8px; margin-top:18px;
  padding:11px 20px; border:none; border-radius:60px; cursor:pointer;
  background:rgba(54,65,143,.08); color:var(--indigo);
  font-weight:700; font-style:italic; font-size:13px; text-transform:uppercase;
  transition:background .2s ease, transform .2s ease; }
.km-dl-group:hover{ background:rgba(54,65,143,.14); transform:translateY(-2px); }
.km-dl-group svg{ width:18px; height:18px; flex:none; }

.km-arrow{ position:absolute; top:50%; transform:translateY(-50%);
  width:52px; height:52px; border:none; border-radius:50%;
  background:#fff; color:var(--ink); box-shadow:0 8px 22px rgba(19,19,19,.16);
  font-size:26px; line-height:1; cursor:pointer; z-index:5;
  display:flex; align-items:center; justify-content:center;
  transition:transform .2s ease, box-shadow .2s ease; }
.km-arrow:hover{ transform:translateY(-50%) scale(1.08);
  box-shadow:0 12px 28px rgba(19,19,19,.22); }
.km-arrow--prev{ left:8px; padding-right:3px; }
.km-arrow--next{ right:8px; padding-left:3px; }

.km-dots{ display:flex; gap:8px; justify-content:center; margin-top:28px; }
.km-dots button{ width:8px; height:8px; padding:0; border:none; border-radius:50%;
  background:#cfd2da; cursor:pointer; transition:width .25s ease, background .25s ease; }
.km-dots button.is-active{ width:22px; border-radius:5px; background:var(--indigo); }

@media (max-width:1023px){
  .km-title{ font-size:34px; }
  .km-grid{ grid-template-columns:repeat(2,1fr); gap:20px; }
  .km-carousels{ padding-inline:16px; }
  .km-carousel{ --km-slide-w:62vw; }
  .km-carousel__track{ gap:20px; }
}

@media (max-width:600px){
  .km-hero{ margin-top:32px; }
  .km-title{ font-size:28px; }
  .km-lead{ font-size:15px; }
  .km-section{ margin-top:72px; }
  .km-grid{ grid-template-columns:1fr; gap:22px; max-width:360px; }
  .km-videos{ max-width:none; gap:14px; }
  .km-carousels{ margin-top:80px; }
  .km-carousel{ --km-slide-w:80vw; }
  .km-arrow{ width:44px; height:44px; font-size:22px; }
  .km-arrow--prev{ left:2px; }
  .km-arrow--next{ right:2px; }
}
