/* ============================================================
   obuhovv — премиальный светлый лендинг клуба (Champagne Performance)
   Единственный файл со «сырыми» цветами лендинга: всё остальное — var(--...).
   Тёмная платформа (tokens.css) не затрагивается: токены объявлены на .club-page.
   ============================================================ */

.club-page{
  /* Цветовая система */
  --ivory:#F3EFE5;
  --cream:#E9E1D1;
  --olive:#263329;
  --olive-muted:#5F674D;
  --champagne:#B79A5A;
  --bronze:#8B7447;
  --warm-white:#FFFDF7;
  --graphite:#242521;
  --line:color-mix(in srgb,var(--champagne) 42%,transparent);
  --line-soft:color-mix(in srgb,var(--olive) 12%,transparent);

  /* Типографика */
  --display:'Cormorant Garamond', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:'Manrope', 'Inter', 'Helvetica Neue', Arial, sans-serif;

  /* Отступы и скругления (по ТЗ — те же шкалы, что в платформе) */
  --space-xs:4px; --space-sm:8px; --space-md:16px; --space-lg:24px;
  --space-xl:32px; --space-2xl:48px; --space-3xl:64px;
  --radius-sm:8px; --radius-md:16px; --radius-lg:24px; --radius-full:999px;
  --shadow-soft:0 18px 48px rgba(38,51,41,.10);

  background:var(--ivory);
  color:var(--olive);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
.club-page *{box-sizing:border-box}
.club-page img{max-width:100%;display:block}
.club-page a{color:inherit;text-decoration:none}
.club-page h1,.club-page h2,.club-page h3{margin:0;font-family:var(--display);font-weight:500;letter-spacing:-.01em}
.club-page p{margin:0}

/* ── типографические утилиты ── */
.cap{font-family:var(--sans);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze)}
.cap-sm{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--champagne)}
.gold-rule{display:block;height:1px;background:var(--champagne);opacity:.75}
.italic{font-style:italic;font-family:var(--display)}

/* ── навигация ── */
.club-nav{position:sticky;top:0;z-index:30;background:var(--ivory);
  border-bottom:1px solid var(--line);padding:14px max(20px,env(safe-area-inset-left)) 12px}
.club-nav-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:var(--space-lg)}
.club-logo{display:flex;align-items:baseline;gap:14px;flex:0 0 auto}
.club-logo b{font-family:var(--display);font-size:30px;font-weight:500;letter-spacing:.01em;line-height:1}
.club-logo i{display:block;width:1px;height:26px;background:var(--line);align-self:center}
.club-logo span{font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--olive-muted)}
.club-menu{display:flex;gap:30px;margin:0 auto;list-style:none;padding:0}
.club-menu a{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--graphite);
  padding:6px 0;border-bottom:1px solid transparent;transition:border-color .3s ease,color .3s ease}
.club-menu a:hover{border-color:var(--champagne);color:var(--bronze)}
.club-crest{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.club-crest .mono{width:40px;height:40px;border:1px solid var(--line);border-radius:var(--radius-full);
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:19px;color:var(--bronze)}
.club-crest .creed{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--olive-muted);line-height:1.5}
.club-burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--radius-sm);
  width:48px;height:48px;font-size:20px;color:var(--olive);cursor:pointer}

/* выпадающее меню «Платформа» */
.club-menu .has-sub{position:relative}
.club-menu .sub{display:none;position:absolute;right:0;top:calc(100% + 12px);z-index:40;
  grid-template-columns:repeat(3,minmax(230px,1fr)) 200px;gap:var(--space-lg);
  background:var(--warm-white);border:1px solid var(--line);border-radius:2px;padding:var(--space-lg);
  box-shadow:var(--shadow-soft);min-width:860px}
.club-menu .has-sub:hover .sub,.club-menu .has-sub.open .sub{display:grid}
.club-menu .sub-col{display:flex;flex-direction:column;gap:2px}
.club-menu .sub-col .cap-sm{margin-bottom:var(--space-sm)}
.club-menu .sub a{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:var(--radius-sm);
  font-size:13.5px;letter-spacing:0;text-transform:none;color:var(--olive);border-bottom:none;
  transition:background .25s ease}
