:root{
  --accent:#2F8F7B;
  --accent2:#23695A;
  --ink:#243247;
  --muted:#61707A;
  --line:#D8DDD8;
  --navy:#1F2B3A;

  --kick_red:#2F8F7B;
  --kick_red_glow: rgba(47,143,123,.18);

  --container:1180px;
  --r-soft: 6px;
  --r-search: 36px;
  --hero_scale: 1.6;

  --price_red: #243247;
  --quote_green: #23695A;
}

*{ box-sizing:border-box; font-size:14px}
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(300px 180px at 0% 0%, rgba(36,50,71,.06), rgba(255,255,255,0) 72%),
    linear-gradient(180deg, #F4F5F1, #F4F5F1);
  line-height:1.55;
  letter-spacing:-0.1px;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; height:auto; }
button,input,select{ font:inherit; }
.container{ width:min(var(--container), calc(100% - 40px)); margin:0 auto; }
.muted{ color:var(--muted); }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.no-break{ white-space:nowrap; }

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:10px 14px;
  border:1px solid transparent;
  background:#fff;
  cursor:pointer;
  font-weight:800;
}
.btn-accent{ background:var(--accent); border-color:var(--accent); color:#fff; }
.btn-accent:hover{ background:var(--accent2); border-color:var(--accent2); color:#fff; }
.btn-ghost-onwhite{
  border:1px solid var(--line);
  border-radius: var(--r-soft);
  padding:9px 12px;
  font-weight:800;
  background:#fff;
}

/* Header */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.header-top{
  display:grid;
  grid-template-columns: 180px 1fr 120px;
  gap:14px;
  align-items:center;
  padding:14px 0;
}
.brand img{ height:28px; width:auto; }

.search-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  height:40px;
  border:1px solid var(--line);
  border-radius: var(--r-search);
  padding:4px 6px 4px 12px;
  background:#fff;
}
.search-wrap select{
  border:0;
  outline:none;
  background:transparent;
  font-weight:700;
  font-size:14px;
  max-width:170px;
}
.search-wrap input{
  flex:1;
  border:0;
  outline:none;
  font-size:15px;
  min-width:120px;
}
.search-wrap .btn{ border-radius: var(--r-search); padding:9px 14px; }

.header-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
}
.icon-link{
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
.icon svg{ width:18px; height:18px; }
.badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background:var(--accent);
  color:#fff;
  font-weight:900;
  font-size:11px;
  border:1px solid rgba(0,0,0,.10);
  display:flex;
  align-items:center;
  justify-content:center;
}

.header-nav{ border-top:1px solid var(--line); }
.nav-row{
  display:grid;
  grid-template-columns: 240px 1fr 60px;
  gap:14px;
  align-items:center;
  padding:10px 0;
}

