:root {
    --primary: #635BFF;
    --primary-hover: #534BE8;
    --secondary: #0A2540;
    --accent: #00D4B6;
    --accent-subtle: #E8FAF8;
    --background-main: #F8FAFD;
    --background-surface: #FFFFFF;
    --background-subtle: #F1F5F9;
    --background-card: #FFFFFF;
    --background-badge: #EEF2F6;
    --text-primary-light-bg: #0A2540;
    --text-secondary-light-bg: #425466;
    --text-muted-light-bg: #687C94;
    --border-subtle: #E6EBF1;
    --border-card: #EDF2F7;
    --border-focus: #635BFF;
    --font-family-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-family-mono: 'JetBrains Mono', monospace;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family-primary);
    background-color: var(--background-main);
    color: var(--text-primary-light-bg);
    margin: 0;
    padding: 0;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

.text-muted {
    color: #687C94 !important;
}

.font-mono {
    font-family: var(--font-family-mono);
}

.transition-theme {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== header ===== */
.site-header-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif
}

.site-header-block a {
    text-decoration: none
}

.site-header-block .js-mobile-nav-panel:not(.hidden) {
    display: block
}

/* ===== hero ===== */
.hero-section .hero-grid-pattern {
    background-image: radial-gradient(#635BFF 0.75px, transparent 0.75px);
    background-size: 20px 20px;
    opacity: 0.08;
}

.hero-section .hero-mockup-panel {
    box-shadow: 0 20px 40px -10px rgba(50, 50, 93, 0.08), 0 10px 20px -5px rgba(0, 0, 0, 0.04);
}

.hero-section .js-route-step.active {
    border-color: #635BFF;
    background-color: #F8FAFD;
}

.hero-section .js-route-step.active span:first-child {
    color: #635BFF;
}

/* ===== tools_platforms_and_technologies ===== */
#tools-technologies-section {
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

#tools-technologies-section .js-tool-filter-btn {
    cursor: pointer;
    user-select: none;
}

#tools-technologies-section .js-tool-filter-btn.active-filter {
    background-color: #635BFF;
    color: #FFFFFF;
    border-color: #635BFF;
}

#tools-technologies-section .js-tool-card {
    will-change: transform, opacity;
}

