.cpage { display: grid; grid-template-columns: 260px 1fr; max-width: 1400px; margin: 0 auto; gap: 0; }
@media (max-width: 900px) { .cpage { grid-template-columns: 1fr; } }

.csbar { background: var(--paper); border-right: 1px solid var(--line); min-height: calc(100vh - 80px); padding: 24px 18px; position: sticky; top: 70px; align-self: start; max-height: calc(100vh - 80px); overflow-y: auto; }
.csbar__h { font-size: 11px; letter-spacing: 0.16em; color: var(--hint); text-transform: uppercase; font-weight: 700; margin-bottom: 14px; padding: 0 8px; }
.csbar__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.csbar__list a { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; color: var(--text); text-decoration: none; font-size: 14px; transition: all 100ms; }
.csbar__list a:hover { background: rgba(255,255,255,0.05); }
.csbar__list a.on { background: var(--accent-soft); color: var(--accent-2); font-weight: 600; }
.csbar__flag { font-size: 18px; }
@media (max-width: 900px) {
  .csbar { position: static; min-height: auto; max-height: none; overflow-x: auto; padding: 14px; }
  .csbar__list { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; }
  .csbar__list a { white-space: nowrap; }
}

.cmain { padding: 0; min-width: 0; }

.hero-img { width:100%; height: 320px; background:#1d2030 center / cover no-repeat; position: relative; }
.hero-img__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(7,8,12,0.85) 100%); display:flex; align-items: flex-end; padding: 28px 32px; }
.hero-img__title h1 { color:#fff; font-size: clamp(28px, 4.5vw, 44px); margin: 0; letter-spacing: -0.02em; text-shadow: 0 2px 10px rgba(0,0,0,0.5); }
.hero-img__title .sub { color: rgba(255,255,255,0.85); font-size: 14px; margin-top: 6px; }

.ctabs { display: flex; gap: 4px; padding: 18px 28px 0; border-bottom: 1px solid var(--line); position: sticky; top: 70px; background: var(--bg); z-index: 10; }
.ctab { background: transparent; border: none; color: var(--hint); font: inherit; font-size: 14px; font-weight: 600; padding: 14px 20px; border-bottom: 2px solid transparent; cursor: pointer; transition: all 100ms; }
.ctab.on { color: var(--accent-2); border-bottom-color: var(--accent); }
.ctab:hover { color: var(--text); }

.csection { padding: 28px 32px 60px; }
.csection h2 { font-size: 20px; letter-spacing: -0.01em; margin: 0 0 18px; }

/* Places — rich cards with photo strip + history */
.places-rich { display: flex; flex-direction: column; gap: 28px; }
.place-rich { background: var(--paper); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; display: grid; grid-template-columns: 1fr 1.3fr; gap: 0; }
@media (max-width: 900px) { .place-rich { grid-template-columns: 1fr; } }
.place-rich__photos { display: grid; grid-template-rows: 1.4fr 1fr 1fr; gap: 2px; aspect-ratio: 4/3; min-height: 280px; background: var(--paper-2); }
.place-rich__photos .ph { background: var(--paper-2) center / cover no-repeat; }
.place-rich__photos .ph:first-child { grid-row: 1; }
@media (max-width: 900px) { .place-rich__photos { grid-template-rows: 1fr; grid-template-columns: 2fr 1fr 1fr; aspect-ratio: 16/9; min-height: 0; } }
.place-rich__body { padding: 24px 26px; }
.place-rich__num { display: inline-block; width: 28px; height: 28px; background: linear-gradient(135deg, var(--accent), #9e7c14); color: #07080c; border-radius: 50%; text-align: center; line-height: 28px; font-weight: 800; font-size: 13px; margin-bottom: 10px; }
.place-rich__name { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; }
.place-rich__city { color: var(--hint); font-size: 12px; text-transform: uppercase; letter-spacing: 0.14em; margin-top: 4px; font-weight: 600; }
.place-rich__history { color: rgba(255,255,255,0.85); font-size: 14px; line-height: 1.7; margin-top: 14px; }

/* Dishes */
.dishes { display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.dish { background: var(--paper); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.dish__img { aspect-ratio: 4/3; background: var(--paper-2) center / cover no-repeat; }
.dish__body { padding: 16px 18px 18px; }
.dish__type { font-size: 10px; color: var(--accent-2); text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; }
.dish__name { font-weight: 700; font-size: 17px; margin-top: 4px; }
.dish__history { color: rgba(255,255,255,0.80); font-size: 13px; line-height: 1.6; margin-top: 10px; }

/* Shopping */
.shopping__intro { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 18px 22px; margin-bottom: 22px; color: rgba(255,255,255,0.85); font-size: 14px; line-height: 1.6; }
.spots { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); margin-bottom: 26px; }
.spot { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; }
.spot__name { font-weight: 700; font-size: 16px; }
.spot__city { font-size: 11px; color: var(--hint); text-transform: uppercase; letter-spacing: 0.12em; margin-top: 2px; }
.spot__what { font-size: 13px; margin-top: 10px; color: rgba(255,255,255,0.88); line-height: 1.55; }
.spot__tip { font-size: 12px; color: var(--accent-2); margin-top: 8px; padding: 8px 10px; background: rgba(212,175,55,0.08); border-radius: 8px; line-height: 1.5; }
.buy-list { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 18px 22px; margin-bottom: 16px; }
.buy-list h3 { margin: 0 0 10px; font-size: 14px; color: var(--accent-2); letter-spacing: -0.01em; }
.buy-list ul { padding-left: 18px; margin: 0; }
.buy-list li { font-size: 14px; color: rgba(255,255,255,0.85); margin-bottom: 4px; line-height: 1.5; }
.avoid-list { background: rgba(255,107,107,0.06); border: 1px solid rgba(255,107,107,0.3); border-radius: 14px; padding: 18px 22px; }
.avoid-list h3 { margin: 0 0 10px; font-size: 14px; color: #ff6b6b; }
.avoid-list ul { padding-left: 18px; margin: 0; }
.avoid-list li { font-size: 14px; color: rgba(255,255,255,0.85); margin-bottom: 4px; line-height: 1.5; }

/* Info / facts row */
.facts { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); margin-bottom: 18px; }
.fact { background: var(--paper); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; }
.fact__label { font-size: 11px; color: var(--hint); text-transform: uppercase; letter-spacing: 0.08em; }
.fact__value { font-size: 14px; font-weight: 600; margin-top: 2px; }

.tradi { display: flex; flex-direction: column; gap: 6px; padding-left: 0; list-style: none; }
.tradi li { padding-left: 18px; position: relative; }
.tradi li::before { content: "·"; position: absolute; left: 6px; color: var(--accent); font-weight: 700; }

.empty-state { background: var(--paper); border: 1px dashed var(--line); border-radius: 14px; padding: 32px; text-align: center; color: var(--hint); font-size: 14px; }

/* Pre-trip cross-sell cards (affiliate marker 528879) */
.pretrip-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin-top: 8px; }
.pretrip-card { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; transition: all 120ms; }
.pretrip-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 8px 22px rgba(212,175,55,0.14); }
.pretrip-card__icon { font-size: 24px; }
.pretrip-card__name { font-weight: 700; font-size: 15px; }
.pretrip-card__desc { color: var(--hint); font-size: 12px; line-height: 1.5; margin-top: 2px; }
.pretrip-card--hot { border-color: var(--accent); background: linear-gradient(135deg, rgba(212,175,55,0.08) 0%, var(--paper) 100%); position: relative; }
.pretrip-card--hot::after { content: "★ Не пропусти"; position: absolute; top: 10px; right: 10px; background: var(--accent); color: #07080c; font-size: 9px; font-weight: 800; padding: 3px 8px; border-radius: 100px; letter-spacing: 0.1em; text-transform: uppercase; }