*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Poppins', sans-serif;
color: #000000;
background: #ffffff;
}
img {
max-width: 100%;
height: auto;
display: block;
}
a {
text-decoration: none;
color: inherit;
}
.site-main p {
margin-bottom: 16px;
line-height: 1.6;
}
.site-main .wp-block-heading {
line-height: 1.3;
margin-bottom: 0.3em;
}
@media (max-width: 768px) {
.site-main h1,
.site-main .wp-block-heading.has-h-1-font-size {
font-size: 32px;
}
.site-main h2,
.site-main .wp-block-heading.has-h-2-font-size {
font-size: 26px;
}
.site-main h3,
.site-main .wp-block-heading.has-h-3-font-size {
font-size: 18px;
}
}
:where(.site-main ul),
:where(.site-main ol) {
margin-bottom: 16px;
line-height: 1.6;
padding-left: 15px;
}
.site-main ol {
padding-left: 0;
list-style: none;
counter-reset: ol-counter;
}
.site-main ol li {
counter-increment: ol-counter;
position: relative;
padding-left: 28px;
}
.site-main ol li::before {
content: counter(ol-counter) '.';
position: absolute;
left: 0;
top: 0;
font-variant-numeric: tabular-nums;
}
.site-main ul:not([class]) li,
.site-main ol:not([class]) li {
margin-bottom: 8px;
padding-left: 4px;
}
.site-main li {
margin-bottom: 8px;
}
.site-main li:last-child {
margin-bottom: 0;
}
.site-main > *:first-child,
.site-main h1:first-child,
.site-main h2:first-child,
.site-main h3:first-child,
.site-main h4:first-child {
margin-top: 0;
}
.site-main > *:last-child {
margin-bottom: 0;
}
.container,
.is-style-container > .wp-block-group__inner-container,
.is-style-container {
max-width: 1140px;
margin-left: auto;
margin-right: auto;
width: 100%;
}
@media (max-width: 1180px) {
.container,
.is-style-container > .wp-block-group__inner-container,
.is-style-container {
padding-left: 20px !important;
padding-right: 20px !important;
}
}
.site-header {
background: #009A61;
color: #ffffff;
position: relative;
z-index: 100;
}
.header-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
min-height: 88px;
}
.site-logo {
display: flex;
align-items: center;
flex-shrink: 0;
}
.site-logo-with-text {
display: flex;
align-items: center;
gap: 12px;
color: #ffffff;
font-weight: 700;
font-size: 18px;
}
.site-logo .custom-logo-link {
display: block;
line-height: 0;
}
.site-logo .custom-logo {
width: 44px !important;
height: 44px !important;
max-width: 44px;
max-height: 44px;
display: block;
object-fit: contain;
}
.site-logo-fallback {
gap: 12px;
color: #ffffff;
font-weight: 700;
font-size: 18px;
}
.site-logo-icon {
width: 44px;
height: 44px;
background: #ffffff;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 22px;
}
.site-logo-text {
white-space: nowrap;
color: #ffffff;
font-weight: 700;
font-size: 18px;
}
.site-nav {
margin-left: auto;
display: flex;
align-items: center;
gap: 32px;
align-self: stretch;
}
.site-menu {
display: flex;
align-items: stretch;
align-self: stretch;
gap: 0;
list-style: none;
margin: 0;
padding: 0;
}
.site-menu > li {
display: flex;
align-items: center;
margin: 0;
padding: 0 20px;
}
.site-menu a {
color: #ffffff;
font-size: 16px;
font-weight: 500;
transition: opacity 0.2s;
padding: 8px 0;
display: inline-block;
}
.site-menu a:hover,
.site-menu .current-menu-item a {
opacity: 0.8;
}
.dropdown-toggle {
display: none;
}
.site-menu > li.menu-item-has-children {
position: relative;
}
.site-menu > li.menu-item-has-children:hover {
background: #ffffff;
}
.site-menu > li.menu-item-has-children:hover > a {
color: #009A61;
opacity: 1;
}
.site-menu > li.menu-item-has-children > a {
display: inline-flex;
align-items: center;
gap: 5px;
}
.site-menu > li.menu-item-has-children > a::after {
content: '';
display: inline-block;
width: 7px;
height: 7px;
border-right: 1.5px solid currentColor;
border-bottom: 1.5px solid currentColor;
transform: rotate(45deg) translateY(-2px);
transition: transform 0.2s ease;
flex-shrink: 0;
}
.site-menu > li.menu-item-has-children:hover > a::after {
transform: rotate(-135deg) translateY(-2px);
}
.site-menu .sub-menu {
position: absolute;
top: 100%;
left: 0;
min-width: max-content;
background: #ffffff;
list-style: none;
margin: 0;
padding: 6px 0;
border-radius: 0;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
opacity: 0;
visibility: hidden;
transform: translateY(-4px);
transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
z-index: 200;
pointer-events: none;
}
.site-menu > li.menu-item-has-children:hover > .sub-menu,
.site-menu > li.menu-item-has-children:focus-within > .sub-menu {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto;
}
.site-menu .sub-menu li {
margin: 0;
padding: 0;
display: block;
}
.site-menu .sub-menu a {
display: block;
padding: 14px 24px;
white-space: nowrap;
font-size: 15px;
font-weight: 500;
color: #000000;
transition: background 0.15s, color 0.15s;
opacity: 1;
}
.site-menu .sub-menu a:hover {
background: #F5F5F5;
color: #009A61;
opacity: 1;
}
.header-cta-btn {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ffffff;
color: #009A61;
font-weight: 700;
font-size: 16px;
padding: 14px 40px;
min-width: 140px;
transition: all 0.2s;
flex-shrink: 0;
}
.header-cta-btn:hover {
background: #C7FFC6;
color: #024731;
}
.mobile-menu-toggle {
display: none;
background: none;
border: none;
cursor: pointer;
padding: 8px;
flex-direction: column;
gap: 5px;
}
.mobile-menu-toggle span {
display: block;
width: 26px;
height: 3px;
background: #ffffff;
border-radius: 2px;
transition: all 0.3s;
}
@media (max-width: 1024px) {
.header-inner {
min-height: 70px;
}
.site-logo-text {
font-size: 16px;
}
.site-logo .custom-logo {
max-height: 44px;
}
.site-logo .custom-logo {
width: 36px !important;
height: 36px !important;
}
.site-logo-with-text .site-logo-text {
font-size: 15px;
}
.site-nav,
.header-cta-btn {
display: none;
}
.mobile-menu-toggle {
display: flex;
}
.site-header.is-menu-open .site-nav {
display: flex;
flex-direction: column;
align-items: stretch;
position: absolute;
top: 100%;
left: 0;
right: 0;
background: #ffffff;
padding: 8px 20px 20px;
margin: 0;
gap: 0;
z-index: 99;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
.site-header.is-menu-open .site-menu {
flex-direction: column;
align-items: stretch;
gap: 0;
width: 100%;
}
.site-header.is-menu-open .site-menu > li {
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
display: flex;
flex-wrap: wrap;
align-items: center;
padding-left: 0;
padding-right: 0;
}
.site-header.is-menu-open .site-menu > li:last-child {
border-bottom: none;
}
.site-header.is-menu-open .site-menu > li > a {
flex: 1;
padding: 14px 0;
display: flex;
align-items: center;
color: #000000;
opacity: 1;
}
.site-header.is-menu-open .site-menu > li > a:hover {
color: #009A61;
opacity: 1;
}
.site-menu > li.menu-item-has-children > a::after {
display: none;
}
.dropdown-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
background: none;
border: none;
color: #000000;
cursor: pointer;
padding: 10px 8px;
line-height: 0;
opacity: 0.5;
transition: opacity 0.2s;
flex-shrink: 0;
}
.dropdown-toggle:hover {
opacity: 1;
}
.dropdown-toggle svg {
transition: transform 0.25s ease;
}
.site-menu .is-dropdown-open > .dropdown-toggle svg {
transform: rotate(180deg);
}
.site-header.is-menu-open .sub-menu {
position: static;
width: 100%;
min-width: 0;
display: none;
opacity: 1;
visibility: visible;
transform: none;
pointer-events: auto;
box-shadow: none;
border-radius: 0;
background: none;
padding: 4px 0 12px 12px;
}
.site-header.is-menu-open .sub-menu::before {
display: none;
}
.site-header.is-menu-open .is-dropdown-open > .sub-menu {
display: block;
}
.site-header.is-menu-open .sub-menu a {
padding: 10px 0;
font-size: 14px;
color: #333333;
white-space: normal;
border-bottom: none;
}
.site-header.is-menu-open .sub-menu a:hover {
background: none;
color: #009A61;
opacity: 1;
}
.site-header.is-menu-open .header-cta-btn {
display: flex;
position: static;
width: 100%;
margin-top: 16px;
background: #009A61;
color: #ffffff;
}
.site-header.is-menu-open .header-cta-btn:hover {
background: #024731;
color: #ffffff;
}
.site-header.is-menu-open .mobile-menu-toggle span:nth-child(1) {
transform: translateY(8px) rotate(45deg);
}
.site-header.is-menu-open .mobile-menu-toggle span:nth-child(2) {
opacity: 0;
}
.site-header.is-menu-open .mobile-menu-toggle span:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
}
}
.block-hero {
position: relative;
min-height: 450px;
background-color: #009A61;
background-image: var(--hero-bg);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
color: #ffffff;
overflow: hidden;
align-content: center;
}
.block-hero.is-centered .hero-content { text-align: center; max-width: 100%; width: 100%; }
.block-hero.is-centered .hero-title,
.block-hero.is-centered .hero-subtitle,
.block-hero.is-centered .hero-features-title { text-align: center; }
.block-hero.is-centered .hero-features {
display: inline-flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
margin: 0 auto;
}
.block-hero.is-centered .hero-buttons { justify-content: center; }
.block-hero.is-centered .hero-store-search-form { justify-content: center; }
.block-hero.is-centered .hero-search-row2 { justify-content: center; }
.block-hero.is-centered .hero-overlay {
background: linear-gradient(0deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
}
.hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(
90deg,
rgba(0, 0, 0, 1) 0%,
rgba(51, 51, 51, 0) 100%
);
}
.hero-inner {
position: relative;
padding-top: 100px;
padding-bottom: 100px;
z-index: 1;
}
.hero-content {
max-width: 600px;
}
.hero-title {
font-size: 42px;
font-weight: 700;
line-height: 52px;
margin-bottom: 24px;
}
.hero-subtitle {
font-size: 16px;
line-height: 24px;
margin-bottom: 32px;
opacity: 0.95;
}
.hero-subtitle .team-card-email,
.hero-subtitle .team-card-email svg {
color: #ffffff;
fill: #ffffff;
}
.hero-subtitle .team-card-email {
width: 40px;
height: 40px;
border: 2px solid currentColor;
padding: 0;
transition: background-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
}
.hero-subtitle .team-card-email:hover,
.hero-subtitle .team-card-email:hover svg {
color: #C7FFC6;
fill: #C7FFC6;
}
.hero-subtitle .team-card-email:hover {
background-color: rgba(255, 255, 255, 0.08);
}
.hero-features-title {
font-size: 22px;
font-weight: 700;
margin-bottom: 16px;
}
.hero-features {
list-style: none;
padding: 0;
margin-bottom: 40px;
}
.hero-feature-item {
display: flex;
align-items: center;
padding: 8px 0;
}
li.hero-feature-item {
margin-bottom: 0;
}
.hero-feature-item::before {
content: '';
flex-shrink: 0;
width: 20px;
height: 20px;
margin-right: 12px;
background-image: url("data:image/svg+xml,");
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.hero-buttons {
display: flex;
align-items: center;
gap: 24px;
flex-wrap: wrap;
margin-top:40px;
}
.hero-btn {
display: inline-block;
padding: 18px 40px;
font-size: 18px;
font-weight: 600;
transition: all 0.2s ease;
}
.hero-btn-primary {
background: #009A61;
color: #ffffff;
display: flex;
min-width: 260px;
height: 60px;
align-items: center;
justify-content: center;
}
.hero-btn-primary:hover {
background: #024731;
}
.hero-btn-secondary {
color: #ffffff;
border-bottom: 1px solid #ffffff;
padding: 4px 0;
}
.hero-btn-secondary:hover {
opacity: 0.8;
}
@media (max-width: 768px) {
.hero-content {
width: 100%;
max-width: none;
}
.block-hero.has-bg-image {
min-height: auto;
background-image: none !important;
background-color: transparent !important;
color: #1a1a2e;
display: flex;
flex-direction: column;
}
.block-hero.has-bg-image .hero-overlay { display: none; }
.block-hero.has-bg-image .hero-inner {
order: 1;
padding-top: 40px;
padding-bottom: 32px;
background: #ffffff;
}
.block-hero.has-bg-image::after {
content: '';
order: 2;
display: block;
width: 100%;
height: 280px;
background-image: var(--hero-bg-mobile, var(--hero-bg));
background-size: cover;
background-position: center;
}
.block-hero:not(.has-bg-image) {
min-height: 480px;
background-color: #009A61;
align-items: center;
justify-content: center;
text-align: center;
}
.block-hero:not(.has-bg-image) .hero-overlay {
display: block;
background: linear-gradient(180deg, rgba(0, 100, 55, 0) 0%, #024731 100%);
}
.block-hero:not(.has-bg-image) .hero-inner {
background: transparent;
padding-top: 40px;
padding-bottom: 48px;
position: relative;
z-index: 1;
}
.block-hero:not(.has-bg-image) .hero-content {
max-width: 100%;
}
.block-hero:not(.has-bg-image)::after { display: none; }
.block-hero:not(.has-bg-image) .hero-store-search-form {
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
margin-top: 24px;
}
.block-hero:not(.has-bg-image) .hero-search-wrap {
flex: 1;
max-width: none;
}
.block-hero:not(.has-bg-image) .hero-search-btn {
width: auto;
}
.block-hero:not(.has-bg-image) .hero-search-row2 {
flex-basis: 100%;
justify-content: center;
margin-top: 4px;
}
.block-hero:not(.has-bg-image) .hero-locate-btn { color: rgba(255,255,255,.85); }
.hero-title {
font-size: 36px;
line-height: 1.1;
margin-bottom: 20px;
}
.hero-subtitle {
font-size: 16px;
margin-bottom: 28px;
opacity: 1;
}
.hero-subtitle .team-card-email,
.hero-subtitle .team-card-email svg {
color: #009A61;
fill: #009A61;
}
.hero-subtitle .team-card-email:hover,
.hero-subtitle .team-card-email:hover svg {
color: #024731;
fill: #024731;
}
.hero-buttons {
flex-direction: column;
align-items: center;
gap: 20px;
}
.hero-btn-primary {
width: 100%;
text-align: center;
padding: 18px;
}
.hero-btn-secondary {
width: 100%;
text-align: center;
color:#000;
border:#000;
}
.hero-features-title {
font-size: 22px;
margin-bottom: 16px;
}
.hero-feature-item::before {
background-image: url("data:image/svg+xml,");
align-self: flex-start;
margin-top: 3px;
}
.hero-feature-item {
line-height: 1.4;
}
}
.breadcrumbs {
background: #000000;
padding: 0;
}
.breadcrumbs-inner {
display: flex;
align-items: stretch;
gap: 10px;
font-size: 15px;
font-weight: 500;
min-height: 52px;
}
.breadcrumbs-item {
display: flex;
align-items: center;
color: #ffffff;
padding: 0 16px;
transition: opacity 0.2s;
}
.breadcrumbs-item:first-child {
padding-left: 0;
}
a.breadcrumbs-item:hover {
opacity: 0.7;
}
.breadcrumbs-separator {
align-self: center;
color: #ffffff;
flex-shrink: 0;
}
.breadcrumbs-current {
background: #ffffff;
color: #1a1a2e;
padding: 0 24px;
}
@media (max-width: 768px) {
.breadcrumbs-inner {
font-size: 14px;
min-height: 44px;
}
.breadcrumbs-current {
padding: 0 16px;
}
}
.block-how-it-works {
background: #C7FFC6;
padding: 80px 0;
}
.hiw-title {
text-align: center;
margin-bottom:40px;
}
p.hiw-subtitle {
text-align: center;
color: #000000;
font-size: 16px;
margin-bottom: 56px;
}
.hiw-steps {
display: flex;
align-items: flex-start;
justify-content: center;
gap: 0;
}
.hiw-step {
flex: 2 1 0;
text-align: center;
min-width: 0;
}
.hiw-step-number {
width: 60px;
height: 60px;
margin: 0 auto 40px;
background: #009A61;
color: #ffffff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 700;
}
.hiw-step-title {
font-size: 20px;
font-weight: 600;
color: #000000;
margin-top: 0;
margin-bottom: 12px;
}
.hiw-step-description {
font-size: 16px;
line-height: 1.5;
color: #000000;
margin-bottom: 0;
}
.hiw-divider {
flex: 1 1 0;
height: 0;
margin-top: 30px;
border-top: 2px dashed #009A61;
max-width: 120px;
align-self: flex-start;
}
.hiw-footer-text {
margin-top: 20px;
font-size: 14px;
line-height: 1.6;
color: #000000;
font-style: italic;
}
.hiw-footer-text--left {
text-align: left;
}
.hiw-footer-text--center {
text-align: center;
}
.hiw-footer-text--size-small {
font-size: 14px;
}
.hiw-footer-text p {
margin: 0 0 12px;
}
.hiw-footer-text p:last-child {
margin-bottom: 0;
}
.hiw-footer-text a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.hiw-footer-text a:hover {
color: #024731;
}
@media (max-width: 768px) {
.block-how-it-works {
padding: 40px 0;
}
.hiw-steps {
flex-direction: column;
align-items: center;
gap: 0;
}
.hiw-step {
max-width: 100%;
width: 100%;
padding: 0;
}
.hiw-step-number {
margin-bottom: 16px;
}
.hiw-divider {
width: 2px;
height: 48px;
max-width: none;
margin: 10px auto 24px;
border: none;
background-image: linear-gradient(
to bottom,
#009A61 0,
#009A61 6px,
transparent 6px,
transparent 12px
);
background-size: 3px 12px;
background-repeat: repeat-y;
align-self: center;
flex: none;
}
.hiw-footer-text {
margin-top: 32px;
font-size: 14px;
}
}
.is-style-check-list,
.site-main .is-style-check-list {
list-style: none;
padding-left: 0;
margin: 0;
}
.is-style-check-list li {
position: relative;
display: block;
padding: 10px 0 10px 32px;
border-bottom: 1px solid #F5F5F5;
font-size: 16px;
font-weight: 400;
line-height: 1.4;
list-style: none;
margin-bottom: 0;
}
.is-style-check-list li:last-child {
border-bottom: none;
}
.is-style-check-list li::before {
content: '';
position: absolute;
left: 0;
top: 13px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
@media (max-width: 768px) {
.is-style-check-list li {
font-size: 16px;
padding: 10px 0 10px 30px;
}
.is-style-check-list li::before {
width: 20px;
height: 20px;
top: 12px;
}
}
.block-reviews {
background: #F5F5F5;
padding: 80px 0;
}
.reviews-layout {
display: grid;
grid-template-columns: 1fr 1.4fr;
gap: 60px;
align-items: center;
}
.reviews-layout.is-no-title {
grid-template-columns: 1fr;
gap: 0;
}
.reviews-title {
margin: 0;
}
.reviews-carousel-wrap {
width: 100%;
min-width: 0;
}
.reviews-carousel {
position: relative;
cursor: grab;
overflow: hidden;
width: 100%;
}
.reviews-carousel:active {
cursor: grabbing;
}
.reviews-track {
display: flex;
transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), height 0.3s ease;
will-change: transform;
}
.review-slide {
flex: 0 0 100%;
width: 100%;
max-width: 100%;
min-width: 0;
background: #ffffff;
padding: 40px 48px;
box-sizing: border-box;
}
.reviews-layout.is-no-title .review-slide {
flex: 0 0 calc(50% - 10px);
width: calc(50% - 10px);
margin-right: 20px;
}
.reviews-layout.is-no-title .review-slide:last-child {
margin-right: 0;
}
.review-quote-icon {
width: 32px;
height: 24px;
color: #C7FFC6;
margin-bottom: 16px;
}
.review-quote-icon svg {
width: 100%;
height: 100%;
fill: currentColor;
}
.review-text {
font-size: 20px;
line-height: 1.5 !important;
color: #000000;
margin: 0 0 32px;
}
.review-footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.review-author {
display: flex;
align-items: center;
gap: 16px;
}
.review-photo {
width: 48px;
height: 48px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
}
.review-author-name {
font-size: 16px;
font-weight: 500;
color: #000000;
}
.review-stars {
display: flex;
gap: 2px;
font-size: 16px;
}
.review-star {
color: #E0E0E0;
line-height: 1;
}
.review-star.is-filled {
color: #009A61;
}
.review-date {
font-size: 14px;
color: #6B6B6B;
flex-shrink: 0;
}
.reviews-dots {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 24px;
}
.reviews-dot {
width: 10px;
height: 10px;
border-radius: 50%;
background: #D0D0D0;
border: none;
padding: 0;
cursor: pointer;
transition: background 0.2s;
}
.reviews-dot.is-active {
background: #009A61;
}
.reviews-dot:hover {
background: #024731;
}
@media (max-width: 768px) {
.block-reviews {
padding: 48px 0;
}
.reviews-layout {
grid-template-columns: 1fr;
gap: 32px;
}
.reviews-title {
text-align: center;
}
.review-slide {
padding: 28px 24px;
}
.reviews-layout.is-no-title .review-slide {
flex: 0 0 100%;
width: 100%;
margin-right: 0;
}
.review-text {
font-size: 16px;
margin-bottom: 24px;
}
.review-date {
font-size: 13px;
white-space: nowrap;
}
.review-author {
min-width: 0;
}
.review-author-name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.block-products {
padding: 80px 0;
}
.products-title {
text-align: center;
margin-top: 0;
}
.products-subtitle {
text-align: center;
margin-top: 0;
margin-bottom:40px !important;
}
.products-grid {
display: grid;
gap: 24px;
}
.products-grid--1 { grid-template-columns: 1fr; max-width: 600px; margin: 0 auto; }
.products-grid--2 { grid-template-columns: repeat(2, 1fr); }
.products-grid--3 { grid-template-columns: repeat(3, 1fr); }
.products-grid--4 { grid-template-columns: repeat(2, 1fr); }
.products-slider-wrap {
position: relative;
}
.products-slider-viewport {
overflow: hidden;
}
.products-grid--slider {
display: flex;
gap: 0;
transition: transform 0.4s ease;
will-change: transform;
}
.products-grid--slider .product-card {
flex: 0 0 calc((100% - 48px) / 3);
margin-right: 24px;
}
.products-grid--slider .product-card:last-child {
margin-right: 0;
}
.products-slider-bottom {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
margin-top: 32px;
}
.products-slider-arrows {
display: flex;
gap: 8px;
flex-shrink: 0;
}
.products-arrow {
width: 44px;
height: 44px;
flex-shrink: 0;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: 2px solid #009A61;
color: #009A61;
cursor: pointer;
transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
padding: 0;
}
.products-arrow:hover {
background: #009A61;
color: #ffffff;
}
.products-arrow:disabled {
opacity: 0.35;
cursor: not-allowed;
}
.products-arrow:disabled:hover {
background: transparent;
color: #009A61;
}
.products-slider-dots {
display: flex;
align-items: center;
gap: 8px;
}
.products-slider-dots button {
width: 10px;
height: 10px;
border-radius: 50%;
background: #E0E0DF;
border: none;
padding: 0;
cursor: pointer;
transition: background 0.2s ease, transform 0.2s ease;
}
.products-slider-dots button.is-active {
background: #009A61;
transform: scale(1.2);
}
@media (max-width: 1024px) {
.products-grid--slider .product-card {
flex: 0 0 calc((100% - 24px) / 2);
}
}
@media (max-width: 768px) {
.products-grid--slider .product-card {
flex: 0 0 100%;
margin-right: 16px;
}
.products-slider-bottom {
gap: 14px;
margin-top: 24px;
justify-content: center;
}
.products-slider-arrows {
display: none;
}
}
.product-card {
background: #F5F5F5;
padding: 32px;
display: flex;
flex-direction: column;
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.product-card:hover {
transform: translateY(-4px);
}
.product-card-header {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 20px;
}
.product-card-icon {
width: 68px;
height: 68px;
min-width: 68px;
flex-shrink: 0;
align-items: center;
justify-content: center;
}
.product-card-icon img {
width: 68px;
height: 68px;
object-fit: contain;
}
.product-card-title {
margin: 0;
font-size: 24px;
line-height: 1.2;
}
.product-card-highlight {
margin-bottom: 20px;
}
.product-card-highlight-value {
font-size: 28px;
font-weight: 700;
line-height: 1.1;
margin-bottom: 5px;
}
.product-card-highlight-note {
font-size: 14px;
color: #6B6B6B;
}
.product-card-description {
margin-top: 0;
line-height: 1.5;
flex-grow: 1;
margin-bottom: 0 !important;
}
.product-card-features {
list-style: none;
padding: 0;
margin: 0;
flex-grow: 1;
}
.product-card-features li {
position: relative;
padding-left: 32px;
margin-bottom: 12px;
line-height: 1.5;
font-size: 15px;
}
.product-card-features li:last-child {
margin-bottom: 0;
}
.product-card-features li::before {
content: '';
position: absolute;
left: 0;
top: 2px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
.product-card-link {
display: inline-flex;
align-items: center;
gap: 6px;
color: #009A61;
font-weight: 500;
border-bottom: 1px solid #009A61;
padding-bottom: 2px;
transition: all 0.2s;
align-self: flex-start;
margin-top: 30px !important;
}
.product-card-link::after {
content: '→';
display: inline-block;
transition: transform 0.2s ease;
}
.product-card-link:hover {
color: #024731;
border-bottom-color: #024731;
}
.product-card-link:hover::after {
transform: translateX(4px);
}
.product-card-title-link {
color: inherit;
transition: color 0.2s;
display: inline-flex;
align-items: center;
gap: 8px;
}
.product-card-title-link:hover,
.product-card:hover .product-card-title-link {
color: #009A61;
}
.product-card-arrow {
display: inline-flex;
flex-shrink: 0;
color: #009A61;
opacity: 0;
transform: translateX(-6px);
transition: opacity 0.2s ease, transform 0.2s ease;
}
.product-card:hover .product-card-arrow {
opacity: 1;
transform: translateX(0);
}
.product-card-btn {
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 600;
border-radius: 0;
transition: background 0.2s, color 0.2s, border-color 0.2s;
margin-top: auto;
}
.product-card-btn--primary {
width: 100%;
padding: 14px 24px;
background: #009A61;
color: #ffffff;
border: none;
text-align: center;
margin-top:30px;
}
.product-card-btn--primary:hover {
background: #024731;
color: #ffffff;
}
.product-card-btn--outline {
display: inline-flex;
width: auto;
padding: 0 0 2px;
background: transparent;
color: #009A61;
border: none;
border-bottom: 1px solid #009A61;
font-weight: 500;
align-self: flex-start;
gap: 6px;
}
.product-card-btn--outline::after {
content: '→';
font-style: normal;
}
.product-card-btn--outline:hover {
color: #024731;
border-bottom-color: #024731;
}
@media (max-width: 1024px) {
.products-grid--3,
.products-grid--4 {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.block-products {
padding: 48px 0;
}
.products-title {
font-size: 36px;
}
.products-subtitle {
margin-bottom: 32px;
}
.product-card-highlight {
margin-top: 15px;
margin-bottom: 30px;
}
.products-grid,
.products-grid--2,
.products-grid--3,
.products-grid--4 {
grid-template-columns: 1fr;
gap: 16px;
}
.product-card {
padding: 24px;
}
.product-card-icon {
min-width: fit-content;
width: 68px;
height: 68px;
}
.product-card-icon img {
width: 68px;
height: 68px;
}
.product-card-title {
font-size: 24px !important;
}
}
.wp-block-button.is-style-underline-arrow .wp-block-button__link {
background: transparent !important;
color: #009A61 !important;
padding: 4px 0 !important;
border-radius: 0 !important;
border: none !important;
border-bottom: 1px solid #009A61 !important;
font-weight: 500;
font-size: 16px;
display: inline-flex;
align-items: center;
gap: 6px;
transition: all 0.2s ease;
}
.wp-block-button.is-style-underline-arrow .wp-block-button__link::after {
content: '→';
display: inline-block;
transition: transform 0.2s ease;
}
.wp-block-button.is-style-underline-arrow .wp-block-button__link:hover {
color: #024731 !important;
border-bottom-color: #024731 !important;
}
.wp-block-button.is-style-underline-arrow .wp-block-button__link:hover::after {
transform: translateX(4px);
}
.block-re {
background: #F5F5F5;
padding: 30px 20px;
}
.re-title {
margin-top: 0;
margin-bottom: 24px;
font-size: 24px;
}
.re-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 16px;
}
.re-grid--fixed {
grid-template-columns: repeat(var(--re-cols), 1fr);
}
.re-card {
background: #ffffff;
padding: 30px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
min-height: 130px;
}
.re-card--wide {
grid-column: span 2;
}
.re-card--outline {
background: #ffffff;
border: 2px solid #009A61;
}
.re-card--filled {
background: #009A61;
color: #ffffff;
}
.re-card-content {
flex-grow: 1;
}
.re-card-value {
font-size: 28px;
font-weight: 700;
line-height: 1.2;
color: #009A61;
margin-bottom: 12px;
}
.re-card--filled .re-card-value {
color: #ffffff;
}
.re-card--filled .re-card-label {
color: #C7FFC6;
}
.re-card-label {
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.re-card-icon {
flex-shrink: 0;
width: 56px;
height: 56px;
display: flex;
align-items: center;
justify-content: center;
}
.re-card-icon img {
width: 100%;
height: 100%;
object-fit: contain;
}
@media (max-width: 600px) {
.block-re {
padding: 32px 0;
}
.re-grid,
.re-grid--fixed {
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 12px;
}
.re-card {
min-height: auto;
padding: 20px 16px;
}
.re-card--wide {
grid-column: span 2;
}
.re-card-value {
font-size: 24px;
}
}
.is-style-check-pills,
.is-style-check-pills-light,
.is-style-check-pills-dark {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: flex-start;
}
.has-text-align-center.is-style-check-pills,
.has-text-align-center.is-style-check-pills-light,
.has-text-align-center.is-style-check-pills-dark {
justify-content: center;
}
.is-style-check-pills li,
.is-style-check-pills-light li,
.is-style-check-pills-dark li {
list-style: none;
padding: 14px 24px 14px 18px;
border-radius: 999px;
display: inline-flex;
align-items: center;
font-size: 15px;
font-weight: 500;
line-height: 1.3;
}
.is-style-check-pills li:last-child{
margin-bottom: auto;
}
.is-style-check-pills li::before,
.is-style-check-pills-light li::before,
.is-style-check-pills-dark li::before {
content: '';
flex-shrink: 0;
width: 22px;
height: 22px;
margin-right: 10px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
.is-style-check-pills li {
background: #ffffff;
color: #000000;
}
.is-style-check-pills-light li {
background: #F5F5F5;
color: #000000;
}
.is-style-check-pills-dark li {
background: #1a1a2e;
color: #ffffff;
}
.is-style-check-pills-dark li::before {
background-color: #6CF479;
}
@media (max-width: 600px) {
.is-style-check-pills,
.is-style-check-pills-light,
.is-style-check-pills-dark {
gap: 8px;
}
.is-style-check-pills li,
.is-style-check-pills-light li,
.is-style-check-pills-dark li {
padding: 12px 18px 12px 14px;
font-size: 14px;
width: 100%;
text-align: left;
}
.is-style-check-pills li::before,
.is-style-check-pills-light li::before,
.is-style-check-pills-dark li::before {
width: 18px;
height: 18px;
margin-right: 8px;
}
}
.block-directories {
border-top: 1px solid #E8E8E8;
border-bottom: 1px solid #E8E8E8;
}
.dir-list {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 0;
list-style: none;
margin: 0;
padding: 0;
}
.dir-item {
display: flex;
align-items: center;
justify-content: center;
padding: 0 40px;
}
.dir-item:first-child {
padding-left: 0;
}
.dir-item:last-child {
padding-right: 0;
border-right: none;
}
.dir-icon-wrap {
display: flex;
align-items: center;
justify-content: center;
width: 160px;
height: 60px;
}
.dir-icon {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
display: block;
}
.dir-link {
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.2s;
}
.dir-link:hover {
opacity: 0.7;
}
@media (max-width: 768px) {
.dir-list {
gap: 24px;
justify-content: space-around;
}
.dir-item {
padding: 0;
}
.dir-icon-wrap {
width: 120px;
height: 48px;
}
}
.block-location-hero {
position: relative;
background: var(--lhero-bg, #024731) center/cover no-repeat;
padding: 80px 0;
min-height: 545px;
display: flex;
align-items: center;
}
.lhero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(to right, #000000, rgba(51, 51, 51, 0));
}
.lhero-inner {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: 2fr 1fr;
grid-template-rows: auto 1fr;
gap: 16px 30px;
align-items: stretch;
}
.lhero-title {
grid-column: 1 / -1;
grid-row: 1;
font-size: 42px;
font-weight: 700;
color: #ffffff;
margin: 0;
line-height: 1.2;
}
.lhero-card {
grid-column: 1;
grid-row: 2;
background: #ffffff;
border-radius: 0;
padding: 30px;
display: flex;
flex-direction: column;
gap: 20px;
}
.lhero-details {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto auto auto;
gap: 20px 24px;
}
.lhero-row--address { grid-column: 1; grid-row: 1 / span 2; }
.lhero-row--hours { grid-column: 2; grid-row: 1; }
.lhero-row--manager { grid-column: 1; grid-row: 3; }
.lhero-row--phone { grid-column: 2; grid-row: 2; }
.lhero-row--email { grid-column: 2 ; grid-row: 3; }
.lhero-row {
display: flex;
gap: 10px;
align-items: flex-start;
}
.lhero-icon {
flex-shrink: 0;
width: 18px;
height: 18px;
margin-top: 2px;
color: #009A61;
}
.lhero-icon svg { width: 100%; height: 100%; }
.lhero-icon--email {
display: flex;
align-items: center;
}
.lhero-label {
display: block;
font-size: 16px;
font-weight: 600;
color: #000000;
margin-bottom: 2px;
}
.lhero-value {
display: block;
font-size: 16px;
font-weight: 400;
color: #333333;
}
.lhero-value a,
a.lhero-value {
color: #333333;
transition: color 0.2s;
}
.lhero-value a:hover,
a.lhero-value:hover {
color: #009A61;
}
.lhero-link {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 6px;
font-size: 14px;
font-weight: 500;
color: #009A61;
border-bottom: 1px solid #009A61;
padding-bottom: 2px;
transition: color 0.2s ease, border-color 0.2s ease;
}
.lhero-link::after {
content: '→';
display: inline-block;
transition: transform 0.2s ease;
}
.lhero-link:hover {
color: #024731;
border-bottom-color: #024731;
}
.lhero-link:hover::after {
transform: translateX(4px);
}
.lhero-phone:hover {
color: #024731;
}
.arr {
display: inline-block;
transition: transform 0.2s ease;
}
a:hover .arr,
button:hover .arr {
transform: translateX(5px);
}
.lhero-cta {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 18px 40px;
font-weight: 600;
background: #009A61;
color: #ffffff;
border-radius: 0;
transition: background 0.2s ease;
}
.lhero-cta:hover {
background: #024731;
color: #ffffff;
}
.lhero-map {
grid-column: 2;
grid-row: 2;
border-radius: 0;
overflow: hidden;
padding: 10px;
background: #ffffff;
display: flex;
flex-direction: column;
}
.lhero-map iframe {
display: block;
width: 100%;
flex: 1;
min-height: 0;
border: 0;
}
@media (max-width: 1024px) {
.lhero-inner {
grid-template-columns: 1fr;
grid-template-rows: auto auto auto;
}
.lhero-title {
grid-column: 1;
grid-row: 1;
font-size: 32px;
}
.lhero-card {
grid-column: 1;
grid-row: 2;
}
.lhero-map {
grid-column: 1;
grid-row: 3;
min-height: 280px;
padding: 0;
background: none;
}
.lhero-map iframe { min-height: 280px; flex: none; height: 280px; }
}
@media (max-width: 768px) {
.block-location-hero {
background: none !important;
min-height: auto;
padding: 0;
display: block;
}
.lhero-overlay { display: none; }
.lhero-inner {
display: flex;
flex-direction: column;
gap: 16px;
}
.lhero-title {
color: #000000;
font-size: 28px;
padding: 28px 0 0;
}
.lhero-card {
background: #F5F5F5;
padding: 20px;
gap: 24px;
}
.lhero-details {
gap: 30px;
display: flex !important;
flex-direction: column !important;
}
.lhero-row--address,
.lhero-row--hours,
.lhero-row--manager,
.lhero-row--phone,
.lhero-row--email {
grid-column: auto;
grid-row: auto;
}
.lhero-cta {
font-size: 16px;
padding: 16px 24px;
}
.lhero-map {
min-height: 220px;
padding: 10px;
background: #f5f5f5;
}
.lhero-map iframe { min-height: 220px; }
.block-location-hero::after {
content: '';
display: block;
width: 100%;
height: 240px;
background-image: var(--lhero-bg-mobile, var(--lhero-bg));
background-size: cover;
background-position: center;
margin-top: 16px;
}
}
.block-links-carousel {
background: #F5F5F5;
position: relative;
}
.block-links-carousel::after {
content: '';
position: absolute;
top: 0;
right: 0;
width: 80px;
height: 100%;
background: linear-gradient(to right, transparent, #F5F5F5 85%);
pointer-events: none;
z-index: 2;
transition: opacity 0.25s ease;
}
.block-links-carousel.lc-at-end::after {
opacity: 0;
}
.lc-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.lc-title {
font-size: 20px;
font-weight: 700;
margin: 0;
}
.lc-controls {
display: flex;
gap: 10px;
flex-shrink: 0;
}
.lc-btn {
width: 44px;
height: 44px;
border-radius: 50%;
border: 1.5px solid #009A61;
background: transparent;
color: #009A61;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.2s, color 0.2s;
flex-shrink: 0;
}
.lc-btn:hover:not(.is-disabled) {
background: #009A61;
color: #ffffff;
}
.lc-btn.is-disabled {
opacity: 0.35;
cursor: default;
}
.lc-wrap {
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
-ms-overflow-style: none;
}
.lc-wrap::-webkit-scrollbar {
display: none;
}
.lc-track {
display: flex;
gap: 16px;
list-style: none;
margin: 0;
padding: 4px 20px 4px 0;
align-items: stretch;
}
.lc-card {
flex-shrink: 0;
width: 280px;
display: flex;
margin-bottom: 0 !important;
}
.lc-card-link {
display: flex;
align-items: center;
gap: 16px;
background: #ffffff;
padding: 20px 24px;
color: #000000;
font-weight: 600;
font-size: 16px;
transition: transform 0.5s ease, color 0.2s ease;
flex: 1;
}
.lc-card-link:hover {
transform: translateY(-4px);
color: #009A61;
}
.lc-card-icon {
flex-shrink: 0;
width: 56px;
height: 56px;
display: flex;
align-items: center;
justify-content: center;
}
.lc-card-icon img {
width: 56px;
height: 56px;
object-fit: contain;
}
.lc-card-name {
line-height: 1.3;
}
@media (max-width: 768px) {
.lc-controls {
display: none;
}
.lc-title {
font-size: 16px;
}
.lc-card {
width: 200px;
}
.lc-track > .lc-card:last-child {
margin-right: 20px;
}
.lc-card-link {
gap: 12px;
padding: 16px 18px;
font-size: 14px;
}
.lc-card-icon,
.lc-card-icon img {
width: 44px;
height: 44px;
}
}
.locations-title {
text-align: center;
margin-top: 0;
margin-bottom: 48px;
}
.locations-list {
list-style: none;
margin: 0;
padding: 0;
}
.location-item {
display: grid;
grid-template-columns: 1fr 2fr 1fr auto;
align-items: center;
gap: 24px;
padding: 24px 0;
border-bottom: 1px solid #e8e8e8;
}
.location-item:last-child {
border-bottom: none;
}
.location-name {
font-weight: 700;
font-size: 20px;
color: #000000;
}
.location-address {
font-size: 16px;
color: #6B6B6B !important;
transition: color 0.2s;
}
.location-address:hover {
color: #009A61 !important;
}
.location-address--empty {
display: block;
}
.location-phone {
font-size: 16px;
font-weight: 600;
color: #009A61;
transition: color 0.2s;
}
.location-phone:hover {
color: #024731;
}
.location-phone--empty {
display: block;
}
.location-btn {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 52px;
height: 52px;
border-radius: 50%;
background: #024731 !important;
color: #ffffff !important;
flex-shrink: 0;
transition: background 0.2s, transform 0.2s;
}
.location-btn:hover {
background: #009A61 !important;
transform: scale(1.08);
color: #ffffff;
}
.location-btn svg {
transition: transform 0.2s;
}
.location-btn:hover svg {
transform: translate(2px, -2px);
}
.location-btn::after {
content: attr(data-tooltip);
position: absolute;
bottom: calc(100% + 8px);
left: 50%;
transform: translateX(-50%);
background: #000000;
color: #ffffff;
font-size: 12px;
font-weight: 500;
white-space: nowrap;
padding: 5px 10px;
border-radius: 4px;
pointer-events: none;
opacity: 0;
transition: opacity 0.15s;
}
.location-btn:hover::after {
opacity: 1;
}
.location-btn-placeholder {
display: block;
width: 52px;
height: 52px;
flex-shrink: 0;
}
@media (max-width: 1024px) {
.location-item {
grid-template-columns: 1fr 1.5fr auto auto;
}
}
@media (max-width: 768px) {
.locations-title {
margin-bottom: 32px;
}
.location-item {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 6px;
padding: 32px 0;
}
.location-name {
font-size: 18px;
margin-bottom: 10px;
}
.location-address {
font-size: 14px;
}
.location-phone {
font-size: 18px;
margin-top: 4px;
}
.location-btn {
width:fit-content;
color:#009A61 !important;
height: auto;
border-radius: 0;
background-color: unset !important;
gap: 8px;
font-size: 14px;
font-weight: 600;
transform: none;
margin-top: 12px;
text-decoration: underline;
text-underline-offset: 3px;
}
.location-btn::before {
content: 'View location';
}
.location-btn:hover {
color: #024731 !important;
transform: none;
}
.location-btn svg {
width: 16px;
height: 16px;
}
.location-btn:hover svg {
transform: translate(2px, -2px);
}
.location-btn::after {
display: none;
}
.location-btn-placeholder {
display: none;
}
}
.block-faq {
padding: 64px 0;
}
.faq-title {
text-align: center;
margin-top: 0;
margin-bottom: 32px;
}
.faq-list {
border-top: 1px solid #E5E5E5;
}
.faq-item {
border-bottom: 1px solid #E5E5E5;
}
.faq-question {
width: 100%;
background: none;
border: none;
padding: 24px 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
cursor: pointer;
text-align: left;
font-family: inherit;
color: inherit;
}
.faq-question-text {
margin: 0;
font-size: 18px;
font-weight: 600;
line-height: 1.3;
flex-grow: 1;
}
.faq-icon {
flex-shrink: 0;
width: 24px;
height: 24px;
color: #000000;
transition: transform 0.3s ease;
}
.faq-icon svg {
width: 100%;
height: 100%;
}
.faq-question[aria-expanded="true"] .faq-icon {
transform: rotate(180deg);
}
.faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease;
}
.faq-answer-inner {
padding-bottom: 24px;
font-size: 15px;
line-height: 1.6;
color: #000000;
}
.faq-answer-inner p {
margin: 0 0 12px;
}
.faq-answer-inner p:last-child {
margin-bottom: 0;
}
@media (max-width: 768px) {
.block-faq {
padding: 40px 0;
}
.faq-question {
padding: 20px 0;
}
.faq-question-text {
font-size: 18px;
}
.faq-answer-inner {
font-size: 14px;
padding-bottom: 20px;
}
}
.block-cta {
position: relative;
}
.block-cta--default {
margin: 40px 0;
}
.block-cta--footer {
background: linear-gradient(
to bottom,
#F5F5F5 0%,
#F5F5F5 calc(100% - 200px),
#000000 calc(100% - 200px),
#000000 100%
);
padding-top: 60px;
padding-bottom: 0;
margin-bottom: -200px;
margin-top: 0;
position: relative;
z-index: 1;
}
.cta-banner {
position: relative;
background-size: cover;
background-position: center;
background-image: var(--cta-bg-desktop);
color: #ffffff;
overflow: hidden;
}
.cta-overlay {
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(0,0,0) 0%, transparent 100%);
}
.block-cta--right .cta-overlay {
background: linear-gradient(270deg, rgba(0,0,0) 0%, transparent 100%);
}
.cta-inner {
position: relative;
z-index: 1;
padding: 60px;
max-width: 600px;
}
.block-cta--right .cta-inner {
margin-left: auto;
text-align: left;
}
.cta-title {
color: #ffffff;
font-size: 36px;
font-weight: 700;
line-height: 1.2;
margin-top: 0;
margin-bottom: 32px;
}
.cta-buttons {
display: flex;
align-items: center;
gap: 24px;
flex-wrap: wrap;
}
.cta-btn {
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 16px;
transition: all 0.2s ease;
}
.cta-btn-primary {
background: #009A61;
color: #ffffff;
padding: 18px 40px;
min-width: 200px;
}
.cta-btn-primary:hover {
background: #024731;
color: #ffffff;
}
.cta-btn-secondary {
color: #ffffff;
border-bottom: 1px solid #ffffff;
padding: 4px 0;
}
.cta-btn-secondary:hover {
opacity: 0.8;
}
@media (max-width: 768px) {
.block-cta--footer {
background: none;
padding-top: 0 !important;
margin-bottom: 0;
margin-top: 0;
}
.block-cta--footer .container {
padding-left: 0 !important;
padding-right: 0 !important;
max-width: 100%;
}
.site-main:has(.block-cta--footer:last-child) + .site-footer .footer-menu-wrap {
padding-top: 0;
}
.cta-banner {
background-image: var(--cta-bg-mobile, var(--cta-bg-desktop));
}
.cta-overlay,
.block-cta--right .cta-overlay {
background: linear-gradient(
to bottom,
rgba(0, 0, 0) 0%,
transparent 100%
);
}
.cta-inner {
padding: 48px 24px;
max-width: 100%;
text-align: center;
}
.block-cta--right .cta-inner {
margin-left: 0;
text-align: center;
}
.cta-title {
font-size: 28px;
margin-bottom: 24px;
}
.cta-buttons {
flex-direction: column;
align-items: center;
gap: 16px;
}
.cta-btn-primary {
width: 100%;
}
}
.site-footer {
background: #000000;
color: #ffffff;
position: relative;
}
.site-main:has(.block-cta--footer:last-child) + .site-footer .footer-menu-wrap {
padding-top: 60px;
}
.site-footer a {
color: #ffffff;
transition: opacity 0.2s;
}
.site-footer a:hover {
opacity: 0.7;
}
.footer-menu-wrap {
padding-top: 60px;
padding-bottom: 40px;
}
.footer-menu {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 60px;
}
.footer-menu > li {
list-style: none;
}
.footer-menu > li > a {
font-size: 18px;
font-weight: 700;
margin-bottom: 20px;
display: inline-block;
pointer-events: auto;
}
.footer-menu > li > a[href="#"] {
pointer-events: none;
cursor: default;
}
.footer-menu .sub-menu {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 12px;
}
.footer-menu .sub-menu li {
list-style: none;
}
.footer-menu .sub-menu a {
font-size: 15px;
font-weight: 400;
}
.footer-social-wrap {
padding: 24px 0;
border-top: 1px solid rgba(255, 255, 255, 1);
border-bottom: 1px solid rgba(255, 255, 255, 1);
}
.footer-social {
display: flex;
align-items: center;
gap: 24px;
}
.footer-social-title {
font-size: 16px;
font-weight: 600;
}
.footer-social-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
align-items: center;
gap: 16px;
}
.footer-social-list li {
list-style: none;
}
.footer-social-list a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
}
.footer-social-list img {
width: 100%;
height: 100%;
object-fit: contain;
filter: brightness(0) invert(1);
}
.footer-badges-wrap {
padding: 24px 0;
}
.footer-badges {
list-style: none;
padding: 0;
margin: 0;
display: flex;
align-items: center;
gap: 24px;
flex-wrap: wrap;
}
.footer-badges li {
list-style: none;
}
.footer-badge img {
height: 56px;
width: auto;
display: block;
}
.footer-disclaimer-wrap {
padding: 32px 0;
}
.footer-disclaimer {
font-size: 13px;
line-height: 1.6;
color: rgba(255, 255, 255, 0.8);
}
.footer-disclaimer p {
margin: 0 0 16px;
}
.footer-disclaimer p:last-child {
margin-bottom: 0;
}
.footer-disclaimer a {
text-decoration: underline;
}
.footer-disclaimer ol {
list-style: none;
counter-reset: footer-note;
padding: 0;
margin: 0 0 20px;
}
.footer-disclaimer ol li {
counter-increment: footer-note;
position: relative;
padding-left: 15px;
margin: 0 0 10px;
}
.footer-disclaimer ol li:last-child {
margin-bottom: 0;
}
.footer-disclaimer ol li::before {
content: counter(footer-note);
position: absolute;
left: 0;
top: 2px;
font-size: 10px;
font-weight: 600;
color: #ffffff;
line-height: inherit;
}
.footer-disclaimer ol li p {
margin: 0 0 8px;
}
.footer-disclaimer ol li p:last-child {
margin-bottom: 0;
}
.footer-disclaimer ol li:target {
background: rgba(108, 244, 121, 0.15);
padding: 4px 8px 4px 22px;
margin-left: -8px;
transition: background 0.4s ease;
scroll-margin-top: 100px;
}
.footer-disclaimer ol li:target::before {
left: 8px;
}
.footer-bottom-wrap {
padding: 24px 0;
}
.footer-bottom {
display: flex;
align-items: center;
gap: 12px;
font-size: 14px;
color: rgba(255, 255, 255, 0.8);
}
.footer-sitemap-divider {
opacity: 0.4;
}
.footer-sitemap-link {
text-decoration: underline;
}
@media (max-width: 1024px) {
.footer-menu {
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
}
@media (max-width: 768px) {
.site-footer {
padding-top: 40px;
}
.footer-menu {
grid-template-columns: 1fr;
gap: 32px;
}
.footer-menu-wrap {
padding-bottom: 32px;
}
.footer-social {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
.footer-badges {
gap: 16px;
}
.footer-badge img {
height: 48px;
}
.footer-bottom {
font-size: 13px;
}
}
.block-benefits {
padding: 80px 0;
}
.benefits-title {
text-align: center;
margin-top: 0;
}
.benefits-subtitle {
text-align: center;
margin-top: 0;
margin-bottom: 40px !important;
}
.benefits-tabs {
display: grid;
grid-template-columns: 40fr 60fr;
gap: 48px;
align-items: stretch;
}
.benefits-list {
list-style: none;
padding: 0;
margin: 0;
}
.benefits-item {
list-style: none;
border-bottom: 1px solid #E5E5E5;
position: relative;
}
li.benefits-item {
margin-bottom:0 !important;
}
.benefits-item:last-child {
border-bottom: 1px solid #E5E5E5;
}
.benefits-tab {
width: 100%;
background: none;
border: none;
padding: 18px 0;
display: flex;
align-items: center;
gap: 12px;
cursor: pointer;
text-align: left;
font-family: inherit;
font-size: 18px;
font-weight: 400;
color: #000000;
transition: opacity 0.2s;
}
.benefits-item.is-active .benefits-tab {
font-weight: 700;
}
.benefits-tab:hover {
opacity: 0.7;
}
.benefits-num {
flex-shrink: 0;
width: 28px;
font-size: 13px;
font-weight: 600;
color: #BBBBBB;
transition: color 0.2s;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.benefits-item.is-active .benefits-num {
color: #009A61;
}
.benefits-item.is-active .benefits-tab,
.benefits-tab:hover {
font-weight: 700;
}
.benefits-item.is-active .benefits-tab:hover .benefits-num,
.benefits-tab:hover .benefits-num {
color: #009A61;
}
.benefits-mobile-icon {
display: none;
}
.benefits-check img,
.benefits-check svg {
display: none;
}
.benefits-progress {
position: absolute;
bottom: -1px;
left: 0;
right: 0;
height: 2px;
background: transparent;
overflow: hidden;
pointer-events: none;
}
.benefits-progress-fill {
height: 100%;
width: 100%;
background: #009A61;
transform: scaleX(0);
transform-origin: left center;
}
@keyframes benefitsFill {
from { transform: scaleX(0); }
to { transform: scaleX(1); }
}
.benefits-item.is-active .benefits-progress-fill {
animation: benefitsFill linear var(--benefits-duration, 5s) forwards;
}
.benefits-content {
background: rgba(0, 154, 97, 0.07);
padding: 30px;
position: relative;
min-height: 320px;
overflow: hidden;
}
.benefits-content::before {
content: '';
position: absolute;
bottom: 0;
right: -120px;
width: 430px;
height: 350px;
background: url(assets/paw.svg) no-repeat center / contain;
transform: rotate(-18deg);
mix-blend-mode: multiply;
opacity: 0.1;
pointer-events: none;
z-index: 0;
}
.benefits-panel {
opacity: 0;
visibility: hidden;
position: absolute;
top: 30px;
bottom: 30px;
left: 30px;
right: 30px;
z-index: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}
.benefits-panel.is-active {
opacity: 1;
visibility: visible;
transition: opacity 0.3s ease, visibility 0s;
}
.benefits-panel-icon {
width: 80px;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
.benefits-panel-icon img {
width: 100%;
height: 100%;
object-fit: contain;
}
.benefits-panel-body {
display: flex;
flex-direction: column;
}
.benefits-panel-title {
margin-top: 0;
font-size: 28px;
}
.benefits-panel-desc {
margin: 0;
line-height: 1.5;
color: #000000;
}
.benefits-panel-desc p {
margin: 0 0 12px;
}
.benefits-panel-desc p:last-child {
margin-bottom: 0;
}
.benefits-panel-desc a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.benefits-panel-desc a:hover {
color: #024731;
}
.benefits-mobile-content {
display: none;
}
@media (max-width: 768px) {
.block-benefits {
padding: 48px 0;
}
p.benefits-subtitle {
margin-bottom: 32px !important;
}
.benefits-tabs {
grid-template-columns: 1fr;
gap: 0;
}
.benefits-content {
display: none;
}
.benefits-progress {
display: none;
}
.benefits-tab {
justify-content: flex-start;
padding: 16px 0;
font-size: 16px;
gap: 12px;
}
.benefits-num {
display: none;
}
.benefits-mobile-icon {
display: flex;
flex-shrink: 0;
width: 36px;
height: 36px;
align-items: center;
justify-content: center;
}
.benefits-mobile-icon img {
width: 100%;
height: 100%;
object-fit: contain;
}
.benefits-tab-label {
font-size: 20px;
font-weight: 600;
line-height: 1.3;
}
.benefits-tab::after {
content: '';
margin-left: auto;
width: 12px;
height: 12px;
border-right: 2px solid currentColor;
border-bottom: 2px solid currentColor;
transform: rotate(45deg);
transition: transform 0.3s ease;
flex-shrink: 0;
}
.benefits-item.is-mobile-open .benefits-tab::after {
transform: rotate(-135deg);
}
.benefits-tab:hover,
.benefits-item.is-mobile-open .benefits-tab,
.benefits-item.is-mobile-open .benefits-tab:hover {
opacity: 1;
}
.benefits-mobile-content {
display: block;
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease;
}
.benefits-item.is-mobile-open .benefits-mobile-content {
max-height: 500px;
}
.benefits-mobile-desc {
margin: 0 0 16px;
font-size: 15px;
line-height: 1.5;
color: #000000;
}
.benefits-mobile-desc p {
margin: 0 0 10px;
}
.benefits-mobile-desc p:last-child {
margin-bottom: 0;
}
.benefits-mobile-desc a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.benefits-mobile-desc a:hover {
color: #024731;
}
}
.block-app {
background: #C7FFC6;
padding: 80px 0;
}
.app-title {
text-align: center;
margin-top: 0;
margin-bottom: 16px;
}
.app-subtitle {
text-align: center;
margin-bottom: 48px;
font-size: 16px;
line-height: 1.6;
}
.app-subtitle p {
margin-bottom: 0;
}
.app-subtitle p + p {
margin-top: 16px;
}
.app-subtitle a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.app-subtitle a:hover {
color: #024731;
}
.app-layout {
display: grid;
grid-template-columns: 1.7fr 1fr;
gap: 20px;
align-items: stretch;
}
.app-left {
display: flex;
flex-direction: column;
gap: 32px;
padding-bottom: 80px;
padding-top:0px;
}
.app-left-text {
font-size: 16px;
line-height: 1.6;
color: #000000;
}
.app-left-text p {
margin-bottom: 0;
margin-top:40px;
}
.app-left-text p + p {
margin-top: 16px;
}
.app-left-text a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.app-left-text a:hover {
color: #024731;
}
.app-features-label {
font-size: 18px;
font-weight: 700;
margin: 0;
}
.app-features {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: flex-start;
}
.app-feature {
list-style: none;
background: #ffffff;
color: #000000;
padding: 14px 24px 14px 18px;
border-radius: 999px;
display: inline-flex;
align-items: center;
gap: 10px;
font-size: 15px;
font-weight: 500;
line-height: 1.3;
margin-bottom: 0;
}
.app-feature:last-child {
margin-bottom: 8px !important;
}
.app-feature::before {
content: '';
flex-shrink: 0;
width: 22px;
height: 22px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
.app-badges {
display: flex;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
.app-badge {
display: inline-block;
line-height: 0;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.app-badge img {
height: 56px;
width: auto;
display: block;
}
.app-badge:hover {
transform: translateY(-2px);
opacity: 0.9;
}
.app-right {
display: flex;
align-items: flex-end;
justify-content: center;
}
.app-phone-img {
display: block;
max-height: 500px;
width: auto;
object-fit: contain;
vertical-align: bottom;
}
@media (max-width: 1024px) {
.app-layout {
gap: 32px;
}
}
@media (max-width: 768px) {
.block-app {
padding: 48px 0;
}
.app-subtitle {
margin-bottom: 32px;
}
.app-layout {
grid-template-columns: 1fr;
gap: 40px;
}
.app-features {
flex-direction: column;
gap: 8px;
}
.app-feature {
width: 100%;
border-radius: 8px;
}
.app-left {
padding-bottom: 40px;
}
.app-phone-img {
max-height: none;
width: 100%;
}
.app-badge img {
height: 80px;
}
.app-badges {
justify-content: center;
}
}
.site-main .wp-block-table {
margin: 24px 0;
overflow-x: auto;
}
.site-main .wp-block-table table {
width: 100%;
border-collapse: collapse;
border: 1px solid #F5F5F5;
font-size: 16px;
line-height: 1.5;
min-width: 600px;
}
.site-main .wp-block-table table a {
color: #009A61;
transition: color 0.2s ease;
}
.site-main .wp-block-table table a:hover {
color: #024731;
}
.site-main .wp-block-table th,
.site-main .wp-block-table td,
.site-main .wp-block-table thead,
.site-main .wp-block-table tbody,
.site-main .wp-block-table tr {
border: none !important;
}
.site-main .wp-block-table thead th {
background: #009A61;
color: #ffffff;
font-weight: 700;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 0.3px;
text-align: left;
padding: 14px 24px;
}
.site-main .wp-block-table tbody td {
padding: 12px 24px;
text-align: left;
color: #000000;
vertical-align: middle;
}
.site-main .wp-block-table tbody tr:nth-child(even) td {
background: rgba(0, 154, 97, 0.07);
}
.site-main .wp-block-table tbody td[rowspan],
.site-main .wp-block-table tbody th[rowspan] {
background: #C7FFC6;
border-left: 4px solid #009A61 !important;
font-weight: 500;
}
@media (max-width: 768px) {
.site-main .wp-block-table {
margin: 20px 0;
}
.site-main .wp-block-table table {
font-size: 14px;
}
.site-main .wp-block-table thead th {
padding: 12px 18px;
font-size: 13px;
}
.site-main .wp-block-table tbody td {
padding: 10px 18px;
}
}
.site-main .has-border-color {
color: inherit !important;
}
.block-info-banner {
margin: 24px 0;
}
.block-info-banner--gray .info-banner-inner {
background: #F5F5F5;
}
.block-info-banner--green .info-banner-inner {
background: rgba(0, 154, 97, 0.07);
}
.info-banner-inner {
display: flex;
align-items: center;
gap: 24px;
padding: 20px 28px;
}
.info-banner-icon {
flex-shrink: 0;
width: 56px;
height: 56px;
display: flex;
align-items: center;
justify-content: center;
}
.info-banner-icon img {
width: 100%;
height: 100%;
object-fit: contain;
}
.info-banner-text {
flex: 1 1 auto;
min-width: 0;
font-size: 16px;
line-height: 1.5;
color: #000000;
}
.info-banner-text p {
margin: 0;
}
.info-banner-text strong {
font-weight: 700;
}
.info-banner-text a {
color: #009A61;
font-weight: 600;
transition: color 0.2s ease;
}
.info-banner-text a:hover {
color: #024731;
}
.info-banner-btn {
flex-shrink: 0;
display: inline-flex;
align-items: center;
transition: all 0.2s ease;
}
.info-banner-btn--underline-arrow {
color: #000000;
font-weight: 600;
font-size: 16px;
border-bottom: 1px solid #000000;
padding-bottom: 2px;
}
.info-banner-btn--underline-arrow:hover {
color: #009A61;
border-bottom-color: #009A61;
}
.info-banner-btn--underline-arrow .info-banner-btn-arrow {
display: inline-block;
transition: transform 0.2s ease;
}
.info-banner-btn--underline-arrow:hover .info-banner-btn-arrow {
transform: translateX(4px);
}
.info-banner-btn--primary {
background: #009A61;
color: #ffffff;
font-weight: 600;
font-size: 16px;
padding: 14px 32px;
}
.info-banner-btn--primary:hover {
background: #024731;
color: #ffffff;
}
@media (max-width: 768px) {
.info-banner-inner {
flex-direction: column;
text-align: center;
padding: 24px 20px;
gap: 16px;
}
.info-banner-icon {
width: 48px;
height: 48px;
}
.info-banner-text {
font-size: 15px;
}
.info-banner-btn--primary {
width: 100%;
}
}
.site-main p a,
.site-main li a {
color: #009A61;
transition: color 0.2s ease;
}
.site-main p a:hover,
.site-main li a:hover {
color: #024731;
}
.lmap-inner {
max-width: 1140px;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
}
.lmap-title {
font-size: clamp(28px, 4vw, 40px);
color: #1a1a1a;
text-align: center;
margin: 0 0 32px;
}
.lmap-subtitle {
margin: -20px auto 32px;
max-width:800px;
text-align:center;
}
@media (max-width: 600px) {
.lmap-subtitle {
font-size: 15px;
margin: -12px auto 24px;
}
}
.lmap-search-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
justify-content: center;
margin-bottom: 32px;
}
.lmap-search-input-wrap { position: relative; flex: 1 1 260px; max-width: 340px; }
.lmap-search-icon {
position: absolute; left: 14px; top: 50%;
transform: translateY(-50%); color: #888; pointer-events: none;
}
.lmap-search-input {
width: 100%; padding: 14px 14px 14px 42px; border: 1px solid #ccc;
font-size: 15px; outline: none; transition: border-color 0.2s;
border-radius: 0; box-sizing: border-box;
}
.lmap-search-input:focus { border-color: #009A61; }
.lmap-search-btn {
padding: 14px 28px; background: #009A61; color: #fff;
font-size: 15px; font-weight: 600; border: none; cursor: pointer;
transition: background 0.2s; white-space: nowrap;
}
.lmap-search-btn:hover { background: #024731; }
.lmap-search-btn:disabled { opacity: 0.6; cursor: wait; }
.lmap-locate-btn {
display: flex; align-items: center; gap: 7px;
background: none; border: none; color: #009A61; font-size: 14px;
cursor: pointer; padding: 0; text-decoration: underline; text-underline-offset: 2px;
}
.lmap-locate-btn:hover { color: #024731; }
.lmap-search-status {
flex-basis: 100%;
font-size: 13px;
text-align: center;
margin: 0;
}
.lmap-search-status.is-loading { color: #666; }
.lmap-search-status.is-success { color: #009A61; font-weight: 500; }
.lmap-search-status.is-error { color: #e53e3e; }
.lmap-states-row {
display: flex;
align-items: stretch;
gap: 0;
overflow: hidden;
margin-bottom: 0;
}
.lmap-states-tabs {
display: flex;
flex: 1;
overflow-x: auto;
gap: 10px;
padding-right: 10px;
scrollbar-width: none;
cursor: grab;
user-select: none;
}
.lmap-states-tabs::-webkit-scrollbar { display: none; }
.lmap-states-tabs.is-dragging { cursor: grabbing; }
.lmap-state-tab {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 20px;
background: rgba(199, 255, 198, 0.5);
border: none;
font-size: 15px;
font-weight: 500;
color: #000;
cursor: pointer;
white-space: nowrap;
transition: background 0.15s, color 0.15s;
border-radius: 0;
flex-shrink: 0;
}
.lmap-state-tab:hover:not(.is-active) { background: rgba(199, 255, 198, 0.75); }
.lmap-state-tab.is-active {
background: #024731;
color: #fff;
}
.lmap-tab-count { font-size: 14px; font-weight: 600; }
.lmap-state-tab .lmap-tab-count { color: #6B6B6B; }
.lmap-state-tab.is-active .lmap-tab-count { color: #6CF479; }
.lmap-mobile-toggle {
display: none;
align-items: stretch;
flex-shrink: 0;
}
.lmap-view-btn {
padding: 12px 18px;
background: transparent;
border: none;
border-left: 1px solid #ddd;
font-size: 14px;
cursor: pointer;
transition: all 0.15s;
color: #555;
}
.lmap-view-btn.is-active { background: #024731; color: #fff; }
.lmap-body {
display: grid;
grid-template-columns: 380px 1fr;
gap: 0;
height: 680px;
border: 1px solid #E0E0DF;
}
.lmap-list-col {
display: flex;
flex-direction: column;
overflow: hidden;
background: #F5F5F5;
height: 100%;
}
.lmap-list-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 14px 20px;
background: #F5F5F5;
flex-shrink: 0;
}
.lmap-list-title {
font-size: 18px;
font-weight: 400;
color: #6B6B6B;
}
.lmap-sort-wrap { display: flex; align-items: center; }
.lmap-sort-select {
border: none;
background: transparent;
font-size: 18px;
font-weight: 600;
color: #024731;
cursor: pointer;
outline: none;
appearance: auto;
padding: 0 4px;
text-align: right;
}
.lmap-list {
list-style: none;
margin: 0;
padding: 0;
overflow-y: auto;
flex: 1;
}
.lmap-no-results {
padding: 32px 20px; color: #666; font-size: 14px; text-align: center;
background: #fff;
}
.lmap-card {
padding: 16px 20px;
background: #fff;
border-bottom: 1px solid #E0E0DF;
cursor: pointer;
transition: background 0.15s;
}
.lmap-card:hover,
.lmap-card.is-highlighted { background: #f6fdfb; }
.lmap-card-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 8px;
margin-bottom: 20px;
}
.lmap-card-title {
font-size: 18px;
font-weight: 700;
color: #000;
line-height: 1.3;
}
.lmap-card-status {
font-size: 14px;
white-space: nowrap;
flex-shrink: 0;
padding-top: 3px;
}
.lmap-status-word { font-weight: 600; }
.lmap-card-status--open .lmap-status-word { color: #009A61; }
.lmap-card-status--closed .lmap-status-word { color: #e53e3e; }
.lmap-status-detail { color: #777; }
.lmap-card-distance {
font-size: 14px;
font-weight: 600;
color: #1a1a1a;
white-space: nowrap;
flex-shrink: 0;
padding-top: 3px;
}
.lmap-card-status-under {
font-size: 14px;
margin-bottom: 12px;
}
.lmap-card-distance { display: none; }
.lmap-card-status-under { display: none; }
.lmap-section.has-user-coords .lmap-card-status { display: none; }
.lmap-section.has-user-coords .lmap-card-distance { display: block; }
.lmap-section.has-user-coords .lmap-card-status-under { display: block; }
.lmap-section.has-user-coords .lmap-card-header { margin-bottom: 6px; }
.lmap-card-address {
font-size: 16px;
color: #6B6B6B;
margin-bottom: 20px;
line-height: 1.4;
}
.lmap-card-phone {
display: block;
font-size: 16px;
font-weight: 400;
color: #009A61;
margin-bottom: 20px;
text-decoration: none;
}
.lmap-card-phone:hover { color: #024731; }
.lmap-card-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
}
.lmap-card-directions,
.lmap-card-details {
font-size: 16px;
font-weight: 400;
color: #009A61;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 5px;
}
.lmap-card-directions:hover,
.lmap-card-details:hover { color: #024731; }
.lmap-card-sep { color: #ccc; font-size: 16px; }
.lmap-map-col {
position: relative;
height: 680px;
}
.lmap-map {
width: 100%;
height: 680px;
}
.lmap-count-badge {
position: absolute;
top: 12px;
right: 12px;
z-index: 1000;
background: rgba(255, 255, 255, 0.92);
backdrop-filter: blur(4px);
padding: 6px 14px;
font-size: 13px;
color: #444;
box-shadow: 0 1px 5px rgba(0,0,0,.18);
pointer-events: none;
white-space: nowrap;
}
.lmap-map .leaflet-tile-pane {
filter: grayscale(1) brightness(1.05);
}
.lmap-marker {
background: transparent !important;
border: none !important;
overflow: visible !important;
}
.lmap-marker img {
display: block;
transition: transform 0.15s;
filter: drop-shadow(0 3px 6px rgba(0,0,0,.3));
}
.lmap-marker.is-active img { transform: scale(1.2); }
.lmap-marker-pin {
display: block; width: 28px; height: 36px; position: relative;
}
.lmap-marker-pin::before {
content: ''; position: absolute; inset: 0;
background: #024731; border-radius: 50% 50% 50% 0;
transform: rotate(-45deg);
box-shadow: 0 3px 10px rgba(0,0,0,.35);
}
.lmap-marker-pin::after {
content: ''; position: absolute; width: 10px; height: 10px;
background: #fff; border-radius: 50%;
top: 50%; left: 50%; transform: translate(-50%, -62%);
}
.lmap-user-marker { background: transparent !important; border: none !important; }
.lmap-user-dot {
display: block; width: 20px; height: 20px;
background: #3b82f6; border: 3px solid #fff; border-radius: 50%;
box-shadow: 0 0 0 4px rgba(59,130,246,.25), 0 2px 6px rgba(0,0,0,.3);
}
.lmap-mobile-count { display: none; }
@media (max-width: 900px) {
.lmap-mobile-count {
display: block;
text-align: center;
font-size: 14px;
color: #6B6B6B;
margin: -16px 0 20px;
}
.lmap-mobile-count strong { font-weight: 700; color: #1a1a1a; }
.lmap-states-row { flex-direction: column; gap: 0; overflow: visible; }
.lmap-mobile-toggle {
display: flex;
width: 100%;
border: 1px solid #E0E0DF;
order: -1;
margin-bottom: 16px;
}
.lmap-view-btn {
flex: 1;
padding: 16px;
font-size: 16px;
font-weight: 500;
text-align: center;
border: none;
border-right: 1px solid #E0E0DF;
color: #444;
}
.lmap-view-btn:last-child { border-right: none; }
.lmap-view-btn.is-active { background: #024731; color: #fff; }
.lmap-states-tabs {
padding-bottom: 4px;
scrollbar-width: none;
}
.lmap-states-tabs::-webkit-scrollbar { display: none; }
.lmap-body { grid-template-columns: 1fr; height: auto; min-height: auto; }
.lmap-list-col { height: auto; max-height: 700px; }
.lmap-list { overflow-y: auto; max-height: 700px; }
.lmap-map-col { height: 380px; }
.lmap-map { height: 380px; }
.lmap-body[data-mobile-view="map"] .lmap-list-col { display: none; }
.lmap-body[data-mobile-view="map"] .lmap-map-col { display: block; }
.lmap-body[data-mobile-view="list"] .lmap-map-col { display: none; }
.lmap-body[data-mobile-view="list"] .lmap-list-col { display: flex; }
}
@media (max-width: 600px) {
.lmap-search-bar { flex-direction: column; align-items: stretch; }
.lmap-search-input-wrap { max-width: 100%; flex: 1; }
.lmap-search-btn { width: 100%; }
.lmap-locate-btn { align-self: center; }
}
.hero-store-search-form {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-top: 28px;
margin-bottom: 8px;
}
.hero-search-wrap {
position: relative;
flex: 1 1 220px;
max-width: 320px;
}
.hero-search-icon {
position: absolute;
left: 14px;
top: 50%;
transform: translateY(-50%);
color: rgba(255,255,255,.7);
pointer-events: none;
}
.hero-store-search-input {
width: 100%;
padding: 14px 14px 14px 42px;
border: 1px solid rgba(255,255,255,.5);
background: rgba(255,255,255,.12);
color: #fff;
font-size: 15px;
outline: none;
transition: border-color 0.2s, background 0.2s;
border-radius: 0;
}
.hero-store-search-input::placeholder { color: rgba(255,255,255,.65); }
.hero-store-search-input:focus {
border-color: #fff;
background: rgba(255,255,255,.2);
}
.hero-search-btn {
padding: 14px 28px;
background: #009A61;
color: #fff;
font-size: 15px;
font-weight: 600;
border: none;
cursor: pointer;
transition: background 0.2s;
white-space: nowrap;
}
.hero-search-btn:hover { background: #024731; }
.hero-locate-btn {
display: flex;
align-items: center;
gap: 6px;
background: none;
border: none;
color: rgba(255,255,255,.85);
font-size: 13px;
cursor: pointer;
padding: 0;
text-decoration: underline;
text-underline-offset: 2px;
}
.hero-locate-btn:hover { color: #fff; }
.hero-search-row2 {
flex-basis: 100%;
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
}
.hero-search-status {
font-size: 13px;
margin: 0 !important;
padding: 2px 0;
}
.hero-search-status.is-loading { color: rgba(255,255,255,0.75); }
.hero-search-status.is-success { color: #6CF479; font-weight: 500; }
.hero-search-status.is-error { color: #ff8080; }
@media (max-width: 600px) {
.hero-store-search-form { flex-direction: column; align-items: stretch; }
.hero-search-wrap { max-width: 100%; }
.hero-search-btn { width: 100%; }
}
.pc-grid {
grid-template-columns: repeat(3, 1fr);
}
.pc-card--result { }
.re-card--wide.pc-card--result { grid-column: span 2; }
.pc-label {
display: block;
margin-bottom: 14px;
}
.pc-field-wrap {
display: flex;
align-items: baseline;
gap: 2px;
}
.pc-prefix {
font-size: 28px;
font-weight: 700;
color: #009A61;
line-height: 1.2;
flex-shrink: 0;
}
.pc-field {
border: none;
background: transparent;
font-size: 28px;
font-weight: 700;
color: #009A61;
width: 100%;
max-width: 160px;
padding: 0;
outline: none;
border-radius: 0;
}
.pc-field::-webkit-inner-spin-button,
.pc-field::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.pc-field[type=number] { -moz-appearance: textfield; }
.pc-field:focus { outline: none; }
.pc-hint {
display: block;
font-size: 11px;
color: #999;
letter-spacing: 0.2px;
max-height: 0;
overflow: hidden;
opacity: 0;
margin-top: 0;
transition: max-height 0.2s ease, opacity 0.2s ease, margin-top 0.2s ease;
pointer-events: none;
}
.block-pc:focus-within .pc-hint {
max-height: 20px;
opacity: 1;
margin-top: 6px;
}
.re-card.pc-card {
transition: box-shadow 0.3s;
}
.re-card.pc-card--pulse {
animation: pc-glow 2.5s ease-in-out 0.4s infinite;
}
.re-card.pc-card:focus-within {
animation: none;
box-shadow: 0 0 0 2px rgba(0, 154, 97, 0.2);
}
@keyframes pc-glow {
0%, 100% { box-shadow: 0 0 0 0 rgba(0, 154, 97, 0); }
50% { box-shadow: 0 0 0 3px rgba(0, 154, 97, 0.18); }
}
.pc-apr-icon {
width: auto;
height: auto;
flex-shrink: 0;
}
@media (max-width: 600px) {
.pc-grid { grid-template-columns: 1fr; }
.re-card--wide.pc-card--result { grid-column: span 1; }
.pc-field { font-size: 24px; max-width: 120px; }
.pc-prefix { font-size: 24px; }
}
.lmap-map .leaflet-control-attribution {
display: none !important;
}
.block-rbs {
background: #F5F5F5;
}
.rbs-title {
text-align: center;
margin-top: 0;
margin-bottom: 12px;
}
.rbs-subtitle {
text-align: center;
margin: 0 auto 40px !important;
}
.rbs-empty {
text-align: center;
color: #6B6B6B;
padding: 40px 20px;
background: #ffffff;
}
.rbs-selector {
max-width: 480px;
margin: 0 auto 24px;
background: #ffffff;
border: 1.5px solid #009A61;
padding: 14px 20px;
display: flex;
flex-direction: column;
gap: 2px;
position: relative;
cursor: pointer;
}
.rbs-selector:hover { border-color: #024731; }
.rbs-selector-label {
font-size: 11px;
color: #6B6B6B;
text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: 500;
pointer-events: none;
}
.rbs-select-trigger {
background: transparent;
border: none;
padding: 0;
margin: 0;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
font-family: inherit;
font-size: 18px;
font-weight: 700;
color: #000000;
text-align: left;
outline: none;
}
.rbs-select-trigger:focus-visible { outline: 2px solid #009A61; outline-offset: 4px; }
.rbs-select-current {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.rbs-select-chevron {
flex-shrink: 0;
margin-left: 12px;
transition: transform 0.2s ease;
}
.rbs-selector.is-open .rbs-select-chevron { transform: rotate(180deg); }
.rbs-select-options {
position: absolute;
top: calc(100% + 4px);
left: -1.5px;
right: -1.5px;
margin: 0;
padding: 6px 0;
list-style: none;
background: #ffffff;
border: 1.5px solid #009A61;
max-height: 320px;
overflow-y: auto;
z-index: 100;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}
.rbs-select-options[hidden] { display: none; }
.rbs-select-option {
padding: 10px 20px;
cursor: pointer;
font-size: 16px;
font-weight: 500;
color: #1a1a1a;
transition: background-color 0.15s ease, color 0.15s ease;
}
.rbs-select-option:hover { background: #f0fdf7; color: #024731; }
.rbs-select-option.is-selected {
background: #009A61;
color: #ffffff;
font-weight: 600;
}
.rbs-select-option.is-selected:hover { background: #024731; }
.rbs-select-options::-webkit-scrollbar { width: 6px; }
.rbs-select-options::-webkit-scrollbar-track { background: transparent; }
.rbs-select-options::-webkit-scrollbar-thumb {
background: rgba(0, 154, 97, 0.4);
border-radius: 3px;
}
.rbs-panels {
position: relative;
}
.rbs-panel {
display: none;
}
.rbs-panel.is-active {
display: block;
}
.rbs-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 16px;
}
.rbs-card {
background: #ffffff;
padding: 30px 24px;
display: flex;
flex-direction: column;
justify-content: flex-start;
gap: 8px;
min-height: 130px;
position: relative;
}
.rbs-card--apr {
background: #009A61;
color: #ffffff;
}
.rbs-card-value {
font-size: 28px;
font-weight: 700;
line-height: 1.2;
color: #009A61;
}
.rbs-card--apr .rbs-card-value {
color: #ffffff;
}
.rbs-card-label {
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.5px;
color: #000000;
margin-bottom: 10px;
}
.rbs-card--apr .rbs-card-label {
color: #C7FFC6;
}
.rbs-card--apr .rbs-card-label sup {
font-weight: 700;
}
.rbs-card--fee .rbs-card-value {
font-weight: 700;
line-height: 1.35;
word-break: break-word;
transition: font-size 0.15s ease;
}
.rbs-card--fee .rbs-card-value.is-smaller {
font-size: 22px;
}
.rbs-fee-text {
transition: opacity 0.15s ease;
}
.rbs-readmore-btn {
margin-top: 10px;
display: inline-flex;
align-items: center;
gap: 6px;
background: none;
border: none;
padding: 0;
color: #009A61;
font-family: inherit;
font-size: 13px;
font-weight: 600;
cursor: pointer;
text-decoration: underline;
text-underline-offset: 3px;
align-self: flex-start;
transition: color 0.2s ease;
}
.rbs-readmore-btn:hover {
color: #024731;
}
.rbs-readmore-btn svg {
transition: transform 0.2s ease;
}
.rbs-readmore-btn[aria-expanded="true"] svg {
transform: rotate(180deg);
}
.rbs-fee-extra {
margin-top: 16px;
padding: 16px 20px;
background: rgba(0, 154, 97, 0.07);
font-size: 15px;
line-height: 1.5;
color: #000000;
}
.rbs-fee-extra strong {
color: #024731;
}
.rbs-footnote {
margin-top: 20px;
font-size: 14px;
text-align: center;
}
.rbs-cta-wrap {
text-align: center;
margin-top: 24px;
}
.rbs-cta {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 16px;
font-weight: 600;
color: #009A61;
border-bottom: 1px solid #009A61;
padding-bottom: 3px;
transition: color 0.2s ease, border-color 0.2s ease;
}
.rbs-cta:hover {
color: #024731;
border-bottom-color: #024731;
}
.rbs-cta .arr {
display: inline-block;
transition: transform 0.2s ease;
}
.rbs-cta:hover .arr {
transform: translateX(4px);
}
@media (max-width: 1024px) {
.rbs-grid {
grid-template-columns: 1fr 1fr;
}
.rbs-card--apr {
grid-column: 1 / -1;
}
}
@media (max-width: 600px) {
.rbs-selector {
max-width: 100%;
}
.rbs-grid {
grid-template-columns: 1fr;
gap: 12px;
}
.rbs-card--apr {
grid-column: auto;
}
.rbs-card {
padding: 22px 18px;
min-height: auto;
}
.rbs-card-value {
font-size: 24px;
}
}
.cf-form {
max-width: 640px;
margin: 0 auto;
background: #fff;
padding: 40px;
border: 1px solid #E0E0DF;
display: flex;
flex-direction: column;
gap: 20px;
}
.cf-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.cf-field {
display: flex;
flex-direction: column;
gap: 6px;
}
.cf-label {
font-size: 13px;
font-weight: 600;
color: #1a1a1a;
text-transform: uppercase;
letter-spacing: 0.4px;
}
.cf-optional {
font-weight: 400;
color: #999;
text-transform: none;
letter-spacing: 0;
}
.cf-input {
width: 100%;
padding: 12px 14px;
border: 1px solid #E0E0DF;
background: #fff;
font-family: inherit;
font-size: 15px;
color: #1a1a1a;
outline: none;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
border-radius: 0;
box-sizing: border-box;
}
.cf-input:focus {
border-color: #009A61;
box-shadow: 0 0 0 3px rgba(0, 154, 97, 0.12);
}
.cf-input::placeholder { color: #999; }
.cf-textarea {
resize: vertical;
min-height: 110px;
line-height: 1.5;
font-family: inherit;
}
.cf-hp {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
overflow: hidden;
}
.cf-submit {
align-self: flex-start;
padding: 14px 32px;
background: #009A61;
color: #fff;
font-family: inherit;
font-size: 15px;
font-weight: 600;
border: none;
cursor: pointer;
transition: background 0.15s ease, transform 0.05s ease;
margin-top: 4px;
}
.cf-submit:hover { background: #024731; }
.cf-submit:active { transform: translateY(1px); }
.cf-submit:disabled {
background: #6B6B6B;
cursor: wait;
}
.cf-status {
margin: 0;
padding: 12px 14px;
font-size: 14px;
border-left: 3px solid transparent;
}
.cf-status.is-loading {
background: #f5f5f5;
color: #6B6B6B;
border-color: #ccc;
}
.cf-status.is-success {
background: #f0fdf7;
color: #024731;
border-color: #009A61;
}
.cf-status.is-error {
background: #fff5f5;
color: #c53030;
border-color: #e53e3e;
}
@media (max-width: 600px) {
.cf-form { padding: 24px 20px; }
.cf-row { grid-template-columns: 1fr; }
.cf-submit { width: 100%; align-self: stretch; }
}
.block-hero .hero-title:has(+ .hero-byline) {
margin-bottom: 20px;
}
.block-hero .hero-byline {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 6px 10px;
font-size: clamp(13px, calc(0.72vw + 10.4px), 14px);
line-height: 1.4;
color: #ffffff;
opacity: 0.95;
margin: 0 0 20px;
}
.block-hero .hero-byline,
.block-hero .hero-byline a,
.block-hero .hero-byline span {
font-size: clamp(13px, calc(0.72vw + 10.4px), 14px);
}
.hero-byline-person {
display: inline-flex;
align-items: center;
gap: 4px;
font-weight: 400;
}
.hero-byline-name {
font-weight: 600;
color: inherit;
text-decoration: underline;
text-underline-offset: 2px;
transition: opacity 0.15s;
}
a.hero-byline-name:hover { opacity: 0.75; }
.hero-byline-sep {
opacity: 0.7;
}
.hero-byline-date {
font-weight: 400;
}
.hero-byline-verified {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: help;
margin-left: 2px;
outline: none;
color: #ffffff;
}
.hero-byline-verified svg { display: block; }
.hero-byline-tooltip {
position: absolute;
bottom: calc(100% + 6px);
left: 50%;
transform: translateX(-50%);
background: #024731;
color: #ffffff;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.3px;
white-space: nowrap;
padding: 5px 10px;
border-radius: 3px;
opacity: 0;
pointer-events: none;
transition: opacity 0.15s ease, transform 0.15s ease;
z-index: 5;
}
.hero-byline-tooltip::after {
content: '';
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
border: 4px solid transparent;
border-top-color: #024731;
}
.hero-byline-verified:hover .hero-byline-tooltip,
.hero-byline-verified:focus .hero-byline-tooltip,
.hero-byline-verified:focus-visible .hero-byline-tooltip {
opacity: 1;
transform: translateX(-50%) translateY(-2px);
}
.block-hero.is-centered .hero-byline {
justify-content: center;
}
@media (max-width: 768px) {
.block-hero.has-bg-image .hero-byline {
color: #1a1a2e;
opacity: 1;
}
.block-hero.has-bg-image .hero-byline-name,
.block-hero.has-bg-image .hero-byline-verified {
color: #009A61;
}
.block-hero.has-bg-image .hero-byline-tooltip {
background: #024731;
color: #ffffff;
}
}
.block-team {
background: rgba(0, 154, 97, 0.05);
}
.team-title {
text-align: center;
margin: 0 0 12px;
}
.team-subtitle {
text-align: center;
margin: 0 auto 40px !important;
}
.team-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
.team-grid:has(.team-card.is-expanded) {
grid-template-columns: repeat(3, 1fr);
}
.team-card {
background: #ffffff;
padding: 22px;
display: flex;
flex-direction: column;
gap: 16px;
cursor: pointer;
transition: box-shadow 0.2s ease, transform 0.2s ease;
outline: none;
}
.team-card:hover,
.team-card:focus-visible {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
transform: translateY(-2px);
}
.team-card:focus-visible {
outline: 2px solid #009A61;
outline-offset: 3px;
}
.team-card-photo {
width: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
background: #f0f0f0;
}
.team-card-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.team-card-body {
display: flex;
flex-direction: column;
flex: 1;
}
.team-card-name {
margin: 0 0 4px;
font-size: 20px;
font-weight: 700;
color: #1a1a1a;
line-height: 1.2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
transition: color 0.2s ease;
}
.team-card:hover .team-card-name,
.team-card:focus-visible .team-card-name {
color: #009A61;
}
.team-card-arrow {
flex-shrink: 0;
color: #009A61;
opacity: 0;
transform: translateX(-6px);
transition: opacity 0.2s ease, transform 0.2s ease;
display: inline-flex;
align-items: center;
}
.team-card:hover .team-card-arrow,
.team-card:focus-visible .team-card-arrow {
opacity: 1;
transform: translateX(0);
}
.team-card-position {
margin: 0 0 14px !important;
font-size: 13px;
color: #009A61;
font-weight: 600;
}
.team-slide-email {
display: inline-flex;
align-items: center;
justify-content: center;
color: #009A61;
text-decoration: none;
transition: color 0.2s ease, transform 0.15s ease;
width: fit-content;
line-height: 0;
margin: -4px 0 10px;
}
.team-slide-email svg {
fill: #009A61;
transition: fill 0.2s ease;
}
.team-slide-email:hover {
color: #024731;
transform: translateY(-1px);
}
.team-slide-email:hover svg {
fill: #024731;
}
.team-card-email {
width: 36px;
height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: 1px solid #009A61;
color: #009A61;
text-decoration: none;
cursor: pointer;
transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
padding: 0;
position: relative;
margin: -4px 0 10px;
}
.team-card-email svg {
fill: #009A61;
transition: fill 0.15s ease;
}
.team-card-email:hover {
background: #009A61;
border-color: #009A61;
color: #ffffff;
transform: translateY(-1px);
}
.team-card-email:hover svg {
fill: #ffffff;
}
.team-slide-email {
margin: 4px 0 0;
}
.team-card-bio {
color: #1a1a1a;
font-size: 14px;
line-height: 1.55;
flex: 1;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.team-card-bio p { margin: 0 0 10px; }
.team-card-bio p:last-child { margin-bottom: 0; }
.team-card-bio a { color: #009A61; font-weight: 600; }
.team-card-bio a:hover { color: #024731; }
.team-card-link {
display: none;
align-items: center;
gap: 6px;
margin-top: 20px;
font-size: 14px;
font-weight: 600;
color: #009A61;
border-bottom: 1px solid #009A61;
padding-bottom: 2px;
align-self: flex-start;
transition: color 0.2s ease, border-color 0.2s ease;
}
.team-card-link:hover {
color: #024731;
border-bottom-color: #024731;
}
.team-card-link .arr {
display: inline-block;
transition: transform 0.2s ease;
}
.team-card-link:hover .arr {
transform: translateX(3px);
}
.team-card.is-expanded {
grid-column: 1 / -1;
order: -1;
flex-direction: row;
gap: 36px;
padding: 36px;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
transform: none;
}
.team-card.is-expanded .team-card-photo {
flex-shrink: 0;
width: 280px;
height: 280px;
aspect-ratio: auto;
}
.team-card.is-expanded .team-card-body {
flex: 1;
}
.team-card.is-expanded .team-card-name {
font-size: 28px;
margin-bottom: 6px;
color: #1a1a1a;
}
.team-card.is-expanded .team-card-arrow {
display: none;
}
.team-card.is-expanded .team-card-position {
font-size: 16px;
margin-bottom: 20px !important;
}
.team-card.is-expanded .team-card-bio {
font-size: 15px;
line-height: 1.65;
display: block;
-webkit-line-clamp: unset;
overflow: visible;
}
.team-card.is-expanded .team-card-link {
display: inline-flex;
}
@media (prefers-reduced-motion: no-preference) {
::view-transition-old(root),
::view-transition-new(root) {
animation-duration: 0.22s;
animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
}
@media (max-width: 1180px) {
.team-grid { grid-template-columns: repeat(3, 1fr); }
.team-grid:has(.team-card.is-expanded) {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 900px) {
.team-grid { grid-template-columns: repeat(2, 1fr); }
.team-grid:has(.team-card.is-expanded) {
grid-template-columns: 1fr;
}
.team-card.is-expanded .team-card-photo {
width: 220px;
height: 220px;
}
}
@media (max-width: 600px) {
.team-grid { grid-template-columns: 1fr; gap: 16px; }
.team-card { padding: 20px; }
.team-card.is-expanded {
flex-direction: column;
gap: 20px;
padding: 24px;
order: 0;
}
.team-card.is-expanded .team-card-photo {
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
}
.team-card.is-expanded .team-card-name { font-size: 22px; }
.team-card.is-expanded .team-card-position { font-size: 14px; }
.team-card-arrow {
opacity: 0.6;
transform: translateX(0);
}
}
@media (max-width: 600px) {
.wp-block-group[data-lb-mobile-cols="1"] { grid-template-columns: 1fr !important; }
.wp-block-group[data-lb-mobile-cols="2"] { grid-template-columns: repeat(2, 1fr) !important; }
.wp-block-group[data-lb-mobile-cols="3"] { grid-template-columns: repeat(3, 1fr) !important; }
.wp-block-group[data-lb-mobile-cols="4"] { grid-template-columns: repeat(4, 1fr) !important; }
.wp-block-group[data-lb-mobile-gap="none"] { gap: 0 !important; }
.wp-block-group[data-lb-mobile-gap="small"] { gap: 8px !important; }
.wp-block-group[data-lb-mobile-gap="medium"] { gap: 16px !important; }
.wp-block-group[data-lb-mobile-gap="large"] { gap: 32px !important; }
.wp-block-group[data-lb-mobile-align="start"] { align-items: start !important; }
.wp-block-group[data-lb-mobile-align="center"] { align-items: center !important; }
.wp-block-group[data-lb-mobile-align="end"] { align-items: end !important; }
.wp-block-group[data-lb-mobile-align="stretch"] { align-items: stretch !important; }
.lb-hide-mobile { display: none !important; }
.wp-block-columns.lb-reverse-mobile {
flex-direction: column-reverse !important;
}
}
@media (min-width: 601px) and (max-width: 1024px) {
.wp-block-group[data-lb-tablet-cols="1"] { grid-template-columns: 1fr !important; }
.wp-block-group[data-lb-tablet-cols="2"] { grid-template-columns: repeat(2, 1fr) !important; }
.wp-block-group[data-lb-tablet-cols="3"] { grid-template-columns: repeat(3, 1fr) !important; }
.wp-block-group[data-lb-tablet-cols="4"] { grid-template-columns: repeat(4, 1fr) !important; }
.wp-block-group[data-lb-tablet-gap="none"] { gap: 0 !important; }
.wp-block-group[data-lb-tablet-gap="small"] { gap: 8px !important; }
.wp-block-group[data-lb-tablet-gap="medium"] { gap: 16px !important; }
.wp-block-group[data-lb-tablet-gap="large"] { gap: 32px !important; }
.wp-block-group[data-lb-tablet-align="start"] { align-items: start !important; }
.wp-block-group[data-lb-tablet-align="center"] { align-items: center !important; }
.wp-block-group[data-lb-tablet-align="end"] { align-items: end !important; }
.wp-block-group[data-lb-tablet-align="stretch"] { align-items: stretch !important; }
.lb-hide-tablet { display: none !important; }
}
@media (min-width: 1025px) {
.lb-hide-desktop { display: none !important; }
}
@media (max-width: 600px) {
ul.wp-block-list.lb-mobile-simple,
ol.wp-block-list.lb-mobile-simple,
.site-main ul.wp-block-list.lb-mobile-simple,
.site-main ol.wp-block-list.lb-mobile-simple {
list-style: none !important;
padding-left: 0 !important;
margin: 0 0 16px !important;
background: none !important;
border: none !important;
text-align: left !important;
color: inherit !important;
}
.wp-block-list.lb-mobile-simple li {
position: relative;
display: block;
padding: 10px 0 10px 30px !important;
border-bottom: 1px solid #F5F5F5 !important;
font-size: 16px;
font-weight: 400;
line-height: 1.4;
list-style: none !important;
margin-bottom: 0 !important;
background: none !important;
text-align: left !important;
}
.wp-block-list.lb-mobile-simple li:last-child {
border-bottom: none !important;
}
.wp-block-list.lb-mobile-simple li::before {
content: '';
position: absolute;
left: 0;
top: 12px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
}
@media (min-width: 601px) and (max-width: 1024px) {
ul.wp-block-list.lb-tablet-simple,
ol.wp-block-list.lb-tablet-simple,
.site-main ul.wp-block-list.lb-tablet-simple,
.site-main ol.wp-block-list.lb-tablet-simple {
list-style: none !important;
padding-left: 0 !important;
margin: 0 0 16px !important;
background: none !important;
border: none !important;
text-align: left !important;
color: inherit !important;
}
.wp-block-list.lb-tablet-simple li {
position: relative;
display: block;
padding: 10px 0 10px 32px !important;
border-bottom: 1px solid #F5F5F5 !important;
font-size: 16px;
font-weight: 400;
line-height: 1.4;
list-style: none !important;
margin-bottom: 0 !important;
background: none !important;
text-align: left !important;
}
.wp-block-list.lb-tablet-simple li:last-child {
border-bottom: none !important;
}
.wp-block-list.lb-tablet-simple li::before {
content: '';
position: absolute;
left: 0;
top: 13px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
}
.team-slider-layout {
display: grid;
grid-template-columns: 320px 1fr;
gap: 40px;
align-items: start;
}
.team-slider-text .team-title { text-align: left; margin: 0 0 16px; }
.team-slider-text .team-subtitle { text-align: left; margin: 0 0 24px !important; }
.team-arrows {
display: flex;
gap: 12px;
margin-top: 8px;
}
.team-arr {
width: 44px;
height: 44px;
border: 1.5px solid #009A61;
background: #ffffff;
color: #009A61;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, transform 0.15s ease;
padding: 0;
}
.team-arr:hover:not(:disabled) {
background: #009A61;
color: #ffffff;
}
.team-arr:active:not(:disabled) {
transform: scale(0.94);
}
.team-arr:disabled {
opacity: 0.35;
cursor: not-allowed;
}
.team-slider {
display: flex;
gap: 20px;
overflow-x: auto;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
padding-bottom: 8px;
scrollbar-width: none;
-ms-overflow-style: none;
}
.team-slider::-webkit-scrollbar { display: none; }
.team-slide {
flex: 0 0 240px;
scroll-snap-align: start;
background: #ffffff;
display: flex;
flex-direction: column;
text-decoration: none;
color: inherit;
transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.team-slide.is-link:hover {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
transform: translateY(-2px);
}
.team-slide-photo {
width: 100%;
aspect-ratio: 1 / 1;
overflow: hidden;
background: #f0f0f0;
}
.team-slide-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.team-slide-body {
padding: 20px;
display: flex;
flex-direction: column;
gap: 4px;
}
.team-slide-name {
font-size: 16px;
font-weight: 700;
color: #1a1a1a;
line-height: 1.3;
display: flex;
align-items: center;
gap: 8px;
transition: color 0.2s ease;
}
.team-slide-name-link {
text-decoration: none;
color: inherit;
display: inline-flex;
align-items: center;
gap: 8px;
transition: color 0.2s ease;
}
.team-slide.is-link:hover .team-slide-name-link {
color: #009A61;
}
.team-slide-arrow {
flex-shrink: 0;
color: #009A61;
opacity: 0;
transform: translateX(-4px);
transition: opacity 0.2s ease, transform 0.2s ease;
display: inline-flex;
}
.team-slide.is-link:hover .team-slide-arrow {
opacity: 1;
transform: translateX(0);
}
.team-slide-position {
font-size: 14px;
color: #6B6B6B;
font-weight: 500;
}
.team-dots {
display: none;
justify-content: center;
gap: 8px;
margin-top: 20px;
grid-column: 1 / -1;
}
.team-dot {
width: 8px;
height: 8px;
border-radius: 50%;
border: none;
background: rgba(0, 154, 97, 0.3);
cursor: pointer;
padding: 0;
transition: background 0.2s ease, transform 0.2s ease;
}
.team-dot.is-active {
background: #009A61;
transform: scale(1.4);
}
@media (max-width: 1024px) {
.team-slider-layout {
grid-template-columns: 280px 1fr;
gap: 28px;
}
.team-slide { flex: 0 0 220px; }
}
@media (max-width: 768px) {
.team-slider-layout {
grid-template-columns: 1fr;
gap: 24px;
}
.team-slider-text {
position: static;
text-align: center;
}
.team-slider-text .team-title { text-align: center; }
.team-slider-text .team-subtitle { text-align: center; }
.team-arrows { display: none; }
.team-dots { display: flex; }
.team-slide { flex: 0 0 220px; }
.team-slide-arrow { opacity: 0.6; transform: translateX(0); }
}
.site-main blockquote.wp-block-quote {
position: relative;
background: #024731;
padding: 48px 56px;
margin: 48px 0;
border: none;
font-style: normal;
color: #ffffff;
text-align: center;
}
.site-main blockquote.wp-block-quote p {
font-size: 22px;
line-height: 1.5;
font-weight: 500;
color: #ffffff;
margin: 0 0 70px;
letter-spacing: -0.01em;
max-width: 880px;
margin-left: auto;
margin-right: auto;
}
.site-main blockquote.wp-block-quote p:last-of-type:not(:has(+ .aq-author)) {
margin-bottom: 0;
}
.site-main blockquote.wp-block-quote .aq-author {
background: #ffffff;
margin: 48px -56px -48px;
padding: 28px 24px 32px;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
}
.site-main blockquote.wp-block-quote .aq-photo {
width: 88px;
height: 88px;
border-radius: 50%;
overflow: hidden;
background: #f0f0f0;
margin-top: -72px;
border: 4px solid #ffffff;
}
.site-main blockquote.wp-block-quote .aq-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.site-main blockquote.wp-block-quote .aq-mark {
display: inline-flex;
margin-top: 4px;
}
.site-main blockquote.wp-block-quote .aq-name {
margin: 0;
font-size: 18px;
font-weight: 700;
color: #1a1a1a;
line-height: 1.2;
}
.site-main blockquote.wp-block-quote .aq-share {
display: flex;
align-items: center;
gap: 10px;
margin-top: 8px;
}
.site-main blockquote.wp-block-quote .aq-share-label {
font-size: 13px;
color: #6B6B6B;
font-weight: 600;
margin-right: 4px;
}
.site-main blockquote.wp-block-quote .aq-share-link {
width: 32px;
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #009A61;
border: 1.5px solid #009A61;
transition: background 0.2s ease, color 0.2s ease;
}
.site-main blockquote.wp-block-quote .aq-share-link:hover {
background: #009A61;
color: #ffffff;
}
.site-main .wp-block-pullquote {
position: relative;
background: #024731;
padding: 56px 48px;
margin: 56px 0;
border: none;
color: #ffffff;
text-align: center;
}
.site-main .wp-block-pullquote blockquote {
margin: 0;
padding: 0;
border: none;
background: none;
max-width: 760px;
margin-left: auto;
margin-right: auto;
}
.site-main .wp-block-pullquote p {
font-size: 28px;
line-height: 1.35;
font-weight: 600;
color: #ffffff;
margin: 0;
}
.site-main .wp-block-pullquote cite {
display: block;
margin-top: 24px;
font-size: 14px;
font-weight: 600;
font-style: normal;
color: #C7FFC6;
letter-spacing: 0.3px;
}
.site-main .wp-block-pullquote cite::before {
content: '— ';
color: #C7FFC6;
}
@media (max-width: 768px) {
.site-main blockquote.wp-block-quote {
padding: 32px 24px;
margin: 36px 0;
}
.site-main blockquote.wp-block-quote p {
font-size: 17px;
}
.site-main blockquote.wp-block-quote .aq-author {
margin: 32px -24px -32px;
padding: 24px 20px 28px;
}
.site-main blockquote.wp-block-quote .aq-photo {
width: 100px;
height: 100px;
margin-top: -70px;
}
.site-main blockquote.wp-block-quote .aq-name {
font-size: 17px;
}
.site-main .wp-block-pullquote {
padding: 40px 24px;
}
.site-main .wp-block-pullquote p {
font-size: 20px;
}
}
.tabs-block {
width: 100%;
}
.tabs-nav {
display: inline-flex;
flex-wrap: wrap;
gap: 4px;
padding: 6px;
background: #F5F5F5;
margin-bottom: 36px;
max-width: 100%;
}
.tabs-nav-btn {
background: transparent;
border: none;
padding: 12px 22px;
font-family: inherit;
font-size: 15px;
font-weight: 600;
color: #6B6B6B;
cursor: pointer;
transition: background 0.18s ease, color 0.18s ease;
white-space: nowrap;
letter-spacing: -0.005em;
display: inline-flex;
align-items: center;
gap: 10px;
}
.tabs-nav-icon {
width: 18px;
height: 18px;
flex-shrink: 0;
object-fit: contain;
display: block;
}
.tabs-nav-btn:hover {
color: #024731;
background: rgba(0, 154, 97, 0.08);
}
.tabs-nav-btn.is-active {
color: #ffffff;
background: #024731;
}
.tabs-nav-btn.is-active:hover {
background: #024731;
color: #ffffff;
}
.tabs-block .tab-panel {
display: none;
animation: tabFadeIn 0.25s ease;
}
.tabs-block .tab-panel.is-active {
display: block;
}
@keyframes tabFadeIn {
from { opacity: 0; transform: translateY(4px); }
to { opacity: 1; transform: translateY(0); }
}
.editor-styles-wrapper .tabs-block .tab-panel,
.is-root-container .tabs-block .tab-panel {
display: block;
animation: none;
}
.editor-styles-wrapper .tabs-block > .acf-innerblocks-container > .wp-block[data-type="acf/tab"]:not(:first-child),
.is-root-container .tabs-block > .acf-innerblocks-container > .wp-block[data-type="acf/tab"]:not(:first-child) {
border-top: 1px dashed #E0E0DF;
margin-top: 16px;
padding-top: 16px;
}
.tabs-block[data-orientation="vertical"] {
display: grid;
grid-template-columns: 260px 1fr;
gap: 40px;
align-items: start;
}
.tabs-block[data-orientation="vertical"] .tabs-nav {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
gap: 4px;
padding: 6px;
background: #F5F5F5;
margin-bottom: 0;
position: sticky;
top: 20px;
width: 100%;
max-width: 100%;
}
.tabs-block[data-orientation="vertical"] .tabs-nav-btn {
text-align: left;
width: 100%;
white-space: normal;
padding: 14px 18px;
}
.editor-styles-wrapper .tabs-block[data-orientation="vertical"],
.is-root-container .tabs-block[data-orientation="vertical"] {
display: block;
}
@media (max-width: 768px) {
.tabs-nav {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
overflow: visible;
gap: 4px;
width: 100%;
max-width: 100%;
}
.tabs-nav-btn {
padding: 12px 18px;
font-size: 15px;
flex-shrink: 0;
width: 100%;
text-align: left;
white-space: normal;
}
.tabs-block[data-orientation="vertical"] {
grid-template-columns: 1fr;
gap: 24px;
}
.tabs-block[data-orientation="vertical"] .tabs-nav {
position: static;
flex-direction: column;
}
.tabs-block[data-orientation="vertical"] .tabs-nav-btn {
white-space: normal;
text-align: left;
width: 100%;
padding: 12px 18px;
}
}
.block-author-card.has-bg-transparent { background: transparent; }
.block-author-card.has-bg-white { background: #ffffff; }
.block-author-card.has-bg-light { background: #F5F5F5; }
.block-author-card.has-bg-mint { background: rgba(0, 154, 97, 0.05); }
.block-author-card.has-bg-dark { background: #024731; }
.author-card-section-title {
margin: 0 0 32px;
font-weight: 700;
color: #1a1a1a;
line-height: 1.2;
}
.author-card-section-title.align-left { text-align: left; }
.author-card-section-title.align-center { text-align: center; }
.author-card-section-title.align-right { text-align: right; }
.block-author-card.has-bg-dark .author-card-section-title { color: #ffffff; }
.block-author-card.has-bg-transparent .author-card,
.block-author-card.has-bg-white .author-card {
border: 2px solid var(--wp--preset--color--background-alt);
}
.author-card {
display: grid;
grid-template-columns: 200px 1fr 320px;
gap: 30px;
align-items: start;
background: #ffffff;
padding: 30px;
color: inherit;
transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.author-card.is-link:hover {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
}
a.author-card-name-link {
text-decoration: none;
color: inherit;
display: inline-flex;
align-items: center;
gap: 10px;
transition: color 0.2s ease;
}
a.author-card-name-link:hover {
color: #024731;
}
.author-card-arrow {
display: inline-flex;
color: #009A61;
opacity: 0;
transform: translateX(-6px);
transition: opacity 0.2s ease, transform 0.2s ease;
}
.author-card.is-link:hover .author-card-arrow {
opacity: 1;
transform: translateX(0);
}
.author-card-position {
font-size: 16px;
color: #6B6B6B;
font-weight: 500;
}
.author-card-email {
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 10px;
color: #009A61;
text-decoration: none;
transition: color 0.2s ease, transform 0.15s ease;
width: fit-content;
}
.author-card-email:hover {
color: #024731;
transform: translateY(-1px);
}
.author-card-photo {
width: 200px;
height: 100%;
overflow: hidden;
background: #F5F5F5;
}
.author-card-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.author-card-main {
min-width: 0;
}
.author-card-header {
border-bottom: 1px solid #E0E0DF;
padding-bottom: 16px;
margin-bottom: 20px;
}
.author-card-name {
margin: 0 0 4px;
font-size: 20px;
font-weight: 600;
color: #009A61;
line-height: 1.2;
display: flex;
align-items: center;
gap: 10px;
}
.author-card-bio {
font-size: 16px;
line-height: 1.6;
color: #1a1a1a;
}
.author-card-bio p {
margin: 0;
}
.author-card-bio p + p {
margin-top: 12px;
}
.author-card-credentials {
background: #F5F5F5;
padding: 20px;
height: 100%;
display: flex;
align-items: center;
}
.author-card-credentials ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.author-card-credentials li {
display: flex;
align-items: flex-start;
gap: 12px;
font-size: 15px;
line-height: 1.45;
color: #1a1a1a;
font-weight: 500;
}
.author-card-check {
flex-shrink: 0;
display: inline-flex;
margin-top: 2px;
}
@media (max-width: 1024px) {
.author-card {
grid-template-columns: 200px 1fr;
gap: 28px;
}
.author-card-photo {
width: 200px;
height: 200px;
}
.author-card-credentials {
grid-column: 1 / -1;
}
}
@media (max-width: 768px) {
.author-card {
grid-template-columns: 1fr;
gap: 24px;
padding: 28px 24px;
text-align: center;
}
.author-card-photo {
width: 220px;
height: 220px;
margin: 0 auto;
}
.author-card-header {
text-align: center;
}
.author-card-name {
font-size: 18px;
justify-content: center;
}
.author-card-bio {
text-align: left;
}
.author-card-credentials {
text-align: left;
}
.author-card.is-link .author-card-arrow {
opacity: 0.7;
transform: translateX(0);
}
}
.trust-badges {
margin-top: 36px;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
}
.trust-badges-label {
font-size: 12px;
font-weight: 600;
letter-spacing: 1.4px;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.7);
}
.hero:not(.has-bg-image):not(.has-overlay) .trust-badges-label,
.hero-content-light .trust-badges-label {
color: #6B6B6B;
}
.trust-badges-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-wrap: wrap;
align-items: stretch;
justify-content: flex-start;
gap: 12px;
}
.trust-badges-item {
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
background: hsl(0deg 0% 100% / 10%);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
padding: 10px;
height: 80px;
transition: background 0.2s ease, transform 0.2s ease;
width: 80px;
}
.trust-badges-item:hover {
background: rgba(255, 255, 255, 1);
transform: translateY(-2px);
}
.trust-badges-item a {
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
width: 100%;
height: 100%;
}
.trust-badges-item img {
height: 55px;
width: 55px;
object-fit: contain;
display: block;
}
.hero-center .trust-badges,
.hero-content-center .trust-badges {
align-items: center;
}
.hero-center .trust-badges-list,
.hero-content-center .trust-badges-list {
justify-content: center;
}
@media (max-width: 768px) {
.trust-badges {
margin-top: 28px;
align-items: center;
gap: 10px;
}
.trust-badges-list {
justify-content: center;
gap: 10px;
}
.trust-badges-item {
width: 64px;
height: 64px;
padding: 8px;
}
.trust-badges-item img {
width: 44px;
height: 44px;
}
}
.site-main sup a,
.site-main .fn a {
color: #009A61;
text-decoration: none;
padding: 0;
margin-left: 5px;
position: relative;
bottom: 5px;
font-weight: 600;
transition: background 0.15s ease, color 0.15s ease;
font-size: 10px;
}
.site-main sup a:hover,
.site-main .fn a:hover {
color: #ffffff;
}
.site-main sup a:focus-visible,
.site-main .fn a:focus-visible {
outline: 2px solid #009A61;
outline-offset: 2px;
}
.reviews-note {
margin-top: 32px;
font-size: 14px;
line-height: 1.6;
color: #6a6a6a;
font-style: italic;
text-align: center;
}
.reviews-note p {
margin: 0 0 8px;
}
.reviews-note p:last-child {
margin-bottom: 0;
}
.reviews-note a {
color: #009A61;
text-decoration: underline;
}
.reviews-note a:hover {
color: #024731;
}
@media (max-width: 768px) {
.reviews-note {
margin-top: 24px;
font-size: 13px;
text-align: center;
}
}
.single-post .post-hero {
position: relative;
padding: 90px 0;
color: #ffffff;
background-color: #1a1a1a;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
overflow: hidden;
}
.single-post .post-hero:not(.has-bg) {
background-color: #024731;
}
.single-post .post-hero.has-bg {
background-image: var(--post-hero-bg);
}
@media (max-width: 600px) {
.single-post .post-hero.has-bg {
background-image: var(--post-hero-bg-mobile, var(--post-hero-bg));
}
}
.post-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 1) 100%);
z-index: 0;
}
.post-hero-inner {
position: relative;
z-index: 1;
text-align: center;
}
.post-hero-title {
font-size: 44px;
font-weight: 700;
line-height: 1.15;
margin: 0 auto 36px;
color: #ffffff;
}
.post-hero-divider {
height: 1px;
background: rgba(255, 255, 255, 0.25);
margin: 0 auto;
max-width: 560px;
}
.post-hero-meta {
display: flex;
align-items: center;
justify-content: center;
gap: 14px;
padding: 22px 0;
flex-wrap: wrap;
}
.post-hero-author-photo {
flex-shrink: 0;
width: 44px;
height: 44px;
border-radius: 50%;
overflow: hidden;
}
.post-hero-author-photo img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.post-hero-meta-text {
display: flex;
flex-direction: column;
text-align: left;
font-size: 14px;
line-height: 1.4;
color: rgba(255, 255, 255, 0.85);
}
.post-hero-byline {
color: #ffffff;
font-weight: 600;
display: inline-flex;
align-items: center;
gap: 6px;
}
.post-hero-author-name {
color: var(--wp--preset--color--primary);
text-decoration: underline;
text-underline-offset: 3px;
font-weight: 600;
}
.post-hero-author-name:hover {
color: #ffffff;
}
.post-hero-verified {
display: inline-flex;
align-items: center;
color: #009A61;
}
.post-hero-verified svg,
.post-hero-verified svg path {
fill: #009A61;
}
.post-hero-verified svg {
width: 15px;
height: 15px;
}
.post-hero-pubdate {
color: rgba(255, 255, 255, 0.8);
font-weight: 400;
font-size: 13px;
}
.post-hero-meta-sep {
margin: 0 4px;
opacity: 0.6;
}
.post-hero-share {
display: flex;
gap: 8px;
margin-left: 16px;
padding-left: 16px;
border-left: 1px solid rgba(255, 255, 255, 0.2);
}
.post-hero-share-btn {
width: 36px;
height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.25);
color: #ffffff;
cursor: pointer;
transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
padding: 0;
position: relative;
}
.post-hero-share-btn:hover {
background: #ffffff;
color: #024731;
border-color: #ffffff;
transform: translateY(-1px);
}
.post-hero-share-btn .post-share-copied {
position: absolute;
bottom: calc(100% + 6px);
left: 50%;
transform: translateX(-50%);
background: #ffffff;
color: #024731;
font-size: 12px;
padding: 4px 10px;
border-radius: 4px;
opacity: 0;
pointer-events: none;
white-space: nowrap;
transition: opacity 0.2s ease;
font-weight: 600;
}
.post-hero-share-btn.is-copied .post-share-copied {
opacity: 1;
}
.post-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) 280px;
gap: 60px;
padding: 40px 0 60px;
align-items: stretch;
}
.post-content {
max-width: 100%;
min-width: 0;
overflow-x: clip;
overflow-wrap: break-word;
word-wrap: break-word;
font-size: 17px;
line-height: 1.7;
color: #1a1a1a;
}
.post-content .container {
max-width: 100%;
padding-left: 0 !important;
padding-right: 0 !important;
}
.post-content > * {
margin-bottom: 1.2em;
}
.post-content h2 {
font-size: 28px;
font-weight: 700;
margin: 1.8em 0 0.6em;
scroll-margin-top: 80px;
}
.post-content h3 {
font-size: 22px;
font-weight: 600;
margin: 1.4em 0 0.5em;
}
.post-content a {
color: #009A61;
text-decoration: underline;
text-underline-offset: 3px;
}
.post-content img {
max-width: 100%;
height: auto;
}
.post-content blockquote {
border-left: 3px solid #009A61;
padding: 8px 0 8px 20px;
margin: 1.6em 0;
color: #4a4a4a;
font-style: italic;
}
.post-sidebar-inner {
position: sticky;
top: 100px;
}
.post-toc {
border-left: 3px solid var(--wp--preset--color--primary);
padding-left: 20px;
}
.post-toc-heading {
display: block;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: #6a6a6a;
margin-bottom: 14px;
}
.post-toc-list {
list-style: none;
padding: 0;
margin: 0;
}
.post-toc-list li {
margin: 0 0 10px;
}
.post-toc-list a {
color: #000 !important;
text-decoration: none;
font-size: 16px;
line-height: 1.4;
transition: color 0.15s ease;
display: block;
}
.post-toc-list a:hover,
.post-toc-list a.is-active {
color: var(--wp--preset--color--primary) !important;
font-weight: 600;
}
.post-stats {
background: #ffffff;
padding: 64px 0;
}
.post-stats-inner {
text-align: center;
}
.post-stats-title {
font-size: 36px;
line-height: 1.15;
font-weight: 800;
color: #111111;
margin: 0 0 16px;
}
.post-stats-intro {
max-width: 760px;
margin: 0 auto 44px;
color: #333333;
font-size: 17px;
line-height: 1.6;
}
.post-stats-intro a {
color: inherit;
text-decoration: underline;
}
.post-stats-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1px;
overflow: hidden;
}
.post-stat {
background: var(--wp--preset--color--primary);
padding: 34px 18px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
}
.post-stat-number {
font-size: 32px;
line-height: 1;
font-weight: 500;
color: var(--wp--preset--color--accent);
}
.post-stat-label {
color: rgb(255, 255, 255);
}
.post-stats-actions {
margin-top: 44px;
display: flex;
flex-direction: column;
align-items: center;
gap: 18px;
}
.post-stats-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 280px;
padding: 17px 40px;
background: #009A61;
color: #ffffff;
font-weight: 600;
font-size: 16px;
transition: background 0.15s ease;
}
.post-stats-btn:hover {
background: #024731;
}
.post-stats-link {
color: #111111;
font-weight: 600;
font-size: 16px;
text-decoration: underline;
text-underline-offset: 4px;
}
.post-stats-arrow {
text-decoration: none;
display: inline-block;
}
@media (max-width: 768px) {
.post-stats {
padding: 48px 0;
}
.post-stats-title {
font-size: 28px;
}
.post-stats-grid {
grid-template-columns: 1fr;
}
.post-stat {
padding: 28px 14px;
}
.post-stat-number {
font-size: 34px;
}
}
.post-newsletter {
background: #024731;
padding: 60px 0;
color: #ffffff;
margin-top: 40px;
position: relative;
overflow: hidden;
}
.post-newsletter::before {
content: '';
position: absolute;
bottom: 0;
right: -120px;
width: 430px;
height: 350px;
background: url(assets/paw.svg) no-repeat center / contain;
transform: rotate(-18deg);
mix-blend-mode: screen;
opacity: 0.14;
pointer-events: none;
z-index: 0;
}
.post-newsletter-inner {
text-align: center;
max-width: 600px;
position: relative;
z-index: 1;
}
.post-newsletter-title {
font-size: 28px;
font-weight: 700;
margin: 0 0 12px;
color: #ffffff;
}
.post-newsletter-text {
color: rgba(255, 255, 255, 0.85);
margin: 0 0 28px;
}
.post-newsletter-form {
display: flex;
gap: 8px;
max-width: 460px;
margin: 0 auto;
}
.post-newsletter-form input {
flex: 1;
padding: 14px 18px;
border: 1.5px solid rgba(255, 255, 255, 0.3);
background: rgba(255, 255, 255, 0.1);
color: #ffffff;
font-size: 15px;
outline: none;
transition: border-color 0.15s ease, background 0.15s ease;
}
.post-newsletter-form input::placeholder {
color: rgba(255, 255, 255, 0.5);
}
.post-newsletter-form input:focus {
border-color: #6CF479;
background: rgba(255, 255, 255, 0.18);
}
.post-newsletter-btn {
padding: 14px 28px;
background: #6CF479;
color: #024731;
border: none;
font-weight: 600;
font-size: 15px;
cursor: pointer;
transition: background 0.15s ease;
}
.post-newsletter-btn:hover {
background: #ffffff;
}
.post-newsletter-success {
margin-top: 20px;
color: #6CF479;
font-size: 15px;
}
.post-related {
padding: 60px 0 80px;
background: #F5F5F5;
}
.post-related-title {
font-size: 26px;
font-weight: 700;
margin: 0 0 28px;
text-align: center;
}
.post-related-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 24px;
}
.post-related-card {
background: #ffffff;
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.post-related-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.post-related-image {
aspect-ratio: 16 / 10;
overflow: hidden;
}
.post-related-image img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.blog-card-image picture,
.post-related-image picture {
display: block;
width: 100%;
height: 100%;
}
.post-related-body {
padding: 20px;
}
.post-related-card-title {
font-size: 18px;
font-weight: 600;
line-height: 1.3;
margin: 0 0 12px;
color: #1a1a1a;
}
.post-related-meta {
font-size: 13px;
color: #6a6a6a;
}
.blog-archive-header {
padding: 60px 0 40px;
text-align: center;
}
.blog-archive-title {
font-size: 44px;
font-weight: 700;
margin: 0 0 16px;
}
.blog-archive-intro {
max-width: 640px;
margin: 0 auto;
color: #4a4a4a;
font-size: 17px;
line-height: 1.6;
}
.blog-archive-list {
padding-bottom: 80px;
display: flex;
flex-direction: column;
gap: 32px;
}
.blog-card {
display: block;
background: var(--wp--preset--color--background-alt, #F5F5F5);
border-radius: 12px;
overflow: hidden;
}
.blog-card-link {
display: grid;
grid-template-columns: 360px 1fr;
gap: 0;
text-decoration: none;
color: inherit;
align-items: stretch;
}
.blog-card-body {
padding: 28px 32px;
}
.blog-card-image {
position: relative;
overflow: hidden;
}
.blog-card-image img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: var(--card-focus, 50% 50%);
display: block;
transition: transform 0.4s ease;
}
.blog-card:hover .blog-card-image img {
transform: scale(1.04);
}
.blog-card-flag {
display: inline-block;
background: #6CF479;
color: #024731;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
padding: 4px 10px;
margin-bottom: 12px;
}
.blog-card-title {
font-size: 24px;
font-weight: 700;
line-height: 1.3;
margin: 0 0 12px;
color: #1a1a1a;
transition: color 0.15s ease;
}
.blog-card:hover .blog-card-title {
color: #009A61;
}
.blog-card-excerpt {
color: #4a4a4a;
font-size: 16px;
line-height: 1.6;
margin-bottom: 16px;
}
.blog-card-meta {
font-size: 13px;
color: #000000;
font-weight: 700;
display: flex;
flex-wrap: wrap;
gap: 6px;
align-items: center;
}
.blog-card--sticky .blog-card-link {
grid-template-columns: 1fr;
gap: 0;
}
.blog-card--sticky .blog-card-image {
aspect-ratio: 21 / 9;
}
.blog-card--sticky .blog-card-title {
font-size: 32px;
}
.blog-archive-list .wp-block-query-pagination,
.blog-archive-list .pagination,
.blog-archive-list nav.navigation {
margin-top: 40px;
display: flex;
justify-content: center;
gap: 8px;
}
.blog-archive-list .nav-links {
display: flex;
gap: 8px;
flex-wrap: wrap;
justify-content: center;
}
.blog-archive-list .page-numbers {
padding: 10px 16px;
border: 1.5px solid #E0E0DF;
color: #4a4a4a;
text-decoration: none;
font-weight: 500;
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.blog-archive-list .page-numbers:hover {
background: #009A61;
color: #ffffff;
border-color: #009A61;
}
.blog-archive-list .page-numbers.current {
background: #009A61;
color: #ffffff;
border-color: #009A61;
}
.blog-archive-list .page-numbers.dots {
border: none;
background: transparent;
}
.blog-empty {
text-align: center;
color: #6a6a6a;
padding: 60px 0;
}
@media (max-width: 1024px) {
.post-grid {
grid-template-columns: minmax(0, 1fr);
gap: 40px;
}
.post-sidebar {
order: -1;
}
.post-sidebar-inner {
position: static;
}
.post-toc {
background: #F5F5F5;
border-left: none;
border-radius: 0;
padding: 20px;
}
}
@media (max-width: 768px) {
.single-post .post-hero {
padding: 60px 0;
}
.post-hero-title {
font-size: 26px;
margin-bottom: 24px;
}
.post-hero-meta {
padding: 18px 0;
gap: 12px;
}
.post-hero-author-photo {
width: 36px;
height: 36px;
}
.post-hero-meta-text {
font-size: 13px;
}
.post-hero-pubdate {
font-size: 12px;
}
.post-hero-share {
margin-left: 0;
padding-left: 0;
border-left: none;
width: 100%;
justify-content: center;
padding-top: 14px;
border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.post-hero-share-btn {
width: 34px;
height: 34px;
}
.post-content {
font-size: 16px;
}
.post-content h2 {
font-size: 22px;
}
.post-content h3 {
font-size: 18px;
}
.blog-archive-title {
font-size: 30px;
}
.blog-card-link {
grid-template-columns: 1fr;
gap: 0;
}
.blog-card-image {
aspect-ratio: 16 / 10;
}
.blog-card-body {
padding: 20px;
}
.blog-card-title {
font-size: 20px;
}
.blog-card--sticky .blog-card-title {
font-size: 24px;
}
.post-newsletter-form {
flex-direction: column;
}
.post-newsletter-btn {
width: 100%;
}
.post-newsletter-title {
font-size: 22px;
}
}
.is-style-info-pills {
list-style: none;
padding: 0;
margin: 0 0 24px;
display: flex;
flex-direction: column;
gap: 8px;
}
.is-style-info-pills li {
list-style: none;
padding: 14px 24px 14px 18px;
background: #F5F5F5;
border-radius: 999px;
display: inline-flex;
align-items: center;
font-size: 15px;
font-weight: 500;
line-height: 1.3;
margin-bottom: 0;
}
.is-style-info-pills li:last-child {
margin-bottom: 0;
}
.is-style-info-pills li::before {
content: '';
flex-shrink: 0;
width: 22px;
height: 22px;
margin-right: 10px;
border-radius: 50%;
background-color: #009A61;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 1.999C17.524 1.999 22.002 6.477 22.002 12.001 22.002 17.524 17.524 22.002 12 22.002 6.476 22.002 1.998 17.524 1.998 12.001 1.998 6.477 6.476 1.999 12 1.999Zm-.004 8.25c-.513 0-.935.387-.993.884l-.006.117.004 5.5.007.117c.058.497.481.883.994.883.513 0 .936-.386.993-.883l.007-.117-.004-5.5-.007-.117c-.058-.497-.481-.884-.994-.884Zm.004-3.749c-.691 0-1.252.56-1.252 1.252 0 .691.561 1.252 1.252 1.252.692 0 1.252-.561 1.252-1.252 0-.691-.56-1.252-1.252-1.252Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 14px;
}
@media (max-width: 600px) {
.is-style-info-pills li {
padding: 12px 18px 12px 14px;
font-size: 14px;
width: 100%;
text-align: left;
}
.is-style-info-pills li::before {
width: 18px;
height: 18px;
margin-right: 8px;
background-size: 12px;
}
}
.block-info-list {
padding-bottom: 30px;
}
.block-info-list.info-list--bg-light {
background: #F5F5F5;
padding: 30px 20px;
}
.block-info-list.info-list--bg-mint {
background: #C7FFC6;
padding: 32px 28px;
}
.block-info-list.has-bottom-border {
border-bottom: 1px solid #E0E0DF;
padding-bottom: 55px;
margin-bottom: 36px;
}
.block-info-list.info-list--bg-light.has-bottom-border,
.block-info-list.info-list--bg-mint.has-bottom-border {
border-bottom: none;
margin-bottom: 36px;
}
.info-list-title {
font-size: 24px;
font-weight: 700;
margin: 0 0 18px;
line-height: 1.3;
}
.info-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 12px;
}
.info-list-item {
list-style: none;
position: relative;
padding-left: 32px;
line-height: 1.5;
color: #1a1a1a;
font-size: 16px;
margin: 0;
}
.info-list-item::before {
content: '';
position: absolute;
left: 0;
top: 2px;
width: 20px;
height: 20px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 1.999C17.524 1.999 22.002 6.477 22.002 12.001 22.002 17.524 17.524 22.002 12 22.002 6.476 22.002 1.998 17.524 1.998 12.001 1.998 6.477 6.476 1.999 12 1.999Zm-.004 8.25c-.513 0-.935.387-.993.884l-.006.117.004 5.5.007.117c.058.497.481.883.994.883.513 0 .936-.386.993-.883l.007-.117-.004-5.5-.007-.117c-.058-.497-.481-.884-.994-.884Zm.004-3.749c-.691 0-1.252.56-1.252 1.252 0 .691.561 1.252 1.252 1.252.692 0 1.252-.561 1.252-1.252 0-.691-.56-1.252-1.252-1.252Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
.info-list-item a {
color: #009A61;
text-decoration: underline;
}
@media (max-width: 600px) {
.block-info-list.info-list--bg-light,
.block-info-list.info-list--bg-mint {
padding: 24px 20px;
}
.info-list-title {
font-size: 20px;
}
.info-list-item {
font-size: 15px;
padding-left: 28px;
}
.info-list-item::before {
width: 20px;
height: 20px;
background-size: 12px;
}
}
.post-resources {
margin-top: 48px;
padding: 28px 32px;
background: #F5F5F5;
border-left: 3px solid #009A61;
}
.post-resources-title {
font-size: 18px;
font-weight: 700;
margin: 0 0 16px;
color: #1a1a1a;
}
.post-resources-list {
margin: 0;
padding-left: 20px;
list-style: decimal;
}
.post-resources-item {
font-size: 15px;
line-height: 1.6;
color: #4a4a4a;
margin: 0 0 8px;
word-break: break-word;
}
.post-resources-item:last-child {
margin-bottom: 0;
}
.post-resources-item a {
color: #009A61;
text-decoration: underline;
text-underline-offset: 2px;
transition: color 0.15s ease;
}
.post-resources-item a:hover {
color: #024731;
}
@media (max-width: 768px) {
.post-resources {
padding: 22px 20px;
margin-top: 36px;
}
.post-resources-title {
font-size: 16px;
}
.post-resources-item {
font-size: 14px;
}
}
.post-back-to-top {
display: inline-flex;
align-items: center;
gap: 8px;
margin-top: 24px;
margin-left: auto;
padding: 0;
background: none;
border: none;
font-family: inherit;
font-size: 14px;
font-weight: 600;
color: #009A61;
cursor: pointer;
transition: color 0.15s ease, opacity 0.25s ease, visibility 0.25s ease;
align-self: flex-end;
opacity: 0;
visibility: hidden;
}
.post-sidebar-inner {
display: flex;
flex-direction: column;
align-items: stretch;
}
.post-back-to-top.is-visible {
opacity: 1;
visibility: visible;
}
.post-back-to-top svg {
transition: transform 0.2s ease;
}
.post-back-to-top:hover {
color: #024731;
}
.post-back-to-top:hover svg {
transform: translateY(-3px);
}
@media (max-width: 1024px) {
.post-back-to-top {
display: none;
}
}
.post-toc-mobile {
display: none;
}
@media (max-width: 1024px) {
.post-sidebar {
display: none;
}
.post-toc-mobile {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 90;
display: flex;
background: #ffffff;
border-top: 1px solid #E0E0DF;
box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
transform: translateY(100%);
transition: transform 0.3s ease;
padding-bottom: env(safe-area-inset-bottom, 0);
}
.post-toc-mobile.is-visible {
transform: translateY(0);
}
.post-toc-mobile-btn {
flex: 1;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 16px 12px;
background: none;
border: none;
font-family: inherit;
font-size: 15px;
font-weight: 600;
color: #1a1a1a;
cursor: pointer;
transition: background 0.15s ease, color 0.15s ease;
}
.post-toc-mobile-btn svg {
flex-shrink: 0;
color: #009A61;
}
.post-toc-mobile-open {
border-right: 1px solid #E0E0DF;
}
.post-toc-mobile-btn:active {
background: #F5F5F5;
}
.post-toc-sheet[hidden] {
display: none;
}
.post-toc-sheet {
position: fixed;
inset: 0;
z-index: 200;
}
.post-toc-sheet-backdrop {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.45);
opacity: 0;
transition: opacity 0.3s ease;
}
.post-toc-sheet.is-open .post-toc-sheet-backdrop {
opacity: 1;
}
.post-toc-sheet-panel {
position: absolute;
left: 0;
right: 0;
bottom: 0;
background: #ffffff;
border-radius: 16px 16px 0 0;
max-height: 70vh;
display: flex;
flex-direction: column;
transform: translateY(100%);
transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
padding-bottom: env(safe-area-inset-bottom, 0);
}
.post-toc-sheet.is-open .post-toc-sheet-panel {
transform: translateY(0);
}
.post-toc-sheet-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 20px 12px;
border-bottom: 1px solid #F5F5F5;
flex-shrink: 0;
}
.post-toc-sheet-title {
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: #6a6a6a;
}
.post-toc-sheet-close {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
background: none;
border: none;
color: #1a1a1a;
cursor: pointer;
padding: 0;
margin: -6px -6px -6px 0;
}
.post-toc-sheet-list {
list-style: none;
margin: 0;
padding: 8px 0 16px;
overflow-y: auto;
}
.post-toc-sheet-list li {
margin: 0;
}
.post-toc-sheet-list a {
display: block;
padding: 14px 20px;
font-size: 16px;
line-height: 1.4;
color: #1a1a1a;
text-decoration: none;
border-left: 3px solid transparent;
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.post-toc-sheet-list a:active {
background: #F5F5F5;
}
.post-toc-sheet-list a.is-active {
color: #009A61;
font-weight: 600;
border-left-color: #009A61;
background: rgba(0, 154, 97, 0.06);
}
}
.error-404 {
padding: 96px 0 110px;
}
.error-404-inner {
max-width: 600px;
margin: 0 auto;
text-align: center;
}
.error-404-code {
font-size: 110px;
line-height: 1;
font-weight: 800;
color: #009A61;
margin: 0;
letter-spacing: -0.02em;
}
.error-404-title {
font-size: 32px;
font-weight: 700;
color: #1a1a1a;
margin: 8px 0 14px;
}
.error-404-text {
color: #4a4a4a;
font-size: 17px;
line-height: 1.6;
max-width: 520px;
margin: 0 auto 32px;
}
.error-404-search-wrap {
margin-bottom: 24px;
}
.live-search {
position: relative;
max-width: 440px;
margin: 0 auto;
}
.live-search-form {
display: flex;
border: 1px solid #d8d8d8;
border-radius: 8px;
overflow: hidden;
background: #ffffff;
transition: border-color 0.15s ease;
}
.live-search-form:focus-within {
border-color: #009A61;
}
.live-search-input {
flex: 1;
min-width: 0;
border: 0;
outline: none;
padding: 0 16px;
height: 52px;
font-size: 16px;
color: #1a1a1a;
background: transparent;
}
.live-search-input::placeholder {
color: #9a9a9a;
}
.live-search-btn {
display: flex;
align-items: center;
justify-content: center;
width: 56px;
flex-shrink: 0;
border: 0;
background: #009A61;
color: #ffffff;
cursor: pointer;
transition: background 0.15s ease;
}
.live-search-btn:hover {
background: #024731;
}
.live-search-results {
position: absolute;
top: calc(100% + 6px);
left: 0;
right: 0;
z-index: 60;
background: #ffffff;
border: 1px solid #e6e6e6;
border-radius: 8px;
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
overflow: hidden;
text-align: left;
}
.live-search-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 12px 16px;
text-decoration: none;
color: #1a1a1a;
border-bottom: 1px solid #f0f0f0;
}
.live-search-item:last-child {
border-bottom: 0;
}
.live-search-item:hover,
.live-search-item.is-active {
background: rgba(0, 154, 97, 0.07);
}
.live-search-item-title {
font-size: 15px;
font-weight: 600;
line-height: 1.35;
}
.live-search-item-type {
flex-shrink: 0;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #009A61;
}
.live-search-empty {
padding: 14px 16px;
font-size: 14px;
color: #8a8a8a;
text-align: center;
}
.error-404-actions {
display: flex;
justify-content: center;
}
.error-404-home {
color: #1a1a1a;
font-weight: 600;
font-size: 16px;
text-decoration: underline;
text-underline-offset: 4px;
transition: color 0.15s ease;
}
.error-404-home:hover {
color: #009A61;
}
@media (max-width: 600px) {
.error-404 {
padding: 64px 0 80px;
}
.error-404-code {
font-size: 84px;
}
.error-404-title {
font-size: 26px;
}
}
.search-page {
padding: 64px 0 90px;
}
.search-page-header {
margin: 0 0 36px;
}
.search-page-title {
font-size: 30px;
font-weight: 800;
color: #1a1a1a;
margin: 0 0 20px;
}
.search-page .live-search {
margin: 0;
max-width: 480px;
}
.search-list {
list-style: none;
margin: 0;
padding: 0;
max-width: 760px;
}
.search-item {
padding: 24px 0;
border-bottom: 1px solid #ececec;
}
.search-item:first-child {
border-top: 1px solid #ececec;
}
.search-item-link {
text-decoration: none;
}
.search-item-title {
font-size: 21px;
font-weight: 700;
color: #1a1a1a;
margin: 0 0 8px;
transition: color 0.15s ease;
}
.search-item-link:hover .search-item-title {
color: #009A61;
}
.search-item-excerpt {
color: #4a4a4a;
font-size: 16px;
line-height: 1.6;
margin: 0;
}
.search-empty {
font-size: 17px;
color: #4a4a4a;
}
.search-pagination {
margin-top: 44px;
}
.search-pagination .page-numbers {
display: inline-block;
padding: 8px 14px;
margin: 0 4px;
border: 1px solid #e0e0e0;
border-radius: 6px;
text-decoration: none;
color: #1a1a1a;
}
.search-pagination .page-numbers.current {
background: #009A61;
color: #ffffff;
border-color: #009A61;
}
.search-pagination .page-numbers:hover {
border-color: #009A61;
}