/* Shared mobile fixes, loaded after the animated component themes. */
@media (max-width: 1024px) {
  .site-header__inner { gap: 12px; }
  .brand { min-width: 0; }
  .nav-toggle { flex: 0 0 44px; min-width: 44px; min-height: 44px; }
  .nav__mobile { visibility: hidden; pointer-events: none; overscroll-behavior: contain; padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
  .nav__mobile.is-open { visibility: visible; pointer-events: auto; }
  .nav__mobile a { min-height: 44px; overflow-wrap: anywhere; }
}
@media (max-width: 768px) {
  .grid > *, .hero__grid > *, .footer-grid > *, .form-grid > *, .article-layout > * { min-width: 0; }
  #features-matrix > .container, #engine-pillars > .container, .compact-about-evolution #evolution { zoom: 1; }
  .inner-row-stack:not(.coverflow-group) > .inner-row-stack-card, .blog-scroll-stack:not(.coverflow-group) > .post-card { position: relative !important; top: auto !important; }
  #services .service-card:not(.coverflow-card) { position: relative; top: auto; }
  .prose { overflow-wrap: anywhere; }
  .prose table { display: block; max-width: 100%; overflow-x: auto; }
  
  /* Remove schedule/comparison tables and their dedicated sections on mobile screens only */
  #live-schedule,
  #vault-table,
  #ncert-suite,
  #build-vs-partner,
  .schedule-table-card,
  table.compare-table {
    display: none !important;
  }

  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .footer-brand, .footer-grid a { overflow-wrap: anywhere; }

  /* Universal Mobile Screen Center Alignment for Section Headers across all pages */
  .has-study-sticker {
    padding-right: 0 !important;
    min-height: 0 !important;
  }
  .site-study-sticker {
    display: none !important;
  }
  .page-hero .container.has-study-sticker,
  .inner-hero .container.has-study-sticker {
    padding-right: 18px !important;
    padding-left: 18px !important;
  }

  .section-head,
  .section-head.center,
  .section-head-split .section-head,
  .has-study-sticker.section-head {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .section-head > * {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    align-self: center !important;
  }

  .section-head__eyebrow,
  .section-head .badge,
  .section-head .pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 12px !important;
    text-align: center !important;
    align-self: center !important;
    max-width: 90% !important;
  }

  .section-head__title,
  .section-head h1,
  .section-head h2,
  .section-head h3 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    align-self: center !important;
    line-height: 1.15 !important;
  }

  .section-head__lead,
  .section-head p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
    align-self: center !important;
    line-height: 1.6 !important;
  }

  .page-head {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .page-head h1,
  .page-head p {
    text-align: center !important;
    margin-inline: auto !important;
  }
}
@media (max-width: 600px) {
  .container { padding-inline: 18px; }
  .site-header__inner { padding-inline: 16px; }
  .brand__name, .brand__name b, .brand__name span { font-size: clamp(20px, 6vw, 24px); }
  .hero h1 { font-size: clamp(34px, 9.5vw, 48px); line-height: 1.08; overflow-wrap: anywhere; }
  .hero__eyebrow { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .section-head .pill, .section-head .badge { max-width: 100%; white-space: normal; }
  .pill, .badge { white-space: nowrap; word-break: normal; }
  .hero__cta { width: 100%; flex-direction: column; align-items: stretch; gap: 12px; }
  .hero__cta .btn { width: 100%; justify-content: center; min-height: 48px; }
  .btn, .exam-filter-btn, .krackerz-view-btn, .krackerz-fan-chip, .cbt-exam-tab { min-height: 44px; min-width: 44px; }
  .krackerz-fan-chip { padding: 10px 16px; font-size: 13px; }
  .krackerz-view-btn { padding: 10px 16px; font-size: 13px; }
  .nav-toggle { min-width: 44px; min-height: 44px; }
  input, textarea, select { font-size: 16px; }
  .hero__trust { flex-wrap: wrap; justify-content: center; gap: 20px; }
  .hero__visual { min-height: 0; padding: 18px; }
  .hero__card { padding: 18px; }
  .mock-test-row { gap: 10px; align-items: center; }
  .mock-test-row > div,
  .mock-test-row > span:not(.ic):not(.pill):not(.bar) { min-width: 0; flex: 1 1 auto; overflow: hidden; }
  .mock-test-row > span:not(.ic):not(.pill):not(.bar) b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.88rem; }
  .mock-test-row > span:not(.ic):not(.pill):not(.bar) small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.76rem; }
  .mock-test-row .pill,
  .mock-test-row .pill--accent {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    padding: 6px 14px !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto;
  }
  .mock-test-row .bar { flex-shrink: 0; width: 40px; }
  #features-matrix > .container { width: calc(100% - 36px); padding: 22px 18px !important; }
  #features-matrix .tech-pipeline { display: flex; flex-direction: column; gap: 20px; }
  #features-matrix .tech-pipeline__card { transform: none !important; min-height: 0; }
  #features-matrix .engine-hub { width: min(220px, 100%); height: 220px; }
  .engine-wires { display: none; }
  .coverflow-group > .coverflow-card { width: calc(100% - 28px) !important; max-width: calc(100% - 28px) !important; }
  .coverflow-card p, .coverflow-card .exam-card__desc, .coverflow-card .why-card__desc, .coverflow-card .pyq-vault-card__desc { font-size: 14px !important; line-height: 1.6 !important; }
  .coverflow-prev, .coverflow-next { width: 44px; height: 44px; bottom: 10px; }
  .coverflow-dots { bottom: 10px; }
  .coverflow-dots button, .coverflow-dots button.is-active { min-width: 24px; width: 24px !important; height: 24px; border: 8px solid transparent; background-clip: padding-box; }
  .krackerz-cards-row { max-width: 100%; margin-inline: 0; width: 100%; scroll-snap-type: x proximity; }
  .krackerz-card { scroll-snap-align: start; }
  .cta-band { padding: 24px 20px; }
  .cta-band .btn { width: 100%; justify-content: center; }
  .faq summary { gap: 12px; font-size: 16px; }
}

