@charset "UTF-8";.oq-choice__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; } .oq-card { position: relative; display: flex; flex-direction: column; border-radius: var(--site-radius-lg); border: 1px solid var(--site-c-line); background: #fff; box-shadow: var(--site-shadow-card); } .oq-card--cad { border: 2px solid var(--site-c-blue); background: linear-gradient(180deg, #fbfdff 0%, #f2f7ff 100%); } .oq-card__tag { position: absolute; top: -13px; left: 26px; z-index: 2; padding: 4px 14px; border-radius: var(--site-radius-pill); background: var(--site-grad-dot); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 0.08em; } .oq-card__thumb { overflow: hidden; border-radius: 20px 20px 0 0; } .oq-card--cad .oq-card__thumb { border-radius: 19px 19px 0 0; } .oq-card__thumb img { display: block; width: 100%; height: 210px; object-fit: cover; } .oq-card__body { display: flex; flex-direction: column; flex: 1; gap: 12px; padding: 26px 28px 28px; } .oq-card__title { margin: 0; font-size: 24px; font-weight: 800; color: var(--site-c-text); } .oq-card__sub { margin: -4px 0 0; font-size: 14px; font-weight: 700; color: var(--site-c-blue); } .oq-card__text { margin: 0; font-size: 14.5px; line-height: 1.9; color: var(--site-c-muted); } .oq-card__chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 2px 0 10px; list-style: none; } .oq-card__chips li { display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px; border-radius: var(--site-radius-pill); background: var(--site-c-tint); color: var(--site-c-navy); font-size: 12.5px; font-weight: 700; } .oq-card__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: auto; } .oq-card__more { font-size: 13.5px; font-weight: 700; color: var(--site-c-blue); text-decoration: none; } .oq-card__more:hover { color: var(--site-c-blue); text-decoration: underline; } .oq-btn:focus-visible, .oq-card__more:focus-visible, .oq-faq-col__more:focus-visible, .oq-support-card:focus-visible { outline: 3px solid rgba(47, 103, 200, 0.35); outline-offset: 3px; }   .oq-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 14px 30px; border-radius: 12px; font-size: 16px; font-weight: 700; line-height: 1.2; text-decoration: none; transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease; } .oq-btn:hover { transform: translateY(-2px); text-decoration: none; } .oq-btn--primary { background: var(--site-grad-primary); color: #fff; box-shadow: var(--site-shadow-btn); } .oq-btn--primary:hover { color: #fff; box-shadow: var(--site-shadow-card-hover); } .oq-btn--secondary { background: #fff; border: 1px solid var(--site-c-tint-strong); color: var(--site-c-navy); } .oq-btn--secondary:hover { background: #f6f9ff; color: var(--site-c-navy); } .oq-btn__note { padding: 3px 10px; border-radius: 6px; background: rgba(255, 255, 255, 0.18); font-size: 12px; font-weight: 700; } .oq-btn__arrow { flex: none; }   .oq-intro { padding: 34px 36px 32px; border-radius: var(--site-radius-lg); border: 1px solid var(--site-c-line); background: #fff; box-shadow: var(--site-shadow-card); } .oq-intro + .oq-intro { margin-top: 30px; }   .oq-intro__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 34px; align-items: center; } .oq-intro__media { margin: 0; } .oq-intro__media img { display: block; width: 100%; height: auto; border-radius: var(--site-radius-md); border: 1px solid var(--site-c-line); box-shadow: var(--site-shadow-card); } .oq-intro__media figcaption { margin-top: 10px; font-size: 12px; color: var(--site-c-muted); text-align: center; } .oq-intro--speed .oq-intro__media { order: -1; } .oq-intro__title { margin: 14px 0 0; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.5; font-weight: 800; color: var(--site-c-text); } .oq-intro__lead { max-width: 980px; margin: 14px 0 0; font-size: 15px; line-height: 2; color: var(--site-c-muted); } .oq-intro__cols { display: grid; grid-template-columns: 1.05fr 1fr; gap: 34px; margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--site-c-line); } .oq-intro__colTitle { margin: 0 0 14px; font-size: 15px; font-weight: 800; letter-spacing: 0.04em; color: var(--site-c-navy); } .oq-intro__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 26px; }   .oq-checklist { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; } .oq-checklist li { position: relative; padding-left: 30px; font-size: 14.5px; line-height: 1.8; color: var(--site-c-text); } .oq-checklist li::before { content: ""; position: absolute; left: 0; top: 3px; width: 19px; height: 19px; border-radius: 50%; background: var(--site-grad-dot); } .oq-checklist li::after { content: ""; position: absolute; left: 5px; top: 8px; width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }   .oq-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 16px; } .oq-steps li { display: flex; align-items: flex-start; gap: 14px; } .oq-steps__no { flex: none; display: inline-block; margin-top: 2px; padding: 5px 12px; border-radius: var(--site-radius-pill); background: var(--site-c-tint); color: var(--site-c-navy); font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; white-space: nowrap; } .oq-steps__body h4 { margin: 0; font-size: 15px; font-weight: 800; color: var(--site-c-text); } .oq-steps__body p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.8; color: var(--site-c-muted); }   .oq-table-wrap { margin-top: 42px; border-radius: var(--site-radius-lg); border: 1px solid var(--site-c-line); background: #fff; box-shadow: var(--site-shadow-card); overflow: hidden; } .oq-table { width: 100%; border-collapse: collapse; font-size: 14.5px; } .oq-table th, .oq-table td { padding: 18px 22px; text-align: left; vertical-align: top; border-top: 1px solid var(--site-c-line); line-height: 1.8; color: var(--site-c-text); } .oq-table thead th { border-top: none; padding-top: 22px; padding-bottom: 16px; } .oq-table__label { width: 190px; background: var(--site-c-bg-soft); color: var(--site-c-muted); font-size: 13px; font-weight: 800; letter-spacing: 0.04em; } .oq-table__prod { font-size: 16.5px; font-weight: 800; color: var(--site-c-text); } .oq-table__newTag { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: var(--site-radius-pill); background: var(--site-grad-dot); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: 0.08em; vertical-align: 2px; } .oq-table__cad { background: #f7faff; } th.oq-table__label.oq-table__cad { background: var(--site-c-bg-soft); }   .oq-faq__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; margin-top: 40px; } .oq-faq-col { display: flex; flex-direction: column; align-items: flex-start; padding: 26px 28px 24px; border-radius: var(--site-radius-lg); border: 1px solid var(--site-c-line); background: #fff; box-shadow: var(--site-shadow-card); } .oq-faq-col__title { margin: 0 0 6px; font-size: 16.5px; font-weight: 800; color: var(--site-c-text); } .oq-faq-list { margin: 0; width: 100%; } .oq-faq-list dt { position: relative; margin-top: 16px; padding: 14px 0 0 32px; border-top: 1px solid var(--site-c-line); font-size: 14.5px; font-weight: 800; color: var(--site-c-text); } .oq-faq-list dt:first-child { margin-top: 8px; padding-top: 12px; border-top: none; } .oq-faq-list dt::before { content: "Q"; position: absolute; left: 0; top: 12px; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--site-grad-dot); color: #fff; font-size: 12px; font-weight: 800; } .oq-faq-list dt:first-child::before { top: 10px; } .oq-faq-list dd { margin: 6px 0 0 32px; font-size: 14px; line-height: 1.9; color: var(--site-c-muted); } .oq-faq-col__more { margin-top: 18px; font-size: 13.5px; font-weight: 700; color: var(--site-c-blue); text-decoration: none; } .oq-faq-col__more:hover { color: var(--site-c-blue); text-decoration: underline; }   .oq-support { padding-bottom: var(--site-section-gap-last); } .oq-support__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 40px; } .oq-support-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 24px 24px 22px; border-radius: var(--site-radius-lg); border: 1px solid var(--site-c-line); background: #fff; box-shadow: var(--site-shadow-card); text-decoration: none; transition: transform 0.2s ease, box-shadow 0.2s ease; } .oq-support-card:hover { transform: translateY(-2px); box-shadow: var(--site-shadow-card-hover); text-decoration: none; } .oq-support-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; background: var(--site-c-tint); } .oq-support-card__icon svg { fill: var(--site-c-navy); } .oq-support-card__title { margin: 2px 0 0; font-size: 16.5px; font-weight: 800; color: var(--site-c-text); } .oq-support-card__text { margin: 0; font-size: 13.5px; line-height: 1.8; color: var(--site-c-muted); } .oq-support-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 13.5px; font-weight: 700; color: var(--site-c-blue); }   @media (max-width: 991px) { .oq-support__grid { grid-template-columns: minmax(0, 1fr); } .oq-intro__top { grid-template-columns: minmax(0, 1fr); gap: 22px; } .oq-intro--speed .oq-intro__media { order: 0; } .oq-intro__cols { grid-template-columns: minmax(0, 1fr); gap: 26px; } }   @media (max-width: 767px) { .oq-hero .site-hero__content { padding: 42px 0 38px; } .oq-hero .site-hero__title { font-size: 32px; } .oq-hero .site-hero__lead { margin-top: 16px; font-size: 15.5px; line-height: 1.78; } .oq-choice { padding-top: 36px; } .oq-choice__grid, .oq-faq__grid { grid-template-columns: minmax(0, 1fr); } .oq-choice__grid { gap: 20px; } .oq-card__thumb img { height: 168px; } .oq-card__body { gap: 10px; padding: 21px 18px 22px; } .oq-card__text { line-height: 1.75; } .oq-card__more, .oq-faq-col__more { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0; } .oq-intro { padding: 24px 18px; } .oq-intro__colTitle { font-size: 18px; }   .oq-table thead { display: none; } .oq-table tbody tr { display: block; padding: 16px 18px 18px; border-top: 1px solid var(--site-c-line); } .oq-table tbody tr:first-child { border-top: none; } .oq-table tbody th, .oq-table tbody td { display: block; width: auto; padding: 0; border-top: none; } .oq-table tbody th.oq-table__label { background: none; margin-bottom: 8px; font-size: 12px; letter-spacing: 0.08em; color: var(--site-c-blue); } .oq-table tbody td { margin-top: 6px; font-size: 14px; } .oq-table tbody td::before { content: attr(data-label); display: inline-block; margin-right: 8px; font-size: 12.5px; font-weight: 800; color: var(--site-c-muted); } .oq-table tbody td.oq-table__cad { background: none; } .oq-table tbody td.oq-table__cad::before { color: var(--site-c-blue); } } @media (max-width: 575px) { .oq-card__actions .oq-btn, .oq-intro__cta .oq-btn { width: 100%; } }