/* Speed Queen Wrocław — custom layer on top of Tailwind (Play CDN).
   Keep this lean; Tailwind utilities do most of the work. */

:root {
  --sq-red: #E4002B;
  --sq-ink: #141414;
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* Subtle film grain overlay for atmosphere/depth (industrial feel) */
.grain::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.05;
  z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Diagonal red accent strip used as section divider */
.stripe-divider {
  height: 6px;
  background: repeating-linear-gradient(
    45deg,
    var(--sq-red),
    var(--sq-red) 14px,
    #141414 14px,
    #141414 28px
  );
}

/* Hero radial glow */
.hero-glow {
  background:
    radial-gradient(60% 70% at 78% 18%, rgba(228,0,43,0.20), transparent 60%),
    radial-gradient(50% 60% at 10% 90%, rgba(228,0,43,0.10), transparent 55%);
}

/* Reveal-on-scroll (toggled by main.js IntersectionObserver) */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1); }
.reveal.is-visible { opacity: 1; transform: none; }
[data-reveal-delay="1"] { transition-delay: 0.08s; }
[data-reveal-delay="2"] { transition-delay: 0.16s; }
[data-reveal-delay="3"] { transition-delay: 0.24s; }
[data-reveal-delay="4"] { transition-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  .animate-marquee { animation: none !important; }
}

/* FAQ accordion */
.faq-panel { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.faq-item.open .faq-panel { max-height: 600px; }
.faq-item.open .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform 0.3s ease; }

/* Underline-grow link */
.link-underline { position: relative; }
.link-underline::after {
  content: ""; position: absolute; left: 0; bottom: -2px; height: 2px; width: 100%;
  background: var(--sq-red); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease;
}
.link-underline:hover::after { transform: scaleX(1); }

/* Focus visibility for accessibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid var(--sq-red); outline-offset: 2px;
}

/* Header scrolled state */
#site-header.scrolled { box-shadow: 0 8px 30px -16px rgba(20,20,20,0.4); }

/* Mobile menu transition */
#mobile-menu { transition: transform 0.35s cubic-bezier(0.16,1,0.3,1), opacity 0.25s ease; }
#mobile-menu.hidden-menu { transform: translateX(100%); opacity: 0; pointer-events: none; }