/* ===== geography_of_work_and_remote_interaction ===== */
.geography-section {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.geography-section .geography-tab-btn {
    background-color: #FFFFFF;
    color: #425466;
    border: 1px solid #E6EBF1;
}

.geography-section .geography-tab-btn:hover {
    background-color: #F1F5F9;
    color: #0A2540;
}

.geography-section .geography-tab-btn.active {
    background-color: #635BFF;
    color: #FFFFFF;
    border-color: #635BFF;
    box-shadow: 0 4px 12px rgba(99, 91, 255, 0.25);
}

.geography-section .geography-region-panel {
    display: none;
}

.geography-section .geography-region-panel.active {
    display: block;
}

.geography-section .geography-card {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.geography-section .geography-card:hover {
    border-color: #635BFF;
    box-shadow: 0 6px 16px rgba(50, 50, 93, 0.06), 0 2px 4px rgba(0, 0, 0, 0.04);
}

/* ===== what_we_need_from_you ===== */
.qr-requirements .qr-card {
    box-shadow: 0 2px 4px rgba(50, 50, 93, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}

.qr-requirements .qr-card:hover {
    border-color: #635BFF;
    box-shadow: 0 6px 16px rgba(50, 50, 93, 0.06), 0 2px 4px rgba(0, 0, 0, 0.04);
}

.qr-requirements .qr-readiness-panel {
    box-shadow: 0 6px 16px rgba(50, 50, 93, 0.06), 0 2px 4px rgba(0, 0, 0, 0.04);
}

/* ===== featured_case_the_answer_was_easy_the_right_question_took_longer ===== */
.featured-case-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.featured-case-block .js-case-panel.hidden {
    display: none;
}

.featured-case-block .js-case-panel.active {
    display: block;
}

.featured-case-block .js-case-step-btn.is-active {
    border-color: #635BFF;
    background-color: #F1F5F9;
}

.featured-case-block .js-case-step-btn.is-active h3 {
    color: #635BFF;
}

.featured-case-block .js-case-step-btn.is-active span:first-child {
    color: #635BFF;
}

.featured-case-block .js-case-step-btn.is-active i {
    color: #635BFF;
}

/* ===== research_guides ===== */
.guide-grid-block {
    -webkit-font-smoothing: antialiased;
}

.guide-grid-block .guide-card {
    will-change: transform, box-shadow;
}

.guide-grid-block .guide-card:hover {
    border-color: #CBD5E1;
}

.guide-grid-block .guide-card img {
    backface-visibility: hidden;
}

/* ===== practical_research_cases ===== */
.cases-grid-section {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.cases-grid-section .js-case-card {
    will-change: transform, box-shadow;
}

.cases-grid-section .js-case-filter.active {
    background-color: #635BFF;
    color: #FFFFFF;
    border-color: #635BFF;
}

.cases-grid-section .is-hidden {
    display: none !important;
}

/* ===== footer ===== */
.qr-footer {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.qr-footer a {
    transition: color 0.2s ease;
}

.qr-footer button:focus-visible {
    outline: 2px solid #635BFF;
    outline-offset: 2px;
    border-radius: 4px;
}

.site-header-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.site-header-block a {
    text-decoration: none;
}

.site-header-block .js-mobile-nav-panel:not(.hidden) {
    display: block;
}

.qr-footer {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.qr-footer a {
    transition: color 0.2s ease;
}

.qr-footer button:focus-visible {
    outline: 2px solid #635BFF;
    outline-offset: 2px;
    border-radius: 4px;
}

.tools-collection-block .js-tool-card {
    will-change: transform;
}


/* ===== PAGE: brand-support ===== */
.brand-support-section {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.brand-support-section input::placeholder,
.brand-support-section textarea::placeholder {
  color: #687C94;
  opacity: 1;
}

.brand-support-section .js-route-tab.active {
  background-color: #635BFF;
  color: #FFFFFF;
  border-color: #635BFF;
}

/* ===== PAGE: contact ===== */
.contact-form-block .contact-input::placeholder,
.contact-form-block .contact-textarea::placeholder {
  color: #687C94;
  opacity: 1;
}
.contact-form-block .contact-input,
.contact-form-block .contact-select,
.contact-form-block .contact-textarea {
  color: #0A2540;
  background-color: #F8FAFD;
}
.contact-form-block .contact-input:focus,
.contact-form-block .contact-select:focus,
.contact-form-block .contact-textarea:focus {
  border-color: #635BFF;
  background-color: #FFFFFF;
}

/* ===== PAGE: privacy ===== */
.privacy-policy-section .js-nav-item.active {
  background-color: #EEF2F6;
  color: #635BFF;
  font-weight: 700;
  border-left: 3px solid #635BFF;
}
.privacy-policy-section ::placeholder {
  color: #687C94;
  opacity: 1;
}

/* ===== PAGE: terms ===== */
.terms-content-section a { transition: color 0.2s ease, background-color 0.2s ease; }
.terms-content-section .terms-nav-link.is-active { background-color: #EEF2F6; color: #635BFF; font-weight: 600; }
.terms-content-section .terms-block { scroll-margin-top: 6rem; }

/* ===== PAGE: disclaimer ===== */
.disclaimer-content-block { font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; } .disclaimer-content-block a { transition: color 0.15s ease-in-out; }

.main-comment-card {
    background-color: #FFFFFF;
    border: 1px solid #E6EBF1;
    box-shadow: 0 6px 16px rgba(50, 50, 93, 0.06), 0 2px 4px rgba(0, 0, 0, 0.04);
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.main-comment-card .comment-avatar {
    width: 44px;
    height: 44px;
    min-width: 44px;
    max-width: 44px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.main-comment-card .comment-content {
    color: #425466;
}

.main-comment-card .comment-content p {
    color: #425466;
}

.main-comment-card code {
    font-family: 'JetBrains Mono', monospace;
}

.main-comment-card .comment-metric-btn {
    transition: all 0.15s ease-in-out;
}

.main-comment-card .comment-metric-btn:hover {
    border-color: #635BFF;
    background-color: #FFFFFF;
}

.reply-comment-wrapper {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.reply-comment-card {
    background-color: #F8FAFD;
    border: 1px solid #E6EBF1;
}

.reply-comment-card:hover {
    background-color: #FFFFFF;
}

.reply-comment-card .reply-avatar {
    width: 34px;
    height: 34px;
    min-width: 34px;
    max-width: 34px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.reply-comment-card .reply-content {
    color: #425466;
}

.reply-comment-card .reply-content p {
    color: #425466;
}

.reply-thread-curve {
    pointer-events: none;
}


/* ===== PAGE TEMPLATE: guide ===== */
.site-header-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.site-header-block a {
    text-decoration: none;
}

.site-header-block .js-mobile-nav-panel:not(.hidden) {
    display: block;
}

.detail-template-wrapper {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.detail-template-wrapper .detail-input-field::placeholder {
    color: #687C94;
    opacity: 0.9;
}

.detail-template-wrapper .comment-avatar {
    width: 44px;
    height: 44px;
    object-fit: cover;
}

.detail-template-wrapper .reply-avatar {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.qr-footer {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.qr-footer a {
    transition: color 0.2s ease;
}

.qr-footer button:focus-visible {
    outline: 2px solid #635BFF;
    outline-offset: 2px;
    border-radius: 4px;
}

/* ===== PAGE TEMPLATE: practical-cases ===== */
.site-header-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.site-header-block a {
    text-decoration: none;
}

.site-header-block .js-mobile-nav-panel:not(.hidden) {
    display: block;
}

.detail-template-wrapper {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.detail-template-wrapper .detail-input-field::placeholder {
    color: #687C94;
    opacity: 0.9;
}

.detail-template-wrapper .comment-avatar {
    width: 44px;
    height: 44px;
    object-fit: cover;
}

.detail-template-wrapper .reply-avatar {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.qr-footer {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.qr-footer a {
    transition: color 0.2s ease;
}

.qr-footer button:focus-visible {
    outline: 2px solid #635BFF;
    outline-offset: 2px;
    border-radius: 4px;
}

/* ===== PAGE TEMPLATE: tools ===== */
.site-header-block {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.site-header-block a {
    text-decoration: none;
}

.site-header-block .js-mobile-nav-panel:not(.hidden) {
    display: block;
}

.detail-template-wrapper {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.detail-template-wrapper .detail-input-field::placeholder {
    color: #687C94;
    opacity: 0.9;
}

.detail-template-wrapper .comment-avatar {
    width: 44px;
    height: 44px;
    object-fit: cover;
}

.detail-template-wrapper .reply-avatar {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.qr-footer {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.qr-footer a {
    transition: color 0.2s ease;
}

.qr-footer button:focus-visible {
    outline: 2px solid #635BFF;
    outline-offset: 2px;
    border-radius: 4px;
}