:root {
--ap-red: #cc0000;
--ap-black: #111111;
--ap-ink: #222222;
--ap-muted: #666666;
--ap-soft: #cccccc;
--ap-gray: #888888;
--ap-bg: #ffffff;
--ap-bg-muted: #f8f8f8;
--ap-footer: #0a0a0a;
--ap-star: #f5a623;
--ap-font: "Inter", system-ui, -apple-system, sans-serif;
--ap-max: 1440px;
--ap-pad: 80px;
--ap-radius: 4px;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
font-family: var(--ap-font);
color: var(--ap-black);
background: var(--ap-bg);
-webkit-font-smoothing: antialiased;
}
img {
max-width: 100%;
height: auto;
display: block;
}
a {
color: inherit;
text-decoration: none;
}
ul {
margin: 0;
padding: 0;
list-style: none;
} .ap-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 10px 20px;
border-radius: var(--ap-radius);
font-family: inherit;
font-size: 13px;
font-weight: 700;
letter-spacing: 0.5px;
border: 1px solid transparent;
cursor: pointer;
white-space: nowrap;
transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.ap-btn--primary {
background: var(--ap-red);
color: #fff;
}
.ap-btn--primary:hover {
background: #b00000;
}
.ap-btn--ghost {
background: #222;
color: #fff;
border-color: #444;
}
.ap-btn--ghost:hover {
background: #2c2c2c;
}
.ap-btn--lg {
padding: 14px 28px;
font-size: 14px;
} .ap-logo {
display: inline-flex;
align-items: center;
gap: 8px;
flex-shrink: 0;
}
.ap-logo__mark {
width: 60px;
height: 60px;
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--ap-red);
color: #fff;
border-radius: var(--ap-radius);
font-size: 22px;
font-weight: 900;
line-height: 1;
}
.ap-logo__mark--sm {
width: 44px;
height: 44px;
font-size: 16px;
}
.ap-logo__text {
display: flex;
flex-direction: column;
gap: 2px;
}
.ap-logo__name {
font-size: 16px;
font-weight: 800;
color: var(--ap-black);
line-height: 1.1;
}
.ap-logo__name--light {
color: #fff;
font-size: 14px;
}
.ap-logo__tag {
font-size: 9px;
font-weight: 600;
letter-spacing: 1px;
color: var(--ap-red);
} .ap-topbar {
background: var(--ap-red);
color: #fff;
font-size: 11px;
font-weight: 500;
}
.ap-topbar__inner {
max-width: var(--ap-max);
margin: 0 auto;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 16px 32px;
padding: 6px 40px;
}
.ap-topbar__left,
.ap-topbar__right {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 32px;
white-space: nowrap;
}
.ap-topbar a {
color: #fff;
}
.ap-maple {
display: inline-block;
width: 1em;
height: 1.075em;
vertical-align: -0.2em;
color: #ff0000;
flex-shrink: 0;
}
.ap-topbar__canadian .ap-maple {
width: 14px;
height: 15px;
margin-left: 3px;
color: #fff;
}
.ap-topbar__menu {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 16px 24px;
}
.ap-topbar__menu a {
color: #fff;
font-size: 11px;
font-weight: 500;
}
.ap-topbar__menu a:hover {
text-decoration: underline;
} .ap-header {
position: sticky;
top: 0;
z-index: 100;
background: #fff;
box-shadow: 0 2px 8px #00000020;
}
.ap-header__inner {
position: relative;
max-width: var(--ap-max);
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
padding: 12px 40px;
}
.ap-nav {
align-self: stretch;
display: flex;
align-items: stretch;
}
.ap-nav__list {
display: flex;
align-items: stretch;
gap: 28px;
}
.ap-nav__list > li {
position: relative;
display: flex;
align-items: center;
}
.ap-nav__list > li > a {
display: flex;
align-items: center;
align-self: stretch;
}
.ap-nav__list a,
.ap-nav__link {
font-size: 13px;
font-weight: 600;
letter-spacing: 0.5px;
color: var(--ap-ink);
text-transform: uppercase;
}
.ap-nav__list a:hover,
.ap-nav__link:hover {
color: var(--ap-red);
}
.ap-nav__list .sub-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
min-width: 220px;
padding: 8px 0;
margin: 0;
background: #fff;
box-shadow: 0 8px 24px #00000020;
border-radius: var(--ap-radius);
z-index: 120;
} .ap-nav__list > li > .sub-menu::before {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 100%;
height: 20px;
}
.ap-nav__list > li:hover > .sub-menu,
.ap-nav__list > li:focus-within > .sub-menu,
.ap-nav__list > li.is-open > .sub-menu {
display: block;
}
.ap-nav__list .sub-menu li {
display: block;
}
.ap-nav__list .sub-menu a {
display: block;
padding: 10px 16px;
font-size: 12px;
letter-spacing: 0.3px;
white-space: nowrap;
}
.ap-nav__list .sub-menu a:hover {
background: #f8f8f8;
}
.ap-nav__list > .menu-item-has-children > a {
padding-right: 14px;
}
.ap-nav__list > .menu-item-has-children > a::after {
content: "";
display: inline-block;
width: 0;
height: 0;
margin-left: 6px;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 5px solid #999;
vertical-align: middle;
} .ap-nav__list > .ap-mega {
position: static;
}
.ap-nav__list > .ap-mega > .sub-menu {
top: 100%;
left: 50%;
right: auto;
transform: translateX(-50%);
width: min(920px, calc(100vw - 48px));
max-width: 920px;
padding: 20px 16px 12px;
display: none;
flex-wrap: wrap;
gap: 4px 0;
border-top: 3px solid var(--ap-red);
border-radius: 0 0 8px 8px;
} .ap-nav__list > .ap-mega > .sub-menu::before {
height: 36px;
}
.ap-nav__list > .ap-mega:hover > .sub-menu,
.ap-nav__list > .ap-mega:focus-within > .sub-menu,
.ap-nav__list > .ap-mega.is-open > .sub-menu {
display: flex;
}
.ap-nav__list > .ap-mega > .sub-menu > li {
width: 12.5%;
min-width: 90px;
padding: 0 8px 12px;
box-sizing: border-box;
}
.ap-nav__list > .ap-mega > .sub-menu > .ap-mega__letter > a,
.ap-nav__list > .ap-mega > .sub-menu > li > a.ap-letter-link {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
margin: 0 auto 6px;
padding: 0;
border-radius: 50%;
background: #f4f4f4;
color: var(--ap-black);
font-size: 15px;
font-weight: 800;
letter-spacing: 0;
text-transform: uppercase;
transition: background 0.15s ease, color 0.15s ease;
}
.ap-nav__list > .ap-mega > .sub-menu > .ap-mega__letter > a:hover,
.ap-nav__list > .ap-mega > .sub-menu > li > a.ap-letter-link:hover {
background: var(--ap-red);
color: #fff;
}
.ap-nav__list > .ap-mega > .sub-menu > li > .sub-menu {
position: static;
display: block;
min-width: 0;
padding: 0;
margin: 0;
box-shadow: none;
background: transparent;
border-radius: 0;
transform: none;
}
.ap-nav__list > .ap-mega > .sub-menu > li > .sub-menu a {
padding: 3px 4px;
font-size: 11px;
font-weight: 500;
letter-spacing: 0;
text-transform: none;
text-align: center;
white-space: normal;
color: #555;
line-height: 1.3;
}
.ap-nav__list > .ap-mega > .sub-menu > li > .sub-menu a:hover {
background: transparent;
color: var(--ap-red);
}
.ap-nav-toggle {
display: none;
width: 40px;
height: 40px;
border: 0;
background: transparent;
padding: 8px;
flex-direction: column;
justify-content: center;
gap: 5px;
cursor: pointer;
}
.ap-nav-toggle span {
display: block;
height: 2px;
width: 100%;
background: var(--ap-black);
} .ap-hero {
position: relative;
min-height: clamp(640px, 88vh, 820px);
display: flex;
align-items: stretch;
background: #0b0b0b;
overflow: hidden;
color: #fff;
}
.ap-hero__glow {
position: absolute;
inset: auto auto -20% -10%;
width: 55%;
height: 70%;
background: radial-gradient(circle, rgba(204, 0, 0, 0.28) 0%, transparent 68%);
pointer-events: none;
z-index: 1;
}
.ap-hero__slides {
position: absolute;
inset: 0;
z-index: 0;
}
.ap-hero__slide {
position: absolute;
inset: 0;
opacity: 0;
transition: opacity 0.7s ease;
}
.ap-hero__slide.is-active {
opacity: 1;
z-index: 1;
}
.ap-hero__media {
position: absolute;
inset: 0;
background-image: var(--ap-hero-image);
background-size: cover;
background-position: center;
transform: scale(1.04);
transition: transform 6s ease;
}
.ap-hero__slide.is-active .ap-hero__media {
transform: scale(1);
}
.ap-hero__media::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(105deg, rgba(8, 8, 8, 0.92) 0%, rgba(8, 8, 8, 0.78) 42%, rgba(8, 8, 8, 0.35) 70%, rgba(8, 8, 8, 0.55) 100%),
linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.55) 100%);
}
.ap-hero__shell {
position: relative;
z-index: 2;
width: 100%;
max-width: var(--ap-max);
margin: 0 auto;
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(300px, 420px);
gap: 40px;
align-items: center;
padding: 72px var(--ap-pad) 88px;
}
.ap-hero__copy {
display: flex;
flex-direction: column;
gap: 28px;
max-width: 680px;
animation: ap-hero-in 0.7s ease both;
}
.ap-hero__copy-panel {
position: relative;
min-height: 220px;
}
.ap-hero__panel {
display: none;
flex-direction: column;
gap: 18px;
}
.ap-hero__panel.is-active {
display: flex;
animation: ap-hero-in 0.55s ease both;
}
.ap-hero__category {
display: inline-flex;
align-items: center;
gap: 10px;
align-self: flex-start;
padding: 8px 14px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 999px;
background: rgba(255, 255, 255, 0.06);
backdrop-filter: blur(10px);
color: #f2f2f2;
font-size: 11px;
font-weight: 700;
letter-spacing: 1.2px;
text-transform: uppercase;
}
.ap-hero__pulse {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ap-red);
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.55);
animation: ap-pulse 1.8s infinite;
}
.ap-hero__title,
.ap-hero__title--acf,
.ap-hero__title--acf h1,
.ap-hero__title--acf h2,
.ap-hero__title--acf p {
margin: 0;
font-size: clamp(34px, 5vw, 58px);
font-weight: 900;
letter-spacing: -0.5px;
line-height: 1.05;
color: #fff;
text-wrap: balance;
}
.ap-hero__title--acf em,
.ap-hero__title-accent {
font-style: normal;
color: var(--ap-red);
}
.ap-hero__lead,
.ap-hero__text {
margin: 0;
max-width: 520px;
font-size: 17px;
line-height: 1.55;
color: rgba(255, 255, 255, 0.72);
}
.ap-hero__text p {
margin: 0 0 10px;
color: rgba(255, 255, 255, 0.72);
}
.ap-hero__text a.btn,
.ap-hero__text .btn,
.ap-hero__text a.ap-btn {
display: none;
}
.ap-hero__stats {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
}
.ap-hero__stat {
display: flex;
flex-direction: column;
gap: 4px;
padding: 14px 14px 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 14px;
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(8px);
}
.ap-hero__stat strong {
font-size: 20px;
font-weight: 800;
letter-spacing: -0.3px;
color: #fff;
}
.ap-hero__stat span {
font-size: 11px;
line-height: 1.3;
font-weight: 600;
color: rgba(255, 255, 255, 0.55);
text-transform: uppercase;
letter-spacing: 0.4px;
}
.ap-hero__actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.ap-btn--glow {
box-shadow: 0 10px 30px rgba(204, 0, 0, 0.35);
}
.ap-btn--glass {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.18);
color: #fff;
backdrop-filter: blur(8px);
}
.ap-btn--glass:hover {
background: rgba(255, 255, 255, 0.14);
border-color: rgba(255, 255, 255, 0.3);
}
.ap-btn__icon {
margin-right: 2px;
}
.ap-hero__aside {
animation: ap-hero-in 0.75s ease 0.1s both;
}
.ap-hero__form-wrap {
width: 100%;
}
.ap-hero__controls {
position: absolute;
left: 50%;
bottom: 22px;
z-index: 4;
display: flex;
align-items: center;
gap: 12px;
transform: translateX(-50%);
padding: 8px 12px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 999px;
background: rgba(0, 0, 0, 0.35);
backdrop-filter: blur(10px);
}
.ap-hero__nav {
width: 36px;
height: 36px;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
color: #fff;
font-size: 22px;
line-height: 1;
cursor: pointer;
transition: background 0.15s ease;
}
.ap-hero__nav:hover {
background: var(--ap-red);
}
.ap-hero__dots {
display: flex;
gap: 8px;
}
.ap-hero__dot {
width: 8px;
height: 8px;
padding: 0;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, 0.35);
cursor: pointer;
transition: width 0.2s ease, background 0.2s ease;
}
.ap-hero__dot.is-active {
width: 22px;
border-radius: 999px;
background: var(--ap-red);
}
@keyframes ap-hero-in {
from {
opacity: 0;
transform: translateY(18px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes ap-pulse {
0% {
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.55);
}
70% {
box-shadow: 0 0 0 10px rgba(204, 0, 0, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0);
}
}
@media (prefers-reduced-motion: reduce) {
.ap-hero__copy,
.ap-hero__aside,
.ap-hero__panel.is-active,
.ap-hero__media,
.ap-hero__pulse {
animation: none !important;
transition: none !important;
}
} .ap-hero-form.contact-form-block {
background: rgba(18, 18, 18, 0.72);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 20px;
padding: 28px 24px 24px;
color: #fff;
text-align: center;
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(18px);
}
.ap-hero-form__title {
margin: 0 0 8px;
font-size: 22px;
font-weight: 800;
letter-spacing: 1px;
text-transform: uppercase;
}
.ap-hero-form__info {
margin: 0 0 20px;
font-size: 13px;
line-height: 1.4;
color: #aaa;
}
.ap-hero-form .wpcf7,
.ap-hero-form .wpcf7-form {
margin: 0;
}
.ap-hero-form .wpcf7-form > p {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
margin: 0;
float: none;
width: 100%;
text-align: left;
}
.ap-hero-form .wpcf7-form > p > br {
display: none;
}
.ap-hero-form .wpcf7-form-control-wrap {
position: relative;
display: block;
width: 100%;
margin: 0;
}
.ap-hero-form .wpcf7-form-control-wrap[data-name="your-name-form"],
.ap-hero-form .wpcf7-form-control-wrap[data-name="tel-num-259"] {
flex: 0 0 auto;
}
.ap-hero-form .wpcf7-text,
.ap-hero-form .wpcf7-tel,
.ap-hero-form .wpcf7-email,
.ap-hero-form .wpcf7-select,
.ap-hero-form .wpcf7-textarea,
.ap-hero-form input[type="text"],
.ap-hero-form input[type="tel"],
.ap-hero-form input[type="email"],
.ap-hero-form select,
.ap-hero-form textarea {
display: block;
width: 100% !important;
max-width: 100%;
margin: 0 !important;
padding: 14px 15px;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 12px;
background: rgba(255, 255, 255, 0.96);
color: #111;
font-family: inherit;
font-size: 14px;
line-height: 1.35;
box-sizing: border-box;
outline: none;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ap-hero-form .wpcf7-text:focus,
.ap-hero-form .wpcf7-tel:focus,
.ap-hero-form .wpcf7-textarea:focus,
.ap-hero-form input:focus,
.ap-hero-form textarea:focus {
border-color: var(--ap-red);
box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.18);
}
.ap-hero-form .wpcf7-text::placeholder,
.ap-hero-form .wpcf7-tel::placeholder,
.ap-hero-form .wpcf7-textarea::placeholder,
.ap-hero-form input::placeholder,
.ap-hero-form textarea::placeholder {
color: #888;
opacity: 1;
}
.ap-hero-form .wpcf7-textarea,
.ap-hero-form textarea {
min-height: 96px;
height: 96px;
resize: vertical;
}
.ap-hero-form .wpcf7-submit,
.ap-hero-form input[type="submit"] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
float: none;
margin: 4px 0 0;
padding: 14px 20px;
border: 0;
border-radius: 12px;
background: var(--ap-red);
color: #fff;
font-family: inherit;
font-size: 14px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
cursor: pointer;
transition: background 0.2s ease, box-shadow 0.2s ease;
box-shadow: 0 10px 24px rgba(204, 0, 0, 0.3);
}
.ap-hero-form .wpcf7-submit:hover,
.ap-hero-form input[type="submit"]:hover {
background: #b00000;
}
.ap-hero-form .wpcf7-spinner {
margin: 8px auto 0;
}
.ap-hero-form .wpcf7-not-valid-tip {
display: block;
margin-top: 4px;
font-size: 11px;
color: #ff6b6b;
text-align: left;
}
.ap-hero-form .wpcf7-not-valid {
border-color: #ff6b6b !important;
}
.ap-hero-form .wpcf7-response-output {
margin: 12px 0 0;
padding: 10px 12px;
border-radius: var(--ap-radius);
border-width: 1px;
font-size: 12px;
text-align: left;
line-height: 1.4;
}
.ap-hero-form .wpcf7 form.sent .wpcf7-response-output {
border-color: #2e7d32;
background: rgba(46, 125, 50, 0.15);
color: #a5d6a7;
}
.ap-hero-form .wpcf7 form.invalid .wpcf7-response-output,
.ap-hero-form .wpcf7 form.failed .wpcf7-response-output {
border-color: #c62828;
background: rgba(198, 40, 40, 0.15);
color: #ef9a9a;
}  .ap-trust {
position: relative;
z-index: 3;
margin-top: -36px;
padding: 0 var(--ap-pad) 8px;
background: transparent;
}
.ap-trust__inner {
max-width: calc(var(--ap-max) - 80px);
margin: 0 auto;
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 14px;
padding: 14px;
border: 1px solid #ececec;
border-radius: 22px;
background: rgba(255, 255, 255, 0.92);
box-shadow: 0 22px 50px rgba(17, 17, 17, 0.1);
backdrop-filter: blur(14px);
}
.ap-trust__item {
display: flex;
align-items: center;
gap: 12px;
min-width: 0;
padding: 14px 12px;
border-radius: 16px;
background: #fafafa;
border: 1px solid transparent;
transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.ap-trust__item:hover {
transform: translateY(-3px);
border-color: rgba(204, 0, 0, 0.2);
background: #fff;
box-shadow: 0 12px 28px rgba(17, 17, 17, 0.08);
}
.ap-trust__icon {
flex-shrink: 0;
width: 44px;
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 14px;
background: linear-gradient(145deg, #111 0%, #2a2a2a 100%);
color: #fff;
}
.ap-trust__icon--stars {
background: linear-gradient(145deg, #cc0000 0%, #8f0000 100%);
color: #ffd56a;
}
.ap-trust__icon--maple {
font-size: 20px;
background: linear-gradient(145deg, #cc0000 0%, #a00000 100%);
color: #fff;
}
.ap-trust__icon--maple .ap-maple {
width: 20px;
height: 22px;
color: #fff;
}
.ap-trust__text {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.ap-trust__text strong {
font-size: 13px;
font-weight: 800;
letter-spacing: 0.1px;
color: var(--ap-black);
line-height: 1.25;
}
.ap-trust__text span {
font-size: 11px;
line-height: 1.3;
font-weight: 500;
color: #888;
} .ap-section {
padding: 50px var(--ap-pad);
background: #fff;
}
.ap-section--muted {
background: var(--ap-bg-muted);
}
.ap-section__head {
display: flex;
flex-direction: column;
align-items: center;
gap: 32px;
margin-bottom: 32px;
}
.ap-section__head h2 {
margin: 0;
font-size: 28px;
font-weight: 800;
letter-spacing: 2px;
text-align: center;
color: var(--ap-black);
}
.ap-section__rule {
width: 60px;
height: 4px;
background: var(--ap-red);
border-radius: 2px;
}
.ap-section__cta {
display: flex;
justify-content: center;
margin-top: 32px;
} .ap-services-section {
position: relative;
padding: 88px var(--ap-pad) 80px;
background:
radial-gradient(ellipse 50% 45% at 100% 0%, rgba(204, 0, 0, 0.06), transparent 55%),
radial-gradient(ellipse 40% 40% at 0% 100%, rgba(17, 17, 17, 0.04), transparent 50%),
#f7f7f7;
overflow: hidden;
}
.ap-services-section__inner {
max-width: var(--ap-max);
margin: 0 auto;
}
.ap-services-section__intro {
max-width: 640px;
margin: 0 0 40px;
}
.ap-services-section__eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
margin-bottom: 14px;
font-size: 12px;
font-weight: 700;
letter-spacing: 1.2px;
text-transform: uppercase;
color: var(--ap-muted);
}
.ap-services-section__dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ap-red);
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.45);
animation: ap-pulse 1.8s ease-out infinite;
}
.ap-services-section__title {
margin: 0 0 14px;
font-size: clamp(30px, 4vw, 46px);
font-weight: 900;
letter-spacing: -0.8px;
line-height: 1.05;
color: var(--ap-black);
}
.ap-services-section__title em {
font-style: normal;
color: var(--ap-red);
}
.ap-services-section__lead {
margin: 0;
max-width: 520px;
font-size: 16px;
line-height: 1.65;
color: #666;
}
.ap-services {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 16px;
}
.ap-service {
--ap-service-delay: 0ms;
position: relative;
display: flex;
flex-direction: column;
min-height: 320px;
border-radius: 22px;
overflow: hidden;
color: #fff;
background: #111;
isolation: isolate;
transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
animation: ap-service-in 0.55s ease both;
animation-delay: var(--ap-service-delay);
}
.ap-service:hover {
transform: translateY(-6px);
box-shadow: 0 28px 50px rgba(17, 17, 17, 0.18);
}
.ap-service__media {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
transform: scale(1.02);
transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.ap-service:hover .ap-service__media {
transform: scale(1.08);
}
.ap-service__shade {
position: absolute;
inset: 0;
background:
linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.25) 35%, rgba(0, 0, 0, 0.88) 100%);
transition: background 0.35s ease;
}
.ap-service:hover .ap-service__shade {
background:
linear-gradient(180deg, rgba(204, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.35) 40%, rgba(0, 0, 0, 0.92) 100%);
}
.ap-service__index {
position: absolute;
top: 16px;
left: 16px;
z-index: 2;
font-size: 12px;
font-weight: 800;
letter-spacing: 1px;
color: rgba(255, 255, 255, 0.7);
}
.ap-service__body {
position: relative;
z-index: 2;
margin-top: auto;
display: flex;
flex-direction: column;
gap: 8px;
padding: 22px 20px 20px;
}
.ap-service h3 {
margin: 0;
font-size: 17px;
line-height: 1.25;
font-weight: 800;
letter-spacing: -0.2px;
color: #fff;
text-wrap: balance;
}
.ap-service p {
margin: 0;
font-size: 13px;
line-height: 1.5;
color: rgba(255, 255, 255, 0.72);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.ap-service__more {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 6px;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.4px;
text-transform: uppercase;
color: #fff;
opacity: 0.85;
transform: translateX(0);
transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
}
.ap-service:hover .ap-service__more {
opacity: 1;
color: #ffb3b3;
transform: translateX(4px);
}
.ap-services-section__cta {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 14px;
margin-top: 40px;
}
.ap-services-section__cta .ap-btn--ghost {
background: #fff;
color: var(--ap-black);
border-color: #ddd;
}
.ap-services-section__cta .ap-btn--ghost:hover {
border-color: #bbb;
background: #f3f3f3;
}
@keyframes ap-service-in {
from {
opacity: 0;
transform: translateY(18px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .ap-about {
position: relative;
padding: 90px var(--ap-pad);
background:
radial-gradient(ellipse 55% 60% at 85% 20%, rgba(204, 0, 0, 0.16), transparent 60%),
linear-gradient(145deg, #0b0b0b 0%, #161616 45%, #101010 100%);
color: #fff;
overflow: hidden;
}
.ap-about__glow {
position: absolute;
left: -12%;
bottom: -30%;
width: 48%;
height: 70%;
background: radial-gradient(circle, rgba(204, 0, 0, 0.22) 0%, transparent 68%);
pointer-events: none;
}
.ap-about__inner {
position: relative;
z-index: 1;
max-width: calc(var(--ap-max) - 120px);
margin: 0 auto;
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
gap: 56px;
align-items: center;
}
.ap-about__visual {
position: relative;
}
.ap-about__frame {
position: relative;
border-radius: 28px;
overflow: hidden;
box-shadow:
0 30px 80px rgba(0, 0, 0, 0.45),
0 0 0 1px rgba(255, 255, 255, 0.08);
aspect-ratio: 5 / 4;
background: #222;
}
.ap-about__frame::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, 0.45) 100%);
pointer-events: none;
}
.ap-about__media {
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
transform: scale(1.02);
transition: transform 0.6s ease;
}
.ap-about:hover .ap-about__media {
transform: scale(1.06);
}
.ap-about__float {
position: absolute;
left: 20px;
bottom: 20px;
z-index: 2;
display: flex;
align-items: center;
gap: 14px;
padding: 16px 18px;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 18px;
background: rgba(12, 12, 12, 0.72);
backdrop-filter: blur(14px);
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}
.ap-about__float-num {
font-size: 34px;
font-weight: 900;
letter-spacing: -1px;
line-height: 1;
color: #fff;
}
.ap-about__float-label {
font-size: 12px;
font-weight: 600;
line-height: 1.35;
color: rgba(255, 255, 255, 0.7);
text-transform: uppercase;
letter-spacing: 0.4px;
}
.ap-about__badge {
position: absolute;
top: 20px;
right: 20px;
z-index: 2;
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 14px;
border-radius: 999px;
background: var(--ap-red);
color: #fff;
box-shadow: 0 12px 28px rgba(204, 0, 0, 0.4);
font-size: 13px;
}
.ap-about__badge strong {
font-weight: 800;
letter-spacing: 0.3px;
}
.ap-about__maple .ap-maple,
.ap-about__badge .ap-maple {
width: 16px;
height: 17px;
color: #fff;
}
.ap-about__content {
display: flex;
flex-direction: column;
gap: 22px;
}
.ap-about__eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
align-self: flex-start;
padding: 8px 14px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 999px;
background: rgba(255, 255, 255, 0.05);
font-size: 11px;
font-weight: 700;
letter-spacing: 1.4px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.85);
}
.ap-about__dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ap-red);
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.5);
animation: ap-pulse 1.8s infinite;
}
.ap-about__title {
margin: 0;
display: flex;
flex-direction: column;
gap: 4px;
font-size: clamp(32px, 4.2vw, 52px);
font-weight: 900;
letter-spacing: -0.8px;
line-height: 1.05;
color: #fff;
}
.ap-about__title em {
font-style: normal;
color: var(--ap-red);
}
.ap-about__lead {
margin: 0;
max-width: 520px;
font-size: 16px;
line-height: 1.65;
color: rgba(255, 255, 255, 0.68);
}
.ap-about__checks {
display: grid;
grid-template-columns: 1fr;
gap: 12px;
}
.ap-about__card {
display: flex;
align-items: flex-start;
gap: 14px;
padding: 16px 16px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
background: rgba(255, 255, 255, 0.04);
backdrop-filter: blur(8px);
transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.ap-about__card:hover {
border-color: rgba(204, 0, 0, 0.45);
background: rgba(204, 0, 0, 0.1);
transform: translateX(4px);
}
.ap-about__icon {
flex-shrink: 0;
width: 36px;
height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(204, 0, 0, 0.18);
color: #fff;
font-size: 14px;
font-weight: 800;
}
.ap-about__card strong {
display: block;
margin-bottom: 2px;
font-size: 15px;
font-weight: 800;
color: #fff;
}
.ap-about__card span {
font-size: 13px;
line-height: 1.4;
color: rgba(255, 255, 255, 0.55);
}
.ap-about__actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 6px;
}
.ap-about__actions .ap-btn--ghost {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.18);
} .ap-projects {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 20px;
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
}
.ap-project {
display: flex;
flex-direction: column;
gap: 8px;
}
.ap-project__img {
position: relative;
width: 100%;
height: 160px;
border-radius: 6px;
overflow: hidden;
background-size: cover;
background-position: center;
}
.ap-project__dot {
position: absolute;
left: 50%;
top: 50%;
width: 44px;
height: 44px;
margin: -22px 0 0 -22px;
border-radius: 50%;
background: #ffffff99;
}
.ap-project h3 {
margin: 0;
font-size: 13px;
font-weight: 700;
color: var(--ap-black);
}
.ap-project p {
margin: 0;
font-size: 12px;
color: var(--ap-gray);
} .ap-industries-section {
position: relative;
padding: 88px var(--ap-pad) 80px;
background:
radial-gradient(ellipse 55% 50% at 0% 0%, rgba(204, 0, 0, 0.1), transparent 55%),
radial-gradient(ellipse 40% 45% at 100% 100%, rgba(17, 17, 17, 0.05), transparent 50%),
linear-gradient(180deg, #111 0%, #181818 100%);
color: #fff;
overflow: hidden;
}
.ap-industries-section__inner {
max-width: var(--ap-max);
margin: 0 auto;
}
.ap-industries-section__intro {
max-width: 620px;
margin: 0 0 40px;
}
.ap-industries-section__eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
margin-bottom: 14px;
font-size: 12px;
font-weight: 700;
letter-spacing: 1.2px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.55);
}
.ap-industries-section__dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ap-red);
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.45);
animation: ap-pulse 1.8s ease-out infinite;
}
.ap-industries-section__title {
margin: 0 0 14px;
font-size: clamp(30px, 4vw, 46px);
font-weight: 900;
letter-spacing: -0.8px;
line-height: 1.05;
color: #fff;
}
.ap-industries-section__title em {
font-style: normal;
color: var(--ap-red);
}
.ap-industries-section__lead {
margin: 0;
max-width: 520px;
font-size: 16px;
line-height: 1.65;
color: rgba(255, 255, 255, 0.65);
}
.ap-industries {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 14px;
}
.ap-industry {
--ap-industry-delay: 0ms;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
min-height: 180px;
padding: 22px 20px;
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.08);
background: linear-gradient(160deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
text-align: left;
transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
animation: ap-industry-in 0.5s ease both;
animation-delay: var(--ap-industry-delay);
}
.ap-industry:hover {
transform: translateY(-5px);
border-color: rgba(204, 0, 0, 0.45);
background: linear-gradient(160deg, rgba(204, 0, 0, 0.18), rgba(255, 255, 255, 0.04));
box-shadow: 0 22px 40px rgba(0, 0, 0, 0.28);
}
.ap-industry__icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
border-radius: 14px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.08);
color: #fff;
transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.ap-industry:hover .ap-industry__icon {
background: var(--ap-red);
border-color: var(--ap-red);
color: #fff;
}
.ap-industry__label {
font-size: 15px;
line-height: 1.25;
font-weight: 800;
letter-spacing: -0.2px;
color: #fff;
text-wrap: balance;
}
.ap-industry__text {
margin-top: auto;
font-size: 12px;
line-height: 1.45;
font-weight: 500;
color: rgba(255, 255, 255, 0.55);
}
@keyframes ap-industry-in {
from {
opacity: 0;
transform: translateY(14px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .ap-locations {
position: relative;
padding: 70px var(--ap-pad);
background:
radial-gradient(ellipse 80% 60% at 10% 20%, rgba(204, 0, 0, 0.14), transparent 55%),
radial-gradient(ellipse 70% 50% at 90% 80%, rgba(204, 0, 0, 0.08), transparent 50%),
linear-gradient(180deg, #111 0%, #1a1a1a 100%);
color: #fff;
overflow: hidden;
}
.ap-locations::before {
content: "";
position: absolute;
inset: 0;
background-image:
linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
background-size: 48px 48px;
mask-image: radial-gradient(ellipse 70% 70% at 50% 40%, #000 20%, transparent 75%);
pointer-events: none;
}
.ap-locations__inner {
position: relative;
z-index: 1;
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
}
.ap-locations .ap-section__head h2 {
color: #fff;
}
.ap-locations__lead {
margin: 0;
max-width: 520px;
text-align: center;
font-size: 15px;
line-height: 1.5;
color: #aaa;
}
.ap-locations .ap-section__head {
margin-bottom: 36px;
}
.ap-locations__search {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 16px 24px;
margin-bottom: 28px;
}
.ap-locations__search-label {
position: relative;
flex: 1 1 320px;
max-width: 480px;
display: block;
}
.ap-locations__search-icon {
position: absolute;
left: 16px;
top: 50%;
transform: translateY(-50%);
color: #888;
display: flex;
pointer-events: none;
}
.ap-locations__input {
width: 100%;
padding: 16px 18px 16px 46px;
border: 1px solid #333;
border-radius: 8px;
background: rgba(255, 255, 255, 0.04);
color: #fff;
font-family: inherit;
font-size: 15px;
outline: none;
transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.ap-locations__input::placeholder {
color: #777;
}
.ap-locations__input:focus {
border-color: var(--ap-red);
background: rgba(255, 255, 255, 0.07);
box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.2);
}
.ap-locations__meta {
display: flex;
align-items: baseline;
gap: 8px;
font-size: 13px;
color: #888;
white-space: nowrap;
}
.ap-locations__count {
font-size: 28px;
font-weight: 800;
color: var(--ap-red);
line-height: 1;
}
.ap-locations__alphabet {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin: 0 0 24px;
justify-content: center;
}
.ap-locations__letter {
min-width: 34px;
height: 34px;
padding: 0 8px;
border: 1px solid #333;
border-radius: 6px;
background: rgba(255, 255, 255, 0.04);
color: #ccc;
font-family: inherit;
font-size: 12px;
font-weight: 700;
cursor: pointer;
transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.ap-locations__letter:hover:not(:disabled) {
border-color: var(--ap-red);
color: #fff;
}
.ap-locations__letter.is-active {
background: var(--ap-red);
border-color: var(--ap-red);
color: #fff;
}
.ap-locations__letter.is-disabled,
.ap-locations__letter:disabled {
opacity: 0.28;
cursor: not-allowed;
}
.ap-locations__grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
}
.ap-location-card {
display: flex;
align-items: center;
gap: 12px;
padding: 16px 14px;
border: 1px solid #2a2a2a;
border-radius: 8px;
background: rgba(255, 255, 255, 0.03);
color: #fff;
transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease;
}
.ap-location-card:hover {
border-color: var(--ap-red);
background: rgba(204, 0, 0, 0.12);
transform: translateY(-2px);
}
.ap-location-card.is-hidden {
display: none;
}
.ap-location-card__pin {
flex-shrink: 0;
width: 36px;
height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(204, 0, 0, 0.15);
color: var(--ap-red);
}
.ap-location-card__body {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
flex: 1;
}
.ap-location-card__name {
font-size: 14px;
font-weight: 700;
letter-spacing: 0.2px;
}
.ap-location-card__region {
font-size: 11px;
color: #888;
}
.ap-location-card__arrow {
color: #555;
font-size: 16px;
transition: color 0.2s ease, transform 0.2s ease;
}
.ap-location-card:hover .ap-location-card__arrow {
color: var(--ap-red);
transform: translateX(3px);
}
.ap-locations__empty {
margin: 28px 0 0;
text-align: center;
font-size: 14px;
color: #999;
} .ap-reviews-section {
position: relative;
padding: 72px var(--ap-pad);
background:
radial-gradient(ellipse 60% 50% at 0% 0%, rgba(204, 0, 0, 0.06), transparent 55%),
radial-gradient(ellipse 50% 40% at 100% 100%, rgba(17, 17, 17, 0.04), transparent 50%),
linear-gradient(180deg, #f3f3f3 0%, #fafafa 45%, #fff 100%);
overflow: hidden;
}
.ap-reviews-section__inner {
position: relative;
z-index: 1;
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
}
.ap-reviews-section__intro .ap-section__head {
margin-bottom: 12px;
}
.ap-reviews-section__lead {
margin: 0 auto 36px;
max-width: 540px;
text-align: center;
font-size: 15px;
line-height: 1.55;
color: #666;
}
.ap-reviews-score {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 20px 32px;
margin: 0 0 36px;
padding: 22px 28px;
border: 1px solid #e8e8e8;
border-radius: 16px;
background: #fff;
box-shadow: 0 10px 40px rgba(17, 17, 17, 0.06);
}
.ap-reviews-score__rating {
display: flex;
align-items: center;
gap: 18px;
}
.ap-reviews-score__value {
font-size: 56px;
font-weight: 900;
letter-spacing: -2px;
line-height: 1;
color: var(--ap-black);
}
.ap-reviews-score__meta {
display: flex;
flex-direction: column;
gap: 4px;
}
.ap-reviews-score__meta strong {
font-size: 16px;
font-weight: 800;
color: var(--ap-black);
}
.ap-reviews-score__meta > span {
font-size: 12px;
color: #888;
}
.ap-reviews-score__stars,
.ap-review__stars {
display: flex;
gap: 3px;
}
.ap-reviews-score__stars span,
.ap-review__stars span {
width: 16px;
height: 16px;
background: var(--ap-star);
clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.ap-review__stars span {
width: 14px;
height: 14px;
}
.ap-reviews-score__badges {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.ap-reviews-score__badge {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
border: 1px solid #ececec;
border-radius: 999px;
background: #fafafa;
color: #333;
font-size: 12px;
font-weight: 600;
}
.ap-reviews {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 18px;
}
.ap-review {
--ap-review-delay: 0ms;
position: relative;
margin: 0;
display: flex;
flex-direction: column;
gap: 18px;
min-height: 100%;
padding: 26px 24px 22px;
border: 1px solid #ececec;
border-radius: 16px;
background: #fff;
box-shadow: 0 4px 18px rgba(17, 17, 17, 0.04);
transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
animation: ap-review-in 0.55s ease both;
animation-delay: var(--ap-review-delay);
}
.ap-review:hover {
transform: translateY(-4px);
border-color: rgba(204, 0, 0, 0.25);
box-shadow: 0 18px 40px rgba(17, 17, 17, 0.1);
}
.ap-review__top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.ap-review__source {
padding: 4px 8px;
border-radius: 999px;
background: #f1f3f4;
color: #555;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.4px;
text-transform: uppercase;
}
.ap-review__quote {
position: relative;
z-index: 1;
margin: 0;
flex: 1;
font-size: 15px;
line-height: 1.55;
color: #333;
}
.ap-review__author {
display: flex;
align-items: center;
gap: 12px;
padding-top: 16px;
border-top: 1px solid #f0f0f0;
}
.ap-review__avatar {
flex-shrink: 0;
width: 44px;
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: linear-gradient(145deg, #111 0%, #333 100%);
color: #fff;
font-size: 13px;
font-weight: 800;
letter-spacing: 0.5px;
}
.ap-review:nth-child(2) .ap-review__avatar {
background: linear-gradient(145deg, #cc0000 0%, #8f0000 100%);
}
.ap-review:nth-child(3) .ap-review__avatar {
background: linear-gradient(145deg, #1f1f1f 0%, #4a4a4a 100%);
}
.ap-review:nth-child(4) .ap-review__avatar {
background: linear-gradient(145deg, #222 0%, #cc0000 140%);
}
.ap-review__person {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.ap-review__person strong {
font-size: 14px;
font-weight: 800;
color: var(--ap-black);
}
.ap-review__person span {
font-size: 12px;
color: #888;
}
@keyframes ap-review-in {
from {
opacity: 0;
transform: translateY(16px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media (prefers-reduced-motion: reduce) {
.ap-review {
animation: none;
}
.ap-review:hover {
transform: none;
}
} .ap-faq {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
}
.ap-faq__item {
border-bottom: 1px solid #eee;
}
.ap-faq__question {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
padding: 16px 0;
border: 0;
background: transparent;
text-align: left;
cursor: pointer;
font-family: inherit;
}
.ap-faq__question > span:first-child {
font-size: 14px;
font-weight: 600;
color: var(--ap-black);
}
.ap-faq__icon {
font-size: 20px;
font-weight: 300;
color: var(--ap-red);
line-height: 1;
flex-shrink: 0;
}
.ap-faq__answer {
display: none;
padding: 0 28px 16px 0;
}
.ap-faq__item.is-open .ap-faq__answer {
display: block;
}
.ap-faq__item.is-open .ap-faq__icon {
transform: rotate(45deg);
}
.ap-faq__answer p {
margin: 0;
font-size: 13px;
line-height: 20px;
color: var(--ap-muted);
} .ap-cta {
position: relative;
overflow: hidden;
padding: 88px var(--ap-pad) 72px;
background:
radial-gradient(ellipse 55% 80% at 0% 100%, rgba(204, 0, 0, 0.28), transparent 55%),
radial-gradient(ellipse 40% 60% at 100% 0%, rgba(204, 0, 0, 0.16), transparent 50%),
linear-gradient(160deg, #0a0a0a 0%, #141414 45%, #0d0d0d 100%);
color: #fff;
}
.ap-cta__glow {
position: absolute;
inset: auto -10% -40% auto;
width: 55%;
height: 70%;
background: radial-gradient(circle, rgba(204, 0, 0, 0.22), transparent 68%);
pointer-events: none;
}
.ap-cta__inner {
position: relative;
z-index: 1;
max-width: var(--ap-max);
margin: 0 auto;
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
gap: 48px 64px;
align-items: center;
}
.ap-cta__eyebrow {
display: inline-flex;
align-items: center;
gap: 10px;
margin-bottom: 18px;
font-size: 12px;
font-weight: 700;
letter-spacing: 1.2px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.72);
}
.ap-cta__pulse {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--ap-red);
box-shadow: 0 0 0 0 rgba(204, 0, 0, 0.55);
animation: ap-pulse 1.8s ease-out infinite;
}
.ap-cta__title {
margin: 0 0 18px;
display: flex;
flex-direction: column;
gap: 4px;
font-size: clamp(32px, 4.5vw, 52px);
font-weight: 900;
letter-spacing: -0.8px;
line-height: 1.05;
color: #fff;
text-wrap: balance;
}
.ap-cta__title em {
font-style: normal;
color: var(--ap-red);
}
.ap-cta__text {
margin: 0 0 28px;
max-width: 520px;
font-size: 16px;
line-height: 1.65;
color: rgba(255, 255, 255, 0.68);
}
.ap-cta__phones {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
max-width: 480px;
margin-bottom: 28px;
}
.ap-cta__phone {
display: flex;
flex-direction: column;
gap: 4px;
padding: 16px 18px;
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.04);
color: #fff;
transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.ap-cta__phone:hover {
border-color: rgba(204, 0, 0, 0.55);
background: rgba(204, 0, 0, 0.12);
transform: translateY(-2px);
}
.ap-cta__phone-label {
font-size: 11px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.45);
}
.ap-cta__phone strong {
font-size: 20px;
font-weight: 800;
letter-spacing: -0.3px;
}
.ap-cta__meta {
display: flex;
flex-wrap: wrap;
gap: 10px 18px;
margin: 0;
padding: 0;
list-style: none;
}
.ap-cta__meta li {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 13px;
font-weight: 600;
color: rgba(255, 255, 255, 0.62);
}
.ap-cta__meta-icon {
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--ap-red);
}
.ap-cta__meta-icon--maple .ap-maple {
width: 14px;
height: 15px;
color: #ff0000;
}
.ap-cta__aside {
min-width: 0;
}
.ap-cta__form-wrap {
padding: 8px;
border-radius: 28px;
background:
linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.03));
border: 1px solid rgba(255, 255, 255, 0.12);
box-shadow: 0 28px 60px rgba(0, 0, 0, 0.35);
backdrop-filter: blur(16px);
}
.ap-cta__form-wrap .contact-form-block.home,
.ap-cta__form-wrap .ap-hero-form {
margin: 0;
border-radius: 22px;
background: rgba(12, 12, 12, 0.72);
border: 1px solid rgba(255, 255, 255, 0.08);
}
.ap-cta__fallback {
display: flex;
flex-direction: column;
gap: 14px;
padding: 28px 24px;
border-radius: 22px;
background: rgba(12, 12, 12, 0.72);
}
.ap-cta__fallback p {
margin: 0 0 4px;
font-size: 18px;
font-weight: 800;
color: #fff;
}
.ap-cta .ap-btn--lg {
padding: 16px 28px;
font-size: 14px;
letter-spacing: 0.6px;
}
.ap-cta .ap-btn--ghost {
background: transparent;
border-color: rgba(255, 255, 255, 0.22);
}
.ap-cta .ap-btn--ghost:hover {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.4);
} .ap-footer {
background:
linear-gradient(180deg, #070707 0%, #0a0a0a 100%);
color: #8a8a8a;
padding: 64px var(--ap-pad) 28px;
border-top: 1px solid rgba(255, 255, 255, 0.04);
}
.ap-footer__inner {
display: grid;
grid-template-columns: minmax(240px, 1.2fr) repeat(3, minmax(0, 1fr));
gap: 40px 48px;
max-width: var(--ap-max);
margin: 0 auto;
}
.ap-footer__brand p {
margin: 16px 0 0;
max-width: 280px;
font-size: 14px;
line-height: 1.6;
color: #8f8f8f;
}
.ap-footer__badges {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 20px;
}
.ap-footer__badge {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 7px 11px;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.03);
font-size: 11px;
font-weight: 700;
letter-spacing: 0.2px;
color: rgba(255, 255, 255, 0.7);
}
.ap-footer__badge .ap-maple {
width: 12px;
height: 13px;
color: #ff0000;
}
.ap-footer__col h3 {
margin: 0 0 10px;
font-size: 12px;
font-weight: 800;
letter-spacing: 1.4px;
text-transform: uppercase;
color: #fff;
}
.ap-footer__rule {
display: block;
width: 28px;
height: 2px;
background: var(--ap-red);
margin-bottom: 18px;
}
.ap-footer__links {
display: flex;
flex-direction: column;
gap: 11px;
margin: 0;
padding: 0;
list-style: none;
}
.ap-footer__links a,
.ap-footer__links span {
font-size: 14px;
color: #8a8a8a;
transition: color 0.15s ease, padding-left 0.15s ease;
}
.ap-footer__links a:hover {
color: #fff;
padding-left: 4px;
}
.ap-footer__contact {
display: flex;
flex-direction: column;
gap: 14px;
margin: 0;
padding: 0;
list-style: none;
}
.ap-footer__contact a,
.ap-footer__contact li {
display: flex;
flex-direction: column;
gap: 2px;
}
.ap-footer__contact-label {
font-size: 11px;
font-weight: 700;
letter-spacing: 0.8px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.35);
}
.ap-footer__contact-value {
font-size: 14px;
font-weight: 600;
color: #cfcfcf;
word-break: break-word;
}
.ap-footer__contact a:hover .ap-footer__contact-value {
color: #fff;
}
.ap-footer__bottom {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
flex-wrap: wrap;
max-width: var(--ap-max);
margin: 40px auto 0;
padding-top: 22px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
font-size: 12px;
color: #555;
}
.ap-footer__bottom-left,
.ap-footer__bottom-right {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px 18px;
}
.ap-footer__bottom-menu {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px 16px;
}
.ap-footer__bottom a {
color: #666;
transition: color 0.15s ease;
}
.ap-footer__bottom a:hover {
color: #ddd;
} .ap-blog {
background: #f6f6f6;
}
.ap-blog__hero {
padding: 64px var(--ap-pad) 48px;
background:
radial-gradient(ellipse 70% 80% at 100% 0%, rgba(204, 0, 0, 0.18), transparent 55%),
linear-gradient(135deg, #111 0%, #1c1c1c 100%);
color: #fff;
}
.ap-blog__hero--single {
padding-bottom: 56px;
}
.ap-blog__hero-inner {
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
}
.ap-blog__eyebrow {
margin: 0 0 12px;
font-size: 11px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
color: var(--ap-red);
}
.ap-blog__heading {
margin: 0 0 12px;
max-width: 720px;
font-size: clamp(28px, 4vw, 44px);
font-weight: 900;
letter-spacing: 0.5px;
line-height: 1.15;
color: #fff;
}
.ap-blog__lead {
margin: 0;
max-width: 560px;
font-size: 16px;
line-height: 1.55;
color: #aaa;
}
.ap-blog__inner {
max-width: calc(var(--ap-max) - 160px);
margin: 0 auto;
padding: 40px var(--ap-pad) 72px;
}
.ap-blog__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}
.ap-blog__empty {
margin: 40px 0;
text-align: center;
color: #666;
}
.ap-card {
display: flex;
flex-direction: column;
overflow: hidden;
border: 1px solid #e8e8e8;
border-radius: 16px;
background: #fff;
box-shadow: 0 6px 24px rgba(17, 17, 17, 0.04);
transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.ap-card:hover {
transform: translateY(-4px);
border-color: rgba(204, 0, 0, 0.22);
box-shadow: 0 18px 40px rgba(17, 17, 17, 0.1);
}
.ap-card__media {
display: block;
position: relative;
aspect-ratio: 3 / 2;
overflow: hidden;
background: #222;
}
.ap-card__img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.35s ease;
}
.ap-card:hover .ap-card__img {
transform: scale(1.04);
}
.ap-card__placeholder {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background:
linear-gradient(135deg, #1a1a1a 0%, #333 55%, #111 100%);
color: #fff;
font-size: 28px;
font-weight: 900;
}
.ap-card__placeholder span {
display: inline-flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
border-radius: 8px;
background: var(--ap-red);
}
.ap-card__body {
display: flex;
flex-direction: column;
gap: 12px;
flex: 1;
padding: 22px 22px 20px;
}
.ap-card__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px 14px;
}
.ap-card__cat {
display: inline-flex;
align-items: center;
padding: 5px 10px;
border-radius: 999px;
background: rgba(204, 0, 0, 0.08);
color: var(--ap-red);
font-size: 11px;
font-weight: 700;
letter-spacing: 0.4px;
text-transform: uppercase;
}
.ap-card__cat:hover {
background: rgba(204, 0, 0, 0.14);
}
.ap-card__date {
font-size: 12px;
color: #888;
}
.ap-card__title {
margin: 0;
font-size: 18px;
font-weight: 800;
line-height: 1.3;
letter-spacing: 0.2px;
}
.ap-card__title a {
color: var(--ap-black);
}
.ap-card__title a:hover {
color: var(--ap-red);
}
.ap-card__excerpt {
margin: 0;
flex: 1;
font-size: 14px;
line-height: 1.55;
color: #666;
}
.ap-card__excerpt p {
margin: 0;
}
.ap-card__more {
display: inline-flex;
align-items: center;
gap: 8px;
margin-top: 4px;
font-size: 13px;
font-weight: 700;
letter-spacing: 0.3px;
color: var(--ap-red);
}
.ap-card__more span {
transition: transform 0.2s ease;
}
.ap-card:hover .ap-card__more span {
transform: translateX(3px);
}
.navigation.pagination,
.ap-pagination,
nav.navigation {
margin-top: 40px;
}
.navigation .nav-links {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
}
.navigation .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 0 12px;
border: 1px solid #e0e0e0;
border-radius: 8px;
background: #fff;
color: #333;
font-size: 13px;
font-weight: 600;
text-decoration: none;
transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.navigation .page-numbers:hover,
.navigation .page-numbers.current {
border-color: var(--ap-red);
background: var(--ap-red);
color: #fff;
}
.navigation .page-numbers.dots {
border-color: transparent;
background: transparent;
color: #888;
} .ap-single__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin-top: 16px;
font-size: 13px;
color: #999;
}
.ap-blog__hero--single .ap-card__cat {
margin-bottom: 14px;
}
.ap-single__inner {
max-width: calc(var(--ap-max) - 160px);
margin: -40px auto 0;
padding: 0 var(--ap-pad) 72px;
position: relative;
z-index: 1;
}
.ap-single__thumb {
margin: 0 0 28px;
overflow: hidden;
border-radius: 16px;
box-shadow: 0 16px 40px rgba(17, 17, 17, 0.12);
background: #fff;
}
.ap-single__img {
display: block;
width: 100%;
height: auto;
}
.ap-single__content {
padding: 36px 40px;
border: 1px solid #ececec;
border-radius: 16px;
background: #fff;
box-shadow: 0 8px 30px rgba(17, 17, 17, 0.05);
}
.ap-single__content h2,
.ap-single__content h3 {
margin: 1.4em 0 0.6em;
font-weight: 800;
color: var(--ap-black);
}
.ap-single__content ul,
.ap-single__content ol {
margin: 0 0 1em 1.2em;
padding: 0;
}
.ap-single__content li {
margin-bottom: 0.35em;
}
.ap-single__content img {
border-radius: 8px;
}
.ap-single__footer {
margin-top: 28px;
}
.ap-single__footer .ap-btn--ghost {
background: #111;
border-color: #333;
} .ap-page {
background: #f5f5f5;
} .ap-landing-content.ap-page {
position: relative;
z-index: 1;
padding: 48px 0 8px;
background:
radial-gradient(ellipse 80% 60% at 50% 0%, rgba(204, 0, 0, 0.04), transparent 60%),
#fff;
}
.ap-landing-content .ap-page__shell {
margin-top: 0;
padding-bottom: 48px;
}
.ap-landing-content:not(.ap-page--builder) .ap-page__shell {
max-width: 960px;
}
.ap-landing-content--builder .ap-page__shell {
max-width: calc(var(--ap-max) - 80px);
}
.ap-landing-content .ap-page__article {
border-radius: 28px;
}
.ap-landing-page .ap-hero {
min-height: min(78vh, 720px);
}
.ap-page-hero {
padding: 56px var(--ap-pad) 48px;
background:
radial-gradient(ellipse 70% 90% at 100% 0%, rgba(204, 0, 0, 0.2), transparent 55%),
linear-gradient(135deg, #0d0d0d 0%, #1a1a1a 100%);
color: #fff;
}
.ap-page-hero__inner {
max-width: calc(var(--ap-max) - 120px);
margin: 0 auto;
}
.ap-page-hero__crumbs {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin: 0 0 16px;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.3px;
color: rgba(255, 255, 255, 0.55);
}
.ap-page-hero__crumbs a {
color: rgba(255, 255, 255, 0.75);
}
.ap-page-hero__crumbs a:hover {
color: #fff;
}
.ap-page-hero__title {
margin: 0;
max-width: 760px;
font-size: clamp(32px, 5vw, 52px);
font-weight: 900;
letter-spacing: -0.6px;
line-height: 1.1;
color: #fff;
}
.ap-page-hero__lead {
margin: 14px 0 0;
max-width: 560px;
font-size: 16px;
line-height: 1.55;
color: rgba(255, 255, 255, 0.65);
}
.ap-page__shell {
max-width: calc(var(--ap-max) - 120px);
margin: -28px auto 0;
padding: 0 var(--ap-pad) 80px;
position: relative;
z-index: 1;
}
.ap-page:not(.ap-page--builder) .ap-page__shell {
max-width: var(--ap-max);
}
.ap-page__article {
border: 1px solid #ececec;
border-radius: 24px;
background: #fff;
box-shadow: 0 18px 50px rgba(17, 17, 17, 0.06);
overflow: hidden;
}
.ap-page--builder {
overflow-x: clip;
}
.ap-page__content {
padding: 36px 40px 44px;
font-size: 16px;
line-height: 1.75;
color: #333;
}
.ap-page__content > *:first-child {
margin-top: 0;
}
.ap-page__content h2,
.ap-page__content .textwidget h2,
.ap-page__content .widget-title {
margin: 0 0 16px;
font-size: clamp(22px, 3vw, 30px);
font-weight: 900;
letter-spacing: -0.4px;
line-height: 1.2;
color: var(--ap-black);
}
.ap-page__content h3,
.ap-page__content .widget-title {
margin: 0 0 14px;
font-size: 20px;
font-weight: 800;
color: var(--ap-black);
}
.ap-page__content p {
margin: 0 0 1em;
}
.ap-page__content a {
color: var(--ap-red);
font-weight: 600;
text-decoration: none;
}
.ap-page__content a:hover {
text-decoration: underline;
}
.ap-page__content img {
display: block;
width: 100%;
max-width: 500px;
height: auto;
border-radius: 16px;
box-shadow: 0 12px 32px rgba(17, 17, 17, 0.1);
margin: 0 auto;
} .ap-page--builder .ap-page__content {
padding: 28px;
} .ap-page .siteorigin-panels-stretch,
.ap-page .panel-row-style[data-stretch-type] {
margin-left: 0 !important;
margin-right: 0 !important;
width: 100% !important;
max-width: 100% !important;
left: auto !important;
right: auto !important;
transform: none !important;
}
.ap-page .panel-layout {
display: flex;
flex-direction: column;
gap: 22px;
}
.ap-page .panel-grid.panel-no-style,
.ap-page .panel-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 22px;
margin: 0 !important;
width: 100% !important;
}
.ap-page .panel-grid-cell {
float: none !important;
width: auto !important;
margin: 0 !important;
display: flex;
flex-direction: column;
gap: 16px;
min-width: 0;
}
.ap-page .so-panel,
.ap-page .widget {
margin: 0 !important;
}
.ap-page .panel-grid-cell .textwidget,
.ap-page .panel-grid-cell .custom-html-widget,
.ap-page .widget_text .textwidget {
height: 100%;
}
.ap-page .textwidget h2 {
position: relative;
padding-bottom: 14px;
}
.ap-page .textwidget h2::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 56px;
height: 4px;
border-radius: 999px;
background: var(--ap-red);
} .ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) {
grid-template-columns: 1fr !important;
}
.ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) .textwidget {
padding: 22px 24px;
border-radius: 16px;
background: linear-gradient(135deg, #111 0%, #222 100%);
color: rgba(255, 255, 255, 0.82);
box-shadow: 0 14px 34px rgba(17, 17, 17, 0.18);
}
.ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) .textwidget p {
margin: 0;
font-size: 16px;
line-height: 1.6;
}
.ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) .textwidget strong,
.ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) .textwidget a {
color: #fff;
}
.ap-page .panel-grid:has(> .panel-grid-cell:only-child):has(.textwidget):not(:has(.wpcf7)):not(:has(img)) .textwidget a {
color: #ffb3b3;
} .ap-page .widget_media_image,
.ap-page .widget_media_image .so-widget-image {
overflow: hidden;
border-radius: 16px;
}
.ap-page .widget_media_image img {
transition: transform 0.35s ease;
}
.ap-page .widget_media_image:hover img {
transform: scale(1.03);
} .ap-page .widget_custom_html:has(.wpcf7),
.ap-page .custom-html-widget:has(.wpcf7),
.ap-page .widget_text:has(.wpcf7),
.ap-page .so-panel:has(.wpcf7) {
padding: 28px;
border: 1px solid #ececec;
border-radius: 20px;
background:
radial-gradient(ellipse 80% 80% at 100% 0%, rgba(204, 0, 0, 0.06), transparent 55%),
#fafafa;
}
.ap-page .widget_custom_html:has(.wpcf7) .widget-title,
.ap-page .so-panel:has(.wpcf7) .widget-title {
margin-bottom: 18px;
}
.ap-page .wpcf7,
.ap-page__content .wpcf7 {
max-width: 560px;
}
.ap-page .wpcf7-form > p {
display: flex;
flex-direction: column;
gap: 12px;
margin: 0;
}
.ap-page .wpcf7-form > p > br {
display: none;
}
.ap-page .wpcf7-form-control-wrap {
display: block;
width: 100%;
}
.ap-page .wpcf7-text,
.ap-page .wpcf7-tel,
.ap-page .wpcf7-email,
.ap-page .wpcf7-textarea,
.ap-page input[type="text"],
.ap-page input[type="tel"],
.ap-page input[type="email"],
.ap-page textarea {
width: 100% !important;
max-width: 100%;
padding: 14px 16px;
border: 1px solid #e0e0e0;
border-radius: 12px;
background: #fff;
color: #111;
font-family: inherit;
font-size: 15px;
box-sizing: border-box;
outline: none;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ap-page .wpcf7-text:focus,
.ap-page .wpcf7-tel:focus,
.ap-page .wpcf7-textarea:focus,
.ap-page input:focus,
.ap-page textarea:focus {
border-color: var(--ap-red);
box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.12);
}
.ap-page .wpcf7-textarea,
.ap-page textarea {
min-height: 120px;
resize: vertical;
}
.ap-page .wpcf7-submit,
.ap-page input[type="submit"] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
max-width: 220px;
margin-top: 4px;
padding: 14px 32px;
border: 0;
border-radius: 12px;
background: var(--ap-red);
color: #fff;
font-family: inherit;
font-size: 14px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
cursor: pointer;
transition: background 0.2s ease, box-shadow 0.2s ease;
box-shadow: 0 10px 24px rgba(204, 0, 0, 0.25);
}
.ap-page .wpcf7-submit:hover,
.ap-page input[type="submit"]:hover {
background: #b00000;
}
.ap-page .wpcf7-not-valid-tip {
font-size: 12px;
color: var(--ap-red);
}
.ap-page .wpcf7-response-output {
margin: 16px 0 0;
padding: 12px 14px;
border-radius: 12px;
font-size: 13px;
} @media (max-width: 1200px) {
:root {
--ap-pad: 40px;
}
.ap-services {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ap-service {
min-height: 300px;
}
.ap-industries {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ap-projects {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ap-locations__grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ap-reviews {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ap-review:nth-child(even) {
margin-top: 0;
}
.ap-blog__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ap-single__content {
padding: 28px 22px;
}
.ap-cta__inner {
grid-template-columns: 1fr;
gap: 36px;
}
.ap-cta__phones {
max-width: none;
}
.ap-footer__inner {
grid-template-columns: 1fr 1fr;
}
.ap-footer__brand {
grid-column: 1 / -1;
}
}
@media (max-width: 980px) {
.ap-topbar__inner {
padding: 8px 16px;
justify-content: flex-start;
overflow-x: auto;
}
.ap-topbar__right,
.ap-topbar__hide-mobile {
display: none;
}
.ap-topbar__left {
gap: 16px;
} .ap-nav__list > li {
display: block;
width: 100%;
}
.ap-nav__list > li > a {
display: block;
width: 100%;
align-self: auto;
}
.ap-nav__list > li > .sub-menu::before {
display: none;
}
.ap-nav__list .sub-menu {
position: static;
display: none;
box-shadow: none;
min-width: 0;
width: 100%;
padding: 0;
margin: 0;
background: #f8f8f8;
transform: none;
left: auto;
right: auto;
top: auto;
} .ap-nav__list > li:hover > .sub-menu,
.ap-nav__list > li:focus-within > .sub-menu {
display: none;
}
.ap-nav__list > li.is-open > .sub-menu {
display: block;
}
.ap-nav__list > .ap-mega {
position: relative;
}
.ap-nav__list > .ap-mega:hover > .sub-menu,
.ap-nav__list > .ap-mega:focus-within > .sub-menu {
display: none;
}
.ap-nav__list > .ap-mega.is-open > .sub-menu {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
width: 100%;
max-width: none;
left: auto;
transform: none;
border-top: 0;
padding: 0;
background: #fafafa;
gap: 0;
}
.ap-nav__list > .ap-mega > .sub-menu > li {
width: 100%;
min-width: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px 12px;
padding: 10px 16px;
border-bottom: 1px solid #eee;
box-sizing: border-box;
}
.ap-nav__list .sub-menu a {
padding: 12px 20px 12px 36px;
}
.ap-nav__list > .ap-mega > .sub-menu > .ap-mega__letter > a,
.ap-nav__list > .ap-mega > .sub-menu > li > a.ap-letter-link {
width: 32px;
height: 32px;
margin: 0;
flex-shrink: 0;
font-size: 13px;
}
.ap-nav__list > .ap-mega > .sub-menu > li > .sub-menu {
display: flex;
flex-wrap: wrap;
flex: 1 1 140px;
gap: 2px 10px;
min-width: 0;
padding: 0;
background: transparent;
}
.ap-nav__list > .ap-mega > .sub-menu > li > .sub-menu a {
padding: 4px 0;
text-align: left;
white-space: nowrap;
}
.ap-header__inner {
padding: 12px 16px;
gap: 12px;
}
.ap-header .ap-btn {
display: inline-flex;
margin-left: auto;
flex-shrink: 0;
padding: 8px 12px;
font-size: 11px;
letter-spacing: 0.3px;
}
.ap-nav-toggle {
display: flex;
flex-shrink: 0;
}
.ap-nav {
position: absolute;
left: 0;
right: 0;
top: 100%;
z-index: 120;
max-height: min(70vh, calc(100dvh - 120px));
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
background: #fff;
border-top: 1px solid #eee;
box-shadow: 0 8px 20px #00000015;
display: none;
}
.ap-nav.is-open {
display: block;
}
body.ap-nav-open {
overflow: hidden;
}
.ap-nav__list {
flex-direction: column;
align-items: stretch;
gap: 0;
padding: 8px 0;
}
.ap-nav__list a,
.ap-nav__link {
display: block;
padding: 14px 20px;
}
.ap-about {
padding: 64px 24px;
}
.ap-about__inner {
grid-template-columns: 1fr;
gap: 32px;
}
.ap-about__frame {
max-width: 560px;
}
.ap-hero {
min-height: auto;
}
.ap-hero__shell {
grid-template-columns: 1fr;
gap: 28px;
padding: 56px 24px 84px;
}
.ap-hero__copy-panel {
min-height: 0;
}
.ap-hero__stats {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ap-hero__aside {
max-width: 440px;
}
.ap-trust {
margin-top: -28px;
padding: 0 24px 8px;
}
.ap-trust__inner {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
padding: 12px;
}
.ap-trust__item:last-child {
grid-column: 1 / -1;
justify-content: center;
}
.ap-section {
padding: 40px 24px;
}
.ap-faq {
grid-template-columns: 1fr;
}
.ap-reviews-section {
padding: 50px 24px;
}
.ap-reviews-score {
padding: 18px 16px;
}
.ap-reviews-score__value {
font-size: 44px;
}
.ap-reviews {
grid-template-columns: 1fr;
}
.ap-locations {
padding: 50px 24px;
}
.ap-locations__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ap-cta {
padding: 64px 24px 56px;
}
.ap-cta__phones {
grid-template-columns: 1fr;
}
.ap-footer {
padding: 48px 24px 24px;
}
}
@media (max-width: 640px) {
.ap-services-section,
.ap-industries-section {
padding: 64px 24px 56px;
}
.ap-services,
.ap-projects,
.ap-industries {
grid-template-columns: 1fr 1fr;
}
.ap-service {
min-height: 280px;
}
.ap-industry {
min-height: 160px;
}
.ap-hero__stats {
grid-template-columns: 1fr 1fr;
display: none;
}
.ap-hero__title,
.ap-hero__title--acf,
.ap-hero__title--acf h1 {
font-size: clamp(30px, 9vw, 40px);
}
.ap-trust {
margin-top: -20px;
}
.ap-trust__inner {
grid-template-columns: 1fr;
}
.ap-trust__item:last-child {
grid-column: auto;
justify-content: flex-start;
}
.ap-about__float {
left: 12px;
right: 12px;
bottom: 12px;
}
.ap-about__badge {
top: 12px;
right: 12px;
}
.ap-locations__grid {
grid-template-columns: 1fr;
}
.ap-blog__hero {
padding: 48px 24px 36px;
}
.ap-blog__inner {
padding: 28px 24px 56px;
}
.ap-page-hero {
padding: 44px 24px 40px;
}
.ap-page__shell {
margin-top: -20px;
padding: 0 24px 56px;
}
.ap-page__content,
.ap-page--builder .ap-page__content {
padding: 22px 18px 28px;
}
.ap-page .panel-grid.panel-no-style,
.ap-page .panel-grid {
grid-template-columns: 1fr !important;
}
.ap-blog__grid {
grid-template-columns: 1fr;
}
.ap-single__inner {
margin-top: -24px;
padding-left: 24px;
padding-right: 24px;
}
.ap-footer__inner {
grid-template-columns: 1fr;
gap: 32px;
}
.ap-footer__brand {
grid-column: auto;
}
.ap-cta__title {
font-size: clamp(28px, 8vw, 38px);
}
.ap-cta__phone strong {
font-size: 18px;
}
}
@media (max-width: 420px) {
.ap-header .ap-btn {
padding: 8px 10px;
font-size: 10px;
}
.ap-services,
.ap-projects,
.ap-industries {
grid-template-columns: 1fr;
}
.ap-service {
min-height: 260px;
}
.ap-services-section__cta {
flex-direction: column;
}
.ap-services-section__cta .ap-btn {
width: 100%;
}
}