*{ box-sizing:border-box; }

html,body{ margin:0; padding:0; }

body{
  font-family:"Noto Sans KR", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(560px 260px at 0% 0%, rgba(47,143,123,.08), rgba(255,255,255,0) 62%),
    linear-gradient(180deg, #F4F5F1 0%, #F7F7F3 100%);
  line-height:1.6;
  letter-spacing:-0.12px;
}

a{ color:inherit; text-decoration:none; }

img{ display:block; max-width:100%; height:auto; }

button,input,select{ font:inherit; }

.nav-link{
  padding:9px 12px;
  border-radius:999px;
  font-weight:700;
  font-size:14px;
}

.nav-link.is-active{
  background:var(--soft);
  color:var(--accent2);
}

.page-top{
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.86);
}

.breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:16px 0;
  font-size:13px;
  color:var(--muted);
}

.breadcrumb strong{ color:var(--ink); }

.category-page{ padding:20px 0 48px; }

.category-layout{
  display:grid;
  gap:14px;
}

.category-switch-panel{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--line);
  background:
    radial-gradient(180px 120px at 100% 0%, color-mix(in srgb, var(--soft) 72%, white), rgba(255,255,255,0) 72%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.92));
  box-shadow:0 8px 20px rgba(36,50,71,.045);
}

.category-switch-panel::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 50%, var(--accent2)));
}

.category-switch-label{
  min-width:58px;
  flex-shrink:0;
  color:var(--accent2);
  font-size:14px;
  font-weight:900;
}

.category-switch{
  display:flex;
  flex:1;
  gap:6px;
  flex-wrap:wrap;
}

.category-switch a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 12px;
  border:1px solid color-mix(in srgb, var(--line) 82%, var(--accent));
  border-radius:0;
  background:rgba(255,255,255,.88);
  color:var(--ink);
  font-weight:900;
  font-size:12px;
  transition:background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.category-switch a:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb, var(--accent) 48%, var(--line));
  background:color-mix(in srgb, var(--soft) 58%, white);
  box-shadow:0 6px 14px rgba(36,50,71,.06);
  color:var(--ink);
}

.category-switch a.is-active{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
  box-shadow:0 10px 20px rgba(47,143,123,.18);
}

.category-hero{
  display:grid;
  grid-template-columns:1.02fr .88fr .46fr;
  gap:18px;
  align-items:stretch;
}

.category-copy,
.category-visual,
.category-meta,
.section-card,
.spotlight-card,
.highlight-card,
.common-card{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  box-shadow:0 16px 36px rgba(36,50,71,.05);
}

.category-copy{
  padding:30px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--soft) 55%, white), #fff 40%);
}

.category-kicker{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.85);
  border:1px solid rgba(47,143,123,.16);
  color:var(--accent2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.category-copy h1{
  margin:12px 0 12px;
  font-size:36px;
  line-height:1.16;
  letter-spacing:-0.9px;
}

.category-copy p{
  margin:0;
  color:#526173;
  font-size:15px;
}

.category-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:18px;
}

.category-tags span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(36,50,71,.10);
  color:#4B5A6B;
  font-size:13px;
  font-weight:700;
}

.category-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:22px;
}

.category-visual{
  overflow:hidden;
  display:grid;
  grid-template-rows:minmax(280px, 1fr) auto;
}

.category-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.category-visual figcaption{
  padding:18px 20px 20px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--soft) 48%, white), #fff);
  color:#4F6072;
  font-weight:600;
}

.category-meta{
  padding:18px;
  display:grid;
  gap:12px;
  background:linear-gradient(180deg, #fff, color-mix(in srgb, var(--soft) 34%, white));
}

.meta-item{
  padding:14px 14px 15px;
  border-radius:8px;
  background:#fff;
  border:1px solid rgba(36,50,71,.08);
}

.meta-item strong{
  display:block;
  margin-bottom:6px;
  color:var(--accent2);
  font-size:13px;
}

.meta-item span{
  color:#425366;
  font-size:14px;
  font-weight:700;
  line-height:1.45;
}

.category-section{ display:grid; gap:14px; }

.category-menu-section{
  gap:0;
  padding:2px 0 10px;
}

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.section-head h2{
  margin:0;
  font-size:24px;
  letter-spacing:-0.5px;
}

.section-head p{
  margin:0;
  color:#607182;
  font-size:14px;
}

.category-menu-section .section-head h2{
  font-size:21px;
}

.category-menu-section .section-head h2::after{
  content:"";
  display:block;
  width:28px;
  height:2px;
  margin-top:7px;
  background:var(--accent);
}

.sub-link-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-bottom:2px;
}

