/*
Theme Name: EC EdTech Platform
Template: brite
Author: EC
Description: Modern EdTech child theme for es-study.ru.
Version: 1.0.0
Text Domain: ec-edtech
*/

:root {
  --ec-ink: #111827;
  --ec-muted: #667085;
  --ec-line: #d9e2ec;
  --ec-bg: #f5f8fc;
  --ec-card: #ffffff;
  --ec-blue: #155eef;
  --ec-deep: #0b2253;
  --ec-teal: #13b8a6;
  --ec-green: #2dbb66;
  --ec-violet: #7c5cff;
  --ec-shadow: 0 16px 42px rgba(17, 24, 39, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ec-bg);
  color: var(--ec-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.7;
}
a { color: var(--ec-blue); }
img { max-width: 100%; height: auto; }

.ec-wrap { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.ec-header {
  position: sticky;
  top: 0;
  z-index: 80;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(21, 94, 239, .12);
  backdrop-filter: blur(14px);
}
.ec-header__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  min-height: 76px;
}
.ec-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--ec-ink);
  text-decoration: none;
  min-width: 210px;
}
.ec-brand__mark {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--ec-blue), var(--ec-teal));
  color: #fff;
  font-weight: 900;
  letter-spacing: 0;
}
.ec-brand__name { display:block; font-size: 21px; font-weight: 900; line-height: 1; }
.ec-brand__tag { display:block; margin-top: 3px; color: var(--ec-muted); font-size: 12px; line-height: 1.2; }
.ec-nav ul { display:flex; align-items:center; justify-content:center; gap: 4px; margin:0; padding:0; list-style:none; }
.ec-nav a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding: 0 12px;
  border-radius: 8px;
  color:#253143;
  text-decoration:none;
  font-size:15px;
  font-weight:800;
}
.ec-nav a:hover, .ec-nav .current-menu-item > a { background:#edf4ff; color:var(--ec-blue); }
.ec-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; }
.ec-icon-btn, .ec-menu-toggle, .ec-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  border:1px solid var(--ec-line);
  border-radius:8px;
  background:#fff;
  color:var(--ec-ink);
  cursor:pointer;
}
.ec-btn {
  gap: 8px;
  padding:0 16px;
  border-color: transparent;
  background: var(--ec-blue);
  color:#fff;
  font-weight:900;
  text-decoration:none;
}
.ec-btn--ghost { background:#fff; color:var(--ec-blue); border-color:#cfe0ff; }
.ec-menu-toggle { display:none; }
.ec-searchbar { display:none; background:#fff; border-top:1px solid var(--ec-line); }
.ec-searchbar.is-open { display:block; }
.ec-searchbar form { display:flex; gap:10px; padding:14px 0; }
.ec-searchbar input { flex:1; min-height:48px; border:1px solid var(--ec-line); border-radius:8px; padding:0 14px; }

.ec-section { padding: 56px 0; }
.ec-hero {
  color:#fff;
  background:
    linear-gradient(120deg, rgba(11,34,83,.96), rgba(21,94,239,.84)),
    url("assets/img/ec-hero.svg") center/cover no-repeat;
}
.ec-hero .ec-wrap {
  display:grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(290px, .9fr);
  gap:34px;
  align-items:center;
  min-height: 540px;
  padding: 48px 0 68px;
}
.ec-eyebrow { display:inline-flex; align-items:center; gap:8px; margin-bottom:16px; font-size:14px; font-weight:900; text-transform:uppercase; }
.ec-hero h1 { margin:0 0 18px; max-width:820px; color:#fff; font-size:52px; line-height:1.08; letter-spacing:0; }
.ec-hero p { margin:0 0 26px; max-width:720px; color:rgba(255,255,255,.9); font-size:20px; }
.ec-hero__search { display:flex; gap:10px; max-width:720px; padding:8px; border-radius:8px; background:#fff; box-shadow:0 20px 50px rgba(0,0,0,.22); }
.ec-hero__search input { flex:1; min-width:0; min-height:52px; border:0; padding:0 14px; font-size:16px; }
.ec-hero__search button { min-height:52px; border:0; border-radius:8px; padding:0 18px; background:var(--ec-green); color:#fff; font-weight:900; }
.ec-hero__panel { border:1px solid rgba(255,255,255,.25); border-radius:8px; background:rgba(255,255,255,.96); color:var(--ec-ink); padding:24px; box-shadow:var(--ec-shadow); }
.ec-hero__panel h2 { margin:0 0 14px; font-size:24px; }
.ec-list { margin:0; padding:0; list-style:none; }
.ec-list li { position:relative; padding:10px 0 10px 34px; border-bottom:1px solid #eef2f7; }
.ec-list li:before { content:""; position:absolute; left:0; top:13px; width:20px; height:20px; border-radius:50%; background:linear-gradient(135deg,var(--ec-green),var(--ec-teal)); }

.ec-section__head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:24px; }
.ec-section__head h2, .ec-section__head h1 { margin:0; font-size:36px; line-height:1.16; letter-spacing:0; }
.ec-section__head p { max-width:650px; margin:8px 0 0; color:var(--ec-muted); }
.ec-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:20px; }
.ec-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ec-card {
  display:flex;
  flex-direction:column;
  min-height:100%;
  border:1px solid var(--ec-line);
  border-radius:8px;
  background:var(--ec-card);
  overflow:hidden;
  box-shadow:0 8px 26px rgba(17,24,39,.05);
  text-decoration:none;
  color:var(--ec-ink);
}
.ec-card__body { display:flex; flex:1; flex-direction:column; padding:20px; }
.ec-card__icon { display:grid; place-items:center; width:46px; height:46px; margin-bottom:14px; border-radius:8px; background:#edf4ff; color:var(--ec-blue); }
.ec-card h3 { margin:0 0 10px; font-size:21px; line-height:1.25; }
.ec-card p { margin:0 0 16px; color:var(--ec-muted); }
.ec-card__meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; color:var(--ec-muted); font-size:13px; }
.ec-chip { display:inline-flex; align-items:center; min-height:30px; border-radius:8px; background:#edf4ff; color:#174ea6; padding:0 10px; font-size:13px; font-weight:900; }

.ec-quiz { border:1px solid var(--ec-line); border-radius:8px; background:#fff; padding:24px; box-shadow:var(--ec-shadow); }
.ec-quiz__options { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; }
.ec-quiz button { min-height:48px; border:1px solid var(--ec-line); border-radius:8px; background:#fff; font-weight:800; cursor:pointer; }
.ec-quiz button.is-active { background:var(--ec-blue); color:#fff; border-color:var(--ec-blue); }

.ec-article-layout { display:grid; grid-template-columns:minmax(0, 1fr) 310px; gap:32px; align-items:start; }
.ec-article { max-width:830px; margin:0 auto; border:1px solid var(--ec-line); border-radius:8px; background:#fff; padding:34px; box-shadow:0 8px 26px rgba(17,24,39,.05); }
.ec-breadcrumbs { margin-bottom:18px; color:var(--ec-muted); font-size:14px; }
.ec-article h1 { margin:0 0 14px; font-size:44px; line-height:1.12; letter-spacing:0; }
.ec-lead { color:#42526b; font-size:20px; line-height:1.58; }
.ec-meta { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 24px; }
.ec-meta span { display:inline-flex; align-items:center; min-height:32px; border:1px solid var(--ec-line); border-radius:8px; padding:0 10px; color:var(--ec-muted); font-size:13px; }
.ec-content { font-size:18px; line-height:1.78; }
.ec-content h2, .ec-content h3 { scroll-margin-top:110px; }
.ec-content h2 { margin-top:38px; font-size:30px; }
.ec-content h3 { margin-top:28px; font-size:23px; }
.ec-note, .ec-toc, .ec-sticky-cta { border:1px solid var(--ec-line); border-radius:8px; background:#fff; padding:18px; box-shadow:0 8px 26px rgba(17,24,39,.05); }
.ec-toc, .ec-sticky-cta { position:sticky; top:104px; }
.ec-toc a { display:block; padding:7px 0; color:#42526b; text-decoration:none; font-size:14px; }
.ec-sticky-cta { margin-top:16px; }
.ec-sticky-cta .ec-btn { width:100%; margin-top:12px; }
.ec-form { display:grid; gap:10px; }
.ec-form input, .ec-form select, .ec-form textarea { width:100%; min-height:46px; border:1px solid var(--ec-line); border-radius:8px; padding:0 12px; }
.ec-form textarea { padding-top:10px; min-height:92px; }
.ec-progress { position:fixed; top:0; left:0; z-index:120; height:3px; width:0; background:linear-gradient(90deg,var(--ec-blue),var(--ec-teal)); }

.ec-footer { margin-top:58px; background:#0b1324; color:#cfdae8; }
.ec-footer a { color:#fff; text-decoration:none; }
.ec-footer__grid { display:grid; grid-template-columns:1.2fr repeat(3,1fr); gap:28px; padding:46px 0; }
.ec-footer h3 { margin:0 0 14px; color:#fff; font-size:18px; }
.ec-footer ul { margin:0; padding:0; list-style:none; }
.ec-footer li { margin:8px 0; }
.ec-footer__bottom { border-top:1px solid rgba(255,255,255,.12); padding:18px 0; color:#98a7b8; font-size:14px; }

@media (max-width: 1040px) {
  .ec-header__inner { grid-template-columns:auto 1fr auto; }
  .ec-menu-toggle { display:inline-flex; }
  .ec-nav { display:none; grid-column:1 / -1; }
  .ec-nav.is-open { display:block; }
  .ec-nav ul { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; padding-bottom:16px; }
  .ec-hero .ec-wrap, .ec-article-layout { grid-template-columns:1fr; }
  .ec-grid, .ec-grid--4, .ec-footer__grid { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .ec-toc, .ec-sticky-cta { position:static; }
}
@media (max-width: 680px) {
  body { font-size:16px; }
  .ec-wrap { width:min(100% - 24px, 1180px); }
  .ec-header__inner { min-height:66px; gap:10px; }
  .ec-brand { min-width:0; }
  .ec-brand__tag, .ec-btn span { display:none; }
  .ec-nav ul, .ec-grid, .ec-grid--4, .ec-footer__grid, .ec-quiz__options { grid-template-columns:1fr; }
  .ec-hero .ec-wrap { min-height:auto; padding:36px 0 44px; }
  .ec-hero h1 { font-size:34px; }
  .ec-hero p, .ec-lead { font-size:18px; }
  .ec-hero__search { flex-direction:column; }
  .ec-section { padding:38px 0; }
  .ec-section__head { display:block; }
  .ec-section__head h1, .ec-section__head h2 { font-size:28px; }
  .ec-article { padding:22px 16px; }
  .ec-article h1 { font-size:31px; }
}