/*
Theme Name: Flekk — Корзина Терракот
Theme URI: https://flekk.ru/
Description: Шаблон лендинга для доставки фермерских продуктов, наборов еды и хозяйств. Светлая бумага, серифная Literata в заголовках, терракота акцентом, кремовая полоса наборов и тёмная гарантия. Дочерняя тема Hello Elementor.
Author: Flekk
Template: hello-elementor
Version: 1.0.0
Text Domain: flekk-korzina
*/

/* ── Токены ─────────────────────────────────────────────── */
:root{
  --flk-bg:#FBFAF7;
  --flk-ink:#20180F;
  --flk-dim:#6F6558;
  --flk-dim2:#8A8072;
  --flk-terra:#B5442A;
  --flk-terra-dk:#8A3620;
  --flk-cream:#F4EFE7;
  --flk-plate:#F1E7DF;
  --flk-dark:#241C16;
  --flk-dark-ink:#F7F2EA;
  --flk-dark-dim:rgba(247,242,234,.7);
  --flk-ln:#E8E2D8;
  --flk-fld:#E0D9CD;

  --flk-band:1720px;
  --flk-pad:clamp(20px,4.4vw,100px);
  --flk-sans:"Manrope",system-ui,-apple-system,sans-serif;
  --flk-disp:"Literata",Georgia,serif;

  --flk-h1:clamp(32px,3.7vw,70px);
  --flk-h2:clamp(28px,2.8vw,52px);
  --flk-h3:clamp(19px,1.3vw,24px);
  --flk-body:clamp(16px,1vw,19px);
  --flk-small:clamp(16px,.85vw,17px);
  --flk-sec:clamp(52px,6vw,110px);
}

/* ── Основа ─────────────────────────────────────────────── */
body{
  background:var(--flk-bg);
  color:var(--flk-ink);
  font-family:var(--flk-sans);
  font-size:var(--flk-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body h1,body h2,body h3,body h4{
  font-family:var(--flk-disp);
  font-weight:600;
  letter-spacing:-.02em;
  margin:0;
  color:inherit;
}
body h1{font-size:var(--flk-h1);line-height:1.1}
body h2{font-size:var(--flk-h2);line-height:1.1;text-wrap:balance}
/* Названия карточек — гротеск: серифом на этом кегле они спорят с заголовками секций */
body h3{font-family:var(--flk-sans);font-weight:800;font-size:var(--flk-h3);line-height:1.25;letter-spacing:-.01em}
body p{margin:0}
body a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}

/* Набор Elementor красит, кеглит и утолщает виджеты по-своему — забираем
   обратно. Размер НЕ трогаем: font-size:inherit схлопнет заголовки. */
body .elementor-widget-heading h1.elementor-heading-title,
body .elementor-widget-heading h2.elementor-heading-title{color:inherit;font-family:var(--flk-disp);font-weight:600}
body .elementor-widget-heading h3.elementor-heading-title{color:inherit;font-family:var(--flk-sans);font-weight:800}
body .elementor-widget-text-editor{color:inherit}
body .elementor-widget-text-editor p:first-child{margin-top:0}
body .elementor-widget-text-editor p:last-child{margin-bottom:0}
body .elementor-widget:not(:last-child){margin-bottom:0}
body .elementor-column > .elementor-widget-wrap{padding:0;align-items:stretch}
body .elementor-section[class*="flk-"] > .elementor-container > .elementor-column{width:100%}

/* Полоса контента: в режиме full_width Elementor свой content_width не применяет */
body .elementor-section > .elementor-container{
  max-width:var(--flk-band);
  margin-inline:auto;
  padding-inline:var(--flk-pad);
}

/* ── Шапка ──────────────────────────────────────────────── */
.flk-header{background:var(--flk-bg);position:relative;z-index:5}
.flk-band{
  max-width:var(--flk-band);
  margin-inline:auto;
  padding:16px var(--flk-pad);
  display:flex;
  align-items:center;
  gap:clamp(18px,2.6vw,56px);
}
.flk-header .flk-mark{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-family:var(--flk-disp);
  font-weight:600;
  font-size:clamp(21px,1.5vw,28px);
  letter-spacing:-.02em;
  color:var(--flk-ink);
}
.flk-nav ul{display:flex;gap:clamp(16px,1.7vw,32px);list-style:none;margin:0;padding:0}
.flk-nav a{color:var(--flk-dim);font-size:var(--flk-small);display:inline-flex;align-items:center;min-height:44px}
.flk-nav a:hover{color:var(--flk-ink)}
.flk-header .flk-tel{
  margin-left:auto;
  font-weight:700;
  font-size:var(--flk-small);
  color:var(--flk-ink);
  display:inline-flex;
  align-items:center;
  min-height:44px;
}
.flk-burger{position:relative}
.flk-burger > summary{display:none}

/* ── Кнопки ─────────────────────────────────────────────── */
body .elementor-widget-button .elementor-button{
  background-color:var(--flk-terra);
  color:#fff;
  border-radius:4px;
  font-family:var(--flk-sans);
  font-weight:700;
  font-size:var(--flk-small);
  padding:21px 44px;
  min-height:44px;
  transition:background-color .15s;
}
body .elementor-widget-button .elementor-button:hover{background-color:var(--flk-terra-dk)}
body .flk-btn-wide .elementor-button{width:100%;justify-content:center;padding-inline:20px}

/* ── Секции ─────────────────────────────────────────────── */
body .flk-sec > .elementor-container{padding-block:var(--flk-sec)}
body .flk-lede{color:var(--flk-dim);max-width:52ch}
body .flk-note{color:var(--flk-dim);font-size:var(--flk-small)}
body .flk-desc{color:var(--flk-dim);font-size:var(--flk-small);line-height:1.55}

/* Плашка над заголовком первого экрана */
body .flk-bar p{
  display:inline-flex;
  align-items:center;
  background:var(--flk-plate);
  color:var(--flk-terra-dk);
  font-size:var(--flk-small);
  font-weight:700;
  padding:11px 18px;
  border-radius:999px;
}

/* Шапка блока: заголовок слева, пояснение справа */
body .flk-shead > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(20px,4vw,80px);
  align-items:end;
  padding-block:var(--flk-sec) clamp(28px,3vw,52px);
}
body .flk-shead-solo > .elementor-container{grid-template-columns:minmax(0,1fr)}

