/* Curiosophy.events — единая дизайн-система (см. events_site/design.md).
   Mobile-first: база — мобильная вёрстка, @media (min-width:761px) — десктоп. */

:root{
  --bg:#FFFFFF; --callout:#FAF7F2; --hover:#F1F1EF; --row-hover:#F7F7F5;
  --ink:#37352F; --mute:#787774; --faint:#9B9A97; --line:rgba(55,53,47,0.09);
  --accent:#D9730D; --accent-hover:#C0640A; --accent-bg:#FAEBDD;
  --online:#0F7B6C; --online-bg:#E7F3EF; --danger:#C4452D; --danger-bg:#FDF6F4;
  --avatar-from:#E7CBA9; --avatar-to:#D8B48A; --avatar-ink:#8A6A45;
  --font:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,'Apple Color Emoji',Arial,sans-serif;
  --maxw:920px;
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{
  font-family:var(--font); background:var(--bg); color:var(--ink);
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; min-height:100vh;
}
::selection{background:var(--accent-bg);}
img{max-width:100%; display:block;}
a{color:inherit;}
button{font-family:inherit;}

/* ---------- layout ---------- */
.cs-wrap{max-width:var(--maxw); margin:0 auto; padding-left:16px; padding-right:16px;}
.cs-page{padding-top:40px; padding-bottom:120px;}

/* ---------- typography ---------- */
.cs-h1{font-size:30px; font-weight:700; letter-spacing:-0.025em; line-height:1.1; margin:0 0 12px;}
.cs-lead{font-size:16px; line-height:1.5; color:var(--mute); margin:0 0 18px; max-width:600px;}
.cs-h2{font-size:20px; font-weight:600; letter-spacing:-0.01em; margin:0 0 12px;}
.cs-sec{display:flex; align-items:center; gap:8px; margin-bottom:16px; color:var(--mute);}
.cs-sec__label{font-size:13px; font-weight:600; letter-spacing:0.02em; text-transform:uppercase;}
.cs-sec__count{font-size:13px; color:var(--faint);}
.cs-stats{display:flex; gap:18px; flex-wrap:wrap; font-size:14px; color:var(--faint);}
.cs-stats b{color:var(--ink); font-weight:600;}
.cs-back{display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--mute); text-decoration:none; margin-bottom:24px;}
.cs-back:hover{color:var(--ink);}

/* ---------- buttons ---------- */
.cs-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:15px; font-weight:500; padding:12px 22px; border-radius:8px;
  border:1px solid transparent; cursor:pointer; text-decoration:none; transition:background .15s,border-color .15s;}