.category-type-row{
  display:grid;
  grid-template-columns:118px minmax(0, 1fr);
  align-items:center;
  gap:10px;
}

.category-type-grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:8px;
  min-width:0;
}

.category-type-grid .category-menu-link{
  width:100%;
  min-width:0;
  padding-right:8px;
  padding-left:8px;
}

.category-menu-link{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex:0 0 auto;
  padding:7px 16px;
  border:1px solid var(--accent2);
  border-radius:7px;
  background:var(--accent2);
  color:#fff;
  font:inherit;
  font-size:14px;
  font-weight:900;
  line-height:1.35;
  text-align:center;
  cursor:pointer;
  box-shadow:0 4px 12px color-mix(in srgb, var(--accent2) 20%, transparent);
  transition:
    transform .16s ease,
    background .16s ease,
    border-color .16s ease,
    box-shadow .16s ease;
}

.category-menu-link:visited{
  color:#fff;
}

@media (hover:hover){
  .category-menu-link:hover{
      transform:translateY(-1px);
      border-color:color-mix(in srgb, var(--accent2) 86%, #000);
      background:color-mix(in srgb, var(--accent2) 86%, #000);
      color:#fff;
      box-shadow:0 7px 16px color-mix(in srgb, var(--accent2) 28%, transparent);
    }
}

.category-menu-link:focus-visible{
  outline:3px solid var(--accent2);
  outline-offset:3px;
}

.category-menu-link:active{
  transform:translateY(0) scale(.98);
}

.category-menu-link:is(.is-active, .is-selected, [aria-pressed="true"], [aria-current="page"]){
  border-color:color-mix(in srgb, var(--accent2) 82%, #000);
  background:color-mix(in srgb, var(--accent2) 88%, #000);
  box-shadow:
    inset 0 -4px 0 rgba(255,255,255,.26),
    0 0 0 3px var(--soft),
    0 6px 15px color-mix(in srgb, var(--accent2) 30%, transparent);
}

.category-menu-link.category-type-button{
  border-color:var(--accent2);
  background:var(--accent2);
  color:#fff;
  box-shadow:0 4px 12px color-mix(in srgb, var(--accent2) 20%, transparent);
}

@media (hover:hover){
  .category-menu-link.category-type-button:hover{
      border-color:color-mix(in srgb, var(--accent2) 84%, #000);
      background:color-mix(in srgb, var(--accent2) 84%, #000);
      color:#fff;
      box-shadow:0 7px 16px color-mix(in srgb, var(--accent2) 28%, transparent);
    }
}

.category-menu-link.category-type-button:is(.is-active, [aria-pressed="true"]),
.category-menu-link.category-type-button:is(.is-active, [aria-pressed="true"]):hover{
  border-color:color-mix(in srgb, var(--accent2) 76%, #000);
  background:color-mix(in srgb, var(--accent2) 82%, #000);
  color:#fff;
  box-shadow:
    inset 0 -4px 0 rgba(255,255,255,.24),
    0 0 0 3px var(--soft),
    0 6px 15px color-mix(in srgb, var(--accent2) 30%, transparent);
}

.category-label-finder-section{
  padding:8px 0;
  border-top:1px solid color-mix(in srgb, var(--line) 86%, var(--accent));
  border-bottom:1px solid color-mix(in srgb, var(--line) 76%, transparent);
}

.category-label-finder-row{
  display:grid;
  grid-template-columns:118px minmax(0, 1fr);
  align-items:center;
  gap:10px;
}

.category-type-title,
.category-label-finder-title{
  display:grid;
  gap:1px;
}

.category-type-title strong,
.category-label-finder-title strong{
  color:var(--accent2);
  font-size:13px;
  font-weight:900;
}

.category-type-title span,
.category-label-finder-title span{
  color:var(--muted);
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
}

.label-finder-panel{
  position:relative;
  min-width:0;
  padding:6px;
  border:1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
  border-radius:8px;
  background:#fff;
  box-shadow:0 5px 14px rgba(36,50,71,.035);
}

.label-finder-panel::before{
  content:"";
  position:absolute;
  top:-1px;
  right:8px;
  left:8px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, #A7752D 0 34%, #4F6F9D 34% 68%, #34796F 68% 100%);
}

.facet-compact-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 190px auto;
  align-items:center;
  gap:7px;
}

.facet-stage-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:7px;
}

.facet-dropdown{
  --facet-control-color:var(--accent2);
  --facet-control-soft:var(--soft);
  position:relative;
  min-width:0;
}

.facet-dropdown--material{
  --facet-control-color:#98671F;
  --facet-control-soft:#FAF0DC;
}

.facet-dropdown--size{
  --facet-control-color:#496A98;
  --facet-control-soft:#EAF0F8;
}

.facet-dropdown--color,
.facet-dropdown--use{
  --facet-control-color:#34796F;
  --facet-control-soft:#E5F2EF;
}

.facet-dropdown summary{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:5px 32px 5px 8px;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--facet-control-color) 28%, var(--line));
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  cursor:pointer;
  list-style:none;
  box-shadow:0 4px 12px rgba(36,50,71,.035);
  transition:background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.facet-dropdown summary::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:3px;
  background:var(--facet-control-color);
}

.facet-dropdown summary::-webkit-details-marker{ display:none; }

.facet-dropdown summary::after{
  content:"⌄";
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  color:var(--facet-control-color);
  font-size:14px;
  transition:transform .16s ease;
}

.facet-dropdown[open] summary{
  border-color:var(--facet-control-color);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--facet-control-color) 12%, transparent);
}

.facet-dropdown summary:hover{
  border-color:color-mix(in srgb, var(--facet-control-color) 58%, var(--line));
  background:color-mix(in srgb, var(--facet-control-soft) 55%, white);
}

.facet-dropdown.is-selected summary{
  border-color:color-mix(in srgb, var(--facet-control-color) 54%, var(--line));
  background:linear-gradient(90deg, color-mix(in srgb, var(--facet-control-soft) 78%, white), #fff 78%);
}

.facet-dropdown[open] summary::after{ transform:translateY(-50%) rotate(180deg); }

.facet-step-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 24px;
  width:24px;
  height:24px;
  border-radius:999px;
  background:var(--facet-control-color);
  color:#fff;
  font-size:11px;
  font-weight:900;
}

.facet-summary-copy{
  display:grid;
  gap:1px;
  min-width:0;
}

.facet-summary-copy small{
  color:var(--facet-control-color);
  font-size:10px;
  font-weight:800;
}

.facet-summary-copy strong{
  overflow:hidden;
  color:var(--ink);
  font-size:12px;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.facet-dropdown.is-selected .facet-summary-copy strong{ color:var(--facet-control-color); }

.facet-dropdown-menu{
  position:absolute;
  z-index:50;
  top:calc(100% + 7px);
  left:0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:6px;
  width:300px;
  max-height:310px;
  overflow-y:auto;
  padding:10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 20px 42px rgba(36,50,71,.16);
}

.facet-dropdown--size .facet-dropdown-menu{
  right:0;
  left:auto;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  width:680px;
  max-height:320px;
}

.facet-btn{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  min-height:36px;
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:5px;
  background:#fff;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  text-align:left;
}

.facet-btn > span:not(.facet-color-dot){
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.facet-btn > small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:22px;
  min-height:20px;
  margin-left:auto;
  padding:1px 6px;
  border-radius:999px;
  background:color-mix(in srgb, var(--facet-control-soft) 72%, white);
  color:var(--facet-control-color);
  font-size:10px;
  font-weight:900;
}

.facet-btn:not(:disabled):hover{
  border-color:color-mix(in srgb, var(--facet-control-color) 46%, var(--line));
  background:color-mix(in srgb, var(--facet-control-soft) 58%, white);
  color:var(--facet-control-color);
}

.facet-btn--color{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-color:color-mix(in srgb, var(--facet-color) 44%, var(--line));
  background:var(--facet-color);
  color:var(--facet-ink);
}

.facet-btn--color:not(:disabled):hover{
  border-color:var(--facet-color);
  background:var(--facet-color);
  color:var(--facet-ink);
}

.facet-color-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  box-shadow:0 0 0 1px rgba(0,0,0,.08);
  flex:0 0 auto;
}

.facet-btn.is-active{
  border-color:color-mix(in srgb, var(--facet-control-color) 44%, var(--line));
  background:color-mix(in srgb, var(--facet-control-soft) 82%, white);
  color:var(--facet-control-color);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--facet-control-color) 12%, white);
}

