/* ============================================================
   ALIS Valves - Responsive Stylesheet
   Breakpoints: 1024px, 768px, 480px, 360px
============================================================ */

/* ---- 1024px ---- */
@media (max-width: 1024px) {
  :root { --page-px: 28px; }

  .header-row1__inner { height: 76px; }
  .logo__img { height: 42px; }
  .logo__main { font-size: 38px; }
  .logo__sub { font-size: 10px; }
  .primary-nav__list { gap: 18px; }
  .primary-nav__link { height: 76px; font-size: 12px; letter-spacing: .04em; }
  .primary-dropdown { top: 76px; }
  .subnav-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(220px, .7fr); }
  .subnav-col { min-height: 78px; padding: 10px 20px 14px; }
  .subnav-col__label { font-size: 10px; white-space: normal; max-width: 100%; }
  .subnav-col__links { gap: 14px; row-gap: 8px; }
  .subnav-col__link,
  .subnav-col__links > li > a { font-size: 14px; }
  .hero__title       { font-size: 44px; }
  .products__grid    { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capabilities__grid{ grid-template-columns: repeat(2, 1fr); }
  .testimonials__grid{ grid-template-columns: repeat(2, 1fr); }
  .blogs__grid       { grid-template-columns: repeat(2, 1fr); }
  .related-grid      { grid-template-columns: repeat(2, 1fr); }
  .accessories-grid  { grid-template-columns: repeat(2, 1fr); }
  .specs-layout      { grid-template-columns: 1fr 240px 1fr; }
  .product-images-grid { grid-template-columns: repeat(2, 1fr); }
  .footer__inner     { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer__bottom    { flex-direction: column; gap: 8px; }
  .inquiry-form      { grid-template-columns: 1fr 1fr; }
}

/* ---- 768px ---- */
@media (max-width: 768px) {
  :root { --page-px: 20px; }

  /* Header */
  .primary-nav  { display: none; }
  .hamburger    { display: flex; }

  /* Mobile nav panel */
  .primary-nav.is-open {
    display: flex; flex-direction: column;
    position: fixed; top: 76px; right: 0;
    width: min(320px, 85vw); height: calc(100vh - 76px);
    background: var(--white); box-shadow: var(--shadow-lg);
    z-index: 999; overflow-y: auto; padding: 16px 0;
    animation: slideIn .25s ease;
  }
  @keyframes slideIn {
    from { transform: translateX(100%); }
    to   { transform: translateX(0); }
  }
  .primary-nav.is-open .primary-nav__list { flex-direction: column; width: 100%; }
  .primary-nav.is-open .primary-nav__link { height: auto; padding: 14px 20px; border-bottom: 1px solid var(--border); width: 100%; justify-content: space-between; }
  .primary-nav.is-open .primary-dropdown { display: none; position: static; box-shadow: none; border: none; border-radius: 0; padding: 0; animation: none; background: var(--off-white); }
  .primary-nav.is-open .primary-nav__item.is-open .primary-dropdown { display: block; }
  .primary-nav.is-open .primary-dropdown__link { padding: 10px 28px; border-bottom: 1px solid var(--border); }

  /* Sub-nav hide */
  .header-row2 { display: none; }

  /* Hero */
  .hero__title        { font-size: 34px; }
  .hero__subtitle     { max-width: 100%; }
  .hero__box,
  .hero__slide        { min-height: 360px; }
  .hero__bg           { inset: 0 0 0 36%; opacity: .72; }
  .hero__content      { padding: 48px var(--page-px) 78px; }
  .hero__controls     { bottom: 24px; }

  /* Product hero */
  .product-hero__inner { grid-template-columns: 1fr; }
  .product-hero__content { padding: 40px 0; }
  .product-hero__card { border-radius: var(--radius); margin-top: 0; min-height: 260px; padding: 18px; }

  /* Layouts */
  .who__grid          { grid-template-columns: 1fr; }
  .about-intro        { grid-template-columns: 1fr; }
  .why__inner         { grid-template-columns: 1fr; }
  .why__images        { height: 260px; }
  .figures__grid      { grid-template-columns: 1fr; }
  .products__grid     { grid-template-columns: 1fr; }
  .product-card__icon { height: 220px; }
  .capabilities__grid { grid-template-columns: 1fr; }
  .testimonials__grid { grid-template-columns: 1fr; }
  .blogs__grid        { grid-template-columns: 1fr; }
  .related-grid       { grid-template-columns: repeat(2, 1fr); }
  .accessories-grid   { grid-template-columns: repeat(2, 1fr); }
  .specs-layout       { grid-template-columns: 1fr; }
  .product-images-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid       { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .woo-product-grid.products { grid-template-columns: repeat(2, 1fr) !important; }
  .products-layout    { grid-template-columns: 1fr; }
  .sidebar            { position: static; }
  .product-card__img-wrap { height: 210px; }
  .faq-grid           { grid-template-columns: 1fr; }
  .footer__inner      { grid-template-columns: 1fr; }
  .contact-layout     { grid-template-columns: 1fr; }
  .contact-form       { grid-template-columns: 1fr; }
  .contact-cards      { grid-template-columns: 1fr; }
  .inquiry-form       { grid-template-columns: 1fr; }

  /* Tab bar scroll */
  .tab-bar { overflow-x: auto; }
  .tab-bar__inner { flex-wrap: nowrap; }
  .product-download-card { flex-direction: column; align-items: flex-start; }
  .accessory-card__img,
  .related-card__img { height: 220px; padding: 8px; }

  /* CTA banner */
  .cta-banner { padding: 48px var(--page-px); }

  /* Figure */
  .figure-item { padding: 32px 20px; }
}

/* ---- 480px ---- */
@media (max-width: 480px) {
  :root { --page-px: 16px; }

  .hero__title         { font-size: 28px; }
  .hero__actions       { flex-direction: column; }
  .hero__controls      { gap: 10px; }
  .hero__box,
  .hero__slide         { min-height: 390px; }
  .hero__bg            { inset: 0; opacity: .22; background-position: center right; }
  .hero__overlay       { background: rgba(255,255,255,.84); }
  .hero__content       { padding: 44px var(--page-px) 82px; }
  .page-hero__title    { font-size: 26px; }
  .section-title       { font-size: 24px; }
  .products__grid,
  .capabilities__grid,
  .testimonials__grid,
  .blogs__grid,
  .accessories-grid,
  .related-grid,
  .product-images-grid { grid-template-columns: 1fr; }
  .product-grid        { grid-template-columns: 1fr; }
  .product-card__icon  { height: 180px; }
  .woo-product-grid.products { grid-template-columns: 1fr !important; }
  .product-card__img-wrap { height: 190px; }
  .figures__grid       { grid-template-columns: 1fr; }
  .who__card           { padding: 20px; }
  .subnav-grid         { grid-template-columns: 1fr; }
  .footer__inner       { gap: 28px; }
  .inquiry-section__title { font-size: 26px; }
  .specs-section__title   { font-size: 26px; }
  .product-hero__title    { font-size: 26px; }
  .product-hero__card     { min-height: 220px; padding: 14px; }
  .product-hero__img-tag  { max-height: 240px; }
  .accessory-card__img,
  .related-card__img      { height: 210px; padding: 8px; }
}

/* ---- 360px ---- */
@media (max-width: 360px) {
  :root { --page-px: 12px; }

  .hero__title      { font-size: 24px; }
  .hero__subtitle   { font-size: 16px; }
  .btn              { padding: 9px 16px; font-size: 12px; }
  .logo__main       { font-size: 28px; }
  .tab-btn          { padding: 12px 14px; font-size: 12px; }
  .figure-item__value { font-size: 32px; }
}

/* ---- Print ---- */
@media print {
  .site-header, .hero, .cta-banner, .footer { display: none !important; }
  body { font-size: 12pt; color: #000; }
  a { color: #000; text-decoration: underline; }
  .container { max-width: 100%; padding: 0; }
}
