/* Tech Phase service pages. Loaded after css/styles.css on /ai-automation/ and /web-design/ only. */
body.svc header{position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
body.svc nav a[aria-current="page"]{opacity:1;color:var(--ac)}
body.svc header .nav-sub a[aria-current="page"]{color:#e7b08a;opacity:1}
.svc-hero{padding:3rem 0 4rem;background:linear-gradient(160deg,#ecebe9,#d9d8d5 80%);border-radius:0 0 2rem 2rem}
.svc-hero h1{max-width:20ch;margin:1.25rem 0 1.5rem}
@media(min-width:768px){.svc-hero h1{font-size:3.75rem}}
.svc-hero .lede{max-width:40rem;font-size:1.1rem;line-height:1.6;color:var(--mu)}
.svc-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
@media(max-width:1023px){.svc-cta{padding-right:4rem}.svc-cta .pill{max-width:100%}}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;font-size:.8rem;color:var(--mu)}
.crumbs li+li:before{content:"/";margin-right:.4rem;opacity:.5}
.crumbs a{text-decoration:underline;text-underline-offset:.12em}
.svc-facts{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
@media(max-width:640px){.svc-facts{padding-right:3.75rem}.svc-facts span{white-space:nowrap}}
.svc-facts span{border:1px solid rgba(17,17,17,.15);border-radius:9999px;padding:.4rem .9rem;font-size:.8rem;font-weight:500;background:rgba(255,255,255,.5)}
.svc-sec{padding-block:4rem}
@media(min-width:1024px){.svc-sec{padding-block:5.5rem}}
.svc-sec>.shell>h2{max-width:22ch;margin:1rem 0 1.25rem}
.svc-sec .intro{max-width:44rem;font-size:1.05rem;line-height:1.65;color:var(--mu);margin-bottom:2rem}
.svc-grid{display:grid;gap:1rem}
@media(min-width:768px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1200px){.svc-grid.c3{grid-template-columns:repeat(3,1fr)}}
.svc-card{background:var(--sf);border-radius:1.25rem;padding:1.5rem}
.svc-card h3{font-size:1.2rem;font-weight:600;letter-spacing:-.01em;margin-bottom:.5rem}
.svc-card p{font-size:.95rem;line-height:1.6;color:rgba(17,17,17,.72)}
.svc-card a{color:var(--ac);text-decoration:underline;text-underline-offset:.12em}
.svc-dark{background:var(--ink);color:#fff;border-radius:2rem}
.svc-dark .eb{color:rgba(255,255,255,.7)}
.svc-dark .intro,.svc-dark p{color:rgba(255,255,255,.7)}
.svc-dark .svc-card{background:rgba(255,255,255,.06)}
.svc-dark .svc-card p{color:rgba(255,255,255,.7)}
.svc-steps{counter-reset:s;display:grid;gap:0;max-width:52rem}
.svc-steps li{display:flex;gap:1.25rem;padding:1.4rem 0;border-top:1px solid var(--line)}
.svc-steps li:last-child{border-bottom:1px solid var(--line)}
.svc-steps li:before{counter-increment:s;content:counter(s,decimal-leading-zero);width:2rem;flex:none;font-size:.85rem;font-weight:600;color:var(--ac);padding-top:.2rem}
.svc-steps h3{font-size:1.15rem;font-weight:600}
.svc-steps p{margin-top:.3rem;font-size:.95rem;line-height:1.55;color:var(--mu)}
.svc-list{max-width:52rem;list-style:disc;padding-left:1.2rem}
.svc-list li{margin:.5rem 0;line-height:1.6;color:rgba(17,17,17,.78)}
.svc-dark .svc-list li{color:rgba(255,255,255,.75)}
.svc-tags{display:flex;flex-wrap:wrap;gap:.5rem;max-width:52rem}
.svc-tags span{background:var(--sf);border-radius:9999px;padding:.45rem 1rem;font-size:.85rem;font-weight:500}
.svc-faq{max-width:52rem}
.svc-faq details{border-top:1px solid var(--line);padding:1.1rem 0}
.svc-faq details:last-child{border-bottom:1px solid var(--line)}
.svc-faq summary{cursor:pointer;font-size:1.1rem;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.svc-faq summary::-webkit-details-marker{display:none}
.svc-faq summary:after{content:"+";color:var(--ac);font-weight:500}
.svc-faq details[open] summary:after{content:"–"}
.svc-faq details p{margin-top:.75rem;line-height:1.65;color:rgba(17,17,17,.75)}
.svc-faq a,.svc-sec .intro a,.svc-list a{color:var(--ac);text-decoration:underline;text-underline-offset:.12em}
.svc-related{display:grid;gap:1rem}
@media(min-width:768px){.svc-related{grid-template-columns:repeat(3,1fr)}}
.svc-related a{display:block;border:1px solid var(--line);border-radius:1.25rem;padding:1.5rem;transition:.3s}
.svc-related a:hover{border-color:var(--ac);transform:translateY(-3px)}
.svc-related b{display:block;font-size:1.1rem;margin-bottom:.35rem}
.svc-related span{font-size:.9rem;color:var(--mu)}
#quote .cl p{max-width:28rem;line-height:1.6;color:var(--mu);margin-bottom:1.5rem}
@media(min-width:1024px){body.svc .fg{grid-template-columns:1.4fr repeat(4,1fr)}}
.flab{font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.025em;color:rgba(17,17,17,.5);display:flex;flex-direction:column;gap:.375rem}
