/* ==========================================================================
   mingda · page templates (design-spec §5.1 home, §5.3 product detail)
   ========================================================================== */

/* ============================== home (§5.1) ============================== */

/* 1 · hero carousel */
.md-hero{position:relative;background:var(--md-color-bg-dark);
  color:var(--md-color-text-inverse);overflow:hidden;}
.md-hero__slides{position:relative;}
.md-hero__slide{position:relative;display:none;padding-block:var(--md-space-12);}
.md-hero__slide.is-active{display:block;}
.md-hero__media{position:absolute;inset:0;z-index:0;}
.md-hero__media img{width:100%;height:100%;object-fit:cover;opacity:.42;}
.md-hero__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(21,21,23,.88) 0%,rgba(21,21,23,.62) 55%,rgba(21,21,23,.35) 100%);}
.md-hero__inner{position:relative;z-index:1;display:grid;
  grid-template-columns:repeat(12,1fr);gap:var(--md-space-6);}
.md-hero__copy{grid-column:span 6;}
.md-hero__copy h1,.md-hero__headline{color:var(--md-color-text-inverse);
  margin:0 0 var(--md-space-5);font-family:var(--md-font-heading);
  font-size:var(--md-text-h1);line-height:var(--md-lh-h1);font-weight:700;
  letter-spacing:var(--md-tracking-h1);}
html[lang="zh-CN"] .md-hero__headline{font-family:var(--md-font-heading-zh);}
.md-hero__copy .md-lede{color:var(--md-color-text-inverse-secondary);
  max-width:46ch;margin:0 0 var(--md-space-6);}
.md-hero .md-actions{flex-wrap:wrap;}
.md-hero__dots{position:absolute;left:50%;bottom:var(--md-space-5);
  transform:translateX(-50%);z-index:2;display:flex;gap:var(--md-space-2);
  list-style:none;margin:0;padding:0;}
.md-hero__dots button{width:40px;height:6px;border:0;border-radius:var(--md-radius-xs);
  background:var(--md-color-grey-600);cursor:pointer;padding:0;
  transition:background-color 180ms ease-out;}
.md-hero__dots button[aria-selected="true"]{background:var(--md-color-primary);}
@media (max-width:1023px){.md-hero__copy{grid-column:span 8;}}
@media (max-width:767px){
  .md-hero__slide{padding-block:var(--md-space-9);}
  .md-hero__copy{grid-column:span 4;}
  .md-hero .md-actions{flex-direction:column;align-items:stretch;}
  .md-hero .md-btn{width:100%;}
}

/* 2 · stat bar */
.md-stat-bar{background:var(--md-color-bg-dark);color:var(--md-color-text-inverse);
  padding-block:var(--md-space-9);}
.md-stat-bar__grid{display:grid;grid-template-columns:repeat(4,1fr);
  gap:var(--md-space-6);}
.md-stat{display:flex;flex-direction:column;gap:var(--md-space-2);
  border-left:2px solid var(--md-color-primary);padding-left:var(--md-space-4);}
.md-stat__value{font-family:var(--md-font-heading);font-size:var(--md-text-stat);
  font-weight:700;line-height:1;letter-spacing:var(--md-tracking-h1);
  color:var(--md-color-text-inverse);font-variant-numeric:tabular-nums;}
.md-stat__label{font-size:var(--md-text-small);color:var(--md-color-text-inverse-secondary);}
@media (max-width:1023px){
  .md-stat-bar__grid{grid-template-columns:repeat(2,1fr);}
  .md-stat-bar{padding-block:var(--md-space-8);}
}
@media (max-width:767px){
  .md-stat-bar__grid{grid-template-columns:1fr;gap:var(--md-space-5);}
  .md-stat__value{font-size:var(--md-text-stat);}
}

/* 3 · role cards */
.md-role-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md-space-6);}
.md-role-card{background:var(--md-color-white);border:1px solid var(--md-color-border);
  border-radius:var(--md-radius-sm);padding:var(--md-space-5);display:flex;
  flex-direction:column;gap:var(--md-space-3);transition:border-color 240ms ease-out,
  background-color 240ms ease-out;}
.md-role-card:hover{border-color:var(--md-color-primary);
  background:var(--md-color-green-50);}