/* Фотография: пропорция задаётся секцией, по умолчанию — кадр карточки */
.flk-photo{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/10;
  border-radius:8px 8px 0 0;
  background:linear-gradient(150deg,#B7C39A 0%,#7E9463 48%,#3C4A2C 100%);
}
.flk-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Карточка на бумаге */
body .flk-tile{
  background:#fff;
  border:1px solid var(--flk-ln);
  border-radius:8px;
  overflow:hidden;
}

/* ── 1. Первый экран ────────────────────────────────────── */
body .flk-hero > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,560px);
  gap:clamp(24px,3.4vw,60px);
  align-items:end;
  padding-block:clamp(48px,5vw,96px) clamp(28px,3vw,56px);
}
body .flk-hero h1{margin-top:clamp(16px,1.5vw,26px)}
body .flk-hero-side{padding-bottom:6px}
body .flk-hero-side .elementor-widget-button{margin-top:clamp(20px,1.8vw,30px)}
body .flk-hero-side .flk-note{margin-top:clamp(10px,.8vw,14px)}

/* Четыре карточки продуктов под первым экраном */
body .flk-cards > .elementor-container{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(16px,1.6vw,28px);
  padding-bottom:clamp(48px,5vw,96px);
}
body .flk-card{background:#fff;border:1px solid var(--flk-ln);border-radius:8px;overflow:hidden}
body .flk-card h3{padding:20px 22px 0}
body .flk-card .flk-desc{padding:8px 22px 22px}

/* ── 2. Доверие ─────────────────────────────────────────── */
body .flk-trust > .elementor-container{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,2.4vw,48px);
  padding-block:clamp(32px,3.4vw,48px);
  border-top:1px solid var(--flk-ln);
  border-bottom:1px solid var(--flk-ln);
}
body .flk-fact .flk-fn{
  display:block;
  font-family:var(--flk-disp);
  font-weight:600;
  font-size:clamp(28px,2.2vw,42px);
  line-height:1.05;
  letter-spacing:-.02em;
}
/* 🔴 Общее правило отступов виджетов перебивает класс — вес поднимаем секцией */
body .flk-trust .flk-fact .flk-fl{display:block;margin-top:8px;font-size:var(--flk-small);color:var(--flk-dim)}

