/* ==========================================================================
   MERIDIAN EXPORTS — RESPONSIVE
   Breakpoints: 1200 (laptop) / 992 (tablet-land) / 768 (tablet) / 480 (small mobile)
   ========================================================================== */

/* ---------------- Laptop / small desktop ---------------- */
@media (max-width:1200px){
  .container{ padding:0 26px; }
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .cert-grid{ grid-template-columns:repeat(3,1fr); }
  .industry-grid{ grid-template-columns:repeat(2,1fr); }
  .team-grid{ grid-template-columns:repeat(2,1fr); }
  .process-steps{ grid-template-columns:repeat(3,1fr); row-gap:40px; }
  .process-line{ display:none; }
}

/* ---------------- Tablet landscape ---------------- */
@media (max-width:992px){
  .nav-links{ display:none; }
  .nav-cta .btn-ghost{ display:none; }
  .nav-toggle{ display:flex; }

  .hero .container{ grid-template-columns:1fr; }
  .hero-route{ max-width:420px; margin:0 auto; }
  .hero-stats{ flex-wrap:wrap; gap:18px; }
  .hero-stats div{ flex:1 1 40%; }

  .overview .container{ grid-template-columns:1fr; }
  .overview-media{ margin-bottom:20px; }
  .pillars{ grid-template-columns:1fr 1fr; }

  .product-grid{ grid-template-columns:repeat(2,1fr); }
  .stats-grid{ grid-template-columns:repeat(2,1fr); gap:32px 24px; }
  .presence .container{ grid-template-columns:1fr; }
  .presence-map{ order:-1; }

  .masonry{ column-count:2; }
  .contact-wrap{ grid-template-columns:1fr; }

  .footer-top{ grid-template-columns:1fr 1fr; gap:40px 30px; }
  .section-head{ flex-direction:column; align-items:flex-start; gap:16px; }
}

/* ---------------- Tablet portrait / mobile ---------------- */
@media (max-width:768px){
  .pad{ padding:80px 0; }
  .pad-sm{ padding:56px 0; }

  h2.section-title{ font-size:30px; }
  .hero{ padding-top:110px; text-align:left; }
  .hero-title{ font-size:38px; }
  .hero-actions .btn{ padding:14px 24px; font-size:13.5px; }

  .why-grid{ grid-template-columns:1fr; }
  .cert-grid{ grid-template-columns:repeat(2,1fr); }
  .industry-grid{ grid-template-columns:1fr; }
  .team-grid{ grid-template-columns:1fr 1fr; }
  .values-grid{ grid-template-columns:1fr; }
  .product-grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr 1fr; }
  .form-row{ grid-template-columns:1fr; }
  .footer-top{ grid-template-columns:1fr; gap:36px; padding-bottom:40px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }

  .process-steps{ grid-template-columns:1fr 1fr; }
  .masonry{ column-count:1; }

  .t-card{ padding:32px 24px; }
  .t-card p.quote{ font-size:18px; }

  .page-header{ padding:150px 0 60px; }

  #back-to-top{ right:18px; bottom:18px; width:44px; height:44px; }
}

/* ---------------- Small mobile ---------------- */
@media (max-width:480px){
  .container{ padding:0 20px; }
  .hero-title{ font-size:32px; }
  .hero-desc{ font-size:15.5px; }
  .hero-stats div{ flex:1 1 100%; padding-right:0; margin-bottom:10px; }

  .cert-grid{ grid-template-columns:1fr 1fr; }
  .team-grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr; gap:26px; }
  .process-steps{ grid-template-columns:1fr; }

  .modal{ grid-template-columns:1fr; max-height:90vh; overflow-y:auto; }
  .modal img{ min-height:200px; }

  .cta-band .container{ padding:70px 20px; }
  .section-head{ margin-bottom:36px; }

  .logo span.word{ display:none; }
}

