/* =========================
   Base / Reset
========================= */
:root{
  --bg:#ffffff;
  --text:#0b1220;
  --muted:#6b768a;
  --line:#e6e8ee;

  --blue:#4c6fff;
  --blue-dark:#3e5ef5;
  --blue-soft:#eef3ff;

  --card:#f7f8fb;
  --card2:#eef6ff;

  --radius:18px;
  --radius-lg:28px;

  --shadow:0 20px 60px rgba(0,0,0,.08);
  --shadow2:0 12px 30px rgba(76,111,255,.22);

  --container:1120px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.55;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }

.container{
  width:min(var(--container), calc(100% - 32px));
  margin:0 auto;
}

/* =========================
   Typography helpers
========================= */
.h2{
  margin:0 0 10px;
  font-size:26px;
  font-weight:900;
  letter-spacing:-.02em;
}

.p{
  margin:0 0 16px;
  color:var(--muted);
  font-size:15px;
}
.p.small{ font-size:14px; }

/* =========================
   Topbar
========================= */
.topbar{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(255,255,255,.85);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--line);
}

.topbar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px 0;
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font-weight:900;
}
.brand__logo{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:var(--blue);
  color:#fff;
  box-shadow: var(--shadow2);
  font-size:16px;
}
.brand__name{
  font-size:18px;
  letter-spacing:-.02em;
}

.nav{
  display:flex;
  gap:22px;
  align-items:center;
}
.nav__link{
  position:relative;
  text-decoration:none;
  font-weight:600;
  color:rgba(11,18,32,.78);
  padding:10px 0;
}
.nav__link:hover{ color:rgba(11,18,32,.95); }
.nav__link.is-active{
  color:rgba(11,18,32,.95);
}
.nav__link.is-active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-8px;
  height:2px;
  background:var(--blue);
  border-radius:2px;
}

.topbar__right{
  display:flex;
  align-items:center;
  gap:10px;
}

.pill{
  text-decoration:none;
  padding:10px 16px;
  border-radius:999px;
  background:#f1f3f7;
  font-weight:800;
  color:rgba(11,18,32,.9);
  border:1px solid #e8ebf1;
}
.pill:hover{ filter:brightness(1.02); }

/* =========================
   Buttons
========================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:999px;
  padding:14px 18px;
  font-weight:900;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
  user-select:none;
  transition: transform .15s ease, filter .15s ease, background .15s ease, border-color .15s ease;
}
.btn:active{ transform: translateY(1px); }

.btn--primary{
  background:linear-gradient(180deg, var(--blue), var(--blue-dark));
  color:#fff;
  box-shadow: var(--shadow2);
}
.btn--primary:hover{ filter:brightness(1.06); }

.btn--ghost{
  background:transparent;
  border-color:#e7eaf0;
  color:rgba(11,18,32,.88);
}
.btn--ghost:hover{
  background:#f4f6fb;
}

.btn--full{
  width:100%;
}

/* =========================
   Pulse (colorable)
========================= */
.pulse{
  position:relative;
  transform: translateZ(0);
}
.pulse--blue{
  --pulse: rgba(76,111,255,.45);
}

@keyframes pulseSoft {
  0%   { box-shadow: 0 0 0 0 var(--pulse); transform: scale(1); }
  70%  { box-shadow: 0 0 0 16px rgba(0,0,0,0); transform: scale(1.03); }
  100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); transform: scale(1); }
}
.pulse{ animation: pulseSoft 2.4s infinite; }
@media (prefers-reduced-motion: reduce){
  .pulse{ animation:none; }
}

/* =========================
   HERO
========================= */
.hero{
  padding:74px 0 120px;
  background-color: rgb(245, 246, 247);
}
.hero__inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:56px;
  align-items:center;
}

.hero__title{
  margin:0 0 14px;
  font-size:44px;
  font-weight:900;
  letter-spacing:-.03em;
}
.hero__desc{
  margin:0 0 20px;
  color:var(--muted);
  font-size:16px;
  max-width: 54ch;
}

.hero__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom: 18px;
}

.scrollHint{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:rgba(11,18,32,.72);
  font-weight:700;
  margin-top:10px;
}
.scrollHint__ico{
  width:34px;
  height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  border:1px solid #e7eaf0;
  background:#fff;
}

