.pro-tf-expert.shop-redesign-container,
.pro-tf-expert.shop-redesign-container * {
box-sizing: border-box;
font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
}
.pro-tf-expert-page {
position: relative;
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
background: #eaf2fb;
overflow: visible;
}
.pro-tf-expert {
--exp-blue: #11519b;
--exp-blue-soft: #e8f0ff;
--exp-text: #1f1d1d;
--exp-muted: #1f1d1d;
max-width: 1400px;
margin: 0 auto;
padding: 28px 15px 72px;
color: var(--exp-text);
position: relative;
z-index: 1;
}
.exp-breadcrumbs {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin: 0 0 28px;
font-size: 13px;
color: var(--exp-muted);
}
.exp-breadcrumbs a {
color: var(--exp-muted);
text-decoration: none;
}
.exp-breadcrumbs a:hover {
color: var(--exp-blue);
}
.exp-bc-sep {
opacity: 0.55;
}
.exp-bc-current {
color: var(--exp-text);
} .exp-hero {
display: grid;
grid-template-columns: minmax(280px, 400px) minmax(0, 1.1fr) minmax(240px, 340px);
gap: 28px 32px;
align-items: start;
margin: 0 0 20px;
}
.exp-hero-photo {
border-radius: 16px;
overflow: hidden;
background: #eef2f7;
aspect-ratio: 4 / 5;
width: 100%;
}
.exp-hero-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.exp-fio {
margin: 0 0 10px;
font-size: clamp(32px, 4vw, 46px);
font-weight: 800;
line-height: 1.12;
text-transform: none;
color: #08162d !important;
}
.exp-role {
margin: 0 0 14px;
font-size: 16px;
font-weight: 700;
line-height: 1.35;
color: var(--exp-blue);
}
.exp-badge {
display: flex;
align-items: flex-start;
gap: 10px;
margin: 0 0 16px;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
font-size: 14px;
font-weight: 600;
color: var(--exp-text);
}
.exp-badge-ico {
flex: 0 0 22px;
width: 22px;
height: 22px;
color: var(--exp-blue);
margin-top: 1px;
}
.exp-badge-ico svg {
width: 100%;
height: 100%;
display: block;
}
.exp-hero-sep {
display: block !important;
width: 100%;
height: 0 !important;
margin: 0 0 16px !important;
padding: 0 !important;
border: 0 !important;
border-top: 1px solid #d0d5dd !important;
opacity: 1 !important;
background: none !important;
}
.exp-bio {
margin: 0 0 22px;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
font-size: 15px;
line-height: 1.55;
color: #1f1d1d;
}
.exp-hero-main .is-divider,
.exp-hero-main .divider,
.exp-hero-main .ux-divider {
display: none !important;
}
.exp-hero-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.exp-btn {
appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 12px 20px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
letter-spacing: 0.03em;
text-transform: uppercase;
cursor: pointer;
border: 2px solid transparent;
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.exp-btn-ico {
width: 18px;
height: 18px;
display: inline-flex;
}
.exp-btn-ico svg {
width: 100%;
height: 100%;
}
.exp-btn--primary {
background: var(--exp-blue) !important;
color: #fff !important;
border-color: var(--exp-blue) !important;
}
.exp-btn--primary:hover {
background: #0d3f7a !important;
border-color: #0d3f7a !important;
color: #fff !important;
}
.exp-btn--outline {
background: #fff !important;
color: var(--exp-blue) !important;
border-color: #9db7ef !important;
}
.exp-btn--outline:hover {
border-color: var(--exp-blue) !important;
background: var(--exp-blue-soft) !important;
}
.exp-btn--light {
background: #fff !important;
color: var(--exp-blue) !important;
border-color: #fff !important;
}
.exp-btn--light:hover {
background: #f2f6ff !important;
}
.exp-comps {
background: #fff;
border-radius: 16px;
box-shadow: 0 10px 32px rgba(16, 24, 40, 0.1);
padding: 20px 18px;
display: flex;
flex-direction: column;
gap: 18px;
}
.exp-comp {
display: grid;
grid-template-columns: 36px 1fr;
gap: 12px;
align-items: start;
}
.exp-comp-ico {
width: 36px;
height: 36px;
color: var(--exp-blue);
}
.exp-comp-ico svg,
.exp-comp-ico img {
width: 100%;
height: 100%;
object-fit: contain;
display: block;
}
.exp-comp-title {
font-size: 14px;
font-weight: 700;
color: var(--exp-blue);
margin: 0 0 4px;
}
.exp-comp-text {
margin: 0;
font-size: 13px;
line-height: 1.4;
color: #1f1d1d;
} .exp-questions {
margin: 0 0 20px;
background: #fff;
border-radius: 16px;
box-shadow: 0 10px 32px rgba(16, 24, 40, 0.1);
padding: 36px 20px 40px;
}
.exp-questions .exp-section-title {
margin: 0 0 28px;
}
.exp-section-title {
margin: 0 0 28px;
text-align: center;
font-size: clamp(24px, 3vw, 32px);
font-weight: 800;
color: var(--exp-blue) !important;
}
.exp-questions-grid {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 0;
}
.exp-q-item {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 12px;
padding: 8px 14px;
}
.exp-q-item:not(:last-child)::after {
content: '';
position: absolute;
right: 0;
top: 10%;
bottom: 10%;
width: 1px;
background: #dfe5ef;
}
.exp-q-ico {
width: 64px;
height: 64px;
border: 1.5px solid var(--exp-blue);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: var(--exp-blue);
padding: 14px;
}
.exp-q-ico svg,
.exp-q-ico img {
width: 100%;
height: 100%;
object-fit: contain;
}
.exp-q-text {
font-size: 13px;
line-height: 1.35;
font-weight: 600;
color: #1f1d1d;
max-width: 150px;
} .exp-mid {
display: grid;
grid-template-columns: 1.15fr 1fr;
gap: 20px;
margin: 0 0 20px;
align-items: stretch;
}
.exp-experience,
.exp-docs {
background: #fff;
border-radius: 16px;
box-shadow: 0 10px 32px rgba(16, 24, 40, 0.1);
padding: 28px 24px 32px;
}
.exp-block-title {
margin: 0 0 20px;
font-size: clamp(22px, 2.5vw, 28px);
font-weight: 800;
color: var(--exp-blue) !important;
}
.exp-exp-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 14px;
}
.exp-exp-list li {
display: grid;
grid-template-columns: 22px 1fr;
gap: 12px;
align-items: flex-start;
font-size: 14px;
line-height: 1.45;
color: #1f1d1d;
}
.exp-exp-check {
width: 22px;
height: 22px;
color: var(--exp-blue);
margin-top: 1px;
}
.exp-exp-check svg {
width: 100%;
height: 100%;
display: block;
}
.exp-docs-row {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
margin: 0 0 18px;
}
.exp-doc-thumb {
appearance: none;
border: 0;
padding: 0;
background: #f2f4f7;
border-radius: 10px;
overflow: hidden;
cursor: pointer;
aspect-ratio: 4 / 3;
}
.exp-doc-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.exp-docs-all {
width: 100%;
} .exp-why {
position: relative;
margin: 0 0 20px;
padding: 32px 36px 36px;
background: #d9e8f8;
border-radius: 18px;
overflow: hidden;
isolation: isolate;
}
.exp-why-bg {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: min(46%, 480px);
z-index: 0;
pointer-events: none;
background-image: var(--exp-why-bg);
background-repeat: no-repeat;
background-position: center right;
background-size: cover;
-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 42%, #000 100%);
mask-image: linear-gradient(90deg, transparent 0%, #000 42%, #000 100%);
}
.exp-why-inner {
position: relative;
z-index: 1;
max-width: min(100%, 920px);
}
.exp-why-heading {
margin: 0 0 22px;
text-align: left;
font-size: clamp(22px, 2.6vw, 30px);
font-weight: 800;
line-height: 1.2;
color: #11519b !important;
}
.exp-why-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 12px 18px;
align-items: start;
}
.exp-why-item {
text-align: center;
min-width: 0;
}
.exp-why-ico {
width: 52px !important;
height: 52px !important;
max-width: 52px;
max-height: 52px;
margin: 0 auto 10px;
padding: 12px;
box-sizing: border-box;
display: flex !important;
align-items: center;
justify-content: center;
color: #0a3a8f;
background: #fff;
border-radius: 50%;
box-shadow: 0 2px 10px rgba(16, 24, 40, 0.08);
overflow: hidden;
}
.exp-why-ico svg,
.exp-why-ico img {
width: 24px !important;
height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
object-fit: contain;
display: block;
flex: 0 0 auto;
}
.exp-why-title {
margin: 0;
font-size: 13px;
font-weight: 600;
line-height: 1.35;
color: #11519b !important;
}
.exp-why-text {
margin: 6px 0 0;
font-size: 12px;
line-height: 1.35;
color: #1f1d1d;
} .exp-cta {
border-radius: 18px;
background: #11519b;
padding: 28px 32px;
color: #fff;
}
.exp-cta-inner {
display: flex;
align-items: center;
gap: 22px 28px;
}
.exp-cta-ico {
flex: 0 0 56px;
width: 56px;
height: 56px;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.exp-cta-ico svg,
.exp-cta-ico .exp-cta-chat-img {
width: 48px !important;
height: 48px !important;
display: block;
object-fit: contain;
}
.exp-cta-copy {
flex: 1 1 auto;
min-width: 0;
text-align: left;
}
.exp-cta-title {
margin: 0 0 6px;
font-size: clamp(20px, 2.4vw, 28px);
font-weight: 800;
line-height: 1.2;
color: #fff !important;
}
.exp-cta-text {
margin: 0;
max-width: 560px;
font-size: 14px;
line-height: 1.45;
opacity: 0.95;
}
.exp-cta-btn {
flex: 0 0 auto;
white-space: nowrap;
}
.exp-cta .exp-btn--light {
background: #fff !important;
color: #11519b !important;
border-color: #fff !important;
}
.exp-cta .exp-btn--light:hover {
background: #f2f6ff !important;
} .exp-modal[hidden] {
display: none !important;
}
.exp-modal {
position: fixed;
inset: 0;
z-index: 100000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.exp-modal-backdrop {
position: absolute;
inset: 0;
background: rgba(15, 23, 42, 0.55);
backdrop-filter: blur(2px);
}
.exp-modal-dialog {
position: relative;
z-index: 1;
width: min(560px, calc(100vw - 32px));
max-height: min(92vh, 900px);
overflow-x: hidden;
overflow-y: auto;
background: #fff;
border-radius: 18px;
padding: 28px 24px 20px;
box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
box-sizing: border-box;
}
.exp-modal-dialog--wide {
width: min(920px, 100%);
padding: 40px 20px 24px;
background: #0f172a;
}
.exp-modal-close {
appearance: none;
position: absolute;
top: 10px;
right: 10px;
width: 26px;
height: 26px;
border: 0;
border-radius: 50%;
background: #f2f4f7;
font-size: 16px;
line-height: 1;
cursor: pointer;
color: #1f1d1d;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.15s ease, color 0.15s ease;
}
.exp-modal-close:hover {
background: #e4e7ec;
color: #1f1d1d;
}
.exp-modal--lightbox .exp-modal-close {
color: #fff;
background: rgba(255, 255, 255, 0.15);
}
.exp-modal-title {
margin: 0 36px 8px 0;
font-size: clamp(20px, 2.4vw, 24px);
font-weight: 800;
line-height: 1.25;
color: #11519b !important;
}
.exp-modal-body {
margin-top: 16px;
max-width: 100%;
overflow-x: hidden;
} .exp-form-shortcode,
.exp-form-shortcode .wpcf7,
.exp-form-shortcode .wpcf7-form {
margin: 0;
max-width: 100%;
overflow-x: hidden;
}
.exp-form-shortcode .wpcf7-form {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 12px;
width: 100%;
box-sizing: border-box;
}
.exp-form-shortcode .wpcf7-form > p {
margin: 0;
flex: 1 1 100%;
min-width: 0;
max-width: 100%;
box-sizing: border-box;
}
.exp-form-shortcode .wpcf7-form > p:has(input[name="your-name"]),
.exp-form-shortcode .wpcf7-form > p:has(input[name="your-email"]),
.exp-form-shortcode .wpcf7-form > p:has([data-name="your-name"]),
.exp-form-shortcode .wpcf7-form > p:has([data-name="your-email"]) {
flex: 1 1 calc(50% - 6px);
min-width: 0;
}
.exp-form-shortcode .wpcf7-form > p:has(.wpcf7-submit),
.exp-form-shortcode .wpcf7-form > p:has(input[type="submit"]) {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
.exp-form-shortcode .wpcf7-form label {
display: block;
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
}
.exp-form-shortcode .wpcf7-form label .wpcf7-form-control-wrap {
font-size: 14px;
line-height: normal;
color: #1f1d1d;
}
.exp-form-shortcode .wpcf7-form-control-wrap {
position: relative;
display: block;
width: 100%;
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-name"]::before,
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-email"]::before,
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="tel-615"]::before,
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="tel-411"]::before,
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-message"]::before {
content: '';
position: absolute;
left: 16px;
top: 17px;
width: 18px;
height: 18px;
z-index: 2;
pointer-events: none;
background-repeat: no-repeat;
background-position: center;
background-size: 18px 18px;
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-name"]::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='8' r='3.4' stroke='%2398A2B3' stroke-width='1.7'/%3E%3Cpath d='M5 19c1.6-3.6 4.2-5.2 7-5.2s5.4 1.6 7 5.2' stroke='%2398A2B3' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-email"]::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='3' y='6' width='18' height='12' rx='2' stroke='%2398A2B3' stroke-width='1.7'/%3E%3Cpath d='M3 8l9 6 9-6' stroke='%2398A2B3' stroke-width='1.7'/%3E%3C/svg%3E");
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="tel-615"]::before,
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="tel-411"]::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 3.8h2.8l1.4 3.8-2 1.4a12 12 0 005.2 5.2l1.4-2 3.8 1.4V18a2 2 0 01-2 2A15 15 0 015 5.8a2 2 0 012-2z' stroke='%2398A2B3' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-message"]::before {
top: 16px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 6.5A2.5 2.5 0 017.5 4h9A2.5 2.5 0 0119 6.5v6A2.5 2.5 0 0116.5 15H11l-4 3.5V15H7.5A2.5 2.5 0 015 12.5v-6z' stroke='%2398A2B3' stroke-width='1.7'/%3E%3C/svg%3E");
}
.exp-form-shortcode input[type="text"],
.exp-form-shortcode input[type="email"],
.exp-form-shortcode input[type="tel"],
.exp-form-shortcode input[type="url"],
.exp-form-shortcode textarea {
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: 52px !important;
padding: 0 16px 0 48px !important;
border: 1.5px solid #d0d5dd !important;
border-radius: 12px !important;
background: #f9fafb !important;
font-family: 'Montserrat', system-ui, sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
color: #1f1d1d !important;
box-shadow: none !important;
outline: none !important;
box-sizing: border-box !important;
transition: border-color 0.15s ease, background 0.15s ease;
}
.exp-form-shortcode textarea {
height: auto !important;
min-height: 110px !important;
padding: 14px 16px 14px 48px !important;
resize: vertical;
}
.exp-form-shortcode input:focus,
.exp-form-shortcode textarea:focus {
border-color: #11519b !important;
background: #fff !important;
}
.exp-form-shortcode input::placeholder,
.exp-form-shortcode textarea::placeholder {
color: #98a2b3 !important;
opacity: 1;
}
.exp-form-shortcode .wpcf7-acceptance {
margin: 0;
}
.exp-form-shortcode .wpcf7-acceptance .wpcf7-list-item {
margin: 0;
}
.exp-form-shortcode .wpcf7-acceptance label,
.exp-form-shortcode .wpcf7-list-item label {
display: flex !important;
align-items: flex-start;
gap: 10px;
font-size: 13px !important;
line-height: 1.4 !important;
font-weight: 500 !important;
color: #1f1d1d !important;
}
.exp-form-shortcode .wpcf7-acceptance input[type="checkbox"] {
flex: 0 0 18px;
width: 18px !important;
height: 18px !important;
margin-top: 1px;
accent-color: #11519b;
}
.exp-form-shortcode .wpcf7-acceptance a,
.exp-form-shortcode .wpcf7-list-item-label a {
color: #11519b !important;
text-decoration: underline;
}
.exp-form-shortcode .wpcf7-submit,
.exp-form-shortcode input[type="submit"] {
width: 100% !important;
max-width: 100% !important;
height: 52px !important;
margin: 4px 0 0 !important;
padding: 0 20px !important;
border: 0 !important;
border-radius: 12px !important;
background: #11519b !important;
color: #fff !important;
font-family: 'Montserrat', system-ui, sans-serif !important;
font-size: 14px !important;
font-weight: 700 !important;
letter-spacing: 0.03em;
text-transform: uppercase;
cursor: pointer;
box-sizing: border-box !important;
transition: background 0.15s ease;
}
.exp-form-shortcode .wpcf7-submit:hover,
.exp-form-shortcode input[type="submit"]:hover {
background: #0d3f7a !important;
}
.exp-form-shortcode .wpcf7-spinner {
margin-left: 10px;
}
.exp-form-shortcode .wpcf7-response-output {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
font-size: 13px;
height: 0;
overflow: hidden;
}
.exp-form-shortcode .wpcf7-response-output:not(:empty) {
height: auto;
margin: 8px 0 0 !important;
padding: 10px 12px !important;
border-radius: 10px !important;
}
.exp-form-shortcode .wpcf7 form.invalid .wpcf7-response-output,
.exp-form-shortcode .wpcf7 form.unaccepted .wpcf7-response-output,
.exp-form-shortcode .wpcf7 form.sent .wpcf7-response-output,
.exp-form-shortcode .wpcf7 form.failed .wpcf7-response-output {
height: auto;
margin: 8px 0 0 !important;
padding: 10px 12px !important;
border-radius: 10px !important;
overflow: visible;
}
.exp-form-shortcode .wpcf7-not-valid-tip {
font-size: 12px;
margin-top: 4px;
}
.exp-form-shortcode .smart-captcha,
.exp-form-shortcode .cfyc-captcha-container {
margin: 0 !important;
padding: 0 !important;
min-height: 0 !important;
height: 0 !important;
overflow: hidden !important;
line-height: 0 !important;
}
.exp-form-shortcode .akismet-fields-container,
.exp-form-shortcode .screen-reader-response {
position: absolute !important;
left: -9999px !important;
height: 0 !important;
width: 0 !important;
overflow: hidden !important;
margin: 0 !important;
padding: 0 !important;
}
.exp-form-shortcode br {
display: none;
}
.exp-lightbox-stage {
display: grid;
grid-template-columns: 40px 1fr 40px;
align-items: center;
gap: 8px;
}
.exp-lightbox-img {
max-width: 100%;
max-height: 75vh;
margin: 0 auto;
display: block;
object-fit: contain;
border-radius: 8px;
background: #fff;
}
.exp-lightbox-nav {
appearance: none;
border: 0;
background: transparent;
color: #fff;
font-size: 36px;
cursor: pointer;
line-height: 1;
padding: 8px;
}
body.exp-modal-open {
overflow: hidden;
}
@media (max-width: 560px) {
.exp-modal {
align-items: flex-start;
padding: 12px 12px 120px;
}
.exp-modal-dialog {
padding: 22px 16px 16px;
max-height: calc(100dvh - 132px);
margin-top: 4px;
}
.exp-modal-title {
font-size: 18px;
margin-bottom: 4px;
}
.exp-modal-body {
margin-top: 10px;
}
.exp-form-shortcode .wpcf7-form {
gap: 10px;
}
.exp-form-shortcode textarea {
min-height: 64px !important;
max-height: 88px !important;
padding-top: 12px !important;
padding-bottom: 12px !important;
resize: none;
}
.exp-form-shortcode .wpcf7-form-control-wrap[data-name="your-message"]::before {
top: 12px;
}
.exp-form-shortcode .wpcf7-form > p:has(input[name="your-name"]),
.exp-form-shortcode .wpcf7-form > p:has(input[name="your-email"]),
.exp-form-shortcode .wpcf7-form > p:has([data-name="your-name"]),
.exp-form-shortcode .wpcf7-form > p:has([data-name="your-email"]) {
flex: 1 1 100%;
} body.exp-modal-open .b24-widget-button-wrapper,
body.exp-modal-open .bx-livechat-wrapper,
body.exp-modal-open #jivo_container,
body.exp-modal-open jdiv,
body.exp-modal-open .carrotquest-css-reset,
body.exp-modal-open [class*="chat-widget"],
body.exp-modal-open iframe[src*="jivo"],
body.exp-modal-open iframe[src*="bitrix"] {
visibility: hidden !important;
pointer-events: none !important;
}
} .pro-tf-expert-template .page-title,
.pro-tf-expert-template .page-header {
display: none !important;
}
body.pro-tf-expert-template,
body.pro-tf-expert-template #main,
body.pro-tf-expert-template #content,
body.pro-tf-expert-template .page-wrapper {
background: #eaf2fb !important;
}
@media (max-width: 1100px) {
.exp-hero {
grid-template-columns: minmax(260px, 340px) 1fr;
}
.exp-comps {
grid-column: 1 / -1;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.exp-questions-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
row-gap: 24px;
}
.exp-q-item:nth-child(3n)::after {
display: none;
}
.exp-why-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.exp-why-bg {
width: min(40%, 320px);
opacity: 0.85;
}
}
@media (max-width: 760px) {
.pro-tf-expert {
padding: 18px 15px 48px;
}
.exp-hero {
grid-template-columns: 1fr;
gap: 20px;
}
.exp-hero-photo {
max-width: 400px;
margin: 0 auto;
}
.exp-comps {
grid-template-columns: 1fr;
}
.exp-questions {
padding: 28px 12px 32px;
}
.exp-questions-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
row-gap: 22px;
}
.exp-q-item:nth-child(3n)::after {
display: block;
}
.exp-q-item:nth-child(2n)::after {
display: none;
}
.exp-mid {
grid-template-columns: 1fr;
gap: 20px;
}
.exp-why {
padding: 28px 18px 30px;
}
.exp-why-bg {
display: none;
}
.exp-why-grid {
grid-template-columns: 1fr 1fr;
}
.exp-cta {
padding: 22px 18px;
}
.exp-cta-inner {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
.exp-cta-btn {
width: 100%;
}
}