/* Service catalog and detail pages. Loaded only by catalog templates. */
#main-content{
  --p26-service-positive:var(--green);
  --p26-service-info:var(--blue);
  --p26-service-panel:color-mix(in srgb,var(--text) 4%,transparent);
  --p26-service-panel-strong:color-mix(in srgb,var(--text) 7%,transparent);
  --p26-service-border:var(--border);
}

.p26-service-hero .p26-service-category{
  margin:20px auto 0;
  color:var(--text-dim);
  font-size:1rem;
}

.p26-service-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
  margin-top:28px;
}

.p26-service-fit .p26-section-intro{margin-bottom:24px;}
.p26-service-audience{
  max-width:780px;
  padding:24px;
  border:1px solid var(--p26-service-border);
  border-radius:16px;
  background:var(--p26-service-panel);
}
.p26-service-audience h3{margin:0 0 8px;font-size:1.125rem;}
.p26-service-audience p{margin:0;color:var(--text-dim);line-height:1.7;}

.p26-service-scope-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
.p26-service-scope-card{
  padding:28px;
  border:1px solid var(--p26-service-border);
  border-radius:18px;
  background:var(--p26-service-panel);
}
.p26-service-scope-card h3{margin:0 0 18px;font-size:1.25rem;}
.p26-service-scope-card ul{display:grid;gap:12px;margin:0;padding:0;list-style:none;}
.p26-service-scope-card li{position:relative;padding-inline-start:28px;color:var(--text-dim);line-height:1.65;}
.p26-service-scope-card li::before{position:absolute;inset-inline-start:0;font-family:var(--mono);font-weight:800;}
.p26-service-scope-included li::before{content:"✓";color:var(--p26-service-positive);}
.p26-service-scope-excluded li::before{content:"−";color:var(--text-dim);}

.p26-service-process{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:none;
}
.p26-service-process-card{
  display:flex;
  gap:18px;
  padding:24px;
  border:1px solid var(--p26-service-border);
  border-radius:18px;
  background:var(--p26-service-panel);
}
.p26-service-step{
  flex:0 0 auto;
  color:var(--p26-service-info);
  font-family:var(--mono);
  font-size:1.25rem;
  font-weight:800;
  line-height:1.2;
}
.p26-service-process-card h3{margin:0 0 8px;font-size:1.125rem;}
.p26-service-process-card p{margin:0;color:var(--text-dim);line-height:1.65;}

.p26-service-price-card{
  max-width:760px;
  padding:clamp(28px,5vw,48px);
  border:1px solid color-mix(in srgb,var(--p26-service-info) 42%,var(--p26-service-border));
  border-radius:22px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--p26-service-info) 9%,transparent),var(--p26-service-panel));
}
.p26-service-price{
  margin:0 0 18px;
  color:var(--text);
  font-size:clamp(2rem,5vw,3.6rem);
  font-weight:800;
  line-height:1.1;
}
.p26-service-price-note{max-width:62ch;margin:0 0 14px;color:var(--text-dim);line-height:1.65;}
.p26-service-price-card .p26-btn{margin-top:10px;}

.p26-svc-faq-list{max-width:820px;}
.p26-svc-faq-item{
  margin-bottom:14px;
  overflow:hidden;
  border:1px solid var(--p26-service-border);
  border-radius:14px;
  background:var(--p26-service-panel);
}
.p26-svc-faq-q{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 20px;
  border:0;
  background:transparent;
  color:var(--text);
  font:600 1rem/1.5 var(--font);
  text-align:start;
  cursor:pointer;
  transition:background-color 200ms var(--ease);
}
.p26-svc-faq-q:hover{background:var(--p26-service-panel-strong);}
.p26-svc-faq-q:focus-visible{outline:3px solid var(--p26-service-info);outline-offset:-3px;}
.p26-svc-faq-plus{flex:0 0 auto;color:var(--p26-service-info);font:700 1.25rem/1 var(--mono);transition:transform 200ms var(--ease);}
.p26-svc-faq-q[aria-expanded="true"] .p26-svc-faq-plus{transform:rotate(45deg);}
.p26-svc-faq-a{padding:0 20px 20px;}
.p26-svc-faq-a p{margin:0;color:var(--text-dim);line-height:1.7;}
.p26-service-js .p26-svc-faq-a[hidden]{display:none;}