@media (max-width: 768px) {
  .inner-row-stack.coverflow-group { overflow: hidden !important; }
  .inner-row-stack.coverflow-group > .coverflow-aura { position: absolute !important; }
}

/* Native sticky overlap uses scrolling without a continuous animation loop. */
@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
 .inner-row-stack:not(.coverflow-group) > .inner-row-stack-card {
   position: sticky !important; top: var(--row-stack-top, 98px) !important;
 }
 .inner-row-stack:not(.coverflow-group) { padding-bottom: 48px; }
 #technology .pillars-timeline__nodes,
 #technology .pillars-timeline__footer-controls { display: none; }
 #technology .pillars-timeline__stage {
   display: flex; flex-direction: column; gap: 28px;
   padding-bottom: 48px; overflow: visible; min-height: 0;
 }
 #technology .pillars-timeline { overflow: visible; }
 #technology .pillars-timeline__card {
   position: sticky; top: var(--mobile-pillar-top, 98px);
   z-index: var(--mobile-pillar-layer, 1); opacity: 1 !important;
   visibility: visible !important; pointer-events: auto;
   transform: none !important; grid-row: auto; margin: 0;
 }
}

/* Site-wide mobile scroll stacks override carousel placement only on phones. */
@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
 body #main#main .mobile-scroll-stack {
   display: flex !important; flex-direction: column !important;
   align-items: stretch !important; gap: 28px !important;
   height: auto !important; min-height: 0 !important; max-height: none !important;
   width: 100% !important; max-width: 100%; padding: 0 0 60px !important;
   overflow: visible !important; perspective: none !important; isolation: isolate;
 }
 body #main#main .mobile-scroll-stack > .mobile-scroll-card {
   position: sticky !important; top: var(--mobile-stack-top, 94px) !important;
   left: auto !important; right: auto !important; bottom: auto !important;
   width: 100% !important; max-width: 100% !important; min-width: 0 !important;
   margin: 0 !important; flex: none !important; align-self: stretch !important;
   grid-row: auto !important; grid-column: auto !important;
   z-index: var(--mobile-stack-layer, 1) !important;
   transform: none !important; translate: none !important; rotate: none !important;
   opacity: 1 !important; visibility: visible !important; filter: none !important;
   animation: none !important; will-change: auto !important; pointer-events: auto !important;
 }
 body #main#main .mobile-scroll-stack > .coverflow-controls,
 body #main#main .mobile-scroll-stack > .coverflow-aura { display: none !important; }
 body #main#main .mobile-scroll-stack::before { display: none !important; }
 body #main#main .mobile-scroll-card.timeline-milestone::before { display: none; }
}

@media(max-width:768px) and (prefers-reduced-motion:no-preference){body #main#main .mobile-scroll-card a,body #main#main .mobile-scroll-card button{pointer-events:auto!important}}

/* Universal Desktop Screen Center Alignment for Section Headers across all pages */
@media (min-width: 769px) {
  .has-study-sticker {
    padding-right: 0 !important;
  }
  .page-hero .container.has-study-sticker,
  .inner-hero .container.has-study-sticker {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  .section > .container > .section-head,
  .section-head.center,
  .section-head:not(.card .section-head):not(.contact-form-card .section-head),
  .has-study-sticker.section-head {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 820px !important;
    position: relative !important;
  }

  .section > .container > .section-head > *,
  .section-head.center > *,
  .section-head:not(.card .section-head):not(.contact-form-card .section-head) > *,
  .has-study-sticker.section-head > * {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    align-self: center !important;
  }

  .section-head__eyebrow,
  .section-head .badge,
  .section-head .pill {
    display: inline-flex !important;
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
    text-align: center !important;
  }

  .section-head__title,
  .section-head h1,
  .section-head h2,
  .section-head h3 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .section-head__lead,
  .section-head p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
    max-width: 760px !important;
  }

  /* Position decorative stickers safely outside the text area on desktop screens */
  .section-head .site-study-sticker {
    position: absolute !important;
    right: -75px !important;
    top: -20px !important;
    width: 70px !important;
    height: 70px !important;
    pointer-events: none !important;
    z-index: 2 !important;
  }
}

/* Hide stickers on tablet and narrow screens (<= 1080px) to prevent any chance of overlap */
@media (max-width: 1080px) {
  .site-study-sticker {
    display: none !important;
  }
}