.club-menu .sub a:hover{background:var(--ivory)}
.club-menu .sub a em{font-style:normal;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bronze);margin-left:auto}
.club-menu .sub .si{width:20px;text-align:center;font-size:15px;filter:grayscale(.2)}
.club-menu .sub-foot{display:flex;flex-direction:column;gap:var(--space-sm);justify-content:center;
  border-left:1px solid var(--line-soft);padding-left:var(--space-lg)}
.club-btn.small{min-height:44px;padding:0 var(--space-md);font-size:11px;letter-spacing:.16em}

/* карта разделов платформы */
.map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);margin-top:var(--space-xl)}
.map-card{display:flex;gap:var(--space-md);align-items:flex-start;border:1px solid var(--line-soft);
  background:var(--warm-white);padding:var(--space-lg);transition:transform .35s ease,border-color .35s ease}
.map-card:hover{transform:translateY(-4px);border-color:var(--champagne)}
.map-card .si{font-size:22px;line-height:1.2}
.map-card b{font-family:var(--display);font-size:19px;font-weight:500}
.map-card .d{color:var(--olive-muted);font-size:13.5px;margin-top:6px}

/* ── hero ── */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-in{max-width:1400px;margin:0 auto;padding:var(--space-2xl) max(20px,env(safe-area-inset-left)) 0;
  display:grid;grid-template-columns:minmax(320px,42%) 1fr minmax(280px,330px);
  gap:var(--space-xl);min-height:940px;align-items:start}
.hero-copy{padding-top:var(--space-xl);position:relative;z-index:3}
.hero-eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:var(--space-lg)}
.hero-eyebrow .gold-rule{width:64px}
.hero h1{font-size:clamp(42px,7.2vw,102px);line-height:.98;color:var(--olive);letter-spacing:-.02em}
.hero h1 em{font-style:italic;font-weight:400}
.hero-lead{margin-top:var(--space-lg);max-width:42ch;color:var(--olive-muted);font-size:17px}
.hero-cta{margin-top:var(--space-xl);display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}

.club-btn{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 var(--space-lg);
  border:1px solid var(--champagne);border-radius:var(--radius-full);background:transparent;color:var(--olive);
  font-family:var(--sans);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;cursor:pointer;
  transition:background .35s ease,border-color .35s ease,color .35s ease}
.club-btn .arr{display:inline-block;transition:transform .35s ease}
.club-btn:hover{background:var(--warm-white);border-color:var(--bronze)}
.club-btn:hover .arr{transform:translateX(6px)}
.club-btn.solid{background:var(--olive);border-color:var(--olive);color:var(--ivory)}
.club-btn.solid:hover{background:var(--graphite);border-color:var(--graphite)}
.club-btn.ghost{border-color:var(--line-soft);color:var(--olive-muted)}
.club-btn.ghost:hover{border-color:var(--champagne);background:transparent;color:var(--olive)}
.club-btn:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}

/* центральная зона — фотография */
.hero-figure{position:relative;align-self:end;min-height:560px;z-index:2}
.hero-photo{width:100%;height:100%;min-height:560px;object-fit:cover;object-position:62% 50%;
  border-radius:2px;filter:saturate(.96) contrast(1.02);
  animation:heroIn 1.4s ease both}
.hero-lqip{position:absolute;inset:0;background-image:url(hero-lqip.jpg);background-size:cover;
  background-position:62% 50%;filter:blur(22px);transform:scale(1.06);opacity:.85;z-index:-1}
@keyframes heroIn{from{opacity:0;transform:translateY(16px) scale(1.02)}to{opacity:1;transform:none}}

/* правая карточка результатов */
.result-card{position:relative;z-index:3;margin-top:var(--space-lg);padding:var(--space-lg);
  background:color-mix(in srgb,var(--warm-white) 88%,transparent);border:1px solid var(--line);
  border-radius:2px;backdrop-filter:blur(6px)}
.result-card h2{font-size:13px;letter-spacing:.24em;text-transform:uppercase;font-family:var(--sans);
  color:var(--bronze);font-weight:600}