/* ── 3. Что привозим ────────────────────────────────────── */
body .flk-offer > .elementor-container{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,1.6vw,28px);
  padding-bottom:var(--flk-sec);
}
body .flk-oitem{background:#fff;border:1px solid var(--flk-ln);border-radius:8px;overflow:hidden;display:flex}
body .flk-oitem > .elementor-widget-wrap{display:flex;flex-direction:row;align-items:stretch;flex-wrap:nowrap}
body .flk-oitem .elementor-widget-shortcode{width:clamp(160px,17vw,300px);flex:none}
body .flk-oitem .flk-photo{aspect-ratio:auto;height:100%;min-height:180px;border-radius:0}
body .flk-oitem .flk-otext{padding:clamp(22px,1.8vw,34px)}
body .flk-oitem .flk-otext .flk-desc{margin-top:12px}

/* ── 4. Наборы ──────────────────────────────────────────── */
body .flk-price-sec{background:var(--flk-cream)}
body .flk-price-sec > .elementor-container{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(16px,1.6vw,28px);
  padding-bottom:var(--flk-sec);
}
body .flk-phead{background:var(--flk-cream)}
body .flk-pack{
  background:#fff;
  border:1px solid var(--flk-ln);
  border-radius:8px;
  padding:clamp(24px,1.9vw,34px);
  display:flex;
  flex-direction:column;
}
body .flk-pack > .elementor-widget-wrap{display:flex;flex-direction:column}
body .flk-pack .flk-sum{
  font-family:var(--flk-disp);
  font-weight:600;
  font-size:clamp(26px,2.1vw,40px);
  line-height:1.1;
  color:var(--flk-terra);
  margin-top:12px;
  white-space:nowrap;
}
body .flk-pack .flk-desc{margin-top:14px}
/* Кнопка прижата к низу карточки: наборы описаны разной длиной строк */
body .flk-pack .elementor-widget-button{margin-top:auto;padding-top:clamp(18px,1.6vw,26px)}

/* ── 5. Как это работает ────────────────────────────────── */
body .flk-steps > .elementor-container{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(24px,2.4vw,44px);
  padding-bottom:var(--flk-sec);
}
body .flk-steps .flk-num{
  font-family:var(--flk-disp);
  font-weight:600;
  font-size:clamp(30px,2.3vw,44px);
  line-height:1;
  color:#D6CCBB;
  margin-bottom:10px;
}
body .flk-steps .flk-desc{margin-top:10px}

/* ── 6. Откуда продукты ─────────────────────────────────── */
body .flk-origin > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,720px);
  gap:clamp(28px,3.4vw,64px);
  align-items:start;
  padding-bottom:var(--flk-sec);
}
body .flk-origin .flk-lede{margin-top:clamp(14px,1.2vw,20px)}
body .flk-origin h3{margin-top:clamp(26px,2.4vw,44px)}
body .flk-origin .flk-desc{margin-top:12px;max-width:70ch}
body .flk-origin .flk-oline{
  margin-top:clamp(24px,2.2vw,36px);
  padding-top:clamp(24px,2.2vw,36px);
  border-top:1px solid var(--flk-ln);
}
body .flk-origin .flk-photo{aspect-ratio:9/7;border-radius:8px}

/* ── 7. Гарантия ────────────────────────────────────────── */
body .flk-guar{background:var(--flk-dark);color:var(--flk-dark-ink)}
body .flk-guar > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,640px) minmax(0,1fr);
  gap:clamp(28px,4vw,80px);
  padding-block:var(--flk-sec);
}
body .flk-guar .flk-lede{color:var(--flk-dark-dim);margin-top:clamp(14px,1.2vw,20px)}
body .flk-guar .flk-desc{color:var(--flk-dark-dim);margin-top:12px}
body .flk-guar .flk-gpair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,2.4vw,44px)}

/* ── 8. Отзывы ──────────────────────────────────────────── */
body .flk-revs > .elementor-container{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,1.6vw,28px);
  padding-bottom:var(--flk-sec);
}
body .flk-rev{
  background:#fff;
  border:1px solid var(--flk-ln);
  border-radius:8px;
  padding:clamp(26px,2.2vw,42px);
}
body .flk-rev .flk-rtext{line-height:1.7}
body .flk-rev .flk-rwho{margin-top:clamp(16px,1.4vw,22px);color:var(--flk-dim);font-size:var(--flk-small);font-weight:700}

