/* ==========================================================================
   Mesosphere — services.css
   Services archive (grid · index · rows) and the single service page.
   Loads on service views only.
   ========================================================================== */
.meso-services{padding-block-start:clamp(48px,6vw,72px)}

/* ---- Grid: even cards, featured = wide spotlight ---- */
.meso-sgrid{display:grid;grid-template-columns:repeat(var(--meso-cols,3),minmax(0,1fr));gap:48px 24px}
.meso-scard__media{aspect-ratio:4/3.1}
.meso-scard__body{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.meso-scard__t{font-size:1.3rem;font-weight:600;line-height:1.3;letter-spacing:-.015em;color:var(--meso-ink)}
.meso-scard__p{font-size:.95rem;line-height:1.75;color:var(--meso-body)}
.meso-scard__tags{display:flex;flex-wrap:wrap;gap:6px;margin-block:2px 4px}
.meso-chip--xs{block-size:30px;padding-inline:12px;font-size:.75rem}
.meso-scard .meso-link{margin-block-start:4px}
.meso-scard:hover .meso-link::after{transform:scaleX(1)}
.meso-scard:hover .meso-link svg{transform:translateX(5px)}
.meso-rtl .meso-scard:hover .meso-link svg{transform:scaleX(-1) translateX(5px)}
.meso-scard.is-feat{grid-column:span 2;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:0;align-items:stretch;border-radius:var(--meso-frame);background:var(--meso-dark);overflow:hidden;color:#fff}
.meso-scard.is-feat .meso-scard__media{aspect-ratio:auto;min-block-size:440px;border-radius:0}
.meso-scard.is-feat:hover .meso-scard__media{transform:none}
.meso-scard.is-feat .meso-scard__body{justify-content:center;gap:14px;padding:clamp(28px,4vw,56px)}
.meso-scard.is-feat .meso-scard__t{font-size:var(--meso-h4);color:#fff}
.meso-scard.is-feat .meso-scard__p{font-size:1.06rem;color:var(--meso-on-dark-muted)}
.meso-scard.is-feat .meso-chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff}
.meso-scard.is-feat .meso-link{color:var(--meso-accent)}
.meso-sgrid--mini{gap:24px}
.meso-sgrid--mini .meso-scard__p,.meso-sgrid--mini .meso-scard__tags{display:none}
.meso-sgrid--mini .meso-scard__t{font-size:1.1rem}
@media (max-width:1024px){.meso-sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.meso-scard.is-feat{grid-template-columns:1fr;grid-column:1/-1}.meso-scard.is-feat .meso-scard__media{min-block-size:300px}}
@media (max-width:640px){.meso-sgrid{grid-template-columns:1fr}.meso-scard.is-feat{grid-column:auto}}

/* ---- Index: numbered rows + live image preview ---- */
.meso-sindex{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:start}
.meso-sindex__list{margin:0;padding:0;list-style:none;border-block-start:1px solid var(--meso-line)}
.meso-sindex__row{position:relative;isolation:isolate;display:grid;grid-template-columns:64px minmax(0,1fr) 44px;align-items:center;gap:20px;padding:30px 20px;border-block-end:1px solid var(--meso-line);color:var(--meso-ink)}
.meso-sindex__row::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:var(--meso-radius);background:var(--meso-bg-soft);opacity:0;transform:scale(.98);transition:opacity .5s var(--meso-ease-s),transform .8s var(--meso-ease)}
.meso-sindex__row:hover::before,.meso-sindex__row.is-on::before{opacity:1;transform:none}
.meso-sindex__n{font-size:.9rem;font-weight:700;color:var(--meso-muted);transition:color var(--meso-t-c)}
.meso-sindex__row.is-on .meso-sindex__n{color:var(--meso-ink)}
.meso-sindex__main{display:flex;flex-direction:column;gap:6px;min-inline-size:0}
.meso-sindex__t{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:clamp(1.3rem,1.1rem + .7vw,1.75rem);font-weight:600;letter-spacing:-.02em}
.meso-sindex__p{max-inline-size:620px;font-size:.95rem;line-height:1.7;color:var(--meso-body)}
.meso-sindex__thumb{display:none}
.meso-sindex__go{inline-size:44px;block-size:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--meso-line-2);transition:background-color var(--meso-t-c),border-color var(--meso-t-c),transform .8s var(--meso-ease)}
.meso-sindex__row:hover .meso-sindex__go,.meso-sindex__row.is-on .meso-sindex__go{background:var(--meso-accent);border-color:var(--meso-accent);transform:rotate(-45deg)}
.meso-rtl .meso-sindex__go svg{transform:scaleX(-1)}
.meso-sindex__row.is-feat .meso-sindex__n{color:var(--meso-ink)}
.meso-sindex__preview{position:sticky;inset-block-start:120px}
.meso-sindex__stage{aspect-ratio:4/4.8;border-radius:var(--meso-frame)}
.meso-sindex__img{position:absolute;inset:0;opacity:0;transform:scale(1.06);transition:opacity .7s var(--meso-ease-s),transform 1.4s var(--meso-ease)}
.meso-sindex__img img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover}
.meso-sindex__img.is-on{opacity:1;transform:none}
@media (max-width:1024px){
	.meso-sindex{grid-template-columns:1fr}
	.meso-sindex__preview{display:none}
	.meso-sindex__row{grid-template-columns:40px minmax(0,1fr) 88px;padding:22px 8px}
	.meso-sindex__thumb{display:block;inline-size:88px;block-size:88px;border-radius:14px}
	.meso-sindex__go{display:none}
}

