/*
Theme Name: Sprouts Change Management
Theme URI: https://sproutschange.co.in
Author: Sprouts Change Management
Author URI: https://sproutschange.co.in
Description: Custom WordPress theme for Sprouts Change Management (SCM) — Campus to Corporate transformation, NLP, corporate & leadership training. Fully dynamic via custom post types and a Sprouts Content options panel.
Version: 1.0.2
License: GNU General Public License v2 or later
Text Domain: sprouts
Domain Path: /languages
Requires at least: 6.0
Requires PHP: 7.4
*/

/*
NOTE ON STYLING: This theme uses the Tailwind CDN (Play CDN) for utility CSS,
loaded in functions.php together with the same tailwind.config the static site
used. For production, replace it with a compiled Tailwind build to avoid the
CDN warning. This file carries the small amount of custom CSS (reveals,
collage animations, buttons, marquees).
*/

body { font-family:'Inter',sans-serif; color:#0B2239; }
h1,h2,h3,.font-display { font-family:'Plus Jakarta Sans',sans-serif; }

/* Scroll reveal */
.reveal       { opacity:0; transform:translateY(36px);  transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.active{ opacity:1; transform:translateY(0); }
.reveal-left  { opacity:0; transform:translateX(-40px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-left.active  { opacity:1; transform:translateX(0); }
.reveal-right { opacity:0; transform:translateX(40px);  transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-right.active { opacity:1; transform:translateX(0); }
.reveal-zoom  { opacity:0; transform:scale(.92); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-zoom.active  { opacity:1; transform:scale(1); }

.stat-value { font-variant-numeric: tabular-nums; }

/* Mobile menu */
#mobileMenu { max-height:0; overflow:hidden; transition:max-height .4s ease; }
#mobileMenu.open { max-height:520px; }

/* Mobile hero collage */
@keyframes collageFloatLeft {
  0%, 100% { transform: translateY(0px) rotate(-5deg); }
  50% { transform: translateY(-7px) rotate(-2deg); }
}
@keyframes collageFloatCenter {
  0%, 100% { transform: translateY(0px) scale(1); }
  50% { transform: translateY(-9px) scale(1.02); }
}
@keyframes collageFloatRight {
  0%, 100% { transform: translateY(0px) rotate(5deg); }
  50% { transform: translateY(-6px) rotate(3deg); }
}
.animate-collage-left { animation: collageFloatLeft 5s ease-in-out infinite; }
.animate-collage-center { animation: collageFloatCenter 6s ease-in-out infinite; }
.animate-collage-right { animation: collageFloatRight 5.5s ease-in-out infinite 0.6s; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Superpower of Brain button */
.btn-superpower {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, #F5A623 0%, #FBBF4E 45%, #E08C0B 100%);
  background-size: 200% 200%;
  animation: gradientShift 6s ease infinite, auraPulse 3s ease-in-out infinite;
  transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s ease;
}
.btn-superpower::after {
  content:""; position:absolute; top:-50%; left:-75%; width:50%; height:200%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  transform: rotate(25deg); animation: shineSweep 4s cubic-bezier(.4,0,.2,1) infinite; pointer-events:none;
}
@keyframes shineSweep { 0%,25% { left:-75%; } 60%,100% { left:160%; } }
@keyframes auraPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(245,166,35,.45), 0 4px 16px rgba(245,166,35,.28); }
  50% { box-shadow: 0 0 0 7px rgba(245,166,35,.08), 0 8px 24px rgba(245,166,35,.45); }
}
.btn-superpower:hover { transform: translateY(-2px) scale(1.05); box-shadow: 0 0 0 9px rgba(245,166,35,.2), 0 14px 30px rgba(245,166,35,.5); }
.btn-superpower:active { transform: translateY(1px) scale(.97); }

.card-lift { transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease; }
.card-lift:hover { transform:translateY(-8px); box-shadow:0 20px 50px rgba(11,34,57,.14); }

.journey-line { stroke-dasharray:320; stroke-dashoffset:320; transition:stroke-dashoffset 1.8s ease .4s; }
.journey-line.active { stroke-dashoffset:0; }

/* Trusted-by marquees */
@keyframes mq-left { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes mq-right { from { transform:translateX(-50%); } to { transform:translateX(0); } }
.mq-track { animation:mq-left 60s linear infinite; }
.mq-track.to-right { animation-name:mq-right; }
.mq-track:hover { animation-play-state:paused; }

.text-gradient { background:linear-gradient(90deg,#F5A623,#E08C0B); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* Video modal */
#videoModal { transition:opacity .3s ease; }
#videoModal.hidden-modal { opacity:0; pointer-events:none; }

/* FAQ accordion */
.faq-body { max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(.16,1,.3,1); }
.faq.open .faq-body { max-height:600px; }
.faq.open .faq-icon { transform:rotate(45deg); }
.faq-icon { transition:transform .35s ease; }

/* Blog fallback templates */
.entry-content a { color:#E08C0B; font-weight:600; text-decoration:underline; }
.page-hero { background-image:none; }

/* Emoji contact icons: brightness(0)+invert renders any emoji as a white silhouette */
.icon-white { filter: brightness(0) invert(1); }

::selection { background:rgba(245,166,35,.25); }
.dot-pattern { background-image:radial-gradient(rgba(11,34,57,.09) 1px, transparent 1px); background-size:22px 22px; }