/* Mega */
.mega-wrap{ position:relative; }
.mega-trigger{
  width:100%;
  height:40px;
  border-radius: var(--r-soft);
  border:1px solid var(--line);
  background:#fff;
  cursor:pointer;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight:800;
}
.caret{ width:14px; height:14px; opacity:.75; }
.mega-panel{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  width:min(760px, calc(100vw - 40px));
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--r-soft);
  display:none;
  overflow:hidden;
}
.mega-wrap.is-open .mega-panel{ display:flex; }
.mega-left{
  width:250px;
  background:color-mix(in srgb, var(--accent-soft, #D6ECE6) 55%, white);
  border-right:1px solid var(--line);
  padding:10px;
}
.mega-main{
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  padding:12px 12px;
  border-radius:8px;
  cursor:pointer;
  font-weight:800;
}
.mega-main.is-active{
  background:color-mix(in srgb, var(--accent-soft, #D6ECE6) 72%, white);
  color:var(--accent2);
}
.mega-right{ flex:1; padding:14px; }
.mega-sub{ display:none; }
.mega-sub.is-active{ display:block; }
.mega-sub a{
  display:block;
  padding:10px 10px;
  border-radius:8px;
  font-weight:700;
}
.mega-foot{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.mega-hint{ font-size:13px; color:var(--muted); font-weight:700; }

.nav-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.nav-link{
  padding:8px 10px;
  border-radius:8px;
  font-weight:700;
  font-size:14px;
}
.nav-link.is-active{
  background:color-mix(in srgb, var(--accent-soft, #D6ECE6) 72%, white);
  color:var(--accent2);
}
.nav-drop{ position:relative; }
.nav-drop::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:12px;
}
.nav-drop-menu{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px;
  min-width:180px;
  display:none;
}
.nav-drop:hover .nav-drop-menu{ display:block; }
.nav-drop-menu a{
  display:block;
  padding:10px 10px;
  border-radius:8px;
  font-weight:700;
}

.user-area{ position:relative; display:flex; justify-content:flex-end; }
.user-area::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:12px;
}
.user-btn{
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.user-btn svg{ width:18px; height:18px; }
.user-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px;
  min-width:200px;
  display:none;
}
.user-area:hover .user-menu,
.user-area:focus-within .user-menu{ display:block; }
.user-area.is-open .user-menu{ display:block; }
.user-menu a{
  display:block;
  padding:10px 10px;
  border-radius:8px;
  font-weight:700;
}
.user-menu-title{
  font-size:12px;
  color:var(--muted);
  font-weight:900;
  padding:10px 10px 6px;
}
.user-menu-sep{
  height:1px;
  background:var(--line);
  margin:8px 6px;
}

/* HERO */
.hero{ background:var(--accent); position:relative; }
.hero-slider{
  position:relative;
  width:100%;
  height: clamp(620px, 62vh, 760px);
  overflow:hidden;
}
.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transition: opacity .45s ease;
}
.hero-slide.is-active{ opacity:1; pointer-events:auto; }

.hero-media{ position:absolute; user-select:none; pointer-events:none; }
.hero-media--cover{ inset:0; width:100%; height:100%; object-fit:cover; }
.hero-media--origin{ left:50%; top:50%; transform: translate(-50%, -50%); width:auto; height:auto; max-width:none; max-height:none; }

.hero-slide::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.34), rgba(0,0,0,.10));
}
.hero-inner{ position:relative; height:100%; display:flex; align-items:center; }
.hero-copy{ position:relative; z-index:2; max-width:620px; color:#fff; }
.hero-copy h1{
  margin:0 0 10px;
  font-weight:900;
  line-height:1.05;
  font-size: clamp(40px, calc(2.8vw * var(--hero_scale)), 78px);
  text-shadow: 0 10px 28px rgba(0,0,0,.25);
}
.hero-copy p{
  margin:0;
  font-weight:700;
  color: rgba(255,255,255,.92);
  text-shadow: 0 10px 28px rgba(0,0,0,.25);
}
.hero-arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.14);
  background: rgba(255,255,255,.86);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity:0;
  transition: opacity .15s ease;
  z-index:3;
}
.hero-arrow svg{ width:18px; height:18px; }
.hero-arrow.prev{ left:18px; }
.hero-arrow.next{ right:18px; }
.hero-slider:hover .hero-arrow{ opacity:1; }

.hero-dots{
  position:absolute;
  left:50%;
  bottom:18px;
  transform: translateX(-50%);
  display:flex;
  gap:10px;
  z-index:3;
}
.hero-dot{
  width:6px;
  height:6px;
  border-radius:999px;
  background: rgba(255,255,255,.55);
  border:0;
  padding:0;
  cursor:pointer;
}
.hero-dot.is-active{ background: rgba(255,255,255,.95); }

/* HUB */
.hub{
  background:
    radial-gradient(780px 320px at 0% 0%, rgba(47,143,123,.14), rgba(47,143,123,0) 60%),
    radial-gradient(760px 320px at 100% 10%, rgba(36,50,71,.10), rgba(36,50,71,0) 60%),
    linear-gradient(180deg, #f6fbfa, #eef4f2 58%, #f7f8f4);
  padding:24px 0 38px;
  border-bottom:1px solid rgba(15,23,42,.08);
}
.hub-inner{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
.hub-card{
  --hub-solid:#d9a66b;
  --hub-mid:#bf7c57;
  --hub-deep:#895959;
  --hub-accent: rgba(255,245,226,.14);
  --hub-accent-strong: rgba(255,239,203,.24);
  --hub-shadow: rgba(102,70,58,.20);
  --hub-glow: rgba(255,232,179,.22);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.14);
  min-height:214px;
  padding:16px 16px 14px;
  color:#fff;
  background:
    radial-gradient(170px 170px at 16% 14%, var(--hub-accent-strong), rgba(255,255,255,0) 60%),
    radial-gradient(220px 180px at 88% 88%, var(--hub-accent), rgba(255,255,255,0) 62%),
    linear-gradient(148deg, var(--hub-solid) 0%, var(--hub-mid) 52%, var(--hub-deep) 100%);
  box-shadow: 0 16px 32px var(--hub-shadow);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  will-change:transform, filter;
}
.hub-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 34%),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,0) 60%);
  pointer-events:none;
}
.hub-card::after{
  content:"";
  position:absolute;
  left:-34px;
  bottom:-56px;
  width:150px;
  height:150px;
  border-radius:999px;
  background: radial-gradient(circle, var(--hub-glow), rgba(255,255,255,0) 70%);
  filter:blur(10px);
  opacity:.74;
  pointer-events:none;
}
.hub-card:hover{
  box-shadow: 0 20px 40px var(--hub-shadow);
}
.hub-card:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.32),
    0 20px 40px var(--hub-shadow);
}

