/* ============================================================
   cleanmsg.css — 클린마사지 쇼핑몰(마켓플레이스) 스킨 (tk.css 뒤 로드)
   msg82(에디토리얼)·truemsg(웜)와 완전히 다른 방향: 지마켓형 조밀 상품그리드.
   ============================================================ */
:root{
  --ink:#191b1f; --ink2:#474a52; --mut:#8b8f98;
  --paper:#ffffff; --line:#e6e8ee; --line2:#f2f3f7;
  --wash:#f4f5f7;                              /* 쿨 그레이(마켓) */
  --r-s:6px; --r-m:8px; --r-l:12px;            /* 각진 마켓 카드 */
  --brand:#148A46; --brand2:#22C55E; --brand-d:#0B6B34; --brand-soft:#E7F7EE;
  --deal:#F1592A;                              /* 특가/심야 강조(오렌지레드) */
  --sh-1:0 1px 2px rgba(20,30,40,.06);
  --sh-2:0 4px 14px rgba(20,40,30,.10);
  --sh-brand:0 6px 18px rgba(20,138,70,.25);
  --wrap:1220px;
}
html{font-size:15.5px}
body{background:var(--wash);color:var(--ink);line-height:1.6;letter-spacing:-.2px}
h1,h2,h3{letter-spacing:-.5px;font-weight:800}

/* ── 버튼: 각진 그린 ─────────────────────────────────── */
.tk-btn{border-radius:var(--r-s);font-weight:800;box-shadow:none}
.tk-btn-line,.tk-btn-ghost{border-radius:var(--r-s)}