/* ── 9. Вопросы ─────────────────────────────────────────── */
body .flk-faq > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,420px) minmax(0,1fr);
  gap:clamp(24px,4vw,80px);
  padding-block:var(--flk-sec);
  align-items:start;
}
body .flk-q{border-top:1px solid var(--flk-ln);padding-top:clamp(18px,1.5vw,28px);margin-top:clamp(18px,1.5vw,28px)}
body .flk-qlist .flk-q:first-child{margin-top:0}
body .flk-a{color:var(--flk-dim);margin-top:10px}
/* 🔴 Длину строки ограничиваем абзацу, а не виджету: у виджета укоротится граница */
body .flk-a p{max-width:70ch}
body .flk-faq-end{border-bottom:1px solid var(--flk-ln);padding-bottom:clamp(18px,1.5vw,28px)}

/* ── 10. Призыв ─────────────────────────────────────────── */
body .flk-cta{position:relative;overflow:hidden;background:var(--flk-dark);color:var(--flk-dark-ink)}
body .flk-cta > .elementor-container{
  position:static;
  padding-block:clamp(56px,6vw,120px);
  max-width:var(--flk-band);
}
body .flk-cta > .elementor-container > .elementor-column:not(.flk-bg-col){position:relative;z-index:2;max-width:900px}
body .flk-cta .flk-lede{color:var(--flk-dark-dim);margin-top:clamp(14px,1.2vw,22px)}
body .flk-cta .elementor-widget-button{margin-top:clamp(22px,2vw,36px)}
body .flk-cta .elementor-widget-shortcode{position:static}
/* Колонка полотна выведена из потока: внутри обычной колонки слой обрезался бы по ней */
body .flk-bg-col{position:absolute;inset:0;padding:0;width:auto;z-index:0}
body .flk-bg-col .elementor-widget-wrap{display:block}
.flk-cta-back{position:absolute;inset:0;z-index:0;background:linear-gradient(150deg,#B7C39A 0%,#7E9463 48%,#3C4A2C 100%)}
.flk-cta-back img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.flk-cta-back::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(36,28,22,.95) 0%,rgba(36,28,22,.78) 58%,rgba(36,28,22,.45) 100%)}

/* ── 11. Контакты ───────────────────────────────────────── */
body .flk-contacts > .elementor-container{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,640px);
  gap:clamp(28px,3.4vw,64px);
  padding-block:var(--flk-sec);
  align-items:start;
}
body .flk-contacts .flk-lede{margin-top:clamp(14px,1.2vw,20px)}
.flk-cline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2vw,36px);margin-top:clamp(24px,2.2vw,40px)}
.flk-cline > div{border-top:1px solid var(--flk-ln);padding-top:clamp(14px,1.2vw,22px)}
.flk-cl{font-size:clamp(13px,.8vw,15px);letter-spacing:.12em;text-transform:uppercase;color:var(--flk-dim)}
/* Ссылку красит ссылочный цвет набора (класс + тег) — вес поднимаем секцией */
body .flk-contacts .flk-cv{
  color:var(--flk-ink);
  display:inline-flex;
  align-items:center;
  min-height:44px;
  margin-top:4px;
  font-size:clamp(19px,1.2vw,22px);
  font-weight:800;
}

/* Форма */
body .flk-contacts .flk-form-wrap{
  background:#fff;
  border:1px solid var(--flk-ln);
  border-radius:8px;
  padding:clamp(24px,2vw,40px);
}
.flk-form-wrap .flk-fhead{font-size:clamp(19px,1.3vw,24px);font-weight:800;margin-bottom:18px}
.flk-form-wrap .flk-field{margin-bottom:14px}
.flk-form-wrap br{display:none}
.flk-form-wrap input[type=text],
.flk-form-wrap input[type=tel],
.flk-form-wrap input[type=email],
.flk-form-wrap textarea{
  width:100%;
  background:var(--flk-bg);
  border:1px solid var(--flk-fld);
  border-radius:4px;
  color:var(--flk-ink);
  font-family:var(--flk-sans);
  font-size:var(--flk-small);
  padding:17px 18px;
  min-height:56px;
}
.flk-form-wrap textarea{min-height:120px;resize:vertical}
.flk-form-wrap ::placeholder{color:var(--flk-dim2)}
.flk-form-wrap input:focus,.flk-form-wrap textarea:focus{outline:none;border-color:var(--flk-terra)}
/* 🔴 CF7 заворачивает строку кнопки в свой <p> — ряд строим на нём. */
.flk-form-wrap .flk-form-foot > p{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:0}
.flk-form-wrap input[type=submit]{
  background:var(--flk-terra);
  color:#fff;
  border:0;
  border-radius:4px;
  font-family:var(--flk-sans);
  font-weight:700;
  font-size:var(--flk-small);
  padding:20px 42px;
  min-height:56px;
  cursor:pointer;
}
.flk-form-wrap input[type=submit]:hover{background:var(--flk-terra-dk)}
.flk-form-note{color:var(--flk-dim);font-size:var(--flk-small);margin-top:14px}
.flk-form-wrap .wpcf7-not-valid-tip{color:var(--flk-terra);font-size:var(--flk-small);margin-top:6px}
.flk-form-wrap .wpcf7-response-output{
  border:1px solid var(--flk-fld);
  color:var(--flk-ink);
  font-size:var(--flk-small);
  margin:18px 0 0;
  padding:16px 18px;
  border-radius:4px;
}