.md-role-card__icon{width:32px;height:32px;color:var(--md-color-primary);}
.md-role-card__icon svg{width:32px;height:32px;stroke:currentColor;fill:none;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.md-role-card h3{font-size:var(--md-text-h4);margin:0;}
.md-role-card p{font-size:var(--md-text-body);color:var(--md-color-text-secondary);
  margin:0;}
.md-role-card .md-text-link{margin-top:auto;}
@media (max-width:1023px){.md-role-cards{grid-template-columns:1fr 1fr;}}
@media (max-width:767px){.md-role-cards{grid-template-columns:1fr;}}

/* 4 · industry cards */
.md-industry-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md-space-6);}
.md-industry-card{display:flex;flex-direction:column;background:var(--md-color-white);
  border:1px solid var(--md-color-border);border-radius:var(--md-radius-sm);
  overflow:hidden;transition:border-color 240ms ease-out,box-shadow 240ms ease-out;}
.md-industry-card:hover{border-color:var(--md-color-primary);box-shadow:var(--md-shadow-1);}
.md-industry-card__media{aspect-ratio:3/2;overflow:hidden;background:var(--md-color-bg-subtle);}
.md-industry-card__media img{width:100%;height:100%;object-fit:cover;}
.md-industry-card__body{padding:var(--md-space-5);}
.md-industry-card h3{font-size:var(--md-text-h4);margin:0 0 var(--md-space-2);}
.md-industry-card p{font-size:var(--md-text-small);color:var(--md-color-text-secondary);
  margin:0 0 var(--md-space-3);}
.md-industry-card__fibres{font-size:var(--md-text-caption);color:var(--md-color-text-link);
  text-transform:uppercase;letter-spacing:var(--md-tracking-caption);font-weight:600;}
@media (max-width:1023px){.md-industry-cards{grid-template-columns:1fr 1fr;}}
@media (max-width:767px){.md-industry-cards{grid-template-columns:1fr;}}

/* 5 · product line cards */
.md-product-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md-space-6);}
@media (max-width:1023px){.md-product-lines{grid-template-columns:1fr 1fr;}}
@media (max-width:767px){.md-product-lines{grid-template-columns:1fr;}}

/* 7 · factory & capacity */
.md-factory{display:grid;grid-template-columns:6fr 6fr;gap:var(--md-space-8);
  align-items:center;}
.md-factory__media{display:grid;grid-template-columns:2fr 1fr;gap:var(--md-space-4);}
.md-factory__main{aspect-ratio:4/3;overflow:hidden;border-radius:var(--md-radius-none);
  background:var(--md-color-bg-subtle);}
.md-factory__main img{width:100%;height:100%;object-fit:cover;}
.md-factory__thumbs{display:grid;grid-template-columns:1fr;gap:var(--md-space-4);}
.md-factory__thumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;
  border-radius:var(--md-radius-none);background:var(--md-color-bg-subtle);}
.md-factory__copy .md-actions{margin-top:var(--md-space-6);}
.md-factory__numbers{display:grid;grid-template-columns:1fr 1fr;gap:var(--md-space-5);
  margin-top:var(--md-space-6);}
.md-factory__number{background:var(--md-color-bg-subtle);border-radius:var(--md-radius-sm);
  padding:var(--md-space-4);}
.md-factory__number strong{display:block;font-family:var(--md-font-heading);
  font-size:var(--md-text-h3);font-weight:700;color:var(--md-color-text-link);
  line-height:1;font-variant-numeric:tabular-nums;}
.md-factory__number span{font-size:var(--md-text-caption);
  color:var(--md-color-text-secondary);}
@media (max-width:1023px){
  .md-factory{grid-template-columns:1fr;gap:var(--md-space-6);}
  .md-factory__media{grid-template-columns:1fr;}
  .md-factory__thumbs{grid-template-columns:repeat(3,1fr);}
}

/* 8 · resources / blog cards */
.md-blog-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md-space-6);}
.md-card-blog{display:flex;flex-direction:column;background:var(--md-color-white);
  border:1px solid var(--md-color-border);border-radius:var(--md-radius-sm);
  overflow:hidden;}
.md-card-blog__media{aspect-ratio:3/2;background:var(--md-color-bg-subtle);overflow:hidden;}
.md-card-blog__media img{width:100%;height:100%;object-fit:cover;}
.md-card-blog__media--placeholder{display:flex;align-items:center;justify-content:center;
  font-family:var(--md-font-heading);font-size:var(--md-text-h4);font-weight:700;
  color:var(--md-color-text-muted);}
.md-card-blog__body{padding:var(--md-space-5);display:flex;flex-direction:column;
  gap:var(--md-space-2);}
.md-card-blog__tag{font-size:var(--md-text-caption);font-weight:600;text-transform:uppercase;
  letter-spacing:var(--md-tracking-caption);color:var(--md-color-green-600);}