.result-list{list-style:none;margin:var(--space-md) 0 0;padding:0}
.result-list li{display:flex;align-items:center;gap:var(--space-md);padding:14px 0;border-bottom:1px solid var(--line-soft);
  opacity:0;transform:translateY(10px);animation:metricIn .9s ease forwards}
.result-list li:last-child{border-bottom:none}
.result-list li:nth-child(1){animation-delay:.35s}
.result-list li:nth-child(2){animation-delay:.5s}
.result-list li:nth-child(3){animation-delay:.65s}
.result-list li:nth-child(4){animation-delay:.8s}
@keyframes metricIn{to{opacity:1;transform:none}}
.result-list .ico{width:38px;height:38px;flex:0 0 38px;border:1px solid var(--line);border-radius:var(--radius-full);
  display:flex;align-items:center;justify-content:center;color:var(--bronze)}
.result-list .val{font-family:var(--display);font-size:30px;line-height:1;color:var(--olive);min-width:96px}
.result-list .lbl{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--olive-muted)}
.result-creed{margin-top:var(--space-md);text-align:center;font-size:10.5px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--bronze);line-height:1.6}

/* нижняя линия hero: герб, бренд, контуры высот */
.hero-foot{max-width:1400px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left)) var(--space-2xl);
  display:flex;align-items:flex-end;gap:var(--space-lg)}
.hero-foot .brandline{font-family:var(--display);font-size:22px}
.hero-foot .sub{font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--olive-muted)}
.contours{flex:1;height:64px;opacity:.55}
.contours path{stroke:var(--champagne);fill:none;stroke-width:1;animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{from{transform:translateX(-8px)}to{transform:translateX(10px)}}

/* ── секции ── */
.sect{padding:var(--space-3xl) max(20px,env(safe-area-inset-left));border-bottom:1px solid var(--line-soft)}
.sect-in{max-width:1400px;margin:0 auto}
.sect-head{display:flex;align-items:baseline;gap:var(--space-lg);margin-bottom:var(--space-2xl);flex-wrap:wrap}
.sect-head h2{font-size:clamp(30px,4.4vw,58px);line-height:1.06;max-width:22ch}
.sect-head .num{font-family:var(--display);font-size:16px;color:var(--champagne)}
.two-col{display:grid;grid-template-columns:minmax(300px,1fr) minmax(280px,.85fr);gap:var(--space-2xl);align-items:start}
.about-text{color:var(--olive-muted);font-size:17px;max-width:56ch}
.about-text + .about-text{margin-top:var(--space-md)}
.about-fig{border:1px solid var(--line);padding:var(--space-lg);background:var(--warm-white)}
.about-fig .cap{margin-bottom:var(--space-md)}
.about-list{list-style:none;margin:0;padding:0;color:var(--olive-muted);font-size:15px}
.about-list li{padding:10px 0;border-bottom:1px solid var(--line-soft)}
.about-list li:last-child{border-bottom:none}

/* принципы методики */
.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-xl)}
.principle{border-top:1px solid var(--line);padding-top:var(--space-md)}
.principle .n{font-family:var(--display);font-size:15px;color:var(--champagne)}
.principle h3{margin-top:var(--space-sm);font-size:22px;letter-spacing:.02em}
.principle p{margin-top:var(--space-sm);color:var(--olive-muted);font-size:15px}

/* направления тренировок */
.directions{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-lg)}
.direction{position:relative;border:1px solid var(--line-soft);padding:var(--space-lg);background:var(--warm-white);
  min-height:220px;display:flex;flex-direction:column;justify-content:space-between;
  transition:transform .35s ease,border-color .35s ease}
.direction:hover{transform:translateY(-4px);border-color:var(--champagne)}
.direction .route{height:44px;opacity:.7}
.direction .route path{stroke:var(--champagne);fill:none;stroke-width:1.2}
.direction h3{font-size:20px;letter-spacing:.04em}
.direction .d{color:var(--olive-muted);font-size:13.5px;margin-top:6px}

/* события */
.events{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}
.event{border:1px solid var(--line);background:var(--warm-white);display:flex;flex-direction:column}
.event .top{padding:var(--space-lg);border-bottom:1px solid var(--line-soft)}
.event .date{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne)}
.event h3{font-size:23px;margin-top:10px}
.event .body{padding:var(--space-lg);color:var(--olive-muted);font-size:15px;flex:1}
.event .foot{padding:0 var(--space-lg) var(--space-lg);display:flex;justify-content:space-between;align-items:center;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)}

