/* Secondary button (outlined) */
.btn.btn--secondary,
.btn.btn--secondary:visited {
  background: transparent;
  border-color: #fafaf9;
  cursor: pointer;
}
.btn.btn--secondary .btn__text {
  color: #fafaf9;
}
.btn.btn--secondary:hover {
  background: rgba(250, 250, 249, 0.12);
  border-color: #fafaf9;
}
.btn.btn--secondary:active {
  background: rgba(250, 250, 249, 0.2);
}

/* Customers: See More / See Less */
.customers-more { overflow: hidden; max-height: 0; transition: max-height 0.7s ease; }
.customers-more > .masonry__item { opacity: 0; transform: translateY(24px); transition: opacity 0.5s ease, transform 0.5s ease; }
.customers-more.is-open > .masonry__item { opacity: 1; transform: none; }
.customers-more.is-open > .masonry__item:nth-child(2) { transition-delay: 0.1s; }
.customers-more.is-open > .masonry__item:nth-child(3) { transition-delay: 0.2s; }
.customers-more.is-open > .masonry__item:nth-child(4) { transition-delay: 0.3s; }

/* Link hover: gray instead of the theme's black */
a:hover,
a:focus {
  color: #8f8b85;
}

/* Map */
.map-mobile img { display: block; width: 100%; height: auto; }
.map-note { max-width: 480px; margin: 24px auto 0; color: #8f8b85; font-size: 0.9em; line-height: 1.6; text-align: center; }

/* Trusted by logos */
@media (max-width: 767px) {
  .trusted-logos .feature { margin-bottom: 12px; }
}

/* SEO text */
.seo-title { font-size: 12px; margin-bottom: 12px; }
.seo-text { font-size: 12px; line-height: 1.7; }

/* SEO text: on mobile, show the first paragraph and expand the rest on click */
.seo-text--intro { margin-bottom: 1.7em; }
.seo-collapse .seo-text { margin-bottom: 0; }
.seo-toggle { display: none; background: none; border: 0; padding: 0; margin-top: 8px; color: #8f8b85; font-size: 12px; font-weight: 600; cursor: pointer; }
.seo-toggle:hover { color: #fafaf9; }

/* Mobile */
@media (max-width: 767px) {
  .container { padding-left: 32px; padding-right: 32px; }
  :not(.row) > h1[class*="col-"],
  :not(.row) > h2[class*="col-"],
  :not(.row) > h3[class*="col-"] { padding-left: 0; padding-right: 0; }

  .seo-text--intro { margin-bottom: 0; }
  .seo-collapse { max-height: 0; overflow: hidden; transition: max-height 0.5s ease; }
  .seo-collapse .seo-text { padding-top: 1.7em; }
  .seo-toggle { display: inline-block; }

  .cta-final__box { padding: 4em 0 !important; height: auto; max-height: 100vh; }
  .cta-final__box .pos-vertical-center { position: relative; top: auto; transform: none; }

  .project-meta { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; margin-top: 24px; }

  .project-image img { height: 70vh; max-height: 560px; width: 100%; object-fit: cover; }
}

/* Mobile menu: hamburger to close icon (same box as the hamburger, glyph hidden) */
.hamburger-toggle.is-open .stack-menu {
  color: transparent;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5L19 19M19 5L5 19' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
}

/* Hero video: always cover the whole section, darker overlay for readable text */
.videobg video { left: 0 !important; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.videobg[data-overlay]:before { background: #000; opacity: 0.55; }

/* Home: link under services */
.services-link { margin-top: 8px; }
.services-link a { color: #fafaf9; font-weight: 600; }
.services-link a:hover { color: #8f8b85; }

/* Solutions: what each service includes */
.service-includes { margin-top: 16px; color: #8f8b85; font-size: 15px; line-height: 1.7; }
.service-includes span { display: block; color: #cccac6; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; font-size: 0.85em; margin-bottom: 4px; }

/* Blog posts */
.article__body .post-lead { color: #e5e3df; font-size: 1.2em; line-height: 1.6; }
.article__body p { color: #B5B5B5; }
.article__body h2 { color: #fafaf9; font-size: 1.6em; line-height: 1.3; font-weight: 600; margin: 2em 0 0.6em; }
.article__body .post-list,
.article__body .post-checklist { margin: 0 0 1.6em; padding: 0; list-style: none; color: #B5B5B5; }
.article__body .post-list li,
.article__body .post-checklist li { position: relative; padding-left: 1.6em; margin-bottom: 0.6em; line-height: 1.6; }
.article__body .post-list li:before { content: ''; position: absolute; left: 0.3em; top: 0.7em; width: 6px; height: 6px; border-radius: 50%; background: #8f8b85; }
.article__body .post-checklist li:before { content: ''; position: absolute; left: 0; top: 0.3em; width: 14px; height: 14px; border: 1.5px solid #8f8b85; border-radius: 3px; }
.article__body .post-takeaway { margin: 1.6em 0 2em; padding: 1.2em 1.4em; border-left: 3px solid #fafaf9; background: #141414; border-radius: 0 8px 8px 0; }
.article__body .post-takeaway strong { display: block; color: #fafaf9; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 0.4em; }
.article__body .post-takeaway p { color: #e5e3df; margin: 0; padding: 0; }
.article__body p a { color: #fafaf9; text-decoration: underline; text-underline-offset: 3px; }
.article__body p a:hover { color: #8f8b85; }
.article__body h3 { color: #e5e3df; font-size: 1.15em; font-weight: 600; margin: 1.6em 0 0.4em; }
.article__body .post-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 1em 0 1.4em; }
.article__body .post-compare > div { padding: 1em 1.2em; border-radius: 8px; background: #141414; border: 1px solid #262626; }
.article__body .post-compare strong { display: block; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 0.4em; color: #8f8b85; }
.article__body .post-compare > div:last-child strong { color: #fafaf9; }
.article__body .post-compare p { margin: 0; padding: 0; color: #B5B5B5; }
.article__body .post-steps { margin: 0 0 1.6em; padding: 0; list-style: none; counter-reset: step; color: #B5B5B5; }
.article__body .post-steps li { position: relative; padding-left: 2.4em; margin-bottom: 0.8em; line-height: 1.6; counter-increment: step; }
.article__body .post-steps li:before { content: counter(step); position: absolute; left: 0; top: 0; width: 1.7em; height: 1.7em; line-height: 1.7em; text-align: center; border-radius: 50%; background: #262626; color: #fafaf9; font-size: 0.85em; font-weight: 600; }
.article__body .post-table-wrap { overflow-x: auto; margin: 1em 0 1.6em; }
.article__body .post-table { width: 100%; border-collapse: collapse; font-size: 0.95em; }
.article__body .post-table th { text-align: left; color: #fafaf9; font-weight: 600; padding: 0.8em; border-bottom: 1px solid #333; }
.article__body .post-table td { color: #B5B5B5; padding: 0.8em; border-bottom: 1px solid #222; vertical-align: top; line-height: 1.5; }
.article__body .post-table td:first-child { color: #e5e3df; font-weight: 600; white-space: nowrap; }
.article__body .post-list strong { color: #e5e3df; }
@media (max-width: 767px) { .article__body .post-compare { grid-template-columns: 1fr; } }
.article__body .post-steps li { font-size: 17px; }
.article__body .post-table { font-size: 16px; }
.article__body .post-table th { background: transparent; }
/* Blog sizes relative to the theme's 19px body text */
.article__body .post-lead { font-size: 23px; }
.article__body h2 { font-size: 28px; }
.article__body h3 { font-size: 22px; }
.article__body .post-steps li { font-size: 19px; }
@media (max-width: 767px) {
  .article__body .post-lead { font-size: 21px; }
  .article__body h2 { font-size: 24px; }
  .article__body h3 { font-size: 20px; }
}

/* Blog list: single column in normal flow (the theme's masonry positioning overlapped items) */
.masonry-blog-list .masonry__container { height: auto !important; }
.masonry-blog-list .masonry__item { position: static !important; left: auto !important; top: auto !important; transform: none !important; }

/* Blog pagination */
.blog-pagination { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 3em 0 1em; }
.blog-pagination[hidden] { display: none; }
.blog-pagination__btn { min-width: 44px; height: 44px; padding: 0 12px; border-radius: 22px; border: 1px solid #333; background: transparent; color: #cccac6; font-size: 15px; font-weight: 600; cursor: pointer; transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease; }
.blog-pagination__btn:hover:not(:disabled) { border-color: #fafaf9; color: #fafaf9; }
.blog-pagination__btn[aria-current="page"] { background: #fafaf9; border-color: #fafaf9; color: #000; cursor: default; }
.blog-pagination__btn:disabled { opacity: 0.3; cursor: default; }
.blog-pagination__arrow { font-size: 22px; line-height: 1; }
.masonry-blog-list .masonry__item[hidden] { display: none !important; }

/* Trusted-by logos: staggered entrance and subtle hover */
.trusted-logos .feature { opacity: 0; transform: translateY(16px); transition: opacity 0.7s ease, transform 0.7s ease; }
.fade-in-on-scroll.visible .trusted-logos .feature { opacity: 1; transform: none; }
.fade-in-on-scroll.visible .trusted-logos > div:nth-child(2) .feature { transition-delay: 0.12s; }
.fade-in-on-scroll.visible .trusted-logos > div:nth-child(3) .feature { transition-delay: 0.24s; }
.fade-in-on-scroll.visible .trusted-logos > div:nth-child(4) .feature { transition-delay: 0.36s; }
.trusted-logos .feature img { transition: transform 0.4s ease, opacity 0.4s ease; opacity: 0.85; }
.trusted-logos .feature:hover img { transform: scale(1.06); opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .trusted-logos .feature, .trusted-logos .feature img { transition: none; transform: none; opacity: 1; }
}

/* Final CTA heading: smaller */
.cta-final__box h2.h1 { font-size: 44px; line-height: 1.2; }
@media (max-width: 767px) { .cta-final__box h2.h1 { font-size: 28px; } }

/* Home hero: rounded image card with logos below */
.hero-card-section { padding: 16px 0 96px; }
.hero-card-wrap { max-width: 1400px; margin: 0 auto; padding: 0 32px; }
.hero-card { position: relative; overflow: hidden; border-radius: 16px; min-height: 640px; height: 76vh; max-height: 760px; display: flex; align-items: center; }
.hero-card picture, .hero-card__bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-card__bg { object-fit: cover; object-position: center; }
.hero-card:after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.15) 75%, rgba(0,0,0,0) 100%); }
.hero-card__content { position: relative; z-index: 1; max-width: 640px; padding: 0 0 0 7%; }
.hero-card__news { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 24px; color: #e5e3df; font-weight: 500; font-size: 15px; }
.hero-card__news:hover { color: #fafaf9; }
.hero-card__tag { padding: 3px 10px; border: 1px solid rgba(250,250,249,0.6); border-radius: 6px; font-size: 13px; }
.hero-card__arrow { transition: transform 0.2s ease; }
.hero-card__news:hover .hero-card__arrow { transform: translateX(4px); }
.hero-card__title { color: #fafaf9; font-weight: 600; font-size: 52px; line-height: 1.15; margin-bottom: 20px; }
.hero-card__lead { color: #e5e3df; font-size: 19px; line-height: 1.55; margin-bottom: 32px; }
.hero-card__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-card__actions .btn { margin: 0; }

.hero-logos { display: flex; align-items: center; gap: 48px; padding: 28px 0 0; }
.hero-logos__label { flex: 0 0 210px; margin: 0; color: #cccac6; font-size: 14px; line-height: 1.5; }
.hero-logos__list { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0; padding: 0; list-style: none; }
.hero-logos__list li { flex: 0 1 auto; }
.hero-logos__list img { display: block; height: 30px; width: auto; max-width: 140px; object-fit: contain; opacity: 0.75; transition: opacity 0.3s ease; }
.hero-logos__list img:hover { opacity: 1; }
.hero-logos__list li { animation: heroLogoIn 0.7s ease both; }
.hero-logos__list li:nth-child(2) { animation-delay: 0.08s; } .hero-logos__list li:nth-child(3) { animation-delay: 0.16s; }
.hero-logos__list li:nth-child(4) { animation-delay: 0.24s; } .hero-logos__list li:nth-child(5) { animation-delay: 0.32s; }
.hero-logos__list li:nth-child(6) { animation-delay: 0.4s; } .hero-logos__list li:nth-child(7) { animation-delay: 0.48s; }
.hero-logos__list li:nth-child(8) { animation-delay: 0.56s; }
@keyframes heroLogoIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .hero-logos__list li { animation: none; } }

@media (max-width: 991px) {
  .hero-logos { flex-direction: column; align-items: flex-start; gap: 20px; }
  .hero-logos__label { flex: none; }
  .hero-logos__list { width: 100%; flex-wrap: wrap; justify-content: flex-start; gap: 24px 32px; }
}
@media (max-width: 767px) {
  .hero-card-section { padding: 8px 0 64px; }
  .hero-card { height: auto; min-height: 560px; align-items: flex-end; border-radius: 12px; }
  .hero-card:after { background: linear-gradient(0deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.6) 55%, rgba(0,0,0,0.2) 100%); }
  .hero-card__content { padding: 32px 20px; }
  .hero-card__title { font-size: 32px; }
  .hero-card__lead { font-size: 17px; margin-bottom: 24px; }
  .hero-card__news { font-size: 14px; margin-bottom: 16px; }
  .hero-logos { padding: 24px 0 0; }
  .hero-logos__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 16px; }
  .hero-logos__list img { height: 22px; max-width: 100%; }
}
/* Hero logos: shrink to fit the row */
.hero-logos__list li { flex: 1 1 0; min-width: 0; display: flex; justify-content: center; }
.hero-logos__list img { width: 100%; height: auto; max-width: 132px; max-height: 34px; }
@media (max-width: 767px) { .hero-logos__list img { max-height: 26px; } }
/* Hero logos: tightly cropped files */
.hero-logos__list img { max-width: 112px; max-height: 26px; }
.hero-card__tag { white-space: nowrap; }
@media (max-width: 767px) { .hero-logos__list img { max-width: 72px; max-height: 20px; } }
/* More space between hero logos and the next section */
.hero-card-section { padding-bottom: 290px; }
@media (max-width: 767px) { .hero-card-section { padding-bottom: 200px; } }
.hero-logos__list img { max-width: 120px; max-height: 28px; }
@media (max-width: 767px) { .hero-logos__list img { max-width: 88px; max-height: 22px; } }
@media (max-width: 767px) { .hero-card-wrap { padding: 0 16px; } }

/* Blog post byline in a handwritten font */
.article__title .post-author { display: inline-block; margin-top: 6px; font-family: "Caveat", cursive; font-size: 26px; font-weight: 600; color: #e5e3df; letter-spacing: 0.2px; }

/* Blog list: image hover — subtle zoom and brighter color */
.masonry-blog-list .article__body > a:first-child { display: block; overflow: hidden; border-radius: 6px; margin-bottom: 1.85714286em; }
.masonry-blog-list .article__body > a:first-child > img { display: block; width: 100%; margin-bottom: 0; transition: transform 0.6s ease, filter 0.6s ease; }
@media (hover: hover) {
  .masonry-blog-list article:hover .article__body > a:first-child > img { filter: brightness(1.12) saturate(1.05); transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  .masonry-blog-list .article__body > a:first-child > img { transition: filter 0.3s ease; }
  .masonry-blog-list article:hover .article__body > a:first-child > img { transform: none; }
}
/* Hero case study link: no underline, tighter tag */
.hero-card__news, .hero-card__news:hover, .hero-card__news:focus { text-decoration: none; }
.hero-card__tag { padding: 1px 7px; font-size: 12px; line-height: 1.6; }