/* ---- Rows (also used by the QB Service Rows widget) ---- */
.meso-srow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,88px);align-items:center;padding-block:56px}
.meso-srow+.meso-srow{border-block-start:1px solid var(--meso-line)}
.meso-srow.is-rev .meso-srow__img{order:2}
.meso-srow__img{display:block;aspect-ratio:4/3.2;border-radius:var(--meso-frame)}
.meso-srow__img:hover>img{transform:scale(1.045)}
.meso-srow__body{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.meso-srow__l{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--meso-muted)}
.meso-srow__t{font-size:var(--meso-h4);line-height:1.15}
.meso-srow__t a{transition:color var(--meso-t-c)}
.meso-srow__t a:hover{color:var(--meso-ink);background:linear-gradient(var(--meso-accent),var(--meso-accent)) 0 92%/100% .3em no-repeat}
.meso-srow__tags{display:flex;flex-wrap:wrap;gap:8px}
.meso-srow.is-feat{padding:40px;margin-block:12px;border-radius:var(--meso-frame);background:var(--meso-bg-soft);border-block-start:0}
.meso-srow.is-feat+.meso-srow{border-block-start:0}
.meso-srow.is-feat .meso-srow__l{color:var(--meso-ink)}
.meso-srow.is-feat .meso-srow__l::before{content:"";display:inline-block;inline-size:8px;block-size:8px;margin-inline-end:8px;border-radius:50%;background:var(--meso-accent)}
@media (max-width:1024px){.meso-srow{grid-template-columns:1fr;gap:28px;padding-block:40px}.meso-srow.is-rev .meso-srow__img{order:0}.meso-srow.is-feat{padding:24px}}
.meso-chip--static{cursor:default}
.meso-chip--static:hover{border-color:var(--meso-line-2)}

/* ==========================================================================
   Single service
   ========================================================================== */
.meso-sbody__in{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(40px,6vw,88px);align-items:start}
.meso-sbody__main{display:flex;flex-direction:column;gap:22px}
.meso-sbody__main .meso-prose>p:first-child{font-size:1.2rem;line-height:1.7;color:var(--meso-ink)}
.meso-sbody__aside{position:sticky;inset-block-start:110px;display:flex;flex-direction:column;gap:18px}
.meso-sinc{padding:28px;border-radius:var(--meso-radius);background:#fff;border:1px solid var(--meso-line)}
.meso-sinc__t{margin-block-end:18px;font-size:1.1rem;font-weight:600;color:var(--meso-ink)}
.meso-sinc .meso-checks{margin:0;gap:12px}
.meso-sinc .meso-checks li{font-size:.95rem}
.meso-shelp{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:30px;border-radius:var(--meso-radius);background:var(--meso-dark);color:#fff}
.meso-shelp__dome{position:absolute;z-index:-1;inset-inline-end:-30px;inset-block-end:-4px;color:rgba(var(--meso-accent-rgb),.22)}
.meso-shelp__t{font-size:1.25rem;font-weight:600}
.meso-shelp__p{font-size:.92rem;line-height:1.7;color:var(--meso-on-dark-muted)}
.meso-shelp .meso-btn{margin-block:6px 4px}
.meso-shelp__offs{inline-size:100%;margin:6px 0 0;padding:14px 0 0;list-style:none;border-block-start:1px solid var(--meso-on-dark-line);display:flex;flex-direction:column;gap:8px;font-size:.85rem}
.meso-shelp__offs li{display:flex;justify-content:space-between;gap:12px;color:var(--meso-on-dark-muted)}
.meso-shelp__offs a{font-weight:600;color:#fff;transition:color var(--meso-t-c)}
.meso-shelp__offs a:hover{color:var(--meso-accent)}
@media (max-width:1024px){.meso-sbody__in{grid-template-columns:1fr}.meso-sbody__aside{position:static}}
.meso-rtl .meso-srow__l,.meso-rtl .meso-sindex__n{letter-spacing:0;text-transform:none}
.meso-rtl .meso-scard__t,.meso-rtl .meso-sindex__t,.meso-rtl .meso-srow__t,.meso-rtl .meso-shelp__t,.meso-rtl .meso-sinc__t{font-family:var(--meso-font-ar);font-weight:500;letter-spacing:0;line-height:1.45}
