/* SERVICES V5: categories or one price-sorted list, in the same section.
   Two cards per row on wide desktop. Both category content views share
   a grid cell so longer services reserve space without shifting on open. */
:root{
  --service-image-size:200px;--service-image-mobile:152px;--service-card-size:200px;
  --service-row-size:32px;--service-price-width:80px;--service-booking-width:208px;
  --service-swap-duration:160ms;--service-swap-offset:4px;--service-swap-easing:ease;
  --service-all-row-size:40px;
}
.services{padding-block:var(--s8)}
.services-layout{display:flex;flex-direction:column;gap:var(--s4)}
.services-layout>h2{text-align:left;text-wrap:initial}
.service-cards{gap:var(--s2)}
.service-view{display:flex;flex-direction:column;gap:var(--s4);min-width:0}
.service-view-button{min-height:var(--button-height);color:var(--green)}
.service-show-all{width:100%;display:block;padding-block:var(--s1)}
.service-sort-label{display:none}
.service-all-panel{padding:var(--s3);background:var(--surface);display:flex;flex-direction:column;gap:var(--s2)}
.service-all-heading{display:flex;justify-content:space-between;gap:var(--s1)}
.service-all-heading h3{font:600 var(--body)/var(--leading) var(--body-font);text-wrap:initial}
.service-all-heading p{color:var(--green)}
.service-all-list{margin:0}
.service-all-actions{display:flex;justify-content:space-between;align-items:center;gap:var(--s3)}
.service-all-actions>*{width:var(--service-booking-width)}
.services-ready .service-view{animation:service-content-in var(--service-swap-duration) var(--service-swap-easing)}
.service-card{position:relative;grid-template-columns:var(--service-image-size) minmax(0,1fr);min-height:var(--service-card-size);align-items:center;outline:0}
.service-card::after{content:"";position:absolute;inset-inline:0;bottom:0;border-bottom:var(--outline) solid var(--border);pointer-events:none}
.service-anchor{position:absolute;top:0;left:0;scroll-margin-top:calc(var(--header-height) + var(--s3))}
.service-image{height:var(--service-image-size)}
.service-content{min-width:0}
.service-mobile-heading,.service-mobile-mark{display:none}
.service-heading{display:flex;align-items:center;gap:var(--s2);width:100%}
.service-heading h3{min-width:0;text-wrap:initial}
.service-number{width:var(--s3);flex-shrink:0;color:var(--cognac-text);font-variant-numeric:tabular-nums}
.service-overview{padding:var(--s2) var(--s4);display:flex;flex-direction:column;align-items:flex-start;gap:var(--s1)}
.service-overview .price{color:var(--green)}
.service-panel{padding:var(--s2) var(--s4);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s2);align-items:center;align-content:center}
.service-list{grid-column:1/-1;grid-row:1;margin:0;min-width:0}
.service-line,.service-all-line{display:flex;align-items:center;gap:var(--s2);min-height:var(--service-row-size);border-bottom:var(--outline) solid var(--border);font-weight:600}
.service-line dt,.service-all-line dt{flex:1;min-width:0;overflow-wrap:break-word}
.service-duration{font-weight:400;color:var(--green);white-space:nowrap}
.service-line dd,.service-all-line dd{flex:0 0 var(--service-price-width);margin:0;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--green)}
.service-all-line{position:relative;min-height:var(--service-all-row-size);padding-block:var(--s1);align-items:flex-start;border-bottom:0}
.service-all-line::after{content:"";position:absolute;bottom:0;inset-inline:0;border-bottom:var(--outline) solid var(--border);pointer-events:none}
.service-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:var(--target);padding:0;border:0;border-bottom:1px solid var(--frame-line);background:none;border-radius:0;color:var(--green);white-space:nowrap}
.service-toggle:hover{border-bottom-width:2px}
.service-close{grid-column:1;grid-row:2;justify-self:start}
.service-book{grid-column:2;grid-row:2;justify-self:end;width:var(--service-booking-width)}
.services-enhanced .service-content{display:grid}
.services-enhanced .service-overview,.services-enhanced .service-panel{grid-area:1/1;align-self:center}
.services-enhanced .service-panel,.services-enhanced .is-open .service-overview{visibility:hidden;opacity:0;transform:translateY(var(--service-swap-offset));pointer-events:none}
.services-enhanced .is-open .service-panel{visibility:visible;opacity:1;transform:none;pointer-events:auto}
.services-ready .service-overview,.services-ready .service-panel{transition:opacity var(--service-swap-duration) var(--service-swap-easing),transform var(--service-swap-duration) var(--service-swap-easing),visibility 0s var(--service-swap-duration)}
.services-ready .service-card:not(.is-open) .service-overview,.services-ready .is-open .service-panel{transition-delay:0s}
/* The approved 1200px content grid gives each card 592px. Keep one column
   below this breakpoint so names, prices and both actions stay readable. */
@media(min-width:1280px){
  .services{--service-image-size:176px;--service-card-size:256px}
  .service-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
  .service-image{height:auto;align-self:stretch}
  .service-overview,.service-panel{padding-inline:var(--s3)}
  .service-line{padding-block:calc(var(--s1)/2);align-items:flex-start}
}
@media(max-width:899px){
  .services{padding-block:var(--s6)}
  .service-card{grid-template-columns:minmax(0,1fr);min-height:0}
  .service-mobile-heading{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s2)}
  .service-mobile-heading h3{text-wrap:initial}
  .service-mobile-mark{display:inline;white-space:pre}
  .service-image{height:var(--service-image-mobile)}
  .service-heading{display:none}
  .service-overview,.service-panel{padding:var(--s2)}
  .service-panel{grid-template-columns:minmax(0,1fr)}
  .service-close{grid-column:1;grid-row:1}
  .service-list{grid-column:1;grid-row:2}
  .service-book{grid-column:1;grid-row:3;width:100%;justify-self:stretch}
  .service-line{padding-block:var(--s1)}
  .service-sort-label{display:inline}
  .service-all-panel{padding:var(--s2)}
  .service-all-heading{flex-direction:column}
  .service-all-actions{flex-direction:column;align-items:stretch;gap:var(--s2)}
  .service-all-actions>*{width:100%}
  .services-enhanced .service-content{display:block}
  .services-enhanced .service-card:not(.is-open) .service-panel,.services-enhanced .is-open .service-overview{display:none}
  .services-ready .is-open .service-panel,.services-ready .service-card:not(.is-open) .service-overview{animation:service-content-in var(--service-swap-duration) var(--service-swap-easing)}
}
@keyframes service-content-in{from{opacity:0;transform:translateY(var(--service-swap-offset))}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .services .service-overview,.services .service-panel,.services .service-view{transition:none!important;animation:none!important;transform:none!important}
}
@media print{
  .services .service-overview,.services .service-panel{display:block!important;visibility:visible!important;opacity:1!important;transform:none!important;grid-area:auto!important}
  .service-toggle{display:none!important}
}
