/* Home: faster comparison for business buyers. */
.business-hero{background:#181917;color:#fff}
.business-hero:after{background:linear-gradient(90deg,#181917 0%,rgba(24,25,23,.96) 30%,rgba(24,25,23,.22) 63%,rgba(24,25,23,.04) 100%)}
.business-hero p:not(.eyebrow){color:#d6d7d1}
.business-hero .eyebrow,.business-hero .hero-index{color:#fff}
.business-hero .button.dark{background:#fff;border-color:#fff;color:#181917}
.business-hero .button.outline{background:transparent;border-color:#fff;color:#fff}
.family-card{position:relative;cursor:pointer;transition:transform .22s ease,background .22s ease}
.family-card:hover{opacity:1;transform:translateY(-3px);background:#efefea}
.family-card:focus-visible{outline:3px solid var(--olive);outline-offset:4px}
.family-card-cta{display:inline-flex;align-items:center;gap:19px;border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:18px;font-size:14px;font-weight:700}
.family-card-cta b{font-size:16px;font-weight:500}
@media (min-width:801px){
  .business-hero{height:min(520px,calc(100vh - 86px));min-height:450px}
  .business-hero>div{top:48%}
  .business-hero>div{max-width:800px}
  .business-hero h1{font-size:clamp(38px,3.7vw,54px);margin-bottom:15px}
  .business-hero p:not(.eyebrow){line-height:1.7}
  .families{padding-bottom:0}
  .families .intro{padding-top:38px;padding-bottom:18px}
  .intro h2{font-size:clamp(32px,3.1vw,43px)}
  .family-grid{max-width:none;margin:0 auto;padding:0 3.5% 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
  .family-card{min-width:0;background:#f6f6f2;display:flex;flex-direction:column}
  .family-card .family-image{height:clamp(250px,18vw,350px);flex:none}
  .family-card .family-image img{height:100%;object-position:center}
  .family-utility .family-image img{object-position:65% center}
  .family-card .family-copy{padding:28px 31px 30px;display:block;background:transparent}
  .family-card .family-copy .eyebrow{font-size:13px;margin-bottom:10px;letter-spacing:.08em}
  .family-card .family-copy h2{font-size:clamp(38px,2.8vw,52px);min-height:0;margin-bottom:10px;letter-spacing:-.075em}
  .family-card .family-copy .family-subtitle{min-height:0;margin:0;font-size:18px;font-weight:700;line-height:1.35;color:var(--ink)}
  .family-card .tags{margin:18px 0 0}
  .family-card .text-link{margin-top:18px;font-weight:700}
  .comparison{padding:48px 6% 58px;margin-top:25px}
  .comparison-heading{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:end;gap:30px}
  .comparison-heading>p{font-size:14px;color:var(--muted);margin:0 0 5px}
  .comparison h2{font-size:clamp(36px,3.8vw,52px)}
  .comparison-scroll{margin-top:31px}
}
@media (max-width:800px){
  .business-hero{min-height:550px;height:calc(100vh - 70px)}
  .families .intro{padding-top:45px;padding-bottom:17px}
  .family-grid{display:grid;gap:14px;padding:0 6% 28px}
  .family-card{background:#f6f6f2;display:flex;flex-direction:column}
  .family-card .family-image{height:210px}
  .family-card .family-copy{padding:23px 21px 25px;background:transparent}
  .family-card .family-copy .eyebrow{font-size:12px;margin-bottom:9px;letter-spacing:.07em}
  .family-card .family-copy h2{font-size:37px;min-height:0;margin-bottom:7px}
  .family-card .family-copy .family-subtitle{min-height:0;margin:0;font-size:17px;line-height:1.35}
  .comparison{margin-top:0;padding-top:48px}
  .comparison-heading>p{font-size:13px;color:var(--muted);margin-top:15px}
}

/* 사업자 페이지에서는 메뉴와 공급 맥락도 본문처럼 또렷하게 읽힙니다. */
.biz-logo{gap:13px;font-size:15px;font-weight:800;letter-spacing:.06em}
.biz-logo img{width:82px;height:43px}
.biz-logo span{border-left-color:#777;padding-left:13px}
.biz-nav{gap:27px;font-size:16px;font-weight:700;letter-spacing:-.03em}
.biz-nav a{padding:9px 0;border-bottom-width:2px}
.biz-nav .nav-quote{padding:10px 16px;font-size:15px}
.menu-button{font-size:15px;font-weight:700;letter-spacing:.04em}
.eyebrow{font-size:15px;font-weight:800;letter-spacing:.05em;margin-bottom:18px}
.hero-index{font-size:15px;font-weight:700;color:#4f5348}

/* 규격 통일형: 제품 이름과 중량을 첫눈에 비교하는 카탈로그. */
.standard-intro{padding-bottom:38px}
.standard-intro h2{font-size:clamp(38px,4.4vw,62px);font-weight:550}
.standard-intro>p:last-child{max-width:620px;margin-top:18px;font-size:16px;color:var(--muted)}
.standard-catalog{max-width:1380px;margin:0 auto;padding:0 6% 88px}
.standard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.standard-card{min-width:0;background:#f7f6f1}
.standard-card-image{display:block;aspect-ratio:1;overflow:hidden;background:#f3f1eb}
.standard-card-image img{height:100%;object-fit:cover;transition:transform .35s ease}
.standard-card:hover .standard-card-image img{transform:scale(1.025)}
.standard-card-copy{padding:20px 20px 22px}
.product-use{font-size:14px;font-weight:750;color:#556047;margin-bottom:8px}
.standard-card h3{font-size:24px;font-weight:700;line-height:1.18}
.product-summary{min-height:47px;margin-top:11px;font-size:14px;line-height:1.5;color:var(--muted)}
.product-badges{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:17px}
.product-badges strong,.product-badges span{border:1px solid #cfcfc7;padding:4px 7px;font-size:12px;font-weight:650}
.product-badges strong{background:var(--ink);border-color:var(--ink);color:#fff}
.product-link{display:inline-flex;align-items:center;gap:19px;border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:19px;font-size:14px;font-weight:700}

/* 세 상품군은 사진을 중심으로, 작은 포인트 색만 사용합니다. */
.family-card.family-standard,.family-card.family-mix,.family-card.family-utility{background:#fff}
.family-card.family-standard:hover,.family-card.family-mix:hover,.family-card.family-utility:hover{background:#fff}
.family-card .family-image{background:#f4f2ed}
.family-card.family-mix .family-image{background:#f3eeea}
.family-card.family-utility .family-image{background:#eef0ec}
.family-card .family-copy{background:#fff}
.family-card .family-copy .eyebrow,.family-card .family-image span{color:#c94c43}

/* Keep the business home on one clear desktop grid. */
@media (min-width:801px){
  .business-home .section{max-width:none;padding-left:3.5%;padding-right:3.5%}
  .business-home .comparison>*{max-width:none}
  .business-home .faq-preview{max-width:none}
  .business-home .wholesale-banner{padding-left:3.5%;padding-right:3.5%}

  /* Family pages should introduce the products quickly, not leave a large blank hero. */
  .detail-hero{height:470px;min-height:470px}
  .detail-hero>div{padding:8% 9%}
  .detail-hero img{height:470px;min-height:0}
  .product-detail{padding-top:48px;padding-bottom:48px}
}

/* Compact group header: no decorative image, only the buying decision and quote action. */
.detail-hero.compact-family-hero{display:block;height:auto;min-height:0;background:#181917;color:#fff}
.detail-hero.compact-family-hero>.family-hero-content{width:100%;padding:18px var(--business-gutter);display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:40px}
.compact-family-hero .family-hero-copy{min-width:0}
.compact-family-hero .family-hero-line{display:flex;align-items:baseline;gap:16px;min-width:0}
.compact-family-hero h1{flex:none;margin:0;font-size:clamp(28px,2.5vw,36px);font-weight:800;letter-spacing:-.07em}
.compact-family-hero .family-hero-subtitle{margin:0!important;color:#fff!important;font-size:clamp(15px,1.25vw,18px)!important;font-weight:700;letter-spacing:-.04em;line-height:1.35}
.compact-family-hero .family-hero-description{margin-top:3px;font-size:12px!important;color:#bfc1ba!important;line-height:1.45}
.compact-family-hero .button{flex:none;align-self:center;width:auto;min-width:210px;min-height:42px;margin:0;background:#fff;border-color:#fff;color:#181917}
@media (max-width:800px){
  .detail-hero.compact-family-hero>.family-hero-content{padding:20px var(--business-gutter) 22px;display:block}
  .compact-family-hero .family-hero-line{display:block}
  .compact-family-hero h1{font-size:32px}
  .compact-family-hero .family-hero-subtitle{margin-top:2px!important;font-size:16px!important}
  .compact-family-hero .family-hero-description{margin-top:6px;font-size:12px!important}
  .compact-family-hero .button{width:100%;margin-top:14px}
}

/* A single page gutter keeps every business view aligned at each breakpoint. */
:root{--business-gutter:6%}
#main>section.section{max-width:none;margin-left:0;margin-right:0;padding-left:var(--business-gutter);padding-right:var(--business-gutter)}

/* Let the catalogue use the desktop width: all seven standard choices are visible together. */
.family-card.family-standard .family-image,
.family-card.family-mix .family-image{background:#f5f2ec}
.family-card.family-standard .family-image img,
.family-card.family-mix .family-image img{object-fit:contain;padding:16px}
@media (min-width:801px){
  :root{--business-gutter:3.5%}
  .standard-catalog{max-width:none;padding:0 var(--business-gutter) 72px}
  .standard-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:16px}
  .standard-card-copy{padding:15px 14px 17px}
  .standard-card h3{font-size:20px}
  .standard-card .product-brand,.standard-card .product-use{font-size:12px}
  .standard-card .product-summary{min-height:58px;font-size:12px}
  .standard-card .product-badges{margin-top:13px;gap:5px}
  .standard-card .product-badges strong,.standard-card .product-badges span{padding:3px 5px;font-size:10px}
  .standard-card .product-link{gap:10px;margin-top:14px;font-size:12px}
}

/* Product-family headers: compact, with the family name as the only large title. */
.detail-hero h1{font-weight:750;letter-spacing:-.075em}
.detail-hero .family-hero-subtitle{color:var(--ink)!important;font-weight:700;letter-spacing:-.045em;line-height:1.3}
.detail-hero .button{align-self:flex-start;width:min(100%,360px);min-height:42px;margin-top:16px}
@media (min-width:801px){
  .detail-hero{height:320px;min-height:320px}
  .detail-hero>div{padding:35px var(--business-gutter)}
  .detail-hero img{height:320px;min-height:0}
  .detail-hero .eyebrow{font-size:13px;margin-bottom:8px}
  .detail-hero h1{font-size:clamp(52px,4.6vw,72px);margin-bottom:3px}
  .detail-hero .family-hero-subtitle{font-size:clamp(19px,1.7vw,26px)!important;margin-bottom:7px}
  .detail-hero div>p:not(.eyebrow):not(.family-hero-subtitle){font-size:13px;line-height:1.5}
}
@media (max-width:800px){
  .detail-hero>div{padding:36px var(--business-gutter) 30px}
  .detail-hero h1{font-size:42px;margin-bottom:4px}
  .detail-hero .family-hero-subtitle{font-size:19px!important;margin-bottom:8px}
  .detail-hero img{height:220px}
}

/* Keep family pages as a short, high-contrast information band. */
.detail-hero.compact-family-hero h1{margin:0;font-size:clamp(28px,2.5vw,36px);color:#fff}
.detail-hero.compact-family-hero .family-hero-subtitle{margin:0!important;font-size:clamp(15px,1.25vw,18px)!important;color:#fff!important}
.detail-hero.compact-family-hero .family-hero-description{margin:3px 0 0;font-size:12px!important;color:#bfc1ba!important}
.detail-hero.compact-family-hero .button{align-self:center;width:auto;min-width:210px;min-height:42px;margin:0;background:#fff;border-color:#fff;color:#181917}
@media (max-width:800px){
  .detail-hero.compact-family-hero h1{font-size:28px}
  .detail-hero.compact-family-hero .family-hero-subtitle{margin-top:2px!important;font-size:15px!important}
  .detail-hero.compact-family-hero .family-hero-description{margin-top:5px;font-size:11px!important}
  .detail-hero.compact-family-hero .button{width:100%;margin-top:12px}
}
.family-card .family-copy .eyebrow{font-weight:850}
.family-card .tags span{background:#fff;border:1px solid #d9d9d3;font-weight:700}
.family-card-cta{color:#242620}
.product-brand{font-size:14px;font-weight:800;color:#30536e;letter-spacing:-.02em;margin-bottom:4px}
.product-detail-copy>.product-brand{font-size:16px;margin:0 0 8px}
.product-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.9fr);gap:8%;align-items:center;padding-top:70px;padding-bottom:70px}
.product-detail-image{background:#f5f3ed}
.product-detail-image img{aspect-ratio:1;object-fit:cover}
.product-detail-copy h1{font-size:clamp(40px,4vw,62px);font-weight:600;line-height:1.12}
.product-detail-copy h1 small{display:inline-block;font-size:.42em;vertical-align:middle;letter-spacing:-.04em;color:var(--muted)}
.product-detail-copy .product-use{margin-bottom:12px;font-size:16px}
.product-detail-lead{margin-top:20px;font-size:17px;line-height:1.6;color:var(--muted)}
.product-spec{display:grid;grid-template-columns:1fr 1fr;margin:29px 0 0;border-top:1px solid var(--ink)}
.product-spec div{display:grid;grid-template-columns:84px 1fr;gap:8px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14px}
.product-spec div:nth-child(odd){margin-right:18px}
.product-spec dt{font-weight:750}.product-spec dd{margin:0;color:var(--muted)}
.product-detail .hero-actions{margin-top:29px}
.product-guidance{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;border-top:1px solid var(--line)}
.product-guidance h2{font-size:clamp(34px,3.8vw,52px);font-weight:550}
.product-guidance ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.product-guidance li{display:flex;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}
.product-guidance li strong{font-size:17px}.product-guidance li span{color:var(--muted);text-align:right}
.product-guidance .small-note{grid-column:2;margin:0}
@media (max-width:800px){
  .standard-intro{padding-bottom:27px}.standard-intro>p:last-child{font-size:15px}
  .standard-catalog{padding:0 6% 55px}.standard-grid{grid-template-columns:1fr 1fr;gap:14px}
  .standard-card-copy{padding:16px 15px 18px}.product-use{font-size:13px}.standard-card h3{font-size:21px}.product-summary{min-height:63px;font-size:13px}.product-link{font-size:13px;gap:12px}
  .product-detail{display:block;padding-top:38px;padding-bottom:50px}.product-detail-copy{padding-top:30px}.product-detail-copy h1{font-size:40px}.product-detail-lead{font-size:16px}.product-spec{grid-template-columns:1fr}.product-spec div:nth-child(odd){margin-right:0}
  .product-detail .hero-actions{display:grid;grid-template-columns:1fr 1fr}.product-detail .button{width:100%;gap:10px;font-size:13px}
  .product-guidance{display:block}.product-guidance ul{margin-top:30px}.product-guidance .small-note{margin-top:18px}
}
@media (max-width:420px){.standard-grid{grid-template-columns:1fr}.product-summary{min-height:0}.product-detail .hero-actions{grid-template-columns:1fr}}

/* Final desktop spacing overrides: keep family detail pages compact and practical. */
@media (min-width:801px){
  .business-home .section{max-width:none;padding-left:3.5%;padding-right:3.5%}
  .business-home .comparison>*{max-width:none}
  .business-home .faq-preview{max-width:none}
  .business-home .wholesale-banner{padding-left:3.5%;padding-right:3.5%}
  .detail-hero{height:320px;min-height:320px}
  .detail-hero>div{padding:35px var(--business-gutter)}
  .detail-hero img{height:320px;min-height:0}
  .product-detail{padding-top:48px;padding-bottom:48px}
}
