/* ========================================================= RIFAR CALCULATOR — ИЗОЛЯЦИЯ ОТ СТИЛЕЙ ТЕМЫ ВАЖНО: этот файл полностью заменяет старый style.css ========================================================= */ #rifarCalc, #rifarCalc * , #rifarCalc *::before, #rifarCalc *::after { box-sizing: border-box; } #rifarCalc { /* Локальные переменные калькулятора */ --red:#e31d2b; --red2:#ff4050; --ink:#101b2d; --muted:#718096; --line:#e9eef4; --paper:#fff; --bg:#f5f8fb; --shadow:0 22px 60px rgba(22,34,51,.10); --shadow-sm:0 10px 30px rgba(22,34,51,.08); --radius:26px; width:100%; max-width:1280px; margin-left:auto; margin-right:auto; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; font-size:16px; font-style:normal; font-weight:400; line-height:1.4; color:var(--ink); text-align:left; text-transform:none; letter-spacing:normal; direction:ltr; isolation:isolate; } /* Тема сайта не должна менять базовую типографику калькулятора */ #rifarCalc h1, #rifarCalc h2, #rifarCalc h3, #rifarCalc h4, #rifarCalc h5, #rifarCalc h6, #rifarCalc p, #rifarCalc ul, #rifarCalc ol, #rifarCalc li, #rifarCalc label, #rifarCalc span, #rifarCalc b, #rifarCalc strong, #rifarCalc small, #rifarCalc summary { font-family:inherit; text-transform:none; letter-spacing:normal; } #rifarCalc h1, #rifarCalc h2, #rifarCalc h3, #rifarCalc h4, #rifarCalc h5, #rifarCalc h6 { font-style:normal; } #rifarCalc button, #rifarCalc input, #rifarCalc textarea, #rifarCalc select { font-family:inherit; font-size:inherit; font-style:normal; text-transform:none; letter-spacing:normal; box-sizing:border-box; } #rifarCalc button { cursor:pointer; -webkit-appearance:none; appearance:none; } #rifarCalc input, #rifarCalc textarea, #rifarCalc select { -webkit-appearance:none; appearance:none; } #rifarCalc img, #rifarCalc svg { max-width:100%; border:0; } #rifarCalc a { color:inherit; text-decoration:none; } /* Защита от типичных правил темы вроде .content ul li:before */ #rifarCalc ul, #rifarCalc ol { list-style-position:outside; } #rifarCalc .rc-house ul { list-style:none; } #rifarCalc .rc-house li::before, #rifarCalc .rc-house li::after { content:none; } /* Убираем возможные theme outline/background только у технических hidden */ #rifarCalc .rc-hidden { display:none !important; } #rifarCalc{ --red:#e31d2b; --red2:#ff4050; --ink:#101b2d; --muted:#718096; --line:#e9eef4; --paper:#fff; --bg:#f5f8fb; --shadow:0 22px 60px rgba(22,34,51,.10); --shadow-sm:0 10px 30px rgba(22,34,51,.08); --radius:26px; } #rifarCalc, #rifarCalc *{box-sizing:border-box} #rifarCalc{scroll-behavior:smooth} #rifarCalc{ margin:0; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; color:var(--ink); background: radial-gradient(circle at 10% 5%,#fff 0 20%,transparent 45%), linear-gradient(180deg,#f8fafc 0,#eef4f8 100%); } #rifarCalc button, #rifarCalc input, #rifarCalc textarea{font:inherit} #rifarCalc button{cursor:pointer} #rifarCalc.rc-app{max-width:1600px;margin:0 auto;min-height:100vh;padding:0 28px 60px} #rifarCalc .rc-hero{ min-height:250px; position:relative; display:grid; grid-template-columns:1.45fr .85fr; gap:30px; align-items:stretch; overflow:hidden; } #rifarCalc .rc-hero__copy{padding:24px 0 18px} #rifarCalc .rc-brand{display:flex;align-items:center;gap:22px;margin-bottom:28px} #rifarCalc .rc-brand__logo{font-size:35px;font-weight:700;letter-spacing:-1.5px} #rifarCalc .rc-brand__logo span{color:var(--red);font-weight:900} #rifarCalc .rc-brand__tag{padding-left:22px;border-left:1px solid #d9e0e8;color:#66758b;font-size:16px;line-height:1.25} #rifarCalc .rc-eyebrow{font-size:12px;letter-spacing:.28em;font-weight:800;color:#718096;margin-bottom:10px} #rifarCalc .rc-hero h1, #rifarCalc .rc-stephead h2{margin:0;color:#091526;letter-spacing:-.035em} #rifarCalc .rc-hero h1{font-size:52px;line-height:1.02;max-width:900px} #rifarCalc .rc-hero p, #rifarCalc .rc-stephead p{color:var(--muted);font-size:18px;line-height:1.5;margin:12px 0 0} #rifarCalc .rc-hero__visual{ min-height:250px; position:relative; border-radius:0 0 0 38px; overflow:hidden; background: linear-gradient(90deg,rgba(255,255,255,.10),rgba(255,255,255,.65)), linear-gradient(145deg,#dfe5e6,#f7f5f1); } #rifarCalc .rc-hero__visual>img{position:absolute;width:63%;right:4%;bottom:-14px;opacity:.98} #rifarCalc .rc-benefits{position:absolute;z-index:3;top:15px;left:24px;right:24px;display:flex;justify-content:space-between;gap:16px;color:#fff;font-size:12px;font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.25)} #rifarCalc .rc-handnote{position:absolute;z-index:4;left:38px;bottom:42px;font-family:"Segoe Print","Bradley Hand",cursive;font-size:23px;line-height:1.1;transform:rotate(-5deg);color:#3d5068} #rifarCalc .rc-handnote:after{content:"";display:block;width:54px;height:3px;background:var(--red);margin-top:8px;transform:rotate(-7deg)} #rifarCalc .rc-stepbadge{position:absolute;z-index:5;right:24px;top:74px;background:#fff;padding:11px 18px;border-radius:99px;font-weight:800;box-shadow:var(--shadow-sm)} #rifarCalc .rc-progress{ position:sticky;top:8px;z-index:20; display:grid;grid-template-columns:repeat(6,1fr); gap:0;padding:0 10px;margin:-4px 0 26px; background:rgba(255,255,255,.92);backdrop-filter:blur(14px); border:1px solid rgba(225,232,240,.9);border-radius:22px;box-shadow:var(--shadow-sm) } #rifarCalc .rc-progress__item{ min-height:68px;border:0;background:transparent;color:#7a899e;display:flex;align-items:center;gap:12px;justify-content:center;position:relative;padding:0 14px } #rifarCalc .rc-progress__item span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#cfd7e2;color:#fff;font-weight:800} #rifarCalc .rc-progress__item b{font-size:14px;white-space:nowrap} #rifarCalc .rc-progress__item:after{content:"";position:absolute;right:0;top:50%;width:1px;height:22px;background:#edf1f5;transform:translateY(-50%)} #rifarCalc .rc-progress__item:last-child:after{display:none} #rifarCalc .rc-progress__item.is-active{color:var(--ink)} #rifarCalc .rc-progress__item.is-active:before{content:"";position:absolute;left:13%;right:13%;bottom:0;height:3px;border-radius:3px;background:var(--red)} #rifarCalc .rc-progress__item.is-active span, #rifarCalc .rc-progress__item.is-done span{background:var(--red)} #rifarCalc .rc-progress__item.is-done span{font-size:0!important} #rifarCalc .rc-progress__item.is-done span:after{content:"✓";font-size:16px} #rifarCalc .rc-form{position:relative} #rifarCalc .rc-step{display:none;animation:fadeSlide .32s ease both} #rifarCalc .rc-step.is-active{display:block} @keyframes fadeSlide{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}} #rifarCalc .rc-stephead{display:flex;justify-content:space-between;align-items:end;margin:0 4px 22px} #rifarCalc .rc-stephead h2{font-size:40px} #rifarCalc .rc-card{ background:rgba(255,255,255,.96); border:1px solid #edf1f5;border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:24px } #rifarCalc .rc-grid{display:grid;gap:22px} #rifarCalc .rc-grid--map{grid-template-columns:1.5fr .85fr} #rifarCalc .rc-mapcard{position:relative;min-height:590px;overflow:hidden} #rifarCalc .rc-mapnote{font-family:"Segoe Print","Bradley Hand",cursive;font-size:18px;line-height:1.2;color:#5b6d83;position:absolute;z-index:4;left:24px;top:24px;transform:rotate(-4deg)} #rifarCalc .rc-mapnote span{font-size:14px;color:#8c99a8} #rifarCalc .rc-map{width:100%;height:auto;min-height:420px;margin-top:35px} #rifarCalc .district{cursor:pointer;stroke:#fff;stroke-width:3;transition:.25s transform,.25s filter,.25s opacity;transform-box:fill-box;transform-origin:center} #rifarCalc .district:hover, #rifarCalc .district.is-active{transform:translateY(-7px) scale(1.02);filter:drop-shadow(0 12px 9px rgba(19,33,50,.18));opacity:1} #rifarCalc .d-cfo{fill:#ff6a78} #rifarCalc .d-szfo{fill:#6b9fe8} #rifarCalc .d-yufo{fill:#f6aa3c} #rifarCalc .d-skfo{fill:#9968e5} #rifarCalc .d-pfo{fill:#68bd7b} #rifarCalc .d-urfo{fill:#66aeb4} #rifarCalc .d-sfo{fill:#4c85d4} #rifarCalc .d-dvfo{fill:#8e84dc} #rifarCalc .map-labels{font-size:15px;font-weight:800;fill:#fff;pointer-events:none} #rifarCalc .map-labels text{paint-order:stroke;stroke:rgba(0,0,0,.08);stroke-width:2px} #rifarCalc .rc-districts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:-8px} #rifarCalc .rc-districts button{border:1px solid #e5ebf0;background:#fff;padding:10px 12px;border-radius:14px;color:#536277} #rifarCalc .rc-districts button.is-selected{color:var(--red);border-color:var(--red);box-shadow:0 0 0 4px rgba(227,29,43,.07)} #rifarCalc .rc-citycard h3, #rifarCalc .rc-card h3{margin:0 0 6px;font-size:28px;letter-spacing:-.025em} #rifarCalc .rc-search{height:50px;border:1px solid #dfe6ee;border-radius:16px;display:flex;align-items:center;gap:10px;padding:0 14px;margin:16px 0} #rifarCalc .rc-search input{border:0;outline:0;width:100%;font-size:15px;background:transparent} #rifarCalc .rc-citygrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-height:310px;overflow:auto;padding-right:4px} #rifarCalc .rc-citygrid button{min-height:50px;border:1px solid #e4e9f0;background:#fff;border-radius:14px;text-align:left;padding:0 14px;color:#26354b} #rifarCalc .rc-citygrid button.is-selected{border-color:var(--red);color:var(--red);font-weight:800;background:#fff6f7;box-shadow:0 0 0 4px rgba(227,29,43,.06)} #rifarCalc .rc-climate{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px} #rifarCalc .rc-climate__item{display:flex;gap:10px;align-items:center;border-radius:18px;padding:15px} #rifarCalc .rc-climate__item--warm{background:linear-gradient(135deg,#fff3f4,#fff)} #rifarCalc .rc-climate__item--cool{background:linear-gradient(135deg,#eef7ff,#fff)} #rifarCalc .rc-climate__icon{font-size:28px;color:var(--red)} #rifarCalc .rc-climate span{display:block;font-size:11px;color:#65758a;line-height:1.25} #rifarCalc .rc-climate strong{font-size:27px;line-height:1.1} #rifarCalc .rc-info{margin-top:15px;background:#f3f7fa;color:#6c7b8e;border-radius:15px;padding:12px 14px;font-size:13px} #rifarCalc .rc-housegrid{display:grid;grid-template-columns:1fr 1fr;gap:22px} #rifarCalc .rc-choice{position:relative;border:1px solid #e8edf2;background:#fff;border-radius:30px;min-height:420px;padding:26px;overflow:hidden;text-align:left;box-shadow:var(--shadow-sm);transition:.25s transform,.25s box-shadow,.25s border} #rifarCalc .rc-choice:hover{transform:translateY(-4px);box-shadow:var(--shadow)} #rifarCalc .rc-choice.is-selected{border-color:var(--red);box-shadow:0 20px 50px rgba(227,29,43,.10)} #rifarCalc .rc-choice__check{position:absolute;right:22px;top:22px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid #dfe5ec;color:transparent;background:#fff;z-index:4} #rifarCalc .rc-choice.is-selected .rc-choice__check{background:var(--red);border-color:var(--red);color:#fff} #rifarCalc .rc-house img{position:absolute;right:2%;bottom:2%;width:58%;max-height:82%;object-fit:contain} #rifarCalc .rc-house__copy{position:relative;z-index:3;width:45%} #rifarCalc .rc-house h3{font-size:35px;margin-bottom:12px} #rifarCalc .rc-house p{color:#6d7b90;font-size:17px} #rifarCalc .rc-house ul{padding:0;margin:25px 0 0;list-style:none;display:grid;gap:10px} #rifarCalc .rc-house li{background:#f8fafc;border:1px solid #edf1f5;border-radius:14px;padding:12px 14px;font-size:13px} #rifarCalc .rc-grid--room{grid-template-columns:1.15fr .85fr} #rifarCalc .rc-controls{display:grid;gap:18px} #rifarCalc .rc-controlgroup{padding-bottom:18px;border-bottom:1px solid #edf1f5} #rifarCalc .rc-controltitle{display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:12px} #rifarCalc .rc-controltitle h3{font-size:23px} #rifarCalc .rc-controltitle p, #rifarCalc .rc-muted, #rifarCalc .rc-details p, #rifarCalc .rc-glasspack p{margin:3px 0 0;color:#7a899d;font-size:13px} #rifarCalc .rc-controltitle strong{font-size:38px;white-space:nowrap} #rifarCalc .rc-range{width:100%;accent-color:var(--red)} #rifarCalc .rc-quick, #rifarCalc .rc-segments{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:9px;margin-top:12px} #rifarCalc .rc-quick button, #rifarCalc .rc-segments button{border:1px solid #e0e7ee;background:#fff;border-radius:14px;min-height:44px;color:#233247;font-weight:700} #rifarCalc .rc-quick button:hover, #rifarCalc .rc-segments button:hover, #rifarCalc .rc-segments button.is-selected, #rifarCalc .rc-quick button.is-selected{border-color:var(--red);color:var(--red);background:#fff7f8} #rifarCalc .rc-customheight{margin-top:10px;display:flex;justify-content:flex-end} #rifarCalc .rc-customheight label, #rifarCalc .rc-minirow label{font-size:12px;color:#718096;display:grid;gap:6px} #rifarCalc .rc-customheight input, #rifarCalc .rc-minirow input{height:42px;border:1px solid #dbe3eb;border-radius:12px;padding:0 12px;outline:none} #rifarCalc .rc-customheight input:focus, #rifarCalc .rc-minirow input:focus, #rifarCalc .rc-field input:focus, #rifarCalc .rc-field textarea:focus{border-color:var(--red);box-shadow:0 0 0 4px rgba(227,29,43,.08)} #rifarCalc .rc-details{background:#f7f9fc;border-radius:18px;padding:16px} #rifarCalc .rc-details summary{font-weight:800;cursor:pointer} #rifarCalc .rc-details small{font-weight:600;color:#8795a6;background:#edf2f6;padding:5px 8px;border-radius:99px;margin-left:6px} #rifarCalc .rc-minirow{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px} #rifarCalc .rc-roomvisual{position:relative;min-height:520px;overflow:hidden} #rifarCalc .rc-roomvisual>img{width:100%;height:430px;object-fit:contain} #rifarCalc .rc-dim{position:absolute;background:#fff;border:1px solid #e7edf2;border-radius:13px;padding:8px 10px;box-shadow:var(--shadow-sm)} #rifarCalc .rc-dim b{display:block} #rifarCalc .rc-dim span{font-size:11px;color:#77869b} #rifarCalc .rc-dim--area{top:60px;left:40%} #rifarCalc .rc-dim--height{right:18px;top:170px} #rifarCalc .rc-dim--width{right:22%;bottom:90px} #rifarCalc .rc-dim--depth{left:15%;bottom:90px} #rifarCalc .rc-tip{position:absolute;left:22px;right:22px;bottom:18px;background:#eef6fd;border-radius:16px;padding:14px 16px;color:#4e6077} #rifarCalc .rc-grid--rooms{grid-template-columns:1.25fr .75fr} #rifarCalc .rc-counter{display:flex;justify-content:center;align-items:center;gap:28px;margin:0 auto 25px} #rifarCalc .rc-counter button{width:62px;height:62px;border-radius:50%;border:0;background:#eef2f6;color:#516074;font-size:32px} #rifarCalc .rc-counter button.is-primary{background:var(--red);color:#fff} #rifarCalc .rc-counter div{text-align:center;min-width:130px} #rifarCalc .rc-counter strong{font-size:70px;line-height:.9;display:block} #rifarCalc .rc-counter span{font-weight:800;text-transform:uppercase;font-size:14px} #rifarCalc .rc-roomtiles{display:grid;grid-template-columns:repeat(5,1fr);gap:10px} #rifarCalc .rc-roomtile{border:1px solid #e5eaf0;background:#fff;border-radius:18px;padding:12px;min-height:128px;position:relative;text-align:center} #rifarCalc .rc-roomtile.is-selected{border-color:var(--red);background:#fff8f9} #rifarCalc .rc-roomtile .num{position:absolute;left:12px;top:10px;font-size:20px;font-weight:900} #rifarCalc .rc-roomtile .check{position:absolute;right:9px;top:8px;background:var(--red);color:#fff;width:22px;height:22px;border-radius:50%;display:none;place-items:center;font-size:12px} #rifarCalc .rc-roomtile.is-selected .check{display:grid} #rifarCalc .rc-roomtile .emoji{font-size:42px;display:block;margin:16px 0 5px} #rifarCalc .rc-roomtile small{color:#56657a} #rifarCalc .rc-floorplan{position:relative;display:grid;place-items:center;min-height:480px;overflow:hidden} #rifarCalc .rc-floorplan img{width:100%;max-height:430px;object-fit:contain} #rifarCalc .rc-floorplan__caption{position:absolute;bottom:22px;right:22px;font-family:"Segoe Print","Bradley Hand",cursive;font-size:21px;color:#596b80;transform:rotate(-4deg)} #rifarCalc .rc-grid--heatloss{grid-template-columns:.9fr 1.15fr 1fr} #rifarCalc .rc-windowcount{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:16px} #rifarCalc .rc-windowcount button{border:1px solid #e0e7ee;background:#fff;border-radius:14px;min-height:68px;font-size:18px} #rifarCalc .rc-windowcount button.is-selected{border-color:var(--red);background:#fff6f7;color:var(--red)} #rifarCalc .rc-windowphoto{margin-top:14px;border-radius:18px;overflow:hidden;position:relative;background:#eef3f6;min-height:215px} #rifarCalc .rc-windowphoto img{width:100%;height:215px;object-fit:cover} #rifarCalc .rc-windowphoto div{position:absolute;right:18px;top:30px;font-family:"Segoe Print","Bradley Hand",cursive;color:#566980;transform:rotate(-5deg)} #rifarCalc .rc-windowtypes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px} #rifarCalc .rc-windowtypes button{border:1px solid #e0e6ed;background:#fff;border-radius:15px;padding:8px 6px;min-height:185px} #rifarCalc .rc-windowtypes button.is-selected{border-color:var(--red);background:#fff7f8} #rifarCalc .rc-windowtypes img{width:100%;height:115px;object-fit:contain} #rifarCalc .rc-windowtypes span{font-size:11px;font-weight:700;line-height:1.2} #rifarCalc .rc-glasspack{margin-top:16px;background:#f6f9fc;border-radius:17px;padding:15px} #rifarCalc .rc-glasspack h4{margin:0} #rifarCalc .rc-glasspack .rc-segments{grid-auto-columns:1fr} #rifarCalc .rc-insulations{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px} #rifarCalc .rc-insulations button{border:1px solid #e0e6ed;background:#fff;border-radius:16px;padding:8px;min-height:260px;display:flex;flex-direction:column;align-items:center} #rifarCalc .rc-insulations button.is-selected{border-color:var(--red);background:#fff7f8} #rifarCalc .rc-insulations img{width:100%;height:180px;object-fit:contain} #rifarCalc .rc-insulations b{font-size:15px} #rifarCalc .rc-insulations span{font-size:11px;color:#6d7b8f;text-align:center;margin-top:4px} #rifarCalc .rc-grid--final{grid-template-columns:1.05fr .95fr} #rifarCalc .rc-contactcard{padding:28px} #rifarCalc .rc-field{display:grid;gap:7px;margin-top:13px} #rifarCalc .rc-field span{font-size:12px;color:#6d7a8d} #rifarCalc .rc-field input, #rifarCalc .rc-field textarea{width:100%;border:1px solid #dce4ec;border-radius:15px;padding:14px 15px;outline:none;resize:vertical;background:#fff} #rifarCalc .rc-submit{width:100%;margin-top:17px;border:0;border-radius:17px;min-height:58px;background:linear-gradient(135deg,var(--red),#f0082f);color:#fff;font-size:18px;font-weight:900;box-shadow:0 14px 28px rgba(227,29,43,.25)} #rifarCalc .rc-submit span{float:right} #rifarCalc .rc-privacy{font-size:11px;color:#78879b;text-align:center;margin:10px 0} #rifarCalc .rc-resultbox{display:flex;gap:12px;align-items:center;background:#fff5f6;border-radius:17px;padding:15px;margin-top:12px} #rifarCalc .rc-resultbox__icon{font-size:26px;color:var(--red)} #rifarCalc .rc-resultbox b{display:block} #rifarCalc .rc-resultbox span{display:block;font-size:12px;color:#708095;margin-top:4px} #rifarCalc .rc-summarycard__head{display:flex;justify-content:space-between;align-items:center} #rifarCalc .rc-summarycard__head span{font-size:12px;color:#7e8a9a} #rifarCalc .rc-summarylist{margin-top:12px;border:1px solid #ebeff3;border-radius:17px;overflow:hidden} #rifarCalc .rc-summaryrow{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;padding:12px 14px;border-bottom:1px solid #edf1f5} #rifarCalc .rc-summaryrow:last-child{border-bottom:0} #rifarCalc .rc-summaryrow span{color:#7a899c;font-size:13px} #rifarCalc .rc-summaryrow b{font-size:14px} #rifarCalc .rc-summaryrow button{border:0;background:transparent;color:#728197;font-size:12px} #rifarCalc .rc-power{margin-top:14px;background:linear-gradient(135deg,#fff4f5,#f6f9fc);border-radius:17px;padding:16px} #rifarCalc .rc-power span{display:block;font-size:12px;color:#6f7d91} #rifarCalc .rc-power strong{display:block;font-size:33px;margin:4px 0} #rifarCalc .rc-power small{color:#79889a;line-height:1.35} #rifarCalc .rc-bottom{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;margin-top:22px} #rifarCalc .rc-back, #rifarCalc .rc-next{border:0;border-radius:17px;min-height:56px;padding:0 25px;font-weight:800} #rifarCalc .rc-back{background:#e8edf2;color:#59687d} #rifarCalc .rc-next{background:var(--red);color:#fff;min-width:210px;box-shadow:0 14px 30px rgba(227,29,43,.22)} #rifarCalc .rc-selection{justify-self:center;background:#fff;border:1px solid #e7ecf2;border-radius:99px;padding:13px 18px;box-shadow:var(--shadow-sm);color:#5f6d81;font-size:13px} #rifarCalc .rc-selection b{color:var(--red)} #rifarCalc .rc-hidden{display:none!important} #rifarCalc .rc-toast{position:fixed;right:22px;bottom:22px;z-index:100;background:#122033;color:#fff;padding:13px 16px;border-radius:14px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.25s} #rifarCalc .rc-toast.is-show{opacity:1;transform:none} @media (max-width:1180px){ #rifarCalc .rc-hero h1{font-size:42px} #rifarCalc .rc-grid--map, #rifarCalc .rc-grid--room, #rifarCalc .rc-grid--rooms, #rifarCalc .rc-grid--final{grid-template-columns:1fr} #rifarCalc .rc-grid--heatloss{grid-template-columns:1fr 1fr} #rifarCalc .rc-floorplan{display:none} #rifarCalc .rc-house h3{font-size:28px} #rifarCalc .rc-progress__item b{display:none} #rifarCalc .rc-progress__item{min-height:56px} } @media (max-width:820px){ #rifarCalc.rc-app{padding:0 14px 40px} #rifarCalc .rc-hero{grid-template-columns:1fr;min-height:auto} #rifarCalc .rc-hero__visual{display:none} #rifarCalc .rc-hero h1{font-size:34px} #rifarCalc .rc-brand{margin-bottom:18px} #rifarCalc .rc-brand__tag{display:none} #rifarCalc .rc-stephead h2{font-size:30px} #rifarCalc .rc-stephead p{font-size:15px} #rifarCalc .rc-housegrid, #rifarCalc .rc-grid--heatloss{grid-template-columns:1fr} #rifarCalc .rc-house{min-height:330px} #rifarCalc .rc-house img{width:54%} #rifarCalc .rc-house__copy{width:50%} #rifarCalc .rc-mapcard{min-height:auto} #rifarCalc .rc-map{min-height:0;margin-top:65px} #rifarCalc .rc-citygrid{grid-template-columns:1fr} #rifarCalc .rc-climate{grid-template-columns:1fr} #rifarCalc .rc-roomtiles{grid-template-columns:repeat(2,1fr)} #rifarCalc .rc-windowtypes{grid-template-columns:repeat(2,1fr)} #rifarCalc .rc-insulations{grid-template-columns:1fr} #rifarCalc .rc-insulations button{min-height:190px} #rifarCalc .rc-insulations img{height:130px} #rifarCalc .rc-bottom{grid-template-columns:1fr 1fr} #rifarCalc .rc-selection{grid-column:1/-1;grid-row:1;justify-self:stretch;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} #rifarCalc .rc-back, #rifarCalc .rc-next{grid-row:2} #rifarCalc .rc-next{min-width:0} #rifarCalc .rc-progress{overflow-x:auto;grid-template-columns:repeat(6,78px);justify-content:flex-start} #rifarCalc .rc-progress__item:after{display:none} #rifarCalc .rc-controltitle strong{font-size:30px} #rifarCalc .rc-quick{grid-template-columns:repeat(3,1fr);grid-auto-flow:row} #rifarCalc .rc-segments{grid-template-columns:repeat(2,1fr);grid-auto-flow:row} #rifarCalc .rc-roomvisual{min-height:450px} #rifarCalc .rc-roomvisual>img{height:360px} #rifarCalc .rc-dim{display:none} } @media (max-width:520px){ #rifarCalc .rc-hero h1{font-size:29px} #rifarCalc .rc-brand__logo{font-size:28px} #rifarCalc .rc-housegrid{gap:12px} #rifarCalc .rc-house{min-height:300px;padding:18px} #rifarCalc .rc-house h3{font-size:23px} #rifarCalc .rc-house p{font-size:14px} #rifarCalc .rc-house ul{display:none} #rifarCalc .rc-house img{width:55%} #rifarCalc .rc-house__copy{width:52%} #rifarCalc .rc-card{padding:16px;border-radius:20px} #rifarCalc .rc-windowcount{grid-template-columns:repeat(2,1fr)} #rifarCalc .rc-summaryrow{grid-template-columns:1fr 1fr} #rifarCalc .rc-summaryrow button{display:none} } /* ========================================================= V2 — правки по макету 1280px ========================================================= */ /* 8. Весь калькулятор под ширину сайта 1280px */ #rifarCalc.rc-app{ width:100%; max-width:1280px; padding-left:16px; padding-right:16px; } /* 1–2. После удаления бренда правая hero-часть равна по высоте левой */ #rifarCalc .rc-hero{ min-height:0; align-items:stretch; grid-template-columns:1.42fr .78fr; } #rifarCalc .rc-hero__copy{ padding:24px 0 22px; } #rifarCalc .rc-hero__visual{ min-height:0; height:auto; align-self:stretch; } #rifarCalc .rc-hero h1{ font-size:44px; } #rifarCalc .rc-hero p{ max-width:760px; font-size:16px; } #rifarCalc .rc-benefits{ align-items:center; gap:8px; font-size:10px; } #rifarCalc .rc-hero__visual>img{ width:66%; } /* 3. Центрирование кружков, подписей и кнопок */ #rifarCalc .rc-progress__item{ display:flex; align-items:center; justify-content:center; gap:9px; text-align:center; padding-left:9px; padding-right:9px; } #rifarCalc .rc-progress__item span{ flex:0 0 34px; width:34px; height:34px; display:flex; align-items:center; justify-content:center; padding:0; line-height:1; } #rifarCalc .rc-progress__item b{ display:flex; align-items:center; min-height:34px; line-height:1.15; } #rifarCalc .rc-progress__item.is-done span:after{ width:100%; text-align:center; line-height:34px; } #rifarCalc .rc-back, #rifarCalc .rc-next, #rifarCalc .rc-submit{ display:flex; align-items:center; justify-content:center; text-align:center; } #rifarCalc .rc-bottom{ grid-template-columns:180px minmax(0,1fr) 180px; align-items:center; } #rifarCalc .rc-back{ min-width:180px; justify-self:start; } #rifarCalc .rc-next{ min-width:180px; justify-self:end; } #rifarCalc .rc-selection{ width:max-content; max-width:650px; justify-self:center; text-align:center; } /* 6. Карта без нижних прямоугольных кнопок */ #rifarCalc .rc-mapcard{ min-height:525px; padding:18px 20px 16px; } #rifarCalc .rc-mapnote{ left:22px; top:18px; font-size:17px; } #rifarCalc .rc-map{ display:block; width:100%; height:auto; margin:46px auto 0; overflow:visible; } #rifarCalc .rc-map-outline{ fill:#fff; stroke:#dce5ec; stroke-width:8; filter:drop-shadow(0 12px 16px rgba(24,39,56,.12)); } #rifarCalc .district{ stroke:#fff; stroke-width:3; vector-effect:non-scaling-stroke; } #rifarCalc .district:hover, #rifarCalc .district.is-active{ transform:translateY(-4px) scale(1.012); filter:drop-shadow(0 10px 8px rgba(28,42,58,.20)); } #rifarCalc .rc-map-borders path{ fill:none; stroke:#fff; stroke-width:3; vector-effect:non-scaling-stroke; pointer-events:none; } #rifarCalc .rc-map-islands{ fill:#8e84dc; opacity:.92; pointer-events:none; } #rifarCalc .map-labels{ font-size:13px; font-weight:800; fill:#fff; pointer-events:none; } #rifarCalc .map-label{ paint-order:stroke; stroke:rgba(12,28,44,.15); stroke-width:2px; stroke-linejoin:round; } #rifarCalc .map-label--small{ font-size:10px; } #rifarCalc .rc-maplegend{ display:flex; justify-content:center; margin-top:-6px; color:#718096; font-size:12px; } #rifarCalc .rc-maplegend span{ display:inline-flex; align-items:center; gap:8px; background:#f7f9fb; border:1px solid #e9eef3; padding:8px 12px; border-radius:999px; } #rifarCalc .rc-maplegend i{ width:9px; height:9px; flex:0 0 9px; border-radius:50%; background:#ff6a78; } /* 4. Комнаты — независимый мультивыбор */ #rifarCalc .rc-roomcount{ display:flex; align-items:center; justify-content:center; gap:16px; margin:2px auto 24px; min-height:82px; } #rifarCalc .rc-roomcount span{ color:#718096; font-size:14px; font-weight:700; } #rifarCalc .rc-roomcount strong{ min-width:66px; height:66px; border-radius:20px; display:flex; align-items:center; justify-content:center; background:#fff5f6; border:1px solid rgba(227,29,43,.18); color:var(--red); font-size:38px; line-height:1; box-shadow:0 8px 24px rgba(227,29,43,.08); } #rifarCalc .rc-roomtiles{ align-items:stretch; } #rifarCalc .rc-roomtile{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding-top:18px; } #rifarCalc .rc-roomtile .emoji{ line-height:1; } #rifarCalc .rc-roomtile small{ width:100%; text-align:center; line-height:1.2; } #rifarCalc .rc-roomtile.is-selected{ box-shadow:inset 0 0 0 1px var(--red),0 8px 22px rgba(227,29,43,.08); } /* 7. Реальная иконка окна */ #rifarCalc .rc-windowcount button{ display:flex; align-items:center; justify-content:center; gap:9px; padding:8px 10px; } #rifarCalc .rc-windowcount button img{ width:39px; height:39px; flex:0 0 39px; object-fit:contain; } #rifarCalc .rc-windowcount button b{ font-size:18px; line-height:1; } /* Чуть плотнее, чтобы всё красиво садилось в 1280 */ #rifarCalc .rc-grid{ gap:18px; } #rifarCalc .rc-grid--map{ grid-template-columns:minmax(0,1.45fr) minmax(350px,.8fr); } #rifarCalc .rc-housegrid{ gap:18px; } #rifarCalc .rc-house h3{ font-size:31px; } #rifarCalc .rc-house li{ padding:10px 12px; } #rifarCalc .rc-grid--heatloss{ gap:16px; } #rifarCalc .rc-card{ padding:20px; } #rifarCalc .rc-windowtypes{ gap:6px; } #rifarCalc .rc-insulations{ gap:6px; } /* 5. Мощность убрана */ #rifarCalc .rc-power{ display:none!important; } @media (max-width:1180px){ #rifarCalc .rc-hero h1{font-size:39px} #rifarCalc .rc-bottom{grid-template-columns:160px minmax(0,1fr) 160px} #rifarCalc .rc-back, #rifarCalc .rc-next{min-width:160px} } @media (max-width:820px){ #rifarCalc.rc-app{padding-left:12px;padding-right:12px} #rifarCalc .rc-bottom{grid-template-columns:1fr 1fr} #rifarCalc .rc-back, #rifarCalc .rc-next{min-width:0;justify-self:stretch} #rifarCalc .rc-selection{width:100%;max-width:none} #rifarCalc .rc-map{margin-top:62px} #rifarCalc .map-labels{font-size:10px} #rifarCalc .map-label--small{font-size:8px} } /* ========================================================= V4 — новая карта округов + адаптивность + progress ========================================================= */ /* Progress не закрепляем */ #rifarCalc .rc-progress{ position:relative!important; top:auto!important; z-index:5; } /* Карта */ #rifarCalc .rc-mapcard{ min-width:0; overflow:hidden; } #rifarCalc .rc-map{ width:100%; max-width:100%; height:auto; display:block; margin:50px auto 0; overflow:visible; } #rifarCalc .rc-map-backdrop{ fill:#eef3f7; stroke:#d9e4ec; stroke-width:7; stroke-linejoin:round; } #rifarCalc .rc-district-map .district{ cursor:pointer; stroke:#fff; stroke-width:4; stroke-linejoin:round; vector-effect:non-scaling-stroke; transform-box:fill-box; transform-origin:center; transition:transform .18s ease, filter .18s ease, opacity .18s ease; } #rifarCalc .rc-district-map .district:hover, #rifarCalc .rc-district-map .district.is-active{ transform:translateY(-3px); filter:drop-shadow(0 10px 8px rgba(19,35,54,.16)); } #rifarCalc .rc-district-map .district.is-active{ stroke-width:5.5; } #rifarCalc .rc-map-islands{ fill:#8e84dc; opacity:.95; pointer-events:none; } #rifarCalc .map-pill rect, #rifarCalc .map-callout rect{ fill:rgba(255,255,255,.95); stroke:#dfe7ee; stroke-width:1.5; } #rifarCalc .map-pill text, #rifarCalc .map-callout text{ fill:#33465e; font-size:12px; font-weight:800; paint-order:stroke; stroke:rgba(255,255,255,.75); stroke-width:1.5px; stroke-linejoin:round; } #rifarCalc .map-callout line{ stroke:#a5b5c4; stroke-width:2; } #rifarCalc .rc-maplegend{ margin-top:2px; padding-top:2px; } #rifarCalc .rc-maplegend span{ max-width:100%; white-space:normal; text-align:center; } #rifarCalc .rc-maplegend i{ background:var(--red); flex:0 0 9px; } /* Базовая защита от переполнения */ #rifarCalc .rc-grid, #rifarCalc .rc-card, #rifarCalc .rc-step, #rifarCalc .rc-stephead, #rifarCalc .rc-citycard, #rifarCalc .rc-controls, #rifarCalc .rc-roomvisual, #rifarCalc .rc-contactcard, #rifarCalc .rc-summarycard{ min-width:0; } #rifarCalc .rc-card{ width:100%; max-width:100%; } #rifarCalc .rc-card img, #rifarCalc .rc-card svg{ max-width:100%; } /* Планшет */ @media (max-width:980px){ #rifarCalc .rc-progress{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); overflow:visible; padding:4px 6px; } #rifarCalc .rc-progress__item{ min-width:0; min-height:62px; padding:5px 3px; gap:5px; flex-direction:column; justify-content:center; } #rifarCalc .rc-progress__item span{ width:30px; height:30px; flex-basis:30px; font-size:13px; } #rifarCalc .rc-progress__item.is-done span:after{ line-height:30px; } #rifarCalc .rc-progress__item b{ display:block; width:100%; min-height:0; font-size:10px; line-height:1.05; white-space:normal; text-align:center; } #rifarCalc .rc-progress__item:after{ display:none; } #rifarCalc .rc-progress__item.is-active:before{ left:10%; right:10%; } #rifarCalc .map-pill text, #rifarCalc .map-callout text{ font-size:10px; } } /* Планшет / мобильная версия карточек и сеток */ @media (max-width:820px){ #rifarCalc.rc-app{ padding-left:10px; padding-right:10px; } #rifarCalc .rc-grid--map, #rifarCalc .rc-grid--room, #rifarCalc .rc-grid--rooms, #rifarCalc .rc-grid--heatloss, #rifarCalc .rc-grid--final, #rifarCalc .rc-housegrid{ grid-template-columns:minmax(0,1fr)!important; } #rifarCalc .rc-card{ padding:16px; border-radius:20px; overflow:hidden; } #rifarCalc .rc-mapcard{ min-height:0; padding:14px 10px 14px; } #rifarCalc .rc-mapnote{ position:relative; left:auto; top:auto; margin:0 4px -20px; transform:none; font-size:14px; } #rifarCalc .rc-mapnote span{ font-size:11px; } #rifarCalc .rc-map{ margin-top:26px; } #rifarCalc .map-pill text, #rifarCalc .map-callout text{ font-size:8px; } #rifarCalc .rc-maplegend{ padding:6px 4px 0; } #rifarCalc .rc-maplegend span{ font-size:10px; padding:7px 9px; } #rifarCalc .rc-citygrid{ grid-template-columns:repeat(2,minmax(0,1fr)); max-height:none; } #rifarCalc .rc-citygrid button{ min-width:0; overflow-wrap:anywhere; } #rifarCalc .rc-climate{ grid-template-columns:1fr 1fr; } #rifarCalc .rc-house{ min-height:300px; } #rifarCalc .rc-roomvisual{ min-height:390px; } #rifarCalc .rc-roomvisual>img{ height:320px; } #rifarCalc .rc-windowtypes{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-windowtypes button{ min-width:0; } #rifarCalc .rc-insulations{ grid-template-columns:repeat(3,minmax(0,1fr)); } #rifarCalc .rc-insulations button{ min-width:0; min-height:210px; } #rifarCalc .rc-insulations img{ height:135px; } #rifarCalc .rc-summaryrow{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) auto; } } /* Телефон */ @media (max-width:560px){ #rifarCalc .rc-hero__copy{ padding-top:18px; } #rifarCalc .rc-hero h1{ font-size:27px; line-height:1.08; } #rifarCalc .rc-hero p{ font-size:14px; } #rifarCalc .rc-stephead h2{ font-size:27px; } #rifarCalc .rc-progress{ border-radius:16px; padding:4px; } #rifarCalc .rc-progress__item{ min-height:48px; padding:4px 1px; } #rifarCalc .rc-progress__item span{ width:28px; height:28px; flex-basis:28px; font-size:12px; } #rifarCalc .rc-progress__item.is-done span:after{ line-height:28px; font-size:13px; } #rifarCalc .rc-progress__item b{ display:none!important; } #rifarCalc .rc-progress__item.is-active:before{ height:2px; left:14%; right:14%; } #rifarCalc .rc-card{ padding:14px; border-radius:17px; box-shadow:0 7px 22px rgba(22,34,51,.06); } #rifarCalc .rc-mapcard{ padding:12px 6px; } #rifarCalc .rc-map{ margin-top:20px; } #rifarCalc .map-pill text, #rifarCalc .map-callout text{ font-size:7px; } #rifarCalc .rc-maplegend span{ font-size:9px; } #rifarCalc .rc-citygrid{ grid-template-columns:1fr 1fr; gap:7px; } #rifarCalc .rc-citygrid button{ padding:8px 9px; min-height:46px; font-size:12px; } #rifarCalc .rc-climate{ grid-template-columns:1fr; } #rifarCalc .rc-house{ min-height:280px; padding:15px; } #rifarCalc .rc-house__copy{ width:54%; } #rifarCalc .rc-house img{ width:50%; } #rifarCalc .rc-quick{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-segments{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-roomtiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-windowtypes{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-insulations{ grid-template-columns:1fr; } #rifarCalc .rc-insulations button{ min-height:180px; } #rifarCalc .rc-insulations img{ height:120px; } #rifarCalc .rc-windowcount{ grid-template-columns:repeat(2,minmax(0,1fr)); } #rifarCalc .rc-summaryrow{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:6px; } #rifarCalc .rc-summaryrow button{ display:none; } #rifarCalc .rc-bottom{ grid-template-columns:1fr 1fr; gap:9px; } #rifarCalc .rc-selection{ grid-column:1/-1; width:100%; max-width:none; padding:10px 12px; font-size:11px; white-space:normal; } #rifarCalc .rc-back, #rifarCalc .rc-next{ min-width:0; width:100%; padding:0 12px; min-height:50px; font-size:13px; } } /* ========================================================= V4 — абсолютно новая карта федеральных округов ========================================================= */ #rifarCalc .rc-map--russia{ width:100%; max-width:100%; display:block; margin:28px auto 0; } #rifarCalc .rf-country-shadow{ fill:#eef3f6; stroke:#dce5eb; stroke-width:10; stroke-linejoin:round; } #rifarCalc .rf-district, #rifarCalc .rf-island{ stroke:#fff; stroke-width:4; stroke-linejoin:round; cursor:pointer; vector-effect:non-scaling-stroke; transform-box:fill-box; transform-origin:center; transition:transform .18s ease, filter .18s ease, opacity .18s ease; } #rifarCalc .rf-district:hover, #rifarCalc .rf-district.is-active, #rifarCalc .rf-island:hover, #rifarCalc .rf-island.is-active{ transform:translateY(-4px); filter:drop-shadow(0 10px 8px rgba(23,38,55,.20)); } #rifarCalc .rf-district.is-active, #rifarCalc .rf-island.is-active{ stroke-width:6; } #rifarCalc .rf-islands{ cursor:pointer; } #rifarCalc .rc-map--russia .map-labels{ font-size:13px; font-weight:900; fill:#fff; pointer-events:none; } #rifarCalc .rc-map--russia .map-labels text{ paint-order:stroke; stroke:rgba(14,27,43,.20); stroke-width:2px; stroke-linejoin:round; } #rifarCalc .rf-small-label{ pointer-events:none; } #rifarCalc .rf-small-label path{ fill:none; stroke:#8c6ce4; stroke-width:2.5; stroke-dasharray:5 5; } #rifarCalc .rf-small-label rect{ fill:#fff; stroke:#e4e9ef; stroke-width:1.5; filter:drop-shadow(0 7px 14px rgba(28,42,58,.10)); } #rifarCalc .rf-small-label text{ fill:#56667b; font-size:11px; font-weight:700; } #rifarCalc .rc-maplegend{ margin-top:-2px; } @media (max-width:820px){ #rifarCalc .rc-map--russia{ margin-top:18px; } #rifarCalc .rc-map--russia .map-labels{ font-size:11px; } #rifarCalc .rf-small-label text{ font-size:9px; } } @media (max-width:560px){ #rifarCalc .rc-map--russia{ margin-top:14px; } #rifarCalc .rc-map--russia .map-labels{ font-size:8px; } #rifarCalc .rf-small-label{ display:none; } } /* ========================================================= V5 — читаемость подписей на карте ========================================================= */ #rifarCalc .rc-map--russia .map-labels{ font-size:16px; font-weight:900; fill:#fff; pointer-events:none; } #rifarCalc .rc-map--russia .map-labels text{ paint-order:stroke fill; stroke:#111827; stroke-width:3px; stroke-linejoin:round; stroke-opacity:.92; filter: drop-shadow(0 1px 1px rgba(0,0,0,.95)) drop-shadow(0 2px 4px rgba(0,0,0,.55)); } #rifarCalc .rc-map--russia .map-labels tspan{ paint-order:stroke fill; stroke:#111827; stroke-width:3px; stroke-linejoin:round; } #rifarCalc .rf-small-label text{ fill:#fff; font-size:13px; font-weight:900; paint-order:stroke fill; stroke:#111827; stroke-width:2.5px; stroke-linejoin:round; } @media (max-width:820px){ #rifarCalc .rc-map--russia .map-labels{ font-size:13px; } #rifarCalc .rc-map--russia .map-labels text, #rifarCalc .rc-map--russia .map-labels tspan{ stroke-width:2.5px; } #rifarCalc .rf-small-label text{ font-size:11px; stroke-width:2px; } } @media (max-width:560px){ #rifarCalc .rc-map--russia .map-labels{ font-size:10px; } #rifarCalc .rc-map--russia .map-labels text, #rifarCalc .rc-map--russia .map-labels tspan{ stroke-width:2px; } } /* ========================================================= V6 — подписи карты: без свечения, только обводка ========================================================= */ /* Основные подписи округов: оставляем только чёрную обводку, без drop-shadow */ #rifarCalc .rc-map--russia .map-labels{ font-size:16px; font-weight:900; fill:#fff; pointer-events:none; } #rifarCalc .rc-map--russia .map-labels text, #rifarCalc .rc-map--russia .map-labels tspan{ paint-order:stroke fill; stroke:#111827; stroke-width:3px; stroke-linejoin:round; stroke-opacity:1; filter:none!important; } /* Северо-Кавказский ФО: убираем белую рамку/плашку и любую обводку/свечение, оставляем просто увеличенный тёмный текст */ #rifarCalc .rf-small-label rect{ display:none!important; } #rifarCalc .rf-small-label text, #rifarCalc .rf-small-label text tspan{ fill:#4f6075; font-size:16px; font-weight:900; stroke:none!important; filter:none!important; paint-order:normal; } /* Линию-указатель оставляем */ #rifarCalc .rf-small-label path{ fill:none; stroke:#8c6ce4; stroke-width:2.5px; stroke-dasharray:5 5; } @media (max-width:820px){ #rifarCalc .rc-map--russia .map-labels{ font-size:13px; } #rifarCalc .rc-map--russia .map-labels text, #rifarCalc .rc-map--russia .map-labels tspan{ stroke-width:2.5px; } #rifarCalc .rf-small-label text, #rifarCalc .rf-small-label text tspan{ font-size:14px; } } @media (max-width:560px){ #rifarCalc .rc-map--russia .map-labels{ font-size:10px; } #rifarCalc .rc-map--russia .map-labels text, #rifarCalc .rc-map--russia .map-labels tspan{ stroke-width:2px; } } /* ========================================================= V9 — BUTTON FIREWALL Жёсткая защита кнопок калькулятора от CSS темы сайта. Этот блок должен находиться САМЫМ ПОСЛЕДНИМ в style.css. ========================================================= */ /* Базовая нормализация всех button внутри калькулятора. Здесь только свойства, одинаковые для всех наших кнопок. */ #rifarCalc button { -webkit-appearance:none !important; appearance:none !important; -webkit-tap-highlight-color:transparent !important; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important; font-style:normal !important; text-transform:none !important; text-decoration:none !important; letter-spacing:normal !important; box-sizing:border-box !important; float:none !important; clear:none !important; vertical-align:middle !important; outline:none !important; cursor:pointer !important; background-image:none !important; text-shadow:none !important; margin-top:0 !important; margin-bottom:0 !important; } /* Тема часто рисует свои стрелки / иконки через ::before и ::after. Убираем их у всех обычных кнопок калькулятора. Progress исключён — у него наши собственные псевдоэлементы. */ #rifarCalc button:not(.rc-progress__item)::before, #rifarCalc button:not(.rc-progress__item)::after { content:none !important; display:none !important; background:none !important; border:0 !important; box-shadow:none !important; } /* ------------------------- PROGRESS ------------------------- */ #rifarCalc .rc-progress__item { width:auto !important; height:auto !important; min-width:0 !important; min-height:68px !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; position:relative !important; inset:auto !important; padding:0 9px !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#7a899e !important; line-height:1.15 !important; text-align:center !important; } #rifarCalc .rc-progress__item:hover, #rifarCalc .rc-progress__item:focus { background:transparent !important; color:#7a899e !important; box-shadow:none !important; } #rifarCalc .rc-progress__item.is-active { color:var(--ink) !important; } #rifarCalc .rc-progress__item span { width:34px !important; height:34px !important; min-width:34px !important; min-height:34px !important; flex:0 0 34px !important; display:flex !important; align-items:center !important; justify-content:center !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:#cfd7e2 !important; color:#fff !important; font-size:14px !important; font-weight:800 !important; line-height:1 !important; text-align:center !important; box-shadow:none !important; } #rifarCalc .rc-progress__item.is-active span, #rifarCalc .rc-progress__item.is-done span { background:var(--red) !important; color:#fff !important; } #rifarCalc .rc-progress__item b { display:flex !important; align-items:center !important; min-height:34px !important; margin:0 !important; padding:0 !important; color:inherit !important; background:transparent !important; font-size:14px !important; font-weight:700 !important; line-height:1.15 !important; white-space:nowrap !important; text-align:center !important; } /* ------------------------- ГОРОДА ------------------------- */ #rifarCalc .rc-citygrid button { width:100% !important; height:auto !important; min-width:0 !important; min-height:50px !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; position:relative !important; margin:0 !important; padding:0 14px !important; border:1px solid #e4e9f0 !important; border-radius:14px !important; background:#fff !important; color:#26354b !important; font-size:15px !important; font-weight:400 !important; line-height:1.2 !important; text-align:left !important; box-shadow:none !important; } #rifarCalc .rc-citygrid button:hover { border-color:#cfd8e3 !important; background:#f9fbfd !important; color:#26354b !important; } #rifarCalc .rc-citygrid button.is-selected { border-color:var(--red) !important; background:#fff6f7 !important; color:var(--red) !important; font-weight:800 !important; box-shadow:0 0 0 4px rgba(227,29,43,.06) !important; } /* ------------------------- ТИП ДОМА ------------------------- */ #rifarCalc .rc-choice { width:100% !important; height:auto !important; min-width:0 !important; min-height:420px !important; display:block !important; position:relative !important; overflow:hidden !important; margin:0 !important; padding:26px !important; border:1px solid #e8edf2 !important; border-radius:30px !important; background:#fff !important; color:var(--ink) !important; line-height:1.4 !important; text-align:left !important; box-shadow:var(--shadow-sm) !important; } #rifarCalc .rc-choice:hover { border-color:#dde5ec !important; background:#fff !important; box-shadow:var(--shadow) !important; } #rifarCalc .rc-choice.is-selected { border-color:var(--red) !important; background:#fff !important; box-shadow:0 20px 50px rgba(227,29,43,.10) !important; } /* ------------------------- БЫСТРЫЙ ВЫБОР / СЕГМЕНТЫ ------------------------- */ #rifarCalc .rc-quick button, #rifarCalc .rc-segments button { width:100% !important; height:auto !important; min-width:0 !important; min-height:44px !important; display:flex !important; align-items:center !important; justify-content:center !important; margin:0 !important; padding:8px 10px !important; border:1px solid #e0e7ee !important; border-radius:14px !important; background:#fff !important; color:#233247 !important; font-size:14px !important; font-weight:700 !important; line-height:1.15 !important; text-align:center !important; box-shadow:none !important; } #rifarCalc .rc-quick button:hover, #rifarCalc .rc-segments button:hover, #rifarCalc .rc-quick button.is-selected, #rifarCalc .rc-segments button.is-selected { border-color:var(--red) !important; background:#fff7f8 !important; color:var(--red) !important; } /* ------------------------- КОМНАТЫ ------------------------- */ #rifarCalc .rc-roomtile { width:100% !important; height:auto !important; min-width:0 !important; min-height:128px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; position:relative !important; overflow:visible !important; margin:0 !important; padding:18px 12px 12px !important; border:1px solid #e5eaf0 !important; border-radius:18px !important; background:#fff !important; color:var(--ink) !important; line-height:1.2 !important; text-align:center !important; box-shadow:none !important; } #rifarCalc .rc-roomtile:hover { border-color:#cfd8e2 !important; background:#fff !important; } #rifarCalc .rc-roomtile.is-selected { border-color:var(--red) !important; background:#fff8f9 !important; box-shadow:inset 0 0 0 1px var(--red),0 8px 22px rgba(227,29,43,.08) !important; } /* ------------------------- КОЛИЧЕСТВО ОКОН ------------------------- */ #rifarCalc .rc-windowcount button { width:100% !important; height:auto !important; min-width:0 !important; min-height:68px !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; margin:0 !important; padding:8px 10px !important; border:1px solid #e0e7ee !important; border-radius:14px !important; background:#fff !important; color:#26354b !important; font-size:18px !important; font-weight:400 !important; line-height:1 !important; box-shadow:none !important; } #rifarCalc .rc-windowcount button.is-selected { border-color:var(--red) !important; background:#fff6f7 !important; color:var(--red) !important; } /* ------------------------- ТИП ОКОН ------------------------- */ #rifarCalc .rc-windowtypes button { width:100% !important; height:auto !important; min-width:0 !important; min-height:185px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; margin:0 !important; padding:8px 6px !important; border:1px solid #e0e6ed !important; border-radius:15px !important; background:#fff !important; color:var(--ink) !important; line-height:1.2 !important; text-align:center !important; box-shadow:none !important; } #rifarCalc .rc-windowtypes button.is-selected { border-color:var(--red) !important; background:#fff7f8 !important; } /* ------------------------- УТЕПЛЕНИЕ ------------------------- */ #rifarCalc .rc-insulations button { width:100% !important; height:auto !important; min-width:0 !important; min-height:260px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; margin:0 !important; padding:8px !important; border:1px solid #e0e6ed !important; border-radius:16px !important; background:#fff !important; color:var(--ink) !important; line-height:1.2 !important; text-align:center !important; box-shadow:none !important; } #rifarCalc .rc-insulations button.is-selected { border-color:var(--red) !important; background:#fff7f8 !important; } /* ------------------------- ИЗМЕНИТЬ В СВОДКЕ ------------------------- */ #rifarCalc .rc-summaryrow button { width:auto !important; height:auto !important; min-width:0 !important; min-height:0 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; margin:0 !important; padding:4px 6px !important; border:0 !important; border-radius:7px !important; background:transparent !important; color:#728197 !important; font-size:12px !important; font-weight:400 !important; line-height:1.2 !important; box-shadow:none !important; } /* ------------------------- НАЗАД / ПРОДОЛЖИТЬ ------------------------- */ #rifarCalc .rc-back, #rifarCalc .rc-next { width:auto !important; height:auto !important; min-width:180px !important; min-height:56px !important; display:flex !important; align-items:center !important; justify-content:center !important; position:relative !important; margin:0 !important; padding:0 25px !important; border:0 !important; border-radius:17px !important; font-size:16px !important; font-weight:800 !important; line-height:1 !important; text-align:center !important; text-shadow:none !important; } #rifarCalc .rc-back { justify-self:start !important; background:#e8edf2 !important; color:#59687d !important; box-shadow:none !important; } #rifarCalc .rc-back:hover { background:#dde5ec !important; color:#425269 !important; } #rifarCalc .rc-next { justify-self:end !important; background:var(--red) !important; color:#fff !important; box-shadow:0 14px 30px rgba(227,29,43,.22) !important; } #rifarCalc .rc-next:hover { background:#cc1724 !important; color:#fff !important; } /* ------------------------- ОТПРАВИТЬ ------------------------- */ #rifarCalc .rc-submit { width:100% !important; height:auto !important; min-width:0 !important; min-height:58px !important; display:flex !important; align-items:center !important; justify-content:center !important; gap:12px !important; position:relative !important; margin:17px 0 0 !important; padding:0 20px !important; border:0 !important; border-radius:17px !important; background:linear-gradient(135deg,var(--red),#f0082f) !important; color:#fff !important; font-size:18px !important; font-weight:900 !important; line-height:1.1 !important; text-align:center !important; box-shadow:0 14px 28px rgba(227,29,43,.25) !important; } #rifarCalc .rc-submit:hover { background:linear-gradient(135deg,#cf1724,#e3062b) !important; color:#fff !important; } /* ------------------------- АДАПТИВНЫЕ BUTTON OVERRIDES ------------------------- */ @media(max-width:980px){ #rifarCalc .rc-progress__item { min-height:62px !important; padding:5px 3px !important; gap:5px !important; flex-direction:column !important; } #rifarCalc .rc-progress__item span { width:30px !important; height:30px !important; min-width:30px !important; min-height:30px !important; flex:0 0 30px !important; font-size:13px !important; } #rifarCalc .rc-progress__item b { width:100% !important; min-height:0 !important; display:block !important; font-size:10px !important; line-height:1.05 !important; white-space:normal !important; } } @media(max-width:820px){ #rifarCalc .rc-choice { min-height:300px !important; padding:18px !important; } #rifarCalc .rc-insulations button { min-height:210px !important; } #rifarCalc .rc-back, #rifarCalc .rc-next { min-width:0 !important; width:100% !important; justify-self:stretch !important; } } @media(max-width:560px){ #rifarCalc .rc-progress__item { min-height:48px !important; padding:4px 1px !important; } #rifarCalc .rc-progress__item span { width:28px !important; height:28px !important; min-width:28px !important; min-height:28px !important; flex:0 0 28px !important; font-size:12px !important; } #rifarCalc .rc-progress__item b { display:none !important; } #rifarCalc .rc-citygrid button { min-height:46px !important; padding:8px 9px !important; font-size:12px !important; } #rifarCalc .rc-choice { min-height:280px !important; padding:15px !important; } #rifarCalc .rc-insulations button { min-height:180px !important; } #rifarCalc .rc-summaryrow button { display:none !important; } #rifarCalc .rc-back, #rifarCalc .rc-next { min-width:0 !important; width:100% !important; min-height:50px !important; padding:0 12px !important; font-size:13px !important; } } /* ========================================================= V10 — RANGE FIX Тема сайта сбрасывала appearance у input[type=range], поэтому исчезала дорожка ползунка. ========================================================= */ #rifarCalc input.rc-range { -webkit-appearance:none !important; appearance:none !important; display:block !important; width:100% !important; height:8px !important; min-height:8px !important; margin:18px 0 10px !important; padding:0 !important; border:0 !important; border-radius:999px !important; outline:0 !important; background: linear-gradient( to right, var(--red) 0%, var(--red) var(--range-progress, 21.65%), #dfe7ef var(--range-progress, 21.65%), #dfe7ef 100% ) !important; box-shadow:inset 0 1px 2px rgba(20,35,50,.08) !important; cursor:pointer !important; } /* Chrome / Edge / Safari */ #rifarCalc input.rc-range::-webkit-slider-runnable-track { -webkit-appearance:none !important; appearance:none !important; width:100% !important; height:8px !important; border:0 !important; border-radius:999px !important; background:transparent !important; box-shadow:none !important; } #rifarCalc input.rc-range::-webkit-slider-thumb { -webkit-appearance:none !important; appearance:none !important; width:22px !important; height:22px !important; margin-top:-7px !important; border:4px solid #fff !important; border-radius:50% !important; background:var(--red) !important; box-shadow: 0 2px 8px rgba(227,29,43,.32), 0 0 0 1px rgba(227,29,43,.08) !important; cursor:grab !important; } #rifarCalc input.rc-range:active::-webkit-slider-thumb { cursor:grabbing !important; transform:scale(1.06); } /* Firefox */ #rifarCalc input.rc-range::-moz-range-track { width:100% !important; height:8px !important; border:0 !important; border-radius:999px !important; background:#dfe7ef !important; box-shadow:inset 0 1px 2px rgba(20,35,50,.08) !important; } #rifarCalc input.rc-range::-moz-range-progress { height:8px !important; border-radius:999px !important; background:var(--red) !important; } #rifarCalc input.rc-range::-moz-range-thumb { width:14px !important; height:14px !important; border:4px solid #fff !important; border-radius:50% !important; background:var(--red) !important; box-shadow: 0 2px 8px rgba(227,29,43,.32), 0 0 0 1px rgba(227,29,43,.08) !important; cursor:grab !important; } /* Focus */ #rifarCalc input.rc-range:focus { outline:none !important; } #rifarCalc input.rc-range:focus-visible::-webkit-slider-thumb { box-shadow: 0 2px 8px rgba(227,29,43,.32), 0 0 0 5px rgba(227,29,43,.12) !important; } @media(max-width:560px){ #rifarCalc input.rc-range { height:7px !important; min-height:7px !important; margin:16px 0 9px !important; } #rifarCalc input.rc-range::-webkit-slider-runnable-track { height:7px !important; } #rifarCalc input.rc-range::-webkit-slider-thumb { width:21px !important; height:21px !important; margin-top:-7px !important; } } .rc-progress__item.is-done span { font-size: 0!important; } #rifarCalc h1, #rifarCalc h2, #rifarCalc h3 { font-weight: 700; } /* ========================================================= V13 — ШАГ 5: точное количество окон 6+ и высота подоконника Добавить В КОНЕЦ вашего текущего style.css ========================================================= */ #rifarCalc .rc-windowmore{ min-height:68px; border:1px solid #e0e7ee; border-radius:14px; background:#f7f9fc; padding:8px 10px; display:flex; flex-direction:column; justify-content:center; gap:5px; transition:border-color .18s ease, background .18s ease, box-shadow .18s ease; } #rifarCalc .rc-windowmore.is-active, #rifarCalc .rc-windowmore:focus-within{ border-color:var(--red); background:#fff6f7; box-shadow:0 0 0 3px rgba(227,29,43,.06); } #rifarCalc .rc-windowmore > span{ display:block; font-size:11px; line-height:1.1; color:#758398; font-weight:700; } #rifarCalc .rc-windowmore label{ display:flex; align-items:center; gap:6px; margin:0; } #rifarCalc .rc-windowmore input{ width:100%; min-width:0; height:31px; border:0!important; border-bottom:1px solid #cfd8e3!important; border-radius:0!important; padding:2px 0!important; background:transparent!important; color:var(--ink)!important; font-size:15px!important; font-weight:800!important; outline:none!important; box-shadow:none!important; text-align:center; } #rifarCalc .rc-windowmore input:focus{ border-bottom-color:var(--red)!important; } #rifarCalc .rc-windowmore label b{ flex:0 0 auto; font-size:12px; color:#718096; } #rifarCalc .rc-sillheight{ margin-top:16px; padding:14px 15px; border:1px solid #e8edf3; border-radius:17px; background:#f6f9fc; display:flex; align-items:center; justify-content:space-between; gap:18px; } #rifarCalc .rc-sillheight h4{ margin:0; font-size:15px; } #rifarCalc .rc-sillheight p{ margin:3px 0 0; color:#7a899d; font-size:12px; } #rifarCalc .rc-sillheight label{ flex:0 0 112px; height:46px; border:1px solid #dbe4ed; border-radius:13px; background:#fff; display:flex; align-items:center; overflow:hidden; } #rifarCalc .rc-sillheight input{ width:72px; height:44px; border:0!important; outline:0!important; padding:0 6px 0 12px!important; background:#fff!important; color:var(--ink)!important; font-size:16px!important; font-weight:900!important; text-align:center; box-shadow:none!important; } #rifarCalc .rc-sillheight label span{ padding-right:12px; font-size:12px; font-weight:700; color:#718096; } @media(max-width:560px){ #rifarCalc .rc-windowmore{ min-height:68px; } #rifarCalc .rc-sillheight{ align-items:flex-start; flex-direction:column; gap:10px; } #rifarCalc .rc-sillheight label{ width:100%; flex-basis:auto; } #rifarCalc .rc-sillheight input{ width:100%; text-align:left; } }