/* ================================================================
 *  styles.css — все стили сайта rabota-365.ru одним файлом.
 *  Значения перенесены 1:1 из исходного экспорта Claude Design.
 *  Шрифт Manrope указан первым в стеке; при работе офлайн
 *  используется системный (system-ui) — внешние CDN не подключаются.
 *  Чтобы вернуть Manrope, добавьте локальный @font-face сюда.
 * ================================================================ */

/* ---------- база ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F7F6F3;color:#21201F;font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
img{display:block}
button,input,summary{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
h1,h2,h3,p,ul,ol{margin:0}

@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes bentoRise{from{opacity:0;transform:translateY(22px) scale(.96)}to{opacity:1;transform:none}}
@keyframes pushPulse{0%,100%{box-shadow:0 12px 30px rgba(33,32,31,.14)}50%{box-shadow:0 16px 40px rgba(227,174,0,.42)}}

/* ---------- ползунки расчёта ---------- */
input[type="range"]{-webkit-appearance:none;appearance:none;height:8px;border-radius:4px;outline:none;cursor:pointer;width:100%;border:none;padding:0}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;border-radius:50%;background:#FCE000;border:3px solid #21201F;cursor:grab;box-shadow:0 2px 6px rgba(33,32,31,.25)}
input[type="range"]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#FCE000;border:3px solid #21201F;cursor:grab}