/* Shared brand color system */
body{ background:var(--cream); color:var(--primary); }
.hero{ background:var(--primary); }
.hero-video-overlay{ background:rgba(0,0,0,.5); }
.overview,.why,.products,.industries,.gallery,.presence,.faq,.stats,.certifications,.certs,.about-presence{ background:var(--cream); }
.process,.cta-band,footer,.testimonials,.contact-info-card,.mobile-menu{ background:var(--primary); color:var(--cream); }
h1,h2,h3,h4,.presence-heading h2,.presence-benefits li,.certifications .section-title{ color:var(--primary); }
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4,.process h1,.process h2,.process h3,.process h4,.cta-band h2,.testimonials h2{ color:var(--cream); }
.section-sub,.section-head .side-note,.pillar p,.why-card p,.product-body p,.faq-a p,.presence-content > p{ color:rgba(31,61,52,.72); }
.on-dark .section-sub,.process p,.cta-band p,.footer-brand p{ color:rgba(231,226,214,.72); }
.why-card,.value-card,.product-card,.cert-card,.filter-btn,.faq-item,.pillar,.timeline{ border-color:rgba(31,61,52,.2); }
.why-card,.value-card,.product-card,.cert-card{ background:rgba(231,226,214,.72); }
.why-card:hover{ background:var(--primary); }
.why-icon,.faq-item.open .faq-q .plus{ background:rgba(108,127,82,.18); color:var(--secondary); border-color:var(--secondary); }
.why-card:hover .why-icon{ background:rgba(168,114,58,.2); color:var(--accent); }
.filter-btn:hover,.filter-btn.active{ border-color:var(--secondary); color:var(--primary); }
.filter-btn.active{ background:var(--secondary); }
.btn-primary{ background:var(--primary); color:var(--cream); }
.btn-primary:hover{ background:var(--secondary); color:var(--primary); }
.btn-outline{ color:var(--primary); border-color:var(--primary); }
.btn-outline:hover{ border-color:var(--secondary); color:var(--secondary); }
.btn-gold{ background:var(--accent); color:var(--cream); }
.btn-gold:hover{ background:var(--secondary); color:var(--primary); }
.btn-ghost{ color:var(--cream); border-color:rgba(231,226,214,.72); }
.btn-ghost:hover{ border-color:var(--accent); color:var(--cream); }
#navbar,#navbar.scrolled{ background:rgba(31,61,52,.9); border-color:rgba(231,226,214,.22); }
#navbar .logo,#navbar .nav-links a,#navbar.scrolled .nav-links a,#navbar .btn-ghost{ color:var(--cream); }
#navbar .nav-links a.active,#navbar.scrolled .nav-links a.active{ color:var(--secondary); }
#navbar .nav-links a::after{ background:var(--accent); }
#navbar .nav-toggle span,#navbar.scrolled .nav-toggle span{ background:var(--cream); }

