
/* ══════════════════════════════════════
   BRAND PAGE  (page-brands.php)
   BRAND ARCHIVE (taxonomy-sg_product_brand.php)
══════════════════════════════════════ */

/* ── 브랜드 페이지에서 헤더 항상 고정 배경 표시 ── */
.page-template-page-brands .header,
.tax-sg_product_brand .header {
    position: fixed;
    background: rgba(10, 22, 40, 0.97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0, 78, 162, 0.25);
}

/* ── 서브페이지 히어로 (다른 서브페이지와 동일 구조) ── */
.sub-hero {
    width: 100%;
    min-height: 420px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #0a1628 0%, #0d2a50 60%, #091a30 100%);
    background-size: cover;
    background-position: center;
    padding-top: 110px; /* 헤더 높이 */
}
.sub-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(5, 14, 30, 0.75) 0%,
        rgba(10, 31, 60, 0.6) 50%,
        rgba(6, 14, 28, 0.7) 100%
    );
    z-index: 1;
}
.sub-hero .w_container { position: relative; z-index: 2; }
.sub-hero-inner {
    padding: 60px 0 70px;
}
.sub-hero-label {
    font-family: var(--engType);
    font-size: 0.82em;
    font-weight: 600;
    letter-spacing: 4px;
    color: var(--accentColor);
    margin-bottom: 14px;
    text-transform: uppercase;
}
.sub-hero-title {
    font-family: var(--engType);
    font-size: clamp(2.4em, 5.5vw, 4.8em);
    font-weight: 700;
    color: #fff;
    line-height: 1em;
    letter-spacing: -0.02em;
}
.sub-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 22px;
    font-size: 0.88em;
    color: rgba(255,255,255,0.5);
}
.sub-breadcrumb a {
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    transition: color 0.2s;
}
.sub-breadcrumb a:hover { color: #fff; }
.sub-bc-sep { color: rgba(255,255,255,0.28); }

@media(max-width:1280px) { .sub-hero { min-height: 360px; } }
@media(max-width:768px)  {
    .sub-hero { min-height: 300px; padding-top: 80px; }
    .sub-hero-inner { padding: 44px 0 52px; }
}

/* ── SEC1 인트로 ── */
.brand_intro{
  padding:100px 0;
  background:#fff;
  border-bottom:1px solid #eee;
}
.brand_intro_inner{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:80px;
  align-items:center;
}
.brand_intro_img{
  border-radius:24px;
  overflow:hidden;
  aspect-ratio:4/3;
  background:#f0f5ff;
  display:flex;
  align-items:center;
  justify-content:center;
}
.brand_intro_img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.brand_intro_img_placeholder{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding:40px;
  text-align:center;
}
.brand_intro_icon{font-size:64px;line-height:1;}
.brand_intro_icon_sub{
  font-size:1.4em;
  font-weight:300;
  color:#aaa;
  line-height:1.4;
}
.brand_intro_icon_sub strong{
  font-family:var(--engType);
  font-size:2em;
  font-weight:700;
  color:var(--mainColor);
  display:block;
}
.brand_intro_label{
  font-family:var(--engType);
  font-size:0.82em;
  font-weight:600;
  letter-spacing:3px;
  color:var(--mainColor);
  margin-bottom:16px;
}
.brand_intro_title{
  font-family:var(--titleType);
  font-size:clamp(1.5em,2.8vw,2.5em);
  font-weight:700;
  line-height:1.3;
  color:#111;
  margin-bottom:24px;
}
.brand_intro_desc{
  font-size:1em;
  line-height:1.85;
  color:#555;
}

/* ── SEC2 주요 브랜드 ── */
.brand_major{
  padding:100px 0;
  background:#f8f9fb;
}
.brand_major_grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:50px;
}
.brand_major_card{
  background:#fff;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 2px 16px rgba(0,0,0,0.07);
  transition:transform 0.28s, box-shadow 0.28s;
  cursor:pointer;
}
.brand_major_card > a,
.brand_major_card > div{
  display:block;
  text-decoration:none;
  color:inherit;
}
.brand_major_card:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 36px rgba(0,78,162,0.14);
}
.brand_major_img{
  width:100%;
  aspect-ratio:500/405;   /* 실제 이미지 비율 500×405 */
  background-size:contain!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-color:#f0f4f8!important; /* 여백 배경색 */
  position:relative;
  overflow:hidden;
}
.brand_major_overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, transparent 30%, rgba(0,0,0,0.55) 100%);
}
.brand_major_country{
  position:absolute;
  bottom:12px;
  left:14px;
  font-size:0.8em;
  color:rgba(255,255,255,0.9);
  background:rgba(0,0,0,0.45);
  padding:4px 10px;
  border-radius:20px;
  backdrop-filter:blur(6px);
  z-index:2;
}
.brand_major_body{
  padding:22px 24px 26px;
}
.brand_major_sub{
  font-size:0.78em;
  color:var(--mainColor);
  font-weight:600;
  letter-spacing:0.02em;
  margin-bottom:6px;
  line-height:1.4;
}
.brand_major_name{
  font-family:var(--engType);
  font-size:1.22em;
  font-weight:700;
  color:#111;
  margin-bottom:10px;
  line-height:1.2;
}
.brand_major_desc{
  font-size:0.88em;
  line-height:1.75;
  color:#666;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.brand_major_more{
  display:inline-block;
  margin-top:14px;
  font-size:0.85em;
  font-weight:600;
  color:var(--mainColor);
  transition:letter-spacing 0.2s;
}
.brand_major_card:hover .brand_major_more{
  letter-spacing:1px;
}

/* ── SEC3 전체 브랜드 ── */
.brand_all{
  padding:100px 0 120px;
  background:#fff;
}
.brand_all_grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:16px;
  margin-top:50px;
}
.brand_all_item{
  border:1px solid #e8e8e8;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:3/2;
  transition:all 0.22s;
  padding:12px;
}
.brand_all_item a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
}
.brand_all_item img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  filter:grayscale(30%);
  transition:filter 0.22s;
}
.brand_all_item:hover{
  border-color:var(--mainColor);
  box-shadow:0 4px 18px rgba(0,78,162,0.1);
  transform:translateY(-3px);
}
.brand_all_item:hover img{
  filter:grayscale(0%);
}
.brand_all_name{
  font-size:0.8em;
  font-weight:600;
  color:#555;
  text-align:center;
  line-height:1.3;
}

/* ── 반응형 ── */
@media(max-width:1280px){
  .brand_major_grid{grid-template-columns:repeat(2,1fr);}
  .brand_all_grid{grid-template-columns:repeat(5,1fr);}
}
@media(max-width:960px){
  .brand_intro_inner{grid-template-columns:1fr;gap:40px;}
  .brand_major_grid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .brand_all_grid{grid-template-columns:repeat(4,1fr);}
}
@media(max-width:640px){
  .sub_hero{padding:130px 0 60px;}
  .brand_intro,.brand_major,.brand_all{padding:70px 0;}
  .brand_major_grid{grid-template-columns:1fr;gap:14px;}
  .brand_all_grid{grid-template-columns:repeat(3,1fr);gap:10px;}
}
@media(max-width:480px){
  .brand_all_grid{grid-template-columns:repeat(2,1fr);}
}