.hero__right{
  position: relative;
  min-height: 480px;
  display: flex;
  align-items: center;
  justify-content: center;
}


.heroPhotoWrap{
  position: relative;
  width: 340px;
  height: 520px;

  display: flex;
  align-items: center;
  justify-content: center;
}


/* ВАЖНО: width + height */
.heroPhotoImg{
  height: 100%;
  width: auto;              /* КЛЮЧ */
  object-fit: contain;      /* НЕ cover */
  position: relative;
  z-index: 2;

  border-radius: 32px;
  display: block;

  filter: drop-shadow(0 30px 50px rgba(15, 23, 42, 0.25));
}

/* фон-акцент сзади */
.heroPhoto__bgAccent{
  position: absolute;

  width: 70%;
  height: 92%;

  right: 2px;
  bottom: -1px;

  background: #DCE3FF; /* можно rgba */
  border-radius: 36px;

  z-index: 1;
}




/* =========================
   Soft section + Panel
========================= */
.soft{
  padding:46px 0 54px;
  background: radial-gradient(900px 420px at 50% 0%, rgba(130,190,255,.35), rgba(255,255,255,0) 60%),
              linear-gradient(180deg, #ffffff, #f7fbff 55%, #eef6ff);
  border-top:1px solid rgba(15,40,70,.06);
}

.panel{
  background: #f6f7f9;
  border:1px solid #eceef2;
  border-radius: var(--radius-lg);
  padding: 56px;
  display:flex;
  justify-content: center;
  overflow:hidden;
  position:relative;
}
.panel__col{ min-width:0; }
.panel__col--border{
  border-left:1px solid #e8ebf1;
  padding-left:56px;
}

.divider{
  height:1px;
  background:#e2e6ee;
  margin: 22px 0;
}

/* декоративная “сота” слева снизу как на скрине */
.panel::before{
  content:"";
  position:absolute;
  left:-20px;
  bottom:-40px;
  width:270px;
  height:270px;
  background-image: url(./pic/convincing.svg);
  opacity:.22;
  /*border-radius:50%;*/
}

/* =========================
   Pricing
========================= */
.pricing{
  padding:74px 0;
}

.centerTitle{
  margin:0 0 38px;
  text-align:center;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.02em;
}

.pricing__grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

.priceCard{
  background:#f7f7f8;
  border:1px solid #eceef2;
  border-radius:24px;
  padding:34px;
}

.priceCard__top{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.priceCard__price{
  font-size:40px;
  font-weight:900;
  letter-spacing:-.02em;
}
.priceCard__price span{
  font-size:14px;
  font-weight:700;
  color:rgba(11,18,32,.7);
  margin-left:6px;
}
.priceCard__name{
  font-weight:800;
  color:rgba(11,18,32,.75);
}

.priceCard__line{
  height:1px;
  background:#e4e7ee;
  margin:16px 0 18px;
}

/* =========================
   Steps
========================= */
.steps{
  padding:74px 0 44px;
}

.stepCard{
  background: var(--card2);
  border:1px solid rgba(76,111,255,.14);
  border-radius: 28px;
  padding: 44px;
  text-align:center;
  margin-top: 20px;
}

.stepBadge{
  width:46px;
  height:46px;
  border-radius:999px;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
  background: var(--blue);
  color:#fff;
  font-weight:900;
  box-shadow: var(--shadow2);
}

.stepTitle{
  margin:0 0 10px;
  font-size:22px;
  font-weight:900;
}

.storeRow{
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:16px;
}

.storeBtn{
  text-decoration:none;
  font-weight:900;
  padding:12px 16px;
  border-radius:12px;
  background:#111;
  color:#fff;
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}
.storeBtn:hover{ filter:brightness(1.06); }

.stepCta{
  margin-top:16px;
  display:flex;
  justify-content:center;
}

/* =========================
   Reviews
========================= */
.reviews{
  padding:74px 0 84px;
}

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

.review{
  background:#fff;
  border:1px solid #eceef2;
  border-radius:24px;
  padding:28px;
  /*box-shadow: var(--shadow);*/
}

.reviewHead{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.reviewAvatar img{
  width:44px;
  height:44px;
  border-radius:999px;
  /*background:#d9dbe2 center/cover no-repeat;*/
  border:1px solid rgba(15,40,70,.10);
}

/* Подставь реальные фотки */
/*.reviewAvatar.av--1{ background-image:url("./pic/joan.jpg"); }
.reviewAvatar.av--2{ background-image:url("./pic/lenem-1.jpg"); }
.reviewAvatar.av--3{ background-image:url("./pic/marriane.jpg"); }
.reviewAvatar.av--4{ background-image:url("./pic/christina-min_375x375.png"); }
.reviewAvatar.av--5{ background-image:url("./pic/per.jpg"); }*/


.reviewName{ font-weight:900; }
.reviewAge{ color:var(--blue); font-weight:800; font-size:13px; }

.reviewTitle{
  margin:0 0 10px;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.01em;
  color:rgba(11,18,32,.92);
}

/* =========================
   Lead
========================= */
.lead{
  padding: 0 0 84px;
}

.leadBox{
  width:min(760px, 100%);
  margin: 0 auto;
  background:#fff;
  border:1px solid #eceef2;
  border-radius:28px;
  padding:36px;
  box-shadow: var(--shadow);
  text-align:center;
}

.leadTitle{
  margin:0 0 10px;
  font-size:26px;
  font-weight:900;
}

.leadForm{
  display:flex;
  gap:12px;
  justify-content:center;
  margin-top:14px;
  flex-wrap:wrap;
}

.leadInput{
  min-width:280px;
  flex: 1;
  max-width:420px;
  border-radius:999px;
  border:1px solid #e5e8ef;
  padding:14px 16px;
  outline:none;
  font-weight:650;
  background:#fff;
}
.leadInput:focus{
  border-color: rgba(76,111,255,.45);
  box-shadow: 0 0 0 4px rgba(76,111,255,.14);
}

.leadFine{
  margin:14px 0 0;
  color:rgba(11,18,32,.65);
  font-weight:650;
  font-size:13px;
}
.leadFine a{
  color:rgba(11,18,32,.85);
  text-decoration:underline;
}

/* =========================
   Footer
========================= */
.footer{
  padding:64px 0 22px;
  border-top:1px solid var(--line);
  background:#fff;
}

.footer__grid{
  display:grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 26px;
}

.footerCol .brand--footer{ margin-bottom:10px; }

.footerTitle{
  font-weight:900;
  margin-bottom:12px;
}
.footerLink{
  display:block;
  text-decoration:none;
  color:rgba(11,18,32,.70);
  font-weight:650;
  margin-bottom:10px;
}
.footerLink:hover{ color:rgba(11,18,32,.92); }

.footerText{
  color:rgba(11,18,32,.72);
  font-weight:650;
  margin-bottom:10px;
  font-size:14px;
}

.footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-top: 18px;
  border-top:1px solid var(--line);
  color:rgba(11,18,32,.55);
  font-weight:650;
  font-size:13px;
}

.footerBottomLink{
  color:rgba(11,18,32,.65);
  text-decoration:none;
  font-weight:800;
}
.footerBottomLink:hover{ color:rgba(11,18,32,.92); }

/* =========================
   Responsive
========================= */

/* <= 1024px (tablet landscape) */
@media (max-width: 1024px){

  :root{ --container: 980px; }

  .hero{
    padding: 56px 0 84px;
  }

  .hero__inner{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .hero__right{
    min-height: auto;
    display: grid;
    place-items: center;
  }

  .heroPhoto{
    width: min(420px, 100%);
    height: 420px;
  }

  .heroPhoto__bgAccent{
    right: 22px;
    top: 14px;
    width: 86%;
    height: 100%;
  }

  .panel{
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 38px;
  }

  .panel__col--border{
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid #e8ebf1;
    padding-top: 28px;
  }

  .pricing{
    padding: 56px 0;
  }

  .pricing__grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .steps{
    padding: 56px 0 36px;
  }

  .reviews{
    padding: 56px 0 64px;
  }

  .reviewGrid{
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .footer__grid{
    grid-template-columns: 1fr 1fr;
    gap: 26px;
  }
}

/* <= 768px (tablet / small) */
@media (max-width: 768px){

  .container{
    width: min(var(--container), calc(100% - 24px));
  }

  /* Topbar: меню в одну линию + горизонтальный скролл */
  .topbar__inner{
    flex-wrap: wrap;
    gap: 12px;
  }

  .nav{
    width: 100%;
    order: 3;
    gap: 18px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
  }

  .nav::-webkit-scrollbar{ height: 6px; }
  .nav::-webkit-scrollbar-thumb{
    background: rgba(11,18,32,.12);
    border-radius: 999px;
  }

  .nav__link{
    white-space: nowrap;
  }

  .hero__title{
    font-size: 36px;
  }

  .centerTitle{
    font-size: 26px;
    margin-bottom: 26px;
  }

  .panel{
    padding: 30px;
  }

  .priceCard{
    padding: 26px;
  }

  .stepCard{
    padding: 30px;
  }

  .review{
    padding: 22px;
  }

  .footer__bottom{
    flex-direction: column;
    align-items: flex-start;
  }
}

/* <= 560px (mobile) */
@media (max-width: 560px){

  .topbar__inner{
    padding: 12px 0;
  }

  .brand__name{
    font-size: 16px;
  }

  .pill{
    padding: 9px 14px;
    font-size: 13px;
  }

  .hero{
    padding: 44px 0 64px;
  }

  .hero__title{
    font-size: 30px;
  }

  .hero__actions{
    flex-direction: column;
    align-items: stretch;
  }

  .hero__actions .btn{
    width: 100%;
  }

  .heroPhoto{
    width: min(340px, 100%);
    height: 360px;
  }

  .heroPhoto__bgAccent{
    right: 14px;
    top: 10px;
    width: 90%;
  }

  .panel{
    padding: 22px;
    border-radius: 22px;
  }

  .panel__col--border{
    padding-top: 20px;
  }

  .stepCard{
    padding: 22px;
  }

  .storeRow{
    flex-direction: column;
    align-items: stretch;
  }

  .storeBtn{
    width: 100%;
    text-align: center;
  }

  .leadBox{
    padding: 22px;
  }

  .leadForm{
    flex-direction: column;
    align-items: stretch;
  }

  .leadInput{
    min-width: 0;
    max-width: 100%;
    width: 100%;
  }

  .leadForm .btn{
    width: 100%;
  }

  .footer__grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* <= 380px (very small phones) */
@media (max-width: 380px){
  .hero__title{ font-size: 27px; }
  .heroPhoto{ height: 330px; }
  .btn{ padding: 13px 16px; }
}
  


/* reviewGrid больше не grid */
.reviewGrid{
  display: block;
  margin-top: 24px;
}

/* ГЛАВНОЕ: чтобы Splide не растягивал/не “ломал” форму карточек */
#diets-slider .splide__slide{
  padding: 0 !important;
  display: flex;            /* карточка внутри не схлопнется */
  height: auto;
}

#diets-slider .splide__slide .review{
  width: 100%;
  height: 100%;
  border-radius: 24px;      /* твоя форма */
  overflow: hidden;         /* чтобы ничего не “выпирало” */
}

/* расстояние между карточками как раньше */
#diets-slider .splide__track{
  padding: 0;               /* без внутренних отступов */
}



/* мобилка: можно чуть уменьшить паддинг, но форма та же */
@media (max-width: 560px){
  #diets-slider .splide__slide .review{ padding: 22px; }
}


/* =========================
   Mockup sections (Mine Knogler / Viden)
   Изолировано префиксом mk-
   ========================= */

.mk-section{
  background: #fff;
  padding: clamp(48px, 6vw, 88px) 0;
}

/* первая секция: текст слева, телефон справа */
.mk-hero{
  display: grid;
  grid-template-columns: minmax(280px, 1.15fr) minmax(260px, 0.85fr);
  align-items: center;
  gap: clamp(28px, 5vw, 72px);
}

.mk-title{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 14px;
  color: #0f172a;
}

.mk-lead{
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: #334155;
  max-width: 62ch;
}

.mk-stores{
  display: flex;
  gap: 14px;
  margin-top: 22px;
  align-items: center;
}

.mk-store img{
  height: 44px; /* как на скрине */
  width: auto;
  display: block;
}

/* телефон */
.mk-hero__media{
  display: flex;
  justify-content: flex-end;
}

.mk-phone{
  width: min(360px, 100%);
  height: auto;
  display: block;
  filter: drop-shadow(0 24px 40px rgba(15, 23, 42, 0.20));
}

/* вторая секция: телефон слева сверху, текст ниже */
.mk-viden{
  display: block;
}


.mk-viden__text .mk-lead{
  max-width: 72ch;
}

/* адаптив как на макетах: на узких экранах складываем */
@media (max-width: 900px){
  .mk-hero,
  .mk-viden{
    grid-template-columns: 1fr;
  }

  .mk-hero__media{
    justify-content: center;
    order: -1; /* телефон сверху на мобилке */
    margin-bottom: 10px;
  }

  .mk-viden__media{
    justify-content: center;
  }

}



/* =========================
   Team page (Advisors) — matches mockup
   ========================= */

.teamPage{
  background:#fff;
  padding: 42px 0 70px;
}

.teamPage__inner{
  text-align:center;
}

.teamPage__eyebrow{
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.4;
  color: #64748b;
  font-weight: 500;
}

.teamPage__title{
  margin: 0 0 36px;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.teamGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 44px;
  row-gap: 34px;
  align-items:start;
}

.teamCard{
  display:flex;
  flex-direction:column;
  align-items:center;
}

.teamCard__avatar{
  width: 120px;
  height: 120px;
  border-radius: 999px;
  background: #cfe7f5;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-bottom: 14px;
}

.teamCard__avatar img{
  width: 112px;
  height: 112px;
  border-radius: 999px;
  object-fit: cover;
  display:block;
}

.teamCard__name{
  margin: 0 0 4px;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 800;
  color: #0f172a;
}

.teamCard__role{
  margin: 0 0 10px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
  color: #64748b;
}

.teamCard__text{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  color: #334155;
  max-width: 36ch;
}

@media (max-width: 980px){
  .teamGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
  }
}

@media (max-width: 640px){
  .teamPage{
    padding: 34px 0 56px;
  }
  .teamGrid{
    grid-template-columns: 1fr;
    row-gap: 28px;
  }
  .teamCard__text{
    max-width: 46ch;
  }
}


/* =======================
   Advertising label
   ======================= */
.ad-label{
  width: 100%;
  background: #111827;
  color: #fff;
  text-align: center;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 12px;
  padding: 10px 12px;
}

/* =======================
   Cookie banner
   ======================= */
.cookie{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 9999;
  display: none; /* показываем через JS */
}

.cookie.is-visible{
  display: block;
}

.cookie__inner{
  max-width: 980px;
  margin: 0 auto;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 18px 50px rgba(15,23,42,.18);
  border-radius: 16px;
  padding: 14px 16px;
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  backdrop-filter: blur(8px);
}

.cookie__text p{
  margin: 4px 0 0;
  color: #475569;
  font-size: 14px;
  line-height: 1.35;
}

.cookie__actions{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.cookie__link{
  font-size: 14px;
  color: #2563eb;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 560px){
  .cookie__inner{
    flex-direction: column;
    align-items: stretch;
  }
  .cookie__actions{
    width: 100%;
    justify-content: space-between;
  }
}


#logos-slider {
  height: 150px;
}

#logos-slider .splide__track,
#logos-slider .splide__list,
#logos-slider .splide__slide {
  height: 150px;
}

#logos-slider .splide__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

#logos-slider img {
  max-height: 120px;
  max-width: 100%;
  object-fit: contain;
}


/* =========================
   mk-section: 2 items layout
========================= */

.mk-section{
  padding: clamp(56px, 7vw, 96px) 0;
  background: #fff;
}

.mk-grid-2{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}

/* Один элемент */
.mk-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Картинка сверху */
.mk-item__image{
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 22px;
}

.mk-item__image img{
  width: min(360px, 100%);
  height: auto;
  filter: drop-shadow(0 24px 40px rgba(15, 23, 42, 0.18));
}

/* Контент снизу */
.mk-item__content{
  max-width: 56ch;
}

.mk-item__title{
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.mk-item__text{
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: #334155;
}

/* =========================
   Адаптив
========================= */

@media (max-width: 900px){
  .mk-grid-2{
    grid-template-columns: 1fr;
  }

  .mk-item{
    text-align: center;
  }

  .mk-item__image{
    margin-bottom: 18px;
  }
}

.mk-grid-2--single{
  justify-items: center;
}

.mk-grid-2--single .mk-item{
  grid-column: 1 / -1;
}