/*
Theme Name: HS Realty
Theme URI: https://hsdata.co.kr
Description: 현성데이터랩 NAS 쇼핑몰 — Storefront 자식 테마. 네이비/골드/그린 프리미엄 브랜드 스타일.
Author: 현성데이터랩
Template: storefront
Version: 1.7.1
*/

:root{
  --hs-navy:#1E3A5F; --hs-navy-deep:#14293F; --hs-gold:#C1A02E; --hs-green:#148A55;
  --hs-ink:#1B2733; --hs-muted:#5C6B7A; --hs-line:#E4E9EF; --hs-panel:#F4F6F8;
  --hs-font:"Pretendard","Pretendard Variable","Apple SD Gothic Neo","Malgun Gothic",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* ---------- 타이포 ---------- */
body, button, input, select, textarea,
.woocommerce-loop-product__title, .site-title, h1,h2,h3,h4,h5,h6{
  font-family:var(--hs-font);
}
body{ color:var(--hs-ink); letter-spacing:-.01em;
  background-color:#f6f8fb;
  background-image:
    radial-gradient(1100px 520px at 88% -120px, rgba(30,58,95,.055), transparent 70%),
    radial-gradient(900px 460px at -120px 30%, rgba(193,160,46,.04), transparent 70%),
    radial-gradient(rgba(30,58,95,.075) 1px, transparent 1.3px);
  background-size:auto, auto, 24px 24px;
}
/* 본문 컨테이너는 패턴이 비치도록 투명 유지, 헤더·푸터는 자체 배경 유지 */
.site-header{ background:#fff; }
h1,h2,h3{ letter-spacing:-.025em; color:var(--hs-navy); word-break:keep-all; }
a{ color:var(--hs-navy); }
a:hover{ color:var(--hs-navy-deep); }

/* ---------- 헤더 (화이트 프리미엄) ---------- */
.site-header{
  background:#fff !important; border-bottom:1px solid var(--hs-line);
  position:sticky; top:0; z-index:60; padding-top:.6em; padding-bottom:.6em;
  box-shadow:0 1px 3px rgba(20,41,63,.04);
}
.site-branding{ margin-bottom:0; }
.site-header .custom-logo-link img,
.site-header .custom-logo{ max-height:46px; width:auto; }
/* 커스텀 로고가 있으면 텍스트 상호/태그라인 숨김 */
.site-header:has(.custom-logo) .site-title,
.site-header:has(.custom-logo) .site-description{ position:absolute; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }
.site-header .site-title{ font-weight:800; }
.site-header .site-title a{ color:var(--hs-navy) !important; }
.site-header .site-description{ color:var(--hs-muted); }
.storefront-primary-navigation{ background:transparent !important; }
.main-navigation ul li a{ color:var(--hs-navy) !important; font-weight:600; }
.main-navigation ul li a:hover{ color:var(--hs-gold) !important; }
.main-navigation ul.menu > li.current-menu-item > a{ color:var(--hs-gold) !important; }
/* 주 메뉴 9개(2026-10-02 NAS 홈페이지 추가)가 한 줄에 들어가도록 좌우 여백 축소 (기본 1em) */
@media (min-width:768px){ .main-navigation ul.menu > li > a{ padding-left:13px; padding-right:13px; } }
@media (min-width:768px) and (max-width:1279px){ .main-navigation ul.menu > li > a{ padding-left:7px; padding-right:7px; font-size:15px; } }
.site-header-cart .cart-contents{ color:var(--hs-navy) !important; font-weight:700; }
.site-header-cart .amount{ color:var(--hs-navy); }
.site-header-cart .count{ background:var(--hs-gold) !important; color:#3a2f06 !important; }

/* ---------- 버튼 ---------- */
button, .button, input[type="submit"], .added_to_cart,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit{
  background:var(--hs-navy) !important; color:#fff !important;
  border-radius:10px !important; font-weight:700 !important; text-shadow:none !important;
  transition:.2s !important;
}
button:hover, .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .added_to_cart:hover{
  background:var(--hs-navy-deep) !important; transform:translateY(-1px);
}
.woocommerce a.button.alt, .woocommerce button.button.alt,
.woocommerce #respond input#submit.alt, .single_add_to_cart_button{
  background:var(--hs-navy) !important; color:#fff !important;
}
.woocommerce a.button.alt:hover, .single_add_to_cart_button:hover{ background:var(--hs-gold) !important; color:#3a2f06 !important; }

/* ---------- 상품 카드 ---------- */
.woocommerce ul.products li.product{
  background:#fff; border:1px solid var(--hs-line); border-radius:14px;
  padding:14px 14px 18px; box-shadow:0 1px 3px rgba(20,41,63,.05);
  transition:.22s; text-align:left;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-3px); box-shadow:0 12px 30px -12px rgba(20,41,63,.28);
  border-color:color-mix(in srgb,var(--hs-navy) 28%,var(--hs-line));
}
.woocommerce ul.products li.product a img{
  border-radius:10px; background:#fff; margin-bottom:.8em; mix-blend-mode:multiply;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1rem; font-weight:700; color:var(--hs-ink); padding:0; line-height:1.35;
}
.woocommerce ul.products li.product .price{ color:var(--hs-navy) !important; }
.woocommerce ul.products li.product .price .woocommerce-Price-amount{
  font-size:1.15rem; font-weight:800; color:var(--hs-navy); font-variant-numeric:tabular-nums;
}
.woocommerce ul.products li.product .button{ margin-top:.4em; }
.woocommerce span.onsale{
  background:var(--hs-gold) !important; color:#3a2f06 !important; border-radius:20px;
  min-height:auto; min-width:auto; padding:.3em .7em; font-weight:800;
}
.star-rating span{ color:var(--hs-gold); }

/* ---------- 가격/재고 일반 ---------- */
.woocommerce div.product p.price, .woocommerce div.product span.price{ color:var(--hs-navy); font-weight:800; }
.woocommerce .stock.in-stock{ color:var(--hs-green); font-weight:700; }
.woocommerce-message, .woocommerce-info{ border-top-color:var(--hs-navy) !important; }
.woocommerce-message::before, .woocommerce-info::before{ color:var(--hs-navy) !important; }

/* ---------- 카탈로그 섹션 제목 (프론트 [product_category]) ---------- */
.page .entry-content > h2{
  font-size:1.7rem; font-weight:800; color:var(--hs-navy);
  margin:2.4em 0 1em; padding-bottom:.5em; position:relative;
}
.page .entry-content > h2::after{
  content:""; position:absolute; left:0; bottom:0; width:52px; height:3px;
  background:var(--hs-gold); border-radius:2px;
}
.page .entry-content > h2:first-child{ margin-top:.4em; }

/* ---------- 히어로 (프론트 상단, functions.php 주입) ---------- */
.hs-hero{
  background:
    linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 40%, rgba(255,255,255,.62) 70%, rgba(246,247,250,.42) 100%),
    url(../../uploads/2026/08/hero-a1.webp) center/cover no-repeat,
    var(--hs-panel);
  border:1px solid var(--hs-line); border-radius:20px;
  padding:clamp(28px,5vw,56px); margin:0 0 1.4em;
  display:grid; grid-template-columns:1.1fr .9fr; gap:32px; align-items:center;
  position:relative; overflow:hidden;
}
.hs-hero__bgvid{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hs-hero__veil{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(255,255,255,.93) 0%, rgba(255,255,255,.80) 38%, rgba(255,255,255,.30) 68%, rgba(246,247,250,.06) 100%);
}
.hs-hero__copy, .hs-hero__media{ position:relative; z-index:2; }
@media (prefers-reduced-motion: reduce){ .hs-hero__bgvid{ display:none; } }
.hs-hero__eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--hs-gold); margin-bottom:14px;
}
.hs-hero__eyebrow::before{ content:""; width:22px; height:2px; background:var(--hs-gold); }
.hs-hero h1{ font-size:clamp(26px,3.6vw,42px); font-weight:800; color:var(--hs-ink); margin:0 0 14px; line-height:1.18; }
.hs-hero h1 .g{ color:var(--hs-navy); }
.hs-hero p{ color:var(--hs-muted); font-size:1.05rem; margin:0 0 22px; max-width:40ch; }
.hs-hero .hs-btn{
  display:inline-flex; align-items:center; gap:8px; background:var(--hs-navy); color:#fff;
  font-weight:700; padding:13px 24px; border-radius:11px; transition:.2s;
}
.hs-hero .hs-btn:hover{ background:var(--hs-navy-deep); color:#fff; transform:translateY(-1px); }
.hs-hero__stats{ display:flex; gap:26px; margin-top:26px; padding-top:20px; border-top:1px solid var(--hs-line); }
.hs-hero__stats b{ display:block; font-size:22px; font-weight:800; color:var(--hs-navy); }
.hs-hero__stats small{ font-size:13px; color:var(--hs-muted); font-weight:600; }
.hs-hero__media{ display:grid; place-items:center; position:relative; }
.hs-hero__media img{ width:74%; position:relative; z-index:1; filter:drop-shadow(0 26px 44px rgba(20,41,63,.26)); }
.hs-hero__seal{
  position:absolute; right:0; top:-6px; z-index:3; width:96px; height:96px; border-radius:50%;
  background:#fff; box-shadow:0 12px 30px -8px rgba(20,41,63,.32); display:grid; place-items:center;
  text-align:center; border:1px solid var(--hs-line);
}
.hs-hero__seal b{ font-size:10px; font-weight:800; color:var(--hs-navy); line-height:1.25; }
.hs-hero__seal em{ display:block; font-style:normal; font-size:8px; letter-spacing:.1em; color:var(--hs-gold); font-weight:800; margin-top:2px; }

/* 신뢰 배지 스트립 */
.hs-trust{ display:flex; flex-wrap:wrap; gap:14px 30px; align-items:center; padding:16px 22px;
  background:#fff; border:1px solid var(--hs-line); border-radius:14px; margin-bottom:.6em; }
.hs-trust span{ display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--hs-muted); font-size:.95rem; }
.hs-trust span::before{ content:"✓"; color:var(--hs-green); font-weight:900; }

/* ---------- 푸터 (네이비) ---------- */
.site-footer{ background:var(--hs-navy-deep) !important; color:#B9C4D0 !important; }
.site-footer a{ color:#D7E0EA !important; }
.site-footer a:hover{ color:#fff !important; }
.site-footer .site-info{ background:var(--hs-navy-deep) !important; border-top:1px solid rgba(255,255,255,.1); }
.storefront-handheld-footer-bar{ background:var(--hs-navy) !important; }
.storefront-handheld-footer-bar a{ color:#fff !important; }

/* ---------- 반응형 ---------- */
@media (max-width:768px){
  .hs-hero{ grid-template-columns:1fr; text-align:center; }
  .hs-hero__eyebrow, .hs-hero p{ margin-left:auto; margin-right:auto; }
  .hs-hero__stats{ justify-content:center; }
  .hs-hero__media{ order:-1; }
}

/* ---------- 로그인 / 회원가입 (form-login 오버라이드) ---------- */
.woocommerce-account .hsrealty-auth{ max-width:440px; margin:1.5em auto 0; float:none; }
.woocommerce-account .hsrealty-auth .col-1,
.woocommerce-account .hsrealty-auth .col-2{ width:100% !important; float:none !important; margin:0 !important; }
.woocommerce-account .hsrealty-auth h2{ text-align:center; margin-bottom:1.1em; }
.hsrealty-auth-switch{ margin-top:1.6em; padding-top:1.3em; border-top:1px solid var(--hs-line); text-align:center; }
.hsrealty-auth-switch span{ display:block; margin-bottom:.7em; color:var(--hs-muted); font-size:.94em; }
.hsrealty-auth-switch .button{ width:100%; background:transparent !important; color:var(--hs-navy) !important; border:1.5px solid var(--hs-navy) !important; font-weight:700; }
.hsrealty-auth-switch .button:hover{ background:var(--hs-navy) !important; color:#fff !important; }

/* ---------- 회원가입 동의 영역 ---------- */
.hsrealty-consent{ margin:1.2em 0 .4em; padding:1em 1.1em; background:var(--hs-panel); border:1px solid var(--hs-line); border-radius:8px; }
.hsrealty-consent .form-row{ margin:0 0 .55em; }
.hsrealty-consent .form-row:last-child{ margin-bottom:0; }
.hsrealty-consent label.checkbox{ display:flex; align-items:flex-start; gap:.5em; font-size:.92em; color:var(--hs-ink); cursor:pointer; }
.hsrealty-consent input[type=checkbox]{ margin-top:.15em; }
.hsrealty-consent a{ color:var(--hs-navy); text-decoration:underline; font-weight:600; }

/* ---------- 주소검색(다음 우편번호) ---------- */
.hs-postcode-row{ display:flex; gap:.5em; align-items:stretch; }
.hs-postcode-row input{ flex:1 1 auto; }
.hs-postcode-row .hs-addr-search{ flex:0 0 auto; white-space:nowrap; }
.hs-addr-search{ background:var(--hs-navy) !important; color:#fff !important; border-radius:8px !important; font-weight:700 !important; padding:.5em 1em !important; }
.hs-addr-search:hover{ background:var(--hs-navy-deep) !important; }
#billing_postcode_field .hs-addr-search,
#shipping_postcode_field .hs-addr-search{ margin-top:.5em; }

/* ---------- 회사 소개 페이지 (page-id-180, 2026-07-05) ---------- */
.page-id-180 .entry-title{ position:absolute; clip:rect(1px,1px,1px,1px); width:1px; height:1px; overflow:hidden; }
.hs-about{ max-width:860px; margin:0 auto; }
.hs-about section{ margin:0 0 clamp(34px,6vw,60px); }
.hs-about__intro{ text-align:center; padding:clamp(8px,3vw,28px) 0 0; }
.hs-about__hook{ font-size:clamp(30px,4.6vw,52px); font-weight:800; color:var(--hs-ink); margin:.1em 0 .35em; }
.hs-about__lead{ font-size:clamp(1.05rem,2vw,1.28rem); color:var(--hs-muted); font-weight:600; margin:0; }
.hs-about__story p{ font-size:clamp(1.02rem,1.5vw,1.16rem); line-height:1.9; color:var(--hs-ink); margin:0 0 1.15em; }
.hs-about__story strong{ color:var(--hs-navy); font-weight:800; }
.hs-about__quote{ margin:1.5em 0; padding:1.1em 1.35em; border-left:4px solid var(--hs-gold); background:var(--hs-panel);
  border-radius:0 12px 12px 0; font-size:clamp(1.15rem,2.2vw,1.5rem); font-weight:700; color:var(--hs-navy); line-height:1.55; }
.hs-about__quote b{ color:var(--hs-green); }
.hs-about__cta{ text-align:center; padding:clamp(28px,5vw,46px); border-radius:18px;
  background:linear-gradient(135deg,var(--hs-navy),var(--hs-navy-deep)); box-shadow:0 18px 40px rgba(20,41,63,.22); }
.hs-about__cta p{ margin:0; color:#fff; font-size:clamp(1.2rem,2.6vw,1.7rem); font-weight:700; line-height:1.55; }
.hs-about__cta b{ color:var(--hs-gold); }
.hs-about h2{ font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:800; margin:0 0 1em; text-align:center; }
.hs-about__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.hs-about__grid > div{ background:#fff; border:1px solid var(--hs-line); border-radius:14px; padding:20px 22px; }
.hs-about__grid b{ display:block; color:var(--hs-navy); font-size:1.08rem; font-weight:800; margin-bottom:6px; }
.hs-about__grid b::before{ content:"✓ "; color:var(--hs-green); font-weight:900; }
.hs-about__grid span{ color:var(--hs-muted); font-size:.96rem; line-height:1.6; }
.hs-about__info table{ width:100%; border-collapse:collapse; border:1px solid var(--hs-line); border-radius:14px; overflow:hidden; }
.hs-about__info th, .hs-about__info td{ text-align:left; padding:13px 18px; border-bottom:1px solid var(--hs-line); font-size:.98rem; vertical-align:top; }
.hs-about__info tr:last-child th, .hs-about__info tr:last-child td{ border-bottom:0; }
.hs-about__info th{ width:34%; background:var(--hs-panel); color:var(--hs-navy); font-weight:700; white-space:nowrap; }
.hs-about__info a{ color:var(--hs-navy); font-weight:700; }
@media (max-width:600px){
  .hs-about__grid{ grid-template-columns:1fr; }
  .hs-about__info th{ width:40%; white-space:normal; }
}
.hs-about__cta-sub{ display:inline-block; margin-top:.7em; font-size:clamp(.92rem,1.6vw,1.05rem); font-weight:600; color:rgba(255,255,255,.82); }

/* 회사 소개 — IBM 경력 카드 */
.hs-about__cred{ display:flex; align-items:center; gap:22px; margin:1.8em 0; padding:22px 26px;
  background:var(--hs-panel); border:1px solid var(--hs-line); border-left:5px solid var(--hs-gold); border-radius:14px; }
.hs-about__cred-num{ flex:0 0 auto; font-size:clamp(2.6rem,7vw,3.4rem); font-weight:800; line-height:1; color:var(--hs-navy); }
.hs-about__cred-num span{ font-size:.34em; font-weight:700; margin-left:2px; color:var(--hs-gold); }
.hs-about__cred-txt b{ display:block; font-size:clamp(1.05rem,2vw,1.2rem); font-weight:800; color:var(--hs-navy); margin-bottom:4px; }
.hs-about__cred-txt span{ color:var(--hs-muted); font-size:.95rem; font-weight:600; line-height:1.5; }
@media (max-width:520px){ .hs-about__cred{ gap:16px; padding:18px 20px; } }

/* 회사 소개 — NAS 편의기능 소개 */
.hs-about__features-lead{ text-align:center; color:var(--hs-muted); font-size:clamp(1rem,1.8vw,1.12rem);
  font-weight:600; max-width:56ch; margin:-.4em auto 1.7em; line-height:1.75; }
.hs-about__grid--feat > div{ border-top:3px solid var(--hs-gold); }
.hs-about__grid--feat b{ font-size:1.12rem; margin-bottom:8px; }
.hs-about__grid--feat b::before{ content:none; }
.hs-about__grid--feat span{ line-height:1.68; }

/* 회사 소개 — 왜 Synology 섹션 */
.hs-about__why p{ font-size:clamp(1.02rem,1.5vw,1.14rem); line-height:1.9; color:var(--hs-ink); margin:0 0 1.1em; }
.hs-about__why p:last-child{ margin-bottom:0; }
.hs-about__why strong{ color:var(--hs-navy); font-weight:800; }
.hs-about__features-lead strong{ color:var(--hs-navy); font-weight:800; }

/* 회사 소개 — NAS 정의 박스 */
.hs-about__define{ background:var(--hs-panel); border:1px solid var(--hs-line); border-left:5px solid var(--hs-green);
  border-radius:16px; padding:clamp(22px,4vw,32px); }
.hs-about__define-badge{ display:inline-block; background:var(--hs-green); color:#fff; font-size:.8rem; font-weight:800;
  letter-spacing:.02em; padding:4px 12px; border-radius:999px; margin-bottom:12px; }
.hs-about__define h2{ text-align:left; margin:0 0 .6em; }
.hs-about__define p{ font-size:clamp(1rem,1.6vw,1.12rem); line-height:1.85; color:var(--hs-ink); margin:0 0 .9em; }
.hs-about__define p:last-child{ margin-bottom:0; }
.hs-about__define strong{ color:var(--hs-navy); font-weight:800; }

/* [임시] 카탈로그 모드 안내 */
.hs-catalog-notice{ margin:18px 0; padding:16px 18px; border:1px solid var(--hs-line); border-left:4px solid var(--hs-gold);
  background:var(--hs-panel); border-radius:0 12px 12px 0; color:var(--hs-ink); font-size:.98rem; line-height:1.75; }
.hs-catalog-notice b{ color:var(--hs-navy); }
.hs-catalog-notice a{ color:var(--hs-navy); font-weight:700; }
.hs-catalog-banner{ margin:0 0 20px; padding:13px 18px; background:var(--hs-navy); color:#fff; border-radius:12px;
  text-align:center; font-weight:600; font-size:.96rem; }
.hs-catalog-banner b{ color:var(--hs-gold); }

/* ---------- 헤더 로고 우측 회사명 (2026-07-06) ---------- */
.site-header .site-branding{ display:flex !important; flex-wrap:nowrap; align-items:center; gap:7px; width:auto; }
.site-header .site-branding .custom-logo-link{ flex:0 0 auto; }
.site-header .hs-brandname{
  font-weight:800; color:var(--hs-navy); font-size:1.5em;
  letter-spacing:-.025em; line-height:1.15; white-space:nowrap;
  text-decoration:none;
}
.site-header a.hs-brandname:hover{ color:var(--hs-navy-deep); text-decoration:none; }
@media (max-width:768px){ .site-header .hs-brandname{ font-size:1.15em; gap:10px; } }
@media (max-width:420px){ .site-header .hs-brandname{ display:none; } }

/* ---------- 고액 상품 문의 CTA (2026-07-09) ---------- */
.hs-inquiry-cta{ margin:18px 0; padding:18px 20px; border:1px solid var(--hs-line); border-left:4px solid var(--hs-gold);
  background:var(--hs-panel); border-radius:0 12px 12px 0; }
.hs-inquiry-cta__lead{ margin:0 0 4px; font-size:1.06rem; color:var(--hs-ink); }
.hs-inquiry-cta__lead b{ color:var(--hs-navy); }
.hs-inquiry-cta__desc{ margin:0 0 14px; font-size:.94rem; color:var(--hs-ink); opacity:.85; line-height:1.7; }
.hs-inquiry-cta__btns{ display:flex; flex-wrap:wrap; gap:10px; }
.hs-inquiry-btn{ display:inline-flex; align-items:center; gap:6px; padding:12px 18px; border-radius:10px;
  font-weight:700; font-size:.98rem; text-decoration:none; line-height:1.2; }
.hs-inquiry-btn--tel{ background:var(--hs-navy); color:#fff !important; }
.hs-inquiry-btn--tel:hover{ opacity:.92; }
.hs-inquiry-btn--mail{ background:#fff; color:var(--hs-navy) !important; border:1.5px solid var(--hs-navy); }
.hs-inquiry-btn--mail:hover{ background:var(--hs-panel); }
.hs-inquiry-loop-btn{ background:var(--hs-navy) !important; color:#fff !important; }

/* ── 블로그 글 공용 스타일 (2026-08-09) ─────────────────────────
   글마다 <style> 을 넣으면 같은 CSS 가 글 수만큼 복제된다. 여기 한 번만 둔다. */
.hs-post{--n:#1E3A5F;--nd:#14293F;--g:#C1A02E;--gr:#148A55;--rd:#B23B3B;--ink:#1B2733;--mut:#5C6B7A;--line:#E4E9EF;--panel:#F4F6F8;color:var(--ink);line-height:1.8;font-size:1.02em;word-break:keep-all;}
.hs-post h2{margin:2.3em 0 .7em;padding-bottom:.35em;border-bottom:3px solid var(--n);color:var(--n);font-size:1.42em;letter-spacing:-.02em;}
.hs-post h3{margin:1.9em 0 .5em;color:var(--n);font-size:1.13em;letter-spacing:-.02em;}
.hs-post p{margin:0 0 1.1em;}
.hs-post .lead{background:var(--panel);border-left:5px solid var(--n);padding:1.1em 1.3em;margin:1.6em 0;border-radius:0 6px 6px 0;}
.hs-post .note{background:#FBF6E5;border-left:5px solid var(--g);padding:1em 1.2em;margin:1.5em 0;border-radius:0 6px 6px 0;font-size:.97em;}
.hs-post .warn{background:#FDF3F3;border-left:5px solid var(--rd);padding:1em 1.2em;margin:1.5em 0;border-radius:0 6px 6px 0;font-size:.97em;}
.hs-post .ok{background:#EDF7F1;border-left:5px solid var(--gr);padding:1em 1.2em;margin:1.5em 0;border-radius:0 6px 6px 0;font-size:.97em;}
.hs-post .lead p:last-child,.hs-post .note p:last-child,.hs-post .warn p:last-child,.hs-post .ok p:last-child{margin-bottom:0;}
.hs-post .qa{border:1px solid var(--line);border-radius:10px;padding:1.1em 1.3em;margin:1.4em 0;background:#fff;font-size:.96em;}
.hs-post .qa b{display:block;color:var(--n);margin-bottom:.35em;}
.hs-post .qa span{color:var(--mut);}
.hs-post .tbl{overflow-x:auto;margin:1.4em 0;}
.hs-post table{width:100%;border-collapse:collapse;font-size:.94em;}
.hs-post th{background:var(--n);color:#fff;padding:.65em .7em;text-align:left;font-weight:600;}
.hs-post td{border-bottom:1px solid var(--line);padding:.6em .7em;vertical-align:top;}
.hs-post td.y{color:var(--gr);font-weight:700;white-space:nowrap;}
.hs-post td.n{color:var(--rd);font-weight:700;white-space:nowrap;}
.hs-post td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;}
.hs-post tr.total td{background:var(--panel);font-weight:700;border-top:2px solid var(--n);}
.hs-post ul,.hs-post ol{margin:.4em 0 1.2em;padding-left:1.3em;}
.hs-post li{margin:.35em 0;}
.hs-post .cta{background:var(--nd);color:#fff;border-radius:12px;padding:1.7em 1.4em;margin:2.4em 0 0;text-align:center;}
.hs-post .cta h3{color:#fff;margin:0 0 .5em;font-size:1.15em;}
.hs-post .cta p{color:rgba(255,255,255,.86);font-size:.96em;}
.hs-post .cta .btns{display:flex;flex-wrap:wrap;gap:.6em;justify-content:center;margin-top:1.1em;}
.hs-post .cta a{display:inline-block;background:var(--g);color:#3a2f06;padding:.7em 1.3em;border-radius:9px;font-weight:800;text-decoration:none;font-size:.95em;}
.hs-post .cta a.alt{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.32);}

/* ── 상품 상세 스펙 블록 (hs-spec) — 2026-08-10 ── */
.hs-spec{--n:#1E3A5F;--g:#C1A02E;--ink:#1B2733;--mut:#5C6B7A;--line:#E4E9EF;--panel:#F4F6F8;--rd:#B23B3B;color:var(--ink);line-height:1.75;word-break:keep-all;}
.hs-spec h3{margin:1.9em 0 .6em;padding-bottom:.3em;border-bottom:2px solid var(--n);color:var(--n);font-size:1.1em;letter-spacing:-.02em;}
.hs-spec p{margin:0 0 1em;}
.hs-spec ul{margin:0 0 1.1em;padding-left:1.3em;}
.hs-spec li{margin:.4em 0;}
.hs-spec .lead{background:var(--panel);border-left:5px solid var(--n);padding:1em 1.2em;margin:0 0 1.4em;border-radius:0 6px 6px 0;}
.hs-spec .note{background:#FBF6E5;border-left:5px solid var(--g);padding:.9em 1.1em;margin:1.2em 0;border-radius:0 6px 6px 0;font-size:.95em;}
.hs-spec .warn{background:#FDF3F3;border-left:5px solid var(--rd);padding:.9em 1.1em;margin:1.2em 0;border-radius:0 6px 6px 0;font-size:.95em;}
.hs-spec table.spec-tbl{width:100%;border-collapse:collapse;margin:.8em 0 1.2em;font-size:.94em;}
.hs-spec table.spec-tbl th,.hs-spec table.spec-tbl td{border-bottom:1px solid var(--line);padding:.55em .7em;text-align:left;vertical-align:top;}
.hs-spec table.spec-tbl th{width:32%;background:var(--panel);color:var(--mut);font-weight:700;}
.hs-spec table.spec-tbl tr:first-child th:last-child{width:auto;background:var(--panel);}
.hs-spec .grp{margin:.9em 0 .35em;font-weight:700;color:var(--n);font-size:.95em;}
.hs-spec .chips{display:flex;flex-wrap:wrap;gap:.35em;margin:0 0 1em;}
.hs-spec .chips span{display:inline-block;background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:.24em .6em;font-size:.87em;color:var(--ink);white-space:nowrap;}
.hs-spec a{color:var(--n);text-decoration:underline;}
@media(max-width:600px){
.hs-spec table.spec-tbl th{width:38%;}
.hs-spec .chips span{font-size:.82em;}
}


/* ---------- 홈 카테고리 사진 배너 + 비주얼 밴드 (2026-08-25) ---------- */
.hs-catband{ position:relative; display:block; border-radius:14px; overflow:hidden;
  margin:2.4em 0 1em; height:150px; text-decoration:none; }
.hs-catband img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hs-catband::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(20,41,63,.93) 0%, rgba(20,41,63,.74) 42%, rgba(20,41,63,.12) 100%); }
.hs-catband .in{ position:absolute; inset:0; z-index:1; display:flex; flex-direction:column;
  justify-content:center; padding:0 30px; gap:5px; }
.hs-catband h2{ color:#fff !important; margin:0 !important; padding:0 !important;
  font-size:clamp(19px,2.3vw,25px); border:none !important; }
.hs-catband h2::after{ display:none !important; }
.hs-catband .sub{ color:rgba(255,255,255,.82); margin:0; font-size:.92rem; font-weight:500; }
.hs-catband .go{ position:absolute; right:26px; top:50%; transform:translateY(-50%); z-index:1;
  color:var(--hs-gold); font-weight:800; font-size:.9rem; letter-spacing:.06em; }
.hs-catband:hover img{ transform:scale(1.03); transition:transform .5s ease; }
@media (max-width:600px){ .hs-catband{ height:120px; } .hs-catband .go{ display:none; } }
.hs-photoband{ position:relative; border-radius:16px; overflow:hidden; margin:3em 0;
  min-height:230px; display:flex; align-items:center; }
.hs-photoband img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hs-photoband::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(20,41,63,.94) 0%, rgba(20,41,63,.78) 48%, rgba(20,41,63,.25) 100%); }
.hs-photoband .in{ position:relative; z-index:1; padding:34px 36px; max-width:560px; }
.hs-photoband h2{ color:#fff !important; margin:0 0 8px !important; font-size:clamp(20px,2.6vw,28px);
  border:none !important; padding:0 !important; }
.hs-photoband h2::after{ display:none !important; }
.hs-photoband p{ color:rgba(255,255,255,.86); margin:0 0 16px; font-size:.98rem; }
.hs-photoband .btn{ display:inline-block; background:var(--hs-gold); color:#14293F;
  font-weight:800; padding:.6em 1.5em; border-radius:8px; text-decoration:none; }
.hs-photoband .btn:hover{ background:#d8b95a; }
