/**
 * 08-responsive.css — Responsive Overrides
 * YDC Child Enterprise Theme
 *
 * All breakpoint rules in one file.
 * No responsive CSS scattered in component files.
 *
 * Breakpoints:
 *   Mobile:  max-width: 767px
 *   Tablet:  max-width: 991px
 *   Desktop: min-width: 1280px
 */

/* ═══════════════════════════════════════════════
   TABLET (≤ 991px)
═══════════════════════════════════════════════ */
@media (max-width: 991px) {

  /* Typography scale down */
  h1, #ydc-hero-inner-centered h1 {
    font-size: 3.75rem !important;
  }

  h2, .ydc-section-title {
    font-size: var(--text-3xl);
  }

  h3 {
    font-size: var(--text-2xl);
  }

  /* Hero */
  #ydc-hero-section {
    
    padding: var(--space-12) var(--space-5) var(--space-11);
  }

  /* Grid: 4 → 2 columns on tablet */
  .grid--3,
  .grid--4,
  .ydc-polaroid-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Footer grid */
  #ydc-footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-9);
  }

  /* Stats */
  .ydc-stat-number {
    font-size: var(--text-4xl);
  }

  .ydc-stats-grid {
    gap: var(--space-7);
  }

  /* Testimonials Split responsive (Tablet retains 2-column) */
  .ydc-testimonials-split {
    grid-template-columns: minmax(220px, 1fr) 2fr;
    gap: var(--space-8);
  }

  .ydc-testimonials-col-left {
    gap: var(--space-5);
  }

  .ydc-testimonial-quote {
    font-size: var(--text-lg);
    line-height: var(--leading-normal);
  }

  .ydc-testimonial-quote-wrap::before {
    font-size: 6rem;
    top: -24px;
    left: -16px;
  }
}

/* ═══════════════════════════════════════════════
   MOBILE (≤ 767px)
═══════════════════════════════════════════════ */
@media (max-width: 767px) {

  /* Typography scale down further */
  h1, #ydc-hero-inner-centered h1 {
    font-size: 2.5rem !important;
  }

  h2, .ydc-section-title {
    font-size: var(--text-2xl);
  }

  /* Section padding */
  .section {
    padding-block: var(--space-11);
  }

  /* Container padding */
  .container {
    padding-inline: var(--space-5);
  }

  /* Hero */
  #ydc-hero-section {
    
    padding: var(--space-11) var(--space-5) var(--space-10);
  }

  /* Header: hide desktop navs, center logo, position hamburger */
  #ydc-header {
    padding: var(--space-4) var(--space-5);
    position: absolute;
    justify-content: center;
  }

  #ydc-header .ydc-nav-left,
  #ydc-header .ydc-nav-right,
  #ydc-header nav {
    display: none !important;
  }

  #ydc-header .ydc-nav-logo {
    margin: 0 auto;
  }

  #ydc-hamburger {
    display: flex;
    position: absolute;
    right: var(--space-5);
    top: 50%;
    transform: translateY(-50%);
  }

  /* Grid: all → single column */
  .grid--2,
  .grid--3,
  .grid--4,
  .ydc-polaroid-grid {
    grid-template-columns: 1fr;
  }

  /* Footer grid: stack vertically */
  #ydc-footer-inner {
    grid-template-columns: 1fr;
    gap: var(--space-8);
    padding: var(--space-9) var(--space-5) var(--space-8);
    text-align: center !important;
  }
  
  #ydc-footer .ft-links {
    align-items: center !important;
  }

  #ydc-footer .ft-social {
    justify-content: center !important;
  }
  
  #ydc-footer .ft-desc {
    margin: 0 auto var(--space-6) !important;
  }

  #ydc-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
    padding: var(--space-5);
  }

  #ydc-footer-bottom .ft-bottom-links {
    gap: var(--space-4);
  }

  /* About / highlights inner */
  .ydc-about-inner {
    padding: var(--space-10) 0 !important;
  }

  .ydc-highlights-inner,
  .ydc-testimonials-inner,
  .ydc-cta-inner {
    padding: var(--space-10) var(--space-5);
  }

  /* Spotlight & Bento Grid Responsive */
  .ydc-spotlight-card {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .ydc-spotlight-media {
    height: 220px;
  }

  /* Contact & Archive Pages Mobile Alignment */
  .ydc-contact-grid {
    grid-template-columns: 1fr !important;
    gap: var(--space-6) !important;
  }

  .ydc-contact-form-card {
    padding: var(--space-6) var(--space-5) !important;
  }

  .ydc-archive-workshop-inner,
  .ydc-archive-insights-inner,
  .ydc-contact-container {
    padding: var(--space-8) var(--space-5) !important;
  }

  .ydc-tab-nav-wrapper {
    margin-bottom: var(--space-6);
    overflow-x: auto;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
    width: 100%;
  }

  .ydc-tab-nav {
    display: inline-flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    border-radius: 9999px;
    max-width: none;
  }

  .ydc-tab-btn {
    padding: 8px 18px;
    font-size: var(--text-xs);
    flex-shrink: 0;
  }

  /* Stats: 3 columns -> 1 column vertical stack */
  .ydc-stats-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .ydc-stat-number {
    font-size: var(--text-3xl);
  }

  .ydc-stat-glow-line-top {
    margin-bottom: var(--space-8);
  }

  .ydc-stat-glow-line-bottom {
    margin-top: var(--space-8);
  }

  /* Email row in footer: stack */
  #ydc-footer .ft-form {
    flex-direction: column;
  }

  #ydc-footer .ft-form button {
    width: 100%;
  }

  /* Testimonials Mobile */
  .ydc-testimonials-split {
    grid-template-columns: 1fr;
  }

  .ydc-testimonials-inner {
    padding: var(--space-9) var(--space-5);
  }

  .ydc-testimonials-title {
    font-size: var(--text-2xl) !important;
  }

  .ydc-testimonial-quote {
    font-size: var(--text-base);
  }

  .ydc-testimonial-avatar {
    width: 44px;
    height: 44px;
  }
}

/* ═══════════════════════════════════════════════
   LARGE DESKTOP (≥ 1280px)
═══════════════════════════════════════════════ */
@media (min-width: 1280px) {

  #ydc-hero-inner-centered h1 {
    font-size: 5.75rem !important;
  }

  #ydc-hero-section {
    padding: 160px var(--space-7) var(--space-13);
  }
}
