/* 잇다펫 홈페이지
   글꼴은 Pretendard 한 가지, 굵기는 400(본문)·600(강조)·700(제목) 세 단계만 씁니다.
   색: 우유빛 바탕 + 로고 코코아 브라운. 테라코타(로고 고양이 귀)는 신입생 표시처럼 작은 곳에만. */
:root{
  --milk:#fbf8f4; --milk2:#f6f1ea; --oat:#efe6db; --oat2:#e2d5c6; --paper:#fff;
  --cocoa:#4b3c35; --cocoa-d:#2f2520; --ink:#2b231f; --ink2:#5d524c; --mute:#8d827b; --line:#e7ded3; --line2:#f0e9e0;
  --ear:#c0764c; --kakao:#fee500; --green:#3f7d5c;
  --wrap:1200px; --hh:72px;
  --font:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,system-ui,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --r-photo:14px; --r-panel:22px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--milk);color:var(--ink);font-family:var(--font);font-size:16px;font-weight:400;line-height:1.7;letter-spacing:-.012em;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.3;letter-spacing:-.035em}
p{margin:0}
b,strong{font-weight:600}
.ic{flex:none;display:block}
:focus-visible{outline:2px solid var(--cocoa);outline-offset:3px;border-radius:6px}
.s-wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 28px}
@media (max-width:600px){.s-wrap{padding:0 18px}}
.s-narrow{max-width:780px}
.s-center{text-align:center}
@media (min-width:1101px){.show-m{display:none!important}}
@media (max-width:1100px){.hide-m{display:none!important}}
.s-skip{position:absolute;left:-9999px}.s-skip:focus{left:12px;top:12px;z-index:999;background:#fff;padding:8px 12px;border-radius:8px}

/* 글자 크기 */
.s-h1{font-size:clamp(30px,4vw,46px)}
.s-h2{font-size:clamp(25px,2.8vw,34px);color:var(--cocoa-d)}
.s-lead{font-size:clamp(15.5px,1.4vw,17px);color:var(--ink2);margin-top:14px;line-height:1.8;max-width:38em}
.s-sub-t{font-size:15.5px;color:var(--ink2);margin-top:10px;max-width:42em}
.s-note{font-size:13px;color:var(--mute);margin-top:12px}
.s-hint{color:var(--mute);font-size:13px;margin-top:6px}
.s-err{color:#b3261e;font-size:13.5px;margin-top:6px}
.s-link{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:15px;color:var(--cocoa);text-decoration:none;white-space:nowrap;border-bottom:1px solid var(--oat2);padding-bottom:2px;transition:border-color .2s}
.s-link:hover{border-color:var(--cocoa)}
.s-more{color:var(--cocoa);font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:4px}
.s-flash{max-width:var(--wrap);margin:16px auto 0;padding:14px 18px;border-radius:12px;background:#e9f5ee;color:#24613f;font-weight:600}
.s-flash.err{background:#fdecea;color:#a3271b}.s-flash.warn{background:#fdf3e2;color:#8a5a00}

/* 버튼 */
.s-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 26px;border-radius:999px;border:1px solid transparent;font-weight:600;font-size:15.5px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .15s;white-space:nowrap}
.s-btn:active{transform:scale(.98)}
.s-btn-sm{height:40px;padding:0 18px;font-size:14px}
.s-btn-block{width:100%}
.s-btn-ink,.s-btn-acc{background:var(--cocoa);color:#fff}
.s-btn-ink:hover,.s-btn-acc:hover{background:var(--cocoa-d)}
.s-btn-line{background:var(--paper);border-color:var(--line);color:var(--ink)}
.s-btn-line:hover{border-color:var(--cocoa)}
.s-btn-milk,.s-btn-light{background:var(--milk);color:var(--cocoa-d)}
.s-btn-milk:hover{background:#fff}
.s-btn-ghost,.s-btn-line-light{border-color:rgba(255,255,255,.5);color:#fff;background:transparent}
.s-btn-ghost:hover,.s-btn-line-light:hover{background:rgba(255,255,255,.12);border-color:#fff}
.s-btn-dark{background:var(--cocoa);color:#fff}
.s-btn[disabled]{opacity:.45;pointer-events:none}

/* 맨 위 띠 */
.s-topbar{display:flex;align-items:center;justify-content:center;gap:6px;height:38px;padding:0 16px;background:var(--cocoa-d);color:#efe4d8;text-decoration:none;font-size:13.5px;white-space:nowrap;overflow:hidden}
.s-topbar b{color:#fff;margin-right:8px}
.s-topbar .ic{opacity:.6;transition:transform .2s}
.s-topbar:hover .ic{transform:translateX(2px)}

/* 헤더 — PC: 큰 로고 가운데 + 아래 메뉴줄(스크롤하면 메뉴줄만 붙음) / 휴대폰: 로고 가운데 */
.s-header{position:sticky;top:-108px;z-index:50;background:var(--milk)}
.s-header-in{height:108px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.s-head-l{display:flex;align-items:center;justify-self:start}
.s-head-r{display:flex;align-items:center;gap:18px;justify-self:end}
.s-logo{justify-self:center;display:block}
.s-logo img{height:88px;width:auto}
.s-sns{display:flex;gap:4px}
.s-sns a{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--cocoa);opacity:.7;transition:opacity .15s,background .15s}
.s-sns a:hover{opacity:1;background:var(--milk2)}
.s-mem{display:flex;gap:14px;font-size:13.5px}
.s-mem a{color:var(--mute);text-decoration:none}.s-mem a:hover{color:var(--ink)}
.s-hicon{width:44px;height:44px;display:grid;place-items:center;color:var(--cocoa-d);margin-left:-10px}
.s-nav{border-top:1px solid var(--line2);border-bottom:1px solid var(--line);background:rgba(251,248,244,.96);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px)}
.s-nav-in{position:relative;height:56px;display:flex;align-items:center;justify-content:center}
.s-menu{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:2px;height:100%}
.s-menu>li{position:relative;display:flex}
.s-menu>li>a{display:flex;align-items:center;padding:0 16px;font-size:15.5px;font-weight:600;color:var(--ink2);text-decoration:none;position:relative;transition:color .15s}
.s-menu>li>a::after{content:"";position:absolute;left:16px;right:16px;bottom:-1px;height:2px;background:var(--cocoa);transform:scaleX(0);transition:transform .25s var(--ease)}
.s-menu>li>a:hover,.s-menu>li.on>a{color:var(--cocoa-d)}
.s-menu>li>a:hover::after,.s-menu>li.on>a::after{transform:scaleX(1)}
.s-sub{list-style:none;margin:0;padding:6px;position:absolute;top:100%;left:50%;min-width:140px;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(47,37,32,.1);opacity:0;visibility:hidden;transform:translate(-50%,-4px);transition:opacity .15s,transform .15s,visibility .15s}
@media (min-width:1101px){.s-menu li.has-sub:hover .s-sub,.s-menu li.has-sub:focus-within .s-sub{opacity:1;visibility:visible;transform:translate(-50%,0)}}
.s-sub-hint{display:none}
.s-sub a{display:block;padding:9px 12px;border-radius:9px;text-decoration:none;font-size:14.5px;color:var(--ink2);white-space:nowrap;text-align:center}
.s-sub a:hover,.s-sub a[aria-current]{background:var(--milk2);color:var(--cocoa-d)}
.s-nav-cta{position:absolute;right:28px;top:50%;transform:translateY(-50%);opacity:0;pointer-events:none;height:36px;padding:0 16px;border-radius:999px;background:var(--cocoa);color:#fff;font-size:13.5px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;transition:opacity .25s}
.s-header.stuck .s-nav-cta{opacity:1;pointer-events:auto}
.s-header.stuck .s-nav{box-shadow:0 6px 22px rgba(47,37,32,.06)}
.s-nav-top,.s-nav-member,.s-nav-quick{display:none}
.s-burger{width:44px;height:44px;border:0;background:none;display:grid;place-items:center;color:var(--cocoa-d);cursor:pointer;margin-right:-10px}
@media (max-width:1240px){.s-menu>li>a{padding:0 11px;font-size:15px}.s-menu>li>a::after{left:11px;right:11px}.s-nav-cta{display:none}}
@media (max-width:1100px){
  :root{--hh:74px}
  .s-header{top:0;border-bottom:1px solid var(--line2)}
  .s-header-in{height:74px}
  .s-logo img{height:58px}
  .s-nav{position:fixed;inset:0 0 0 auto;width:min(340px,86vw);z-index:80;background:var(--milk);border:0;overflow-y:auto;display:none;box-shadow:-20px 0 50px rgba(47,37,32,.14);backdrop-filter:none;-webkit-backdrop-filter:none}
  .s-nav.open{display:block;animation:slideIn .3s var(--ease)}
  .s-nav-in{height:auto;min-height:100%;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:10px 24px calc(28px + env(safe-area-inset-bottom))}
  .s-nav-top{display:flex;align-items:center;justify-content:space-between;height:64px;margin-bottom:8px}
  .s-nav-mark img{height:48px;width:auto}
  .s-nav-x{border:0;background:none;cursor:pointer;color:var(--cocoa-d);width:44px;height:44px;display:grid;place-items:center;margin-right:-10px}
  .s-menu{flex-direction:column;gap:0;height:auto}
  .s-menu>li{display:block;border-bottom:1px solid var(--line2)}
  .s-menu>li>a{padding:16px 0;font-size:18px;font-weight:700;color:var(--cocoa-d)}
  .s-menu>li>a::after{display:none}
  .s-menu>li.on>a{color:var(--ear)}
  /* 하위 메뉴: 버튼이 아니라 들여 쓴 글자 목록 */
  .s-sub{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;background:none;min-width:0;padding:0 0 14px 2px;margin-top:-6px;border-left:2px solid var(--oat2);margin-left:2px}
  .s-sub a{text-align:left;padding:7px 14px;font-size:15px;font-weight:500;color:var(--ink2);border-radius:0;background:none}
  .s-sub a:hover,.s-sub a[aria-current]{background:none;color:var(--cocoa-d);font-weight:600}
  .s-nav-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:24px}
  .s-nav-quick>*{display:flex;align-items:center;justify-content:center;gap:7px;height:50px;border-radius:14px;font-size:14.5px;font-weight:600;text-decoration:none}
  .q-resv{background:var(--cocoa);color:#fff}.q-kakao{background:var(--kakao);color:#191600}
  .s-nav-member{display:flex;gap:18px;justify-content:center;margin-top:28px;font-size:14px}
  .s-nav-member a,.s-nav-member button{color:var(--mute);text-decoration:none;background:none;border:0;padding:0;cursor:pointer;font-size:14px}
  body.nav-open::after{content:"";position:fixed;inset:0;background:rgba(30,22,18,.42);z-index:70;animation:fade .25s}
  body.nav-open .s-header{z-index:90;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@keyframes fade{from{opacity:0}}
@keyframes slideIn{from{transform:translateX(100%)}}

/* 섹션 */
.s-section{padding:104px 0}
.s-section.tight{padding:64px 0}
.s-section.oat,.s-section.cream{background:var(--oat)}
.s-section.milk2{background:var(--milk2)}
.s-section.white,.s-section.paper{background:var(--paper)}
@media (max-width:700px){.s-section{padding:72px 0}.s-section.tight{padding:44px 0}}
.s-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.s-sec-head{margin-bottom:40px}
.s-sec-head.c{text-align:center;display:flex;flex-direction:column;align-items:center}
.s-sec-head.c .s-lead{margin-left:auto;margin-right:auto}
.s-eyebrow{display:none}
.s-orn{display:none}

/* 배경 영상·사진 */
.s-bgv{position:absolute;inset:0;overflow:hidden;background:#2b221e}
.s-bgv img,.s-bgv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s-bgv video{opacity:0;transition:opacity 1.2s ease}
.s-bgv video.on{opacity:1}

/* 홈 첫 화면 */
.s-hero{position:relative;min-height:min(88vh,860px);display:flex;flex-direction:column;color:#fff;isolation:isolate;overflow:hidden}
.s-hero .s-bgv::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,20,16,.62),rgba(28,20,16,.18) 62%,rgba(28,20,16,.05)),linear-gradient(0deg,rgba(28,20,16,.55),transparent 38%);z-index:1}
.s-hero-in{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:center;padding-top:60px;padding-bottom:60px}
.s-hero h1{font-size:clamp(34px,5vw,62px);line-height:1.22;letter-spacing:-.045em;max-width:13em}
.s-line{width:min(420px,78vw);height:40px;margin:18px 0 6px;overflow:visible}
.s-line path{fill:none;stroke:#f3e6d8;stroke-width:2;stroke-linecap:round;stroke-dasharray:640;stroke-dashoffset:640;animation:draw 2.4s var(--ease) .4s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.s-hero-in>p{font-size:clamp(16px,1.5vw,18.5px);color:rgba(255,255,255,.9);max-width:30em;line-height:1.75}
.s-hero-btns{display:flex;gap:10px;margin-top:34px;flex-wrap:wrap}
.s-hero-rail{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.22)}
.s-hero-rail .s-wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.s-hero-rail .s-wrap>div{padding:22px 24px 26px 0;display:flex;flex-direction:column;gap:2px}
.s-hero-rail .s-wrap>div+div{padding-left:24px;border-left:1px solid rgba(255,255,255,.22)}
.s-hero-rail b{font-size:16px}
.s-hero-rail span{font-size:14px;color:rgba(255,255,255,.75)}
@media (max-width:800px){
  .s-hero{min-height:calc(100svh - 100px)}
  .s-hero .s-bgv::after{background:linear-gradient(0deg,rgba(28,20,16,.78),rgba(28,20,16,.25) 60%,rgba(28,20,16,.2))}
  .s-hero-in{justify-content:flex-end;padding-bottom:28px}
  .s-hero-btns .s-btn{flex:1;padding:0 16px;height:50px;font-size:15px}
  .s-hero-rail .s-wrap{grid-template-columns:1fr 1fr 1fr;padding:0}
  .s-hero-rail .s-wrap>div{padding:14px 12px 18px 18px}
  .s-hero-rail .s-wrap>div+div{padding-left:12px}
  .s-hero-rail b{font-size:13.5px}
  .s-hero-rail span{display:none}
}
/* 브랜드 페이지 첫 화면 */
.s-hero.about{min-height:min(76vh,720px)}
.s-hero.about .s-bgv::after{background:linear-gradient(0deg,rgba(28,20,16,.7),rgba(28,20,16,.25))}
.s-hero.about .s-hero-in{justify-content:flex-end;padding-bottom:72px}

/* 서브페이지 머리 (글자만) */
.s-page-head{padding:64px 0 40px;background:var(--milk)}
.s-page-head-in{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.s-page-head h1{font-size:clamp(30px,3.6vw,44px);color:var(--cocoa-d);letter-spacing:-.045em}
.s-page-head p{font-size:16px;color:var(--ink2);margin-top:12px;max-width:40em}
.s-page-head-x{display:flex;gap:10px;align-items:center}
@media (max-width:700px){.s-page-head{padding:40px 0 26px}.s-page-head p{font-size:15px}}
.s-count{font-size:14px;color:var(--mute)}
.s-count b{font-size:28px;color:var(--cocoa-d);font-weight:700;margin-right:2px;font-variant-numeric:tabular-nums;letter-spacing:-.03em}

/* 목록 위 거르기 */
.s-filterbar{position:sticky;top:var(--hh);z-index:30;background:rgba(251,248,244,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin-bottom:32px}
.s-filterbar .s-wrap{display:flex;align-items:center;gap:14px;min-height:62px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
.s-fgroup{display:flex;gap:6px;flex-wrap:wrap}
.s-chip{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 15px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-size:14px;font-weight:600;color:var(--ink2);text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.s-chip:hover{border-color:var(--cocoa)}
.s-chip.on{background:var(--cocoa);border-color:var(--cocoa);color:#fff}
.s-chip small{font-weight:500;opacity:.7}
.s-chip.new.on{background:var(--ear);border-color:var(--ear)}
.s-fsel{height:38px;border-radius:999px;border:1px solid var(--line);background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234b3c35' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 12px center/14px no-repeat;padding:0 34px 0 15px;font-size:14px;font-weight:600;color:var(--ink2);appearance:none;-webkit-appearance:none;cursor:pointer;max-width:200px}
.s-fsel.on{border-color:var(--cocoa);color:var(--cocoa-d)}
.s-fsep{width:1px;height:22px;background:var(--line)}
.s-filterbar .s-fright{margin-left:auto}
@media (max-width:700px){
  .s-filterbar .s-wrap{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:8px;min-height:56px}
  .s-filterbar .s-wrap::-webkit-scrollbar{display:none}
  .s-fgroup{flex-wrap:nowrap}
  .s-filterbar .s-fright{margin-left:0}
  .s-chip,.s-fsel{height:36px;font-size:13.5px;flex:none}
}
.s-filter{display:flex;justify-content:center;gap:4px;margin:0 0 44px;border-bottom:1px solid var(--line)}
.s-filter a{position:relative;display:inline-flex;align-items:center;height:54px;padding:0 22px;font-size:17px;font-weight:600;text-decoration:none;color:var(--mute)}
.s-filter a:hover{color:var(--ink)}
.s-filter a.on{color:var(--cocoa-d);font-weight:700}
.s-filter a.on::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--cocoa-d)}
@media (max-width:600px){.s-filter{margin-bottom:32px}.s-filter a{flex:1;justify-content:center;padding:0 8px;font-size:16px}}

/* 탭 */
.s-tabs{display:inline-flex;gap:2px;padding:4px;background:var(--milk2);border-radius:999px}
.s-tabs button,.s-tabs a{border:0;background:none;padding:9px 20px;border-radius:999px;font-weight:600;font-size:15px;color:var(--mute);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.s-tabs small{font-size:12.5px;font-weight:500;opacity:.8}
.s-tabs .on{background:var(--paper);color:var(--cocoa-d);box-shadow:0 1px 3px rgba(47,37,32,.12)}

/* 입양 카드 */
.s-pets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 20px}
@media (max-width:1000px){.s-pets{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.s-pets{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 10px}}
.s-pet{display:block;text-decoration:none;color:inherit}
.s-pet-ph{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--r-photo);overflow:hidden;background:var(--oat)}
.s-pet-ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.s-pet:hover .s-pet-ph img{transform:scale(1.04)}
.s-pet-t{display:block;padding:12px 2px 0}
.s-pet-t b{display:block;font-size:17px;font-weight:700;color:var(--cocoa-d);letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-pet-t small{display:block;color:var(--mute);font-size:13.5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-tag{position:absolute;left:10px;top:10px;font-style:normal;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--paper);color:var(--cocoa-d)}
.s-tag.new{background:var(--ear);color:#fff}
.s-tag.sp{background:var(--cocoa-d);color:#f3e1c7}
.s-badge{display:none}
@media (max-width:640px){.s-pet-t b{font-size:15.5px}.s-pet-t small{font-size:12.5px}.s-tag{font-size:11px;padding:3px 8px;left:8px;top:8px}}
.s-empty{padding:56px 24px;text-align:center;color:var(--mute);background:var(--paper);border:1px dashed var(--oat2);border-radius:var(--r-panel)}
.s-more-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:44px;flex-wrap:wrap}
.s-kakao-note{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2);text-decoration:none}
.s-kakao-note .ic{color:#3c1e1e;background:var(--kakao);border-radius:50%;padding:3px;width:26px;height:26px}
.s-kakao-note:hover{color:var(--ink)}
@media (max-width:640px){.s-more-row{flex-direction:column;align-items:stretch}.s-more-row .s-btn{width:100%}}
.s-kbanner{display:none}

/* 홈: 2년 케어 */
.s-care{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:72px;align-items:start}
.s-care-t .s-link{margin-top:24px}
.s-care-list{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.s-care-list>div{padding:22px 0;border-top:1px solid var(--oat2)}
.s-care-list dt{font-size:19px;font-weight:700;color:var(--cocoa-d);letter-spacing:-.03em}
.s-care-list dd{margin:6px 0 0;font-size:15px;color:var(--ink2);line-height:1.7}
@media (max-width:900px){.s-care{grid-template-columns:1fr;gap:28px}.s-care-list{grid-template-columns:1fr}}

/* 홈: 멤버십 계산 */
.s-member{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
@media (max-width:900px){.s-member{grid-template-columns:1fr;gap:36px}}
.mc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-panel);padding:28px}
.mc-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;background:var(--milk2);border-radius:14px}
.mc-seg button{border:0;background:none;height:42px;border-radius:10px;font-size:14px;font-weight:700;letter-spacing:.06em;color:var(--mute);cursor:pointer;transition:background .2s,color .2s}
.mc-seg button.on{color:#fff}
.mc-seg .g-black.on{background:#2a221e}.mc-seg .g-purple.on{background:#5b3f7a}.mc-seg .g-red.on{background:#a8443a}
.mc-total{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:26px 0 18px;padding-bottom:18px;border-bottom:1px solid var(--line2)}
.mc-total span{font-size:15px;color:var(--ink2)}
.mc-total b{font-size:clamp(30px,3.4vw,40px);font-weight:700;letter-spacing:-.04em;color:var(--cocoa-d);font-variant-numeric:tabular-nums}
.mc-bars{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.mc-bars li{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:14px;font-size:14px}
.mc-bars span{color:var(--ink2)}
.mc-bars i{display:block;height:8px;border-radius:99px;background:var(--milk2);position:relative;overflow:hidden}
.mc-bars i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:99px;background:var(--gc,#2a221e);transition:width .6s var(--ease)}
.mc-panel.g-purple{--gc:#5b3f7a}.mc-panel.g-red{--gc:#a8443a}
.mc-bars b{font-variant-numeric:tabular-nums;color:var(--ink);min-width:96px;text-align:right}
@media (max-width:520px){.mc{padding:18px}.mc-bars li{grid-template-columns:54px 1fr auto;gap:10px;font-size:13px}.mc-bars b{min-width:84px}}
.s-member-v p{font-size:14px;color:var(--mute);margin-top:12px}
.s-yt{position:relative;display:block;width:100%;padding:0;border:0;border-radius:var(--r-photo);overflow:hidden;aspect-ratio:16/9;background:#000;cursor:pointer}
.s-yt img{width:100%;height:100%;object-fit:cover;transition:filter .3s}
.s-yt:hover img{filter:brightness(.9)}
.s-yt-play{position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(251,248,244,.94);color:var(--cocoa-d);display:grid;place-items:center;padding-left:4px;transition:transform .2s var(--ease)}
.s-yt:hover .s-yt-play{transform:scale(1.06)}
.s-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* 근황 이야기 */
.s-stories{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(300px,1fr);gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin;scrollbar-color:var(--oat2) transparent}
@media (min-width:1101px){.s-stories{grid-auto-columns:calc((100% - 44px)/3)}}
.s-story{scroll-snap-align:start;background:var(--paper);border-radius:var(--r-panel);overflow:hidden;display:flex;flex-direction:column}
.s-story .ph{display:grid;grid-template-columns:1fr 1fr;gap:3px;aspect-ratio:4/3}
.s-story .ph img{width:100%;height:100%;object-fit:cover}
.s-story h3{font-size:18px;color:var(--cocoa-d);padding:22px 24px 0;line-height:1.45}
.s-story .meta{font-size:13.5px;color:var(--ear);font-weight:600;padding:8px 24px 0}
.s-story .body{font-size:14.5px;color:var(--ink2);line-height:1.8;padding:12px 24px 26px;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.s-stories.full{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;gap:24px}
.s-stories.full .s-story .body{-webkit-line-clamp:unset;display:block}
@media (max-width:900px){.s-stories.full{grid-template-columns:1fr}}
@media (max-width:600px){.s-stories{grid-auto-columns:84%}}
.s-rv-strip{display:flex;align-items:center;gap:12px;margin-top:36px;padding:18px 22px;border-radius:16px;background:var(--paper)}
.s-rv-strip p{flex:1;font-size:15px;color:var(--ink2)}
.s-rv-strip p b{color:var(--cocoa-d);font-size:17px}
.n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;background:#03c75a;color:#fff;font-weight:800;font-size:13px;flex:none}

/* 후기 */
.s-reviews{columns:3;column-gap:16px}
@media (max-width:900px){.s-reviews{columns:2}}
@media (max-width:600px){.s-reviews{columns:1}}
.s-rv{break-inside:avoid;background:var(--paper);border:1px solid var(--line2);border-radius:18px;padding:18px 18px 14px;margin:0 0 16px}
.s-rv-ph{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin:-4px -4px 14px;border-radius:12px;overflow:hidden}
.s-rv-ph[data-n="1"]{grid-template-columns:1fr}.s-rv-ph[data-n="2"]{grid-template-columns:1fr 1fr}
.s-rv-ph img{width:100%;height:140px;object-fit:cover}
.s-rv-ph[data-n="1"] img{height:220px}
.s-rv p{font-size:15px;line-height:1.8;color:var(--ink2)}
.s-rv.clamp p{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.s-rv-m{display:flex;justify-content:space-between;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line2);font-size:13px;color:var(--mute)}
.s-rv-m b{color:var(--cocoa);font-weight:600}
.s-rv-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.s-rv-head h2{display:flex;align-items:center;gap:10px}
.s-rv-head p{color:var(--mute);font-size:14px;margin-top:6px}
.s-rv-more{display:flex;justify-content:center;margin-top:16px}

/* 지점 */
.s-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media (max-width:900px){.s-branches{grid-template-columns:1fr}}
.s-branch{background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);overflow:hidden;display:flex;flex-direction:column}
.s-branch-ph{aspect-ratio:16/10;background:var(--oat) center/cover}
.s-branch-b{padding:22px 22px 24px;display:flex;flex-direction:column;gap:12px;flex:1}
.s-branch-b h3{font-size:21px;color:var(--cocoa-d);display:flex;align-items:center;gap:8px}
.s-branch-b h3 em{font-style:normal;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--milk2);color:var(--ear)}
.s-branch-b dl{display:grid;grid-template-columns:42px 1fr;gap:6px 10px;margin:0;font-size:14.5px}
.s-branch-b dt{color:var(--mute)}.s-branch-b dd{margin:0}
.s-branch-b dd a{color:var(--cocoa-d);font-weight:600;text-decoration:none}
.s-branch-b .btns{display:flex;gap:8px;margin-top:auto;padding-top:6px}
.s-branch-b .btns .s-btn{flex:1;height:44px;padding:0 12px;font-size:14px}
.s-hours{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;font-size:11.5px;text-align:center}
.s-hours span{background:var(--milk);border-radius:8px;padding:6px 1px;line-height:1.35;color:var(--ink2)}
.s-hours span b{display:block;font-size:12px;color:var(--ink)}
.s-hours span.today{background:var(--cocoa);color:#fff}.s-hours span.today b{color:#fff}
.s-hours span.off{color:var(--mute)}

/* 글 목록 (품종·이벤트) */
.s-posts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px}
@media (max-width:1000px){.s-posts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.s-posts{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 10px}}
.s-posts.wide{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}
@media (max-width:800px){.s-posts.wide{grid-template-columns:1fr}}
.s-post{display:block;text-decoration:none;color:inherit}
.s-post-ph{position:relative;aspect-ratio:1/1;background:var(--oat);overflow:hidden;border-radius:var(--r-photo)}
.s-post-ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.s-post:hover .s-post-ph img{transform:scale(1.04)}
.s-post-b{padding:12px 2px 0}
.s-post-b b{display:block;font-size:16.5px;font-weight:700;color:var(--cocoa-d);letter-spacing:-.03em}
.s-post-b p{color:var(--ink2);font-size:14px;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s-post-b small{display:block;color:var(--mute);font-size:13px;margin-top:6px}
.s-pager{display:flex;justify-content:center;gap:6px;margin-top:56px;flex-wrap:wrap}
.s-pager a,.s-pager span{min-width:42px;height:42px;display:grid;place-items:center;border-radius:12px;text-decoration:none;font-weight:600;font-size:14.5px;color:var(--ink2);background:var(--paper);border:1px solid var(--line2)}
.s-pager .on{background:var(--cocoa);color:#fff;border-color:var(--cocoa)}

/* 글 보기 */
.s-article{max-width:860px;margin:0 auto}
.s-article-head{margin-bottom:32px}
.s-article-head .crumb{font-size:14px;color:var(--mute)}
.s-article-head .crumb a{text-decoration:none;color:var(--mute)}
.s-article-head h1{font-size:clamp(28px,3.6vw,40px);color:var(--cocoa-d);margin-top:8px}
.s-article-head .meta{color:var(--mute);font-size:14px;margin-top:10px}
.s-prose{font-size:16.5px;line-height:1.9;color:var(--ink2)}
.s-prose img{max-width:100%!important;height:auto!important;border-radius:var(--r-photo);margin:14px auto}
.s-prose p{margin:0 0 4px}
.s-prose h1,.s-prose h2,.s-prose h3,.s-prose h4,.s-prose h5,.s-prose h6{color:var(--cocoa-d);font-size:21px;font-weight:700;margin:44px 0 12px;line-height:1.45}
.s-prose iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--r-photo);margin:14px 0}
.s-prose a{color:var(--cocoa);text-decoration:underline;text-underline-offset:3px}
.s-prose table{border-collapse:collapse;width:100%;margin:16px 0;font-size:14.5px}
.s-prose td,.s-prose th{border:1px solid var(--line);padding:8px 10px}
.s-petinfo{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:0 0 20px}
.s-petinfo>div{background:var(--paper);padding:16px 18px}
.s-petinfo span{display:block;font-size:12.5px;color:var(--mute)}
.s-petinfo b{display:block;font-size:16px;margin-top:2px;color:var(--cocoa-d)}
@media (max-width:640px){.s-petinfo{grid-template-columns:1fr 1fr}}
.s-feature{background:var(--milk2);border-radius:16px;padding:22px 24px;margin-bottom:28px;font-size:16px;line-height:1.85;color:var(--ink2)}
.s-feature b{display:block;color:var(--cocoa-d);font-size:14px;margin-bottom:6px}
.s-article-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:44px 0 0;padding:30px;background:var(--oat);border-radius:var(--r-panel);text-align:center}
.s-article-cta p{width:100%;color:var(--cocoa-d);font-size:17px;font-weight:600;margin-bottom:6px}
.s-article-nav{display:flex;justify-content:space-between;gap:12px;margin-top:30px;font-size:14.5px}
.s-article-nav a{flex:1;padding:16px 18px;background:var(--paper);border:1px solid var(--line2);border-radius:14px;text-decoration:none;color:var(--ink2)}
.s-article-nav a small{display:block;color:var(--mute);font-size:12px}
.s-article-nav a.next{text-align:right}
.s-related{margin-top:72px}

/* 하단 예약 (영상) */
.s-cta{position:relative;color:#fff;padding:120px 0;overflow:hidden;isolation:isolate}
.s-cta .s-bgv::after,.s-band .s-bgv::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,20,16,.7),rgba(28,20,16,.3));z-index:1}
.s-cta-in,.s-band-in{position:relative;z-index:2}
.s-cta h2{font-size:clamp(30px,3.8vw,48px);letter-spacing:-.045em;line-height:1.25}
.s-cta p{color:rgba(255,255,255,.85);max-width:30em;margin-top:16px;font-size:16px}
.s-cta-btns{display:flex;gap:10px;margin-top:32px;flex-wrap:wrap}
@media (max-width:700px){.s-cta{padding:84px 0}.s-cta .s-bgv::after{background:rgba(28,20,16,.58)}.s-cta-btns .s-btn{width:100%}}

/* 사진 배경 띠 (브랜드) */
.s-band{position:relative;color:#fff;padding:110px 0;overflow:hidden;isolation:isolate}
.s-band h2{font-size:clamp(28px,3.4vw,40px);letter-spacing:-.04em}
.s-promise-list{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px;max-width:560px}
.s-promise-list li{display:flex;gap:12px;align-items:flex-start;font-size:16.5px;line-height:1.6}
.s-promise-list li::before{content:"";flex:none;width:18px;height:18px;margin-top:4px;border-radius:50%;background:rgba(255,255,255,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat}
@media (max-width:700px){.s-band{padding:80px 0}.s-promise-list li{font-size:15px}}

/* 푸터 */
.s-footer{background:var(--milk2);color:var(--ink2);padding:56px 0 48px;font-size:13.5px}
.s-foot-top{display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:start;padding-bottom:30px;border-bottom:1px solid var(--line)}
.s-foot-logo img{height:64px;width:auto}
.s-foot-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.s-foot-b{display:flex;flex-direction:column;gap:2px}
.s-foot-b b{font-size:15px;color:var(--cocoa-d)}
.s-foot-b b em{font-style:normal;font-size:12px;font-weight:600;color:var(--ear);margin-left:4px}
.s-foot-b .tel{font-size:16px;font-weight:700;color:var(--cocoa-d);text-decoration:none;font-variant-numeric:tabular-nums}
.s-foot-b span{color:var(--mute);font-size:13px}
.s-foot-sns{display:flex;gap:8px}
.s-foot-sns a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--cocoa);background:var(--paper);border:1px solid var(--line);transition:background .2s,color .2s}
.s-foot-sns a:hover{background:var(--cocoa);color:#fff}
.s-foot-nav{display:flex;flex-wrap:wrap;gap:6px 22px;padding:22px 0;border-bottom:1px solid var(--line)}
.s-foot-nav a{color:var(--ink2);text-decoration:none;font-weight:600;font-size:14px}
.s-foot-nav a:hover{color:var(--ink)}
.s-foot-biz{margin-top:22px;line-height:1.95;color:var(--mute);font-size:12.5px}
.s-foot-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;font-size:13px}
.s-foot-links a{color:var(--ink2);text-decoration:none}
.s-foot-links span{margin-left:auto;color:var(--mute)}
@media (max-width:900px){.s-foot-top{grid-template-columns:1fr;gap:24px}.s-foot-branches{grid-template-columns:1fr;gap:14px}.s-footer{padding-bottom:110px}}

/* 떠 있는 소식 (PC) — 오늘의 아이·NOW·인연 찾기·이벤트를 메시지처럼 하나씩 */
.talk{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.talk-card{position:relative;width:330px;background:var(--paper);border:1px solid var(--line);border-radius:20px 20px 6px 20px;box-shadow:0 18px 50px rgba(47,37,32,.18);opacity:0;transform:translateY(12px) scale(.97);transform-origin:100% 100%;pointer-events:none;transition:opacity .3s,transform .35s var(--ease)}
.talk.open .talk-card{opacity:1;transform:none;pointer-events:auto}
.talk-a{display:flex;align-items:center;gap:12px;padding:12px 14px 12px 12px;text-decoration:none;color:var(--ink)}
.talk-ph{flex:none;width:64px;height:64px;border-radius:14px;overflow:hidden;background:var(--oat)}
.talk-ph img{width:100%;height:100%;object-fit:cover}
.talk-b{flex:1;min-width:0;padding-right:14px}
.talk-l{display:inline-block;font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--ear);margin-bottom:2px}
[data-k="now"] .talk-l{color:#c2392c}[data-k="now"] .talk-l::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#e2493b;margin-right:5px;vertical-align:1px;animation:nwLive 2s infinite}
.talk-t{display:block;font-size:15px;font-weight:700;color:var(--cocoa-d);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.talk-s{display:block;font-size:13px;color:var(--mute);line-height:1.45;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.talk-go{flex:none;width:30px;height:30px;border-radius:50%;background:var(--milk2);display:grid;place-items:center;color:var(--cocoa)}
.talk-a:hover .talk-go{background:var(--cocoa);color:#fff}
.talk-x{position:absolute;top:-9px;left:-9px;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--mute);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.talk-x:hover{color:var(--ink)}
.talk-dock{display:flex;align-items:center;gap:10px}
.talk-fab{position:relative;width:58px;height:58px;border-radius:50%;border:1px solid var(--line);background:var(--paper);box-shadow:0 10px 30px rgba(47,37,32,.18);cursor:pointer;padding:9px;transition:transform .2s var(--ease)}
.talk-fab:hover{transform:translateY(-2px)}
.talk-fab img{width:100%;height:100%;object-fit:contain}
.talk-badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:99px;background:var(--ear);color:#fff;font-style:normal;font-size:11.5px;font-weight:700;display:grid;place-items:center;padding:0 5px;transform:scale(0);transition:transform .25s var(--ease)}
.talk.unread .talk-badge{transform:scale(1)}
.talk.unread .talk-fab{animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{0%,80%,100%{transform:none}85%{transform:rotate(-8deg)}90%{transform:rotate(7deg)}95%{transform:rotate(-4deg)}}
.talk-top{width:42px;height:42px;border-radius:50%;background:var(--paper);border:1px solid var(--line);display:grid;place-items:center;color:var(--cocoa-d);box-shadow:0 6px 18px rgba(47,37,32,.1);opacity:0;pointer-events:none;transition:opacity .25s}
.talk.scrolled .talk-top{opacity:1;pointer-events:auto}

/* 휴대폰 아래 떠 있는 바 — 카톡 상담을 조금 크게(문의 비중 최다), 예약·전화도 글자와 함께, 찜이 있으면 하트 칩 */
.mcb{display:none}
@media (max-width:800px){
  .talk{display:none}
  .mcb{display:block;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;padding:6px;border-radius:22px;background:rgba(47,37,32,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 14px 34px rgba(47,37,32,.3),0 0 0 1px rgba(255,255,255,.06) inset}
  .mcb-in{display:flex;align-items:stretch;gap:6px}
  .mcb-main{flex:1.5;min-width:0;height:50px;border-radius:17px;background:var(--kakao);color:#1d1600;display:flex;align-items:center;justify-content:center;gap:7px;font-size:15px;font-weight:800;letter-spacing:-.02em;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .mcb-ic{flex:1;min-width:0;height:50px;border:0;border-radius:17px;background:rgba(255,255,255,.1);color:#f6efe7;display:flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:14.5px;font-weight:700;letter-spacing:-.02em;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mcb-resv .ic{color:#f0b48f}
  .mcb-lk{flex:none;width:46px;height:50px;border-radius:17px;background:rgba(255,255,255,.08);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:12px;font-weight:800;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .mcb-lk .ic{color:var(--ear)}.mcb-lk .ic path{fill:currentColor}
  .mcb-lk[hidden]{display:none}
  .mcb-main:active,.mcb-ic:active,.mcb-lk:active{transform:scale(.96)}
  .mcb-toast{position:absolute;left:12px;right:86px;bottom:calc(100% + 8px);background:var(--paper);border:1px solid var(--line);border-radius:16px 16px 16px 6px;box-shadow:0 10px 30px rgba(47,37,32,.2);animation:toastIn .35s var(--ease)}
  .mcb-toast .talk-a{padding:8px 30px 8px 8px;gap:10px}
  .mcb-toast .talk-ph{width:52px;height:52px;border-radius:12px}
  .mcb-toast .talk-b{padding:0}
  .mcb-toast .talk-t{font-size:14px}
  .mcb-toast .talk-s{font-size:12px;-webkit-line-clamp:1}
  .mcb-toast-x{position:absolute;top:6px;right:6px;width:22px;height:22px;border:0;border-radius:50%;background:var(--milk2);color:var(--mute);display:grid;place-items:center}
  body.resv-page .mcb,body.match-page .mcb{display:none}
}
@keyframes toastIn{from{opacity:0;transform:translateY(10px) scale(.96)}}

/* 지점 전화 선택 */
.s-sheet{border:0;border-radius:24px;padding:0;width:min(380px,calc(100vw - 32px));background:var(--milk);box-shadow:0 30px 80px rgba(30,22,18,.3)}
.s-sheet[open]{animation:up .25s var(--ease)}
@keyframes up{from{transform:translateY(14px);opacity:0}}
.s-sheet::backdrop{background:rgba(30,22,18,.5)}
.s-sheet-in{padding:24px 18px 14px;display:flex;flex-direction:column;gap:8px}
.s-sheet-t{font-size:17px;font-weight:700;color:var(--cocoa-d);text-align:center;margin-bottom:8px}
.s-sheet-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:var(--paper);border:1px solid var(--line2);text-decoration:none;color:var(--cocoa-d)}
.s-sheet-row:hover{border-color:var(--cocoa)}
.s-sheet-row>span:nth-child(2){flex:1}
.s-sheet-row .ic-box{width:40px;height:40px;border-radius:12px;background:var(--cocoa);color:#fff;display:grid;place-items:center;flex:none}
.s-sheet-row b{display:block;font-size:15.5px;line-height:1.2}
.s-sheet-row small{display:block;font-size:13.5px;color:var(--mute);margin-top:3px;font-variant-numeric:tabular-nums}
.s-sheet-row>.ic{color:var(--oat2)}
.s-sheet-st{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;color:var(--mute);margin-top:8px}
.s-sheet-st.on{color:var(--green)}
.s-sheet-x{margin-top:4px;width:100%;padding:12px;border:0;border-radius:12px;background:transparent;font-size:14.5px;font-weight:600;color:var(--mute);cursor:pointer}

/* 폼 */
.s-form{background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);padding:34px}
@media (max-width:600px){.s-form{padding:22px 18px;border-radius:18px}}
.s-field{margin-bottom:18px}
.s-field>label,.s-label{display:block;font-weight:600;font-size:14.5px;margin-bottom:8px}
.s-field>label small,.s-label small{font-weight:400;color:var(--mute);margin-left:4px}
.s-input,.s-form input[type=text],.s-form input[type=email],.s-form input[type=tel],.s-form input[type=password],.s-form input[type=date],.s-form select,.s-form textarea{width:100%;height:52px;padding:0 16px;border:1px solid var(--line);border-radius:14px;background:var(--paper);font-size:16px;transition:border-color .15s,box-shadow .15s}
.s-form textarea{height:auto;min-height:100px;padding:14px 16px;line-height:1.6;resize:vertical}
.s-form input:focus,.s-form select:focus,.s-form textarea:focus,.s-input:focus{outline:0;border-color:var(--cocoa);box-shadow:0 0 0 4px rgba(75,60,53,.1)}
.s-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.s-row2{grid-template-columns:1fr}}
.s-chips{display:flex;flex-wrap:wrap;gap:8px}
.s-chips label{margin:0;cursor:pointer}
.s-chips input{position:absolute;opacity:0;pointer-events:none}
.s-chips span{display:inline-flex;align-items:center;height:44px;padding:0 18px;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-weight:600;font-size:15px;transition:all .15s}
.s-chips input:checked+span{background:var(--cocoa);border-color:var(--cocoa);color:#fff}
.s-chips input:focus-visible+span{box-shadow:0 0 0 3px rgba(75,60,53,.25)}
.s-chips input:disabled+span{opacity:.35}
.s-check{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;cursor:pointer;margin:10px 0}
.s-check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--cocoa);flex:none}
.s-check a{color:var(--mute)}

/* 방문 예약 */
.s-resv{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
@media (max-width:980px){.s-resv{grid-template-columns:minmax(0,1fr)}}
.s-step{border-top:1px solid var(--line2);padding-top:26px;margin-top:26px}
.s-step:first-child{border-top:0;padding-top:0;margin-top:0}
.s-step h3{font-size:18px;color:var(--cocoa-d);margin-bottom:14px;display:flex;align-items:center;gap:10px}
.s-step h3 i{font-style:normal;width:24px;height:24px;border-radius:50%;background:var(--cocoa);color:#fff;font-size:12.5px;font-weight:700;display:grid;place-items:center}
.s-step h3 small{font-size:13px;font-weight:400;color:var(--mute)}
.s-days{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none;scroll-snap-type:x proximity}
.s-days::-webkit-scrollbar{display:none}
.s-days label{margin:0;flex:none;scroll-snap-align:start}
.s-days input{position:absolute;opacity:0;pointer-events:none}
.s-days span{display:flex;flex-direction:column;align-items:center;justify-content:center;width:62px;height:72px;border:1px solid var(--line);border-radius:16px;background:var(--paper);cursor:pointer;line-height:1.15;transition:all .12s}
.s-days span small{font-size:12px;color:var(--mute)}
.s-days span b{font-size:20px;font-weight:700;margin-top:4px;font-variant-numeric:tabular-nums}
.s-days span em{font-style:normal;font-size:11px;color:var(--ear);margin-top:2px;font-weight:600}
.s-days input:checked+span{background:var(--cocoa);border-color:var(--cocoa);color:#fff}
.s-days input:checked+span small,.s-days input:checked+span em{color:rgba(255,255,255,.8)}
.s-days input:disabled+span{opacity:.35;cursor:default;border-style:dashed}
.s-days input:focus-visible+span{box-shadow:0 0 0 3px rgba(75,60,53,.25)}
.s-times{display:grid;gap:14px}
.s-times>div>p{font-size:13px;color:var(--mute);margin-bottom:8px}
.s-times .s-chips span{height:42px;padding:0 16px;font-variant-numeric:tabular-nums;font-size:14.5px}
.s-resv-side{position:sticky;top:calc(var(--hh) + 20px);background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);padding:24px}
.s-resv-side h3{font-size:17px;color:var(--cocoa-d);margin-bottom:14px}
.s-resv-sum{display:grid;grid-template-columns:56px 1fr;gap:10px 12px;font-size:15px;margin:0 0 18px}
.s-resv-sum dt{color:var(--mute)}.s-resv-sum dd{margin:0;font-weight:600}
.s-resv-side ul{margin:16px 0 0;padding:16px 0 0 18px;border-top:1px solid var(--line2);color:var(--mute);font-size:13.5px;line-height:1.8}
@media (max-width:980px){.s-resv-side{position:static}}
@media (max-width:800px){body.resv-page .s-footer{padding-bottom:40px}}
.s-done{text-align:center;padding:50px 30px}
.s-done .ic{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;background:#e9f5ee;color:var(--green);display:grid;place-items:center;font-size:34px}

/* 혜택 페이지 */
.s-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--paper);border:1px solid var(--line2);border-radius:18px;overflow:hidden;font-size:15px}
.s-table th,.s-table td{padding:15px 14px;text-align:center;border-bottom:1px solid var(--line2)}
.s-table thead th{background:var(--milk2);font-size:13.5px;font-weight:600;color:var(--ink2)}
.s-table tbody tr:last-child td{border-bottom:0}
.s-table td.l,.s-table th.l{text-align:left}
.s-table .num{font-variant-numeric:tabular-nums}
.s-table .tot{font-weight:700;color:var(--cocoa-d);font-size:16px}
.s-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.s-g{display:inline-flex;align-items:center;justify-content:center;min-width:72px;height:30px;border-radius:999px;font-size:12.5px;font-weight:700;color:#fff;letter-spacing:.06em}
.s-g.black{background:#2a221e}.s-g.purple{background:#5b3f7a}.s-g.red{background:#a8443a}
.s-benefit{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;padding:56px 0;border-top:1px solid var(--line)}
.s-benefit:first-of-type{border-top:0}
.s-benefit .no{font-size:14px;color:var(--mute)}
.s-benefit .no b{display:block;font-size:15px;color:var(--ear);margin-bottom:6px}
.s-benefit h3{font-size:clamp(22px,2.4vw,28px);color:var(--cocoa-d);margin-bottom:12px}
.s-benefit p.d{color:var(--ink2);font-size:16px;line-height:1.8;margin-bottom:22px;max-width:40em}
@media (max-width:700px){.s-benefit{grid-template-columns:1fr;gap:10px;padding:40px 0}}
.s-gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.s-gal.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.s-gal img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;background:var(--oat)}
.s-gal figure{margin:0}
.s-gal figcaption{font-size:13.5px;text-align:center;margin-top:8px;color:var(--ink2)}
@media (max-width:700px){.s-gal,.s-gal.c3{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}}
.s-gal a{display:block;border-radius:10px;overflow:hidden}
.s-gal.mason{display:block;columns:4;column-gap:10px}
.s-gal.mason a{break-inside:avoid;margin:0 0 10px}
.s-gal.mason img{aspect-ratio:auto;height:auto}
@media (max-width:700px){.s-gal.mason{columns:2;column-gap:6px}.s-gal.mason a{margin-bottom:6px}}
.s-goods{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.s-goods figure{margin:0;background:var(--paper);border:1px solid var(--line2);border-radius:14px;padding:10px}
.s-goods img{width:100%;aspect-ratio:1/1;object-fit:contain}
@media (max-width:800px){.s-goods{grid-template-columns:repeat(3,minmax(0,1fr))}}
.s-foods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:800px){.s-foods{grid-template-columns:1fr}}
.s-food{background:var(--paper);border:1px solid var(--line2);border-radius:18px;padding:18px;display:grid;grid-template-columns:90px 1fr;gap:16px;align-items:center}
.s-food img{width:90px;height:112px;object-fit:contain}
.s-food b{font-size:16px}.s-food p{font-size:13.5px;color:var(--mute);margin:2px 0 8px}
.s-food dl{display:grid;grid-template-columns:44px 1fr;gap:2px 8px;margin:0;font-size:12.5px}
.s-food dt{color:var(--mute)}.s-food dd{margin:0;color:var(--ear);letter-spacing:1px}
.s-pill-list{display:flex;flex-wrap:wrap;gap:8px}
.s-pill-list span{padding:8px 14px;border-radius:999px;background:var(--milk2);font-size:14px;color:var(--ink2)}

/* 브랜드 */
.s-split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.s-split.rev>:first-child{order:2}
@media (max-width:900px){.s-split{grid-template-columns:1fr;gap:28px}.s-split.rev>:first-child{order:0}}
.s-split>img{border-radius:var(--r-photo);width:100%;aspect-ratio:4/3;object-fit:cover}
.s-quote{font-size:clamp(22px,2.6vw,31px);font-weight:600;line-height:1.6;letter-spacing:-.04em;color:var(--cocoa-d)}
.s-checks{list-style:none;padding:0;margin:26px 0 0}
.s-checks li{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--line);font-weight:600;color:var(--ink2)}
.s-checks li::before{content:"";width:20px;height:20px;flex:none;border-radius:50%;background:var(--cocoa) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.s-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
@media (max-width:900px){.s-values{grid-template-columns:1fr;gap:32px}}
.s-value .ph{aspect-ratio:3/2;border-radius:var(--r-photo);overflow:hidden;background:var(--oat);margin-bottom:18px}
.s-value .ph img{width:100%;height:100%;object-fit:cover}
.s-value h3{font-size:20px;color:var(--cocoa-d);margin-bottom:8px}
.s-value p{color:var(--ink2);line-height:1.8;font-size:15px}
.s-film{position:relative;border-radius:var(--r-photo);overflow:hidden;background:#000;aspect-ratio:16/9}
.s-film video,.s-film iframe{width:100%;height:100%;object-fit:cover;border:0}

/* 입양 안내 */
.s-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;counter-reset:st}
.s-steps li{position:relative;padding:0 22px 4px 0;counter-increment:st}
.s-steps li::before{content:counter(st);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cocoa);color:#fff;font-weight:700;font-size:15px;margin-bottom:16px;position:relative;z-index:1}
.s-steps li::after{content:"";position:absolute;left:34px;right:0;top:17px;height:1px;background:var(--oat2)}
.s-steps li:last-child::after{display:none}
.s-steps b{display:block;font-size:17px;color:var(--cocoa-d)}
.s-steps p{font-size:14.5px;color:var(--ink2);margin-top:6px;line-height:1.7}
@media (max-width:900px){.s-steps{grid-template-columns:1fr}.s-steps li{padding:0 0 26px 52px}.s-steps li::before{position:absolute;left:0;top:0;margin:0}.s-steps li::after{left:16px;right:auto;top:38px;bottom:4px;width:1px;height:auto}}
.s-faq{border-top:1px solid var(--line)}
.s-faq details{border-bottom:1px solid var(--line)}
.s-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 2px;font-size:17px;font-weight:600;color:var(--cocoa-d);cursor:pointer}
.s-faq summary::-webkit-details-marker{display:none}
.s-faq summary .ic{transition:transform .25s var(--ease);color:var(--mute)}
.s-faq details[open] summary .ic{transform:rotate(180deg)}
.s-faq details>div{padding:0 2px 22px;color:var(--ink2);font-size:15.5px;line-height:1.85;max-width:46em}
.s-guar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.s-guar>div{background:var(--paper);border-radius:var(--r-panel);padding:26px}
.s-guar b{display:block;font-size:24px;letter-spacing:-.04em;color:var(--cocoa-d)}
.s-guar p{font-size:14.5px;color:var(--ink2);margin-top:8px}
@media (max-width:800px){.s-guar{grid-template-columns:1fr}}

/* 회원 */
.s-auth{max-width:460px;margin:0 auto}
.s-auth h1{font-size:28px;color:var(--cocoa-d);text-align:center;margin-bottom:8px}
.s-auth .s-lead{text-align:center;margin:0 auto 26px}
.s-auth-links{display:flex;justify-content:center;gap:16px;margin-top:20px;font-size:14px}
.s-auth-links a{color:var(--mute)}
.s-mypage{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:800px){.s-mypage{grid-template-columns:1fr}}
.s-box{background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);padding:26px}
.s-box h2{font-size:18px;color:var(--cocoa-d);margin-bottom:16px}
.s-list{list-style:none;margin:0;padding:0}
.s-list li{display:flex;justify-content:space-between;gap:10px;padding:14px 0;border-bottom:1px solid var(--line2);font-size:15px}
.s-list li:last-child{border-bottom:0}
.s-list small{color:var(--mute)}
.s-st{font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--milk2);color:var(--cocoa);white-space:nowrap;align-self:center}
.s-st.done{background:#e9f5ee;color:var(--green)}.s-st.cancel{background:#f3f0ec;color:var(--mute)}

/* 정책 문서 */
.s-doc{background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);padding:40px;font-size:15px;line-height:1.9;color:var(--ink2)}
.s-doc h2{font-size:18px;color:var(--ink);margin:30px 0 8px}
.s-doc h2:first-child{margin-top:0}
@media (max-width:600px){.s-doc{padding:24px 18px}}

/* 사진 크게 보기 */
.s-lb{border:0;padding:0;background:transparent;max-width:min(92vw,900px);max-height:92vh;overflow:visible}
.s-lb::backdrop{background:rgba(20,14,10,.86)}
.s-lb img{max-width:100%;max-height:88vh;border-radius:12px;margin:0 auto}
.s-lb button{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:0;background:#fff;font-size:22px;cursor:pointer}

/* 예전 이름 (다른 페이지에서 아직 씀) */
.s-cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media (max-width:900px){.s-cards3{grid-template-columns:1fr}}
.s-card{background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);overflow:hidden}
.s-card-ph{aspect-ratio:4/3;overflow:hidden;background:var(--oat)}
.s-card-ph img{width:100%;height:100%;object-fit:cover}
.s-card-b{padding:22px}
.s-card-b .k{display:none}
.s-card-b h3{font-size:19px;color:var(--cocoa-d);margin-bottom:8px}
.s-card-b p{color:var(--ink2);font-size:15px;line-height:1.75}
.rv{opacity:1}

@media (prefers-reduced-motion:reduce){.s-line path{animation:none;stroke-dashoffset:0}.s-bgv video{display:none}*{scroll-behavior:auto!important}}
.s-member>*,.s-benefit>*,.s-split>*,.s-resv>*,.s-mypage>*,.s-cards3>*,.s-branches>*,.s-care>*,.s-values>*{min-width:0}
.s-chips label,.s-days label,.s-cal label,.s-slots label{position:relative}

/* ===== 3차: 새 요소 ===== */

/* 홈 첫 화면 — 액자 없이 영상이 바탕(우유빛)으로 자연스럽게 녹아드는 구성.
   영상은 화면 오른쪽 6할만 쓰고 왼쪽·아래 가장자리를 흐리게 지워, 확대로 인한 화질 저하가 드러나지 않게 함 */
.s-hero2{position:relative;overflow:hidden;background:var(--milk);min-height:min(78vh,720px);display:flex;align-items:center}
.s-hero2-in{position:static;display:block;width:100%;padding-top:56px;padding-bottom:72px}
.s-hero2-t{position:relative;z-index:2;max-width:560px}
.s-hero2-t h1{font-size:clamp(34px,4.2vw,56px);line-height:1.22;letter-spacing:-.045em;color:var(--cocoa-d)}
.s-hero2-t .s-line path{stroke:var(--cocoa)}
.s-hero2-t>p{font-size:clamp(16px,1.4vw,18px);color:var(--ink2);line-height:1.75;max-width:28em}
.s-hero2-pts{list-style:none;margin:40px 0 0;padding:22px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s-hero2-pts b{display:block;font-size:15.5px;color:var(--cocoa-d)}
.s-hero2-pts span{display:block;font-size:13.5px;color:var(--mute);margin-top:2px}
.s-hero2-v{position:absolute;top:0;right:0;bottom:0;width:64%;z-index:1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.55) 16%,#000 34%),linear-gradient(0deg,transparent 0,#000 22%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.55) 16%,#000 34%),linear-gradient(0deg,transparent 0,#000 22%);mask-composite:intersect}
.s-hero2-v .s-bgv{background:var(--milk)}
.s-hero2-v .s-bgv img,.s-hero2-v .s-bgv video{object-position:60% 40%}
.s-hero2-v::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,var(--milk) 0,rgba(251,248,244,0) 30%);opacity:.35}
.s-hero2-chip{position:absolute;right:28px;bottom:120px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--ink);font-size:14px;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.12)}
.s-hero2-chip b{color:var(--ear)}
.s-hero2-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--ear);box-shadow:0 0 0 4px rgba(192,118,76,.18)}
@media (min-width:1600px){.s-hero2-v{width:60%}}
@media (max-width:900px){
  .s-hero2{display:block;min-height:0}
  .s-hero2-in{display:flex;flex-direction:column;padding-top:0;padding-bottom:44px}
  .s-hero2-v{order:-1}
  .s-hero2-v{position:relative;width:auto;height:min(62vh,460px);margin:0 -18px -64px;
    -webkit-mask-image:linear-gradient(0deg,transparent 0,#000 34%);mask-image:linear-gradient(0deg,transparent 0,#000 34%);-webkit-mask-composite:source-over;mask-composite:add}
  .s-hero2-v::after{display:none}
  .s-hero2-chip{right:auto;left:18px;top:16px;bottom:auto;font-size:13px;padding:8px 13px}
  .s-hero2-t{max-width:none}
  .s-hero2-pts{margin-top:28px;gap:8px}
  .s-hero2-pts b{font-size:14px}.s-hero2-pts span{font-size:12px}
  .s-hero2-t .s-hero-btns .s-btn{flex:1;padding:0 14px;font-size:15px}
}

/* 사진 입체감 — 마우스를 따라 살짝 기울고 빛이 비침 */
.tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease);will-change:transform}
.tilt.on{transition:transform .08s linear}
.tilt::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.38),rgba(255,255,255,0) 55%);opacity:0;transition:opacity .3s}
.tilt.on::after{opacity:1}
.s-pet:hover .s-pet-ph.tilt img{transform:scale(1.06) translateZ(0)}
@media (prefers-reduced-motion:reduce){.tilt{transform:none!important}.tilt::after{display:none}}

/* 페이지 머리 그림 띠 — 양옆에 아이들, 가운데 제목 */
.s-tb{position:relative;display:block;background:#f6f1ec var(--pc) center/cover no-repeat;text-align:center;text-decoration:none;color:var(--cocoa-d)}
.s-tb-in{position:relative;z-index:2;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:28px;padding-bottom:28px}
.s-tb h1{font-size:clamp(30px,3.4vw,44px);letter-spacing:-.045em;color:var(--cocoa-d)}
.s-tb h1::after{content:"";display:block;width:40px;height:2px;background:var(--cocoa);margin:16px auto 0;opacity:.5}
.s-tb p{font-size:16px;color:var(--ink2);margin-top:14px;max-width:34em;text-shadow:0 0 18px #f6f1ec,0 0 8px #f6f1ec}
.s-tb-x{margin-top:14px}
.s-tb .s-count{display:inline-block;padding:7px 16px;border-radius:999px;background:rgba(255,255,255,.85);font-size:14px;color:var(--ink2)}
.s-tb .s-count b{font-size:16px;margin:0 1px}
.s-tb.slim .s-tb-in{min-height:150px;flex-direction:row;gap:14px}
.s-tb.slim .tb-t{font-size:24px;font-weight:700;letter-spacing:-.04em}
.s-tb.slim .tb-s{font-size:13px;color:var(--mute);padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.7)}
.s-tb.coton{background:#f7f2ec;overflow:hidden}
.s-tb.coton img{position:absolute;top:0;height:100%;width:34%;object-fit:cover;z-index:1}
.s-tb.coton img.l{left:0;-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
.s-tb.coton img.r{right:0;-webkit-mask-image:linear-gradient(270deg,#000 55%,transparent);mask-image:linear-gradient(270deg,#000 55%,transparent)}
@media (max-width:700px){
  /* 휴대폰: 휴대폰용 타이틀 이미지를 자르지 않고 통째로 — 원래 디자인대로 양옆 아이들 사이 빈 곳에 제목 */
  .s-tb:not(.coton){background:var(--milk)}
  .s-tb:not(.coton)::before{content:"";position:absolute;left:0;right:0;top:0;height:41.7vw;background:var(--m) center 40%/cover no-repeat;pointer-events:none}   /* 사진 비율이 달라도 띠 높이는 같게 */
  .s-tb.pet .s-tb-in>p{display:none}
  .s-tb.pet .s-tb-x{margin-top:10px}
  .s-tb.coton{background:var(--milk)}
  .s-tb.coton img{height:41.7vw;width:40%}
  .s-tb:not(.coton)::after{content:"";position:absolute;left:0;right:0;top:calc(41.7vw - 7vw);height:7vw;background:linear-gradient(rgba(251,248,244,0),var(--milk));pointer-events:none}
  .s-tb .s-tb-in{display:block;min-height:0;padding-top:0;padding-bottom:24px}
  .s-tb h1{height:41.7vw;margin:0 -18px;padding:0 29vw;display:flex;align-items:center;justify-content:center;font-size:clamp(19px,5.6vw,23px);line-height:1.3}
  .s-tb h1::after{display:none}
  .s-tb p{font-size:14px;text-shadow:none;margin:6px auto 0}
  .s-tb-x{margin-top:12px}
  .s-tb.slim .s-tb-in{height:41.7vw;padding:0 29vw;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px}
  .s-tb.slim .tb-t{font-size:18px;line-height:1.25}
  .s-tb.slim .tb-s{font-size:11.5px;padding:3px 8px}
}

/* 약속 세 가지 — 사진 + 어두운 띠 */
.s-promise{background:var(--cocoa-d);color:#efe5da}
.s-promise .s-wrap{padding-top:80px;padding-bottom:80px}
.s-promise-head{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:40px;text-align:center}
.s-promise-head img{width:52px;height:auto;filter:brightness(0) invert(.92) sepia(.2)}
.s-promise-head h2{font-size:clamp(24px,2.6vw,32px);color:#fff}
.s-promise-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:0}
.s-promise article .ph{aspect-ratio:4/3;border-radius:var(--r-photo);overflow:hidden;margin-bottom:20px;background:#3a2e28}
.s-promise article .ph img{width:100%;height:100%;object-fit:cover}
.s-promise h3{font-size:19px;color:#fff}
.s-promise article p{font-size:14.5px;color:#cbbdb0;margin-top:8px;line-height:1.75}
.s-promise-cta{text-align:center;margin-top:44px}
@media (max-width:800px){.s-promise .s-wrap{padding-top:60px;padding-bottom:60px}.s-promise-grid{grid-template-columns:1fr;gap:32px}.s-promise article{display:grid;grid-template-columns:104px 1fr;grid-template-areas:'ph t' 'ph p';column-gap:16px;row-gap:0;align-items:start}.s-promise article .ph{grid-area:ph;margin:0;aspect-ratio:1;align-self:start}.s-promise article h3{grid-area:t;align-self:end;padding-top:6px}.s-promise article p{grid-area:p}.s-promise h3{font-size:17px}.s-promise article p{font-size:13.5px;margin-top:4px}}

/* 입양 카드: 찜 버튼 */
.s-pet{position:relative}
.s-pet-a{display:block;text-decoration:none;color:inherit}
.s-like{position:absolute;right:10px;top:10px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.9);color:var(--cocoa);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.1);transition:transform .2s var(--ease),color .2s,background .2s}
/* 목록 카드의 찜: 사진을 가리지 않게 작고 투명하게 — 눌렀을 때만 색 */
.s-like:not(.s-like-pill):not(.nv-r){width:30px;height:30px;right:8px;top:8px;background:rgba(32,24,20,.22);color:#fff;box-shadow:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.s-like:not(.s-like-pill):not(.nv-r) .ic{width:16px;height:16px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.s-like:not(.s-like-pill):not(.nv-r)[aria-pressed="true"]{background:rgba(255,255,255,.94);color:var(--ear)}
.s-like:not(.s-like-pill):not(.nv-r)[aria-pressed="true"] .ic{filter:none}
.s-like:hover{transform:scale(1.08)}
.s-like[aria-pressed="true"]{background:var(--ear);color:#fff}
.s-like[aria-pressed="true"] .ic path{fill:currentColor}
.s-like.pop{animation:pop .4s var(--ease)}
@keyframes pop{40%{transform:scale(1.3)}}
@media (max-width:640px){.s-like:not(.s-like-pill):not(.nv-r){width:28px;height:28px;right:7px;top:7px}}

/* 미용 후기 — 크기를 맞춘 격자 */
.s-gal.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.s-gal.grid a{position:relative;border-radius:14px;aspect-ratio:1/1;overflow:hidden;background:var(--oat)}
.s-gal.grid img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0;transition:transform .5s var(--ease)}
.s-gal.grid a:hover img{transform:scale(1.05)}
.s-gal.grid a.more-hide{display:none}
@media (max-width:900px){.s-gal.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.s-gal.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.s-gal.grid a{border-radius:10px}}
.s-lb .lb-p,.s-lb .lb-n{position:fixed;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.92);font-size:28px;line-height:1;cursor:pointer;color:var(--cocoa-d)}
.s-lb .lb-p{left:max(12px,calc(50% - 520px))}.s-lb .lb-n{right:max(12px,calc(50% - 520px))}
.s-lb .lb-x{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:0;background:#fff;font-size:22px;cursor:pointer}

/* 입양 안내 — 사진 단계 */
.s-steps{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.s-steps li{padding:0}
.s-steps li::after{display:none}
.s-steps li .ph{position:relative;aspect-ratio:4/5;border-radius:var(--r-photo);overflow:hidden;background:var(--oat);margin-bottom:16px}
.s-steps li .ph img{width:100%;height:100%;object-fit:cover}
.s-steps li::before{position:absolute;left:12px;top:12px;z-index:2;margin:0;background:var(--paper);color:var(--cocoa-d);box-shadow:0 2px 10px rgba(0,0,0,.12)}
@media (max-width:900px){.s-steps{grid-template-columns:1fr;gap:20px}.s-steps li{display:grid;grid-template-columns:120px 1fr;gap:4px 16px;align-items:start;padding:0}.s-steps li .ph{grid-row:span 2;margin:0;aspect-ratio:1}.s-steps li::before{left:8px;top:8px;width:28px;height:28px;font-size:13px}.s-steps li::after{display:none}.s-steps b{padding-top:6px}}
.s-guar-wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:56px;align-items:center}
.s-guar-ph{aspect-ratio:4/5;border-radius:var(--r-photo);overflow:hidden}
.s-guar-ph img{width:100%;height:100%;object-fit:cover}
.s-guar-wrap .s-guar{grid-template-columns:1fr;margin-top:24px;gap:10px}
.s-guar-wrap .s-guar>div{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center;padding:20px 22px}
.s-guar-wrap .s-guar p{margin:0}
.s-faq-wrap{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.4fr);gap:56px;align-items:start}
.s-faq-ph{position:sticky;top:90px;aspect-ratio:4/5;border-radius:var(--r-photo);overflow:hidden}
.s-faq-ph img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){.s-guar-wrap,.s-faq-wrap{grid-template-columns:1fr;gap:28px}.s-guar-ph{aspect-ratio:16/10}.s-faq-ph{display:none}.s-guar-wrap .s-guar>div{grid-template-columns:1fr;gap:4px}}

/* 예약: 찜한 아이 */
.s-likes-pick{margin-bottom:16px;padding:14px;border-radius:16px;background:var(--milk2)}
.s-likes-pick p{font-size:14px;color:var(--ink2);margin-bottom:10px}
.s-likes-pick>div{display:flex;gap:8px;overflow-x:auto}
.s-likes-pick a{flex:none;width:76px;text-decoration:none;color:var(--ink2);font-size:12px;text-align:center}
.s-likes-pick img{width:76px;height:76px;border-radius:12px;object-fit:cover;margin-bottom:4px}

/* 인연 찾기 */
.mt{background:var(--milk2);padding:48px 0 80px;min-height:calc(100vh - 180px)}
.mt-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.mt-side h1{font-size:clamp(30px,3.4vw,44px);color:var(--cocoa-d);letter-spacing:-.045em}
.mt-side>p{font-size:16px;color:var(--ink2);margin:14px 0 22px;line-height:1.75}
.mt-likes{margin-top:28px;background:var(--paper);border-radius:var(--r-panel);padding:20px;border:1px solid var(--line2)}
.mt-likes-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.mt-likes-h b{font-size:16px;color:var(--cocoa-d)}
.mt-likes-h b span{color:var(--ear)}
.mt-clear{border:0;background:none;color:var(--mute);font-size:13px;cursor:pointer}
.mt-likes-l{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mt-likes-l li{position:relative}
.mt-likes-l a{display:block;text-decoration:none;color:var(--ink2);font-size:12px;text-align:center}
.mt-likes-l img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;margin-bottom:3px}
.mt-likes-l button{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;border:0;background:var(--cocoa-d);color:#fff;font-size:13px;line-height:1;cursor:pointer}
.mt-likes-e{font-size:14px;color:var(--mute);padding:6px 0 4px}
.mt-stage{display:flex;flex-direction:column;align-items:center}
.mt-deck{position:relative;width:min(380px,100%);aspect-ratio:4/5}
.mt-card{position:absolute;inset:0;border-radius:26px;overflow:hidden;background:var(--oat);box-shadow:0 24px 60px rgba(47,37,32,.18);touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab;transition:transform .35s var(--ease),opacity .35s}
.mt-card img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.mt-card::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(0deg,rgba(28,20,16,.72),transparent)}
.mt-card .cap{position:absolute;left:22px;right:22px;bottom:20px;z-index:2;color:#fff}
.mt-card .cap b{display:block;font-size:26px;letter-spacing:-.04em}
.mt-card .cap span{font-size:14.5px;opacity:.85}
.mt-card .tag{position:absolute;left:18px;top:18px;z-index:2;padding:5px 12px;border-radius:999px;background:var(--ear);color:#fff;font-size:12.5px;font-weight:700}
.mt-card .st{position:absolute;top:26px;z-index:3;padding:6px 14px;border-radius:10px;font-size:20px;font-weight:800;border:3px solid;opacity:0;transform:rotate(-10deg)}
.mt-card .st.like{left:22px;color:#fff;border-color:#fff;background:rgba(192,118,76,.85)}
.mt-card .st.pass{right:22px;color:#fff;border-color:#fff;background:rgba(47,37,32,.6);transform:rotate(10deg)}
.mt-card.back{transform:scale(.94) translateY(16px);opacity:.9;pointer-events:none}
.mt-card.back2{transform:scale(.88) translateY(32px);opacity:.6;pointer-events:none}
.mt-card.dragging{transition:none;cursor:grabbing}
.mt-end{position:absolute;inset:0;border-radius:26px;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;gap:12px}
.mt-end b{font-size:20px;color:var(--cocoa-d)}
.mt-end p{font-size:14.5px;color:var(--ink2)}
.mt-ctrl{display:flex;gap:18px;align-items:center;margin-top:26px}
.mt-b{width:64px;height:64px;border-radius:50%;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;cursor:pointer;color:var(--cocoa-d);box-shadow:0 8px 22px rgba(47,37,32,.1);transition:transform .15s}
.mt-b:active{transform:scale(.92)}
.mt-b.like{width:76px;height:76px;background:var(--ear);border-color:var(--ear);color:#fff}
.mt-b.like .ic path{fill:currentColor}
.mt-count{margin-top:16px;font-size:14px;color:var(--mute);font-variant-numeric:tabular-nums}
.mt-hint{font-size:13px;color:var(--mute);margin-top:2px}
.mt-tray{display:none}
@media (max-width:900px){
  .mt{padding:12px 0 24px}
  .mt-in{grid-template-columns:1fr;gap:10px}
  .mt-side h1{font-size:23px}
  .mt-side>p{display:none}
  .mt-likes{display:none;position:fixed;left:12px;right:12px;bottom:20px;z-index:65;margin:0;box-shadow:0 20px 60px rgba(47,37,32,.25)}
  .mt-likes.open{display:block;animation:toastIn .25s var(--ease)}
  .mt-deck{width:100%;aspect-ratio:auto;height:clamp(340px,calc(100svh - 330px),640px)}
  .mt-tray{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 14px;border-radius:999px;border:0;background:var(--cocoa-d);color:#fff;font-size:14px;font-weight:700;cursor:pointer}
  .mt-tray .ic{fill:currentColor}
  .mt-tray span{color:#f3c79d}
  .mt-ctrl{margin-top:16px;gap:14px}
  .mt-b{width:56px;height:56px}.mt-b.like{width:68px;height:68px}.mt-b.info{height:48px}
  .mt-count{margin-top:10px;font-size:12.5px}
  .mt-hint{display:none}
  .mt-card .cap b{font-size:24px}
}
/* ---------------------------------------------------------------- NOW (매장에서 찍은 세로 영상) */
@keyframes nwLive{0%{box-shadow:0 0 0 0 rgba(226,73,59,.45)}70%{box-shadow:0 0 0 7px rgba(226,73,59,0)}100%{box-shadow:0 0 0 0 rgba(226,73,59,0)}}
.nw-live{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e2493b;animation:nwLive 2s infinite;vertical-align:middle}
.nw-eyebrow{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.16em;color:#c2392c;margin-bottom:10px}
.nw-hero{padding:56px 0 8px;text-align:center}
.nw-hero h1{font-size:clamp(27px,3.6vw,42px);color:var(--cocoa-d)}
.nw-hero .nw-eyebrow{justify-content:center}
.nw-lead{margin:14px auto 0;max-width:34em;color:var(--ink2);font-size:clamp(15px,1.4vw,17px)}
.nw-sec{padding-top:32px}
.nw-filter{display:flex;justify-content:center;gap:6px;margin-bottom:28px}
.nw-filter button{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:9px 18px;font-weight:600;font-size:15px;color:var(--ink2);cursor:pointer}
.nw-filter button small{font-weight:500;color:var(--mute);margin-left:2px}
.nw-filter button.on{background:var(--cocoa-d);border-color:var(--cocoa-d);color:#fff}.nw-filter button.on small{color:rgba(255,255,255,.7)}
.nw-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
@media (max-width:1100px){.nw-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:800px){.nw-grid{grid-template-columns:repeat(3,1fr);gap:12px}}
@media (max-width:560px){.nw-grid{grid-template-columns:repeat(2,1fr);gap:10px}}
.nw-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 10px;margin:0 -2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.nw-row::-webkit-scrollbar{display:none}
.nw-row .nw-card{flex:0 0 clamp(150px,19vw,214px);scroll-snap-align:start}
@media (max-width:600px){.nw-row{margin:0 -18px;padding:4px 18px 10px;scroll-padding:0 18px;gap:10px}.nw-row .nw-card{flex-basis:41vw}}
.nw-card{display:block;text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}
.nw-ph{position:relative;display:block;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#2a211d;isolation:isolate;transform:translateZ(0)}
.nw-ph img,.nw-ph video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nw-ph video{opacity:0;transition:opacity .4s}
.nw-ph video.on{opacity:1}
.nw-ph::after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(transparent,rgba(20,14,11,.55));pointer-events:none}
.nw-card:hover .nw-ph img{transform:scale(1.03)}.nw-ph img{transition:transform .6s var(--ease)}
.nw-pl{position:absolute;right:10px;bottom:10px;z-index:2;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;display:grid;place-items:center}
.nw-pl .ic{margin-left:2px;fill:currentColor}
.nw-new{position:absolute;left:10px;top:10px;z-index:2;font-style:normal;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--ear);color:#fff}
.nw-cap{display:block;padding:10px 2px 0}
.nw-cap b{display:block;font-size:15.5px;color:var(--cocoa-d);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nw-cap small{display:block;font-size:13px;color:var(--mute);margin-top:1px}
.nw-strip{padding-bottom:20px}
.nw-strip .s-head-row{margin-bottom:24px}
.nw-post{margin:6px 0 28px}
.nw-post .nw-eyebrow{margin-bottom:12px}
.nw-post .nw-row .nw-card{flex-basis:clamp(130px,30%,180px)}
.s-vbadge{position:absolute;right:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:4px;font-style:normal;font-size:11.5px;font-weight:700;padding:4px 9px 4px 7px;border-radius:999px;background:rgba(32,24,20,.62);color:#fff;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.s-vbadge .ic{fill:currentColor}

/* 영상 보기 창 (세로로 넘기기) */
.nv{position:fixed;inset:0;z-index:200;background:#0d0a09;color:#fff;display:none}
.nv.open{display:block;animation:fade .2s}
body.nv-open{overflow:hidden}
.nv-bg{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(40px) brightness(.45) saturate(1.2);transition:background-image .4s}
.nv-list{position:absolute;inset:0;overflow-y:scroll;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none}
.nv-list::-webkit-scrollbar{display:none}
.nv-s{position:relative;height:100%;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center}
.nv-f{position:relative;height:100%;width:100%;background:#000;overflow:hidden}
.nv-f video,.nv-f img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nv-f video{background:transparent}
@media (min-width:801px){
  .nv-f{height:calc(100dvh - 48px);width:auto;aspect-ratio:9/16;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
  .nv-f video,.nv-f img{object-fit:contain;background:#000}
}
.nv-shade{position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,rgba(0,0,0,.72));pointer-events:none}
.nv-shade.t{inset:0 0 auto;height:22%;background:linear-gradient(rgba(0,0,0,.5),transparent)}
.nv-info{position:absolute;left:0;right:0;bottom:0;padding:0 18px calc(18px + env(safe-area-inset-bottom));z-index:2}
.nv-info .tag{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--ear);margin-bottom:8px}
.nv-info h3{font-size:22px;letter-spacing:-.03em;line-height:1.25}
.nv-info .sub{font-size:14px;opacity:.82;margin-top:2px}
.nv-info .cap{font-size:15px;margin-top:8px;line-height:1.5}
.nv-btns{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-top:14px}
.nv-btns a,.nv-btns button{height:46px;border-radius:14px;border:0;display:flex;align-items:center;justify-content:center;gap:6px;font-size:14.5px;font-weight:700;text-decoration:none;cursor:pointer}
.nv-more{background:#fff;color:var(--cocoa-d)}
.nv-k{background:var(--kakao);color:#191600}
.nv-btns .s-like{position:static;width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.18);color:#fff;box-shadow:none}
.nv-btns .s-like[aria-pressed="true"]{background:#fff;color:#e2493b}
.nv-bar{position:absolute;left:12px;right:12px;top:calc(8px + env(safe-area-inset-top));height:3px;border-radius:3px;background:rgba(255,255,255,.28);z-index:3;overflow:hidden}
.nv-bar i{display:block;height:100%;width:0;background:#fff}
.nv-big{position:absolute;inset:0;margin:auto;width:72px;height:72px;border-radius:50%;background:rgba(0,0,0,.35);display:grid;place-items:center;opacity:0;transition:opacity .2s;pointer-events:none;z-index:2}
.nv-big .ic{fill:#fff;margin-left:4px}
.nv-s.paused .nv-big{opacity:1}
.nv-top{position:absolute;left:0;right:0;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:calc(18px + env(safe-area-inset-top)) 14px 0;pointer-events:none}
.nv-top>*{pointer-events:auto}
.nv-brand{display:flex;align-items:center;gap:7px;font-weight:700;letter-spacing:.14em;font-size:13px;margin-right:auto;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.nv-cnt{font-size:12.5px;opacity:.75;letter-spacing:0;font-weight:500}
.nv-ic{width:42px;height:42px;border-radius:50%;border:0;background:rgba(0,0,0,.35);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.nv-snd{width:auto;padding:0 14px 0 12px;border-radius:999px;display:flex;gap:6px;font-size:13.5px;font-weight:700}
.nv-snd.on{background:rgba(255,255,255,.2)}
.nv-nav{display:none}
@media (min-width:801px){
  .nv-top{left:50%;right:auto;width:calc((100dvh - 48px) * 9 / 16);transform:translateX(-50%);padding-top:calc(24px + 18px)}
  .nv-bar{top:12px}
  .nv-nav{display:flex;flex-direction:column;gap:10px;position:absolute;right:max(24px,calc(50% - (100dvh - 48px) * 9 / 32 - 90px));top:50%;transform:translateY(-50%);z-index:5}
  .nv-nav button{width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;cursor:pointer}
  .nv-nav button:hover{background:rgba(255,255,255,.26)}
  .nv-nav button:disabled{opacity:.3;cursor:default}
  .nv-x-pc{position:absolute;right:24px;top:24px;z-index:6}
  .nv-top .nv-x{display:none}
}
@media (max-width:800px){.nv-x-pc{display:none}}
.nv-hint{position:absolute;left:50%;bottom:calc(150px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:4;font-size:13px;font-weight:600;background:rgba(0,0,0,.45);padding:7px 14px;border-radius:999px;white-space:nowrap;animation:nvHint 2.4s ease-in-out 2;pointer-events:none}
@keyframes nvHint{0%,100%{transform:translate(-50%,0);opacity:.95}50%{transform:translate(-50%,-10px);opacity:1}}
@media (min-width:1101px){
  .nw-strip .nw-row{display:grid;grid-template-columns:repeat(6,1fr);overflow:visible;gap:16px}
  .nw-strip .nw-row .nw-card:nth-child(n+7){display:none}
}

/* ---------------------------------------------------------------- 강조 메뉴 (NOW · 인연 찾기) */
.s-menu>li.hot{align-items:center;padding:0 3px}
.s-menu>li.hot>a{height:38px;padding:0 16px;border-radius:999px;gap:7px;font-weight:700;transition:transform .2s var(--ease),box-shadow .2s,background .2s}
.s-menu>li.hot>a::after{display:none}
.s-menu>li.hot>a:hover{transform:translateY(-1px)}
.s-menu a.hot-now{background:var(--cocoa-d);color:#fff!important;letter-spacing:.04em;box-shadow:0 6px 16px rgba(47,37,32,.22)}
.s-menu a.hot-now .nw-live{width:7px;height:7px;box-shadow:0 0 0 0 rgba(226,73,59,.6)}
.s-menu a.hot-match{background:#f8e6db;color:#b0623a!important;box-shadow:inset 0 0 0 1px rgba(192,118,76,.28)}
.s-menu a.hot-match .ic{fill:currentColor;animation:beat 2.6s ease-in-out infinite}
.s-menu>li.hot.on>a.hot-match{background:var(--ear);color:#fff!important}
@keyframes beat{0%,70%,100%{transform:scale(1)}78%{transform:scale(1.25)}86%{transform:scale(1)}92%{transform:scale(1.15)}}
.s-menu>li.after-hot{margin-left:10px;padding-left:10px;position:relative}
.s-menu>li.after-hot::before{content:"";position:absolute;left:0;top:50%;height:18px;margin-top:-9px;width:1px;background:var(--line)}
@media (max-width:1240px){.s-menu>li.hot>a{padding:0 13px;font-size:14.5px}.s-menu>li.after-hot{margin-left:6px;padding-left:6px}}
.s-nav-feat{display:none}
@media (max-width:1100px){
  .s-menu>li.hot{display:none}
  .s-menu>li.after-hot{margin:0;padding:0}.s-menu>li.after-hot::before{display:none}
  .s-nav-feat{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 14px}
  .s-nav-feat a{display:flex;flex-direction:column;gap:4px;padding:16px 14px;border-radius:16px;text-decoration:none;min-height:92px;justify-content:space-between}
  .s-nav-feat .t{display:flex;align-items:center;gap:7px;font-size:17px;font-weight:700;letter-spacing:-.02em}
  .s-nav-feat small{font-size:12.5px;line-height:1.4;opacity:.8}
  .f-now{background:var(--cocoa-d);color:#fff}
  .f-now .t{letter-spacing:.05em}
  .f-match{background:#f8e6db;color:#9c522d}
  .f-match .ic{fill:currentColor}
}
/* 휴대폰: 머리 아래 바로가기 줄 */
.s-mquick{display:flex;gap:6px;overflow-x:auto;padding:10px 18px;background:var(--milk);border-bottom:1px solid var(--line2);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.s-mquick::-webkit-scrollbar{display:none}
.s-mquick a{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink2);text-decoration:none;background:var(--paper);border:1px solid var(--line)}
.s-mquick a.on{border-color:var(--cocoa);color:var(--cocoa-d)}
.s-mquick a.q-now{background:var(--cocoa-d);border-color:var(--cocoa-d);color:#fff;font-weight:700}
.s-mquick a.q-match{background:#f8e6db;border-color:rgba(192,118,76,.3);color:#9c522d;font-weight:700}
.s-mquick a.q-match .ic{fill:currentColor}
.s-mquick .nw-live{width:7px;height:7px}
body.match-page .s-mquick{display:none}
@media (min-width:1101px){.s-mquick{display:none}}
/* 홈: 인연 찾기 맛보기 (카드가 저절로 한 장씩 넘어감) */
.s-mband{background:linear-gradient(135deg,#f9ebe1 0%,#f3dccd 100%);padding:96px 0;overflow:hidden}
.s-mband-in{display:grid;grid-template-columns:1fr 460px;gap:64px;align-items:center}
.s-mband .s-mband-ey{margin-top:0;display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:#b0623a;letter-spacing:.04em;margin-bottom:14px}
.s-mband .s-mband-ey .ic{fill:currentColor}
.s-mband h2{font-size:clamp(28px,3.4vw,42px);color:var(--cocoa-d)}
.s-mband-t>p{margin-top:16px;color:var(--ink2);font-size:clamp(15px,1.4vw,17px);max-width:30em}
.s-mband .s-btn-acc{background:var(--ear)}.s-mband .s-btn-acc:hover{background:#a95f37}
.s-mband .s-btn-acc .ic{fill:currentColor}
.s-mband .s-btn-line{background:rgba(255,255,255,.7)}
.s-mband-deck{position:relative;display:block;width:min(360px,78vw);aspect-ratio:4/5;margin:0 auto 40px;justify-self:center}
.mbd-c{position:absolute;inset:0;border-radius:24px;overflow:hidden;background:var(--oat);box-shadow:0 20px 50px rgba(120,62,30,.22);transform:translate(calc(var(--i) * 16px),calc(var(--i) * 10px)) scale(calc(1 - var(--i) * .04)) rotate(calc(var(--i) * 4deg));z-index:calc(10 - var(--i));transition:transform .55s var(--ease),opacity .45s}
.mbd-c img{width:100%;height:100%;object-fit:cover}
.mbd-c::after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(transparent,rgba(28,20,16,.7))}
.mbd-c .cap{position:absolute;left:20px;bottom:18px;z-index:2;color:#fff}
.mbd-c .cap b{display:block;font-size:24px;letter-spacing:-.04em;line-height:1.2}
.mbd-c .cap small{font-size:14px;opacity:.85}
.mbd-c .st{position:absolute;left:20px;top:22px;z-index:3;font-style:normal;font-weight:700;font-size:22px;color:#fff;background:var(--ear);padding:4px 14px;border-radius:12px;transform:rotate(-12deg);opacity:0;transition:opacity .25s}
.mbd-c.out{transform:translateX(115%) rotate(18deg);opacity:0}
.mbd-c.out .st{opacity:1}
.mbd-c.reset{transition:none}
.mbd-btns{position:absolute;left:0;right:0;bottom:-30px;z-index:20;display:flex;justify-content:center;gap:18px}
.mbd-btns i{width:60px;height:60px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 26px rgba(120,62,30,.2)}
.mbd-btns .x{color:var(--mute)}
.mbd-btns .h{color:#e2493b;width:68px;height:68px;margin-top:-4px}
.mbd-btns .h .ic{fill:currentColor}
.s-mband-deck.beat .mbd-btns .h{animation:pop .4s var(--ease)}
@keyframes pop{50%{transform:scale(1.18)}}
@media (max-width:900px){
  .s-mband{padding:72px 0 88px}
  .s-mband-in{grid-template-columns:1fr;gap:44px}
  .s-mband-t{text-align:center}.s-mband-t>p{margin-left:auto;margin-right:auto}
  .s-mband .s-mband-ey{justify-content:center}
  .s-mband .s-hero-btns{justify-content:center}
  .s-mband-deck{width:min(300px,72vw)}
}

/* 휴대폰 메뉴: 하위 메뉴는 접어 두고, 이름만 작게 보여 줌 → 누르면 펼침 */
@media (max-width:1100px){
  .s-menu>li.has-sub{position:relative}
  .s-menu>li.has-sub>a{padding-bottom:2px}
  .s-menu>li.has-sub>a::after{display:block;content:"";position:absolute;left:auto;right:4px;top:22px;bottom:auto;width:8px;height:8px;background:none;border:solid var(--mute);border-width:0 1.8px 1.8px 0;transform:rotate(45deg);transition:transform .25s var(--ease)}
  .s-menu>li.has-sub.open>a::after{transform:rotate(-135deg);top:26px}
  .s-sub-hint{display:block;font-size:13px;color:var(--mute);padding:0 0 14px;margin-top:-2px;pointer-events:none}
  .s-menu>li.has-sub.open .s-sub-hint{display:none}
  .s-menu .s-sub{display:none;margin-top:0}
  .s-menu>li.has-sub.open .s-sub{display:block;animation:fade .2s}
}

/* 글 보기: 찜 버튼 (인연 찾기·목록과 같은 찜 목록) */
.s-like.s-like-pill{position:static;width:auto;height:40px;padding:0 16px 0 13px;border-radius:999px;gap:6px;display:inline-flex;align-items:center;margin-top:14px;background:var(--paper);border:1px solid var(--line);box-shadow:none;font-size:14.5px;font-weight:600;color:var(--cocoa-d)}
.s-like-pill .on{display:none}
.s-like-pill[aria-pressed="true"]{background:var(--ear);border-color:var(--ear);color:#fff}
.s-like-pill[aria-pressed="true"] .on{display:inline}.s-like-pill[aria-pressed="true"] .off{display:none}
.mt-b.info{width:auto;height:52px;border-radius:999px;padding:0 14px 0 18px;display:inline-flex;gap:2px;font-size:15px;font-weight:600;text-decoration:none}
.s-rv-br{flex:none}
.s-rv-br button{padding:7px 15px;font-size:14px}
@media (max-width:700px){.s-rv-head{gap:14px}.s-rv-br{width:100%}.s-rv-br button{flex:1;justify-content:center}}


/* 브랜드 이야기: 영상 아래로 이어지는 카드 (영상 위로 살짝 겹쳐 올라옴) */
.s-hero.about{position:relative}
.s-hero.about::after{content:"";position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(transparent,var(--milk));z-index:1;pointer-events:none}
.s-ab-bridge{position:relative;z-index:3;margin-top:-110px;padding-bottom:96px}
.s-ab-card{position:relative;max-width:920px;margin:0 auto;background:var(--paper);border-radius:28px;box-shadow:0 30px 80px rgba(47,37,32,.12);padding:64px 72px 48px;text-align:center}
.s-ab-card .mk{position:absolute;left:50%;top:-38px;width:76px;height:76px;margin-left:-38px;object-fit:contain;background:var(--paper);border-radius:50%;padding:12px;box-shadow:0 8px 24px rgba(47,37,32,.12)}
.s-ab-card .ey{font-size:12.5px;font-weight:700;letter-spacing:.24em;color:var(--ear)}
.s-ab-card .q{margin-top:18px;font-size:clamp(21px,2.3vw,28px);font-weight:700;line-height:1.6;letter-spacing:-.035em;color:var(--cocoa-d)}
.s-ab-card mark{background:linear-gradient(transparent 62%,rgba(192,118,76,.28) 62%);color:inherit;padding:0 2px}
.s-ab-card .q2{margin-top:14px;font-size:16px;color:var(--ink2)}
.s-ab-steps{list-style:none;margin:40px 0 0;padding:28px 0 0;border-top:1px solid var(--line2);display:grid;grid-template-columns:repeat(3,1fr)}
.s-ab-steps li{display:flex;flex-direction:column;align-items:center;gap:3px;padding:0 10px;position:relative}
.s-ab-steps li+li::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:1px;background:var(--line2)}
.s-ab-steps b{font-size:13px;color:var(--ear);letter-spacing:.06em}
.s-ab-steps span{font-size:17px;font-weight:700;color:var(--cocoa-d)}
.s-ab-steps small{font-size:13px;color:var(--mute)}
@media (max-width:700px){
  .s-ab-bridge{margin-top:-16px;padding-bottom:64px}
  .s-ab-card{padding:52px 22px 30px;border-radius:22px}
  .s-ab-card .q{font-size:19px}
  .s-ab-card .q2{font-size:14.5px}
  .s-ab-steps{margin-top:26px;padding-top:20px}
  .s-ab-steps li{padding:0 4px}
  .s-ab-steps span{font-size:14px;letter-spacing:-.04em}
  .s-ab-steps small{font-size:11.5px;line-height:1.4;margin-top:2px}
}
/* 홈: 멤버십 — 금액 대신 만든 이유(영상)부터 */
.s-care2{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:56px;align-items:center}
.s-care2-v .s-yt{box-shadow:0 24px 60px rgba(47,37,32,.16)}
.s-care2-ey{font-size:14px;font-weight:600;color:var(--ear);margin-bottom:10px}
.s-care2-l{list-style:none;margin:26px 0 24px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.s-care2-l li{padding:14px 16px;border-radius:14px;background:var(--milk2)}
.s-care2-l b{display:block;font-size:15px;color:var(--cocoa-d)}
.s-care2-l span{display:block;font-size:13px;color:var(--mute);margin-top:2px}
@media (max-width:900px){.s-care2{grid-template-columns:1fr;gap:28px}.s-care2-l{grid-template-columns:1fr 1fr}}
.s-grades{margin-top:56px;border:1px solid var(--line);border-radius:18px;background:var(--paper);padding:0 22px}
.s-grades summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:600;font-size:16px;color:var(--cocoa-d);display:flex;justify-content:space-between;align-items:center}
.s-grades summary::-webkit-details-marker{display:none}
.s-grades summary::after{content:"+";font-size:22px;font-weight:400;color:var(--mute)}
.s-grades[open] summary::after{content:"−"}
.s-grades[open]{padding-bottom:20px}
@media (min-width:701px){.s-hero.about .s-hero-in{padding-bottom:170px}}

/* 인연 찾기: 머리 줄 · 질문 카드 */
.mt-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
@media (min-width:901px){.mt-tray{display:none}}
.mt-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mt-prefs{display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 6px 0 12px;border-radius:999px;background:#f8e6db;color:#9c522d;font-size:13px;font-weight:600}
.mt-prefs button{width:22px;height:22px;border:0;border-radius:50%;background:rgba(156,82,45,.15);color:#9c522d;cursor:pointer;font-size:14px;line-height:1}
.mt-q{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:0;padding:30px 26px;background:linear-gradient(160deg,#fbf3ec,#f3dccd);cursor:default;text-align:center;touch-action:auto}
.mt-q::after{display:none}
.mt-q .mk{width:58px;height:auto;margin:0 auto 14px;object-fit:contain;pointer-events:none}
.mt-q .qn{font-size:13px;font-weight:600;color:#b0623a}
.mt-q .qt{display:block;margin-top:8px;font-size:22px;line-height:1.4;letter-spacing:-.035em;color:var(--cocoa-d)}
.mt-q .qo{display:flex;flex-direction:column;gap:9px;margin-top:24px}
.mt-q .qo button{height:52px;border-radius:14px;border:1px solid rgba(156,82,45,.2);background:var(--paper);font-size:15.5px;font-weight:600;color:var(--cocoa-d);cursor:pointer;transition:transform .15s,background .15s}
.mt-q .qo button:hover{background:#fff8f3}
.mt-q .qo button:active{transform:scale(.98)}
.mt-q .qo button.skip{background:transparent;border-color:transparent;color:var(--mute);height:40px}
.mt-deck.asking+.mt-ctrl{opacity:.35;pointer-events:none}


.s-hero2-chip b{color:#c2392c;letter-spacing:.06em}
.s-hero2-chip .nw-live{width:7px;height:7px}
.s-hero2 .s-btn-ink .ic{margin-left:2px}
.s-hero2-t>.s-hero2-ey{font-size:14px;font-weight:600;color:var(--ear);margin-bottom:14px;letter-spacing:.02em}
.s-hero2-pts li{position:relative}
.s-hero2-pts .pi{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#f8e6db;color:#9c522d;margin-bottom:10px}

/* 홈: 2년 돌봄 — 아이콘 카드 */
.s-care-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.s-care-cards li{position:relative;background:var(--paper);border-radius:20px;padding:24px 22px 22px;box-shadow:0 1px 0 rgba(47,37,32,.04);transition:transform .25s var(--ease),box-shadow .25s}
.s-care-cards li:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(47,37,32,.08)}
.s-care-cards .ci{width:52px;height:52px;border-radius:16px;background:#f8e6db;color:#9c522d;display:grid;place-items:center;margin-bottom:16px}
.s-care-cards b{display:block;font-size:18px;color:var(--cocoa-d);letter-spacing:-.03em}
.s-care-cards p{font-size:14px;color:var(--ink2);line-height:1.65;margin-top:6px}
.s-care-cards em{position:absolute;right:20px;top:20px;font-style:normal;font-size:13px;font-weight:700;color:var(--oat2);letter-spacing:.04em}
@media (max-width:1100px){.s-care-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .s-care-cards{gap:10px}
  .s-care-cards li{padding:18px 16px;border-radius:16px}
  .s-care-cards .ci{width:44px;height:44px;border-radius:13px;margin-bottom:12px}
  .s-care-cards .ci svg{width:22px;height:22px}
  .s-care-cards b{font-size:16px}
  .s-care-cards p{font-size:12.5px;line-height:1.55}
  .s-care-cards em{right:14px;top:14px;font-size:11.5px}
}
.s-open{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:12px;font-weight:600;vertical-align:1px;background:var(--milk2);color:var(--mute)}
.s-open.on{background:#e6f2ea;color:var(--green)}
.s-open.pre{background:#f8e6db;color:#9c522d}
/* 브랜드 이야기: 영상 높이 줄임 */
.s-hero.about{min-height:min(64vh,600px)}
@media (min-width:701px){.s-hero.about .s-hero-in{padding-bottom:150px}}
@media (max-width:700px){.s-hero.about{min-height:440px}.s-hero.about .s-hero-in{padding-bottom:70px;justify-content:flex-end}}

/* 글 보기 위: 목록으로 돌아가는 얇은 줄 */
.s-backbar{background:var(--milk2);border-bottom:1px solid var(--line2)}
.s-backbar .s-wrap{height:52px;display:flex;align-items:center}
.s-backbar a{display:inline-flex;align-items:center;gap:4px;font-size:14.5px;font-weight:600;color:var(--ink2);text-decoration:none}
.s-backbar a .ic{transform:rotate(180deg)}
.s-backbar a:hover{color:var(--cocoa-d)}

/* 페이지 머리 (강아지·고양이·품종·후기·혜택·안내·지점·예약 공통): 왼쪽 글 + 폴라로이드 사진 3장 */
.s-phero{background:linear-gradient(180deg,var(--milk2),var(--milk));overflow:hidden}
.s-phero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:56px;align-items:center;padding-top:44px;padding-bottom:52px}
.s-phero-ey{font-size:14px;font-weight:600;color:var(--ear);margin-bottom:10px}
.s-phero-ey i{font-style:normal;display:inline-block;margin-right:8px;padding:3px 9px;border-radius:999px;background:var(--ear);color:#fff;font-size:12px;font-weight:700;vertical-align:1px}
.s-phero h1{font-size:clamp(32px,3.8vw,48px);color:var(--cocoa-d);letter-spacing:-.045em}
.s-phero-t>p:not(.s-phero-ey){margin-top:14px;color:var(--ink2);font-size:16px;max-width:28em}
.s-phero .s-tb-x{margin-top:22px}
.s-phero .s-count{display:inline-block;padding:9px 18px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:14.5px;color:var(--ink2)}
.s-phero .s-count b{font-size:17px;color:var(--cocoa-d)}
.s-phero-ph{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:22px;align-items:end}
.s-phero-ph>*{position:relative;display:block;background:#fff;padding:10px 10px 44px;border-radius:4px;text-decoration:none;box-shadow:0 18px 40px rgba(47,37,32,.16),0 2px 6px rgba(47,37,32,.06);transform:rotate(var(--r,0deg));transition:transform .35s var(--ease)}
.s-phero-ph>.p0{--r:-3deg}
.s-phero-ph>.p1{--r:2.5deg;transform:rotate(var(--r)) translateY(-18px)}
.s-phero-ph>.p2{--r:-1.5deg}
.s-phero-ph>a:hover{transform:rotate(0) translateY(-6px)}
.s-phero-ph img{display:block;width:100%;aspect-ratio:4/5;height:auto;object-fit:cover;border-radius:2px;background:var(--oat)}
.s-phero-ph>.p0 img{aspect-ratio:4/5.2}
.s-phero-ph>*>span{position:absolute;left:6px;right:6px;bottom:12px;text-align:center;font-size:14.5px;font-weight:600;color:var(--cocoa-d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-phero-ph em{font-style:normal;font-size:11px;font-weight:700;color:#fff;background:var(--ear);padding:1px 7px;border-radius:999px;margin-left:4px;vertical-align:1px}
@media (max-width:900px){
  .s-phero-in{grid-template-columns:1fr;gap:22px;padding-top:26px;padding-bottom:30px}
  .s-phero-t{text-align:center}.s-phero-t>p:not(.s-phero-ey){margin-left:auto;margin-right:auto;font-size:14.5px}
  .s-phero h1{font-size:30px}
  .s-phero .s-tb-x{margin-top:14px}
  .s-phero-ph{grid-template-columns:1.3fr 1fr;gap:12px;align-items:stretch;padding:4px 4px 8px}
  .s-phero-ph>*{display:flex;flex-direction:column;padding:6px 6px 30px}
  .s-phero-ph>.p0{grid-row:1/3}
  .s-phero-ph>.p1{transform:rotate(var(--r))}
  .s-phero-ph img,.s-phero-ph>.p0 img{flex:1;aspect-ratio:auto;min-height:0;height:100%}
  .s-phero-ph>.p0 img{min-height:250px}
  .s-phero-ph>.p1 img,.s-phero-ph>.p2 img{min-height:110px}
  .s-phero-ph>*>span{bottom:7px;font-size:12.5px}
  .s-phero-ph em{font-size:11px}
}

/* 홈 첫 화면 (휴대폰): 영상을 화면 가득 + 글은 영상 위에, 약속 3가지는 떠 있는 카드로 */
@media (max-width:700px){
  .s-hero2{margin-bottom:70px;overflow:visible}
  .s-hero2-in{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(500px,calc(100svh - 250px),680px);padding:0 22px 86px;color:#fff}
  .s-hero2-v{position:absolute;inset:0;height:auto;margin:0;-webkit-mask-image:none;mask-image:none;z-index:1;overflow:hidden}
  .s-hero2-v .s-bgv img,.s-hero2-v .s-bgv video{object-position:50% 30%}
  .s-hero2-v::after{display:block;opacity:1;background:linear-gradient(180deg,rgba(28,20,16,0) 30%,rgba(28,20,16,.38) 55%,rgba(28,20,16,.82) 100%)}
  .s-hero2-t{position:static;z-index:2}
  .s-hero2-t>*{position:relative;z-index:2}
  .s-hero2-t>.s-hero2-ey{color:#f3c9a9;font-size:13px;margin-bottom:10px}
  .s-hero2-t h1{color:#fff;font-size:31px;line-height:1.28;text-shadow:0 2px 18px rgba(0,0,0,.25)}
  .s-hero2-t .s-line{width:68%;margin:14px 0 12px}
  .s-hero2-t .s-line path{stroke:rgba(255,255,255,.85)}
  .s-hero2-t>p{color:rgba(255,255,255,.9);font-size:14.5px;line-height:1.65}
  .s-hero2-t .s-hero-btns{display:flex;gap:8px;margin-top:20px}
  .s-hero2-t .s-hero-btns .s-btn{flex:none;height:48px;padding:0 20px;font-size:15px;border-radius:999px}
  .s-hero2-t .s-hero-btns .s-btn-ink{background:#fff;color:var(--cocoa-d)}
  .s-hero2-t .s-hero-btns .s-btn-line{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.45);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
  .s-hero2-t .s-hero-btns .s-btn-line .ic{fill:currentColor;color:#ffb38a}
  .s-hero2-chip{z-index:3}
  .s-hero2-pts{position:absolute;left:14px;right:14px;bottom:-54px;z-index:3;margin:0;padding:16px 10px 14px;border:0;border-radius:20px;background:var(--paper);box-shadow:0 18px 40px rgba(47,37,32,.16);gap:4px;text-align:center}
  .s-hero2-pts li{display:flex;flex-direction:column;align-items:center}
  .s-hero2-pts li+li{border-left:1px solid var(--line2)}
  .s-hero2-pts .pi{width:34px;height:34px;border-radius:11px;margin-bottom:7px}
  .s-hero2-pts b{font-size:14px}
  .s-hero2-pts span{font-size:11.5px;line-height:1.4;padding:0 4px}
}

/* ---------------------------------------------------------------- 홈 첫 화면 v3: 영상 가득 + 가운데 정렬 + 떠 있는 약속 카드 */
.s-hero3{position:relative;overflow:hidden;min-height:min(82vh,780px);display:flex;align-items:center;justify-content:center;color:#fff;text-align:center;isolation:isolate;background:#2a211d}
.s-hero3-v{position:absolute;inset:0;z-index:-1}
.s-hero3-v .s-bgv{position:absolute;inset:0}
.s-hero3-v .s-bgv img,.s-hero3-v .s-bgv video{width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.s-hero3-v::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 52%,rgba(24,17,13,.52),rgba(24,17,13,.22) 70%),linear-gradient(180deg,rgba(24,17,13,.2),rgba(24,17,13,0) 30%,rgba(24,17,13,.45))}
.s-hero3-in{position:relative;display:flex;flex-direction:column;align-items:center;padding-top:64px;padding-bottom:110px}
.s-hero3 .mk{width:58px;height:auto;filter:brightness(0) invert(1);opacity:.92;margin-bottom:18px}
.s-hero3 .ey{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:600;letter-spacing:.08em;color:rgba(255,255,255,.88)}
.s-hero3 .ey::before,.s-hero3 .ey::after{content:"";width:28px;height:1px;background:rgba(255,255,255,.5)}
.s-hero3 h1{margin-top:16px;font-size:clamp(34px,4.4vw,60px);line-height:1.22;letter-spacing:-.045em;color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.25)}
.s-hero3 h1 em{font-style:normal;color:#ffd3b4;position:relative}
.s-hero3 .s-line{width:min(380px,70%);height:auto;margin:22px auto 16px}
.s-hero3 .s-line path{stroke:rgba(255,255,255,.8);fill:none;stroke-width:2}
.s-hero3 .ld{font-size:clamp(15px,1.4vw,18px);line-height:1.75;color:rgba(255,255,255,.9);max-width:34em}
.s-hero3 .btns{display:flex;gap:10px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.s-hero3 .s-btn{height:54px;padding:0 26px;border-radius:999px;font-size:16px;font-weight:700;gap:7px}
.s-hero3 .b1{background:#fff;color:var(--cocoa-d);border:0}
.s-hero3 .b1:hover{background:var(--milk)}
.s-hero3 .b2{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.5);color:#fff;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.s-hero3 .b2 .ic{fill:#ffb38a;color:#ffb38a}
.s-hero3 .nowlink{display:inline-flex;align-items:center;gap:7px;margin-top:22px;font-size:14px;color:rgba(255,255,255,.9);text-decoration:none;padding:7px 14px 7px 12px;border-radius:999px;background:rgba(0,0,0,.22)}
.s-hero3 .nowlink b{color:#ff8a7e;letter-spacing:.06em}
.s-hero3 .nowlink .nw-live{width:7px;height:7px}
.s-hero3-pw{position:relative;z-index:3;margin-top:-62px;margin-bottom:8px}
.s-hero3-pts{list-style:none;margin:0 auto;padding:22px 12px;max-width:900px;display:grid;grid-template-columns:repeat(3,1fr);background:var(--paper);border-radius:22px;box-shadow:0 22px 50px rgba(47,37,32,.14)}
.s-hero3-pts li{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 10px}
.s-hero3-pts li+li{border-left:1px solid var(--line2)}
.s-hero3-pts .pi{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#f8e6db;color:#9c522d;margin-bottom:10px}
.s-hero3-pts b{font-size:16px;color:var(--cocoa-d)}
.s-hero3-pts span{font-size:13.5px;color:var(--mute);margin-top:2px}
@media (max-width:700px){
  .s-hero3{min-height:clamp(500px,calc(100svh - 230px),700px)}
  .s-hero3-in{padding-top:40px;padding-bottom:84px}
  .s-hero3 .mk{width:46px;margin-bottom:14px}
  .s-hero3 .ey{font-size:12.5px;gap:8px}.s-hero3 .ey::before,.s-hero3 .ey::after{width:18px}
  .s-hero3 h1{font-size:31px;margin-top:12px}
  .s-hero3 .s-line{margin:16px auto 12px}
  .s-hero3 .ld{font-size:14.5px}
  .s-hero3 .btns{margin-top:22px;gap:8px}
  .s-hero3 .s-btn{height:48px;padding:0 18px;font-size:15px}
  .s-hero3 .nowlink{margin-top:16px;font-size:13px}
  .s-hero3-pw{margin-top:-50px}
  .s-hero3-pts{padding:16px 6px 14px;border-radius:20px}
  .s-hero3-pts li{padding:0 4px}
  .s-hero3-pts .pi{width:34px;height:34px;border-radius:11px;margin-bottom:7px}
  .s-hero3-pts b{font-size:14px}
  .s-hero3-pts span{font-size:11.5px;line-height:1.4}
}

/* 강아지·고양이: 타이틀 아래 오늘의 추천 3마리 (폴라로이드) */
.s-picks{padding:34px 0 30px;background:linear-gradient(180deg,var(--milk),var(--milk2))}
.s-picks-h{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14.5px;font-weight:600;color:var(--ink2);margin-bottom:22px}
.s-picks-h i{font-style:normal;padding:4px 11px;border-radius:999px;background:var(--ear);color:#fff;font-size:12.5px;font-weight:700}
.s-picks .s-phero-ph{max-width:640px;margin:0 auto}
@media (max-width:900px){.s-picks{padding:26px 0 22px}.s-picks-h{font-size:13.5px;margin-bottom:16px}}

/* 휴대폰: 오늘의 추천은 한 줄 3장으로 작게 (아래 목록이 바로 보이게) */
@media (max-width:900px){
  .s-picks{padding:16px 0 18px}
  .s-picks-h{margin-bottom:12px}
  .s-picks .s-phero-ph{grid-template-columns:repeat(3,1fr);gap:10px;padding:2px 2px 6px}
  .s-picks .s-phero-ph>*{padding:5px 5px 26px}
  .s-picks .s-phero-ph>.p0{grid-row:auto}
  .s-picks .s-phero-ph>.p1{transform:rotate(var(--r)) translateY(6px)}
  .s-picks .s-phero-ph img,.s-picks .s-phero-ph>.p0 img{flex:none;aspect-ratio:4/5;min-height:0;height:auto}
  .s-picks .s-phero-ph>*>span{font-size:11.5px;bottom:6px}
  .s-picks .s-phero-ph em{display:none}
}
/* 꼬똥 타이틀: 양옆 사진이 안쪽·아래로 부드럽게 녹아들게 */
.s-tb.coton{background:var(--milk)}
.s-tb.coton img.l{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent),linear-gradient(0deg,transparent,#000 35%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#000 45%,transparent),linear-gradient(0deg,transparent,#000 35%);mask-composite:intersect}
.s-tb.coton img.r{-webkit-mask-image:linear-gradient(270deg,#000 45%,transparent),linear-gradient(0deg,transparent,#000 35%);-webkit-mask-composite:source-in;mask-image:linear-gradient(270deg,#000 45%,transparent),linear-gradient(0deg,transparent,#000 35%);mask-composite:intersect}
@media (max-width:700px){.s-tb.coton img{top:0;height:41.7vw;width:42%}}
.s-section.s-first{padding-top:48px}
@media (max-width:700px){.s-section.s-first{padding-top:28px}}
/* 글 보기: 아이 프로필 (기본 정보 + 매니저 노트) */
.s-prof{margin:4px 0 30px}
.s-prof-facts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.s-prof-facts li{flex:1 1 0;min-width:110px;padding:14px 16px}
.s-prof-facts li+li{border-left:1px solid var(--line2)}
.s-prof-facts span{display:block;font-size:12.5px;color:var(--mute)}
.s-prof-facts b{display:block;font-size:15.5px;color:var(--cocoa-d);margin-top:3px;line-height:1.4}
.s-prof-note{margin-top:18px;padding:20px 22px;border-radius:18px;background:linear-gradient(160deg,#fbf3ec,#f6e7dc)}
.s-prof-note .who{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.s-prof-note .who img{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:50%;padding:6px}
.s-prof-note .who b{display:block;font-size:14px;color:#9c522d}
.s-prof-note .who small{display:block;font-size:12px;color:var(--mute)}
.s-prof-note p{font-size:15.5px;line-height:1.85;color:var(--ink);position:relative;padding-left:16px;border-left:2px solid rgba(192,118,76,.4)}
@media (max-width:600px){.s-prof-facts li{flex:1 1 40%;min-width:0;padding:12px}.s-prof-facts li:nth-child(odd){border-left:0}.s-prof-facts li:nth-child(n+3){border-top:1px solid var(--line2)}.s-prof-note{padding:18px}.s-prof-note p{font-size:15px}}

/* 찜한 아이와 함께 예약 */
}
.talk-likes{display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 16px;border-radius:999px;background:var(--ear);color:#fff;font-size:14px;font-weight:700;text-decoration:none;box-shadow:0 8px 22px rgba(192,118,76,.35);animation:pop .4s var(--ease)}
.talk-likes[hidden]{display:none}
.talk-likes .ic{fill:currentColor}
.s-nav-resv{display:none}
@media (max-width:1100px){
  .s-nav-resv{display:flex;align-items:center;gap:8px;margin-top:22px;height:56px;padding:0 16px;border-radius:16px;background:var(--cocoa-d);color:#fff;text-decoration:none;font-size:16px;font-weight:700}
  .s-nav-resv>.ic:last-child{margin-left:auto}
  .s-nav-resv span{font-size:12.5px;font-weight:600;color:#f3c79d;margin-left:4px}
}

/* ---------------- NOW · 가족을 기다려요 */
.nw-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--paper);border:1px solid var(--line);margin-bottom:22px}
.nw-tabs a{display:inline-flex;align-items:center;gap:7px;padding:8px 18px;border-radius:999px;text-decoration:none;font-weight:700;font-size:14.5px;color:var(--ink2);white-space:nowrap}
.nw-tabs a.on{background:var(--cocoa-d);color:#fff}
.nw-cap small.nw-g{color:var(--ear);font-weight:600}
.wt-eye{color:#8a5a3c;letter-spacing:.06em}
.wt-strip{padding-top:8px}
.nv-info .tag.wait{background:#8a5a3c}
.nv-grow{margin-top:8px;font-size:15px;color:#ffd3b4}.nv-grow b{color:#fff}
.nv-grow small{display:block;font-size:11.5px;color:rgba(255,255,255,.6);margin-top:1px}
.wt-pts{list-style:none;padding:0;margin:26px auto 0;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;max-width:760px}.wt-pts li{flex:1 1 260px}
.wt-pts li{flex:1 1 200px;background:var(--paper);border:1px solid var(--line2);border-radius:16px;padding:14px 16px;text-align:center}
.wt-pts b{display:block;color:var(--cocoa-d);font-size:15.5px}.wt-pts span{display:block;font-size:13px;color:var(--mute)}
.wt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
@media (max-width:860px){.wt-grid{grid-template-columns:1fr;gap:12px}}
.wt-card{display:flex;gap:18px;background:var(--paper);border:1px solid var(--line2);border-radius:var(--r-panel);padding:14px;box-shadow:0 1px 0 rgba(47,37,32,.03)}
.wt-v{flex:0 0 150px}
.wt-rep{flex:1;min-width:0;display:flex;flex-direction:column;padding:4px 2px}
.wt-k{font-size:12px;font-weight:700;letter-spacing:.12em;color:#8a5a3c}
.wt-rep h3{font-size:22px;color:var(--cocoa-d);margin-top:2px}
.wt-tags{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-wrap:wrap;gap:5px}
.wt-tags li{font-size:12.5px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--milk2);color:var(--ink2)}
.wt-now{display:flex;gap:16px;margin:14px 0 0;flex-wrap:wrap}
.wt-now div{min-width:0}.wt-now dt{font-size:12px;color:var(--mute)}
.wt-now dd{margin:0;font-size:22px;font-weight:800;color:var(--cocoa-d);letter-spacing:-.03em;line-height:1.25}
.wt-now dd small{font-size:13px;font-weight:600;margin-left:1px;color:var(--ink2)}
.wt-now .adult dd{color:var(--ear)}
.wt-bar{position:relative;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--oat),#f3d8c4);margin:10px 0 2px}
.wt-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--cocoa)}
.wt-bar s{position:absolute;top:-3px;bottom:-3px;width:2px;border-radius:2px;background:var(--ear);text-decoration:none}
.wt-cap{margin-top:10px;font-size:14px;color:var(--ink2);line-height:1.55}
.wt-btns{margin-top:auto;padding-top:14px;display:flex;gap:6px;flex-wrap:wrap}
.wt-note{margin:22px auto 0;max-width:46em;text-align:center;font-size:12.5px;color:var(--mute)}
@media (max-width:560px){
  .wt-card{gap:12px;padding:10px;border-radius:18px}.wt-v{flex-basis:112px}
  .wt-rep h3{font-size:19px}.wt-now{gap:12px;margin-top:10px}.wt-now dd{font-size:19px}
  .wt-pts{gap:6px}.wt-pts li{flex-basis:100%;display:flex;justify-content:space-between;align-items:center;padding:11px 14px;text-align:left}
  .wt-btns .s-btn{flex:1;padding-left:8px;padding-right:8px}
}
.nv-s.late .nv-info>:not(.nv-btns){transition:opacity .5s}
.nv-s.late:not(.show):not(.paused) .nv-info>:not(.nv-btns){opacity:0}

/* ---------------- 잇다펫 마크: 빨간 점 + 킁킁 (PC·휴대폰 공통) */
.talk-badge{top:1px;right:1px;min-width:0;width:15px;height:15px;padding:0;border-radius:50%;background:#e2493b;border:2.5px solid var(--paper);box-shadow:0 2px 6px rgba(226,73,59,.45)}
.talk.unread .talk-fab{animation:none}
.talk.sniff .talk-fab img{animation:sniff 1.5s ease-in-out 1;transform-origin:50% 62%}
@keyframes sniff{0%,100%{transform:none}8%{transform:translateY(-1px) scale(1.07,.93)}16%{transform:none}24%{transform:translateY(-1px) scale(1.07,.93)}32%{transform:none}52%{transform:rotate(-5deg)}60%{transform:translateY(-1px) scale(1.06,.94) rotate(-3deg)}68%{transform:none}}
.talk.sniff .talk-fab::after{content:"";position:absolute;left:4px;top:30%;width:9px;height:9px;border-radius:50%;border:2px solid var(--oat2);border-right-color:transparent;border-bottom-color:transparent;opacity:0;animation:sniffAir 1.5s ease-out 1}
@keyframes sniffAir{10%,26%{opacity:.9;transform:translate(-3px,-2px) scale(1)}40%{opacity:0;transform:translate(-9px,-6px) scale(1.3)}}
@media (max-width:800px){
  .talk{display:flex;right:14px;bottom:calc(var(--mcbh,0px) + 12px);gap:10px}
  .talk .talk-likes,.talk .talk-top{display:none}
  .talk-fab{width:52px;height:52px;padding:8px}
  .talk-card{width:min(330px,calc(100vw - 28px))}
  .talk-ph{width:56px;height:56px}
  .talk-x{width:28px;height:28px;top:-11px;left:-11px}
  body.resv-page .talk,body.match-page .talk,body.nv-open .talk{display:none}
}

/* ---------------- 찜한 아이 창 */
.s-likes{width:min(420px,calc(100vw - 24px))}
.lk-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px}
.lk-head .s-sheet-t{margin:0;text-align:left}.lk-head .s-sheet-t b{color:var(--ear)}
.lk-clear{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;color:var(--mute);cursor:pointer;white-space:nowrap}
.lk-clear.arm{background:#e2493b;border-color:#e2493b;color:#fff}
.lk-hint{font-size:12.5px;color:var(--mute);margin-bottom:6px}
.lk-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:min(52vh,420px);overflow:auto;padding:4px 2px 2px}
.lk-l li{position:relative}
.lk-l a{display:block;text-decoration:none;color:var(--cocoa-d)}
.lk-l img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;background:var(--oat)}
.lk-l span{display:block;font-size:12.5px;font-weight:600;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.lk-l button{position:absolute;top:-4px;right:-4px;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink2);font-size:16px;line-height:1;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.1)}
.lk-empty{text-align:center;font-size:14px;color:var(--mute);padding:22px 0}
.lk-go{margin-top:10px;width:100%;justify-content:center}
@media (max-width:800px){
  .s-likes{margin:auto 0 0;width:100%;max-width:100%;border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom)}
  .s-likes[open]{animation:upSheet .28s var(--ease)}
}
@keyframes upSheet{from{transform:translateY(40%);opacity:.4}}

/* ---------------- 휴대폰 타이틀: 사진 띠 안에 제목·마릿수를 함께 → 아래 빈칸 없앰 */
@media (max-width:700px){
  .s-tb.pet .s-tb-in{height:41.7vw;padding:0 26vw;display:flex;flex-direction:column;align-items:center;justify-content:center}
  .s-tb.pet h1{height:auto;margin:0;padding:0}
  .s-tb.pet .s-tb-x{margin-top:8px}
  .s-tb.pet .s-count{padding:5px 12px;font-size:12.5px;background:rgba(255,255,255,.9);box-shadow:0 2px 10px rgba(47,37,32,.08);white-space:nowrap}
  .s-tb.pet .s-count b{font-size:14px}
  .s-tb.pet + .s-picks{padding-top:6px}
  .s-tb:not(.pet):not(.slim) .s-tb-in{padding-bottom:18px}
}
.wt-pts li.hl{background:#fbefe6;border-color:#f0d3bf}.wt-pts li.hl b{color:#9a5530}
.wt-gift{display:flex;align-items:center;gap:16px;max-width:760px;margin:14px auto 0;padding:18px 20px;border-radius:20px;background:var(--paper);border:1px solid #f0d3bf;text-align:left;box-shadow:0 8px 24px rgba(192,118,76,.08)}
.wt-gift-ic{flex:none;width:44px;height:44px;border-radius:50%;background:var(--ear);color:#fff;display:grid;place-items:center}
.wt-gift-ic .ic{fill:currentColor}
.wt-gift p{flex:1;font-size:14px;color:var(--ink2);line-height:1.6}
.wt-gift p b{display:block;font-size:16px;color:var(--cocoa-d);margin-bottom:2px}
.wt-gift em{font-style:normal;font-weight:700;color:#9a5530}
.wt-gift .s-btn{flex:none}
@media (max-width:560px){.wt-gift{flex-wrap:wrap;padding:16px}.wt-gift-ic{width:38px;height:38px}.wt-gift p{flex-basis:calc(100% - 54px)}.wt-gift .s-btn{width:100%;justify-content:center}}
.s-tb.coton img{object-position:50% 35%}
.s-picks.n1 .s-phero-ph,.s-picks.n2 .s-phero-ph{display:flex;justify-content:center}
.s-picks.n1 .s-phero-ph>*,.s-picks.n2 .s-phero-ph>*{flex:0 0 31%}
/* PC 메인 영상: 세로를 줄여 첫 화면에 다음 내용이 보이게 */
@media (min-width:1101px){
  .s-hero3{min-height:min(62vh,600px)}
  .s-hero3-in{padding-top:36px;padding-bottom:92px}
  .s-hero3 .mk{width:46px;margin-bottom:12px}
  .s-hero3 h1{margin-top:12px;font-size:clamp(34px,3.4vw,52px)}
  .s-hero3 .s-line{margin:14px auto 10px;width:min(320px,60%)}
  .s-hero3 .btns{margin-top:22px}
}
@media (max-width:700px){.s-tb.pet + .s-section{padding-top:40px}}
/* 가족을 기다려요: 장점 세 가지를 한 줄로 좁게 */
.wt-pts{max-width:720px;gap:8px;margin-top:22px}
.wt-pts li{flex:1 1 0;padding:10px 12px;border-radius:14px}
.wt-pts b{font-size:14.5px}.wt-pts span{font-size:12px}
.wt-pts li.hl{background:#fbefe6;border-color:#f0d3bf}.wt-pts li.hl b{color:#9a5530}
@media (max-width:560px){
  .wt-pts{gap:6px;margin-top:18px;flex-wrap:nowrap}
  .wt-pts li{flex:1 1 0;display:block;padding:9px 6px;text-align:center}
  .wt-pts b{font-size:12.5px;line-height:1.35;word-break:keep-all}.wt-pts span{display:none}
}
/* 가족을 기다려요 장점: 휴대폰은 가운데 정렬 + 누르면 아래에 설명 */
.wt-pts-d{display:none}
@media (max-width:560px){
  .wt-pts li{display:flex;align-items:center;justify-content:center;min-height:52px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .2s,background .2s}
  .wt-pts li.on{border-color:var(--cocoa)}
  .wt-pts li.hl.on{border-color:var(--ear)}
  .wt-pts-d{display:block;max-width:720px;margin:8px auto 0;font-size:13px;color:var(--ink2);min-height:0;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s}
  .wt-pts-d.on{opacity:1;transform:none}
}
.nv-s.burned .nv-info>:not(.nv-btns){display:none}
/* NOW 카드: 장면 3장이 천천히 겹쳐 바뀜 (영상 미리보기보다 가볍고 바로 보임) */
.nw-sh{position:absolute;inset:0;z-index:1}
.nw-sh i{position:absolute;inset:0;background-size:100% 300%;background-repeat:no-repeat;opacity:0}
.nw-sh.go i{animation:nwSh 9s ease-in-out infinite;will-change:opacity,transform}
.nw-sh i:nth-child(1){background-position:0 0;animation-delay:0s}
.nw-sh i:nth-child(2){background-position:0 50%;animation-delay:3s}
.nw-sh i:nth-child(3){background-position:0 100%;animation-delay:6s}
@keyframes nwSh{0%{opacity:0;transform:scale(1)}8%{opacity:1}33%{opacity:1}41%{opacity:0;transform:scale(1.06)}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.nw-sh i{animation:none}.nw-sh i:nth-child(1){opacity:1}}
.nw-ph::after{z-index:1}
/* ---------------- NOW 보기 창: 쇼츠처럼 왼쪽 아래 작은 글 + 오른쪽 세로 버튼 */
.nv-info{padding:0 84px calc(20px + env(safe-area-inset-bottom)) 16px}
.nv-info .nv-ttl{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0}
.nv-info .nv-ttl b{font-size:16px;font-weight:700;letter-spacing:-.02em;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.nv-info .nv-ttl em{font-style:normal;font-size:11px;font-weight:700;padding:2px 7px;border-radius:4px;background:var(--ear)}.nv-info .nv-ttl em.wait{background:#8a5a3c}
.nv-hash{font-size:13.5px;font-weight:600;margin-top:4px;color:rgba(255,255,255,.92);text-shadow:0 1px 6px rgba(0,0,0,.45)}
.nv-sub{font-size:12.5px;margin-top:3px;color:#ffd3b4}
.nv-cap{font-size:13.5px;margin-top:4px;line-height:1.45;opacity:.9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.nv-toast{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:8px 12px;border-radius:8px;background:rgba(255,255,255,.95);color:var(--cocoa-d);font-size:13px;text-decoration:none;animation:pop .35s var(--ease)}
.nv-toast[hidden]{display:none}.nv-toast .ic{fill:#e2493b;color:#e2493b}.nv-toast b{color:var(--ear)}
.nv-rail{position:absolute;right:8px;bottom:calc(22px + env(safe-area-inset-bottom));z-index:3;display:flex;flex-direction:column;align-items:center;gap:16px}
.nv-r{position:static!important;width:56px!important;height:auto!important;border-radius:0!important;transform:none!important;display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:none!important;box-shadow:none!important;color:#fff!important;text-decoration:none;font-size:12px;font-weight:600;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
.nv-r .ic{width:46px;height:46px;padding:10px;border-radius:50%;background:rgba(0,0,0,.32);box-sizing:border-box;filter:drop-shadow(0 1px 3px rgba(0,0,0,.3))}
.nv-r span{text-shadow:0 1px 4px rgba(0,0,0,.5)}
.nv-r[data-like] .on{display:none}.nv-r[data-like][aria-pressed="true"] .on{display:inline}.nv-r[data-like][aria-pressed="true"] .off{display:none}
.nv-r[data-like][aria-pressed="true"] .ic{color:#ff4d5e;fill:#ff4d5e}
.nv-r.pop .ic{animation:pop .35s var(--ease)}
.nv-shade{height:40%}
.nv-pf{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.nv-pf .av{width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.nv-f .nv-pf .av img{position:static!important;inset:auto!important;width:24px!important;height:auto!important;object-fit:contain!important;background:none!important;visibility:visible!important}
.nv-pf b{font-size:14.5px;font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.45)}.nv-pf small{font-size:12.5px;opacity:.75}
.nv-rail{gap:6px}
/* 타이틀 아래 아이콘 칩 (방문예약) */
.s-count .s-ichip{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.s-count .s-ichip+.s-ichip{margin-left:12px;padding-left:12px;border-left:1px solid var(--line)}
.s-count .s-ichip svg{color:var(--cocoa-d);flex:none}
@media (max-width:420px){.s-count .s-ichip+.s-ichip{margin-left:8px;padding-left:8px}.s-tb .s-count:has(.s-ichip){font-size:12.5px;padding:7px 12px}}
/* 인연찾기: 처음 한 번에 고르는 질문 · 넘기는 방법 한 줄 */
.mt-how{display:flex;justify-content:space-between;gap:10px;max-width:420px;margin:0 auto 10px;font-size:13.5px;font-weight:600;color:var(--ink2)}
.mt-how span{display:inline-flex;align-items:center;gap:5px}.mt-how span:first-child svg{color:var(--mute)}.mt-how span:last-child svg{color:#e2574c}
.mt-f{justify-content:flex-start;padding:22px 18px 16px;overflow-y:auto;text-align:left}
.mt-f .qn{text-align:center;font-size:14.5px;font-weight:700;color:var(--cocoa-d);margin-bottom:6px}
.mt-f .fq{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.mt-f .fg b{display:block;font-size:13px;color:#b0623a;margin-bottom:6px}
.mt-f .fo{display:flex;flex-wrap:wrap;gap:6px}
.mt-f .fo button{flex:1 1 auto;min-width:0;height:40px;padding:0 12px;border-radius:12px;border:1px solid rgba(156,82,45,.22);background:var(--paper);font-size:14px;font-weight:600;color:var(--cocoa-d);cursor:pointer}
.mt-f .fo button.on{background:var(--cocoa-d);border-color:var(--cocoa-d);color:#fff}
.mt-f .fgo{margin-top:16px;height:50px;border-radius:14px;border:0;background:#e2574c;color:#fff;font-size:15.5px;font-weight:700;cursor:pointer}
.mt-f .fall{margin-top:6px;height:40px;border:0;background:transparent;color:var(--ink2);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mt-deck.asking~.mt-ctrl .mt-b{opacity:.35;pointer-events:none}
.mt-f .fq{gap:10px}.mt-f .fo button{height:38px}.mt-f .fgo{margin-top:14px;height:48px;flex:none}.mt-f .fall{flex:none}
.mt-f .qt2{text-align:center;font-size:20px;font-weight:800;letter-spacing:-.03em;color:var(--cocoa-d);margin:6px 0 2px}
.mt-f .qn{font-size:13.5px;font-weight:600;color:#b0623a;margin-bottom:4px}
/* 메인 비주얼·메뉴 타이틀만 디자인 글꼴 (WORKS → 홈페이지 → 설정 → 타이틀 글꼴) */
.s-hero3 h1,.s-tb h1,.s-phero h1,.nw-hero h1,.mt-top h1,.s-mband-t h2,.s-h2,.s-band-in h2,.s-promise-head h2,.s-promise h3{font-family:var(--font-title,var(--font));font-weight:var(--tw,700);letter-spacing:-.02em}
.s-hero3 h1{line-height:1.25}
/* 미용관리 강조: 첫 화면 세 번째 칸 · 멤버십 섹션 사진 줄 */
.s-hero3-pts li.hl a{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit}
.s-hero3-pts li.hl .pi{background:#c0764c;color:#fff}
.s-hero3-pts li.hl b{color:#a8552c}
.s-hero3 .ld b{color:#ffd3b4;font-weight:700}
.s-hl{font-style:normal;color:#a8552c;background:linear-gradient(transparent 62%,#f8dcc8 62%)}
.s-bty{display:flex;align-items:center;gap:8px;margin:18px 0 0;text-decoration:none;color:var(--cocoa-d);font-size:14px;font-weight:700}
.s-bty img{width:58px;height:58px;border-radius:12px;object-fit:cover;flex:none;box-shadow:0 4px 12px rgba(60,40,30,.12)}
.s-bty span{display:inline-flex;align-items:center;gap:3px;margin-left:6px;white-space:nowrap}
@media (max-width:800px){.s-bty{flex-wrap:wrap}.s-bty img{flex:1 1 0;min-width:0;width:auto;height:auto;aspect-ratio:1;max-width:84px}.s-bty span{flex-basis:100%;margin:4px 0 0}}
/* 지점 페이지 */
.s-branch h3 a{color:inherit;text-decoration:none}.s-branch h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.s-bpg-h{text-align:center;margin:10px 0 26px}
.s-bpg{max-width:760px;margin:40px auto 0;font-size:16.5px;line-height:1.85;color:var(--ink2)}
.s-bpg h2{margin:34px 0 12px}.s-bpg p{margin:0 0 14px}
.s-bpg blockquote{margin:26px 0;padding:18px 22px;border-left:4px solid var(--cocoa);background:var(--paper);border-radius:0 14px 14px 0;font-size:18px;font-weight:600;color:var(--cocoa-d)}
.s-bpg figure{margin:24px 0}.s-bpg figure img{width:100%;border-radius:18px;display:block}.s-bpg figcaption{font-size:13.5px;color:var(--mute);margin-top:8px;text-align:center}
/* PC: 타이틀 띠 바로 아래 콘텐츠 간격 (지점안내·이벤트·입양안내) */
@media (min-width:801px){.s-section.after-tb{padding-top:64px!important}}
/* 감성 문구도 타이틀 글꼴 (브랜드 이야기 첫 화면 · 맨 아래 예약 띠) */
.s-hero h1,.s-cta h2{font-family:var(--font-title,var(--font));font-weight:var(--tw,700);letter-spacing:-.02em}

/* 네이버 N 로고는 제목 글꼴(명조)을 따르지 않음 */
.s-h2 .n,.n{font-family:var(--font);letter-spacing:0}
/* 목록 아래 안내·품종 링크 (검색용이지만 사람이 읽어도 자연스럽게) */
.s-seo{margin-top:56px;padding-top:36px;border-top:1px solid var(--line2);color:var(--ink2);font-size:14.5px;line-height:1.8}
.s-seo h2{font-size:19px;color:var(--cocoa-d);margin:0 0 8px;font-family:var(--font)}
.s-seo h3{font-size:15px;color:var(--cocoa-d);margin:22px 0 10px}
.s-seo a{color:var(--cocoa-d);text-underline-offset:3px}
.s-seo-tags{display:flex;flex-wrap:wrap;gap:6px}
.s-seo-tags a{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:13px;text-decoration:none}
.s-seo-tags a.on{background:var(--cocoa-d);color:#fff;border-color:var(--cocoa-d)}
.s-seo-tags small{color:var(--mute);font-size:11.5px}.s-seo-tags a.on small{color:#e8dccf}
.s-seo-more{margin-top:18px;font-size:13.5px}
/* 지점 페이지: 매장 소개 영상 · 블로그 후기 */
.s-bpg-v{max-width:880px;margin:0 auto 28px}.s-bpg-v .s-yt{width:100%}
.s-blogs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.s-blogs a{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px 20px;border-radius:16px;background:var(--paper);border:1px solid var(--line2);text-decoration:none;color:var(--ink);transition:border-color .15s}
.s-blogs a:hover{border-color:var(--cocoa)}
.s-blogs b{font-size:15.5px;line-height:1.45;color:var(--cocoa-d)}
.s-blogs .d{font-size:13.5px;color:var(--ink2);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.s-blogs .m{font-size:12.5px;color:var(--mute);margin-top:auto}
@media (max-width:800px){.s-blogs{grid-template-columns:1fr}}
/* 인연찾기 '비슷한 아이도 보실래요?' · 세부 페이지 NOW·인연찾기 띠 */
.mt-sim{justify-content:center;text-align:center}
.mt-sim .fgo{width:100%}.mt-sim .fgo.alt{background:var(--paper);color:var(--cocoa-d);border:1px solid rgba(156,82,45,.25);margin-top:8px}
.mt-sim .fall{display:block;margin-top:10px;text-align:center}
.s-mband-sm{padding:40px 0}
@media (max-width:800px){.s-mband-sm{padding:28px 0}.s-mband-sm .s-mband-deck{max-width:300px;margin:0 auto}}
.nw-land{padding-top:28px}
/* 세부 페이지 짧은 띠: 예전 '오늘의 추천' 높이 — 인연찾기 칸 + NOW 영상 */
.s-quick{padding:22px 0 18px;background:linear-gradient(180deg,var(--milk),var(--milk2))}
.s-tb.pet + .s-quick{padding-top:14px}
.s-quick-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font-size:14px;color:var(--ink2)}
.s-quick-h span{display:inline-flex;align-items:center;gap:6px}.s-quick-h b{color:#d6453a;font-weight:800;letter-spacing:.04em}
.s-quick-h a{font-size:13px;color:var(--ink2);text-decoration:none;white-space:nowrap}
.s-quick-row{gap:10px;padding-bottom:4px}
.s-quick-row>*{flex:0 0 132px;scroll-snap-align:start}
.s-quick-row .nw-ph{aspect-ratio:4/5;border-radius:14px}
.s-quick-row .nw-cap{display:block;margin-top:6px;font-size:13px;line-height:1.35}.s-quick-row .nw-cap small{display:none}
.s-quick-row .nw-cap small.nw-g{display:none}
.s-quick-mt{position:relative;display:block;aspect-ratio:4/5;border-radius:14px;overflow:hidden;text-decoration:none;color:#fff;background:#2a211d}
.s-quick-mt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.75}
.s-quick-mt .t{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:12px;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(214,69,58,.92))}
.s-quick-mt .t svg{color:#fff}.s-quick-mt b{font-size:15px}.s-quick-mt small{font-size:12px;line-height:1.35;opacity:.95}
@media (min-width:901px){.s-quick-row>*{flex-basis:150px}}
@media (max-width:600px){.s-quick-row>*{flex-basis:30vw}.s-quick-row .nw-card{flex-basis:30vw}}
.s-quick{padding:16px 0 12px}.s-tb.pet + .s-quick{padding-top:10px}.s-quick-h{margin-bottom:8px}
.s-quick-row .nw-cap{margin-top:4px;font-size:12.5px}
@media (max-width:600px){.s-quick-row>*,.s-quick-row .nw-card{flex-basis:28vw}}
/* 짧은 띠 v2: 영상은 원래 비율(9:16) · 이름은 영상 위에 / 인연찾기는 아래 가로 띠로 구분 */
.s-quick-row>*,.s-quick-row .nw-card{flex:0 0 96px}
.s-quick-row .nw-card{position:relative}
.s-quick-row .nw-ph{aspect-ratio:9/16;border-radius:12px}
.s-quick-row .nw-cap{position:absolute;left:0;right:0;bottom:0;margin:0;padding:18px 8px 7px;border-radius:0 0 12px 12px;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.62));color:#fff;font-size:11.5px;font-weight:700;pointer-events:none;z-index:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-quick-row .nw-cap b{font-weight:700}
.s-quick-row .nw-pl{display:none}
.s-quick-row .nw-new{transform:scale(.85);transform-origin:top left}
@media (min-width:901px){.s-quick-row>*,.s-quick-row .nw-card{flex-basis:112px}}
.s-quick-mt{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 12px 10px 10px;border-radius:14px;background:#fff1ec;border:1px solid #f6cfc3;text-decoration:none;color:var(--cocoa-d);aspect-ratio:auto;overflow:visible}
.s-quick-mt .hi{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#e2574c;color:#fff}
.s-quick-mt .t{position:static;flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;padding:0;background:none}
.s-quick-mt .t b{font-size:14.5px;color:#c2412f}.s-quick-mt .t small{font-size:12.5px;color:var(--ink2);line-height:1.4;opacity:1}
.s-quick-mt .pk{flex:none;display:flex}
.s-quick-mt .pk img{position:static;width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-left:-10px;opacity:1;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.s-quick-mt .pk img:first-child{margin-left:0}
.s-quick-mt .ar{flex:none;color:#c2412f}
/* 빠른 띠 v3 — 높이 줄이기 (옛 오늘의 추천 정도) */
.s-quick{padding:14px 0 10px}.s-tb.pet + .s-quick{padding-top:8px}.s-quick-h{margin-bottom:7px;font-size:13.5px}
.s-quick-row{gap:8px;padding-bottom:2px}
.s-quick-row>*,.s-quick-row .nw-card{flex:0 0 80px}
.s-quick-row .nw-ph{border-radius:11px}
.s-quick-row .nw-cap{padding:16px 6px 6px;font-size:11px;border-radius:0 0 11px 11px}
@media (min-width:901px){.s-quick-row>*,.s-quick-row .nw-card{flex-basis:104px}}
.s-quick-mt{margin-top:8px;padding:6px 10px 6px 7px;gap:10px;border-radius:12px}
.s-quick-mt .hi{width:30px;height:30px}
.s-quick-mt .t b{font-size:14px}.s-quick-mt .t small{font-size:12px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-quick-mt .pk img{width:28px;height:28px}
/* SEO 안내 블록 — 조용하게 */
.s-seo{margin-top:40px;padding-top:24px;font-size:13px;line-height:1.75;color:var(--mute)}
.s-seo h2{font-size:15px;margin-bottom:6px}
.s-seo-tags{display:block;margin-top:12px;font-size:12.5px;line-height:1.9}
.s-seo-tags b{color:var(--ink2);font-weight:700;margin-right:4px}
.s-seo-tags a{display:inline;padding:0;border:0;background:none;border-radius:0;font-size:inherit;color:var(--ink2);text-decoration:none}
.s-seo-tags a.on{background:none;color:var(--cocoa-d);font-weight:700}
.s-seo-more{margin-top:10px;font-size:12.5px}
/* NOW 작은 카드: 제목 없이 영상만 (작은 글씨는 안 읽혀서) */
.s-quick-row .nw-cap{display:none}
/* SEO 안내 블록 — 읽는 글은 본문 기준 (15px), 링크 줄은 14px. 사이트 글자 기준: 본문 15~16 · 보조 13~14 · 배지 최소 11 */
.s-seo{margin-top:44px;padding-top:28px;font-size:15px;line-height:1.75;color:var(--ink2)}
.s-seo h2{font-size:17px;margin-bottom:8px}
.s-seo-tags{margin-top:14px;font-size:14px;line-height:1.9}
.s-seo-more{margin-top:12px;font-size:14px}
/* 빨간 점 위 말풍선 — 처음에만 (소식을 열어 보고 닫으면 다음부터는 점만) */
.talk-fabw{position:relative;display:inline-flex}
.talk-hint{position:absolute;right:0;bottom:calc(100% + 12px);display:flex;flex-direction:column;align-items:flex-end;gap:1px;padding:9px 13px 9px 14px;border-radius:14px 14px 4px 14px;background:var(--cocoa-d);color:#fff;white-space:nowrap;box-shadow:0 10px 26px rgba(47,37,32,.22);opacity:0;transform:translateY(6px) scale(.96);transform-origin:bottom right;pointer-events:none;transition:opacity .25s,transform .25s}
.talk-hint::after{content:"";position:absolute;right:20px;bottom:-6px;width:12px;height:12px;background:var(--cocoa-d);transform:rotate(45deg);border-radius:2px}
.talk-hint b{font-size:14px;font-weight:700;line-height:1.35}
.talk-hint small{font-size:13px;opacity:.85;line-height:1.35}
.talk.unread:not(.open):not(.hint-off) .talk-hint{opacity:1;transform:none;animation:hintBob 2.4s ease-in-out .3s infinite}
@keyframes hintBob{0%,100%{transform:none}50%{transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.talk.unread .talk-hint{animation:none}}
/* 말풍선 작게 — 주목보다 '살짝 알림' 정도 */
.talk-hint{bottom:calc(100% + 7px);display:block;padding:4px 10px;border-radius:999px;background:var(--paper);color:var(--cocoa-d);border:1px solid var(--line);font-size:12px;font-weight:600;line-height:1.5;box-shadow:0 4px 12px rgba(47,37,32,.1)}
.talk-hint::after{display:none}
.talk.unread:not(.open):not(.hint-off) .talk-hint{animation:none}
/* 메인 설명: 문장마다 한 줄씩. 한 문장이 한 줄에 안 들어가는 아주 좁은 화면(폴드 바깥 화면 등)에서는 억지로 끊지 않고 이어서 */
.s-hero3 .ld{max-width:40em}
.s-hero3 .ld-s{display:block}
@media (max-width:319px){.s-hero3 .ld-s{display:inline}}
/* 메인 첫 화면 하이라이트 (NOW 영상 클린 구간) — 휴대폰 1칸, PC는 영상 수만큼 최대 3칸 */
.s-reel .rl{position:absolute;inset:0;display:grid;grid-template-columns:1fr;gap:3px;background:#2a211d}
.s-reel .rl:empty{display:none}
.s-reel .rl video{position:relative;inset:auto;width:100%;height:100%;object-fit:cover;object-position:50% 40%;opacity:0;transition:opacity .9s ease;background:transparent}
.s-reel .rl video.on{opacity:1}
.s-reel .rl video:nth-child(n+2){display:none}
.s-reel .rl{background:transparent}
@media (min-width:801px){
  .s-reel[data-n="2"] .rl{grid-template-columns:1fr 1fr}
  .s-reel[data-n="3"] .rl{grid-template-columns:1fr 1fr 1fr}
  .s-reel .rl video:nth-child(n+2){display:block}
}
/* 메인 비주얼: PC는 기본 가로 영상, 휴대폰만 NOW */
.hv-pcv{display:none}
@media (min-width:801px){.hv-pcv{display:block;position:absolute;inset:0}.hv-pcv .s-bgv{position:absolute;inset:0}.s-reel.m-only{display:none}}
/* 메인 비주얼 v2: PC층·휴대폰층을 따로 (보이는 쪽만 영상을 받음) */
.hv-pcl,.hv-mol{position:absolute;inset:0}
.hv-pcl{display:none}
@media (min-width:801px){.hv-pcl{display:block}.hv-mol{display:none}}
.hv-pcl .s-reel[data-n="2"] .rl{grid-template-columns:1fr 1fr}
.hv-pcl .s-reel[data-n="3"] .rl{grid-template-columns:1fr 1fr 1fr}
.hv-pcl .s-reel .rl video:nth-child(n+2){display:block}
.s-reel.wide .rl video{object-position:50% 50%}

/* ================================================================ 펫 키우기 (/pet) */
.pt-wrap{padding:22px 0 60px}
.pt-app{max-width:520px;margin:0 auto}
.pt-svg{width:100%;height:auto;display:block;overflow:visible}
.pt-svg .pt-breath{transform-box:view-box;transform-origin:100px 196px;animation:ptBreath 3.2s ease-in-out infinite}
.pt-svg .pt-head{transform-box:view-box;transform-origin:100px 132px;animation:ptTilt 7s ease-in-out infinite}
.pt-svg .pt-eyes{transform-box:fill-box;transform-origin:center;animation:ptBlink 4.6s infinite}
.pt-svg .pt-eyes.still{animation:none}
.pt-svg .pt-tail{transform-box:view-box;transform-origin:var(--tx) var(--ty);animation:ptWag 1.3s ease-in-out infinite}
.pt-svg.pt-happy .pt-tail{animation-duration:.42s}
.pt-svg.pt-sad .pt-tail,.pt-svg.pt-sleep .pt-tail{animation:none}
.pt-svg.pt-sleep .pt-breath{animation-duration:4.6s}
.pt-svg.still *{animation:none!important}
.pt-svg .pt-zz{animation:ptFloat 2.4s ease-in-out infinite}
.pt-svg .pt-stink{animation:ptFloat 1.8s ease-in-out infinite}
.pt-svg .pt-fx{animation:ptFx 2.2s ease forwards}
.pt-svg .pt-h,.pt-svg .pt-bub circle,.pt-svg .pt-sp,.pt-svg .pt-leaf{transform-box:fill-box;transform-origin:center;animation:ptUp 1.8s ease-out forwards}
.pt-svg .pt-ball{transform-box:fill-box;animation:ptBall .55s ease-in-out 3 alternate}
.pt-svg .pt-float{animation:ptFloat 1s ease-in-out 2}
.pt-svg .pt-wand{transform-box:view-box;transform-origin:190px 20px;animation:ptWand .5s ease-in-out 4 alternate}
@keyframes ptBreath{50%{transform:scale(1.018,.982)}}
@keyframes ptTilt{0%,72%,100%{transform:rotate(0)}80%{transform:rotate(-5deg)}90%{transform:rotate(3deg)}}
@keyframes ptBlink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.08)}}
@keyframes ptWag{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(12deg)}}
@keyframes ptFloat{50%{transform:translateY(-5px)}}
@keyframes ptFx{0%{opacity:0}10%{opacity:1}80%{opacity:1}100%{opacity:0}}
@keyframes ptUp{0%{transform:translateY(8px) scale(.6);opacity:0}30%{opacity:1}100%{transform:translateY(-22px) scale(1.05);opacity:.9}}
@keyframes ptBall{to{transform:translateY(-22px)}}
@keyframes ptWand{to{transform:rotate(14deg)}}
.pt-stage.jump{animation:ptJump .7s var(--ease)}
@keyframes ptJump{30%{transform:translateY(-16px)}60%{transform:translateY(0)}78%{transform:translateY(-5px)}}
@media (prefers-reduced-motion:reduce){.pt-svg *,.pt-stage.jump{animation:none!important}}

/* 입양 */
.pt-intro{text-align:center;margin-bottom:18px}
.pt-ey{font-size:13px;font-weight:700;color:var(--ear);letter-spacing:.02em}
.pt-intro h1{font-size:clamp(24px,6vw,30px);color:var(--cocoa-d);margin-top:4px}
.pt-intro p:not(.pt-ey){font-size:15px;color:var(--ink2);margin-top:8px;line-height:1.65}
.pt-seg{display:flex;background:var(--milk2);border-radius:999px;padding:4px;margin:0 auto 14px;max-width:280px}
.pt-seg button{flex:1;height:40px;border:0;background:none;border-radius:999px;font-weight:600;font-size:15px;color:var(--mute);cursor:pointer}
.pt-seg button.on{background:#fff;color:var(--cocoa-d);box-shadow:0 1px 4px rgba(60,40,30,.12)}
.pt-breeds{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pt-bc{border:2px solid var(--line2);background:#fff;border-radius:16px;padding:6px 4px 8px;cursor:pointer;transition:border-color .15s,transform .15s}
.pt-bc .pt-svg{width:80%;margin:0 auto}
.pt-bc span{display:block;font-size:13.5px;font-weight:600;color:var(--ink2);margin-top:2px}
.pt-bc.on{border-color:var(--cocoa);transform:translateY(-2px)}
.pt-pick{margin-top:16px;background:#fff;border:1px solid var(--line2);border-radius:var(--r-panel);padding:16px 18px 20px}
.pt-prev{max-width:190px;margin:0 auto}
.pt-colors{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:6px 0 14px}
.pt-colors button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px 0 6px;border:1.5px solid var(--line);background:#fff;border-radius:999px;font-size:13.5px;cursor:pointer}
.pt-colors button i{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--c) 55%,var(--e) 55%);border:1px solid rgba(0,0,0,.08)}
.pt-colors button.on{border-color:var(--cocoa);font-weight:600}
.pt-name{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:14px;padding:0 14px;height:52px;margin-bottom:12px;background:var(--milk)}
.pt-name span{font-size:14px;color:var(--mute);flex:none}
.pt-name input{flex:1;min-width:0;border:0;background:none;font-size:17px;font-weight:600;outline:0}
.pt-sm{font-size:13px;color:var(--mute);margin-top:10px;line-height:1.6}
.pt-sm a{color:var(--cocoa)}

/* 키우기 */
.pt-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pt-top h1{font-size:24px;color:var(--cocoa-d);display:flex;align-items:center;gap:8px}
.pt-stg{font-size:12.5px;font-weight:700;background:var(--oat);color:var(--cocoa);border-radius:999px;padding:3px 10px;letter-spacing:0}
.pt-sub{font-size:13.5px;color:var(--mute)}
.pt-bell{position:relative;font-size:22px;text-decoration:none;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#fff;border:1px solid var(--line2)}
.pt-bell em{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#e5484d;color:#fff;font-size:11px;font-style:normal;font-weight:700;line-height:18px;text-align:center}
.pt-prog{margin:12px 0 10px}
.pt-pt{font-size:13px;color:var(--ink2);margin-bottom:6px}.pt-pt b{font-size:16px;color:var(--cocoa-d)}
.pt-pb{position:relative;height:10px;border-radius:5px;background:var(--oat)}
.pt-pb>i{position:absolute;inset:0 auto 0 0;border-radius:5px;background:linear-gradient(90deg,#f0b27a,var(--ear));transition:width .6s var(--ease)}
.pt-mk{position:absolute;top:50%;transform:translate(-50%,-50%);font-style:normal;font-size:15px;width:26px;height:26px;display:grid;place-items:center;background:#fff;border-radius:50%;box-shadow:0 1px 4px rgba(60,40,30,.18);filter:grayscale(1);opacity:.75}
.pt-mk:last-child{transform:translate(-80%,-50%)}
.pt-mk.got{filter:none;opacity:1}
.pt-room{position:relative;border-radius:var(--r-panel);background:radial-gradient(120% 70% at 50% 0%,#fff 0%,#fdf4ea 55%,#f5e6d6 100%);overflow:hidden;padding:52px 18px 6px;border:1px solid var(--line2)}
.pt-room::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(#ead8c3,#e3ceb6);z-index:0}
.pt-room.night{background:radial-gradient(120% 70% at 50% 0%,#5d5a86 0%,#3f3d63 60%,#34324f 100%)}
.pt-room.night::after{background:linear-gradient(#4a4466,#3e3958)}
.pt-room.night .pt-say{background:#fff9;color:var(--ink)}
.pt-stage{position:relative;z-index:1;max-width:280px;margin:0 auto}
.pt-say{position:absolute;z-index:2;top:12px;left:50%;transform:translateX(-50%);max-width:88%;background:#fff;border-radius:16px;padding:7px 14px;font-size:14.5px;font-weight:600;color:var(--cocoa-d);box-shadow:0 2px 10px rgba(60,40,30,.10);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-say::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-top-color:#fff;border-bottom:0}
.pt-side{margin-top:14px}
.pt-bars{background:#fff;border:1px solid var(--line2);border-radius:16px;padding:10px 14px;display:grid;gap:6px}
.pt-bar{display:grid;grid-template-columns:78px 1fr 30px;align-items:center;gap:8px;font-size:13.5px}
.pt-bl{color:var(--ink2);white-space:nowrap}
.pt-bt{height:10px;border-radius:5px;background:var(--milk2);overflow:hidden}
.pt-bt i{display:block;height:100%;border-radius:5px;background:#7cc497;transition:width .5s var(--ease)}
.pt-bar.mid .pt-bt i{background:#f2c35b}.pt-bar.low .pt-bt i{background:#ef7d6b}
.pt-bar b{text-align:right;font-size:13px;color:var(--ink2)}
.pt-today{margin:12px 2px 8px;font-size:14px;color:var(--ink2)}.pt-today b{color:var(--cocoa-d)}
.pt-today.done{color:var(--green);font-weight:600}
.pt-acts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pt-act{display:flex;flex-direction:column;align-items:center;gap:1px;border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:10px 4px 9px;cursor:pointer;transition:transform .12s,border-color .15s;touch-action:manipulation}
.pt-act:active{transform:scale(.95)}
.pt-act .pt-ai{font-size:26px;line-height:1.15}
.pt-act b{font-size:14.5px;color:var(--cocoa-d)}
.pt-act small{font-size:11.5px;color:var(--mute)}
.pt-act.did{border-color:#cfe6d6;background:#f7fbf8}
.pt-act:disabled{opacity:.45;cursor:default;transform:none}
.pt-save{margin-top:14px;background:#fff7ec;border:1.5px dashed #e9c79f;border-radius:18px;padding:16px;text-align:center}
.pt-save p{font-size:14px;color:var(--ink2);line-height:1.65;margin-bottom:12px;text-align:left}.pt-save p b:first-child{display:block;font-size:16px;color:var(--cocoa-d);margin-bottom:4px}
.pt-link{display:inline-block;margin-top:10px;font-size:14px;color:var(--cocoa);background:none;border:0;text-decoration:underline;cursor:pointer;padding:4px}
.pt-grad{margin-top:14px;background:#fffbe9;border:1px solid #f1df9a;border-radius:18px;padding:14px 16px;font-size:14.5px}
.pt-grad p{margin-bottom:10px}
.pt-tabs{display:flex;gap:6px;margin:18px 0 10px;border-bottom:1px solid var(--line)}
.pt-tabs button{border:0;background:none;padding:8px 12px;font-size:15px;font-weight:600;color:var(--mute);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer}
.pt-tabs button.on{color:var(--cocoa-d);border-bottom-color:var(--cocoa)}
.pt-items{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pt-item{border:1.5px solid var(--line2);background:#fff;border-radius:14px;padding:4px 2px 6px;cursor:pointer;display:flex;flex-direction:column;align-items:center}
.pt-item .pt-svg{width:100%}
.pt-item small{font-size:11.5px;color:var(--ink2);line-height:1.3;text-align:center}
.pt-item.on{border-color:var(--cocoa);background:var(--milk)}
.pt-item:disabled{cursor:default;background:var(--milk2)}
.pt-lock{display:grid;place-items:center;aspect-ratio:1;width:100%;font-size:22px;opacity:.5}
.pt-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pt-badge{text-align:center;background:var(--milk2);border-radius:14px;padding:10px 4px;filter:grayscale(1);opacity:.5}
.pt-badge span{font-size:26px;display:block}.pt-badge small{font-size:11.5px;color:var(--ink2)}
.pt-badge.on{filter:none;opacity:1;background:#fff;border:1px solid var(--line2)}
.pt-log{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line2);border-radius:14px}
.pt-log li{display:flex;justify-content:space-between;padding:10px 14px;font-size:14.5px;border-top:1px solid var(--line2)}.pt-log li:first-child{border-top:0}
.pt-log span{color:var(--mute)}
.pt-real{display:flex;align-items:center;gap:12px;margin-top:16px;padding:10px 14px 10px 8px;background:var(--cocoa);color:#fff;border-radius:18px;text-decoration:none}
.pt-real>span:first-child{width:62px;flex:none;background:#fff2;border-radius:12px}
.pt-real b{display:block;font-size:15px}.pt-real small{font-size:12.5px;opacity:.8}
.pt-real em{margin-left:auto;font-style:normal;font-size:13px;font-weight:600;white-space:nowrap}
.pt-noti{margin-top:14px;background:#fff;border:1px solid var(--line2);border-radius:16px;padding:14px 16px}
.pt-noti .s-btn{margin-top:10px}
.pt-sw{display:flex;align-items:center;gap:10px;cursor:pointer}
.pt-sw input{position:absolute;opacity:0}
.pt-sw span{width:44px;height:26px;border-radius:13px;background:var(--oat2);position:relative;transition:background .2s;flex:none}
.pt-sw span::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.pt-sw input:checked+span{background:var(--green)}.pt-sw input:checked+span::after{transform:translateX(18px)}
.pt-sw input:focus-visible+span{outline:2px solid var(--cocoa);outline-offset:2px}
.pt-modal{position:fixed;inset:0;z-index:300;background:rgba(30,20,15,.45);display:grid;place-items:center;padding:20px;animation:ptFade .2s}
.pt-mb{background:#fff;border-radius:24px;padding:24px 22px 16px;max-width:360px;width:100%;text-align:center;animation:ptPop .35s var(--ease)}
.pt-mi{font-size:46px;line-height:1}
.pt-mb h2{font-size:21px;margin:8px 0 6px;color:var(--cocoa-d)}
.pt-mb p{font-size:15px;color:var(--ink2);line-height:1.65;margin-bottom:14px}
.pt-mb code{font-size:17px;font-weight:700;letter-spacing:.08em;background:var(--milk2);padding:2px 8px;border-radius:6px;color:var(--cocoa-d)}
@keyframes ptFade{from{opacity:0}}
@keyframes ptPop{from{transform:scale(.85);opacity:0}}
.pt-toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:rgba(43,35,31,.92);color:#fff;font-size:14px;padding:10px 18px;border-radius:999px;opacity:0;pointer-events:none;transition:.25s;z-index:310;max-width:90vw;text-align:center}
.pt-toast.on{opacity:1;transform:translate(-50%,0)}
@media (min-width:900px){
  .pt-wrap{padding:36px 0 80px}
  .pt-app{max-width:980px}
  .pt-adopt{max-width:560px;margin:0 auto}
  .pt-play{display:grid;grid-template-columns:1fr 420px;grid-template-areas:"top top" "prog prog" "room side";column-gap:28px}
  .pt-top{grid-area:top}.pt-prog{grid-area:prog}.pt-room{grid-area:room;align-self:start;position:sticky;top:96px}.pt-side{grid-area:side;margin-top:0}
  .pt-stage{max-width:340px}
}
/* 내 정보 · 알림함 · 쿠폰 */
.s-notes,.s-cps{list-style:none;margin:0;padding:0}
.s-notes li{display:flex;gap:10px;padding:12px 0;border-top:1px solid var(--line2)}.s-notes li:first-child{border-top:0}
.s-notes .ic-n{flex:none;width:34px;height:34px;border-radius:50%;background:var(--milk2);display:grid;place-items:center;font-size:17px}
.s-notes b{display:block;font-size:15px}.s-notes p{font-size:13.5px;color:var(--ink2);white-space:pre-line;line-height:1.55}.s-notes small{font-size:12px;color:var(--mute)}
.s-notes li.new b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#e5484d;margin-left:6px;vertical-align:middle}
.s-notes a{text-decoration:none;color:inherit}
.s-cps li{border:1.5px dashed var(--oat2);border-radius:16px;padding:14px 16px;margin-bottom:10px;background:#fffaf3}
.s-cps li.used{opacity:.5}
.s-cps b{font-size:16px;color:var(--cocoa-d)}.s-cps p{font-size:13.5px;color:var(--ink2);margin-top:2px}
.s-cps code{display:inline-block;margin-top:8px;font-size:20px;font-weight:700;letter-spacing:.12em;color:var(--cocoa-d);background:#fff;border:1px solid var(--line);border-radius:8px;padding:2px 10px}
.s-cps small{display:block;font-size:12px;color:var(--mute);margin-top:6px}
.s-mypet{display:flex;align-items:center;gap:14px;text-decoration:none;background:#fff7ec;border-radius:16px;padding:10px 16px 10px 10px}
.s-mypet>span:first-child{width:76px;flex:none}
.s-mypet b{font-size:16px;color:var(--cocoa-d)}.s-mypet small{display:block;font-size:13px;color:var(--ink2)}
.s-mem .s-dot,.s-hicon .s-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#e5484d;margin-left:3px;vertical-align:top}
.s-hicon{position:relative}.s-hicon .s-dot{position:absolute;top:6px;right:4px;margin:0}
.pt-band{padding:8px 0 40px}
.pt-bandin{display:flex;align-items:center;gap:18px;background:linear-gradient(120deg,#fff7ec,#fdeedd);border:1px solid #f2dcc2;border-radius:var(--r-panel);padding:16px 22px;text-decoration:none;color:inherit}
.pt-bpets{display:flex;flex:none}.pt-bpets>span{width:78px;margin-left:-14px}.pt-bpets>span:first-child{margin-left:0}
.pt-btxt{flex:1;min-width:0}.pt-btxt em{font-style:normal;font-size:12.5px;font-weight:700;color:var(--ear)}
.pt-btxt b{display:block;font-size:19px;color:var(--cocoa-d);line-height:1.35}.pt-btxt small{display:block;font-size:14px;color:var(--ink2);margin-top:2px}
@media (max-width:700px){.pt-bandin{flex-wrap:wrap;gap:10px;padding:14px 16px}.pt-bpets>span{width:64px}.pt-btxt{flex-basis:100%}.pt-bgo{width:100%;height:46px}}
[data-pet] img{width:100%;height:100%;object-fit:contain;display:block}
/* ── 찜 수 표시 (여러 사람이 찜한 수) */
.lkc{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;background:rgba(32,24,20,.38);color:rgba(255,255,255,.92);font-size:10.5px;font-weight:600;letter-spacing:-.01em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none}
.lkc::before{content:"♥";font-size:9px;opacity:.85}
.nw-lkc{right:8px;top:8px}
.s-pet-ph{position:relative}.s-pet-lkc{left:8px;bottom:8px}
.mt-lkc{left:14px;top:14px;font-size:13px;padding:5px 11px;background:rgba(210,69,58,.92);color:#fff}
.mt-lkc::before{content:"🔥"}
.nv-lkn{display:block;font-size:12px;font-weight:800;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5);margin-top:1px}
.s-lk-line{display:inline-block;margin-left:10px;font-size:13.5px;font-weight:700;color:#d2453a;vertical-align:middle}
.s-lkfloat{position:fixed;left:50%;bottom:calc(var(--mcbh,0px) + 14px);z-index:65;display:flex;align-items:center;gap:10px;width:min(460px,calc(100% - 24px));padding:8px 8px 8px 10px;border-radius:999px;background:#fffefa;border:1px solid rgba(75,60,53,.12);box-shadow:0 12px 32px rgba(47,37,32,.2);transform:translate(-50%,140%);opacity:0;transition:transform .35s,opacity .35s;pointer-events:none}
.s-lkfloat.on{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.s-lkf-b{position:static!important;flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fdecea!important;color:#d2453a}
.s-lkf-b[aria-pressed="true"] svg{fill:#d2453a}
.s-lkf-t{flex:1;min-width:0;line-height:1.25}.s-lkf-t b{display:block;font-size:14px;color:var(--cocoa-d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.s-lkf-t small{display:block;font-size:12px;color:#d2453a;font-weight:700}
.s-lkf-go{flex:none;padding:10px 16px;border-radius:999px;background:var(--cocoa-d,#3b2a20);color:#fff;font-size:13.5px;font-weight:700;text-decoration:none}
@media (min-width:801px){.s-lkfloat{left:24px;transform:translateY(140%);width:auto;max-width:420px}.s-lkfloat.on{transform:none}}
body.lkf-on .talk{opacity:0;pointer-events:none;transition:opacity .3s}
/* 플로팅 찜 바: 아직 찜하지 않았으면 '만나러 가기' 숨김 (찜하면 나타남) */
.s-lkfloat:has(.s-lkf-b[aria-pressed="false"]) .s-lkf-go{display:none}
/* 간편 로그인 */
.s-sns-wrap{display:grid;gap:8px;margin:18px 0 6px}
.s-sns-or{display:flex;align-items:center;gap:10px;margin:0 0 4px;font-size:12.5px;color:var(--sub,#8a7a70)}.s-sns-or::before,.s-sns-or::after{content:"";flex:1;height:1px;background:var(--line2,#e6dccf)}
.s-sns{display:flex;align-items:center;justify-content:center;gap:10px;height:48px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none;border:1px solid rgba(0,0,0,.08)}
.s-sns b{font-size:17px;font-weight:900}.s-sns-google b{color:#4285f4}