/* ============================================================
   av-cluster.css — AI-video cluster child pages
   (/services/ai-video/<sub>). Prefix: avc-  · neo-brutalist skin:
   ink #090a0a, 4px hard offset shadow, signature pastels.
   ============================================================ */
.avc-statband-sec{ padding:clamp(1.4rem,3.2vw,2.4rem) 1.25rem clamp(.4rem,1.5vw,1rem); }
.avc-statement-sec{ text-align:center; }
.avc-statement-sec .mg-statement{ padding:clamp(1rem,2.6vw,1.8rem) 0; }
.avc-checks{ list-style:none; margin:0; padding:0; }

/* problem / solution — copy + animated stage */
.avc-pscene{ display:grid; grid-template-columns:1fr .92fr; gap:clamp(1rem,2.4vw,1.9rem); align-items:center; }
.avc-pscene--flip .avc-pscene__stage{ order:-1; }
.avc-pscene__copy{ min-width:0; }
.avc-pscene__copy > :first-child{ margin-top:0; }
.avc-pscene__stage{ min-width:0; background:#fff; border:1.5px solid #090a0a; border-radius:1rem; box-shadow:4px 4px 0 0 #090a0a; padding:clamp(.7rem,1.6vw,1.1rem); }
.avc-pscene__stage:empty{ display:none; }
.avc-pscene__stage svg{ width:100%; height:auto; display:block; max-height:440px; }
@media (max-width:860px){
  .avc-pscene{ grid-template-columns:1fr; gap:1.1rem; }
  .avc-pscene__stage{ order:-1; max-width:440px; margin:0 auto; width:100%; }
}

/* video-type cards — 3 col desktop, 2 col mobile (never single column) */
.avc-types{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.avc-type{ background:var(--avc-bg,#fff); border:1px solid #090a0a; border-radius:1.25rem; box-shadow:4px 4px 0 0 #090a0a; padding:1.1rem 1rem; transition:box-shadow .2s cubic-bezier(.25,.46,.45,.94), transform .2s cubic-bezier(.25,.46,.45,.94); }
.avc-type:hover{ box-shadow:7px 7px 0 0 #090a0a; transform:translate(-2px,-2px); }
.avc-type__icon{ width:2.4rem; height:2.4rem; border-radius:.7rem; background:#fff; border:1px solid #090a0a; box-shadow:2px 2px 0 0 #090a0a; display:grid; place-items:center; color:#090a0a; margin-bottom:.65rem; }
.avc-type__icon svg{ width:1.25rem; height:1.25rem; }
.avc-type__title{ font-weight:700; color:#090a0a; font-size:1rem; line-height:1.35; margin:0 0 .3rem; }
.avc-type__desc{ color:#3e4042; font-size:.87rem; line-height:1.5; margin:0 0 .6rem; }
.avc-type__meta{ display:flex; gap:.4rem; flex-wrap:wrap; font-size:.78rem; font-weight:700; color:#090a0a; border-top:1.5px dashed rgba(9,10,10,.35); padding-top:.5rem; }
.avc-type__meta span + span::before{ content:"·"; margin-right:.4rem; }
@media (max-width:860px){ .avc-types{ grid-template-columns:repeat(2,1fr); gap:.7rem; } .avc-type{ padding:.85rem .75rem; } .avc-type__desc{ font-size:.8rem; } }

/* comparison table */
.avc-tablewrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1.5px solid #090a0a; border-radius:1rem; box-shadow:4px 4px 0 0 #090a0a; background:#fff; }
.avc-table{ width:100%; border-collapse:collapse; font-size:.92rem; min-width:520px; }
.avc-table th,.avc-table td{ padding:.7rem .85rem; text-align:left; vertical-align:top; border-bottom:1px solid #090a0a; line-height:1.45; color:#090a0a; }
.avc-table thead th{ background:#090a0a; color:#fff; font-weight:700; }
.avc-table thead th:last-child{ background:var(--av-accent,#FF375F); }
.avc-table tbody th{ font-weight:700; background:#fff1b8; width:26%; }
.avc-table tbody td:last-child{ background:#d7f5df; font-weight:600; }
.avc-table tbody tr:last-child th,.avc-table tbody tr:last-child td{ border-bottom:0; }
.avc-note{ margin:.9rem 0 0; font-size:.9rem; color:#3e4042; line-height:1.55; }
.avc-note strong{ color:#090a0a; }

/* CTA drift stickers */
.sp-cta-block{ position:relative; }
.sp-cta-block > :not(.mg-drift){ position:relative; z-index:1; }
.avc-drift--star{ top:-22px; right:5%; width:54px; height:54px; }
.avc-drift--play{ bottom:-16px; left:4%; width:46px; height:46px; }

/* cluster navigation mesh */
.avc-cluster__group{ max-width:1200px; margin:1.4rem auto .6rem; padding:0 1.25rem; font-size:1rem; font-weight:700; color:#090a0a; }
.avc-cluster__grid{ max-width:1200px; margin:0 auto; padding:0 1.25rem; display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
.avc-link{ display:flex; gap:.6rem; align-items:flex-start; text-decoration:none; background:var(--avc-bg,#fff); border:1px solid #090a0a; border-radius:1rem; box-shadow:3px 3px 0 0 #090a0a; padding:.75rem .8rem; color:#090a0a; transition:box-shadow .2s, transform .2s; }
.avc-link:hover{ box-shadow:6px 6px 0 0 #090a0a; transform:translate(-2px,-2px); }
.avc-link__icon{ flex:0 0 auto; width:2rem; height:2rem; display:grid; place-items:center; background:#fff; border:1px solid #090a0a; border-radius:.6rem; }
.avc-link__text{ min-width:0; display:flex; flex-direction:column; gap:.15rem; }
.avc-link__text strong{ font-size:.9rem; line-height:1.3; }
.avc-link__text small{ font-size:.76rem; line-height:1.4; color:#3e4042; }
.avc-cluster__hub{ text-align:center; margin:1.4rem 0 0; }
.avc-cluster__hub a{ color:#090a0a; font-weight:700; text-decoration:underline; text-underline-offset:4px; }
@media (max-width:1000px){ .avc-cluster__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:700px){ .avc-cluster__grid{ grid-template-columns:repeat(2,1fr); gap:.6rem; } .avc-link{ flex-direction:column; gap:.4rem; padding:.65rem; } }
@media (max-width:560px){ .avc-drift--star{ width:40px; height:40px; top:-14px; } .avc-drift--play{ width:34px; height:34px; bottom:-10px; } }
.avc-cluster__grid--inline{ padding:0; max-width:none; }
.avc-toolband{ border:1.5px solid #090a0a; border-radius:1rem; box-shadow:4px 4px 0 0 #090a0a; }
/* answer-first paragraph must stay VISIBLE on mobile (AI retrieval + mobile-first indexing read visible HTML only) */
@media (max-width:768px){ .avc-page .sp-hero__answer{ display:block !important; font-size:.84rem; line-height:1.5; } }
/* plain data tables (cost breakdowns): no highlighted last column */
.avc-table--plain thead th:last-child{ background:#090a0a; }
.avc-table--plain tbody td:last-child{ background:transparent; font-weight:400; }
.avc-table--plain tbody tr:nth-child(even) td{ background:#f6f7f8; }
.avc-table--plain tbody tr.is-total th,.avc-table--plain tbody tr:last-child td{ font-weight:700; }
.avc-lead{ margin:0 0 1rem; color:#3e4042; line-height:1.6; }
.avc-lead strong{ color:#090a0a; }