.md-card-blog h3{font-size:var(--md-text-h4);margin:0;line-height:1.3;}
.md-card-blog h3 a{color:inherit;text-decoration:none;}
.md-card-blog h3 a:hover{color:var(--md-color-text-link);}
.md-card-blog__excerpt{font-size:var(--md-text-small);color:var(--md-color-text-secondary);
  margin:0;}
.md-card-blog__meta{font-size:var(--md-text-caption);color:var(--md-color-text-muted);}
.md-card-blog .md-text-link{margin-top:auto;}
.md-resources__foot{display:flex;align-items:center;gap:var(--md-space-6);
  flex-wrap:wrap;margin-top:var(--md-space-8);}
@media (max-width:1023px){.md-blog-cards{grid-template-columns:1fr 1fr;}}
@media (max-width:767px){.md-blog-cards{grid-template-columns:1fr;}}

/* 6 · standard strip */
.md-standard-strip__head{display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--md-space-5);flex-wrap:wrap;margin-bottom:var(--md-space-8);}
.md-standard-strip__head h2{margin:0;}

/* ======================= product detail (§5.3) ============================ */

.md-crumbs{font-size:var(--md-text-caption);color:var(--md-color-text-secondary);
  padding-block:var(--md-space-5);}
.md-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--md-space-2);
  margin:0;padding:0;}
.md-crumbs li{margin:0;display:flex;align-items:center;gap:var(--md-space-2);}
.md-crumbs li::after{content:"/";color:var(--md-color-grey-400);}
.md-crumbs li:last-child::after{content:"";}
.md-crumbs a{color:var(--md-color-text-secondary);text-decoration:none;}
.md-crumbs a:hover{color:var(--md-color-text-link);text-decoration:underline;}
.md-crumbs [aria-current="page"]{color:var(--md-color-grey-700);}

.md-pdp-hero{display:grid;grid-template-columns:7fr 5fr;gap:var(--md-space-8);
  padding-bottom:var(--md-section-y);align-items:start;}
.md-gallery__main{aspect-ratio:4/3;background:var(--md-color-bg-subtle);overflow:hidden;
  border:1px solid var(--md-color-border);border-radius:var(--md-radius-sm);}
.md-gallery__main img{width:100%;height:100%;object-fit:cover;}
.md-gallery__thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--md-space-3);
  margin-top:var(--md-space-3);list-style:none;padding:0;}
.md-gallery__thumbs li{margin:0;}
.md-gallery__thumbs button{display:block;width:100%;padding:0;background:transparent;
  border:1px solid var(--md-color-border);border-radius:var(--md-radius-xs);
  cursor:pointer;overflow:hidden;aspect-ratio:1/1;}
.md-gallery__thumbs button.is-active{border:2px solid var(--md-color-primary);}
.md-gallery__thumbs img{width:100%;height:100%;object-fit:cover;}

.md-pdp-summary .md-brand-badge{display:inline-flex;align-items:center;gap:var(--md-space-2);
  padding:2px var(--md-space-2);border-radius:var(--md-radius-xs);
  background:var(--md-color-primary);color:var(--md-color-text-on-primary);
  font-family:var(--md-font-heading);font-size:var(--md-text-caption);font-weight:600;
  letter-spacing:var(--md-tracking-caption);text-transform:uppercase;
  margin-bottom:var(--md-space-4);}
.md-pdp-summary .md-brand-badge--hailidun{background:var(--md-color-hailidun);}
.md-pdp-summary h1{margin:0 0 var(--md-space-3);}
.md-pdp-summary__spec-line{font-size:var(--md-text-body-lg);color:var(--md-color-text-secondary);
  margin:0 0 var(--md-space-4);font-variant-numeric:tabular-nums;}
.md-pdp-summary__brand-line{font-size:var(--md-text-small);
  color:var(--md-color-text-secondary);margin:0 0 var(--md-space-5);}
.md-highlights{list-style:none;margin:0 0 var(--md-space-6);padding:0;
  display:flex;flex-direction:column;gap:var(--md-space-2);}
.md-highlights li{position:relative;padding-left:var(--md-space-5);margin:0;
  font-size:var(--md-text-body);color:var(--md-color-text-primary);}
.md-highlights li::before{content:"✓";position:absolute;left:0;top:0;
  color:var(--md-color-primary);font-weight:700;}
.md-pdp-summary .md-actions{margin-top:var(--md-space-2);}

.md-pdp-metrics{display:grid;grid-template-columns:1fr 1fr;gap:var(--md-space-4);}
.md-metric{background:var(--md-color-bg-subtle);border-radius:var(--md-radius-sm);
  padding:var(--md-space-4);}