.p26-service-guide-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.p26-service-guide-grid article{
  padding:24px;
  border:1px solid var(--p26-service-border);
  border-radius:18px;
  background:var(--p26-service-panel);
}
.p26-service-guide-grid h3{margin:0 0 10px;font-size:1.125rem;}
.p26-service-guide-grid p{margin:0;color:var(--text-dim);line-height:1.7;}

.p26-service-categories{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  padding-top:28px;
}
.p26-service-categories a,.p26-service-categories button{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 16px;
  border:1px solid var(--p26-service-border);
  border-radius:999px;
  color:var(--text);
  background:var(--p26-service-panel);
  text-decoration:none;
  transition:border-color 200ms var(--ease),background-color 200ms var(--ease);
}
.p26-service-categories a:hover,.p26-service-categories a:focus-visible,.p26-service-categories button:hover,.p26-service-categories button:focus-visible,.p26-service-categories button[aria-pressed="true"]{
  border-color:var(--cat-color,var(--p26-service-info));
  background:var(--p26-service-panel-strong);
}
.p26-service-categories button{font:inherit;cursor:pointer}
.p26-cat-dot{width:9px;height:9px;border-radius:50%;background:var(--cat-color,var(--p26-service-info));flex-shrink:0;}
[data-service-category][hidden]{display:none!important}
.p26-category-status{text-align:center;margin-top:20px;color:var(--text-dim)}

/* ============ SERVICE ICONS & CATEGORY ACCENTS ============ */
.p26-category-heading{display:flex;align-items:flex-start;gap:18px;margin-bottom:0;}
.p26-category-icon{
  flex-shrink:0;
  width:52px;height:52px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb, var(--cat-color) 16%, transparent);
  color:var(--cat-color);
  border:1px solid color-mix(in srgb, var(--cat-color) 40%, transparent);
}
.p26-category-icon .p26-icon{width:26px;height:26px;}
.p26-category-section{border-inline-start:2px solid color-mix(in srgb, var(--cat-color) 45%, transparent);padding-inline-start:24px;}

.p26-service-card{position:relative;overflow:hidden;}
.p26-service-card::before{
  content:'';position:absolute;inset-block-start:0;inset-inline:0;height:3px;
  background:var(--cat-color,var(--blue));
}
.p26-service-card:hover{border-color:color-mix(in srgb, var(--cat-color) 65%, var(--border));}
.p26-service-card-icon{
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  border-radius:12px;
  background:color-mix(in srgb, var(--cat-color) 16%, transparent);
  color:var(--cat-color);
  margin-bottom:16px;
}
.p26-service-card-icon .p26-icon{width:22px;height:22px;}
.p26-icon{width:100%;height:100%;}

@media (max-width:600px){
  .p26-category-heading{gap:12px;}
  .p26-category-icon{width:44px;height:44px;border-radius:12px;}
  .p26-category-icon .p26-icon{width:22px;height:22px;}
  .p26-category-section{padding-inline-start:16px;}
}

@media (max-width:900px){
  .p26-service-scope-grid,.p26-service-process,.p26-service-guide-grid{grid-template-columns:1fr;}
}

@media (max-width:600px){
  .p26-service-actions{align-items:stretch;flex-direction:column;}
  .p26-service-actions .p26-btn{width:100%;justify-content:center;}
  .p26-service-scope-card,.p26-service-process-card{padding:20px;}
  .p26-service-process-card{gap:14px;}
  .p26-service-categories{justify-content:flex-start;}
}

@media (prefers-reduced-motion:reduce){
  .p26-svc-faq-q,.p26-svc-faq-plus,.p26-service-categories a{transition:none;}
}
