/* 펫사주 v7 — 사이트 전체 리디자인 (2026-10-05, Claude · 대표 지시 "펫사주 사이트 전체 디자인")
   - 메인: body.pv6.pv7 (v5·v6·v6-home·playful CSS 미사용, 이 파일이 전체 담당)
   - 하위 페이지: body.pv6.pv7 + 기존 v6-sub 위에 공통 레이어(색·상단바·드로어·버튼)만 덮어씀
   - 기능 요소(#form/#loading/#result/#sjOvl 의 id·동작)는 바꾸지 않음 */

/* ── 1. 토큰 ───────────────────────────── */
body.pv7{
  --v7-bg:#FFF8F1; --v7-ink:#27213F; --v7-sub:#6C6680; --v7-line:#F0E5D9;
  --v7-coral:#FF6B5E; --v7-coral-d:#E2473B; --v7-peach:#FFEDE4; --v7-peach-2:#FFE0D2;
  --v7-lav:#7462E8; --v7-lav-s:#F0EDFF; --v7-butter:#FFD25C; --v7-mint:#21B795; --v7-mint-s:#E3F7F1;
  --v7-card:#FFFFFF; --v7-r:24px; --v7-sh:0 14px 36px rgba(39,33,63,.08); --v7-sh-s:0 4px 14px rgba(39,33,63,.06);
  /* 인라인 기본 스타일(폼·결과·시트)을 v7 색으로 */
  --bg:var(--v7-bg); --ink:var(--v7-ink); --muted:var(--v7-sub); --accent:var(--v7-coral);
  --accent-ink:var(--v7-coral-d); --soft:var(--v7-peach); --line:var(--v7-line); --r:20px;
  --pv6-navy:var(--v7-ink); --pv6-line:var(--v7-line);
  background:
    radial-gradient(900px 520px at 92% -6%, #FFE3EC 0, rgba(255,227,236,0) 62%),
    radial-gradient(760px 480px at -12% 4%, #ECE8FF 0, rgba(236,232,255,0) 58%),
    var(--v7-bg);
  background-repeat:no-repeat; background-color:var(--v7-bg);
  color:var(--v7-ink);
  font-family:"Noto Sans KR","Noto Sans JP","Noto Sans SC",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  letter-spacing:-.01em; padding:0 20px 0;
}
body.pv7 a{color:inherit}
body.pv7 .pv6-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.pv7 :focus-visible{outline:3px solid rgba(116,98,232,.45);outline-offset:2px;border-radius:10px}

/* ── 2. 상단바 (모든 페이지) ───────────── */
body.pv7 .wrap > .topbar,body.pv7 .topbar{
  position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:8px;
  padding:10px 0; margin:0 0 4px; background:rgba(255,248,241,.86);
  -webkit-backdrop-filter:saturate(160%) blur(14px); backdrop-filter:saturate(160%) blur(14px);
  box-shadow:0 0 0 100vmax rgba(255,248,241,.86); clip-path:inset(0 -100vmax);
  border-bottom:1px solid rgba(39,33,63,.06); flex-wrap:nowrap; min-height:62px;
}
body.pv7 .topbar > *{flex:0 0 auto; margin:0}
body.pv7 .topbar #pnHbBtn{order:0}
body.pv7 .topbar #tbPetHome{order:1; margin-right:auto!important}
body.pv7 .topbar #tbHome{order:2; opacity:.85; padding:0 6px}
body.pv7 .topbar #tbHome img{height:22px!important}
body.pv7 .topbar > a.tb-btn[href*="community"]{order:3}
body.pv7 .topbar #tbPrice{order:4}
body.pv7 .topbar #tbLangDd{order:5}
body.pv7 .topbar #tbLogin,body.pv7 .topbar #tbDd{order:6}
@media (max-width:820px){ body.pv7 .topbar #tbHome{display:none!important} }
body.pv7 .pn-hb,body.pv7 .topbar #pnHbBtn{
  width:42px; height:42px; border-radius:14px; border:1px solid var(--v7-line); background:#fff;
  color:var(--v7-ink); font-size:18px; box-shadow:var(--v7-sh-s); display:inline-grid; place-items:center; padding:0;
}
body.pv7 .topbar #tbPetHome{
  display:inline-flex!important; align-items:center; gap:8px; border:0!important; background:none!important;
  box-shadow:none!important; padding:0 4px!important; min-height:42px; font-size:19px!important; font-weight:900!important;
  color:var(--v7-ink)!important; letter-spacing:-.03em;
}
body.pv7 .topbar #tbPetHome .tb-ic{
  width:34px; height:34px; font-size:0!important; border-radius:50%;
  background:#fff url(/img/petsaju-logo.webp?v=20261011b) center/112% no-repeat; box-shadow:0 2px 8px rgba(255,107,94,.25);
}
body.pv7 .topbar #tbPetHome .pv6-brand-text{display:inline!important}
body.pv7 .topbar .tb-btn,body.pv7 .topbar .tb-dd-trg{
  display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:0 14px; border-radius:999px;
  border:1px solid var(--v7-line); background:#fff; color:var(--v7-ink); font-size:13px; font-weight:700;
  font-family:inherit; text-decoration:none; box-shadow:none; cursor:pointer; white-space:nowrap; line-height:1;
}
body.pv7 .topbar .tb-btn:hover,body.pv7 .topbar .tb-dd-trg:hover{border-color:#E9CDBE; background:#FFFBF8}
body.pv7 .topbar .tb-btn.pri,body.pv7 .topbar #tbLogin{
  background:var(--v7-ink); border-color:var(--v7-ink); color:#fff; padding:0 18px; font-weight:800;
}
body.pv7 .topbar #tbLogin:hover{background:#3A3260}
body.pv7 .tb-dd-menu{border:1px solid var(--v7-line); border-radius:16px; box-shadow:0 16px 40px rgba(39,33,63,.16); padding:6px; min-width:180px}
body.pv7 .tb-dd-item{border-radius:10px; padding:10px 12px; font-size:13.5px}
body.pv7 .tb-dd-item:hover{background:var(--v7-peach)}
body.pv7 .tb-dd-cred{color:var(--v7-coral-d)}
body.pv7 .tb-mail{max-width:130px}
@media (max-width:560px){
  body.pv7{padding:0 14px}
  body.pv7 .topbar{gap:6px; min-height:58px; padding:8px 0}
  body.pv7 .topbar #tbPrice{display:none!important}
  body.pv7 .topbar .tb-btn,body.pv7 .topbar .tb-dd-trg{min-height:38px; padding:0 11px}
  body.pv7 .topbar > a.tb-btn[href*="community"]{width:38px; padding:0; justify-content:center}
  body.pv7 .topbar #tbLogin{padding:0 14px}
  body.pv7 .topbar #tbPetHome{font-size:17px!important; gap:6px}
  body.pv7 .topbar #tbPetHome .tb-ic{width:30px; height:30px}
  body.pv7 .pn-hb,body.pv7 .topbar #pnHbBtn{width:38px; height:38px; border-radius:12px}
  body.pv7 .tb-mail{max-width:84px}
}
@media (max-width:360px){ body.pv7 .topbar #tbPetHome .pv6-brand-text{display:none!important} }


/* ── 3. 드로어 ─────────────────────────── */
body.pv7 .pn-drawer{border-radius:0 24px 24px 0; padding:20px 16px; background:#FFFCF9}
body.pv7 .pn-user{background:var(--v7-peach); border-color:var(--v7-peach-2); border-radius:16px}
body.pv7 .pn-user .nm,body.pv7 .pn-user .cr{color:var(--v7-coral-d)}
body.pv7 .pn-user .row a.chg{background:#fff; color:var(--v7-coral-d)}
body.pv7 .pn-acc{border-bottom-color:var(--v7-line)}
body.pv7 .pn-acc summary{color:var(--v7-lav); font-size:11.5px; letter-spacing:.06em}
body.pv7 .pn-link{border-radius:12px; padding:10px 8px}
body.pv7 .pn-link:hover{background:var(--v7-peach)}
body.pv7 .pn-link .tt{color:var(--v7-ink)}
body.pv7 .pn-link .ds{color:var(--v7-sub)}

/* ── 4. 메인 레이아웃 ───────────────────── */
body.pv7-home .wrap{max-width:1120px; margin:0 auto; padding:0}
body.pv7-home header.pv6-hero{
  display:grid; grid-template-columns:minmax(0,1fr); gap:22px; text-align:left;
  padding:26px 0 8px; margin:0; background:none; border:0; box-shadow:none;
}
body.pv7-home .pv6-intro{
  display:grid; grid-template-columns:minmax(0,1fr) 108px; column-gap:14px; align-items:start;
  grid-template-areas:"eyebrow eyebrow" "h1 h1" "lead art" "price price" "steps steps" "help help";
}
body.pv7-home .pv6-hero .pv5-eyebrow{
  grid-area:eyebrow; justify-self:start; display:inline-flex; align-items:center; gap:6px; margin:0 0 14px;
  padding:7px 13px; border-radius:999px; background:#fff; border:1px solid var(--v7-line);
  color:var(--v7-lav); font-size:12.5px; font-weight:800; box-shadow:var(--v7-sh-s);
}
body.pv7-home .pv6-hero .pv5-h1{
  grid-area:h1; margin:0; font-size:clamp(30px,8.4vw,56px); line-height:1.16; font-weight:900;
  letter-spacing:-.045em; color:var(--v7-ink); word-break:keep-all;
}
body.pv7-home .pv6-hero .pv5-h1 strong{
  font-weight:900; color:var(--v7-coral);
  background:linear-gradient(transparent 68%, rgba(255,210,92,.55) 68%, rgba(255,210,92,.55) 92%, transparent 92%);
  padding:0 2px;
}
body.pv7-home .pv6-art{
  grid-area:art; position:relative; width:108px; aspect-ratio:1; justify-self:end; align-self:center;
  border-radius:50%; background:radial-gradient(circle at 50% 55%, #FFE3D8 0, #FFD1C2 58%, rgba(255,209,194,0) 72%);
}
body.pv7-home .pv6-art img{position:absolute; inset:-6%; width:112%; height:112%; max-width:none; object-fit:contain;
  filter:drop-shadow(0 10px 16px rgba(226,71,59,.18)); animation:v7float 5s ease-in-out infinite}
@keyframes v7float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){body.pv7-home .pv6-art img{animation:none}}
body.pv7-home .pv6-hero .pv5-lead{grid-area:lead; align-self:center; margin:16px 0 0; max-width:34em; font-size:clamp(15px,3.9vw,18px);
  line-height:1.75; color:var(--v7-sub); word-break:keep-all}
body.pv7-home .pv6-hero-price{
  grid-area:price; display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:18px 0 0;
  padding:0; background:none; border:0;
}
body.pv7-home .pv6-hero-price p{margin:0; display:inline-flex; flex-wrap:wrap; gap:6px; align-items:center;
  font-size:13.5px; color:var(--v7-sub)}
body.pv7-home .pv6-hero-price strong{color:var(--v7-coral-d); font-weight:900}
body.pv7-home .pv6-hero-price a{font-size:13px; font-weight:800; color:var(--v7-lav); text-decoration:none;
  border-bottom:1.5px solid rgba(116,98,232,.35)}
body.pv7-home .pv6-hero .pv5-steps{
  grid-area:steps; list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
  margin:18px 0 0; padding:0; counter-reset:none;
}
body.pv7-home .pv6-hero .pv5-steps li{
  display:flex; align-items:center; gap:8px; min-height:48px; padding:8px 10px; border-radius:16px;
  background:rgba(255,255,255,.75); border:1px solid var(--v7-line); font-size:13px; font-weight:700;
  color:var(--v7-ink); line-height:1.3; word-break:keep-all;
}
body.pv7-home .pv6-hero .pv5-steps li::before,body.pv7-home .pv6-hero .pv5-steps li::after{content:none; display:none}
body.pv7-home .pv6-step-no{flex:0 0 26px; width:26px; height:26px; border-radius:50%; display:grid; place-items:center;
  background:var(--v7-ink); color:#fff; font-size:12.5px; font-weight:900}
body.pv7-home .pv6-hero .pv5-steps li:first-child .pv6-step-no{background:var(--v7-coral)}
body.pv7-home .pv6-upload-help{grid-area:help; margin:12px 0 0; font-size:12.5px; color:var(--v7-sub)}

/* 업로드 앱(폼·로딩·결과) */
body.pv7-home .pv7-app{min-width:0; position:relative}
body.pv7-home .pv7-app::before{ /* 카드 뒤 장식 */
  content:""; position:absolute; inset:18px -8px -10px 18px; border-radius:30px;
  background:linear-gradient(135deg,#FFD9CC,#E6E0FF); z-index:0; transform:rotate(2deg);
}
body.pv7-home .pv7-app > section{position:relative; z-index:1}
body.pv7-home #form,body.pv7-home #loading,body.pv7-home #result{scroll-margin-top:84px}
body.pv7-home .card{background:#fff; border:1px solid var(--v7-line); border-radius:28px; padding:24px; box-shadow:var(--v7-sh)}
body.pv7-home #loading.card{padding:64px 22px}
body.pv7-home #form .drop{
  border:2px dashed #FFB7A8; border-radius:22px; padding:28px 16px 22px;
  background:linear-gradient(180deg,#FFF6F1,#FFEDE4);
}
body.pv7-home #form .drop:hover,body.pv7-home #form .drop.on{border-color:var(--v7-coral); background:linear-gradient(180deg,#FFF1EA,#FFE4D8)}
body.pv7-home #form .drop .ico{width:64px; height:64px; margin:0 auto; border-radius:50%; display:grid; place-items:center;
  background:#fff; font-size:30px; box-shadow:0 6px 16px rgba(255,107,94,.18)}
body.pv7-home #form .drop .t{font-size:18px; font-weight:900; margin-top:12px; color:var(--v7-ink)}
body.pv7-home #form .drop .s{font-size:13px; color:var(--v7-sub)}
body.pv7-home #form .pick{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:16px}
body.pv7-home #form .pick button{min-height:48px; border-radius:14px; border:1.5px solid var(--v7-ink); background:#fff;
  color:var(--v7-ink); font-weight:800; font-size:14px; width:auto; padding:0 10px}
body.pv7-home #form #btnAlbum{background:var(--v7-ink); color:#fff}
body.pv7-home #form #preview img{border-radius:18px; border:0; box-shadow:var(--v7-sh-s)}
body.pv7-home label.lb{font-size:13px; font-weight:800; color:var(--v7-ink); margin:18px 0 8px}
body.pv7-home input[type=text]{min-height:50px; border-radius:14px; border:1.5px solid var(--v7-line); font-size:16px; padding:12px 16px}
body.pv7-home input[type=text]:focus{border-color:var(--v7-lav); box-shadow:0 0 0 4px rgba(116,98,232,.12)}
body.pv7-home .seg{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
body.pv7-home .seg button{min-height:48px; border-radius:14px; border:1.5px solid var(--v7-line); color:var(--v7-sub); font-weight:700; background:#fff}
body.pv7-home .seg button.sel{border-color:var(--v7-coral); background:var(--v7-peach); color:var(--v7-coral-d); font-weight:900}
body.pv7-home .go,body.pv7-home .sj-go{
  min-height:56px; border-radius:18px; font-size:17px; font-weight:900; letter-spacing:-.02em;
  background:linear-gradient(135deg,#FF7A62,#FF5470); color:#fff; box-shadow:0 10px 22px rgba(255,84,112,.28);
}
body.pv7-home .go:disabled,body.pv7-home .sj-go:disabled{background:#EDE6DE; color:#A69E95; box-shadow:none}
body.pv7-home .go:not(:disabled):hover{filter:brightness(1.04)}
body.pv7-home .note{font-size:12px; color:var(--v7-sub)}
body.pv7-home .spin{border-color:var(--v7-peach); border-top-color:var(--v7-coral)}
body.pv7-home .rhead img{border:5px solid #fff; box-shadow:0 8px 24px rgba(39,33,63,.14)}
body.pv7-home .rname{font-size:24px; font-weight:900}
body.pv7-home .reading h3{color:var(--v7-coral-d); border-left-color:var(--v7-coral); font-weight:900}
body.pv7-home .reading p{font-size:15.5px; line-height:1.85}
body.pv7-home .xsell a{border-radius:14px; border-color:var(--v7-line); background:#fff}
body.pv7-home .xsell a:hover{border-color:var(--v7-lav); color:var(--v7-lav)}
body.pv7-home .sj-card{border:0; border-radius:20px; background:linear-gradient(135deg,#F0EDFF,#FFEDE4); padding:20px}
body.pv7-home .sj-card .t{color:var(--v7-lav); font-weight:900}
body.pv7-home .sj-card .p{color:var(--v7-coral-d)}
body.pv7-home .acts button{min-height:50px; border-radius:16px}
body.pv7-home .acts button.pri{background:var(--v7-ink); border-color:var(--v7-ink)}
body.pv7-home .sj-sheet,body.pv7-home .sheet{border-radius:26px}

/* 결과·로딩 중에는 소개 영역을 접고 앱을 가운데로 */
body.pv7-home header.pv6-hero:has(#result[style*="block"]) .pv6-intro,
body.pv7-home header.pv6-hero:has(#loading[style*="block"]) .pv6-intro{display:none}
body.pv7-home header.pv6-hero:has(#result[style*="block"]),
body.pv7-home header.pv6-hero:has(#loading[style*="block"]){grid-template-columns:minmax(0,1fr)!important}
body.pv7-home header.pv6-hero:has(#result[style*="block"]) .pv7-app,
body.pv7-home header.pv6-hero:has(#loading[style*="block"]) .pv7-app{max-width:640px; width:100%; margin:0 auto}

@media (min-width:960px){
  body.pv7-home header.pv6-hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:56px; padding:56px 0 24px; align-items:start}
  body.pv7-home .pv6-intro{grid-template-columns:minmax(0,1fr) 180px; padding-top:8px;
    grid-template-areas:"eyebrow eyebrow" "h1 h1" "lead art" "price art" "steps steps" "help help"}
  body.pv7-home .pv6-hero .pv5-h1{font-size:clamp(44px,4.4vw,56px)}
  body.pv7-home .pv6-art{width:180px; align-self:center; margin-top:10px}
  body.pv7-home .pv6-upload-help{display:none}
  body.pv7-home .pv7-app{position:sticky; top:86px}
  body.pv7-home .card{padding:28px}
}

/* ── 5. 섹션 공통 ───────────────────────── */
body.pv7-home .pv6-home-content{display:block; margin:0; padding:0}
body.pv7-home .pv6-section{margin:84px 0 0; padding:0; background:none; border:0; box-shadow:none}
body.pv7-home .pv6-section[hidden]{display:none}
body.pv7-home .pv6-section-head{max-width:680px; margin:0 0 26px}
body.pv7-home .pv6-kicker{
  display:inline-flex; align-items:center; gap:6px; margin:0 0 12px; padding:6px 12px; border-radius:999px;
  background:var(--v7-lav-s); color:var(--v7-lav); font-size:12px; font-weight:900; letter-spacing:.02em;
}
body.pv7-home .pv6-section h2{margin:0; font-size:clamp(24px,6vw,36px); line-height:1.25; font-weight:900; letter-spacing:-.04em; color:var(--v7-ink); word-break:keep-all}
body.pv7-home .pv6-section-head p,body.pv7-home .pv6-section > p{margin:10px 0 0; font-size:15.5px; line-height:1.75; color:var(--v7-sub); word-break:keep-all}
body.pv7-home .pv6-two-grid{display:grid; grid-template-columns:minmax(0,1fr); gap:16px}
body.pv7-home #pv6-pricing .pv6-two-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
@media (min-width:760px){ body.pv7-home .pv6-two-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px} }
body.pv7-home .pv6-action{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%; max-width:380px; min-height:56px;
  margin:22px auto 0; padding:0 24px; border-radius:18px; text-decoration:none; font-size:16.5px; font-weight:900;
  color:#fff!important; background:linear-gradient(135deg,#FF7A62,#FF5470); box-shadow:0 10px 22px rgba(255,84,112,.26); border:0;
}
body.pv7-home .pv6-action::after{content:"→"; font-weight:900}
body.pv7-home .pv6-action:hover{filter:brightness(1.05)}

/* 커뮤니티 최신 글 */
body.pv7-home .pv6-feed-head{max-width:none;display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:18px}
body.pv7-home .pv6-feed-head .pv6-kicker{margin-bottom:12px}
body.pv7-home .pv6-feed-more{color:var(--v7-lav); font-weight:900}
body.pv7-home .pv6-feed-list{grid-auto-columns:minmax(150px,42%); gap:14px}
@media (min-width:760px){ body.pv7-home .pv6-feed-list{grid-auto-columns:calc((100% - 70px)/6)} }
body.pv7-home .pv6-feed-card{border:1px solid var(--v7-line); border-radius:20px; box-shadow:var(--v7-sh-s); color:var(--v7-ink); transition:transform .15s, box-shadow .15s}
body.pv7-home .pv6-feed-card:hover{transform:translateY(-3px); box-shadow:var(--v7-sh)}
body.pv7-home .pv6-feed-thumb{background:linear-gradient(135deg,#FFEDE4,#F0EDFF)}

/* 풀이 미리보기 */
body.pv7-home .pv6-example{
  display:grid; grid-template-columns:minmax(0,1fr); gap:20px; padding:24px; border-radius:30px; background:#fff;
  border:1px solid var(--v7-line); box-shadow:var(--v7-sh);
}
body.pv7-home .pv6-example-profile{display:flex; align-items:center; gap:16px}
body.pv7-home .pv6-example-photo{flex:0 0 112px; width:112px; aspect-ratio:1; border-radius:26px; overflow:hidden; background:var(--v7-peach)}
body.pv7-home .pv6-example-photo img{width:100%; height:100%; object-fit:cover; display:block}
body.pv7-home .pv6-badge{display:inline-block; padding:4px 10px; border-radius:999px; background:var(--v7-lav-s); color:var(--v7-lav); font-size:11.5px; font-weight:900}
body.pv7-home .pv6-example-name{margin:8px 0 0; font-size:26px; font-weight:900; letter-spacing:-.03em}
body.pv7-home .pv6-example-meta{margin:2px 0 0; font-size:13px; color:var(--v7-sub)}
body.pv7-home .pv6-example-reading h3{margin:18px 0 8px; padding-left:12px; border-left:4px solid var(--v7-coral); font-size:17px; font-weight:900; color:var(--v7-ink)}
body.pv7-home .pv6-example-reading h3:first-child{margin-top:0}
body.pv7-home .pv6-example-reading p{margin:0; font-size:15px; line-height:1.85; color:#4A4560}
body.pv7-home .pv6-example-notice{margin:0; padding-top:14px; border-top:1px dashed var(--v7-line); font-size:12px; line-height:1.7; color:var(--v7-sub)}
@media (min-width:760px){
  body.pv7-home .pv6-example{grid-template-columns:240px minmax(0,1fr); gap:32px; padding:32px}
  body.pv7-home .pv6-example-profile{flex-direction:column; align-items:flex-start}
  body.pv7-home .pv6-example-photo{flex:none; width:100%}
  body.pv7-home .pv6-example-notice{grid-column:1 / -1}
}

/* 서비스 카드 */
body.pv7-home .pv6-info-card{position:relative; padding:26px; border-radius:28px; background:linear-gradient(160deg,#FFF3EC,#FFE7DC); border:0; box-shadow:none; overflow:hidden}
body.pv7-home .pv6-info-card--peach{background:linear-gradient(160deg,#F4F1FF,#E9E4FF)}
body.pv7-home .pv6-card-icon{width:56px; height:56px; border-radius:18px; display:grid; place-items:center; background:#fff; font-size:26px; box-shadow:var(--v7-sh-s); margin-bottom:16px}
body.pv7-home .pv6-info-card h3{margin:0; font-size:21px; font-weight:900; letter-spacing:-.03em}
body.pv7-home .pv6-info-card > p{margin:8px 0 0; font-size:15px; line-height:1.75; color:#4A4560}
body.pv7-home .pv6-list{list-style:none; margin:16px 0 0; padding:0; display:grid; gap:8px}
body.pv7-home .pv6-list li{position:relative; padding-left:28px; font-size:14.5px; font-weight:600; color:var(--v7-ink)}
body.pv7-home .pv6-list li::before{content:"✓"; position:absolute; left:0; top:1px; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:#fff; color:var(--v7-coral); font-size:12px; font-weight:900}
body.pv7-home .pv6-info-card--peach .pv6-list li::before{color:var(--v7-lav)}

/* 요금 */
body.pv7-home .pv6-price-card{padding:clamp(18px,4vw,26px); border-radius:26px; background:#fff; border:1px solid var(--v7-line); box-shadow:var(--v7-sh-s)}
body.pv7-home .pv6-price-card h3{margin:0; font-size:16px; font-weight:800; color:var(--v7-sub)}
body.pv7-home .pv6-price{margin:6px 0 4px!important; font-size:clamp(26px,7vw,38px)!important; font-weight:900; letter-spacing:-.04em; color:var(--v7-ink)!important}
body.pv7-home .pv6-price-card p:last-child{margin:0; font-size:14px; color:var(--v7-sub)}
body.pv7-home .pv6-payment-note{margin-top:16px; padding:16px 18px; border-radius:18px; background:var(--v7-mint-s); border:0; font-size:13.5px; line-height:1.7; color:#245C50}
body.pv7-home .pv6-payment-note p{margin:0}
body.pv7-home .pv6-payment-note strong{color:#147A63}

/* 보호자 운세 연결 */
body.pv7-home .pv6-owner{padding:34px 26px!important; border-radius:32px; background:linear-gradient(135deg,#2D2650,#4B3F8C)!important; color:#fff}
body.pv7-home .pv6-owner .pv6-kicker{background:rgba(255,255,255,.14); color:#FFD9A8}
body.pv7-home .pv6-owner h2{color:#fff}
body.pv7-home .pv6-owner .pv6-section-head p{color:rgba(255,255,255,.78)}
body.pv7-home .pv6-links{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
body.pv7-home .pv6-links a{display:flex; align-items:center; justify-content:center; min-height:52px; border-radius:16px; background:#fff; color:var(--v7-ink)!important; font-weight:900; font-size:14.5px; text-decoration:none; border:0}
body.pv7-home .pv6-links a:hover{background:#FFE9C7}
@media (max-width:420px){ body.pv7-home .pv6-links{grid-template-columns:1fr} }

/* FAQ */
body.pv7-home .pv6-faq-list{display:grid; gap:10px; border:0}
body.pv7-home .pv6-faq-list details{margin:0; padding:0; border:1px solid var(--v7-line); border-radius:20px; background:#fff; box-shadow:none; overflow:hidden}
body.pv7-home .pv6-faq-list details[open]{box-shadow:var(--v7-sh-s); border-color:#E8D9CB}
body.pv7-home .pv6-faq-list summary{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 20px; font-size:15.5px; font-weight:800; color:var(--v7-ink); list-style:none; cursor:pointer}
body.pv7-home .pv6-faq-list summary::-webkit-details-marker{display:none}
body.pv7-home .pv6-faq-list summary::before{content:none}
body.pv7-home .pv6-faq-list summary::after{content:"+"; flex:0 0 28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--v7-peach); color:var(--v7-coral-d); font-size:18px; font-weight:700; transition:transform .2s}
body.pv7-home .pv6-faq-list details[open] summary::after{transform:rotate(45deg)}
body.pv7-home .pv6-faq-answer{padding:0 20px 18px; font-size:14.5px; line-height:1.8; color:#4A4560}
body.pv7-home .pv6-faq-answer p{margin:0}
body.pv7-home .pv6-faq-answer a{display:inline-block; margin-top:10px; margin-right:12px; color:var(--v7-lav); font-weight:800; font-size:13.5px}

/* 동네 지도 */
body.pv7-home .pv6-local,body.pv7-home .pv6-localg{padding:30px 22px!important; border-radius:32px; background:#fff!important; border:1px solid var(--v7-line)!important; box-shadow:var(--v7-sh)}
body.pv7-home .plc-addr,body.pv7-home .pv6-local form button{background:var(--v7-butter)!important; border-color:#F2BE3A!important; color:var(--v7-ink)!important; border-radius:14px!important}
body.pv7-home .plc-geo{background:var(--v7-ink)!important; border-color:var(--v7-ink)!important; color:#fff!important; border-radius:14px!important}
body.pv7-home .plc-kinds button.on{background:var(--v7-ink)!important; border-color:var(--v7-ink)!important; color:#fff!important}
body.pv7-home #plcMap{border-radius:20px; overflow:hidden}

/* 커뮤니티 안내 띠 */
body.pv7-home .pv6-community-link{
  display:grid; grid-template-columns:minmax(0,1fr); gap:18px; align-items:center; padding:34px 26px!important;
  border-radius:32px; background:linear-gradient(135deg,#FF7A62,#FF5470)!important; color:#fff; border:0!important;
}
body.pv7-home .pv6-community-link .pv6-kicker{background:rgba(255,255,255,.2); color:#fff}
body.pv7-home .pv6-community-link h2{color:#fff}
body.pv7-home .pv6-community-link p{color:rgba(255,255,255,.88)!important}
body.pv7-home .pv6-community-link .pv6-action{margin:0; max-width:none; background:#fff!important; color:var(--v7-coral-d)!important; box-shadow:0 10px 22px rgba(120,20,30,.18)}
@media (min-width:760px){
  body.pv7-home .pv6-community-link{grid-template-columns:minmax(0,1fr) auto; padding:40px 44px!important}
  body.pv7-home .pv6-community-link .pv6-action{min-width:240px}
  body.pv7-home .pv6-owner{padding:44px!important}
  body.pv7-home .pv6-local,body.pv7-home .pv6-localg{padding:40px!important}
}
body.pv7-home .pv6-disclaimer{margin:40px 0 0; text-align:center; font-size:12.5px; color:var(--v7-sub)}

/* ── 6. 푸터 간격 ───────────────────────── */
body.pv7 footer.site-footer-v4{margin:64px -20px 0; padding-left:20px; padding-right:20px}
@media (max-width:560px){ body.pv7 footer.site-footer-v4{margin:56px -14px 0} }

/* ── 7. 모바일 보정 (기본 규칙 뒤에 두어야 적용됨) ── */
@media (max-width:560px){
  body.pv7-home .pv6-hero .pv5-steps{gap:6px}
  body.pv7-home .pv6-hero .pv5-steps li{flex-direction:column; justify-content:center; gap:4px; min-height:64px; padding:8px 4px; font-size:12px; text-align:center; border-radius:14px}
  body.pv7-home .pv6-step-no{flex:0 0 22px; width:22px; height:22px; font-size:11px}
  body.pv7-home #form .pick button{font-size:13px; padding:0 4px; white-space:nowrap; letter-spacing:-.03em}
  body.pv7-home .card{padding:18px; border-radius:24px}
  body.pv7-home .pv7-app::before{inset:10px -6px -8px 10px; transform:none}
}
/* ── 8. 보정 (2026-10-05 2차) ── */
body.pv7 .topbar #pnHbBtn{margin-right:0!important}
body.pv7 .topbar #tbPetHome{margin-left:2px!important}
/* 한국어만 어절 단위 줄바꿈 — 일본어·중국어는 글자 단위, 영어·스페인어는 단어 단위 */
html:not([lang^="ko"]) body.pv7 :is(h1,h2,h3,p,li,a,span,strong,summary,div){word-break:normal!important; overflow-wrap:break-word}
html[lang^="ja"] body.pv7,html[lang^="zh"] body.pv7{line-break:strict}
body.pv7-home .pv6-feed-head > div{min-width:0; flex:1 1 auto}
@media (max-width:420px){
  body.pv7 .topbar > a.tb-btn[href*="community"]{display:none!important}
  body.pv7 .topbar #tbLogin{padding:0 12px; font-size:12.5px; max-width:132px; overflow:hidden; text-overflow:ellipsis}
  body.pv7 .topbar #tbPetHome{font-size:16px!important}
}
body.pv7 .topbar #tbPetHome{flex:0 0 auto!important; width:auto!important; max-width:none!important; min-width:0!important; justify-content:flex-start!important}
body.pv7 .topbar > *:not(#tbPetHome){flex:0 0 auto!important}

/* ── 9. 하위 페이지 공통 (커뮤니티·내 반려동물·등록·내 잔액) ── */
body.pv7{
  --pv6-navy:#27213F; --pv6-muted:#6C6680; --pv6-blue:#7462E8; --pv6-purple:#7462E8;
  --pv6-gold-start:#FF7A62; --pv6-gold-end:#FF5470; --pv6-gold-shadow:#D93F55;
  --pv6-sky:#FFF1E8; --pv6-sky-light:#FFF8F1; --pv6-cream:#FFF8F1; --pv6-peach:#FFEDE4;
  --pv6-line:#F0E5D9; --pv6-radius:24px; --pv6-shadow:0 14px 36px rgba(39,33,63,.08);
}
body.pv7:not(.pv7-home){
  background:
    radial-gradient(900px 520px at 92% -6%, #FFE3EC 0, rgba(255,227,236,0) 62%),
    radial-gradient(760px 480px at -12% 4%, #ECE8FF 0, rgba(236,232,255,0) 58%),
    #FFF8F1 no-repeat!important;
}
body.pv7 .wrap > .newbtn, body.pv7 #regForm .submit, body.pv7 #doneView #goAnalyze, body.pv7 #content .bal .chg,
body.pv7 #edSave, body.pv7 #writeBody #wGo, body.pv7 #content #mbLogin, body.pv7 [data-pv6-login],
body.pv7 #form .go:not(:disabled), body.pv7 #sjOvl .sj-go:not(:disabled), body.pv7 #result .acts .pri{
  background:linear-gradient(135deg,#FF7A62,#FF5470)!important; color:#fff!important; border:0!important;
  box-shadow:0 10px 22px rgba(255,84,112,.26)!important; border-radius:18px!important; font-weight:900!important;
}
body.pv7 #result .acts .pri{background:var(--v7-ink)!important; box-shadow:none!important}
body.pv7:not(.pv7-home) h1{color:var(--v7-ink); letter-spacing:-.04em; font-weight:900}
body.pv7 .seg button.sel,body.pv7 .pcn-tab.on,body.pv7 [role="tab"][aria-selected="true"]{border-color:var(--v7-coral)}
body.pv7 .topbar #tbLogin,body.pv7 .topbar #tbDd,body.pv7 .topbar #tbLangDd,body.pv7 .topbar .tb-dd-trg{width:auto!important; min-width:0!important; flex:0 0 auto!important}
@media (max-width:480px){ body.pv7 .topbar .tb-tx{display:none!important} body.pv7 .topbar .tb-dd-trg{padding:0 10px!important} }
body.pv7-home header.pv6-hero:has(#result[style*="block"]) .pv7-app::before,
body.pv7-home header.pv6-hero:has(#loading[style*="block"]) .pv7-app::before{display:none}

/* ── 10. 상단바 드롭다운 잘림 수정 (2026-10-05) — clip-path가 언어·계정 메뉴를 잘라 먹던 문제 ──
   전폭 배경은 border-image(레이아웃·스크롤 영향 없음)로 칠하고 clip-path·box-shadow는 쓰지 않는다 */
body.pv7 .wrap > .topbar,body.pv7 .topbar{
  clip-path:none!important; box-shadow:none!important; overflow:visible!important;
  border-image:linear-gradient(rgba(255,248,241,.92),rgba(255,248,241,.92)) fill 0 / 0 / 0 100vmax;
}
body.pv7 .topbar .tb-dd{position:relative}
body.pv7 .topbar .tb-dd-menu{z-index:80}

/* ── 11. 내 반려동물 카드 (2026-10-06) — 인라인 .pcard{display:flex}와 사진 100% 폭이 겹쳐
   이름·수정·삭제 버튼이 14px로 눌려 보이지 않던 문제 수정 ── */
body.pv7 #content .plist{display:grid; grid-template-columns:minmax(0,1fr); gap:14px}
@media (min-width:760px){ body.pv7 #content .plist{grid-template-columns:repeat(2,minmax(0,1fr))} }
body.pv7 #content .pcard{
  display:grid!important; grid-template-columns:92px minmax(0,1fr); grid-template-areas:"ph nm" "ph meta" "acts acts";
  column-gap:14px; row-gap:2px; align-items:center; padding:16px!important; border-radius:24px!important;
  border:1px solid var(--v7-line)!important; background:#fff!important; box-shadow:var(--v7-sh-s)!important;
}
body.pv7 #content .pcard > .ph{
  grid-area:ph; width:92px!important; height:92px!important; aspect-ratio:1!important; border-radius:22px!important;
  font-size:40px!important; background:linear-gradient(135deg,#FFEDE4,#F0EDFF)!important; overflow:hidden; align-self:start;
}
body.pv7 #content .pcard > .ph img{width:100%!important; height:100%!important; object-fit:cover}
body.pv7 #content .pcard > .body{display:contents}
body.pv7 #content .pcard .nm{grid-area:nm; align-self:end; font-size:19px!important; font-weight:900!important; color:var(--v7-ink)!important}
body.pv7 #content .pcard .meta{grid-area:meta; align-self:start; margin:0!important; font-size:12.5px!important; color:var(--v7-sub)!important}
body.pv7 #content .pcard .acts{grid-area:acts; display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:14px 0 0!important}
body.pv7 #content .pcard .acts button{min-height:44px!important; border-radius:14px!important; font-size:13px!important; font-weight:800!important; white-space:nowrap!important; padding:0 6px!important; letter-spacing:-.02em}
body.pv7 #content .pcard .acts .view{background:var(--v7-lav-s)!important; border-color:#DCD5FF!important; color:var(--v7-lav)!important}
body.pv7 #content .pcard .acts .ed{background:#fff!important; border:1.5px solid var(--v7-ink)!important; color:var(--v7-ink)!important}
body.pv7 #content .pcard .acts .ed.need{background:linear-gradient(135deg,#FF7A62,#FF5470)!important; border:0!important; color:#fff!important; box-shadow:0 6px 14px rgba(255,84,112,.25)!important}
body.pv7 #content .pcard .acts .del{background:#FFF5F5!important; border-color:#F5D3D3!important; color:#C2362F!important}
body.pv7 #editOvl .sheet{border-radius:26px; padding:24px 20px; max-height:90vh; overflow:auto}
body.pv7 #editOvl .sheet h2{font-weight:900; color:var(--v7-ink)}
body.pv7 #editOvl .fld input,body.pv7 #editOvl .fld select{min-height:48px; border-radius:14px; border:1.5px solid var(--v7-line); font-size:16px; background:#fff}
body.pv7 #editOvl .fld input:focus,body.pv7 #editOvl .fld select:focus{border-color:var(--v7-lav); box-shadow:0 0 0 4px rgba(116,98,232,.12)}
body.pv7 #editOvl .row button{min-height:50px; border-radius:16px}

/* ── 12. 내 반려동물 이용/관리 분리 (2026-10-06) ── */
body.pmp-use #content .pcard .acts .ed,body.pmp-use #content .pcard .acts .del{display:none!important}
body.pmp-use #content .pcard .acts{grid-template-columns:1fr!important}
body.pmp-use #content .pcard .acts .view{min-height:50px!important; background:linear-gradient(135deg,#FF7A62,#FF5470)!important; border:0!important; color:#fff!important; font-size:15px!important; box-shadow:0 8px 18px rgba(255,84,112,.25)!important}
body.pmp-use .wrap > .newbtn{display:none!important}
body.pmp-manage #content .pcard .acts .view{display:none!important}
body.pmp-manage #content .pcard .acts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.pmp-switch{display:flex; align-items:center; justify-content:center; min-height:48px; margin:16px auto 0; max-width:420px; border-radius:16px; border:1.5px dashed #D9CBBE; background:rgba(255,255,255,.7); color:#27213F; font-size:14px; font-weight:800; text-decoration:none}
.pmp-switch:hover{border-color:#7462E8; color:#7462E8}
.pmp-ovl{position:fixed; inset:0; z-index:90; display:none; align-items:flex-end; justify-content:center; background:rgba(39,33,63,.45); padding:0}
.pmp-ovl.on{display:flex}
.pmp-sheet{width:100%; max-width:520px; max-height:88vh; overflow:auto; background:#FFFCF9; border-radius:28px 28px 0 0; padding:22px 18px calc(18px + env(safe-area-inset-bottom)); box-shadow:0 -12px 40px rgba(39,33,63,.2); animation:pmpUp .2s ease-out}
@keyframes pmpUp{from{transform:translateY(24px); opacity:.6}to{transform:none; opacity:1}}
@media (min-width:640px){ .pmp-ovl{align-items:center; padding:20px} .pmp-sheet{border-radius:28px} }
.pmp-head{display:flex; align-items:center; gap:14px; margin-bottom:16px}
.pmp-thumb{flex:0 0 64px; width:64px; height:64px; border-radius:20px; overflow:hidden; display:grid; place-items:center; font-size:30px; background:linear-gradient(135deg,#FFEDE4,#F0EDFF)}
.pmp-thumb img{width:100%; height:100%; object-fit:cover}
.pmp-nm{font-size:20px; font-weight:900; color:#27213F; letter-spacing:-.03em}
.pmp-q{font-size:13.5px; color:#6C6680; margin-top:2px}
.pmp-list{display:grid; gap:10px}
.pmp-item{display:flex; align-items:center; gap:12px; padding:14px; border-radius:18px; background:#fff; border:1px solid #F0E5D9; text-decoration:none; color:#27213F; transition:border-color .15s, transform .15s}
.pmp-item:hover{border-color:#FF9A86; transform:translateY(-1px)}
.pmp-ic{flex:0 0 44px; height:44px; border-radius:14px; display:grid; place-items:center; font-size:22px; background:#FFEDE4}
.pmp-saju .pmp-ic{background:#F0EDFF} .pmp-brag .pmp-ic,.pmp-match .pmp-ic{background:#E3F7F1}
.pmp-tx{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.pmp-tx b{font-size:15.5px; font-weight:900} .pmp-tx small{font-size:12.5px; color:#6C6680; line-height:1.5}
.pmp-pr{flex:0 0 auto; font-size:13px; font-weight:900; color:#E2473B}
.pmp-brag .pmp-pr,.pmp-match .pmp-pr{color:#178A70}
.pmp-note{margin:14px 2px 0; font-size:12px; color:#6C6680; line-height:1.6}
.pmp-close{display:block; width:100%; min-height:48px; margin-top:12px; border:0; border-radius:16px; background:#EFE8E0; color:#27213F; font-size:14.5px; font-weight:800; font-family:inherit; cursor:pointer}

/* ── 11. 상단바 버튼 늘어남 수정 (2026-10-09) ──
   하위 페이지에 함께 로드되는 pet-v6-home.css의 .topbar > .tb-btn{width:100%}가 flex 상단바에서
   커뮤니티·이용 안내 버튼을 전폭으로 늘려 언어·계정 버튼이 화면 밖으로 밀리던 문제 */
body.pv7 .topbar > .tb-btn:not(#tbPetHome){width:auto!important; max-width:none!important; grid-area:auto!important}
body.pv7 .topbar > *{grid-area:auto!important}
@media (max-width:560px){
  body.pv7 .topbar > a.tb-btn[href*="community"]{width:38px!important}
}
/* 모바일에서 이메일이 숨겨지면 계정 버튼이 ▾만 남아 비어 보이던 문제 → 사람 아이콘 표시 */
@media (max-width:480px){
  body.pv7 .topbar #tbDdTrg::before{content:"\1F464"; font-size:16px; line-height:1; margin-right:2px}
  body.pv7 .topbar #tbDdTrg{gap:2px}
}

/* ── 12. 부자사주 바로가기 로고 (2026-10-11) — 흐린 옛 로고 대신 부자사주 마스코트+이름, 다른 버튼과 같은 알약 모양 ── */
body.pv7 .topbar #tbHome{opacity:1!important; gap:6px; height:40px; padding:0 12px 0 6px!important; border:1px solid #F0E5D9; border-radius:999px; background:#fff}
body.pv7 .topbar #tbHome:hover{border-color:#E9CDBE; background:#FFFBF8}
body.pv7 .topbar #tbHome img{height:28px!important; width:28px!important}
body.pv7 .topbar #tbHome .tb-buja-tx{font-size:13px; font-weight:800; color:#1B2A5B; white-space:nowrap; letter-spacing:-.02em}
@media (max-width:1060px){ body.pv7 .topbar #tbHome .tb-buja-tx{display:none} body.pv7 .topbar #tbHome{padding:0 6px!important} }
@media (min-width:821px){ body.pv7 .topbar #tbHome{display:inline-flex!important} }  /* 하위 페이지(pet-v6-home)에서도 데스크톱이면 표시 */
/* 부자사주 바로가기 모바일 (2026-10-11 대표) — 숨기지 않고 마스코트 원형 아이콘으로 */
@media (max-width:820px){
  body.pv7 .topbar #tbHome{display:inline-flex!important; width:38px; height:38px; padding:0!important; justify-content:center; align-items:center}
  body.pv7 .topbar #tbHome img{width:30px!important; height:30px!important}
  body.pv7 .topbar #tbHome .tb-buja-tx{display:none!important}
}
