/* ============================================================
   ecomarguru.ru — страницы резюме (/resume/*)
   Стилистика: редакторский манифест-стиль сайта + приёмная
   языковая вёрстка референса (крупные заявления, тёмная герой-
   зона, крупные цифры результатов, нумерованный таймлайн).
   Наследует токены из site-new.css.
   ============================================================ */

:root{
  --brand-light: #b7aeff;      /* акцент на тёмном фоне */
  --brand-glow:  rgba(91,75,255,.35);
  --ink-deep:    #0b0d17;
}

/* ===================== ТЁМНАЯ ГЕРОЙ-ЗОНА ===================== */
.r-hero{
  position:relative; overflow:hidden; color:#fff;
  background:
    radial-gradient(1100px 520px at 85% -10%, rgba(91,75,255,.38), transparent 60%),
    radial-gradient(800px 420px at -8% 108%, rgba(37,99,235,.30), transparent 60%),
    linear-gradient(180deg, var(--ink-deep) 0%, #151a2e 100%);
  padding:76px 0 64px;
}
.r-hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
}
.r-hero__in{display:grid; grid-template-columns:1.25fr .75fr; gap:48px; align-items:center}
@media (max-width:920px){.r-hero__in{grid-template-columns:1fr; gap:36px}}

.r-hero .eyebrow{
  color:#fff; background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
}
.r-hero h1{
  font-size:clamp(36px,5.4vw,66px); line-height:1.04;
  letter-spacing:-.02em; margin:18px 0 16px; font-weight:900;
}
.r-hero h1 .accent{color:var(--brand-light)}
.r-hero__sub{
  font-size:clamp(16px,1.6vw,19px); color:#c8ccd9; max-width:640px; margin:0 0 14px;
}
.r-hero__quote{
  font-size:16px; color:#fff; border-left:3px solid var(--brand-light);
  padding:2px 0 2px 16px; margin:0 0 26px; max-width:600px; font-weight:500;
}
.r-hero__cta{display:flex; gap:12px; flex-wrap:wrap}
.r-hero .btn--outline{color:#fff; border-color:rgba(255,255,255,.35); background:transparent}
.r-hero .btn--outline:hover{border-color:#fff; color:#fff}
.r-hero__note{
  display:flex; gap:10px; align-items:flex-start; margin:26px 0 0;
  font-size:14px; color:#aab0c4; max-width:520px;
}
.r-hero__note .jstrip__dot{margin-top:5px; background:var(--brand-light)}

/* карточка роли справа (тёмная) */
.r-rolecard{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-xl); padding:28px;
  backdrop-filter:blur(6px);
}
.r-rolecard__label{
  font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brand-light); margin-bottom:10px;
}
.r-rolecard__big{font-size:clamp(30px,3vw,40px); font-weight:900; letter-spacing:-.02em; line-height:1.05}
.r-rolecard__cap{font-size:13px; color:#aab0c4; margin:6px 0 18px}
.r-rolecard__list{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.r-rolecard__list li{
  display:flex; justify-content:space-between; gap:14px; align-items:baseline;
  padding-bottom:10px; border-bottom:1px dashed rgba(255,255,255,.14);
  font-size:14px; color:#c8ccd9;
}
.r-rolecard__list li:last-child{border-bottom:0; padding-bottom:0}
.r-rolecard__list b{color:#fff; font-size:16px; font-weight:800; white-space:nowrap}

/* ===================== ПОРОЙ ЗАЯВЛЕНИЙ (как в референсе) ===================== */
.r-stats{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--bg-tint)}
.r-stats__in{
  display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  max-width:var(--wrap); margin:0 auto; padding:0 24px;
}
.r-stats__item{
  padding:30px 28px 30px 0; position:relative;
}
.r-stats__item + .r-stats__item{padding-left:28px; border-left:1px solid var(--line)}
.r-stats__n{
  font-size:12px; font-weight:800; color:var(--brand); letter-spacing:.14em;
  display:block; margin-bottom:10px;
}
.r-stats__t{font-size:clamp(19px,2vw,24px); font-weight:800; line-height:1.15; letter-spacing:-.01em}
.r-stats__d{font-size:14px; color:var(--slate); margin-top:8px}
@media (max-width:820px){
  .r-stats__in{grid-template-columns:1fr}
  .r-stats__item + .r-stats__item{padding-left:0; border-left:0; border-top:1px solid var(--line)}
}

/* ===================== КРУПНЫЕ ЦИФРЫ РЕЗУЛЬТАТОВ ===================== */
.r-nums{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap)}
@media (max-width:1000px){.r-nums{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.r-nums{grid-template-columns:1fr 1fr}}
.r-num{
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:24px 22px; transition:.2s;
}
.r-num:hover{transform:translateY(-2px); box-shadow:var(--shadow-md); border-color:transparent}
.r-num b{
  display:block; font-size:clamp(30px,3.4vw,42px); font-weight:900;
  letter-spacing:-.03em; line-height:1; color:var(--ink);
}
.r-num b .accent{color:var(--brand)}
.r-num span{display:block; font-size:13px; color:var(--slate); margin-top:10px; line-height:1.45}

/* ===================== ПРОФИЛЬ: редакторский текст ===================== */
.r-profile{display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:start}
@media (max-width:920px){.r-profile{grid-template-columns:1fr; gap:24px}}
.r-profile__text p{font-size:17px; line-height:1.65; color:var(--ink-2)}
.r-profile__text p b{color:var(--ink)}
.r-profile__facts{
  background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:24px; display:grid; gap:14px;
}
.r-profile__facts h4{font-size:13px; text-transform:uppercase; letter-spacing:.12em; color:var(--slate); margin:0}
.r-profile__facts ul{list-style:none; margin:0; padding:0; display:grid; gap:12px}
.r-profile__facts li{font-size:14px; display:flex; gap:10px; align-items:baseline}
.r-profile__facts li::before{content:"●"; color:var(--brand); font-size:9px; flex:0 0 auto}

/* ===================== ТАЙМЛАЙН ОПЫТА (тёмный) ===================== */
.r-tl{background:linear-gradient(180deg, var(--ink-deep), #151a2e); color:#fff; border-radius:var(--r-xl); padding:clamp(28px,4vw,56px)}
.r-tl__head{max-width:720px; margin-bottom:36px}
.r-tl__head .eyebrow{color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22)}
.r-tl__head h2{font-size:clamp(26px,3.2vw,40px); margin:14px 0 10px}
.r-tl__head p{color:#aab0c4; margin:0; font-size:16px}
.r-tl__list{display:grid; gap:18px; position:relative}
.r-tl__item{
  display:grid; grid-template-columns:190px 1fr; gap:28px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg); padding:26px 28px;
}
@media (max-width:820px){.r-tl__item{grid-template-columns:1fr; gap:14px}}
.r-tl__period{
  font-size:13px; font-weight:800; letter-spacing:.06em; color:var(--brand-light);
  text-transform:uppercase; line-height:1.5;
}
.r-tl__period small{display:block; color:#8a93a6; font-weight:600; letter-spacing:.04em; margin-top:4px; font-size:12px}
.r-tl__role{font-size:20px; font-weight:800; letter-spacing:-.01em; margin:0 0 2px}
.r-tl__org{font-size:14px; color:#aab0c4; margin:0 0 14px}
.r-tl__org b{color:#e8eaf2; font-weight:700}
.r-tl__body ul{margin:0; padding-left:18px; display:grid; gap:8px}
.r-tl__body li{font-size:14.5px; color:#c8ccd9; line-height:1.55}
.r-tl__body li::marker{color:var(--brand-light)}
.r-tl__body li b{color:#fff}
.r-tl__res{
  margin:14px 0 0; padding:12px 16px; border-radius:var(--r-md);
  background:rgba(91,75,255,.16); border:1px solid rgba(183,174,255,.25);
  font-size:14px; color:#e8eaf2;
}
.r-tl__res b{color:#fff}
.r-tl__tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.r-tl__tags span{
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:#c8ccd9; border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:5px 11px;
}

/* ===================== КЕЙСЫ / КАРТОЧКИ ===================== */
.r-cases{display:grid; grid-template-columns:repeat(2,1fr); gap:var(--gap)}
@media (max-width:820px){.r-cases{grid-template-columns:1fr}}
.r-case{
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:26px; display:flex; flex-direction:column; gap:12px; transition:.2s;
}
.r-case:hover{transform:translateY(-2px); box-shadow:var(--shadow-md); border-color:transparent}
.r-case__meta{
  display:flex; justify-content:space-between; gap:12px; align-items:baseline;
  font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--slate-2);
}
.r-case__meta b{color:var(--brand)}
.r-case h3{font-size:19px; margin:0}
.r-case p{font-size:14px; color:var(--slate); margin:0; line-height:1.6}
.r-case__foot{
  margin-top:auto; padding-top:14px; border-top:1px solid var(--line-2);
  display:flex; justify-content:space-between; gap:12px; align-items:baseline;
  font-size:13px; color:var(--slate);
}
.r-case__foot b{color:var(--ink)}

/* ===================== БЛОК СКАЧИВАНИЯ РЕЗЮМЕ (светлая карточка) ===================== */
.r-dl{
  display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center;
  background:var(--bg-card); border:1px solid var(--line);
  border-radius:var(--r-xl); padding:32px 36px;
}
@media (max-width:820px){.r-dl{grid-template-columns:1fr; padding:26px}}
.r-dl h2{font-size:clamp(22px,2.6vw,30px); margin:12px 0 8px}
.r-dl p{font-size:15px; color:var(--slate); margin:0; max-width:640px; line-height:1.6}
.r-dl__act{display:grid; gap:10px; min-width:240px}
.r-dl .btn{justify-content:center}
.r-dl .btn--outline{color:var(--ink); border-color:var(--line); background:#fff}
.r-dl .btn--outline:hover{border-color:var(--ink); color:var(--ink); background:var(--bg-soft)}

/* ===================== ТЕХ-ПИЛЮЛИ (доп. тонкая настройка) ===================== */
.r-tech-note{font-size:13px; color:var(--slate); margin-top:16px}

/* ===================== ПЕЧАТЬ (PDF) ===================== */
@media print{
  .nav, .foot, .r-hero__cta, .r-dl, .cta-band, .btn{display:none !important}
  .r-hero{background:#fff; color:#000; padding:24px 0}
  .r-hero h1, .r-hero__sub, .r-hero__quote, .r-rolecard{color:#000}
  .r-hero .eyebrow{color:#000; background:#eee; border-color:#ccc}
  .r-rolecard{background:#f6f6f6; border:1px solid #ddd}
  .r-rolecard__list li, .r-rolecard__cap, .r-rolecard__label{color:#333}
  .r-rolecard__list b{color:#000}
  .r-tl{background:#fff; color:#000; border:1px solid #ddd}
  .r-tl__head h2, .r-tl__role{color:#000}
  .r-tl__org, .r-tl__body li, .r-tl__head p{color:#333}
  .r-tl__body li b, .r-tl__res{color:#000}
  .r-tl__item{background:#fafafa; border:1px solid #e5e5e5}
  .r-tl__period{color:#2a1bd1}
  .section{padding:24px 0}
  a{color:#000; text-decoration:none}
}