.cs-btn--primary{background:var(--accent); color:#fff;}
.cs-btn--primary:hover{background:var(--accent-hover);}
.cs-btn--secondary{background:#fff; color:var(--ink); border-color:var(--line);}
.cs-btn--secondary:hover{background:var(--row-hover);}
.cs-btn--dark{background:var(--ink); color:#fff;}
.cs-btn--dark:hover{background:#000;}
.cs-btn--link{background:none; color:var(--accent); padding:12px 4px;}
.cs-btn--block{width:100%;}
.cs-btn--radius6{border-radius:6px;}

/* ---------- badges / labels ---------- */
.cs-badge{display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; padding:4px 10px; border-radius:6px;}
.cs-badge--accent{background:var(--accent-bg); color:var(--accent);}
.cs-badge--online{background:var(--online-bg); color:var(--online);}
.cs-badge--neutral{background:var(--hover); color:var(--mute); font-weight:500;}
.cs-ctx{display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:500;
  color:var(--accent); background:var(--accent-bg); padding:5px 11px; border-radius:6px;}
.cs-badge-online-abs{position:absolute; top:8px; right:8px; background:rgba(255,255,255,.92);
  color:var(--online); font-size:11px; font-weight:600; padding:2px 8px; border-radius:4px;}

/* ---------- tabs ---------- */
.cs-tabs{display:flex; gap:4px; border-bottom:1px solid var(--line);}
.cs-tab{font-size:14px; padding:9px 8px; margin-bottom:-1px; background:none; border:none;
  border-bottom:2px solid transparent; color:var(--mute); font-weight:500; cursor:pointer;}
.cs-tab.is-active{color:var(--ink); font-weight:600; border-bottom-color:var(--ink);}

/* ---------- segmented ⊞ / ☰ ---------- */
.cs-seg{display:flex; gap:2px; background:var(--hover); border-radius:6px; padding:2px;}
.cs-seg__btn{font-size:14px; padding:3px 10px; border-radius:4px; border:none; background:none; color:var(--faint); cursor:pointer;}
.cs-seg__btn.is-active{background:#fff; color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.08);}

/* ---------- fields ---------- */
.cs-field-label{display:block; font-size:13px; font-weight:600; margin-bottom:7px;}
.cs-input,.cs-select{width:100%; font-family:inherit; font-size:15px; padding:11px 14px;
  border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); outline:none;}
.cs-input[type=date]{padding:10px 14px; color:var(--mute);}
.cs-input:focus,.cs-select:focus{border-color:rgba(217,115,13,.5);}
.cs-form-grid{display:grid; grid-template-columns:1fr; gap:18px 20px;}

/* ---------- avatar (square, never round) ---------- */
.cs-av{display:flex; align-items:center; justify-content:center; flex:none; overflow:hidden;
  background:linear-gradient(135deg,var(--avatar-from),var(--avatar-to)); color:var(--avatar-ink); font-weight:700;}
.cs-av img{width:100%; height:100%; object-fit:cover;}
.cs-av--26{width:26px; height:26px; border-radius:7px; font-size:11px;}
.cs-av--34{width:34px; height:34px; border-radius:8px; font-size:13px;}
.cs-av--40{width:40px; height:40px; border-radius:10px; font-size:14px;}
.cs-av--42{width:42px; height:42px; border-radius:10px; font-size:14px;}
.cs-av--64{width:64px; height:64px; border-radius:16px; font-size:22px;}
.cs-av--130{width:130px; height:130px; border-radius:16px; font-size:34px;}

/* ---------- header ---------- */
.cs-header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.85);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--line);}
.cs-nav{max-width:var(--maxw); margin:0 auto; padding:10px 16px; display:flex; align-items:center; gap:2px;
  overflow-x:auto; -webkit-overflow-scrolling:touch;}
.cs-nav::-webkit-scrollbar{display:none;}
.cs-brand{position:relative; display:flex; align-items:center; text-decoration:none; flex:none; margin-right:18px; height:20px;}
.cs-brand__name{font-weight:700; font-size:17px; letter-spacing:-0.02em; color:var(--ink); line-height:1;}
.cs-brand__sub{position:absolute; top:22px; left:0; font-size:9.5px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--faint);}
.cs-nav__link{font-size:14px; color:var(--mute); text-decoration:none; padding:5px 9px; border-radius:5px; flex:none; white-space:nowrap;}
.cs-nav__link:hover{background:var(--hover); color:var(--ink);}
.cs-nav__link.is-active{background:var(--hover); color:var(--ink); font-weight:500;}
.cs-nav__spacer{flex:1;}
.cs-icon-btn{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:8px; text-decoration:none; color:var(--mute); font-size:15px; flex:none;}
.cs-icon-btn:hover{background:var(--hover); color:var(--ink);}
.cs-login{display:inline-flex; align-items:center; font-size:14px; font-weight:500; color:var(--ink);
  text-decoration:none; padding:7px 14px; border:1px solid var(--line); border-radius:8px; flex:none; white-space:nowrap;}
.cs-login:hover{background:var(--row-hover);}
.cs-chip{display:inline-flex; align-items:center; gap:8px; text-decoration:none; flex:none;
  background:var(--hover); border-radius:999px; padding:4px 12px 4px 4px;}
