.svc{padding-block:clamp(64px,8vw,120px)}
.svc__head{display:grid;gap:14px;max-width:640px;margin-bottom:clamp(32px,4vw,56px)}
.svc__intro{color:var(--muted);max-width:52ch}
.svc__head .btn{margin-top:8px}
.hubs{border-top:1px solid var(--line)}
.hub{border-bottom:1px solid var(--line)}
.hub__h{font:inherit}
.hub__head{display:grid;grid-template-columns:clamp(72px,10vw,132px) minmax(160px,1.1fr) minmax(0,1.2fr) minmax(0,1.6fr) 44px;gap:clamp(14px,2vw,32px);align-items:center;width:100%;padding:20px 0;text-align:left;cursor:pointer;transition:background var(--fast) linear}
.hub__head:hover{background:linear-gradient(90deg,rgba(128,128,128,.07),transparent)}
.hub__img{aspect-ratio:1;overflow:hidden;border-radius:4px;background:var(--placeholder)}
.hub__img img{width:100%;height:100%;object-fit:cover}
.hub__name{font-size:var(--fs-h5);line-height:1.25;font-weight:500}
.hub__lead{font-size:15px;line-height:1.4}
.hub__text{font-size:14px;line-height:1.5;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hub__icon{position:relative;justify-self:end;width:36px;height:36px;border:1px solid currentColor;border-radius:50%;transition:transform var(--fast) var(--ease)}
.hub__head:hover .hub__icon{transform:translate(2px,-2px)}
.hub__icon::before,.hub__icon::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;transform:translate(-50%,-50%);transition:transform var(--base) var(--ease)}
.hub__icon::after{transform:translate(-50%,-50%) rotate(90deg)}
.hub.is-open .hub__icon::after{transform:translate(-50%,-50%) rotate(0)}
.hub.is-open .hub__text{opacity:0;visibility:hidden}
/* open: grows downward in 500 ms; content arrives top to bottom, 60 ms stagger */
.hub__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 500ms var(--ease)}
.hub.is-open .hub__panel{grid-template-rows:1fr}
.hub__clip{overflow:hidden;min-height:0}
.hub__body{display:grid;grid-template-columns:clamp(72px,10vw,132px) minmax(0,1fr);gap:clamp(14px,2vw,32px);padding:4px 0 36px}
.hub__bigimg{grid-column:1/2}
.hub__bigimg{display:none}
.hub__rows{grid-column:2/-1;display:grid;gap:22px;padding-right:56px}
.hub__row{display:grid;grid-template-columns:minmax(120px,.5fr) minmax(0,2.2fr);gap:20px;align-items:start;padding-top:18px;border-top:1px solid var(--line);opacity:0;transform:translateY(10px);transition:opacity var(--base) var(--ease),transform var(--base) var(--ease)}
.hub.is-open .hub__row,.hub.is-open .hub__close{opacity:1;transform:none}
.hub.is-open .hub__row:nth-child(1){transition-delay:60ms}.hub.is-open .hub__row:nth-child(2){transition-delay:120ms}.hub.is-open .hub__row:nth-child(3){transition-delay:180ms}
.hub__includes{font-size:14px;line-height:1.55;letter-spacing:.02em;text-transform:uppercase}
.hub__row--btn{border-top:0;padding-top:0;grid-template-columns:1fr}
.rel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
.rel__item{flex:none;width:clamp(160px,18vw,240px);scroll-snap-align:start}
.rel__item a,.rel__item span{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;border-radius:4px;background:var(--placeholder)}
.rel__item img,.rel__item video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform var(--base) var(--ease)}
.rel__item a:hover img{transform:scale(1.04)}
.hub__close{display:none;align-items:center;gap:8px;justify-self:end;font-size:12px;text-transform:uppercase;opacity:0;transform:translateY(10px);transition:opacity var(--base) var(--ease),transform var(--base) var(--ease)}
.hub__dot{width:10px;height:10px;border-radius:50%;background:var(--aitio-yellow)}
.svc--playbook .hubs{border-top-color:rgba(0,0,0,.2)}
@media (max-width:1023px){.hub__head{grid-template-columns:clamp(72px,16vw,120px) 1fr 40px}.hub__lead,.hub__text{display:none}.hub__name{grid-column:2}.hub__rows{padding-right:0}}
@media (max-width:767px){
	.hub__head{grid-template-columns:1fr 40px;gap:14px}
	.hub__img{grid-column:1/-1;aspect-ratio:16/10}
	.hub__name{grid-column:1}.hub__icon{grid-column:2;grid-row:2}
	.hub.is-open .hub__img{display:none}
	.hub__body{grid-template-columns:1fr}.hub__bigimg{display:block;grid-column:1;aspect-ratio:16/10;overflow:hidden;border-radius:4px}.hub__bigimg img{width:100%;height:100%;object-fit:cover}
	.hub__rows{grid-column:1}
	.hub__row{grid-template-columns:1fr;gap:10px}
	.hub__close{display:inline-flex}
}
@media (prefers-reduced-motion:reduce){.hub__panel,.hub__row,.hub__close{transition:none;transform:none}}