.hub-bg-icon{
  position:absolute;
  right:-10px;
  bottom:-10px;
  width:150px;
  height:150px;
  opacity:.16;
  color:#fff;
  pointer-events:none;
  transform-origin:75% 75%;
  will-change:transform, opacity;
  mix-blend-mode:soft-light;
}
.hub-bg-icon svg{
  width:100%;
  height:100%;
}

.hub-icon-main{
  margin-top:2px;
  width:58px;
  height:58px;
  border-radius:8px;
  background: rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.20);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
  transform-origin:center center;
  will-change:transform, opacity, filter;
  backdrop-filter: blur(8px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 10px 22px rgba(0,0,0,.18);
}
.hub-icon-main svg{
  width:28px;
  height:28px;
}
.hub-title{
  margin:14px 0 0;
  font-weight:900;
  font-size:23px;
  line-height:1.08;
  letter-spacing:-0.7px;
  z-index:2;
  transform-origin:left center;
  will-change:transform, opacity;
  max-width:132px;
}
.hub-btn{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:108px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.94);
  color:#0f172a;
  border:1px solid rgba(255,255,255,.52);
  font-size:13px;
  letter-spacing:-0.25px;
  font-weight:900;
  z-index:2;
  box-shadow: 0 10px 20px rgba(0,0,0,.18);
  transform-origin:left center;
  will-change:transform, box-shadow, opacity;
  transition: background .18s ease, box-shadow .18s ease;
}
.hub-card:hover .hub-btn{
  background:#fff;
  box-shadow: 0 16px 28px rgba(0,0,0,.22);
}

/* 移대뱶蹂???*/
.hub-card--open{
  --hub-solid:#79b5a7;
  --hub-mid:#4a8f80;
  --hub-deep:#2f6d62;
  --hub-accent: rgba(227,248,241,.16);
  --hub-accent-strong: rgba(201,235,226,.28);
  --hub-shadow: rgba(46,92,84,.20);
  --hub-glow: rgba(186,232,220,.22);
}
.hub-card--docs{
  --hub-solid:#8da7bf;
  --hub-mid:#607a95;
  --hub-deep:#425a72;
  --hub-accent: rgba(233,241,248,.15);
  --hub-accent-strong: rgba(205,220,233,.26);
  --hub-shadow: rgba(66,85,107,.20);
  --hub-glow: rgba(193,215,235,.20);
}
.hub-card--case{
  --hub-solid:#c2a2a8;
  --hub-mid:#9a767e;
  --hub-deep:#6f555e;
  --hub-accent: rgba(248,239,241,.14);
  --hub-accent-strong: rgba(232,213,217,.26);
  --hub-shadow: rgba(99,77,84,.20);
  --hub-glow: rgba(228,208,214,.18);
}

