/* Послуги і ціни v2: «меню бутіка» з вкладками (2026-10-27) */
/* без JS: усі категорії одна під одною в кремовій панелі */
#services .pm-tabs{display:none}
#services .pm-panel{position:relative;margin-top:2.5rem!important;padding:1.5rem 1.25rem .75rem;background:color-mix(in oklab,var(--color-surface) 50%,#fff);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:0 1px 0 #fff inset,0 18px 48px -26px #28190f33;row-gap:2.5rem!important}
#services .pm-cat-h{font-size:1.5rem!important}
#services .pm-cat-h>span:last-child{background:color-mix(in oklab,var(--color-accent) 30%,var(--color-border))!important}
#services .pm-list{margin-top:.75rem!important}

/* рядок меню: назва ……… ціна */
#services .pm-row{grid-template-columns:minmax(0,auto) minmax(1.25rem,1fr) auto!important;align-items:start!important;column-gap:.6rem!important;padding:1.05rem 0!important;border:0!important}
#services .pm-row::after{content:"";order:1;align-self:start;height:1px;margin-top:1.05rem;background-image:radial-gradient(circle,color-mix(in oklab,var(--color-muted) 70%,transparent) .7px,transparent 1px);background-size:6px 2px;background-repeat:repeat-x;background-position:0 50%;min-width:1.25rem;transition:background-image var(--dur-2) var(--ease-soft)}
#services .pm-row>.min-w-0{order:0}
#services .pm-row>.pm-price{order:2}
#services .pm-row>.min-w-0>div:first-child{font-family:var(--font-serif);font-size:1.2rem!important;line-height:1.3!important;letter-spacing:-.005em}
#services .pm-row a.svc-page-link{text-decoration:none;color:var(--color-ink);background:linear-gradient(var(--color-accent),var(--color-accent)) 0 100%/0 1px no-repeat;transition:background-size var(--dur-3) var(--ease-rise),color var(--dur-2) var(--ease-soft)}
#services .pm-row a.svc-page-link:hover,#services .pm-row a.svc-page-link:focus-visible{color:var(--color-accent);background-size:100% 1px}
#services .pm-dur{margin-top:.3rem!important;font-size:.66rem!important;color:var(--color-muted)!important;opacity:.85}
#services .pm-price{font-size:1.4rem!important;font-weight:400!important;line-height:1.3!important;color:var(--color-ink)!important;padding-top:.05rem}
@media (hover:hover){#services .pm-row:hover::after{background-image:radial-gradient(circle,var(--color-accent) .8px,transparent 1.1px)}#services .pm-row:hover .pm-price{color:var(--color-accent)!important}}
#services .pm-note{margin-top:.25rem!important;padding-bottom:.75rem;font-family:var(--font-serif);font-style:italic;font-size:.9rem!important;color:var(--color-muted)!important}

/* заклик */
#services .pm-cta{margin-top:2.5rem!important;padding-top:1.75rem!important;border-top:0!important;justify-content:center!important;text-align:center;flex-direction:column;gap:1rem!important}
#services .pm-cta::before{content:"";display:block;width:3.5rem;height:1px;background:var(--color-accent);opacity:.6;margin-bottom:.25rem}
#services .pm-cta>p{font-family:var(--font-serif);font-style:italic;font-size:1.15rem!important;color:var(--color-ink)!important;max-width:30ch!important}

@media (max-width:479px){#services .pm-row>.min-w-0>div:first-child{font-size:1.1rem!important}#services .pm-price{font-size:1.25rem!important}}
@media (min-width:768px){#services .pm-panel{padding:2rem 2.25rem 1rem}}

/* ===== з JS: вкладки ===== */
#services.pm-js .pm-tabs{position:relative;display:flex;gap:.25rem;width:max-content;max-width:100%;margin-top:2.25rem;padding:.3rem;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:color-mix(in oklab,var(--color-surface) 60%,#fff);box-shadow:var(--shadow-soft-md);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#services.pm-js .pm-tabs::-webkit-scrollbar{display:none}
#services .pm-tab{position:relative;z-index:1;flex:none;padding:.6rem 1.15rem;border:0;border-radius:var(--radius-pill);background:none;font-family:var(--font-serif);font-style:italic;font-size:1.05rem;line-height:1.1;color:var(--color-muted);cursor:pointer;white-space:nowrap;transition:color var(--dur-2) var(--ease-soft)}
#services .pm-tab:hover{color:var(--color-ink)}
#services .pm-tab[aria-selected="true"]{color:#fff}
#services .pm-tab:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
#services .pm-ind{position:absolute;z-index:0;left:0;top:.3rem;height:calc(100% - .6rem);width:0;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:0 6px 16px -8px color-mix(in oklab,var(--color-accent) 80%,transparent);transition:transform .45s var(--ease-rise),width .45s var(--ease-rise),height .45s var(--ease-rise)}
#services.pm-js .pm-panel{display:block;margin-top:1.25rem!important;min-height:12rem}
#services.pm-js .pm-cat{display:none}
#services.pm-js .pm-cat.pm-active{display:block}
#services.pm-js .pm-cat-h{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#services.pm-js .pm-list{margin-top:0!important}

@media (min-width:1024px){
  #services.pm-js .pm-wrap{display:grid;grid-template-columns:13rem minmax(0,1fr);gap:2.5rem;align-items:start;margin-top:2.5rem}
  #services.pm-js .pm-tabs{flex-direction:column;width:auto;margin-top:0;padding:.4rem;border-radius:var(--radius-xl);overflow:visible}
  #services.pm-js .pm-tab{text-align:left;padding:.85rem 1.25rem;font-size:1.25rem;border-radius:var(--radius-lg)}
  #services.pm-js .pm-ind{top:0;left:.4rem;width:calc(100% - .8rem)!important;border-radius:var(--radius-lg)}
  #services.pm-js .pm-panel{margin-top:0!important;padding:1.75rem 2.5rem 1rem}
}

@media (prefers-reduced-motion:no-preference){
  #services.pm-js .pm-cat.pm-anim{animation:pm-in .5s var(--ease-rise) both}
  #services.pm-js .pm-cat.pm-anim .pm-row{animation:pm-in .55s var(--ease-rise) both}
  #services.pm-js .pm-cat.pm-anim .pm-row:nth-child(2){animation-delay:.05s}
  #services.pm-js .pm-cat.pm-anim .pm-row:nth-child(3){animation-delay:.1s}
  #services.pm-js .pm-cat.pm-anim .pm-row:nth-child(4){animation-delay:.15s}
  #services.pm-js .pm-cat.pm-anim .pm-row:nth-child(5){animation-delay:.2s}
}
@keyframes pm-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#services .pm-ind,#services .pm-tab,#services .pm-row::after{transition:none!important}#services .pm-cat{animation:none!important}}