.facet-btn--color.is-active{
  border-color:var(--facet-color);
  background:var(--facet-color);
  color:var(--facet-ink);
  box-shadow:0 0 0 2px rgba(36,50,71,.12);
}

.facet-btn--color > small{
  background:rgba(255,255,255,.18);
  color:inherit;
}

.facet-advanced{
  --facet-control-color:#34796F;
  --facet-control-soft:#E5F2EF;
  position:relative;
  min-width:0;
}

.facet-advanced > summary{
  position:relative;
  display:flex;
  align-items:center;
  gap:7px;
  min-height:42px;
  padding:5px 30px 5px 8px;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--facet-control-color) 26%, var(--line));
  border-radius:8px;
  background:#fff;
  cursor:pointer;
  list-style:none;
}

.facet-advanced > summary::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:3px;
  background:var(--facet-control-color);
}

.facet-advanced > summary::-webkit-details-marker{ display:none; }

.facet-advanced > summary::after{
  content:"⌄";
  position:absolute;
  right:10px;
  color:var(--facet-control-color);
  font-size:14px;
  font-weight:700;
}

.facet-advanced[open] > summary{ border-color:var(--facet-control-color); }

.facet-advanced[open] > summary::after{ transform:rotate(180deg); }

.facet-advanced.is-selected > summary{
  border-color:color-mix(in srgb, var(--facet-control-color) 54%, var(--line));
  background:linear-gradient(90deg, color-mix(in srgb, var(--facet-control-soft) 82%, white), #fff 82%);
}

.facet-dropdown.is-disabled > summary,
.facet-advanced.is-disabled > summary{
  border-color:var(--line);
  background:#F7F8F6;
  color:var(--muted);
  cursor:not-allowed;
  box-shadow:none;
  opacity:.66;
}

.facet-dropdown.is-disabled > summary:hover,
.facet-advanced.is-disabled > summary:hover{
  border-color:var(--line);
  background:#F7F8F6;
}

.facet-dropdown.is-disabled > summary::after,
.facet-advanced.is-disabled > summary::after{
  opacity:.35;
}

.facet-advanced > summary > span{
  display:inline-flex;
  align-items:center;
  min-height:21px;
  padding:0 7px;
  border-radius:999px;
  background:var(--facet-control-color);
  color:#fff;
  font-size:9px;
  font-weight:900;
}

.facet-advanced > summary > strong{
  color:var(--ink);
  font-size:11px;
  font-weight:900;
}

.facet-advanced > summary > em{
  margin-left:auto;
  color:var(--muted);
  font-size:10px;
  font-style:normal;
  font-weight:700;
}

.facet-advanced-grid{
  position:absolute;
  z-index:55;
  top:calc(100% + 7px);
  right:0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  width:520px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 20px 42px rgba(36,50,71,.16);
}

.facet-advanced-grid .facet-dropdown:nth-child(2) .facet-dropdown-menu{
  right:0;
  left:auto;
}

.facet-reset{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:5px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

.facet-reset{
  border:1px solid var(--line);
  background:color-mix(in srgb, var(--soft) 52%, white);
  color:var(--accent2);
  cursor:pointer;
}

.facet-reset::before{
  content:"↺";
  margin-right:4px;
  font-size:14px;
}

.facet-reset:not(:disabled):hover{
  border-color:color-mix(in srgb, var(--accent) 42%, var(--line));
  background:var(--soft);
}

.facet-reset:disabled{
  opacity:.42;
  cursor:default;
}

.facet-btn:focus-visible,
.facet-reset:focus-visible,
.facet-dropdown > summary:focus-visible,
.facet-advanced > summary:focus-visible{
  outline:3px solid color-mix(in srgb, var(--accent) 25%, transparent);
  outline-offset:2px;
}

.spotlight-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:30px 22px;
}

.label-finder-result-status{
  margin-left:auto;
  color:var(--accent2);
  font-weight:900;
}

.label-finder-empty{
  grid-column:1 / -1;
  padding:28px 20px;
  border:1px dashed var(--line);
  border-radius:10px;
  background:#fff;
  color:var(--muted);
  text-align:center;
  font-weight:800;
}

.category-menu-section + .category-section .section-head{
  padding-top:6px;
  border-top:1px solid color-mix(in srgb, var(--line) 76%, transparent);
}

.category-menu-section + .category-section .section-head h2{
  font-size:26px;
}

.spotlight-card{
  overflow:hidden;
  display:grid;
  grid-template-rows:180px auto;
}

.spotlight-media-link{
  display:block;
  overflow:hidden;
}

.spotlight-media{
  position:relative;
  background:linear-gradient(135deg, color-mix(in srgb, var(--soft) 80%, white), #fff);
  overflow:hidden;
}

.spotlight-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1);
  transition:transform .28s ease;
}

