/* se creative — site-specific overrides (replaces Webflow head/embed code and webflow.js behaviour) */

/* From Webflow head code */
::selection { background: #d14424; color: #fff; }
input, textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; background-image: none; }

/* Testimonial slider arrows (buttons, so clicks no longer jump to the top) */
button.slide_arrow { border: 0; padding: 0; font: inherit; }
.is--disabled-arrow { opacity: 0.2; pointer-events: none; }

/* Buttons that replace Webflow divs */
button.fs_accordion-1_header,
button.menu-button { font: inherit; color: inherit; background: none; border: 0; width: 100%; text-align: left; }
button.menu-button { width: auto; }
/* Mobile menu icon: 50% larger (16px -> 24px) */
.w-nav-button .w-icon-nav-menu { font-size: 24px; line-height: 1; }
.fs_accordion-1_header p { margin-bottom: 0; }

/* Accordion (replaces Finsweet a11y) */
.fs_accordion-1_content { height: 0; transition: height .3s ease; }
.fs_accordion-1_icon { transition: transform .3s ease; }
.fs_accordion-1_header[aria-expanded="true"] .fs_accordion-1_icon { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .fs_accordion-1_content, .fs_accordion-1_icon, .slide_item { transition: none; } }

/* Mobile nav (replaces webflow.js w-nav) */
@media screen and (max-width: 991px) {
  /* Webflow showed the menu full-width under the bar; the bar has backdrop-filter, so offset from it */
  .w-nav.is-open .w-nav-menu { display: block; position: absolute; top: 100%; left: -2.5vw; width: 100vw; color: var(--colors-all--green); animation: nav-in .3s ease; }
  @keyframes nav-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
}

/* Project filter (replaces Finsweet CMS Filter) */
.cc-project-item[hidden], [data-filter-empty][hidden] { display: none !important; }
.fs-radio_field-4 { cursor: pointer; }

/* Forms */
.w-form-done, .w-form-fail { display: none; }
.w-form.is-success form { display: none; }
.w-form.is-success .w-form-done, .w-form.is-error .w-form-fail { display: block; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Background circles: slow, subtle drift */
.cc-circles-block { animation: circles-drift 28s ease-in-out infinite alternate; will-change: transform; }
@keyframes circles-drift {
  0%   { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  50%  { transform: translate3d(-1.5%, 12px, 0) rotate(-1.5deg) scale(1.03); }
  100% { transform: translate3d(1.5%, -8px, 0) rotate(1deg) scale(1.05); }
}
@media (prefers-reduced-motion: reduce) { .cc-circles-block { animation: none; } }

/* Homepage hero: more space between the reviews line and the big wordmark */
.cc-hero-intro { margin-bottom: 2.5rem; }
@media screen and (max-width: 767px) { .cc-hero-intro { margin-bottom: 1.5rem; } }

/* Newsletter form: stack field and button on mobile so the email field is usable */
@media screen and (max-width: 767px) {
  .cc-newsletter-form { flex-direction: column; gap: .75rem; }
  .cc-newsletter-form-field { width: 100%; height: auto; border-style: solid; border-radius: var(--component-button--border-radius); }
  .btn.cc-newsletter-submit { width: 100%; min-height: 48px; text-align: center; padding-left: 1.5em; padding-right: 1.5em; border-radius: var(--component-button--border-radius); }
}