/* сообщество */
.community{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}
.voice{border:1px solid var(--line-soft);padding:var(--space-lg);background:var(--warm-white);display:flex;flex-direction:column;gap:var(--space-md)}
.voice blockquote{margin:0;font-family:var(--display);font-size:20px;line-height:1.4;color:var(--olive)}
.voice .who{display:flex;align-items:center;gap:var(--space-md)}
.voice .mono{width:44px;height:44px;border:1px solid var(--line);border-radius:var(--radius-full);
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:17px;color:var(--bronze)}
.voice .meta{font-size:12.5px;color:var(--olive-muted)}
.community-stats{display:flex;gap:var(--space-2xl);margin-top:var(--space-2xl);flex-wrap:wrap}
.community-stats .st-item .v{font-family:var(--display);font-size:34px;line-height:1}
.community-stats .st-item .l{font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--olive-muted);margin-top:6px}

/* финальный CTA */
.final{padding:var(--space-3xl) max(20px,env(safe-area-inset-left));text-align:center;background:var(--cream)}
.final h2{font-size:clamp(30px,4.6vw,60px);line-height:1.06}
.final .promise{margin-top:var(--space-lg);color:var(--olive-muted);font-size:16.5px}
.final .row{margin-top:var(--space-xl);display:flex;gap:var(--space-md);justify-content:center;flex-wrap:wrap}

/* футер */
.club-foot{border-top:1px solid var(--line);padding:var(--space-xl) max(20px,env(safe-area-inset-left));
  background:var(--ivory)}
.club-foot-in{max-width:1400px;margin:0 auto;display:flex;gap:var(--space-lg);justify-content:space-between;
  flex-wrap:wrap;align-items:center;font-size:12px;color:var(--olive-muted)}
.club-foot a:hover{color:var(--bronze)}

/* появление при прокрутке */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ── адаптивность ── */
@media (max-width:1024px){
  .hero-in{grid-template-columns:1fr;min-height:0;gap:var(--space-lg)}
  .hero-copy{padding-top:var(--space-lg)}
  .hero-figure{min-height:0;order:5}
  .hero-photo{min-height:0;height:auto;max-height:56vh}
  .result-card{order:6}
  .principles{grid-template-columns:repeat(2,1fr)}
  .directions{grid-template-columns:repeat(2,1fr)}
  .events{grid-template-columns:1fr}
  .community{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .club-menu{display:none}
  .map-grid{grid-template-columns:1fr}
  .club-menu .sub{position:static;display:grid;grid-template-columns:1fr;gap:var(--space-md);
    min-width:0;padding:var(--space-md) 0 0;border:none;box-shadow:none;background:transparent}
  .club-menu .has-sub:hover .sub{display:none}
  .club-menu .has-sub.open .sub{display:grid}
  .club-menu .sub .sub-foot{border-left:none;padding-left:0}
  .club-burger{display:inline-flex;align-items:center;justify-content:center}
  .club-nav.open .club-menu{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;
    background:var(--ivory);border-bottom:1px solid var(--line);padding:var(--space-md) max(20px,env(safe-area-inset-left))}
  .club-nav.open .club-menu a{display:block;padding:14px 0;border-bottom:1px solid var(--line-soft)}
  .club-crest .creed{display:none}
}
@media (max-width:768px){
  .club-page{font-size:16px}
  .hero h1{font-size:clamp(42px,11vw,56px)}
  .result-list .val{min-width:84px;font-size:26px}
  .principles,.directions{grid-template-columns:1fr}
  .sect{padding:var(--space-2xl) max(16px,env(safe-area-inset-left))}
}
@media (max-width:375px){
  .club-logo b{font-size:26px}
  .club-logo span{display:none}
  .hero-cta .club-btn{width:100%;justify-content:center}
}

/* доступность: уважаем просьбу уменьшить движение */
@media (prefers-reduced-motion:reduce){
  .club-page *{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
  .result-list li{opacity:1;transform:none}
  .contours path{animation:none}
}