/* ── Подвал ─────────────────────────────────────────────── */
.flk-footer{background:var(--flk-bg);color:var(--flk-ink);border-top:1px solid var(--flk-ln)}
.flk-footer .flk-band{padding-block:clamp(24px,2.4vw,40px);flex-wrap:wrap;row-gap:12px}
.flk-footer .flk-mark{font-family:var(--flk-disp);font-weight:600;font-size:clamp(19px,1.3vw,24px);letter-spacing:-.02em}
.flk-footer span{font-size:var(--flk-small);color:var(--flk-dim)}
/* Касание не меньше 44px: ссылки подвала лежат внутри строки текста */
.flk-footer span a{display:inline-flex;align-items:center;min-height:44px}
.flk-footer .flk-fend{margin-left:auto}
.flk-footer .flk-fend a{color:var(--flk-terra);display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.flk-footer a:hover{color:var(--flk-ink)}

/* ── Планшет ────────────────────────────────────────────── */
@media (max-width:1100px){
  body .flk-hero > .elementor-container{grid-template-columns:minmax(0,1fr);align-items:start}
  body .flk-cards > .elementor-container,
  body .flk-price-sec > .elementor-container,
  body .flk-steps > .elementor-container,
  body .flk-trust > .elementor-container{grid-template-columns:repeat(2,minmax(0,1fr))}
  body .flk-origin > .elementor-container,
  body .flk-guar > .elementor-container,
  body .flk-faq > .elementor-container,
  body .flk-contacts > .elementor-container{grid-template-columns:minmax(0,1fr)}
}

/* ── Телефон ────────────────────────────────────────────── */
@media (max-width:760px){
  .flk-burger > summary{
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    margin-left:auto;
    list-style:none;
    box-shadow:inset 0 0 0 1px var(--flk-fld);
    border-radius:4px;
    cursor:pointer;
  }
  .flk-burger > summary::-webkit-details-marker{display:none}
  .flk-burger > summary::after{
    content:"";
    width:18px;
    height:1px;
    background:var(--flk-ink);
    box-shadow:0 -6px 0 var(--flk-ink),0 6px 0 var(--flk-ink);
  }
  .flk-burger{margin-left:auto}
  .flk-burger[open] .flk-nav{
    position:absolute;
    right:0;
    top:52px;
    background:#fff;
    box-shadow:0 0 0 1px var(--flk-ln);
    border-radius:4px;
    padding:8px 22px;
    z-index:9;
  }
  .flk-burger[open] .flk-nav ul{flex-direction:column;gap:0}
  .flk-header .flk-tel{display:none}

  body .flk-cards > .elementor-container,
  body .flk-offer > .elementor-container,
  body .flk-price-sec > .elementor-container,
  body .flk-steps > .elementor-container,
  body .flk-revs > .elementor-container,
  body .flk-trust > .elementor-container,
  body .flk-guar .flk-gpair,
  .flk-cline{grid-template-columns:minmax(0,1fr)}
  body .flk-shead > .elementor-container{grid-template-columns:minmax(0,1fr);row-gap:12px}
  /* Карточка «что привозим» на телефоне становится столбиком */
  body .flk-oitem > .elementor-widget-wrap{flex-direction:column}
  body .flk-oitem .elementor-widget-shortcode{width:100%}
  body .flk-oitem .flk-photo{aspect-ratio:16/10;height:auto;min-height:0}
  body .elementor-widget-button .elementor-button{width:100%;justify-content:center}
  .flk-footer .flk-fend{margin-left:0}
}