.cs-chip:hover{background:#E9E9E6;}
.cs-chip__name{font-size:14px; font-weight:500; color:var(--ink);}

/* ---------- cards / rows ---------- */
.cs-row{display:flex; align-items:center; gap:14px; padding:11px 10px; border-bottom:1px solid var(--line);
  text-decoration:none; color:inherit;}
.cs-row:hover{background:var(--row-hover);}
.cs-row__title{font-size:15px; font-weight:500; letter-spacing:-0.01em;}
.cs-row__sub{font-size:13px; color:var(--mute); margin-top:2px;}
.cs-row__right{flex:none; font-size:13px; color:var(--faint); text-align:right;}

.cs-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(216px,1fr)); gap:14px;}
.cs-card{display:flex; flex-direction:column; border:1px solid var(--line); border-radius:8px; overflow:hidden;
  background:#fff; text-decoration:none; color:inherit;}
.cs-card:hover{background:#FBFBFA; border-color:rgba(55,53,47,.16);}
.cs-card__media{position:relative; height:114px; background:#EDEAE4; display:flex; align-items:center; justify-content:center;}
.cs-card__media img{width:100%; height:100%; object-fit:cover;}
.cs-card__emoji{font-size:38px; opacity:.92;}
.cs-card__body{padding:12px 13px 14px; flex:1; display:flex; flex-direction:column;}
.cs-card__meta{font-size:12px; color:var(--mute); display:flex; gap:7px; align-items:center;}
.cs-card__date{color:var(--accent); font-weight:500;}
.cs-card__title{font-size:15px; font-weight:600; letter-spacing:-0.01em; line-height:1.28; margin:7px 0 0;}
.cs-card__speaker{margin-top:auto; padding-top:12px; font-size:13px; color:var(--mute);}

/* ---------- callout ---------- */
.cs-callout{background:var(--callout); border:1px solid var(--line); border-radius:10px; padding:14px;}
.cs-callout--cta{display:flex; align-items:center; gap:14px; background:var(--accent-bg);
  border-color:rgba(217,115,13,.22); padding:14px 18px; text-decoration:none; color:inherit;}
.cs-callout--cta:hover{border-color:rgba(217,115,13,.45);}
.cs-callout__title{font-size:15px; font-weight:600; color:var(--ink);}
.cs-callout__sub{font-size:13px; color:var(--mute); margin-top:2px;}

/* ---------- featured hero ---------- */
.cs-hero{position:relative; display:block; border-radius:14px; overflow:hidden; border:1px solid var(--line);
  background:#1c1a17; min-height:300px; text-decoration:none; color:inherit;}
.cs-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.cs-hero__grad{position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(20,18,15,.05) 0%,rgba(20,18,15,.15) 42%,rgba(20,18,15,.82) 100%);}
.cs-hero__badge{position:absolute; top:16px; left:16px; font-size:12px; font-weight:600; color:var(--accent);
  background:var(--accent-bg); padding:4px 10px; border-radius:6px; white-space:nowrap;}
.cs-hero__inner{position:absolute; left:0; right:0; bottom:0; padding:22px; display:flex; flex-direction:column; align-items:flex-start;}
.cs-hero__title{font-size:26px; font-weight:700; letter-spacing:-0.025em; line-height:1.08; margin:0 0 12px;
  color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.35);}
.cs-hero__meta{font-size:15px; color:rgba(255,255,255,.92); display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  text-shadow:0 1px 8px rgba(0,0,0,.4);}
.cs-hero__meta .sep{opacity:.5;}

/* ---------- meta-grid (Notion properties) ---------- */
.cs-metagrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  border:1px solid var(--line); border-radius:8px; overflow:hidden;}
.cs-metagrid__cell{padding:14px 16px; border-right:1px solid var(--line); border-bottom:1px solid var(--line);}
.cs-metagrid__label{font-size:12px; color:var(--faint); margin-bottom:4px;}
.cs-metagrid__val{font-size:14px; font-weight:500;}

/* ---------- ticket sidebar ---------- */
.cs-ticket{border:1px solid var(--line); border-radius:12px; padding:22px; background:#fff;
  box-shadow:0 1px 2px rgba(33,28,23,.04),0 14px 30px -22px rgba(33,28,23,.18);}
.cs-ticket__price{display:flex; align-items:baseline; gap:7px; margin-bottom:18px;}
.cs-ticket__price b{font-size:30px; font-weight:700; letter-spacing:-0.02em;}
.cs-ticket__price span{font-size:13px; color:var(--faint);}
.cs-ticket__prop{display:flex; gap:11px; align-items:center;}
.cs-ticket__ico{width:32px; height:32px; border-radius:8px; background:var(--accent-bg);
  display:flex; align-items:center; justify-content:center; flex:none;}
.cs-ticket__note{font-size:12px; color:var(--faint); text-align:center; margin:14px 0 0; line-height:1.4;}

/* ---------- danger zone ---------- */
.cs-danger{border:1px solid rgba(196,69,45,.3); border-radius:12px; padding:24px 26px; background:var(--danger-bg);}
.cs-danger__label{font-size:13px; font-weight:600; letter-spacing:0.02em; text-transform:uppercase; color:var(--danger); margin-bottom:12px;}
.cs-btn--danger{background:var(--danger); color:#fff; border:none;}
.cs-btn--danger[disabled]{background:#E8B5AA; cursor:not-allowed;}

/* ---------- empty state ---------- */
.cs-empty{text-align:center; padding:72px 20px; color:var(--faint);}
.cs-empty__emoji{font-size:34px; margin-bottom:10px;}
.cs-empty__title{font-size:16px; color:var(--mute); margin:0 0 4px; font-weight:500;}

/* ---------- footer ---------- */
.cs-footer{border-top:1px solid var(--line);}
.cs-footer__inner{max-width:var(--maxw); margin:0 auto; padding:48px 16px 28px;}
.cs-footer__top{display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap; font-size:14px; color:var(--mute);}
.cs-footer__about{max-width:300px;}
.cs-footer__desc{margin:0; line-height:1.55; color:var(--faint); font-size:13px;}
.cs-footer__cols{display:flex; gap:40px; flex-wrap:wrap;}
.cs-footer__col{display:flex; flex-direction:column; gap:9px;}
.cs-footer__coltitle{font-size:12px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--faint); margin-bottom:2px;}
.cs-footer__col a{color:var(--mute); text-decoration:none;}
.cs-footer__col a:hover{color:var(--accent);}
.cs-footer__bottom{border-top:1px solid var(--line); margin-top:28px; padding-top:18px; display:flex;
  justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--faint);}
.cs-footer__bottom a{color:var(--faint); text-decoration:none;}

/* ============ desktop (≥761px) ============ */
@media (min-width:761px){
  .cs-wrap{padding-left:24px; padding-right:24px;}
  .cs-page{padding-top:48px;}
  .cs-h1{font-size:38px;}
  .cs-hero{min-height:360px;}
  .cs-hero__inner{padding:32px 36px;}
  .cs-hero__title{font-size:38px; margin-bottom:14px;}
  .cs-form-grid{grid-template-columns:1fr 1fr;}
  .cs-footer__inner{padding:48px 24px 28px;}
}