.spotlight-card:hover .spotlight-media img{
  transform:scale(1.06);
}

.spotlight-media.is-placeholder{
  display:flex;
  align-items:flex-end;
  padding:18px;
}

.spotlight-media.is-placeholder::before{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:10px;
  background:
    radial-gradient(circle at 24% 28%, rgba(47,143,123,.18), transparent 40%),
    linear-gradient(135deg, rgba(47,143,123,.10), rgba(255,255,255,.72));
}

.spotlight-initial{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  height:54px;
  border-radius:8px;
  background:#fff;
  color:var(--accent2);
  font-size:22px;
  font-weight:900;
  box-shadow:0 10px 24px rgba(36,50,71,.10);
}

.spotlight-body{
  padding:18px;
}

.spotlight-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:var(--soft);
  color:var(--accent2);
  font-size:12px;
  font-weight:900;
}

.spotlight-body strong{
  display:block;
  margin-top:10px;
  font-size:18px;
  line-height:1.32;
}

.spotlight-title{
  display:block;
  margin-top:10px;
  color:#182235;
  font-size:18px;
  font-weight:800;
  line-height:1.32;
}

.spotlight-body p{
  margin:8px 0 14px;
  color:#576677;
  font-size:14px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.spotlight-foot{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  color:#4C5C6D;
  font-size:13px;
}

.spotlight-foot span{
  font-weight:800;
  color:var(--accent2);
}

.highlight-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.highlight-card{
  padding:22px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--soft) 48%, white), #fff 60%);
}

