/* ============================================================================
   modern.css — «dark agro-tech editorial» скин поверх структуры fp-*.
   Грузится ПОСЛЕ fp.css и переопределяет эстетику: тёмная тема, неон-лайм,
   стекло, aurora-градиенты, крупная типографика, мягкая моушн-подача.
   Контент (тела pole_*) не трогаем — только вид. for fun.
   ========================================================================== */

:root {
  --bg:        #07100b;
  --bg-2:      #0b1812;
  --panel:     rgba(255, 255, 255, .035);
  --panel-2:   rgba(255, 255, 255, .06);
  --stroke:    rgba(140, 198, 63, .16);
  --stroke-2:  rgba(255, 255, 255, .09);
  --ink:       #eaf3ea;
  --muted:     #9fb3a6;
  --lime:      #b6ff3c;
  --lime-2:    #8cc63f;
  --emerald:   #1f5c3a;
  --emerald-l: #2fae6a;
  --radius:    22px;
  --maxw:      1200px;
  --display:   'Space Grotesk', 'Inter', system-ui, sans-serif;
  --body:      'Inter', system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--body);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  position: relative;
}

/* зернистость + аура на фоне страницы */
body::before {
  content: "";
  position: fixed; inset: 0; z-index: -2;
  background:
    radial-gradient(60vw 50vh at 78% -8%, rgba(140, 198, 63, .16), transparent 60%),
    radial-gradient(50vw 40vh at 8% 12%, rgba(47, 174, 106, .12), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-2));
}
body::after {
  content: "";
  position: fixed; inset: 0; z-index: -1; opacity: .04; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- типографика ---------- */
h1, h2, h3, .fp-h2, .fp-h1 {
  font-family: var(--display);
  letter-spacing: -.03em;
  line-height: 1.02;
  color: #fff;
}
h1, .fp-hero h1, .fp-pagehero h1 {
  font-size: clamp(40px, 6.5vw, 86px);
  font-weight: 700;
  background: linear-gradient(180deg, #ffffff 30%, #cfeccd 75%, var(--lime-2));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.fp-h2 { font-size: clamp(28px, 4vw, 48px); font-weight: 700; }
p, li, label, .fp-sub, .fp-richtext { color: var(--muted); }
.fp-sub { font-size: clamp(16px, 1.4vw, 20px); }
a { color: var(--lime-2); }

/* eyebrow → неон-пилюля */
.fp-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font: 700 12px/1 var(--body); letter-spacing: .18em; text-transform: uppercase;
  color: #07100b;
  background: linear-gradient(90deg, var(--lime), var(--lime-2));
  padding: 7px 14px; border-radius: 999px; margin-bottom: 18px;
  box-shadow: 0 0 24px rgba(182, 255, 60, .35);
}

/* ---------- секции / банды ---------- */
.fp-band, section { position: relative; }
.fp-inner, .fp-hp { max-width: var(--maxw); margin: 0 auto; padding-inline: 24px; }
.fp-band { padding-block: clamp(56px, 8vw, 110px); }
.fp-band--cream {
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border-block: 1px solid var(--stroke-2);
}
.fp-band--dark { background: #050b07; }
.fp-band--green {
  background:
    radial-gradient(40vw 30vh at 80% 0%, rgba(140,198,63,.2), transparent 60%),
    linear-gradient(160deg, #0c2a1a, #08160e);
  border-block: 1px solid var(--stroke);
}
.fp-section-head { text-align: center; max-width: 760px; margin: 0 auto clamp(28px, 4vw, 52px); }
.fp-section-head .fp-eyebrow { margin-inline: auto; }

/* ---------- hero ---------- */
.fp-hero, .fp-pagehero {
  position: relative; isolation: isolate;
  padding-block: clamp(80px, 12vw, 160px);
  border-bottom: 1px solid var(--stroke);
  overflow: hidden;
}
/* анимированная aurora за hero */
.fp-hero::before, .fp-pagehero::before {
  content: ""; position: absolute; inset: -30% -10% auto -10%; height: 120%; z-index: -1;
  background:
    conic-gradient(from 120deg at 70% 30%, rgba(140,198,63,.28), transparent 30%, rgba(47,174,106,.22) 60%, transparent 80%);
  filter: blur(60px); opacity: .8;
  animation: aurora 14s ease-in-out infinite alternate;
}
@keyframes aurora {
  0%   { transform: translate3d(-4%, -2%, 0) scale(1); }
  100% { transform: translate3d(6%, 4%, 0) scale(1.15); }
}
.fp-hero .fp-sub, .fp-hero p { max-width: 56ch; }

/* тёмный скрим поверх светлой фон-картинки hero — чтобы текст читался */
.fp-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(95deg,
    rgba(5, 11, 7, .96) 0%, rgba(5, 11, 7, .85) 36%,
    rgba(5, 11, 7, .45) 72%, rgba(7, 16, 11, .2) 100%);
}
.fp-hero > * { position: relative; z-index: 1; }

/* фон-картинки hero/категорий приглушаем и затемняем под тёмную тему */
[class*="fp-hero"], [class*="fp-cat--"], [class*="fp-occ"], [class*="fp-about--"], [class*="fp-img--"] {
  background-blend-mode: luminosity;
}

/* ---------- кнопки ---------- */
.fp-btn {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 15px/1 var(--body); letter-spacing: .01em;
  padding: 15px 26px; border-radius: 14px; border: 0; cursor: pointer;
  color: #07100b;
  background: linear-gradient(90deg, var(--lime), var(--lime-2));
  box-shadow: 0 10px 30px rgba(140, 198, 63, .28);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  text-decoration: none;
}
.fp-btn:hover { transform: translateY(-2px); box-shadow: 0 16px 44px rgba(140,198,63,.4); filter: brightness(1.05); }
.fp-btn--ghost, .fp-btn--green.fp-btn--ghost {
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--stroke-2); box-shadow: none; backdrop-filter: blur(8px);
}
.fp-btn--ghost:hover { border-color: var(--lime-2); box-shadow: 0 0 0 1px var(--lime-2); }

/* ---------- карточки / стекло ---------- */
.fp-card, .fp-icard, .fp-occasion, .fp-step, .fp-post, .fp-cat, .fp-faq details, .fp-calc, .fp-leadform {
  background: var(--panel);
  border: 1px solid var(--stroke-2);
  border-radius: var(--radius);
  backdrop-filter: blur(10px);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.fp-card, .fp-icard, .fp-occasion, .fp-step, .fp-post { padding: 26px; }
.fp-card:hover, .fp-icard:hover, .fp-occasion:hover, .fp-step:hover, .fp-post:hover {
  transform: translateY(-6px);
  border-color: var(--stroke);
  background: var(--panel-2);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .5), 0 0 0 1px rgba(140,198,63,.18);
}
.fp-card h3, .fp-icard h3, .fp-occasion h3, .fp-step h3, .fp-post h3 { color: #fff; margin: 0 0 8px; }

/* бенто-сетки */
.fp-cards, .fp-icards, .fp-occasions, .fp-steps, .fp-posts, .fp-cats, .fp-logos {
  display: grid; gap: 18px;
}
@media (min-width: 720px) {
  .fp-cards, .fp-icards, .fp-occasions, .fp-posts { grid-template-columns: repeat(3, 1fr); }
  .fp-steps { grid-template-columns: repeat(4, 1fr); }
  .fp-cats  { grid-template-columns: repeat(3, 1fr); }
}

/* иконки в icard/occasion */
.fp-icard__ic, .fp-occasion .fp-occasion__ic, [class*="__ic"] {
  width: 52px; height: 52px; display: grid; place-items: center;
  border-radius: 14px; font-size: 24px; margin-bottom: 14px;
  background: radial-gradient(circle at 30% 30%, rgba(140,198,63,.25), rgba(140,198,63,.06));
  border: 1px solid var(--stroke);
}

/* круглые картинки категорий */
[class*="fp-cat"] .fp-img--round, .fp-cat img, .fp-cat__img {
  border-radius: 50%; filter: saturate(1.1) contrast(1.05);
}

/* ---------- прайс-лист ---------- */
.fp-pricelist { display: grid; gap: 10px; max-width: 900px; margin-inline: auto; }
.fp-price {
  display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  padding: 16px 20px; border-radius: 14px;
  background: var(--panel); border: 1px solid var(--stroke-2);
}
.fp-price:hover { border-color: var(--lime-2); }
.fp-price b, .fp-price strong, .fp-price .fp-price__val { color: var(--lime); font-family: var(--display); }

/* ---------- калькулятор ---------- */
.fp-calc { padding: 24px; }
.fp-calc__grid { display: grid; gap: 14px; }
@media (min-width: 720px) { .fp-calc__grid { grid-template-columns: repeat(4, 1fr); } }
.fp-calc__field span { display: block; font: 600 12px/1 var(--body); color: var(--muted); margin-bottom: 7px; letter-spacing: .04em; text-transform: uppercase; }
.fp-calc select, .fp-calc input, .fp-leadform input, .fp-leadform select, .fp-leadform textarea {
  width: 100%; padding: 13px 14px; border-radius: 12px;
  background: rgba(0,0,0,.35); color: var(--ink);
  border: 1px solid var(--stroke-2); font: 500 15px var(--body);
  transition: border-color .2s, box-shadow .2s;
}
.fp-calc select:focus, .fp-calc input:focus, .fp-leadform input:focus, .fp-leadform select:focus, .fp-leadform textarea:focus {
  outline: 0; border-color: var(--lime-2); box-shadow: 0 0 0 3px rgba(140,198,63,.18);
}
.fp-calc__out { display: grid; gap: 14px; grid-template-columns: repeat(3, 1fr); margin-top: 18px; }
.fp-calc__metric {
  text-align: center; padding: 22px 14px; border-radius: 16px;
  background: linear-gradient(180deg, rgba(140,198,63,.12), rgba(140,198,63,.03));
  border: 1px solid var(--stroke);
}
.fp-calc__metric span { font: 800 30px/1 var(--display); color: var(--lime); display: block; }
.fp-calc__metric small { color: var(--muted); font-size: 12.5px; }

/* ---------- лид-форма ---------- */
.fp-formband { border-radius: 28px; margin-block: 20px; }
.fp-leadform { padding: 28px; }
.fp-formgrid { display: grid; gap: 12px; }
@media (min-width: 640px) { .fp-formgrid { grid-template-columns: 1fr 1fr; } .fp-formgrid .full { grid-column: 1 / -1; } }
.fp-consent { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 14px; }
.fp-hp { position: absolute; left: -9999px; }
.fp-formnotice { padding: 14px 16px; border-radius: 12px; font-weight: 600; }
.fp-formnotice--ok { background: rgba(47,174,106,.15); border: 1px solid var(--emerald-l); color: #b8f3cf; }

/* ---------- таблица доставки ---------- */
.fp-deliverytable { width: 100%; border-collapse: separate; border-spacing: 0 8px; }
.fp-deliverytable th { text-align: left; color: var(--muted); font: 700 12px/1 var(--body); text-transform: uppercase; letter-spacing: .08em; padding: 8px 14px; }
.fp-deliverytable td { background: var(--panel); border-block: 1px solid var(--stroke-2); padding: 14px; }
.fp-deliverytable tr td:first-child { border-left: 1px solid var(--stroke-2); border-radius: 12px 0 0 12px; color: #fff; }
.fp-deliverytable tr td:last-child { border-right: 1px solid var(--stroke-2); border-radius: 0 12px 12px 0; }

/* ---------- мелочи ---------- */
.fp-note { color: var(--muted); font-size: 13.5px; opacity: .85; }
.fp-richtext { max-width: 760px; }
.crumbs { color: var(--muted); font-size: 14px; }
.crumbs a { color: var(--lime-2); }
.fp-logos img { filter: grayscale(1) brightness(2) opacity(.5); transition: filter .2s; }
.fp-logos img:hover { filter: none; }

/* ---------- scroll-reveal (классы вешает motion.js) ---------- */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .fp-hero::before, .fp-pagehero::before { animation: none; }
}