.md-metric__label{display:block;font-size:var(--md-text-caption);
  color:var(--md-color-text-secondary);text-transform:uppercase;
  letter-spacing:var(--md-tracking-caption);margin-bottom:var(--md-space-2);}
.md-metric__value{display:block;font-family:var(--md-font-heading);
  font-size:var(--md-text-h3);font-weight:700;line-height:1.05;
  color:var(--md-color-text-primary);font-variant-numeric:tabular-nums;}
.md-metric__sub{display:block;font-size:var(--md-text-caption);
  color:var(--md-color-text-muted);margin-top:var(--md-space-1);}

.md-pdp-section + .md-pdp-section{padding-top:var(--md-section-y);}
.md-pdp-split{display:grid;grid-template-columns:7fr 5fr;gap:var(--md-space-8);
  align-items:start;}

.md-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--md-space-5);
  list-style:none;margin:0;padding:0;}
.md-swatches li{margin:0;}
.md-swatch__chip{width:100%;max-width:96px;aspect-ratio:1/1;border-radius:var(--md-radius-xs);
  border:1px solid var(--md-color-border);}
.md-swatch__name{font-size:var(--md-text-caption);color:var(--md-color-text-secondary);
  margin-top:var(--md-space-2);}
@media (max-width:1023px){
  .md-pdp-hero,.md-pdp-split{grid-template-columns:1fr;gap:var(--md-space-6);}
  .md-swatches{grid-template-columns:repeat(4,1fr);}
}
@media (max-width:767px){
  .md-swatches{grid-template-columns:repeat(3,1fr);}
  .md-swatch__chip{max-width:64px;}
  .md-pdp-metrics{grid-template-columns:1fr 1fr;}
}

.md-app-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md-space-6);}
.md-app-card{border-top:1px solid var(--md-color-border-subtle);
  padding-top:var(--md-space-4);}
.md-app-card h5{margin:0 0 var(--md-space-2);font-size:var(--md-text-h5);}
.md-app-card p{font-size:var(--md-text-small);color:var(--md-color-text-secondary);margin:0;}
@media (max-width:1023px){.md-app-cards{grid-template-columns:1fr 1fr;}}
@media (max-width:767px){.md-app-cards{grid-template-columns:1fr;}}

.md-related-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--md-space-4);}
@media (max-width:1023px){.md-related-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:767px){.md-related-grid{grid-template-columns:repeat(2,1fr);}}

.md-trust-note{border-left:4px solid var(--md-color-primary);
  background:var(--md-color-bg-brand-soft);border-radius:var(--md-radius-sm);
  padding:var(--md-space-4) var(--md-space-5);font-size:var(--md-text-small);
  color:var(--md-color-text-primary);}
.md-trust-note--hailidun{border-left-color:var(--md-color-hailidun);
  background:var(--md-color-bg-hailidun-soft);}

/* plain content pages that keep Astra layout get a touch of the same rhythm */
body:not(.md-tpl-home):not(.md-tpl-product) .entry-content{margin-block:var(--md-space-8);}
/* plain content pages that keep Astra layout get a touch of the same rhythm */
body:not(.md-tpl-home):not(.md-tpl-product) .entry-content{margin-block:var(--md-space-8);}

/* §5.3 · the product FAQ block. Not in the spec's component list, but the page
   emits FAQPage schema and schema is only valid when the Q&A is visible. */
.md-faq{padding-block:var(--md-space-5);border-top:1px solid var(--md-color-border-subtle);}
.md-faq:first-of-type{border-top:0;padding-top:0;}
.md-faq h3{margin:0 0 var(--md-space-3);font-size:var(--md-text-h4);color:var(--md-color-text-primary);}
.md-faq p{margin:0;font-size:var(--md-text-body);color:var(--md-color-text-secondary);}

/* The gallery main frame is empty until an image exists; keep the aspect box. */
.md-pdp .md-gallery__main{background:var(--md-color-bg-subtle);}

/* Selected colour swatch (§5.3 section 4). */
.md-swatches .md-swatch__chip.is-active{outline:2px solid var(--md-color-grey-800);outline-offset:2px;}

/* Same-family table rows that carry no link still need the details column to line up. */
.md-spec-table td.is-num .md-text-link{white-space:nowrap;}

/* On the detail page the enquiry band should not repeat the section rhythm twice. */
.md-pdp .md-cta-band{margin-top:0;}

/* ======================================================= client review 2026-09-16
   Yarn now leads the product-line row, so there are four cards instead of three.
   Kept in this file because it loads after components.css and has to win over the
   three-column rule above. */
@media (min-width:1024px){.md-product-lines{grid-template-columns:repeat(4,1fr);}}