/* =========================================================================
   Responsive Web Design - explicit breakpoints required by the brief:
   1200 / 992 / 768 / 576 / 480 px. Layouts are fluid between them using
   clamp(), minmax(0,1fr) and percentage widths, so every viewport from
   1920px down to 360px renders without horizontal scrolling.
   ========================================================================= */

/* ---------- Large desktop / small desktop ---------- */
@media (max-width:1200px){
  .container{padding:0 22px}
  .product-grid--4,.cert-grid,.application-grid,.capability-grid,.design-code-grid,.strength-grid,.facility-grid,.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feature-grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .process-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:26px}
  .primary-menu{gap:14px}
  .primary-menu>li>a{font-size:12px}
  .header-quote{padding:0 18px;font-size:11px}
  .timeline{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .timeline::before{display:none}
}

/* ---------- Tablet landscape: switch to the mobile menu ---------- */
@media (max-width:992px){
  .site-header__inner{min-height:72px}
  .site-logo,.custom-logo{height:48px}
  .primary-navigation{display:none}
  .header-quote{display:none}
  .menu-toggle{display:flex}
  .mobile-navigation{display:block}
  .mobile-navigation[hidden]{display:none}
  .product-grid--3,.product-grid--4,.news-grid,.cert-grid,.feature-grid--3,.feature-grid--4,.application-grid,.capability-grid,.design-code-grid,.team-grid,.strength-grid,.facility-grid,.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .feature-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .home-intro__grid,.about-overview__grid,.product-hero__grid,.quality-grid,.split-block,.inquiry-split,.contact-grid,.product-detail__grid{grid-template-columns:1fr 1fr;gap:30px}
  .hero{min-height:520px}
  .footer-cta__inner{flex-direction:column;align-items:flex-start;gap:24px}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
  .post-layout,.page-layout--sidebar{grid-template-columns:minmax(0,1fr) 260px;gap:28px}
  .quality-grid__media{order:2}
  .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gallery--thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ---------- Tablet portrait / large phones: single column content ---------- */
@media (max-width:768px){
  body{font-size:15.5px}
  .section{padding:60px 0}
  .container{padding:0 18px}
  .topbar__tagline{display:none}
  .topbar__inner{min-height:34px;justify-content:center}
  .topbar__contact{justify-content:center;gap:16px}
  .hero{min-height:480px}
  .hero__inner{padding-top:48px;padding-bottom:52px}
  .hero h1{font-size:clamp(1.9rem,7vw,2.7rem)}
  .hero__subtitle{font-size:1rem}
  .hero__scroll{display:none}
  .trust-strip__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .trust-stat:nth-child(2){border-right:0}
  .trust-stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}
  .home-intro__grid,.about-overview__grid,.product-hero__grid,.quality-grid,.split-block,.inquiry-split,.contact-grid,.product-detail__grid,.post-layout,.page-layout--sidebar{grid-template-columns:minmax(0,1fr);gap:30px}
  .home-intro__badge{right:12px;bottom:-18px;padding:12px 18px}
  .product-grid--3,.product-grid--4,.news-grid,.feature-grid--2,.feature-grid--3,.feature-grid--4,.application-grid,.capability-grid,.design-code-grid,.team-grid,.strength-grid,.facility-grid,.stat-grid,.chip-grid,.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .section-head{margin-bottom:34px}
  .section-head h2{font-size:1.8rem}
  .timeline{grid-template-columns:repeat(2,minmax(0,1fr))}
  .post-layout .sidebar,.page-layout .sidebar{order:2}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
  .footer-bottom{flex-direction:column;text-align:center}
  .footer-bottom__links{text-align:center}
  .form-row{grid-template-columns:minmax(0,1fr);gap:20px}
  .form-actions{flex-direction:column;align-items:stretch}
  .form-actions .btn{width:100%}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery--thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .data-table{font-size:.88rem}
  .data-table th,.data-table td{padding:13px 14px}
  .faq-item__button{padding:17px 16px;font-size:.95rem}
  .faq-item__a{padding:0 16px 18px}
  .lightbox__nav{width:38px;height:38px}
  .lightbox__nav--prev{left:8px}
  .lightbox__nav--next{right:8px}
  .lightbox__close{top:12px;right:12px}
  .cert-card__media{aspect-ratio:3/4}
}

