/* iConcept — Template 8 (light / editorial). Custom styles on top of the compiled Tailwind utilities. */
body{font-family:'Plus Jakarta Sans',sans-serif;background:#F6F3EC;color:#03112B}
.font-display{font-family:'Bricolage Grotesque',sans-serif}
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#F6F3EC}::-webkit-scrollbar-thumb{background:#03112B;border-radius:4px}
.noise{background-image:radial-gradient(rgba(3,17,43,.07) 1px,transparent 1px);background-size:22px 22px}

/* ---- Header ---- */
#site-header.is-solid{background:rgba(246,243,236,.6);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);border-color:rgba(3,17,43,.1);box-shadow:0 8px 30px -12px rgba(3,17,43,.15);padding-top:.75rem;padding-bottom:.75rem}
#site-header.is-solid #scroll-progress{opacity:1}
.nav-link{position:relative;padding:.625rem 1.25rem;border-radius:9999px;font-size:1rem;font-weight:700;color:rgba(3,17,43,.7);transition:background-color .3s,color .3s,box-shadow .3s}
.nav-link:hover{color:#03112B;background:rgba(3,17,43,.05)}
.nav-link.is-active{color:#fff;background:#03112B;box-shadow:0 10px 20px -8px rgba(3,17,43,.35)}
.burger{display:block;width:20px;height:2px;background:#03112B;transition:transform .3s,opacity .3s}
#menu-btn.is-open .burger:nth-child(1){transform:translateY(7px) rotate(45deg)}
#menu-btn.is-open .burger:nth-child(2){opacity:0}
#menu-btn.is-open .burger:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
#mobile-overlay{clip-path:circle(0% at 92% 4%);pointer-events:none;transition:clip-path .6s cubic-bezier(.76,0,.24,1)}
#mobile-overlay.is-open{clip-path:circle(150% at 92% 4%);pointer-events:auto}
.m-link{opacity:0;transform:translateY(30px);transition:opacity .4s,transform .4s}
#mobile-overlay.is-open .m-link{opacity:1;transform:none;transition-delay:calc(.25s + var(--i)*.08s)}

/* ---- Intro + scroll reveals ---- */
.intro{opacity:0;animation:rise .8s cubic-bezier(.22,1,.36,1) var(--d,0s) forwards}
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
[data-reveal],[data-reveal-x],[data-reveal-scale]{opacity:0;transition:opacity .7s cubic-bezier(.22,1,.36,1) var(--d,0s),transform .7s cubic-bezier(.22,1,.36,1) var(--d,0s)}
[data-reveal]{transform:translateY(30px)}[data-reveal-x]{transform:translateX(40px)}[data-reveal-scale]{transform:scale(.92)}
.is-in[data-reveal],.is-in[data-reveal-x],.is-in[data-reveal-scale]{opacity:1;transform:none}
/* word-by-word headline reveal (words are wrapped by app.js) */
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em;margin-right:.25em}
.wi{display:inline-block;transform:translateY(110%);transition:transform .8s cubic-bezier(.22,1,.36,1) calc(var(--i)*.06s)}
.is-in .wi{transform:none}
.squiggle path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s ease .5s}
.is-in .squiggle path{stroke-dashoffset:0}

/* ---- Hero extras ---- */
.float{animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-14px) rotate(var(--r,0deg))}}
.magnetic{transition:transform .25s ease-out;will-change:transform}

/* ---- Ticker ---- */
.marquee{animation:marquee 28s linear infinite}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---- Bento ---- */
.bento-in{transition:transform .3s}
.bento-in:hover{transform:scale(1.03) rotate(-1deg)}

/* ---- FAQ ---- */
.faq-item.is-open{background:#fff}
.faq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.faq-body>div{overflow:hidden}
.faq-item.is-open .faq-body{grid-template-rows:1fr}
.faq-plus{transition:transform .3s}
.faq-item.is-open .faq-plus{transform:rotate(45deg)}

/* ---- Contact ---- */
.spin-ring{animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.field{width:100%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:.75rem;padding:.75rem 1rem;font-size:.875rem;color:#fff;outline:none;transition:border-color .2s,box-shadow .2s}
.field::placeholder{color:rgba(255,255,255,.5)}
.field:focus{border-color:#FFB804;box-shadow:0 0 0 3px rgba(255,184,4,.3)}
.field option{color:#03112B}
.ok-badge{animation:pop .5s cubic-bezier(.34,1.56,.64,1) both}
@keyframes pop{from{transform:scale(0) rotate(-90deg)}to{transform:none}}

@media (hover:none){.cursor-glow{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-reveal],[data-reveal-x],[data-reveal-scale],.intro{opacity:1;transform:none}.wi{transform:none}
}