/* 테라피런 — ★다크 좌측 사이드바 + 라이트 콘텐츠 + 일렉트릭 라임 액센트.
   8사(전부 상단 가로 헤더 1단 구조)와 근본적으로 다른 "대시보드 사이드바" 레이아웃.
   데스크톱: 좌측 고정 차콜 레일 네비 / 콘텐츠 우측. 모바일: 상단바로 복귀.
   큐레이션(대도시만) 컨셉에 맞춘 정갈한 에디토리얼 카드. */
:root{
  --brand:#4D7C0F; --brand2:#65A30D; --brand-l:#84CC16; --brand-lite:#A3E635; --brand-d:#3F6212;
  --brand-soft:#ECFCCB; --brand-soft2:#F7FEE7;
  --grad-brand:linear-gradient(135deg,#84CC16 0%,#4D7C0F 100%);
  --grad-warm:linear-gradient(135deg,#A3E635 0%,#65A30D 100%);
  --ink:#1A1A17; --ink2:#44443E; --mut:#78786E;
  --paper:#fff; --wash:#F6F7F2; --line:#E7E8E0; --line2:#EFF0E9;
  --side:#15181A; --side2:#1E2225; --side-line:#2C3136; --side-ink:#E7EAE3; --side-mut:#9AA096;
  --r-s:8px; --r-m:12px; --r-l:18px;
  --sh-1:0 1px 2px rgba(26,26,23,.05); --sh-2:0 4px 16px rgba(26,26,23,.07); --sh-3:0 14px 36px rgba(26,26,23,.12);
  --sh-brand:0 10px 24px rgba(101,163,13,.28);
}
body{background:var(--wash);color:var(--ink)}
::selection{background:var(--brand-lite);color:var(--brand-d)}

/* ══════════ 데스크톱: 좌측 사이드바 레일 ══════════ */
@media(min-width:1000px){
  .tk-hd{position:fixed;left:0;top:0;bottom:0;width:256px;height:100vh;overflow-y:auto;
    background:var(--side);border-right:1px solid var(--side-line);box-shadow:2px 0 24px rgba(0,0,0,.12);
    display:flex;flex-direction:column;z-index:100;padding:0}
  .tk-hd .tk-wrap{max-width:none;padding:0 20px}
  /* 유틸바 → 최하단 보조링크 */
  .tk-util{order:5;background:transparent;border-top:1px solid var(--side-line);margin-top:auto;padding:14px 0}
  .tk-util-in{flex-direction:column;align-items:flex-start;gap:8px;height:auto}
  .tk-util-l{color:var(--side-mut);font-size:11.5px;order:2}
  .tk-util-r{flex-direction:column;align-items:flex-start;gap:7px;order:1}
  .tk-util-r a{color:var(--side-mut);font-size:12.5px}
  .tk-util-r a:hover{color:var(--brand-lite)}
  .tk-util-r span{display:none}
  /* 메인바 → 로고+검색+회원 세로 */
  .tk-hd-main{order:1;background:transparent;padding:22px 0 6px}
  .tk-hd-row{flex-direction:column;align-items:stretch;gap:14px;height:auto;padding:0 20px}
  .tk-hd-menu{display:none}
  .tk-logo{margin:0 0 4px}
  .tk-logo img{height:52px;width:auto}
  .tk-search{order:2;width:100%;background:var(--side2);border:1px solid var(--side-line);border-radius:10px}
  .tk-search input{color:var(--side-ink)}
  .tk-search input::placeholder{color:var(--side-mut)}
  .tk-search-ico{color:var(--side-mut)}
  .tk-search:focus-within{border-color:var(--brand-l)}
  .tk-search button{background:var(--grad-brand);color:#14181A;font-weight:800}
  .tk-hd-util{order:3;justify-content:flex-start;gap:16px;padding-top:2px}
  .tk-hd-util a{color:var(--side-mut);font-size:12px;flex-direction:column;gap:3px}
  .tk-hd-util a:hover{color:var(--brand-lite)}
  .tk-hd-util .tk-i{color:var(--side-mut);width:20px;height:20px}
  .tk-hd-join{background:transparent!important;color:var(--brand-lite)!important;border:1px solid var(--side-line);border-radius:8px;padding:6px 10px}
  /* GNB → 세로 메뉴 */
  .tk-gnb{order:2;background:transparent;border:0;border-top:1px solid var(--side-line);margin-top:10px;padding:12px 0}
  .tk-gnb-row{flex-direction:column;align-items:stretch;gap:2px;height:auto;padding:0 12px}
  .tk-gnb-all,.tk-gnb-div,.tk-gnb-quick{display:none}
  .tk-gnb-nav{flex-direction:column;align-items:stretch;gap:2px;width:100%}
  .tk-gnb-a{color:var(--side-ink);font-weight:600;font-size:15px;padding:11px 14px;border-radius:9px;position:relative}
  .tk-gnb-a::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:transparent}
  .tk-gnb-a:hover{background:var(--side2);color:#fff}
  .tk-gnb-a.is-on{background:rgba(132,204,22,.12);color:var(--brand-lite)}
  .tk-gnb-a.is-on::before{background:var(--brand-lite)}
  /* 콘텐츠 우측 이동 */
  #tk-main,.tk-ft{margin-left:256px}
  .tk-top{left:auto}
}

/* ══════════ 히어로 — 라이트 큐레이션 밴드 ══════════ */
.tr-hero{background:linear-gradient(180deg,#fff 0%,var(--wash) 100%);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.tr-hero::after{content:"";position:absolute;right:-60px;top:20px;width:280px;height:280px;
  background:radial-gradient(circle,rgba(132,204,22,.14),transparent 68%);pointer-events:none}
.tr-hero-in{position:relative;max-width:1080px;margin:0 auto;padding:56px 22px 48px}
.tr-hero-kick{display:inline-flex;align-items:center;gap:7px;background:var(--brand-soft);color:var(--brand-d);
  font-weight:800;font-size:12.5px;letter-spacing:.02em;padding:7px 14px;border-radius:999px;margin:0 0 20px}
.tr-hero-kick::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand2)}
.tr-hero-h{font-size:clamp(30px,4.8vw,46px);font-weight:800;line-height:1.14;letter-spacing:-.035em;color:var(--ink);margin:0 0 16px}
.tr-hero-h b{color:var(--brand2);position:relative}
.tr-hero-h b::after{content:"";position:absolute;left:0;right:0;bottom:.05em;height:.32em;background:var(--brand-lite);opacity:.4;z-index:-1;border-radius:3px}
.tr-hero-sub{color:var(--ink2);font-size:clamp(15px,1.9vw,17px);line-height:1.7;margin:0 0 26px;max-width:560px}
.tr-hero-search{display:flex;gap:8px;max-width:560px;background:#fff;border:2px solid var(--ink);border-radius:12px;padding:6px 6px 6px 18px}
.tr-hero-search input{flex:1;min-width:0;border:0;outline:0;font-size:16px;background:transparent;color:var(--ink)}
.tr-hero-search button{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:8px;background:var(--ink);color:var(--brand-lite);font-weight:800;font-size:15px;padding:12px 24px;cursor:pointer;white-space:nowrap}
.tr-hero-search button .tk-i{width:18px;height:18px}
.tr-hero-cities{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;align-items:center}
.tr-hero-cities .tr-clabel{font-size:12.5px;font-weight:800;color:var(--mut)}
.tr-hero-cities a{background:#fff;border:1px solid var(--line);border-radius:8px;padding:7px 14px;font-size:13.5px;font-weight:700;color:var(--ink2);transition:.15s}
.tr-hero-cities a:hover{border-color:var(--brand2);color:var(--brand-d);background:var(--brand-soft2)}

/* 홈 인트로 */
.tk-home-intro{padding:32px 0 6px}
.tk-home-intro h1{display:none}
.tk-home-intro p{color:var(--ink2);line-height:1.8;font-size:15px;max-width:820px}
.tk-home-intro b{color:var(--brand-d)}

/* 신뢰 배너 */
.tk-trust li{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:18px 20px;box-shadow:var(--sh-1)}
.tk-trust-ico{background:var(--brand-soft);color:var(--brand-d);border-radius:10px;width:44px;height:44px}
.tk-trust li strong{font-weight:800}

/* 섹션 헤더 — 라임 언더바 */
.tk-sec{padding:40px 0}
.tk-band{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tk-sec-hd h2{font-size:clamp(20px,2.8vw,26px);font-weight:800;letter-spacing:-.03em;color:var(--ink);padding-left:0;position:relative;padding-bottom:8px}
.tk-sec-hd h2::before{content:none}
.tk-sec-hd h2::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:4px;border-radius:4px;background:var(--grad-brand)}
.tk-sec-hd .tk-more{color:var(--brand-d);font-weight:800}
.tk-sec-sub{color:var(--mut);font-weight:600}

/* 업종 — 라임 아웃라인 블록 */
.tk-cats .tk-cats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;border:0}
.tk-cats-row li a{flex-direction:column;align-items:flex-start;gap:12px;padding:20px 18px;border:1px solid var(--line);border-radius:var(--r-m);background:#fff;box-shadow:var(--sh-1);transition:.16s;min-height:120px}
.tk-cats-row li a:hover{border-color:var(--brand2);transform:translateY(-3px);box-shadow:var(--sh-2)}
.tk-cats-row .tk-cat-ico{width:46px;height:46px;border-radius:11px;background:var(--brand-soft);color:var(--brand-d);display:grid;place-items:center}
.tk-cats-row li a:hover .tk-cat-ico{background:var(--grad-brand);color:#14181A}
.tk-cats-row .tk-cat-ico .tk-i{width:24px;height:24px}
.tk-cats-row .tk-cat-lb{font-weight:800;font-size:16px;letter-spacing:-.02em}
.tk-cats-row .tk-cat-sub{display:block;color:var(--mut);font-size:12.5px;font-weight:600;margin-top:2px}
.tk-cat-near a .tk-cat-ico{background:#EEF0E9;color:var(--ink2)}

/* 카드 */
.tk-card,.tk-scard>a{border:1px solid var(--line);border-radius:var(--r-m);box-shadow:var(--sh-1);background:#fff}
.tk-card:hover,.tk-scard>a:hover{border-color:var(--brand2);box-shadow:var(--sh-2);transform:translateY(-2px)}
.tk-card-area,.tk-scard-area{background:var(--brand-soft);color:var(--brand-d);font-weight:800;border-radius:6px}
.tk-card-t,.tk-scard-t{font-weight:800;color:var(--ink)}
.tk-card-thumb,.tk-scard-th{display:none}
.tk-card-tags i,.tk-scard-tags i{background:var(--wash);color:var(--ink2);border:1px solid var(--line);border-radius:6px;font-weight:600}
.tk-scards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tk-scard{border-bottom:0}
.tk-scard>a{display:block;padding:18px}
.tk-scard>a::before{display:none}
.tk-scard-b{display:block}
.tk-scard-area{display:inline-block;padding:3px 10px;font-size:11.5px;margin-bottom:9px}
.tk-scard-t{display:block;font-size:16px;margin-bottom:8px}
.tk-scard-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.tk-scard-tags i{padding:2px 8px;font-size:11px}
.tk-scard-meta{display:block;color:var(--mut);font-size:12.5px;margin-top:4px}
.tk-scard-rate{display:block;color:var(--brand-d);font-weight:700;margin-top:4px}
.tk-rail-arw{background:#fff;border:1px solid var(--line);color:var(--brand-d)}
.tk-rail-arw:hover{border-color:var(--brand2)}

/* 버튼 */
.tk-btn{border-radius:9px;background:var(--ink);color:var(--brand-lite);border:0;font-weight:800}
.tk-btn:hover{background:#000;transform:translateY(-1px)}
.tk-btn-line{background:#fff!important;border:1.5px solid var(--ink);color:var(--ink)}

/* 혜택·기획전 — 라임/차콜 타일 */
.tk-bene li a,.tk-promo li a{border-radius:var(--r-m);overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:var(--sh-1)}
.tk-bene li a:hover,.tk-promo li a:hover{border-color:var(--brand2);box-shadow:var(--sh-2)}
.tr-tile{aspect-ratio:16/10;width:100%;display:grid;place-items:center;background:var(--grad-brand);color:#14181A}
.tr-tile .tk-i{width:50px;height:50px;stroke-width:1.6}
.tk-bene-img .tk-badge{background:var(--ink);color:var(--brand-lite);font-weight:800}
.tk-bene li strong{font-weight:800}
.tr-ptile{position:absolute;inset:0;display:grid;place-items:center;color:var(--brand-lite)}
.tr-ptile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,24,26,.62))}
.tr-ptile .tk-i{width:44px;height:44px;position:relative;z-index:1}
.tr-pg0,.tr-pg2,.tr-pg4{background:#15181A}
.tr-pg1,.tr-pg3,.tr-pg5{background:#22271A}
.tk-promo-tag{background:var(--brand-lite);color:#14181A;font-weight:800;border-radius:6px}
.tk-promo-tx strong{color:#fff}

/* 지역 블록 */
.tk-regions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tk-regions a{border:1px solid var(--line);border-radius:var(--r-m);justify-content:space-between;padding:16px 16px;background:#fff;font-weight:800;font-size:15px;color:var(--ink);box-shadow:var(--sh-1);transition:.15s}
.tk-regions a .tk-i{color:var(--brand2)}
.tk-regions a:hover{border-color:var(--brand2);color:var(--brand-d);background:var(--brand-soft2);transform:translateY(-2px)}

/* 롱테일 */
.tk-lt-grid{grid-template-columns:repeat(3,1fr);gap:10px}
.tk-lt-grid a{border:1px solid var(--line);border-radius:var(--r-m);display:flex;align-items:center;gap:8px;padding:14px 16px;box-shadow:var(--sh-1);background:#fff;transition:.15s}
.tk-lt-grid a:hover{border-color:var(--brand2);transform:translateY(-2px);box-shadow:var(--sh-2)}
.tk-lt-grid a b{font-weight:800;color:var(--ink)}
.tk-lt-gu{order:2;color:var(--mut);font-weight:600;margin-left:auto;white-space:nowrap;font-size:12.5px}
.tk-lt-grid a .tk-i{color:var(--brand2)}

/* 새 소식 */
.tk-latest-nt li{border:1px solid var(--line);border-radius:var(--r-m);background:#fff;box-shadow:var(--sh-1)}
.tk-latest-nt li:hover{border-color:var(--brand2)}
.tk-nt-new{background:var(--grad-brand);color:#14181A;font-weight:800;border-radius:6px}

/* 푸터 — 차콜(사이드바와 톤 통일) */
.tk-ft{background:var(--side);color:#B9BEB2;border-top:1px solid var(--side-line)}
.tk-ft a{color:#B9BEB2}
.tk-ft a:hover{color:var(--brand-lite)}
.tk-ft-brand p{color:#8A9082}
.tk-ft-policy{color:#727868}
.tk-ft h3{color:#F5F5F4}
.tk-ft-btm,.tk-ft-bottom{border-top:1px solid var(--side-line);color:#6E7464}
.tk-ft-upd{color:#6E7464}

.tk-top{background:var(--ink);border:0;color:var(--brand-lite);box-shadow:var(--sh-3)}
.tk-top:hover{background:#000}

/* 상세 모바일 콜바 */
.tk-callbar{background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(26,26,23,.1)}
.tk-callbar .tk-cb-tel{font-weight:800}
.tk-callbar .tk-cb-area{color:var(--brand-d);background:var(--brand-soft);font-weight:800;border-radius:8px}

/* ══════════ 반응형 ══════════ */
@media(max-width:1200px){.tk-cats .tk-cats-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
  .tk-cats .tk-cats-row{grid-template-columns:repeat(2,1fr)}
  .tk-scards{grid-template-columns:repeat(2,1fr)}
  .tk-regions{grid-template-columns:repeat(3,1fr)}
  .tk-lt-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .tr-hero-in{padding:40px 18px 34px}
  .tr-hero-search{flex-wrap:wrap;padding:8px}
  .tr-hero-search input{width:100%;padding:6px 8px}
  .tr-hero-search button{width:100%;justify-content:center}
  .tk-cats .tk-cats-row{grid-template-columns:1fr}
  .tk-scards{grid-template-columns:1fr}
  .tk-regions{grid-template-columns:repeat(2,1fr)}
  .tk-lt-grid{grid-template-columns:1fr}
}