/* KICK */
.kick-full{
  background: radial-gradient(1200px 600px at 20% 20%, rgba(47,143,123,.18), rgba(31,43,58,0) 60%),
              linear-gradient(180deg, #1F2B3A, #17212E);
  color: rgba(255,255,255,.92);
  padding: 34px 0;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.kick-full-inner{ position:relative; }
.kick-full-inner::before{
  content:"";
  position:absolute;
  left:-16px;
  top:0;
  bottom:0;
  width:6px;
  border-radius:999px;
  background: var(--kick_red);
  box-shadow: 0 0 0 6px var(--kick_red_glow);
}
.kick-full-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
}
.kick-pill{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  font-weight:900;
  font-size:12px;
  color: rgba(255,255,255,.88);
}
.kick-full-title{
  margin:10px 0 6px;
  font-size: 30px;
  line-height:1.12;
  letter-spacing:-0.6px;
  font-weight:900;
}
.kick-full-sub{
  margin:0;
  font-weight:800;
  color: rgba(255,255,255,.78);
}
.kick-tags{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.tag{
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  font-weight:900;
  font-size:12px;
}
.kick-full-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  min-width:220px;
}
.btn-kick{
  background: var(--accent);
  border:1px solid var(--accent);
  color:#fff;
  border-radius:999px;
  padding:12px 16px;
  font-weight:900;
}
.btn-kick:hover{ background: var(--accent2); border-color: var(--accent2); }
.btn-kick-outline{
  background: transparent;
  border:1px solid rgba(255,255,255,.28);
  color: rgba(255,255,255,.92);
  border-radius:999px;
  padding:12px 16px;
  font-weight:900;
}
.btn-kick-outline:hover{ border-color: rgba(255,255,255,.45); }
.kick-minilink{
  font-weight:900;
  font-size:13px;
  color: rgba(255,255,255,.78);
}
.kick-minilink:hover{ text-decoration: underline; color:#fff; }
.kick-pack-row{
  margin-top:18px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
.kick-pack{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  border-radius:8px;
  padding:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.kick-pack:hover{
  transform: translateY(-1px);
  border-color: rgba(47,143,123,.40);
  background: rgba(255,255,255,.06);
}
.kp-name{ font-weight:900; letter-spacing:-0.2px; color:#fff; }
.kp-desc{ font-weight:800; color: rgba(255,255,255,.70); font-size:13px; }

/* BEST */
.best{ background:#fff; padding:34px 0 12px; }
.best-inner{ max-width:944px; width: calc(100% - 40px); margin:0 auto; }
.best-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px; }
.best-head h2{ margin:0; font-size:22px; letter-spacing:-0.3px; }
.best-link{ font-weight:800; font-size:13px; color:var(--muted); }
.best-link:hover{ text-decoration: underline; color:#111; }
.best-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px 18px; }
.best-item{ text-align:center; padding:8px 4px; transition: transform .16s ease; }
.best-img{ width:100%; height:150px; object-fit: contain; background:transparent; transition: transform .18s ease; }
.best-name{ margin-top:10px; font-weight:900; font-size:14px; }
.best-price{ margin-top:6px; font-weight:900; font-size:13px; }
.best-price.cash{ color: var(--price_red); }
.best-price.quote{ color: var(--quote_green); }
.best-item:hover{ transform: translateY(-2px); }
.best-item:hover .best-img{ transform: scale(1.05); }
.best-item:hover .best-name{ text-decoration: underline; }

/* FEATURED */
.featured{ padding:44px 0; }
.section-head h2{ margin:0 0 6px; font-size:22px; letter-spacing:-0.3px; }
.section-head p{ margin:0 0 18px; }
.feature-stack{ display:flex; flex-direction:column; gap:18px; }

.feature-block{
  --theme: 37,99,235;
  position:relative;
  display:grid;
  grid-template-columns: 360px 1fr;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 16px 34px rgba(36,50,71,.05);
}
.feature-block::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:8px;
  background: rgba(var(--theme), 1);
  z-index:5;
  pointer-events:none;
}
.feature-block--t1{ --theme: 47,143,123; }
.feature-block--t2{ --theme: 36,50,71; }
.feature-block--t3{ --theme: 81,127,119; }
.feature-block--t4{ --theme: 99,128,149; }

.feature-left,
.feature-right{ position:relative; z-index:1; }

.feature-left{ overflow:hidden; }
.feature-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit: cover; }
.feature-left::before{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.55)); z-index:1; }
.feature-overlay{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:18px; z-index:2; }
.feature-overlay h3{ margin:0; color:#fff; font-size:34px; font-weight:900; letter-spacing:-0.6px; line-height:1.05; text-shadow: 0 14px 30px rgba(0,0,0,.35); }

.feature-right{ padding:0 22px 22px; display:flex; flex-direction:column; gap:12px; }
.feature-headbar{
  background:transparent;
  padding:16px 0 14px;
  margin:0 0 10px;
  border-bottom:1px solid rgba(var(--theme), .12);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.feature-headbar .strong{
  font-weight:900;
  font-size:15px;
  color:rgba(var(--theme), .96);
}
.mini-link{ font-weight:800; font-size:12px; color:rgba(var(--theme), .84); }
.mini-link:hover{ text-decoration: underline; color:#111; }

.feature-products{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:30px; align-items:start; }
.prod-item{ display:block; text-align:center; padding:0 4px 6px; transition: transform .16s ease; }
.prod-img{
  width:100%;
  height:194px;
  object-fit: contain;
  padding:20px;
  border-radius:8px;
  background:
    radial-gradient(140px 96px at 82% 14%, rgba(var(--theme), .16), rgba(255,255,255,0) 70%),
    linear-gradient(180deg, #EEF7F3, #FAFCFB 72%);
  box-shadow: inset 0 0 0 1px rgba(var(--theme), .08);
  transition: transform .18s ease, box-shadow .18s ease;
}
.prod-img--label{
  padding:10px;
  background:
    linear-gradient(180deg, #FFFFFF, #F7F8F6 72%);
  box-shadow: inset 0 0 0 1px rgba(36,50,71,.10);
}
.prod-name{
  margin-top:14px;
  font-weight:900;
  font-size:15px;
  color:#0B1324;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.prod-price{ margin-top:6px; font-weight:900; font-size:13px; }
.prod-price.cash{ color: var(--price_red); }
.prod-price.quote{ color: var(--quote_green); }
.prod-item:hover{ transform: translateY(-2px); }
.prod-item:hover .prod-img{
  transform: scale(1.04);
  box-shadow:
    inset 0 0 0 1px rgba(var(--theme), .16),
    0 16px 28px rgba(36,50,71,.08);
}
.prod-item:hover .prod-name{ text-decoration: underline; }

/* INFO */
.info{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; padding:28px 0; }
.info-inner{ max-width:1062px; width: calc(100% - 40px); margin:0 auto; }
.info-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:0; align-items:stretch; }
.info-item{ padding:18px 18px; min-height:120px; display:flex; flex-direction:column; justify-content:center; text-align:center; }
.info-item + .info-item{ border-left:1px solid var(--line); }
.info-title{ font-weight:900; font-size:17px; margin-bottom:8px; letter-spacing:-0.2px; }
.info-desc{ color:var(--muted); font-weight:700; font-size:14px; }

/* Footer */
.footer{ background:var(--navy); color: rgba(255,255,255,.88); }
.footer-top{ padding:34px 0; border-bottom:1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; gap:28px; flex-wrap:wrap; }
.footer-brand{ max-width:420px; }
.footer-brand img{ height:30px; width:auto; margin-bottom:12px; }
.footer-highlight{ font-weight:900; margin:6px 0; }
.kakao-id{ color:var(--accent); font-weight:900; }
.footer-account{ margin:6px 0; color: rgba(255,255,255,.82); font-weight:700; }
.footer-desc{ margin:12px 0 0; color: rgba(255,255,255,.72); font-weight:700; font-size:14px; }
.footer-cols{ display:grid; grid-template-columns: repeat(3, 1fr); gap:22px; min-width:520px; }
.footer-title{ font-weight:900; margin-bottom:10px; }
.footer-text{ color: rgba(255,255,255,.72); font-weight:700; font-size:14px; margin:6px 0; }
.footer-link{ display:block; color: rgba(255,255,255,.78); font-weight:700; font-size:14px; padding:6px 0; }
.footer-link:hover{ color:#fff; text-decoration: underline; }
.footer-bottom{ padding:14px 0; color: rgba(255,255,255,.55); font-size:13px; }

/* Responsive */
@media (max-width: 980px){
  .header-top{ grid-template-columns: 1fr 120px; }
  .search{ display:none; }
  .nav-row{ grid-template-columns: 1fr 60px; }
  .nav-links{ display:none; }

  .hub-inner{ grid-template-columns: 1fr; }
  .hub-card{
    min-height:188px;
    padding:16px;
  }
  .hub-icon-main{
    width:54px;
    height:54px;
    margin-top:0;
  }
  .hub-icon-main svg{
    width:26px;
    height:26px;
  }
  .hub-title{
    max-width:none;
    font-size:21px;
  }
  .hub-btn{
    min-width:104px;
    padding:10px 14px;
  }
  .hub-bg-icon{
    width:118px;
    height:118px;
    right:-8px;
    bottom:-8px;
    opacity:.18;
  }

  .kick-full-top{ flex-direction:column; align-items:flex-start; }
  .kick-full-actions{ align-items:flex-start; min-width:0; }
  .kick-pack-row{ grid-template-columns: 1fr; }
  .kick-full-inner::before{ left:0; }

  .best-grid{ grid-template-columns: repeat(2, 1fr); gap:12px 14px; }

  .feature-block{ grid-template-columns: 1fr; }
  .feature-block::before{ width:6px; }
  .feature-products{ grid-template-columns: repeat(2, 1fr); gap:18px; }
  .prod-img, .best-img{ height:150px; }

  .info-grid{ grid-template-columns: 1fr; }
  .info-item{ text-align:left; min-height:auto; padding:18px 0; }
  .info-item + .info-item{ border-left:0; border-top:1px solid var(--line); }

  .footer-cols{ min-width:0; grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .best-grid{ grid-template-columns: 1fr; }
  .hub-title{ font-size:21px; }
  .hub-btn{
    width:100%;
    min-width:0;
    justify-content:space-between;
  }
}