.highlight-card strong{
  display:block;
  margin-bottom:10px;
  font-size:19px;
}

.highlight-card p{
  margin:0;
  color:#566678;
  font-size:14px;
}

.common-card{
  padding:28px;
  background:
    radial-gradient(340px 200px at 100% 0%, rgba(47,143,123,.08), transparent 65%),
    linear-gradient(180deg, #fff, color-mix(in srgb, var(--soft) 28%, white));
}

.common-kicker{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 11px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(36,50,71,.10);
  color:var(--accent2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.common-card h2{
  margin:12px 0 10px;
  font-size:28px;
  line-height:1.24;
}

.common-card > p{
  margin:0;
  color:#566678;
}

.common-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:20px;
}

.common-grid article{
  padding:18px;
  border-radius:10px;
  border:1px solid rgba(36,50,71,.08);
  background:#fff;
}

.common-grid strong{
  display:block;
  margin-bottom:8px;
  color:#182235;
}

.common-grid p{
  margin:0;
  color:#5C6B7B;
  font-size:14px;
}

.kakao-id{ color:#fff; font-weight:800; }

@media (max-width: 1100px){
  .category-hero{
      grid-template-columns:1fr;
    }
  .spotlight-grid{
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }
  .facet-compact-row{
      grid-template-columns:minmax(0, 1fr) auto auto;
    }
  .facet-stage-grid{
      grid-column:1 / -1;
    }
}

@media (max-width: 820px){
  .category-switch-panel{
      display:grid;
      gap:10px;
    }
  .category-switch-label{
      min-width:0;
    }
  .category-copy h1{
      font-size:30px;
    }
  .section-head{
      align-items:flex-start;
    }
  .category-type-row,
    .category-label-finder-row{
      grid-template-columns:1fr;
      gap:6px;
    }
  .category-type-title,
    .category-label-finder-title{
      display:flex;
      align-items:center;
      gap:8px;
    }
  .category-type-grid{
      grid-template-columns:repeat(3, minmax(0, 1fr));
    }
  .facet-dropdown-menu{
      position:fixed;
      z-index:120;
      top:auto;
      right:20px;
      bottom:20px;
      left:20px;
      width:auto;
      max-height:56vh;
    }
  .facet-dropdown--size .facet-dropdown-menu{
      right:20px;
      left:20px;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      width:auto;
      max-height:56vh;
    }
  .facet-advanced-grid{
      position:fixed;
      z-index:115;
      top:auto;
      right:20px;
      bottom:20px;
      left:20px;
      width:auto;
    }
}

@media (max-width: 620px){
  .sub-link-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }
  .category-menu-link{
      width:100%;
      min-height:46px;
      padding:9px 10px;
      white-space:normal;
    }
  .category-type-grid{
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }
  .category-label-finder-section{
      padding:7px 0;
    }
  .label-finder-panel{
      padding:6px;
    }
  .facet-compact-row{
      grid-template-columns:minmax(0, 1fr) auto;
      gap:7px;
    }
  .facet-stage-grid{
      grid-column:1 / -1;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:7px;
    }
  .facet-advanced > summary > em{
      display:none;
    }
}

@media (max-width: 360px){
  .sub-link-grid{
      grid-template-columns:1fr;
    }
  .category-type-grid{
      grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion: reduce){
  .category-menu-link{
      transition:none;
    }
}