/* ── 헤더: 좌측 로고 + 그린 검색 + 카테고리바 ─────────── */
.tk-util{background:#10331f;color:#dff0e6}
.tk-util a{color:#eafff2}
.tk-hd-main{border-bottom:1px solid var(--line)}
.tk-logo{order:-1;margin-right:20px}
.tk-search{flex:1;max-width:none;border:2px solid var(--brand);border-radius:var(--r-s);background:#fff}
.tk-search button{background:var(--brand);color:#fff;border-radius:0 4px 4px 0}
.tk-gnb{background:#fff;border-bottom:2px solid var(--brand)}
.tk-gnb-a{font-weight:800}
.tk-gnb-a.is-on{color:var(--brand-d)} .tk-gnb-a.is-on::after{background:var(--brand)}

/* ── 히어로: 그린 마켓 배너 + 검색(compact) ───────────── */
.tm-hero{background:linear-gradient(105deg,#0B6B34 0%,#148A46 55%,#22C55E 130%);color:#fff}
.tm-hero-in{max-width:var(--wrap);margin:0 auto;padding:40px 20px 44px;text-align:center}
.tm-hero-kicker{display:inline-block;background:rgba(255,255,255,.16);color:#fff;border:0;
  font-weight:800;font-size:.82rem;padding:.38em 1em;border-radius:999px;margin:0 0 14px}
.tm-hero-h{color:#fff;font-size:clamp(1.7rem,3.8vw,2.7rem);line-height:1.2;margin:0 0 10px}
.tm-hero-h b{color:#d6ffe6}
.tm-hero-sub{color:#e5f7ec;font-size:1.02rem;max-width:600px;margin:0 auto 22px}
.tm-hero-search{display:flex;gap:0;max-width:600px;margin:0 auto;background:#fff;border-radius:var(--r-s);padding:6px;box-shadow:var(--sh-2)}
.tm-hero-search input{flex:1;border:0;outline:0;background:none;font-size:1.02rem;padding:0 14px;color:var(--ink)}
.tm-hero-search button{border:0;background:var(--brand);color:#fff;font-weight:800;padding:0 1.5em;border-radius:var(--r-s);cursor:pointer}
.tm-hero-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px auto 0}
.tm-hero-chips a{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.25);
  font-weight:700;font-size:.92rem;padding:.45em 1em;border-radius:999px}
.tm-hero-chips a:hover{background:#fff;color:var(--brand-d)}

/* ── 신뢰 스트립 ────────────────────────────────────── */
.tk-trust{background:#fff;border:1px solid var(--line);border-radius:var(--r-m)}
.tk-trust-ico{background:var(--brand-soft);color:var(--brand-d);border-radius:8px}

/* ── 섹션 헤더: 마켓형(굵고 큰 제목 + 초록 밑줄 더보기) ── */
.tk-sec-hd h1,.tk-sec-hd h2{font-size:1.45rem}
.tk-more{color:var(--brand-d);font-weight:800}

/* ── ★상품 카드: 조밀 그리드 + 썸네일 + 가격 + 배지 ───── */
.tk-scards{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));gap:12px}
.tk-scard{list-style:none}
.tk-scard>a,.tk-card>a{display:block;border:1px solid var(--line);border-radius:var(--r-m);background:#fff;overflow:hidden;box-shadow:var(--sh-1);transition:.14s}
.tk-scard>a:hover,.tk-card>a:hover{border-color:var(--brand);box-shadow:var(--sh-2);transform:translateY(-2px)}
.tk-scard-th,.tk-card-thumb{position:relative;display:block;aspect-ratio:4/3;overflow:hidden}
.tk-scard-th .tk-th,.tk-card-thumb .tk-th{width:100%;height:100%;object-fit:cover}
/* 업종 배지(썸네일 좌상단) */
.tk-scard-tags,.tk-card-tags{position:absolute;left:8px;top:8px;margin:0;z-index:2;display:flex;gap:4px}
.tk-scard-tags i,.tk-card-tags i{background:var(--brand);color:#fff;font-size:.7rem;font-weight:800;
  padding:.28em .6em;border-radius:999px;border:0;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tk-scard-tags i~i,.tk-card-tags i~i{background:#fff;color:var(--brand-d);border:1px solid var(--line)}
/* 본문 */
.tk-scard-b,.tk-card>a{padding:0}
.tk-scard-b{display:block;padding:10px 11px 12px}
.tk-scard-area,.tk-card-area{display:block;color:var(--mut);font-size:.82rem;font-weight:600;padding:10px 11px 0}
.tk-scard-area{padding:0 0 3px}
.tk-scard-t,.tk-card-t{display:block;color:var(--ink);font-weight:800;font-size:1rem;line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 0 6px}
.tk-card-t{padding:2px 11px 6px}
/* ★가격(요금 통일이라 CSS로 일괄 노출) */
.tk-scard-b::after,.tk-card>a::after{content:"60분 90,000원 ~";display:block;color:var(--brand-d);
  font-weight:800;font-size:1.02rem;padding:2px 0 0}
.tk-card>a::after{padding:2px 11px 12px}
.tk-scard-rate{color:var(--deal);font-weight:700}
.tk-scard-meta{color:var(--mut);font-size:.8rem}

/* ── 업종 타일(홈 상단 카테고리) ────────────────────── */
.tk-cats-row li>a,.tk-cat-near>a{border:1px solid var(--line);border-radius:var(--r-m);background:#fff;text-align:center}
.tk-cats-row li>a:hover{border-color:var(--brand);box-shadow:var(--sh-1)}
.tk-cat-ico{background:var(--brand-soft);color:var(--brand-d)}

/* 업종 카드(아이콘 타일) */
.tk-bene li>a{border:1px solid var(--line);border-radius:var(--r-m);background:#fff;overflow:hidden;padding-bottom:12px;box-shadow:var(--sh-1)}
.tm-bene-ico{position:relative;display:flex;align-items:center;justify-content:center;height:120px;background:linear-gradient(135deg,var(--brand-soft),#fff);border-bottom:1px solid var(--line)}
.tm-bene-ico .tk-i{width:48px;height:48px;color:var(--brand-d)}
.tm-bene-ico .tk-badge{position:absolute;left:12px;top:12px;background:var(--brand);color:#fff;font-size:.72rem;font-weight:800;padding:.3em .7em;border-radius:999px}
.tk-bene li>a strong{display:block;padding:12px 13px 2px;font-weight:800}
.tk-bene li>a>span{display:block;padding:0 13px;color:var(--mut);font-size:.88rem}

/* 지역 카드: 그린 그라데이션 */
.tk-promo li>a{position:relative;display:flex;align-items:flex-end;min-height:150px;border-radius:var(--r-m);overflow:hidden;color:#fff;padding:16px;background:linear-gradient(150deg,#148A46,#0B6B34)}
.tk-promo li.is-big>a{min-height:196px}
.tk-promo li:nth-child(3n+2)>a{background:linear-gradient(150deg,#22C55E,#148A46)}
.tk-promo li:nth-child(3n)>a{background:linear-gradient(150deg,#0f9d58,#0B6B34)}
.tk-promo-tag{position:absolute;left:14px;top:12px;background:rgba(255,255,255,.22);color:#fff;font-size:.72rem;font-weight:800;padding:.28em .7em;border-radius:999px}
.tk-promo-tx strong{display:block;font-size:1.2rem;font-weight:800}
.tk-promo-tx em{display:block;font-style:normal;opacity:.92;font-size:.86rem}

/* 지역 칩·롱테일 */
.tk-regions li>a,.tk-lt-grid li>a{border:1px solid var(--line);border-radius:var(--r-s);background:#fff}
.tk-regions li>a:hover,.tk-lt-grid li>a:hover{border-color:var(--brand);color:var(--brand-d);background:var(--brand-soft)}
.tk-chips li>a{border-radius:var(--r-s)}
.tk-chips li.is-on>a{background:var(--brand);color:#fff}

/* 상세 요금/팩트 */
.tk-c-n{font-weight:700} .tk-c-p{color:var(--brand-d);font-weight:800}

/* 푸터: 딥그린 */
.tk-ft{background:#10261a;color:#d7e8dd;border-top:4px solid var(--brand)}
.tk-ft h3{color:#fff} .tk-ft a{color:#d0e6d8} .tk-ft a:hover{color:#fff}
.tk-ft-brand p{color:#a9c6b5} .tk-ft-policy{color:#8fb39d !important}
.tk-ft-links li>a{border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.03)}
.tk-ft-links li>a:hover{border-color:var(--brand);background:rgba(34,197,94,.16);color:#fff}
.tk-ft-btm{border-top:1px solid rgba(255,255,255,.12);color:#8fb39d}

a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid rgba(20,138,70,.4);outline-offset:2px}
@media (max-width:760px){ html{font-size:15px} .tk-scards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px} .tm-hero-in{padding:30px 16px 34px} }