/* EZ Inflatables — shared brand styles. Loaded on every page. */

html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { font-family: 'Inter', system-ui, sans-serif; color: #0B0B0C; background: #FAFAF7; }
h1,h2,h3,h4,.font-heading { font-family: 'Roboto', system-ui, sans-serif; letter-spacing:-0.01em; }
.display { font-family: 'Roboto', system-ui, sans-serif; font-weight: 900; letter-spacing: -0.025em; line-height: 0.95; text-transform: uppercase; }
.eyebrow { font-family: 'Roboto', system-ui, sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; font-size: 0.72rem; }

/* Marquee for pencil banner */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { display: inline-flex; gap: 2.5rem; padding-right: 2.5rem; animation: marquee 38s linear infinite; }
.marquee-wrap:hover .marquee-track { animation-play-state: paused; }

/* FAQ accordion */
details[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .2s ease; }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }

/* Bundle "Learn More" caret */
.bundle-details[open] .bundle-caret { transform: rotate(45deg); }
.bundle-details[open] > summary { color: #EC1C23; }

/* Subtle scroll reveal */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .55s ease, transform .55s ease; }
.reveal.in { opacity: 1; transform: translateY(0); }

/* Stripe accents */
.stripes-cta  { background-image: repeating-linear-gradient(135deg, #DAE400 0 14px, #C5D300 14px 28px); }
.stripes-red  { background-image: repeating-linear-gradient(135deg, #EC1C23 0 14px, #C5151B 14px 28px); }
.stripes-blue { background-image: repeating-linear-gradient(135deg, #005CB5 0 14px, #004A93 14px 28px); }

/* Tricolor hero blob */
.blob {
  filter: blur(48px); opacity: 0.55;
  background: radial-gradient(circle at 25% 25%, #DAE400 0%, transparent 55%),
              radial-gradient(circle at 75% 35%, #EC1C23 0%, transparent 55%),
              radial-gradient(circle at 50% 80%, #005CB5 0%, transparent 60%);
}

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; font-family:'Roboto'; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding: .95rem 1.4rem; border-radius: 0.75rem; transition: transform .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease; cursor: pointer; border: 0; }
.btn-primary { background: #DAE400; color: #0B0B0C; box-shadow: 4px 4px 0 0 #0B0B0C; }
.btn-primary:hover { background: #BFC900; transform: translate(-2px,-2px); box-shadow: 6px 6px 0 0 #0B0B0C; }
.btn-primary:active { transform: translate(2px,2px); box-shadow: 2px 2px 0 0 #0B0B0C; }
.btn-ghost { background: #FFFFFF; color: #0B0B0C; border: 2px solid #0B0B0C; box-shadow: 4px 4px 0 0 #EC1C23; }
.btn-ghost:hover { background: #FFF; transform: translate(-2px,-2px); box-shadow: 6px 6px 0 0 #EC1C23; }
.btn-dark { background: #0B0B0C; color: #FFFFFF; }
.btn-dark:hover { background: #1F1F24; transform: translateY(-2px); }
.btn-red { background: #EC1C23; color: #FFFFFF; }
.btn-red:hover { background: #C5151B; transform: translateY(-2px); }
.btn-blue { background: #005CB5; color: #FFFFFF; }
.btn-blue:hover { background: #004A93; transform: translateY(-2px); }

/* Chunky cards — bg utilities can override */
.chunk-card { border:2px solid #0B0B0C; border-radius: 1.25rem; }
.chunk-card:not([class*="bg-"]) { background:#fff; }
.chunk-card-soft { border:1px solid rgba(11,11,12,0.10); border-radius: 1.25rem; }
.chunk-card-soft:not([class*="bg-"]) { background:#fff; }

/* Icon chip */
.iconchip { width: 56px; height: 56px; border-radius: 14px; display:grid; place-items:center; font-size: 28px; }

/* Mobile menu drawer */
.mobile-menu { transform: translateX(100%); transition: transform .3s ease; }
.mobile-menu.open { transform: translateX(0); }

/* Floating CTA spacing on mobile */
@media (max-width: 767px) {
  body.has-mobile-cta { padding-bottom: 78px; }
}

/* Nav transitions */
.nav-shell { transition: background .25s ease, box-shadow .25s ease, border-color .25s ease; }

/* Black ticker strip */
.ticker-strip {
  background: #0B0B0C; color: #DAE400;
  font-family: 'Roboto'; font-weight: 900; text-transform: uppercase; letter-spacing: 0.18em;
}