/* About page editorial hero and section rhythm. */
.about-page-hero{
  min-height:100svh;
  display:flex;
  align-items:center;
  padding:170px 0 110px;
  background-image:linear-gradient(90deg,rgba(31,61,52,.9) 0%,rgba(31,61,52,.65) 45%,rgba(31,61,52,.25) 100%),url('../images/meridian-spice-export-hero.png');
  background-size:cover;
  background-position:center;
  border-bottom:1px solid rgba(231,226,214,.22);
}
.about-page-hero::before{ background:linear-gradient(180deg,rgba(31,61,52,.18),transparent 52%,rgba(31,61,52,.22)); }
.about-page-hero .container{ display:block; position:relative; z-index:1; }
.about-hero-copy{ max-width:620px; }
.about-hero-copy h1,.about-hero-copy p{ color:var(--cream); }
.about-hero-copy h1{ max-width:520px; }
.about-hero-copy .breadcrumb,.about-hero-copy .breadcrumb a{ color:rgba(231,226,214,.75); }
.about-hero-copy .breadcrumb a:hover{ color:var(--secondary); }
.about-page-hero .about-hero-visual{ display:none; }
.about-page-hero + .pad{ background:var(--cream); border-bottom:1px solid rgba(31,61,52,.1); }
.about-page-hero + .pad .overview{ background:transparent; }
.about-page-hero + .pad img{ box-shadow:0 24px 55px rgba(31,61,52,.16); }
.about-page-hero + .pad .eyebrow{ color:var(--secondary); }
.about-stats-band{ background:var(--secondary); color:var(--cream); }
.about-stats-band .container>div+div{ border-left-color:rgba(231,226,214,.2); }
.about-stats-band strong,.about-stats-band span{ color:var(--cream); }
.about-stats-band + .about-presence{ background:var(--cream-deep); border-bottom:1px solid rgba(31,61,52,.12); }
.about-stats-band + .about-presence .section-title,.about-stats-band + .about-presence .section-sub{ color:var(--primary); }
.about-stats-band + .about-presence .eyebrow{ color:var(--secondary); }
.about-stats-band + .about-presence .map-dot{ background:var(--accent); box-shadow:0 0 0 7px rgba(168,114,58,.18); }
.about-stats-band + .about-presence + .pad-sm{ background:var(--cream); border-bottom:1px solid rgba(31,61,52,.1); }
.about-stats-band + .about-presence + .pad-sm .timeline-item{ border-top-color:var(--secondary); }
.about-stats-band + .about-presence + .pad-sm .timeline-item::before{ background:var(--secondary); border-color:var(--cream); }
.about-stats-band + .about-presence + .pad-sm .yr{ color:var(--accent); }
.about-stats-band + .about-presence + .pad-sm + .pad{ background:var(--cream-light); border-bottom:1px solid rgba(31,61,52,.1); }
.about-stats-band + .about-presence + .pad-sm + .pad .value-card{ background:var(--cream-deep); border-color:rgba(31,61,52,.12); }
.about-stats-band + .about-presence + .pad-sm + .pad .value-icon{ color:var(--secondary); border-color:rgba(108,127,82,.5); }
.about-stats-band + .about-presence + .pad-sm + .pad .vnum{ color:var(--accent); }
.about-stats-band + .about-presence + .pad-sm + .pad + .pad-sm{ background:var(--cream); border-bottom:1px solid rgba(31,61,52,.12); }
.about-stats-band + .about-presence + .pad-sm + .pad + .pad-sm .quality-flow>div{ background:var(--cream-light); border:1px solid rgba(31,61,52,.16); }
.about-stats-band + .about-presence + .pad-sm + .pad + .pad-sm .quality-flow b{ color:var(--primary); }
.about-stats-band + .about-presence + .pad-sm + .pad + .pad-sm .quality-flow b::before{ color:var(--accent); }
.about-stats-band + .about-presence + .pad-sm + .pad + .pad-sm .quality-flow span{ color:rgba(31,61,52,.7); }
.about-page-hero ~ .cta-band{ background:var(--primary); border-bottom:1px solid rgba(231,226,214,.2); }
.about-page-hero ~ .cta-band h2{ color:var(--cream); }
.about-page-hero ~ .cta-band p{ color:rgba(231,226,214,.75); }
.about-page-hero ~ footer{ background:var(--green-deep); border-top:1px solid rgba(231,226,214,.18); }
.logo .mark{ background:var(--secondary); color:var(--cream); }
.presence-cta,.newsletter-form button{ background:var(--accent); color:var(--cream); }
.presence-cta:hover,.newsletter-form button:hover{ background:var(--secondary); color:var(--primary); }
.about-stats-band{ background:var(--secondary); }
.certifications .cert-logo span,.certifications .section-copy,.certifications .cert-trust{ color:var(--primary); }
.map-dot,.process-step.active .dot,.process-line-fill{ background:var(--accent); }
.process-step .num,.value-card .vnum,.eyebrow,.presence-heading .eyebrow,.industry-card span{ color:var(--secondary); }
.page-header{ background:var(--primary); }
.page-header h1,.page-header p,.breadcrumb,.breadcrumb a{ color:var(--cream); }
.cta-band::before{ background:radial-gradient(circle at 20% 50%,rgba(108,127,82,.22),transparent 60%); }
.faq-q{ color:var(--primary); }
.footer-col a:hover,.footer-bottom a:hover{ color:var(--accent); }

