/* Brand showcase added to the saved MAXER design. */
.brands{border-top:1px solid #e1e8df}
.brands-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.brand-card{min-width:0}
.brand-card-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:245px;padding:60px 28px;background:#153f2c;overflow:hidden}
.brand-card-visual::after{content:"";position:absolute;inset:12px;border:1px solid rgba(217,235,219,.16);pointer-events:none}
.brand-card-visual-bodyguardz{background:#1c4834}
.brand-card-visual-vonmaehlen{background:#244334}
.brand-card-visual img{width:auto;max-width:78%;max-height:62px;object-fit:contain}
.brand-card-visual-noise img{width:145px}
.brand-card-visual-bodyguardz img{width:220px}
.brand-card-visual-vonmaehlen img{width:205px;max-height:76px}
.brand-card-number,.brand-card-visual-label{position:absolute;z-index:1;color:#d4e6d5;font-size:9px;font-weight:700;letter-spacing:.14em}
.brand-card-number{top:26px;left:27px}
.brand-card-visual-label{bottom:25px;left:27px}
.brand-card-info{padding:24px 1px 0}
.brand-card-info h3{margin:0 0 12px;color:#193d2b;font-family:var(--display-font);font-size:32px;font-weight:600;line-height:1.2;text-shadow:0 3px 5px rgba(19,55,35,.16),0 1px 1px rgba(19,55,35,.08)}
.brand-card-info p{min-height:52px;margin:0 0 17px;color:#738078;font-size:13px;line-height:1.9}
.brand-card-info a{display:inline-flex;align-items:center;gap:28px;padding:10px 0;border-bottom:1px solid #a9baaa;color:#224834;font-size:12px;font-weight:700}
.brand-card-info a span:last-child{font-size:16px;font-weight:400}
.brand-card-info a:hover{color:#0b7a3f;border-color:#0b7a3f}
@media(max-width:900px){.brands-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 22px}}
@media(max-width:600px){.brands-grid{grid-template-columns:1fr;gap:42px}.brand-card-visual{min-height:210px}.brand-card-info p{min-height:0}.brand-card-info h3{font-size:30px}}
/* Keep the original hero within very narrow phone screens. */
@media(max-width:360px){.hero{grid-template-columns:minmax(0,1fr)}.hero-copy,.hero-image-wrap{min-width:0}.hero-note{white-space:normal;flex-wrap:wrap}}
.product-image img{object-fit:contain;padding:8%;background:#edf1ea}
.product-collection-link{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px;font-weight:700;color:#385641}
.product-collection-link span:last-child{font-size:18px;font-weight:400}
/* Keep all three products and wordmarks visible inside the saved hero layout. */
.hero-image-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0b1c13}
.hero-image-wrap .hero-image{width:100%;height:auto;min-height:0;aspect-ratio:auto;object-fit:contain}
.hero-image-wrap .hero-image-label{display:none}
/* Give the product banner more space and keep the introduction compact. */
@media(min-width:761px){
  .hero{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);min-height:510px}
  .hero-copy{padding:68px clamp(24px,3vw,46px) 28px}
  .hero h1{font-size:clamp(36px,3.6vw,52px);line-height:1.24;margin:24px 0 17px}
  html[lang="en"] .hero h1{font-size:clamp(42px,4.2vw,60px);line-height:1.05}
  html[lang="ja"] .hero h1,html[lang="ko"] .hero h1{font-size:clamp(30px,3.4vw,50px)}
  .hero-copy>p{font-size:14px;line-height:1.85;margin-bottom:26px}
  .hero-note{padding-top:40px;white-space:normal;flex-wrap:wrap}
}
@media(min-width:761px) and (max-width:1000px){
  .hero{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
  .hero-copy{padding:52px 22px 25px}
  html[lang="en"] .hero h1{font-size:clamp(40px,5vw,51px)}
}
@media(max-width:760px){
  .hero-copy{padding:38px 26px 24px}
  .hero h1{font-size:clamp(31px,8.8vw,42px);line-height:1.25;margin:22px 0 14px}
  html[lang="en"] .hero h1{font-size:clamp(38px,10vw,48px);line-height:1.05}
  html[lang="ja"] .hero h1,html[lang="ko"] .hero h1{font-size:clamp(28px,7.4vw,38px)}
  .hero-copy>p{font-size:13px;line-height:1.8;margin:0 0 22px}
  .hero-note{padding-top:28px}
  .hero .button{padding:15px 18px;min-width:180px}
}