/* ---------- Phones ---------- */
@media (max-width:576px){
  .section{padding:50px 0}
  .hero{min-height:440px}
  .hero__overlay{background:linear-gradient(90deg,rgba(7,31,56,.94),rgba(10,44,78,.76))}
  .hero h1{font-size:clamp(1.7rem,8vw,2.25rem)}
  .hero__content{max-width:100%}
  .btn-group{flex-direction:column;align-items:stretch;width:100%}
  .btn-group .btn{width:100%}
  .product-grid--3,.product-grid--4,.news-grid,.feature-grid--2,.feature-grid--3,.feature-grid--4,.application-grid,.capability-grid,.design-code-grid,.team-grid,.strength-grid,.facility-grid,.stat-grid,.chip-grid,.process-grid,.cert-grid,.timeline{grid-template-columns:minmax(0,1fr)}
  .footer-grid{grid-template-columns:minmax(0,1fr);gap:26px;padding-bottom:34px}
  .footer-col--about{order:-1}
  .trust-strip__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-card__media{aspect-ratio:16/9}
  .section-head h2{font-size:1.6rem}
  .section-head__sub{font-size:.96rem}
  .page-title{font-size:1.9rem}
  .page-hero,.page-hero--inner{padding:52px 0}
  .news-card__media{aspect-ratio:16/9}
  .product-card__media{aspect-ratio:16/10}
  .cert-card__media{aspect-ratio:4/3}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .gallery--thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-form-wrap,.reactor-inquiry .cec-form,.pv-inquiry .cec-form{padding:20px 18px}
  .contact-info__cta{padding:22px}
  .breadcrumb ol{padding:11px 0;font-size:12px}
  .quality-list li{gap:12px}
  .lightbox{padding:14px}
  .lightbox__img{max-height:70vh}
  .map-frame{aspect-ratio:4/3}
  .data-table{min-width:560px}
  .error-404 .btn-group{align-items:center}
}

/* ---------- Small phones (430 / 414 / 390 / 375 / 360) ---------- */
@media (max-width:480px){
  html{font-size:15px}
  .container{padding:0 15px}
  .topbar__contact{gap:10px;font-size:11px}
  .topbar__contact a{font-size:11px}
  .site-header__inner{min-height:64px;gap:10px}
  .site-logo,.custom-logo{height:42px;max-width:180px}
  .hero{min-height:420px}
  .hero__eyebrow{font-size:10px;letter-spacing:.12em;margin-bottom:16px;padding-left:10px}
  .hero h1{font-size:clamp(1.55rem,8.4vw,2rem);line-height:1.18}
  .hero__subtitle{font-size:.93rem;line-height:1.6;margin-bottom:26px}
  .btn{font-size:11px;padding:0 20px;min-height:44px;width:100%}
  .btn-lg{min-height:48px}
  .trust-stat{padding:18px 8px}
  .trust-stat__value{font-size:1.5rem}
  .trust-stat__label{font-size:10px;letter-spacing:.04em}
  .section{padding:44px 0}
  .section-head h2{font-size:1.45rem}
  .eyebrow,.section-head .eyebrow{font-size:10px}
  .product-card__body,.news-card__body,.cert-card__body,.facility-card__body{padding:18px}
  .feature-card,.application-card,.capability-card,.design-code-card,.material-card,.team-card,.strength-card{padding:22px 20px}
  .stat-card{padding:24px 16px}
  .process-card h3{padding:14px 14px 0}
  .process-card p{padding:0 14px 16px}
  .faq-item__button{font-size:.9rem;padding:15px 12px;gap:12px}
  .faq-item__a{padding:0 12px 16px;font-size:.92rem}
  .quality-list li{flex-direction:column;gap:4px}
  .quality-list__num{padding-top:0}
  .table-wrap{margin-left:0;margin-right:0}
  .data-table{min-width:520px;font-size:.82rem}
  .data-table th,.data-table td{padding:11px 10px}
  .footer-cta h2{font-size:1.4rem}
  .footer-cta p{font-size:.94rem}
  .footer-cta .btn-group{width:100%}
  .footer-bottom{font-size:12px}
  .form-consent label{font-size:.82rem}
  .search-form{flex-direction:column}
  .lightbox__close{width:36px;height:36px;top:8px;right:8px}
  .lightbox__nav{width:34px;height:34px;font-size:18px}
  .lightbox__nav--prev{left:4px}
  .lightbox__nav--next{right:4px}
  .lightbox__caption{font-size:12px}
  .post-meta{font-size:.88rem}
  .timeline__item{padding-top:52px}
  .gallery{gap:8px}
}

/* ---------- Safety net: never allow horizontal overflow ---------- */
@media (max-width:1200px){
  html,body{overflow-x:hidden;max-width:100%}
  .site-main,.site-header,.site-footer,.footer-cta,.topbar,.hero,.page-hero,.product-hero{max-width:100%;overflow-x:clip}
  .product-hero,.hero,.page-hero{overflow:hidden}
  .section,.container{min-width:0}
  table{max-width:100%}
  pre,code{max-width:100%;overflow-x:auto}
  .btn{white-space:normal}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media print{
  .topbar,.site-header,.footer-cta,.site-footer,.hero__scroll,.breadcrumb,.menu-toggle{display:none!important}
  body{color:#000;background:#fff}
  .section{padding:20px 0}
}