/* Scoped to #adv-page for embedding inside the site template. */
/* =====================================================================
   Responsive layout — desktop-first rules live in style.css;
   this file adds the wide methodology layout and the step-downs.
   ===================================================================== */
/* ---------- ≥ 992px: horizontal methodology journey ---------- */
@media (min-width: 840px) {
  #adv-page .adv-method__wave { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 8cqw; overflow: visible; z-index: 1; }
  #adv-page .adv-method__vline { display: none; }
  #adv-page .adv-stages { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 28px); }
  #adv-page .adv-stage { padding: calc(8cqw + 32px) 0 0; }
  #adv-page .adv-stage__dot { left: 50%; transform: translate(-50%, -50%); width: 48px; height: 48px; }
  #adv-page .adv-stage.is-active .adv-stage__dot { transform: translate(-50%, -50%) scale(1.14); }
  #adv-page .adv-stage[data-pos="low"] .adv-stage__dot { top: 4cqw; }
  #adv-page .adv-stage[data-pos="high"] .adv-stage__dot { top: 4cqw; }
  #adv-page .adv-stage__card { border-bottom: 0; border: 1px solid rgba(255, 255, 255, .12); border-radius: 20px; background: rgba(255, 255, 255, .05); padding: 22px 20px 24px; height: 100%; }
  #adv-page .adv-stage__card p { font-size: .93rem; }
}
/* ---------- ≥ 1024px + enhanced: pinned methodology fits one viewport ---------- */
@media (min-width: 840px) {
  html.adv-enhanced #adv-page .adv-method__pin { min-height: 100vh; display: flex; align-items: center; padding: calc(var(--adv-header-h) + 16px) 0 40px; }
  html.adv-enhanced #adv-page .adv-method__pin > .adv-shell { width: 100%; }
  html.adv-enhanced #adv-page .adv-method__head { margin-bottom: clamp(28px, 4vh, 56px); }
}
/* ---------- ≤ 1199px ---------- */
@media (max-width: 1199.98px) {
  #adv-page .adv-lab { grid-template-columns: minmax(0, 1fr) minmax(260px, .9fr) minmax(0, 1fr); }
  #adv-page .adv-tech { padding: 18px; gap: 12px; }
  #adv-page .adv-tech__desc { font-size: .88rem; }
  #adv-page .adv-reason:nth-child(even) { top: 28px; }
}
/* ---------- ≤ 1023px: tablet ---------- */
@media (max-width: 839.98px) {
  #adv-page { --adv-header-h: 68px; }
  #adv-page .adv-head--split { grid-template-columns: 1fr; }
  #adv-page .adv-hero__layout { grid-template-columns: 1fr; }
  #adv-page .adv-hero__visual { max-width: 680px; width: 100%; margin-inline: auto; }
  #adv-page .adv-hero__photo { inset: 0; }
  #adv-page .adv-values { grid-template-columns: repeat(2, 1fr); }
  #adv-page .adv-value:nth-child(3) { border-left: 0; padding-left: 0; }
  #adv-page .adv-value:nth-child(n+3) { border-top: 1px solid var(--c-border); }
  #adv-page .adv-expertise__grid { grid-template-columns: 1fr; }
  #adv-page .adv-feature { min-height: 0; }
  #adv-page .adv-lab { grid-template-columns: 1fr 1fr; gap: 0 20px; }
  #adv-page .adv-lab__center { grid-column: 1 / -1; order: -1; min-height: 0; margin-bottom: 20px; display: grid; place-items: center; }
  #adv-page .adv-lab__links { display: none; }
  #adv-page .adv-lab__hub { position: relative; left: auto; top: auto; transform: none; width: min(100%, 320px); }
  #adv-page .adv-lab__col { grid-template-rows: none; }
  #adv-page .adv-deliver__layout { grid-template-columns: 1fr; }
  #adv-page .adv-deliver__visual { position: relative; top: auto; max-width: 560px; width: 100%; margin-inline: auto; }
  #adv-page .adv-deliver__photo { aspect-ratio: 16 / 10; max-height: none; }
  #adv-page .adv-why__layout { grid-template-columns: 1fr; }
  #adv-page .adv-why__head, #adv-page .adv-faq__head { position: relative; top: auto; }
  #adv-page .adv-faq__layout { grid-template-columns: 1fr; gap: 32px; }
  #adv-page .adv-cta__layout:has(.adv-form-slot:not(:empty)) { grid-template-columns: 1fr; }
}
/* ---------- ≤ 767px: mobile ---------- */
@media (max-width: 767.98px) {
  #adv-page .adv-hero__actions .adv-btn { flex: 1 1 100%; }
  #adv-page .net-coord { display: none; }
  #adv-page .net-noise { display: none; }
  #adv-page .net-node text { font-size: 19px; }
  #adv-page .net-core__label { font-size: 15px; }
  #adv-page .adv-values { grid-template-columns: 1fr 1fr; }
  #adv-page .adv-value { padding: 20px 12px 16px 0; flex-direction: column; gap: 10px; }
  #adv-page .adv-value + .adv-value { padding-left: 12px; }
  #adv-page .adv-value:nth-child(3) { padding-left: 0; }
  #adv-page .adv-caps { grid-template-columns: 1fr; }
  #adv-page .adv-cap:nth-child(odd) { border-right: 0; }
  #adv-page .adv-cap:not(:last-child) { border-bottom: 1px solid var(--c-border); }
  #adv-page .adv-lab { grid-template-columns: 1fr; }
  #adv-page .adv-lab__col > li { padding-block: 6px; }
  #adv-page .doc { padding: 12px; gap: 10px; }
  #adv-page .doc-chip { font-size: .72rem; padding: 8px 10px; }
  #adv-page .doc-kpi { font-size: .7rem; padding: 8px 10px 8px 8px; }
  #adv-page .doc-kpi svg { width: 38px; height: 38px; }
  #adv-page .adv-reasons { grid-template-columns: 1fr; }
  #adv-page .adv-reason, #adv-page .adv-reason:nth-child(even) { padding: 28px 0; border-left: 0; top: 0; }
  #adv-page .adv-reason:nth-child(5) { border-bottom: 1px solid rgba(255, 255, 255, .12); }
  #adv-page .adv-reason__no, #adv-page .adv-reason:nth-child(even) .adv-reason__no { right: 0; top: 28px; }
  #adv-page .adv-acc__inner p { padding-right: 0; }
  #adv-page .adv-acc__btn { padding: 22px 0; }
}
/* ---------- ≤ 400px ---------- */
@media (max-width: 400px) {
  #adv-page .adv-values { grid-template-columns: 1fr; }
  #adv-page .adv-value, #adv-page .adv-value + .adv-value, #adv-page .adv-value:nth-child(3) { padding: 18px 0; border-left: 0; flex-direction: row; }
  #adv-page .adv-value + .adv-value { border-top: 1px solid var(--c-border); }
  #adv-page .adv-hero__title { font-size: 2.45rem; }
}

/* ---------- Pinned methodology on short laptop screens ---------- */
@media (min-width: 840px) and (max-height: 820px) {
  html.adv-enhanced #adv-page .adv-method__head { margin-bottom: 20px; gap: 12px 48px; }
  #adv-page .adv-method__head .adv-head__intro { font-size: .95rem; }
  #adv-page .adv-stage__title { font-size: 1.05rem; }
  #adv-page .adv-stage__card { padding-top: 16px; }
  #adv-page .adv-stage__card p { font-size: .86rem; line-height: 1.5; margin-top: 8px; }
  #adv-page .adv-stage__dot { width: 40px; height: 40px; }
  #adv-page .adv-method__ghost { font-size: clamp(7rem, 24vh, 14rem); }
}
@media (max-width: 839.98px) {
  #adv-page .adv-tools__head { grid-template-columns: 1fr; }
  #adv-page .adv-tools__media { max-height: none; }
  #adv-page .adv-why__media, #adv-page .adv-faq__media { max-height: 320px; }
}