/* ================= ИНТРО-ЗАСТАВКА ================= */
#r365-intro{position:fixed;inset:0;z-index:1000;background:#FFFFFF;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px;transition:transform .6s cubic-bezier(.55,0,.3,1);will-change:transform}
#r365-intro.leave{transform:translateY(-101%)}
.intro__mark{width:clamp(76px,18vw,104px);height:auto;animation:r365pop .9s ease-out both}
.intro__brand{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;animation:r365pop .9s ease-out .3s both}
.intro__line1{margin:0;font-size:clamp(20px,5.4vw,28px);font-weight:800;letter-spacing:-0.025em;line-height:1.15;color:#21201F}
.intro__line2{margin:0;font-size:clamp(13px,3.4vw,15px);font-weight:600;line-height:1.2;color:#8B8984}
@keyframes r365pop{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
html.no-intro #r365-intro{display:none}
body.r365-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){#r365-intro{display:none}}

/* ================= ШАПКА ================= */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid #ECEAE4}
.site-header__inner{max-width:1200px;margin:0 auto;min-height:74px;padding:0 20px;display:flex;align-items:center;gap:20px}
.site-header__logo{flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:11px}
/* локап: знак + две строки, строго по левому краю */
.brand-mark{flex:none;width:46px;height:46px}
.brand-text{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0}
.brand-text__line1{font-size:17px;font-weight:800;line-height:1.15;letter-spacing:-0.02em;color:#21201F;white-space:nowrap}
.brand-text__line2{margin-top:2px;font-size:12px;font-weight:500;line-height:1.2;color:#8B8984;white-space:nowrap}
.main-nav{display:none;align-items:center;gap:26px;margin-left:auto;font-size:16px;font-weight:700}
.main-nav a{transition:opacity .2s ease-out}
.main-nav a:hover{opacity:.6}
@media (min-width:800px){.main-nav{display:flex}}
.btn-apply{margin-left:auto;flex:none;display:inline-flex;align-items:center;background:#FCE000;border-radius:14px;padding:0 20px;height:46px;font-size:15px;font-weight:800;transition:transform .3s ease-out,box-shadow .3s ease-out}
.btn-apply:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(252,224,0,.5)}
/* узкие экраны: только знак + первая строка, компактная кнопка */
@media (max-width:639px){
  .site-header__inner{gap:12px;padding:0 16px}
  .site-header__logo{gap:9px}
  .brand-mark{width:40px;height:40px}
  .brand-text__line1{font-size:15px;white-space:normal}
  .brand-text__line2{display:none}
  .btn-apply{padding:0 14px;height:42px;font-size:14px}
}

/* общий заголовок секции */
.section-h2{margin:0 0 8px;font-size:clamp(26px,4.5vw,40px);font-weight:800;letter-spacing:-0.02em;text-align:center}

/* ================= HERO ================= */
.hero{position:relative;z-index:2;background:radial-gradient(120% 120% at 88% 18%,#FFF9DB 0%,#FFFDF4 34%,#FFFFFF 68%)}
.hero__inner{max-width:1200px;margin:0 auto;padding:clamp(24px,4vw,56px) 20px clamp(28px,4vw,52px)}
.hero__grid{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(28px,4vw,48px)}
.hero__col-left{flex:1 1 440px;min-width:min(100%,320px)}
.hero__badge{margin:0 0 22px;font-size:13px;font-weight:600;letter-spacing:.02em;color:#8B8984}
.hero__title{margin:0 0 20px;font-size:clamp(34px,5.4vw,62px);line-height:1.02;font-weight:800;letter-spacing:-0.035em;text-wrap:balance}
.hero__sub{margin:0 0 30px;max-width:500px;font-size:clamp(16px,2.2vw,18px);line-height:1.55;color:#55534E;text-wrap:pretty}
.hero__cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.hero__cta-link{padding:16px 4px;font-size:16px;font-weight:700;transition:opacity .3s ease-out;display:inline-flex;align-items:center;gap:6px}
.hero__cta-link:hover{opacity:.55}
.hero__note{margin:22px 0 0;font-size:13px;font-weight:600;color:#9C9A94}
.hero__col-right{flex:1.08 1 440px;min-width:min(100%,320px);position:relative}
.bento{position:relative;width:100%;max-width:560px;margin:0 auto;aspect-ratio:1/1}
.bento__photo{position:absolute;left:0;bottom:0;width:74%;aspect-ratio:4/5;border-radius:28px;overflow:hidden;box-shadow:0 24px 60px rgba(33,32,31,.20);animation:bentoRise .7s ease-out both}
.bento__photo img{width:100%;height:100%;object-fit:cover;object-position:70% 30%}
.bento__slot{position:absolute;right:0;top:6%;width:47%;min-width:186px;background:#FFFFFF;border-radius:22px;padding:18px 20px;box-shadow:0 16px 40px rgba(33,32,31,.14);animation:bentoRise .6s ease-out .28s both}
.bento__slot-label{margin:0 0 6px;font-size:13px;font-weight:600;color:#9C9A94}
.bento__slot-time{margin:0 0 10px;font-size:clamp(20px,2.4vw,24px);font-weight:800;letter-spacing:-0.02em}
.bento__chip{display:inline-flex;align-items:center;gap:7px;background:#EAF7EF;border-radius:999px;padding:5px 11px}
.bento__chip-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#1F9D57}
.bento__chip-text{font-size:12px;font-weight:700;color:#1F7D46}
.bento__pay{position:absolute;left:-4%;bottom:12%;width:63%;min-width:238px;background:#FFFFFF;border-radius:22px;padding:16px 18px;display:flex;align-items:center;gap:14px;animation:bentoRise .6s ease-out .46s both,pushPulse 4s ease-in-out 1.4s infinite}
.bento__pay-icon{flex:none;width:46px;height:46px;border-radius:50%;background:#FCE000;display:inline-flex;align-items:center;justify-content:center;font-size:22px}
.bento__pay-body{min-width:0}
.bento__pay-label{margin:0 0 3px;font-size:13px;font-weight:600;color:#9C9A94}
.bento__pay-amount{margin:0;font-size:clamp(21px,2.5vw,26px);font-weight:800;letter-spacing:-0.02em;color:#1F9D57}
.bento__pay-time{margin:2px 0 0;font-size:12px;font-weight:600;color:#B4B2AC}
.bento__tips{position:absolute;right:2%;bottom:2%;background:#21201F;color:#FFFFFF;border-radius:16px;padding:11px 15px;display:flex;align-items:center;gap:9px;box-shadow:0 14px 30px rgba(33,32,31,.24);animation:bentoRise .6s ease-out .64s both}
.bento__tips-star{font-size:16px}
.bento__tips-text{font-size:15px;font-weight:800;letter-spacing:-0.01em;white-space:nowrap}
@media (max-width:560px){.bento__tips{display:none}}

/* ================= ЦИФРЫ ДОВЕРИЯ ================= */
.trust{background:#FFFFFF;position:relative;z-index:1}
.trust__inner{max-width:1200px;margin:0 auto;padding:clamp(24px,3vw,40px) 20px clamp(20px,3vw,32px)}
.trust__box{border:1px solid #ECEAE4;border-radius:20px;padding:clamp(20px,3vw,28px) clamp(20px,4vw,40px);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px clamp(32px,5vw,64px)}
.trust__item{flex:1 1 260px;display:flex;align-items:center;justify-content:center;gap:14px}
.trust__num{flex:none;font-size:clamp(32px,3.6vw,42px);font-weight:800;letter-spacing:-0.02em;color:#E3AE00}
.trust__text{font-size:15px;font-weight:500;line-height:1.35;color:#6B6A66;max-width:200px}
.trust__text--wide{max-width:220px}
.trust__divider{flex:none;width:1px;align-self:stretch;background:#ECEAE4}

/* ---------- общие кнопки ---------- */
.btn-dark{background:#21201F;color:#FFFFFF;border-radius:16px;padding:17px 28px;font-size:16px;font-weight:700;transition:transform .3s ease-out,box-shadow .3s ease-out}
.btn-dark:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(33,32,31,.28)}
.btn-yellow{flex:none;background:#FCE000;border-radius:14px;padding:15px 24px;font-size:15px;font-weight:800;transition:transform .3s ease-out,box-shadow .3s ease-out}
.btn-yellow:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(252,224,0,.55)}
.btn-outline{background:#FFFFFF;border:1.5px solid #E4E2DC;border-radius:14px;padding:12px 20px;font-size:15px;font-weight:700;cursor:pointer;transition:border-color .2s ease-out}
.btn-outline:hover{border-color:#21201F}
.pill-link{border:1.5px solid #E4E2DC;border-radius:999px;padding:9px 16px;font-size:13px;font-weight:700;transition:border-color .2s ease-out}
.pill-link:hover{border-color:#21201F}
.pill-link--inline{display:inline-block}
.dot{flex:none;width:8px;height:8px;border-radius:50%;background:#FCE000;margin-top:7px}
.dot--8{margin-top:8px}

/* ================= КВИЗ ================= */
.quiz{scroll-margin-top:76px}
.quiz__inner{max-width:1120px;margin:0 auto;padding:clamp(32px,4vw,48px) 20px}
.quiz__sub{margin:0 auto 24px;max-width:520px;font-size:16px;color:#6B6A66;text-align:center;text-wrap:pretty}
.quiz__layout{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,48px);align-items:center;justify-content:center}
.quiz__perks{flex:1 1 240px;max-width:360px;align-self:center;display:flex;flex-wrap:wrap;gap:10px;align-content:center}
.quiz__perk{flex:1 1 200px;display:flex;align-items:center;gap:12px;background:#FFFFFF;border-radius:16px;padding:14px 16px}
.quiz__perk-check{flex:none;width:34px;height:34px;border-radius:50%;background:#FCE000;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800}
.quiz__perk-text{font-size:16px;font-weight:700}
/* overflow:visible — чтобы дропдаун города не обрезался границей карточки.
   Скругление сохраняется через border-radius (фон/тень на самой карточке). */
.quiz__card{flex:3 1 min(100%,380px);max-width:680px;background:#FFFFFF;border-radius:24px;box-shadow:0 12px 36px rgba(33,32,31,.08);overflow:visible}
.quiz__card-pad{padding:clamp(20px,5vw,32px)}
.quiz__progress{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.quiz__progress-label{font-size:13px;font-weight:700;color:#8B8984;flex:none}
.quiz__progress-track{flex:1;height:6px;background:#EFEDE7;border-radius:3px;overflow:hidden}
.quiz__progress-fill{height:100%;background:#FCE000;border-radius:3px;transition:width .3s ease-out}
.quiz__step{animation:fadeUp .35s ease-out both}
.quiz__q{margin:0 0 16px;font-size:22px;font-weight:800}
.quiz__input{width:100%;padding:15px 16px;border:1.5px solid #E4E2DC;border-radius:14px;font-size:16px;outline:none;background:#FFFFFF;scroll-margin-top:88px}
.quiz__input:focus{border-color:#21201F}
.quiz__next{margin-top:16px;width:100%;background:#FCE000;border:none;border-radius:16px;padding:15px;font-size:16px;font-weight:800;cursor:pointer;opacity:1;transition:transform .3s ease-out}
.quiz__next:hover{transform:translateY(-1px)}
.quiz__next:disabled{opacity:.5;cursor:default}
.quiz__options{display:flex;flex-direction:column;gap:10px}
.quiz__options--grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quiz-opt{width:100%;text-align:left;background:#FFFFFF;border:1.5px solid #E4E2DC;border-radius:14px;padding:15px 16px;font-size:16px;font-weight:700;cursor:pointer;transition:border-color .2s ease-out,background .2s ease-out}
.quiz-opt:hover{border-color:#21201F;background:#FFFDEB}
.quiz-opt--center{text-align:center;padding:15px 10px}
.quiz__center{text-align:center;padding:8px 0}
.quiz__fail-title{margin:0 0 10px;font-size:22px;font-weight:800}
.quiz__fail-text{margin:0 0 18px;font-size:15px;line-height:1.55;color:#6B6A66}
.quiz__result-title{margin:0 0 4px;font-size:22px;font-weight:800}
.quiz__result-hint{margin:0 0 18px;font-size:14px;color:#8B8984}
.quiz__sliders{display:flex;flex-direction:column;gap:16px}
.quiz__slider-head{display:flex;justify-content:space-between;margin-bottom:8px;font-size:15px;font-weight:700}
.quiz__calc{margin-top:18px;background:#FCE000;border-radius:20px;padding:20px;text-align:center}
.quiz__calc-label{margin:0 0 4px;font-size:13px;font-weight:800;color:#4A4636}
.quiz__calc-value{margin:0;font-size:clamp(30px,4vw,38px);font-weight:800;letter-spacing:-0.02em;color:#21201F;font-variant-numeric:tabular-nums;white-space:nowrap}
.quiz__calc-value span{font-size:.55em}
.quiz__calc-note{margin:10px 0 0;font-size:13px;line-height:1.55;color:#4A4636;text-wrap:pretty}
.quiz__overload-note{margin:10px 0 0;font-size:13px;line-height:1.55;color:#8B8984}
.quiz__result-note{margin:12px 0 0;font-size:14px;line-height:1.55;color:#8B8984}
.quiz__age16-note{margin:12px 0 0;font-size:14px;line-height:1.5;color:#4A4636;background:#FFFDEB;border:1px solid #F5E97F;border-radius:12px;padding:10px 14px}
.quiz__result-city{margin:14px 0 0;font-size:15px;line-height:1.6;color:#55534E}
.quiz__start-method{margin:12px 0 0;font-size:14px;line-height:1.5;color:#4A4636;background:#F7F6F3;border-radius:12px;padding:10px 14px}
.quiz__inactive{margin:16px 0 0;background:#F7F6F3;border:1px solid #ECEAE4;border-radius:16px;padding:16px 18px}
.quiz__inactive-msg{margin:0;font-size:15px;line-height:1.55;color:#55534E;font-weight:700}
.quiz__inactive-sub{margin:12px 0 8px;font-size:14px;color:#8B8984}
.quiz__inactive-cities{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.quiz__inactive-city{background:#FFFFFF;border:1.5px solid #E4E2DC;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:700;cursor:pointer;transition:border-color .2s ease-out,background .2s ease-out}
.quiz__inactive-city:hover{border-color:#21201F;background:#FFFDEB}
.btn-yellow-block{display:block;text-align:center;margin-top:16px;background:#FCE000;border-radius:16px;padding:16px;font-size:16px;font-weight:800;transition:transform .3s ease-out,box-shadow .3s ease-out}
.btn-yellow-block:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(252,224,0,.55)}
.quiz__change{display:block;width:100%;margin-top:10px;background:none;border:none;padding:8px;font-size:14px;font-weight:700;color:#8B8984;cursor:pointer;transition:color .2s ease-out}
.quiz__change:hover{color:#21201F}
.quiz__back{margin-top:14px;background:none;border:none;padding:6px 0;font-size:14px;font-weight:700;color:#8B8984;cursor:pointer;transition:color .2s ease-out}
.quiz__back:hover{color:#21201F}
.is-hidden{display:none !important}

/* ---- живой автокомплит города (шаг 1) ---- */
.quiz__city-field{position:relative}
.quiz__ac{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:50;margin:0;padding:6px;list-style:none;background:#FFFFFF;border:1.5px solid #E4E2DC;border-radius:12px;box-shadow:0 16px 38px rgba(33,32,31,.16);max-height:280px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.quiz__ac-item{padding:12px 14px;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer}
.quiz__ac-item.is-active,.quiz__ac-item:hover{background:#FFFDEB}
.quiz__ac-item--special{margin-top:4px;padding-top:14px;border-top:1px solid #EFEDE7;font-weight:600;color:#8B8984;border-radius:0 0 10px 10px}
.quiz__suggest{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px;color:#6B6A66}
.quiz__suggest-chip{background:#FFFDEB;border:1.5px solid #FCE000;border-radius:999px;padding:8px 16px;font-size:15px;font-weight:800;color:#21201F;cursor:pointer;transition:transform .2s ease-out,box-shadow .2s ease-out}
.quiz__suggest-chip:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(252,224,0,.45)}
.quiz__citylist{margin:16px 0 0;max-height:240px;overflow-y:auto;display:flex;flex-wrap:wrap;gap:8px;padding:4px;justify-content:center}
.quiz__citylist-btn{background:#FFFFFF;border:1.5px solid #E4E2DC;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:700;cursor:pointer;transition:border-color .2s ease-out,background .2s ease-out}
.quiz__citylist-btn:hover{border-color:#21201F;background:#FFFDEB}
.quiz__notfound-actions{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}

/* ================= БОНУСЫ ================= */
.bonuses{scroll-margin-top:76px}
.bonuses__inner{max-width:1120px;margin:0 auto;padding:clamp(36px,4vw,52px) 20px clamp(40px,5.5vw,72px)}
.bonuses__sub{margin:0 auto 32px;max-width:480px;font-size:16px;color:#6B6A66;text-align:center}
.bonuses__grid{max-width:1040px;margin:0 auto;display:flex;flex-wrap:wrap;gap:16px}
.bonuses__pair{flex:1 1 440px;min-width:min(100%,440px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:16px;align-items:stretch}
.bonus-card{background:#FFFFFF;border-radius:20px;padding:24px 20px;transition:transform .35s ease-out,box-shadow .35s ease-out}
.bonus-card:hover{transform:translateY(-5px);box-shadow:0 14px 32px rgba(33,32,31,.1)}
.bonus-card__imgbox{height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.bonus-card__img{max-width:150px;max-height:120px;width:auto;height:auto;object-fit:contain}
.bonus-card__title{margin:0 0 6px;font-size:18px;font-weight:800}
.bonus-card__text{margin:0;font-size:14px;line-height:1.5;color:#6B6A66}

/* ================= 6 ШАГОВ ================= */
.steps{scroll-margin-top:76px;background:#FFFFFF}
.steps__inner{max-width:760px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.steps__title{margin:0 0 32px}
.steps__list{display:flex;flex-direction:column;gap:0}
.step{display:grid;grid-template-columns:44px 1fr;gap:16px}
.step__rail{display:flex;flex-direction:column;align-items:center;gap:0}
.step__num{flex:none;width:44px;height:44px;border-radius:50%;background:#FCE000;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800}
.step__line{width:2px;flex:1;background:#ECE9E2;min-height:20px}
.step__body{padding-bottom:26px}
.step__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.step__title{margin:2px 0 4px;font-size:17px;font-weight:800;line-height:1.3}
.step__icon{width:34px;height:34px;object-fit:contain;border-radius:9px;flex:none}
.step__text{margin:0;font-size:14px;line-height:1.55;color:#6B6A66}
.steps__cta{margin-top:32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;background:#F7F6F3;border-radius:20px;padding:20px clamp(20px,3vw,28px)}
.steps__cta-text{margin:0;font-size:clamp(16px,2.2vw,18px);font-weight:700;line-height:1.4;text-wrap:balance}

/* ================= ДОКУМЕНТЫ ================= */
.docs{scroll-margin-top:76px}
.docs__inner{max-width:760px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.docs__sub{margin:0 auto 24px;max-width:480px;font-size:16px;color:#6B6A66;text-align:center}
.docs__tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:20px}
.docs__tab{border:1.5px solid #E4E2DC;border-radius:999px;padding:11px 20px;font-size:15px;font-weight:700;cursor:pointer;transition:background .25s ease-out,color .25s ease-out;background:#FFFFFF;color:#21201F}
.docs__tab.is-active{background:#21201F;color:#FFFFFF}
.docs__panel{background:#FFFFFF;border-radius:24px;padding:clamp(22px,5vw,32px);box-shadow:0 8px 24px rgba(33,32,31,.06)}
.docs__pane{animation:fadeUp .3s ease-out both}
.docs__list{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.5}
.docs__li{display:flex;gap:10px}
.docs__howto{background:#F7F6F3;border-radius:16px;padding:18px 20px}
.docs__howto-label{margin:0 0 10px;font-size:13px;font-weight:800;color:#8B8984;text-transform:uppercase;letter-spacing:.04em}
.docs__howto-ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.5;color:#55534E}
.docs__intro{margin:0 0 16px;font-size:15px;line-height:1.55;color:#55534E}
.docs__note{margin:0;font-size:14px;line-height:1.55;color:#55534E}
.docs__common{margin:16px auto 0;max-width:600px;font-size:14px;line-height:1.55;color:#8B8984;text-align:center}

/* ================= КАК НАЧАТЬ ================= */
.howstart{scroll-margin-top:76px}
.howstart__inner{max-width:1120px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.howstart__h2{margin:0 0 28px}
.howstart__grid{max-width:860px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.howstart__card{background:#FFFFFF;border-radius:24px;padding:clamp(24px,5vw,32px);box-shadow:0 8px 24px rgba(33,32,31,.06)}
.howstart__title{margin:0 0 16px;font-size:20px;font-weight:800}
.howstart__steps{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.5;color:#55534E}
.howstart__note{max-width:860px;margin:16px auto 0;font-size:13px;line-height:1.55;color:#8B8984;text-align:center}

/* ================= ВЫПЛАТЫ ================= */
.pay{scroll-margin-top:76px;background:#FFFFFF}
.pay__inner{max-width:1120px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.pay__head{max-width:760px;margin:0 auto;text-align:center}
.pay__title{margin:0 0 12px}
.pay__sub{margin:0 0 32px;font-size:clamp(16px,2.5vw,19px);line-height:1.55;color:#55534E;text-wrap:pretty}
.pay__grid{max-width:860px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:16px}
.pay__slot{width:100%;height:340px;border-radius:20px;background:#F1EFEA;border:1.5px dashed #D8D5CD;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;color:#A5A29B;font-size:14px;font-weight:600}
.pay__caption{margin:16px 0 0;font-size:14px;color:#8B8984;text-align:center}

/* ================= ПРИЛОЖЕНИЯ ================= */
.apps{scroll-margin-top:76px}
.apps__inner{max-width:1120px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.apps__sub{margin:0 auto 32px;max-width:520px;font-size:16px;color:#6B6A66;text-align:center}
.apps__grid{max-width:860px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.app-card{background:#FFFFFF;border-radius:24px;padding:clamp(24px,5vw,32px);box-shadow:0 8px 24px rgba(33,32,31,.06);position:relative;overflow:hidden}
.app-card__bg{position:absolute;right:-20px;bottom:-40px;width:120px;height:auto;opacity:.9;pointer-events:none}
.app-card__icon{width:56px;height:56px;border-radius:14px;margin-bottom:16px}
.app-card__icon--nalog{width:56px;height:58px;border-radius:0;object-fit:contain}
.app-card__title{margin:0 0 8px;font-size:20px;font-weight:800}
.app-card__text{margin:0 0 18px;font-size:14px;line-height:1.55;color:#6B6A66}
.app-card__text--narrow{max-width:75%}
.app-card__links{display:flex;flex-wrap:wrap;gap:8px}

/* ================= FAQ ================= */
.faq{scroll-margin-top:76px;background:#FFFFFF}
.faq__inner{max-width:760px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.faq__sub{margin:0 auto 28px;max-width:480px;font-size:16px;color:#6B6A66;text-align:center}
.faq__list{display:flex;flex-direction:column;gap:10px}
.faq-item{background:#F7F6F3;border-radius:16px;padding:0 20px}
.faq-item__summary{padding:18px 0;font-size:16px;font-weight:800;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq-item__plus{flex:none;color:#8B8984}
.faq-item__text{margin:0;padding:0 0 18px;font-size:15px;line-height:1.6;color:#55534E}
.faq-item__text a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.faq-item__text--tight{padding:0 0 10px}
.faq-item__list{list-style:none;margin:0;padding:0 0 10px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.6;color:#55534E}
.faq-item__li{display:flex;gap:10px}
.honest{scroll-margin-top:76px;margin-top:36px;background:#FFFDEB;border:1.5px solid #F5E97F;border-radius:24px;padding:clamp(20px,5vw,28px)}
.honest__title{margin:0 0 6px;font-size:22px;font-weight:800}
.honest__sub{margin:0 0 16px;font-size:14px;color:#8B8984}
.honest__list{display:flex;flex-direction:column;gap:10px}
.honest-item{background:#FFFFFF;border-radius:16px;padding:0 20px}
.honest-item__summary{padding:16px 0;font-size:15px;font-weight:800;display:flex;justify-content:space-between;gap:12px;align-items:center}
.honest-item__text{margin:0;padding:0 0 16px;font-size:14px;line-height:1.6;color:#55534E}

/* ================= ПОЛЕЗНОЕ КУРЬЕРУ / КАРТОЧКИ СТАТЕЙ ================= */
.useful{scroll-margin-top:76px;background:#FFFFFF}
.useful__inner{max-width:1120px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.useful__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin-bottom:28px}
.useful__title{margin:0 0 6px;font-size:clamp(26px,4.5vw,40px);font-weight:800;letter-spacing:-0.02em}
.useful__desc{margin:0;font-size:16px;color:#6B6A66}
.useful__all{flex:none;font-size:16px;font-weight:800;transition:opacity .3s ease-out}
.useful__all:hover{opacity:.55}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px}
.post-card{display:flex;flex-direction:column;background:#FFFFFF;border-radius:20px;overflow:hidden;border:1px solid #ECEAE4;transition:transform .3s ease-out,box-shadow .3s ease-out}
.post-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(33,32,31,.12)}
.post-card__cover{padding:24px;min-height:150px;display:flex;align-items:flex-end}
.post-card__cover-title{font-size:21px;font-weight:800;line-height:1.2;letter-spacing:-0.01em;color:#21201F}
.post-card__body{padding:20px;display:flex;flex-direction:column;gap:14px;flex:1}
.post-card__anons{margin:0;font-size:15px;line-height:1.5;color:#6B6A66;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-card__meta-row{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.post-card__meta{font-size:13px;font-weight:600;color:#9C9A94}
.post-card__read{font-size:14px;font-weight:800}

/* ================= КАРУСЕЛЬ СТАТЕЙ ================= */
.useful__carousel{position:relative}
.carousel__stage{position:relative}
.carousel__viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}
.carousel__viewport::-webkit-scrollbar{display:none}
.carousel__track{display:flex;gap:20px;padding:4px 2px}
.carousel__card{flex:0 0 calc((100% - 40px)/3);scroll-snap-align:start}
.carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#FFFFFF;border:1px solid #ECEAE4;border-radius:50%;box-shadow:0 6px 18px rgba(33,32,31,.14);font-size:26px;line-height:1;color:#21201F;cursor:pointer;transition:opacity .25s ease-out,transform .25s ease-out,box-shadow .25s ease-out}
.carousel__arrow:hover{box-shadow:0 10px 24px rgba(33,32,31,.2)}
.carousel__arrow--prev{left:-10px}
.carousel__arrow--next{right:-10px}
.carousel__arrow span{pointer-events:none}
.carousel__arrow[disabled]{opacity:0;pointer-events:none}
.carousel__dots{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
.carousel__dot{width:8px;height:8px;padding:0;border:none;border-radius:50%;background:#D9D7D0;cursor:pointer;transition:background .25s ease-out,width .25s ease-out}
.carousel__dot.is-active{width:22px;border-radius:4px;background:#21201F}
@media(max-width:900px){.carousel__card{flex-basis:calc((100% - 20px)/2)}}
@media(max-width:600px){.carousel__card{flex-basis:100%}.carousel__arrow--prev{left:2px}.carousel__arrow--next{right:2px}}

/* Карусель выплат (скриншоты) — своя раскладка: 4 / 3 / 2 в ряду */
.pay__carousel{position:relative;margin-top:8px}
.payout-card{margin:0}
.carousel__card.payout-card{flex-basis:calc((100% - 60px)/4)}
.payout-card img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid #ECEAE4;box-shadow:0 12px 30px rgba(33,32,31,.14);background:#101012}
@media(max-width:900px){.carousel__card.payout-card{flex-basis:calc((100% - 40px)/3)}}
@media(max-width:600px){.carousel__card.payout-card{flex-basis:calc((100% - 20px)/2)}}

/* ================= ФИНАЛЬНЫЙ CTA ================= */
.final__inner{max-width:1120px;margin:0 auto;padding:clamp(40px,5.5vw,72px) 20px}
.final__box{background:#FDF3A8;border-radius:28px;padding:clamp(28px,6vw,52px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px;align-items:center}
.final__title{margin:0 0 10px;font-size:clamp(26px,4.5vw,38px);font-weight:800;letter-spacing:-0.02em;text-wrap:balance}
.final__text{margin:0 0 22px;font-size:16px;line-height:1.55;color:#55534E}
.final__btns{display:flex;flex-wrap:wrap;gap:12px}
.btn-dark-cta{background:#21201F;color:#FFFFFF;border-radius:16px;padding:16px 26px;font-size:16px;font-weight:800;transition:transform .3s ease-out,box-shadow .3s ease-out}
.btn-dark-cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(33,32,31,.3)}
.btn-white-cta{background:#FFFFFF;border-radius:16px;padding:16px 26px;font-size:16px;font-weight:800;transition:transform .3s ease-out}
.btn-white-cta:hover{transform:translateY(-2px)}
.final__img{width:min(220px,50vw);height:auto;margin:0 auto}

/* ================= ФУТЕР ================= */
.site-footer{background:#FFFFFF;border-top:1px solid #ECEAE4}
.site-footer__inner{max-width:1120px;margin:0 auto;padding:40px 20px;display:flex;flex-direction:column;gap:20px}
.site-footer__top{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.site-footer__brand{display:flex;flex-direction:column;gap:12px}
.site-footer__logo{display:inline-flex;align-items:center;gap:11px}
.site-footer__logo .brand-mark{width:42px;height:42px}
.site-footer__logo .brand-text__line1{font-size:16px;white-space:normal}
.site-footer__logo .brand-text__line2{font-size:12px;white-space:normal}
.site-footer__about{margin:0;font-size:14px;line-height:1.5;color:#6B6A66;max-width:360px}
.footer-nav{display:flex;flex-wrap:wrap;gap:18px;font-size:14px;font-weight:700}
.footer-nav a{transition:opacity .2s ease-out}
.footer-nav a:hover{opacity:.6}
.site-footer__legal{margin:0;padding-top:16px;border-top:1px solid #F0EEE8;font-size:12px;line-height:1.6;color:#A5A29B}

/* ================= МОБИЛЬНАЯ ЛИПКАЯ КНОПКА ================= */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:900;background:#FFFFFF;box-shadow:0 -6px 20px rgba(33,32,31,.12);padding:10px 16px calc(10px + env(safe-area-inset-bottom));transform:translateY(120%);transition:transform .15s ease-out;display:none}
.sticky-cta a{display:block;text-align:center;background:#FCE000;border-radius:14px;padding:15px;font-size:16px;font-weight:800}
@media (max-width:767px){.sticky-cta{display:block} body{padding-bottom:64px}}

/* ================= БЛОГ: СТАТЬЯ ================= */
.article-main{max-width:720px;margin:0 auto;padding:clamp(24px,4vw,44px) 20px clamp(32px,5vw,56px)}
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;color:#9C9A94;margin-bottom:22px}
.breadcrumbs a{font-weight:700;color:#6B6A66;transition:opacity .2s ease-out}
.breadcrumbs a:hover{opacity:.6}
.breadcrumbs__current{color:#9C9A94}
.article-tagrow{margin:0 0 14px;display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:#9C9A94}
.article-tag{background:#FCE000;color:#21201F;border-radius:999px;padding:4px 12px}
.article-h1{margin:0 0 28px;font-size:clamp(28px,4.4vw,42px);font-weight:800;letter-spacing:-0.025em;line-height:1.08;text-wrap:balance}
.article-body{font-size:18px;line-height:1.6;color:#2C2A27}
.article-body h2{font-size:clamp(22px,3vw,28px);font-weight:800;letter-spacing:-0.02em;line-height:1.2;margin:38px 0 12px}
.article-body p{margin:0 0 18px;text-wrap:pretty}
.article-body ul,.article-body ol{margin:0 0 18px;padding-left:24px;display:flex;flex-direction:column;gap:8px}
.article-body li{padding-left:4px}
.article-body a{color:#1F6FCB;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.article-body strong{font-weight:800}
.related{background:#FFFFFF;border-top:1px solid #ECEAE4}
.related__inner{max-width:1120px;margin:0 auto;padding:clamp(36px,5vw,60px) 20px}
.related__title{margin:0 0 24px;font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-0.02em}
.related__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px}
.related-card__cover{padding:22px;min-height:132px;display:flex;align-items:flex-end}
.related-card__cover-title{font-size:19px;font-weight:800;line-height:1.22;letter-spacing:-0.01em;color:#21201F}
.related-card__meta-row{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.blog-cta__inner{max-width:1120px;margin:0 auto;padding:clamp(28px,4vw,44px) 20px}
.blog-cta__box{background:#FDF3A8;border-radius:24px;padding:clamp(24px,4vw,40px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px}
.blog-cta__text{margin:0;font-size:clamp(18px,2.5vw,24px);font-weight:800;letter-spacing:-0.02em;line-height:1.25;text-wrap:balance}
.blog-cta__btn{flex:none;background:#21201F;color:#FFFFFF;border-radius:14px;padding:15px 26px;font-size:16px;font-weight:800;transition:transform .3s ease-out,box-shadow .3s ease-out}
.blog-cta__btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(33,32,31,.28)}

/* ================= БЛОГ: СПИСОК ================= */
.blog-index-main{max-width:1120px;margin:0 auto;padding:clamp(32px,5vw,64px) 20px}
.blog-index__eyebrow{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#9C9A94}
.blog-index__h1{margin:0 0 10px;font-size:clamp(32px,5vw,52px);font-weight:800;letter-spacing:-0.03em;line-height:1.05}
.blog-index__lead{margin:0 0 36px;max-width:560px;font-size:18px;line-height:1.55;color:#55534E}

/* ---------- reveal при скролле (значения ставит app.js) ---------- */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  html{scroll-behavior:auto}
}