/* Сброс */
* { margin: 0; padding: 0; box-sizing: border-box; }

/* Глобальные */
body {
  font-family: 'Inter', sans-serif;
  color: #1d1d1f;
  background-color: #fdfdfd;
  line-height: 1.6;
  font-size: 16px;
}

a { text-decoration: none; color: inherit; }
ul { list-style: none; }

.container { width: 90%; max-width: 1200px; margin: 0 auto; }

/* Палитра */
:root{
  --color-primary:#006d77;
  --color-secondary:#83c5be;
  --color-accent:#ffb703;
  --color-bg:#fdfdfd;
  --color-text:#1d1d1f;
  --shadow-soft: 0 10px 30px rgba(0,0,0,.08);
  --radius-xl: 18px;
}

/* Хедер */
.header { background: var(--color-primary); padding: 15px 0; color:#fff; position: sticky; top:0; z-index: 50; }
.header__container { display:flex; align-items:center; justify-content:space-between; }
.header__logo { font-weight:700; font-size:1.4rem; letter-spacing:.3px; }
.header__menu { display:flex; gap:20px; }
.header__menu a { color:#fff; font-weight:500; transition: opacity .25s ease; }
.header__menu a:hover { opacity:.8; }

/* HERO */
.hero {
  position: relative;
  min-height: 88vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(1200px 600px at 20% -10%, rgba(131,197,190,.25), transparent),
              radial-gradient(1000px 500px at 120% 110%, rgba(255,183,3,.18), transparent),
              #f7fbfb;
}

.hero__canvas{
  position:absolute; inset:0; width:100%; height:100%;
  z-index: 0;
}

.hero__container{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
  padding: 72px 0;
}

.hero__content { max-width: 720px; }

.hero__title{
  font-family:'Fira Sans', system-ui, sans-serif;
  font-weight:700;
  font-size: clamp(28px, 6vw, 56px);
  line-height: 1.08;
  letter-spacing: .2px;
  color:#0f1f22;
}

.hero__rotate{
  display:inline-block;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

.hero__subtitle{
  margin-top: 14px;
  font-size: clamp(15px, 2.6vw, 18px);
  color:#36474c;
}

.hero__cta{
  margin-top: 22px;
  display:flex; gap:12px; flex-wrap: wrap;
}

.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 12px 18px; border-radius: calc(var(--radius-xl) - 6px);
  border:1px solid transparent; cursor:pointer; transition: transform .15s ease, box-shadow .25s ease, background-color .25s ease, color .25s ease;
  font-weight:600;
}

.btn i { width:18px; height:18px; }

.btn--primary{
  background: var(--color-primary);
  color:#fff;
  box-shadow: var(--shadow-soft);
}
.btn--primary:hover{ transform: translateY(-1px); }

.btn--ghost{
  background:#fff;
  border-color: rgba(0,0,0,.06);
  color:#0f1f22;
}
.btn--ghost:hover{ background:#f6f9f9; }

.hero__bullets{
  margin-top: 18px;
  display:flex; gap:16px; flex-wrap:wrap;
  color:#2a3a3e; font-size: 14px;
}
.hero__bullets i{ width:16px; height:16px; }

.hero__visual{ display:flex; justify-content:center; }
.hero__card{
  position: relative;
  width: min(480px, 92vw);
  background:#fff; border:1px solid rgba(0,0,0,.06);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  transform: translateZ(0);
}
.hero__image{ width:100%; height:auto; display:block; }
.hero__badge{
  position:absolute; left: 12px; bottom:12px;
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; background: rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.05);
  border-radius: 999px;
  font-size: 13px; font-weight:600;
  backdrop-filter: blur(6px);
}

/* Заглушки секций (пока пустые) */
.section--placeholder{ min-height: 10vh; }

/* Футер */
.footer { background: var(--color-secondary); padding:40px 0; color:#fff; }
.footer__container{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:20px;
}
.footer__logo{ font-weight:700; font-size:1.3rem; }
.footer h4{ margin-bottom:10px; font-weight:600; }
.footer ul li{ margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.footer ul li a:hover{ color: var(--color-accent); }

/* Адаптив */
@media (min-width: 880px){
  .hero__container{
    grid-template-columns: 1.1fr .9fr;
    gap: 40px;
  }
}

@media (max-width: 768px){
  .header__menu{ flex-wrap: wrap; gap:10px; }
}

/* CONTACT */
.contact { padding: 72px 0; background: #fff; }
.contact__container { display: grid; gap: 24px; }
.contact__title { font-family: 'Fira Sans', system-ui, sans-serif; font-size: clamp(24px, 4.5vw, 36px); line-height: 1.15; color:#0f1f22; }
.contact__text { margin-top: 8px; color:#415257; max-width: 720px; }

.contact__form { margin-top: 8px; background: #f8fbfb; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius-xl); padding: 20px; box-shadow: var(--shadow-soft); }
.contact__row { display: grid; gap:16px; grid-template-columns: 1fr; }
.contact__row--captcha { margin-top: 6px; }

.contact__group { display: grid; gap:6px; }
.contact__label { font-weight:600; color:#203236; font-size: 14px; }
.contact__input {
  width:100%; padding:12px 14px; border:1px solid rgba(0,0,0,.08);
  border-radius: 12px; background:#fff; color:#0f1f22; outline: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.contact__input:focus { border-color: var(--color-primary); box-shadow: 0 0 0 4px rgba(0,109,119,.12); }

.contact__captcha { display: flex; align-items: center; gap:10px; }
.contact__captcha-q { padding: 8px 10px; background:#fff; border:1px dashed rgba(0,0,0,.12); border-radius: 10px; font-variant-numeric: tabular-nums; }
.contact__input--captcha { width: 120px; }

.contact__agree { display:flex; align-items:flex-start; gap:10px; margin-top: 4px; color:#2b3b3f; }
.contact__agree a { text-decoration: underline; text-underline-offset: 2px; color: var(--color-primary); }
.contact__agree input { margin-top: 3px; }

.contact__actions { display:flex; gap:12px; margin-top: 12px; flex-wrap: wrap; }

.contact__error { color:#b00020; font-size: 13px; min-height: 16px; }
.contact__success { margin-top:12px; font-weight:600; color: #0a6e0a; }

@media (min-width: 860px){
  .contact__row { grid-template-columns: repeat(3, 1fr); }
  .contact__row--captcha { grid-template-columns: 1.6fr 1fr; align-items: start; }
}

/* Общие секционные */
.section { padding: 72px 0; }
.section__head { margin-bottom: 18px; }
.section__title { font-family:'Fira Sans', system-ui, sans-serif; font-size: clamp(22px, 4.5vw, 34px); color:#0f1f22; }
.section__desc { color:#3a4a4e; max-width: 760px; }

/* Innovations */
.innovations__grid { display:grid; gap:18px; grid-template-columns: 1fr; }
.card { background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius-xl); box-shadow: var(--shadow-soft); overflow: hidden; transition: transform .18s ease, box-shadow .25s ease; }
.card:hover { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(0,0,0,.08); }
.card__image { width:100%; height:auto; display:block; }
.card__body { padding: 16px; display:grid; gap:10px; }
.card__title { font-weight:700; font-size: 20px; color:#142328; }
.card__text { color:#415257; }
.card__tags { display:flex; gap:8px; flex-wrap: wrap; }
.card__tags li { font-size: 12px; padding:6px 10px; background:#f3f8f8; border-radius: 999px; border:1px solid rgba(0,0,0,.06); }
.card__btn { justify-self: start; }

/* Cases */
.cases__grid { display:grid; gap:18px; grid-template-columns:1fr; }
.case-card { background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius-xl); padding:16px; box-shadow: var(--shadow-soft); display:grid; gap:10px; }
.case-card__head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.case-card__title { font-size:18px; font-weight:700; color:#142328; }
.case-card__badge { background: #e9f6f5; color: #0f6f74; padding:6px 10px; border-radius: 999px; font-size:12px; border:1px solid rgba(0,0,0,.06); }
.case-card__lead { color:#3e5054; }
.case-card__metrics { display:flex; gap:14px; flex-wrap: wrap; color:#294147; font-size:14px; }
.case-card__metrics i{ width:16px; height:16px; }
.case-card__more { border-top:1px dashed rgba(0,0,0,.1); padding-top:10px; }
.case-card__btn { justify-self: start; }

/* Tools */
.tools__filters { display:flex; gap:8px; flex-wrap:wrap; margin: 6px 0 14px; }
.chip { padding:8px 12px; border:1px solid rgba(0,0,0,.1); background:#fff; border-radius: 999px; cursor:pointer; transition: background .15s ease, transform .1s ease; }
.chip:active { transform: translateY(1px); }
.chip--active { background: #eef7f7; border-color: var(--color-primary); }
.tools__grid { display:grid; gap:18px; grid-template-columns:1fr; }
.tool-card { background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius-xl); padding:16px; display:grid; gap:8px; box-shadow: var(--shadow-soft); }
.tool-card__icon { width:22px; height:22px; color: var(--color-primary); }
.tool-card__title { font-weight:700; color:#142328; }
.tool-card__text { color:#405156; }
.tool-card__btn { justify-self: start; }

/* Events */
.events__list { display:grid; gap:12px; counter-reset: ev; }
.event { display:grid; grid-template-columns: 120px 1fr auto; gap:14px; align-items: center; background:#fff; border:1px solid rgba(0,0,0,.06); border-radius: var(--radius-xl); padding:12px 14px; box-shadow: var(--shadow-soft); }
.event__date { font-variant-numeric: tabular-nums; color:#0f6f74; font-weight:700; }
.event__title { font-weight:700; color:#142328; }
.event__meta { color:#405156; display:flex; gap:6px; align-items:center; }
.event__meta i { width:16px; height:16px; }
.event__btn { justify-self: end; }

/* Адаптив гридов */
@media (min-width: 860px){
  .innovations__grid { grid-template-columns: repeat(3, 1fr); }
  .cases__grid { grid-template-columns: repeat(3, 1fr); }
  .tools__grid { grid-template-columns: repeat(4, 1fr); }
}

/* COOKIE POPUP */
.cookie{
  position: fixed; left:0; right:0; bottom: -200px;
  background: rgba(255,255,255,.96);
  border-top: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 -8px 30px rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
  z-index: 100;
  transition: bottom .35s ease;
}
.cookie--show{ bottom: 0; }
.cookie__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap: 12px; padding: 14px 0;
}
.cookie__text{ color:#213236; }
.cookie__text a{ text-decoration: underline; text-underline-offset: 2px; color: var(--color-primary); }
.cookie__btn{ white-space: nowrap; }

/* СТИЛІ ДЛЯ ТЕКСТОВИХ СТОРІНОК (privacy.html, cookies.html, terms.html, return.html, disclaimer.html, personal-data-policy.html) */
.pages{ padding: 64px 0; }
.pages .container{ max-width: 860px; }
.pages h1{
  font-family:'Fira Sans', system-ui, sans-serif;
  font-size: clamp(24px, 5vw, 40px);
  color:#0f1f22; margin-bottom: 10px;
}
.pages p{ margin: 12px 0; color:#2f4044; }
.pages h2{
  margin-top: 22px; margin-bottom: 8px;
  font-size: clamp(18px, 3.6vw, 26px);
  color:#142328;
}
.pages ul{ margin: 10px 0 10px 18px; list-style: disc; color:#2f4044; }
.pages li{ margin: 6px 0; }
.pages strong{ font-weight: 700; color:#15282c; }
.pages a{ color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; }
.pages code, .pages pre{
  background:#f6faf9; border:1px solid rgba(0,0,0,.06);
  border-radius: 12px; padding: 10px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  display: block; overflow-x: auto;
}
