/* Блок карточек «Какой шоколад / Какие подарки можно заказать». Стиль макета Е: Onest, петроль + латунь, цены коричневым.
   Переменные берутся из макета (--petrol, --latun, --choc, --noch, --mute, --txt, --zag), запасные значения прописаны. */
.kt-grid{--kt-radius:16px;--kt-gap:20px;list-style:none;margin:var(--zag-sod,56px) 0 0;padding:0;display:grid;gap:var(--kt-gap);
 grid-template-columns:repeat(4,minmax(0,1fr))}
.kt-card{display:flex;flex-direction:column;min-width:0;background:#fff;border-radius:var(--kt-radius);overflow:hidden;
 box-shadow:0 1px 0 rgba(18,38,43,.04),0 14px 30px -24px rgba(18,38,43,.22);transition:box-shadow .25s,transform .25s}
.kt-card:hover,.kt-card:focus-within{box-shadow:0 1px 0 rgba(18,38,43,.04),0 22px 40px -22px rgba(18,38,43,.35);transform:translateY(-2px)}
/* фото 3:4, карусель на нативной прокрутке со скролл-снэпом: палец листает сам, мышь листает по зонам (kt.js) */
.kt-ph{position:relative;display:block;padding-top:133.333%;background:#F3F4F4;overflow:hidden;color:inherit;text-decoration:none}
.kt-track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
 scrollbar-width:none;-webkit-overflow-scrolling:touch}
.kt-track::-webkit-scrollbar{display:none}
.kt-track img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:start;scroll-snap-stop:always;-webkit-user-drag:none;user-select:none}
.kt-bars{position:absolute;left:12px;right:12px;bottom:10px;display:flex;gap:4px;pointer-events:none}
.kt-bars i{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.55);box-shadow:0 0 0 .5px rgba(18,38,43,.25),0 1px 3px rgba(18,38,43,.25);transition:background .2s}
.kt-bars i.on{background:#fff}
.kt-badge{position:absolute;left:12px;top:12px;z-index:2;font:600 12px/1 var(--txt,"Onest",system-ui,-apple-system,sans-serif);letter-spacing:.02em;padding:7px 10px;border-radius:4px;pointer-events:none}
.kt-badge{box-shadow:0 2px 6px rgba(11,48,57,.35),0 0 0 1px rgba(255,255,255,.4)}
.kt-badge--hit{background:var(--latun,#D9A441);color:var(--petrol,#0F3D47)}
.kt-badge--rec{background:var(--petrol,#0F3D47);color:#fff}
.kt-body{display:flex;flex-direction:column;flex:1;padding:18px 20px 20px;font-family:var(--txt,"Onest",system-ui,-apple-system,sans-serif)}
.kt-grid .kt-name{margin:0;font:600 16.5px/1.35 var(--txt,"Onest",system-ui,-apple-system,sans-serif);letter-spacing:0;text-transform:none;color:var(--noch,#12262B);
 display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;min-height:2.7em}
.kt-grid .kt-name a{color:inherit;text-decoration:none}
.kt-grid .kt-name a:hover{text-decoration:underline;text-decoration-color:var(--latun,#D9A441);text-underline-offset:3px}
.kt-price{margin:14px 0 0;font:400 15px/1.2 var(--txt,"Onest",system-ui,sans-serif);color:var(--mute,#5C686B)}
.kt-price b{font:600 30px/1.1 var(--zag,"Playfair",Georgia,serif);font-feature-settings:"lnum" 1,"pnum" 1;color:var(--choc,#5A3A2B);margin-left:2px;white-space:nowrap}
.kt-note{margin:5px 0 0;font:400 12.5px/1.35 var(--txt,"Onest",system-ui,sans-serif);color:var(--mute,#5C686B)}
.kt-min{margin:8px 0 18px;font:400 14px/1.3 var(--txt,"Onest",system-ui,sans-serif);color:var(--mute,#5C686B)}
.kt-btn{margin-top:auto;display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:0;border-radius:4px;color:#fff;text-decoration:none;
 font:600 15.5px/1.2 var(--txt,"Onest",system-ui,sans-serif);letter-spacing:.01em;text-align:center;cursor:pointer;
 background:linear-gradient(180deg,var(--petrol-s,#246E7F) 0%,var(--petrol,#0F3D47) 55%,var(--petrol-t,#0B3039) 100%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.28),0 1px 2px rgba(11,48,57,.4),0 10px 20px -10px rgba(15,61,71,.6);
 text-shadow:0 1px 0 rgba(0,0,0,.22);transition:filter .15s,transform .15s}
.kt-btn:hover{filter:brightness(1.12)}
.kt-btn:active{background:var(--petrol-t,#0B3039);filter:none;transform:translateY(1px)}
.kt-btn:focus-visible,.kt-ph:focus-visible,.kt-name a:focus-visible{outline:3px solid var(--latun,#D9A441);outline-offset:3px}
@media(max-width:1180px){.kt-body{padding:14px 14px 16px} .kt-grid .kt-name{font-size:14.5px}.kt-price b{font-size:26px}.kt-note{margin:5px 0 0;font:400 12.5px/1.35 var(--txt,"Onest",system-ui,sans-serif);color:var(--mute,#5C686B)}
.kt-min{margin-bottom:14px}}
@media(max-width:1099px){.kt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kt-body{padding:18px 20px 20px} .kt-grid .kt-name{font-size:16.5px}.kt-price b{font-size:30px}}
@media(max-width:639px){.kt-grid{grid-template-columns:minmax(0,1fr);--kt-gap:16px;margin-top:var(--zag-sod,32px)}
 .kt-bars{left:16px;right:16px;bottom:14px;gap:5px}.kt-bars i{height:4px}.kt-badge{left:16px;top:16px;font-size:12.5px}
  .kt-grid .kt-name{font-size:17px}.kt-btn{min-height:52px}}
@media(prefers-reduced-motion:reduce){.kt-card,.kt-card:hover,.kt-card:focus-within{transition:none;transform:none}.kt-bars i,.kt-btn{transition:none}}