/* cd-header-footer.css — единый дизайн «Новой Ступени» (как на главной): тема (фон, шрифты, кнопки, карточки, поля) + шапка-карточка + тёмный футер. Подключается на всех страницах ПОСЛЕ style.css. Требует шрифт Manrope/Inter (link в ). */ /* ===== ТЕМА: токены, фон, шрифты ===== */ :root{ --bg:#f3f1ec; /* тёплый фон страницы */ --card:#ffffff; /* белые карточки/поверхности */ --text:#16181b; /* чернила */ --muted:#6b6f76; /* приглушённый текст */ --border:rgba(20,24,27,.10); --radius:16px; --shadow:0 18px 40px -28px rgba(20,24,27,.45); --primary:#c11f24; --primary-hover:#a3171b; /* наш красный */ --accent:var(--primary); --accent-hover:var(--primary-hover); --cd-display:"Onest",system-ui,sans-serif; --cd-sans:"Onest",system-ui,sans-serif; --cd-tint:rgba(193,31,36,.1); --hero-font-display:"Onest",system-ui,sans-serif; --hero-font-sans:"Onest",system-ui,sans-serif; --hero-font-mono:"Onest",system-ui,sans-serif; } body{font-family:"Onest",system-ui,sans-serif!important;background:var(--bg)!important;color:var(--text)!important;-webkit-font-smoothing:auto} h1,h2,h3,h4,h5,h6{font-family:"Onest",system-ui,sans-serif!important;letter-spacing:-.02em}h2,h3{font-weight:800!important;font-size:clamp(1.5rem,2.8vw,2rem)!important}h4{font-weight:600!important} /* надзаголовки-eyebrow к Manrope (как на главной) */ .nva-eyebrow,.home-eyebrow,.ab2-hero-kicker,.hero-D-eyebrow-inner{font-family:"Onest",system-ui,sans-serif!important;letter-spacing:.03em!important} /* ===== КНОПКИ единого вида ===== */ .btn{font-family:"Onest",system-ui,sans-serif!important;font-weight:600!important;border-radius:13px!important} .btn:not(.secondary):not(.btn-ghost){background:var(--accent)!important;color:#fff!important;border:none!important} .btn:not(.secondary):not(.btn-ghost):hover{background:var(--accent-hover)!important} .btn.secondary,.btn-ghost{background:#fff!important;color:var(--text)!important;border:1px solid rgba(20,24,27,.2)!important;border-radius:13px!important;font-family:"Onest",system-ui,sans-serif!important;font-weight:600!important} .btn.secondary:hover,.btn-ghost:hover{background:#efece6!important} /* ===== ПОЛЯ ВВОДА ===== */ input[type=text],input[type=tel],input[type=email],input[type=number],textarea{border-radius:11px!important;background:#faf9f7!important;border:1px solid rgba(20,24,27,.14)!important;font-family:"Onest",system-ui,sans-serif!important} /* ===== ШАПКА: плавающая белая карточка, прижата к верхнему краю, низ скруглён ===== */ .site-header{background:transparent!important;position:sticky;top:0;z-index:100;padding:0!important;margin:0!important;border:none!important;box-shadow:none!important} .header-inner{display:block!important;background:transparent!important;border:none!important;box-shadow:none!important;min-height:0!important;padding:0 1.25rem!important} .cd-header-pill{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.65rem 1rem;min-height:3.5rem;background:#fff;border-radius:0;box-shadow:0 12px 22px -14px rgba(20,24,27,.45);padding:12px 18px} .main-nav a,.nav-dd-summary{font-family:"Onest",system-ui,sans-serif!important;font-weight:500;font-size:14px;color:#54585e} .main-nav a:hover,.nav-dd-summary:hover{color:#c11f24} .header-contact-phone{font-family:"Onest",system-ui,sans-serif!important;font-weight:700;color:#16181b} .header-contact-email{color:#6b6f76} /* ===== ФУТЕР: тёмный, логотип на белой пилюле ===== */ .site-footer{background:#16181b!important;color:#fff!important;margin-top:80px!important;padding:48px 0 0!important} .site-footer__heading{color:rgba(255,255,255,.45)!important;font-family:"Onest",system-ui,sans-serif!important;text-transform:uppercase;letter-spacing:.06em!important;font-size:13px!important;font-weight:700!important} .site-footer__list a,.site-footer__list li{color:rgba(255,255,255,.78)!important} .site-footer__list a:hover{color:#fff!important} .site-footer__tagline{color:rgba(255,255,255,.6)!important} .footer-brand--invert{display:inline-block;background:#fff;border-radius:14px;padding:10px 16px;line-height:0} .footer-brand--invert img{filter:none!important} .ab2-foot-social{position:static!important;margin-top:14px} .ab2-foot-social .lbl{color:rgba(255,255,255,.6)!important} .ab2-foot-social a{color:rgba(255,255,255,.82)!important} .site-footer__socket{border-top:1px solid rgba(255,255,255,.1)!important;margin-top:32px!important;background:transparent!important} .site-footer__copyright,.site-footer__region,.ab2-foot-legal a{color:rgba(255,255,255,.42)!important} /* мелкий UI-текст: weight 500 чтобы не выглядел рыхлым */ #home-quiz .quiz-panel--framed .quiz-head-meta, #home-quiz .quiz-foot-bonus, #home-quiz .quiz-panel--framed .quiz-body .quiz-sub, .quiz-progress-label { font-weight: 500; } /* --- cd-hero (перенесён с главной на /catalog.html) --- */ .cd-hero{max-width:1100px;margin:0 auto;padding:60px 1.25rem 76px;display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center} .cd-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--cd-display);font-weight:700;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--primary);background:var(--cd-tint);padding:8px 14px;border-radius:999px} .cd-hero__title{font-family:var(--cd-display);font-weight:800;font-size:clamp(34px,4.4vw,52px);line-height:1.04;letter-spacing:-.03em;margin:22px 0 0;color:var(--text)} .cd-hero__lead{font-size:17px;line-height:1.6;color:#5a5e64;margin:22px 0 0;max-width:480px} .cd-hero__cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap} .cd-btn{display:inline-flex;align-items:center;gap:8px;height:54px;padding:0 26px;border-radius:13px;font-family:var(--cd-display);font-weight:600;font-size:16px;cursor:pointer;text-decoration:none} .cd-btn--primary{background:var(--primary);color:#fff;box-shadow:0 12px 24px -12px rgba(193,31,36,.6)} .cd-btn--primary:hover{background:var(--accent-hover)} .cd-btn--secondary{background:#fff;color:var(--text);border:1px solid var(--border)} .cd-btn--secondary:hover{background:#efece6} .cd-hero__stats{display:flex;gap:12px;margin-top:34px} .cd-hero__stat{flex:1;background:#fff;border-radius:14px;padding:16px 18px} .cd-hero__stat b{font-family:var(--cd-display);font-weight:800;font-size:23px;letter-spacing:-.02em;display:block;color:var(--text)} .cd-hero__stat span{font-size:12px;color:#8a8e94;margin-top:2px;display:block} .cd-hero__media-wrap{position:relative} .cd-hero__media{border-radius:20px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 60px -34px rgba(20,24,27,.6)} .cd-hero__media img{width:100%;height:100%;object-fit:cover} .cd-price{position:absolute;left:-22px;bottom:-22px;background:var(--primary);color:#fff;border-radius:16px;padding:18px 20px;box-shadow:0 20px 40px -22px rgba(193,31,36,.7);width:215px} .cd-price__lbl{font-family:var(--cd-display);font-weight:700;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:rgba(255,255,255,.72)} .cd-price__val{font-family:var(--cd-display);font-weight:800;font-size:30px;letter-spacing:-.02em;margin-top:6px} .cd-price__row{display:flex;gap:14px;margin-top:12px;font-size:12px;color:rgba(255,255,255,.82)} .cd-price__row b{color:#fff;font-size:13px} @media(max-width:900px){.cd-hero{grid-template-columns:1fr;gap:32px;padding:28px 20px 56px}.cd-hero__media-wrap{margin-bottom:22px}.cd-hero__title{font-size:38px}}