/* Homepage section rhythm: derived tones keep adjacent bands distinct. */
.hero{ background-color:var(--primary); }
.hero-video-overlay{ background:rgba(0,0,0,.5); }
#about-premium{ background:var(--cream-light); border-bottom:1px solid rgba(31,61,52,.08); }
.why{ background:var(--sage-tint); border-bottom:1px solid rgba(31,61,52,.1); }
.products{ background:var(--cream); border-top:1px solid rgba(31,61,52,.08); border-bottom:1px solid rgba(31,61,52,.12); }
.process{ background:var(--primary); border-top:1px solid rgba(231,226,214,.14); border-bottom:1px solid rgba(231,226,214,.14); }
.certifications{ background:var(--cream-light); border-bottom:1px solid rgba(31,61,52,.1); }
.presence{ background:var(--cream-deep); border-bottom:1px solid rgba(31,61,52,.14); }
.faq{ background:var(--cream); border-top:1px solid rgba(31,61,52,.1); border-bottom:1px solid rgba(31,61,52,.12); }
.cta-band{ background:var(--primary); border-bottom:1px solid rgba(231,226,214,.22); }
footer{ background:var(--green-deep); border-top:1px solid rgba(231,226,214,.18); }

.hero,.process,.cta-band,footer{ color:var(--cream); }
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4,.cta-band h2{ color:var(--cream); }
.section-sub,.section-head .side-note,.pillar p,.why-card p,.product-body p,.faq-a p,.presence-content > p{ color:rgba(31,61,52,.72); }
.on-dark .section-sub,.process p,.cta-band p,.footer-brand p{ color:rgba(231,226,214,.72); }
.why-card,.value-card,.product-card,.cert-card{ background:rgba(240,236,227,.72); border-color:rgba(31,61,52,.16); }
.why-card:hover{ background:var(--primary); }
.why-icon{ background:rgba(108,127,82,.18); color:var(--secondary); }
.why-card:hover .why-icon{ background:rgba(168,114,58,.2); color:var(--accent); }
.process-step .dot{ border-color:rgba(231,226,214,.35); }
.process-step.active .dot,.process-line-fill{ background:var(--accent); }
.presence-heading h2,.presence-benefits li,.certifications .section-title,.faq-q{ color:var(--primary); }
.presence-benefits li::before{ color:var(--secondary); }
.presence-cta,.btn-gold{ background:var(--accent); color:var(--cream); }
.presence-cta:hover,.btn-gold:hover{ background:var(--secondary); color:var(--primary); }
.btn-primary{ background:var(--primary); color:var(--cream); }
.btn-primary:hover{ background:var(--secondary); color:var(--primary); }
.btn-outline{ border-color:var(--primary); color:var(--primary); }
.btn-outline:hover{ border-color:var(--accent); color:var(--accent); }
#navbar,#navbar.scrolled{ background:rgba(31,61,52,.9); border-color:rgba(231,226,214,.24); }
#navbar .logo,#navbar .nav-links a,#navbar.scrolled .nav-links a,#navbar .btn-ghost{ color:var(--cream); }
#navbar .nav-links a.active,#navbar.scrolled .nav-links a.active{ color:var(--secondary); }
#navbar .nav-links a::after{ background:var(--accent); }
#navbar .btn-ghost{ border-color:rgba(231,226,214,.72); }
#navbar .nav-toggle span,#navbar.scrolled .nav-toggle span{ background:var(--cream); }