/* custom-tablet.css — TABLET breakpoint (768px–1199px, portrait + landscape).
 * Generated per-slug by the wds-wp-tablet-css skill.
 * EVERY rule MUST be wrapped in @media (min-width: 768px) and (max-width: 1199px)
 * AND scoped to body.wds-slug-<slug> (or body[class*="wds-slug-"] for shared nav),
 * so it can NEVER affect the phone (<768) or desktop (>=1200) view.
 * Enqueued in inc/enqueue.php at (min-width:768px) and (max-width:1199px), AFTER
 * custom-mobile.css. DO NOT EDIT BLOCKS BY HAND — re-run the skill for the slug.
 */

/* === wds-tablet: slug:custom-web-design-company START === */
/* Generated: 2026-06-01 | Source: WP page id 32 | Scope: body.wds-slug-custom-web-design-company | Band: 768–1199px */
/*
 * 15+ YEARS EXPERIENCE RULE (WDS agency standard):
 * Tablet layouts ALWAYS preserve 2-col grids. Never collapse multi-col content
 * to single-column on tablet — it wastes screen real estate and looks amateurish.
 * Minimum 2 columns for any grid with 2+ items on the tablet band.
 *
 * BOX EQUALITY RULES:
 * – Tablet: all boxes 50% width (repeat(2,1fr)) + same height (align-items:stretch).
 * – Mobile: all boxes 100% width (grid-template-columns:1fr, handled in custom-mobile.css).
 * – No overlap: no fixed heights on grid containers; cards use flex-column + height:100%.
 * – Last lone box in a 2-col row: grid-column:1/-1 + justify-self:center + max-width:50%.
 */

/* ─────────────────────────────────────────────────────────────────
   BAND-WIDE: portrait (768–1023) + landscape (1024–1199)
   Overrides mobile max-width:900px rules that collapsed grids to 1-col.
   Tablet CSS loads AFTER mobile CSS (same specificity) → wins in this band.
   ───────────────────────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1199px) {

  /* == Typography: between mobile (30px) and desktop (48+px) == */
  body.wds-slug-custom-web-design-company .h1          { font-size: 38px; line-height: 1.18; }
  body.wds-slug-custom-web-design-company .wd-h2       { font-size: 28px; line-height: 1.25; }
  body.wds-slug-custom-web-design-company .lead        { font-size: 15px; line-height: 1.6; }
  body.wds-slug-custom-web-design-company .eyebrow,
  body.wds-slug-custom-web-design-company .wd-eyebrow  { font-size: 11px; letter-spacing: 0.12em; }

  /* == Section horizontal padding == */
  body.wds-slug-custom-web-design-company .hero,
  body.wds-slug-custom-web-design-company .wd-section,
  body.wds-slug-custom-web-design-company .quick_ans_sec        { padding-left: 32px; padding-right: 32px; }
  body.wds-slug-custom-web-design-company section.wd-section[style*="80px 60px"] { padding: 56px 32px !important; /* override inline style */ }
  body.wds-slug-custom-web-design-company .container            { padding-left: 24px; padding-right: 24px; }
  body.wds-slug-custom-web-design-company .wd-wrap              { padding-left: 0; padding-right: 0; }

  /* ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ──
     2-COL GRIDS — 50% width per box, equal row heights (stretch)
     Override mobile's 1-col collapse. align-items:stretch ensures
     all cards in a row reach the same height automatically.
  ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── */
  /* NOTE: every selector excludes .is-hidden. Some grids ship hidden by design
     (e.g. <div class="ai-grid is-hidden">, toggled by JS). Forcing display:grid
     on them would REVEAL content that must stay hidden — never override is-hidden.
     We also do NOT set `display` here: these grids are already display:grid by the
     desktop CSS, so we only need the column/height/gap layout. */
  body.wds-slug-custom-web-design-company .wins-grid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-platform-grid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-ins-grid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .ai-grid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .hs-grid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-pgrid:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-pgrid--2:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-outcomes:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-outcomes--2:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-nblock-row:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-nblock-row--3:not(.is-hidden),
  body.wds-slug-custom-web-design-company .wd-why-pair__cards:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; /* 50% each box */
    align-items: stretch !important;             /* equal height per row */
    gap: 20px !important;
  }

  /* Cards must fill their grid cell fully so equal-height works */
  body.wds-slug-custom-web-design-company .win-card,
  body.wds-slug-custom-web-design-company .wd-plt-card,
  body.wds-slug-custom-web-design-company .wd-ins-card,
  body.wds-slug-custom-web-design-company .ai-card,
  body.wds-slug-custom-web-design-company .hs-card,
  body.wds-slug-custom-web-design-company .wd-pcard,
  body.wds-slug-custom-web-design-company .wd-oc,
  body.wds-slug-custom-web-design-company .wd-ncard,
  body.wds-slug-custom-web-design-company .wd-why-card {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }

  /* ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ──
     LAST LONE BOX — center it when odd item count leaves one alone.
     CRITICAL: use the DIRECT-CHILD combinator `> *` so this ONLY targets the
     grid's real items. Some grids wrap each card in an extra div (e.g.
     .wd-nblock-row--3 > .wd-nblock > .wd-ncard). A descendant selector
     (.grid .card) would match those nested cards too — and since each is the
     only child of its wrapper, it is ALWAYS :last-child:nth-child(odd), so EVERY
     card wrongly got max-width:50% (squeezed to ~167px). `> *` prevents that.
     grid-column:1/-1 spans the row; max-width keeps the lone item at ~50% width;
     justify-self centers it.
  ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── ── */
  body.wds-slug-custom-web-design-company .wins-grid       > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-pgrid        > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-pgrid--2     > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-ins-grid     > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-platform-grid > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .ai-grid         > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .hs-grid         > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-outcomes     > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-outcomes--2  > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-nblock-row   > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-nblock-row--3 > *:last-child:nth-child(odd),
  body.wds-slug-custom-web-design-company .wd-why-pair__cards > *:last-child:nth-child(odd) {
    grid-column: 1 / -1;           /* span full row width */
    max-width: calc(50% - 10px);   /* match sibling card width (50% minus half of 20px gap) */
    justify-self: center;          /* horizontally center in the row */
  }

  /* == Vertical-stack layouts: tighten gap only == */
  body.wds-slug-custom-web-design-company .wd-serv-grid     { gap: 40px; }
  body.wds-slug-custom-web-design-company .wd-stakes-grid   { gap: 40px; }
  body.wds-slug-custom-web-design-company .wd-proc-timeline { gap: 48px; }

  /* == Stake card impact: keep desktop row layout so meta fits beside chart.
        Mobile CSS blows the chart widget to width:100% (288px), which shoves the
        IMPACT/value/subtext column off the card edge (~53px clipped). Restore the
        compact 120px chart so chart + meta sit side-by-side within the card. == */
  body.wds-slug-custom-web-design-company .wd-stake-card__impact {
    flex-direction: row; align-items: center; gap: 16px; flex-wrap: nowrap;
  }
  body.wds-slug-custom-web-design-company .wd-stake-card__impact-widget {
    width: 120px !important;     /* override mobile width:100% */
    max-width: 120px;
    flex-shrink: 0;
  }
  body.wds-slug-custom-web-design-company .wd-stake-card__impact-widget svg {
    width: 100%; height: auto; max-width: 120px;   /* override mobile max-width:200px */
  }

  /* == Hero CTA row: restore inline flex == */
  body.wds-slug-custom-web-design-company .hero__cta-row      { flex-direction: row; align-items: center; gap: 14px; flex-wrap: wrap; }
  body.wds-slug-custom-web-design-company .hero__cta-row .btn { width: auto; }

  /* == Buttons: auto-width on tablet (override mobile's width:100% !important) == */
  body.wds-slug-custom-web-design-company .wd-btn             { width: auto !important; max-width: none; }

  /* == Dark banner: restore horizontal row == */
  body.wds-slug-custom-web-design-company .wd-dark-banner     { flex-direction: row; align-items: center; gap: 24px; }

  /* == Discipline row: restore horizontal == */
  body.wds-slug-custom-web-design-company .wd-disc-row        { flex-direction: row; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: center; }
  body.wds-slug-custom-web-design-company .wd-disc-row .wd-disc__arr { display: inline-flex; }

  /* == Client logos: 4-up row == */
  body.wds-slug-custom-web-design-company .client-logos       { display: flex; flex-wrap: wrap; gap: 10px 12px; justify-content: center; }
  body.wds-slug-custom-web-design-company .client-logos__item { flex: 0 1 calc((100% - 36px) / 4); min-width: 120px; height: 64px; }

  /* == Card image heights == */
  body.wds-slug-custom-web-design-company .wd-pcard__img      { height: 220px; }
  body.wds-slug-custom-web-design-company .wd-ins-card__img   { height: 200px; }

  /* == Callout bar: restore row == */
  body.wds-slug-custom-web-design-company .wd-callout-bar     { flex-direction: row; align-items: center; gap: 16px; text-align: left; }
  body.wds-slug-custom-web-design-company .wd-callout-bar__checks { justify-content: flex-start; }
  body.wds-slug-custom-web-design-company .wd-callout-bar__btn { width: auto; }

  /* == Portfolio footer: restore row == */
  body.wds-slug-custom-web-design-company .wd-pfooter         { flex-direction: row; align-items: center; text-align: left; gap: 16px; }

  /* == Overflow guard == */
  body.wds-slug-custom-web-design-company { overflow-x: clip; }
}

/* ─────────────────────────────────────────────────────────────────
   PORTRAIT (768–1023px) — hero stacks, visual shows below text
   ───────────────────────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1023.98px) {

  body.wds-slug-custom-web-design-company .hero__inner  { grid-template-columns: 1fr; gap: 24px; }
  body.wds-slug-custom-web-design-company .hero__visual { display: block; max-width: 480px; margin: 0 auto; }
  body.wds-slug-custom-web-design-company .h1           { font-size: 34px; line-height: 1.2; }
}

/* ─────────────────────────────────────────────────────────────────
   LANDSCAPE (1024–1199px) — hero goes 2-col side-by-side
   ───────────────────────────────────────────────────────────────── */
@media (min-width: 1024px) and (max-width: 1199px) {

  body.wds-slug-custom-web-design-company .hero__inner  { grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
  body.wds-slug-custom-web-design-company .hero__visual { display: block; }
  body.wds-slug-custom-web-design-company .h1           { font-size: 38px; line-height: 1.18; }
}

/* === wds-tablet: slug:custom-web-design-company END === */

/* === wds-tablet: family:location (web-design-* / website-design-* / ecommerce-web-design-*, wdt-* template) START === */
/* Generated: 2026-06-01 | Source: 35 location pages sharing the wdt-* template
 * Scope: body[class*="wds-slug-"] + .wdt-* selectors. The wdt-* classes exist ONLY on
 * location pages (confirmed 0 usage on non-location pages), so these family rules are
 * self-limited to the location family — exactly like the mobile skill's family:location block.
 * Band: 768–1199. NEVER sets `display` on grids (would reveal is-hidden) and appends
 * :not(.is-hidden). Cards are direct grid children → lone-box uses `> *` combinator.
 *
 * Desktop columns: svc-grid=3, ind__grid=3, why__grid=2, process__steps=3.
 * Mobile CSS already makes svc/ind/process 2-col in PORTRAIT (≤1023.98) but NOT in
 * LANDSCAPE (1024–1199). This block owns the whole tablet band as 2-up (50%) with equal
 * heights + centered lone box, per the BOX EQUALITY RULES.
 */

/* ───────────── BAND-WIDE (768–1199): 2-col, 50% width, equal height per row ───────────── */
@media (min-width: 768px) and (max-width: 1199px) {

  /* 50% boxes + equal-height rows. No `display` set (grids are already display:grid from
     custom.css); :not(.is-hidden) so a hidden grid is never revealed. */
  body[class*="wds-slug-"] .wdt-svc-grid:not(.is-hidden),
  body[class*="wds-slug-"] .wdt-ind__grid:not(.is-hidden),
  body[class*="wds-slug-"] .wdt-why__grid:not(.is-hidden),
  body[class*="wds-slug-"] .wdt-process__steps:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* 50% each (svc/ind/process were 3-col) */
    align-items: stretch !important;                   /* equal height per row */
    gap: 20px !important;
  }

  /* Cards fill their cell so equal-height works */
  body[class*="wds-slug-"] .wdt-svc-card,
  body[class*="wds-slug-"] .wdt-ind__card,
  body[class*="wds-slug-"] .wdt-why__card,
  body[class*="wds-slug-"] .wdt-process__step {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }

  /* Lone last box (odd count) → center it. Direct-child `> *` so nested children are never
     falsely matched. Counts are even today; this is defensive for any page that differs. */
  body[class*="wds-slug-"] .wdt-svc-grid:not(.is-hidden)     > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .wdt-ind__grid:not(.is-hidden)    > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .wdt-why__grid:not(.is-hidden)    > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .wdt-process__steps:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    max-width: calc(50% - 10px);   /* match sibling width (50% minus half the 20px gap) */
    justify-self: center;
  }

  /* Pricing table is a 4-col grid-as-table — scroll it rather than squash (matches mobile). */
  body[class*="wds-slug-"] .wdt-price__table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body[class*="wds-slug-"] .wdt-price__row   { min-width: 560px; }
}

/* ───────────── LANDSCAPE (1024–1199): same 2-col (override desktop 3-col) ─────────────
   The band-wide rules above already cover this, but the desktop 3-col rules also live
   without an upper bound, so we re-assert 2-col here for landscape specificity safety. */
@media (min-width: 1024px) and (max-width: 1199px) {
  body[class*="wds-slug-"] .wdt-svc-grid:not(.is-hidden),
  body[class*="wds-slug-"] .wdt-ind__grid:not(.is-hidden),
  body[class*="wds-slug-"] .wdt-process__steps:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* override desktop repeat(3,1fr) */
  }
}

/* === wds-tablet: family:location END === */

/* === wds-tablet: family:ec (ecommerce / platform pages, ec-* template) START === */
/* Generated: 2026-06-01 | Source: 13 platform pages sharing ec-* grid classes
 * (ecommerce-development, ecommerce-consulting, woocommerce/bigcommerce/shopify-plus/
 * shopware/prestashop/cs-cart/shift4shop/volusion/magento/hyva/multi-vendor-development).
 * Scope: body[class*="wds-slug-"] + .ec-* selectors — ec-* classes exist ONLY on these
 * platform pages (location uses wdt-*, DMS uses dm-*), so the family rules are self-limited.
 * Band: 768–1199. NEVER sets `display` on grids (would reveal is-hidden) and appends
 * :not(.is-hidden). All grid children are direct children → lone-box uses `> *`.
 *
 * Desktop cols: ec-em-row=3, ec-industry-row=4, ec-platform-row=3, ec-insights__grid=3,
 * ec-services__cards--3=3 / --4=4, ec-wins-row--3=3, ec-ai-row--3=3, ec-problem-grid=2.
 * Mobile CSS makes these 2-up in PORTRAIT (≤1023.98) but not LANDSCAPE (1024–1199).
 * This block owns the whole tablet band as 2-up (50%) with equal heights + centered lone box.
 */

@media (min-width: 768px) and (max-width: 1199px) {

  /* 50% boxes + equal-height rows. No `display` set (grids are display:grid from custom.css). */
  body[class*="wds-slug-"] .ec-em-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-industry-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-platform-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-insights__grid:not(.is-hidden),
  body[class*="wds-slug-"] .ec-services__cards:not(.is-hidden),
  body[class*="wds-slug-"] .ec-wins-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-ai-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-problem-grid:not(.is-hidden),
  body[class*="wds-slug-"] .ec-diff__grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* 50% each box */
    align-items: stretch !important;                   /* equal height per row */
    gap: 20px !important;
  }

  /* Cards fill their cell so equal-height works */
  body[class*="wds-slug-"] .ec-em-card,
  body[class*="wds-slug-"] .ec-industry-tile,
  body[class*="wds-slug-"] .ec-platform,
  body[class*="wds-slug-"] .ec-insight-card,
  body[class*="wds-slug-"] .ec-svc-card,
  body[class*="wds-slug-"] .ec-win,
  body[class*="wds-slug-"] .ec-ai-card,
  body[class*="wds-slug-"] .ec-problem-card,
  body[class*="wds-slug-"] .ec-diff__card {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }

  /* Lone last box (odd count) → center it. Direct-child `> *` only (never nested cards). */
  body[class*="wds-slug-"] .ec-em-row:not(.is-hidden)        > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-industry-row:not(.is-hidden)  > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-platform-row:not(.is-hidden)  > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-insights__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-services__cards:not(.is-hidden) > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-wins-row:not(.is-hidden)      > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-ai-row:not(.is-hidden)        > *:last-child:nth-child(odd),
  body[class*="wds-slug-"] .ec-problem-grid:not(.is-hidden)  > *:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    max-width: calc(50% - 10px);   /* match sibling width (50% minus half the 20px gap) */
    justify-self: center;
  }
}

/* LANDSCAPE (1024–1199): re-assert 2-col over desktop 3/4-col for specificity safety. */
@media (min-width: 1024px) and (max-width: 1199px) {
  body[class*="wds-slug-"] .ec-em-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-industry-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-platform-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-insights__grid:not(.is-hidden),
  body[class*="wds-slug-"] .ec-services__cards:not(.is-hidden),
  body[class*="wds-slug-"] .ec-wins-row:not(.is-hidden),
  body[class*="wds-slug-"] .ec-ai-row:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* override desktop repeat(3/4,1fr) */
  }
}

/* === wds-tablet: family:ec END === */

/* === wds-tablet: slug:web-development-services START === */
/* Generated: 2026-06-01 | id 33 | Scope: body.wds-slug-web-development-services | Band: 768–1199
 * Content card grids → 2-up (50%), equal height, lone-box centered. No `display`, :not(.is-hidden).
 * Decorative/flex rows (wd-beyond__row, wd-hub__row, *-label-row) left untouched. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-web-development-services .wd-ai__grid:not(.is-hidden),
  body.wds-slug-web-development-services .wd-ind__grid:not(.is-hidden),
  body.wds-slug-web-development-services .wd-related__grid:not(.is-hidden),
  body.wds-slug-web-development-services .wd-who__cards:not(.is-hidden),
  body.wds-slug-web-development-services .wd-why__grid:not(.is-hidden),
  body.wds-slug-web-development-services .wd-bridge__grid:not(.is-hidden),
  body.wds-slug-web-development-services .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* 6/4/3-col → 2 */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-web-development-services .wd-ai__card,
  body.wds-slug-web-development-services .wd-ind__card,
  body.wds-slug-web-development-services .wd-related__card,
  body.wds-slug-web-development-services .wd-who__card,
  body.wds-slug-web-development-services .wd-why__card,
  body.wds-slug-web-development-services .wd-bridge__card,
  body.wds-slug-web-development-services .win-card { width: 100%; height: 100%; box-sizing: border-box; }
  body.wds-slug-web-development-services .wd-ai__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-web-development-services .wd-ind__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-web-development-services .wd-related__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-web-development-services .wd-who__cards:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-web-development-services .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:web-development-services END === */

/* === wds-tablet: slug:ai-development-services START === */
/* Generated: 2026-06-01 | id 31 | Scope: body.wds-slug-ai-development-services | Band: 768–1199
 * Known grid-col card grids → 2-up. Flex "-grid" classes (svc/why/engage/meth/cs/ins) verified
 * in QA and only constrained if they flag. No `display`, :not(.is-hidden). */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ai-development-services .ind-grid:not(.is-hidden),
  body.wds-slug-ai-development-services .related-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* 4/3-col → 2 */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-ai-development-services .ai-ind-card,
  body.wds-slug-ai-development-services .ai-related-card { width: 100%; height: 100%; box-sizing: border-box; }
  body.wds-slug-ai-development-services .ind-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-development-services .related-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
  /* Case-study card is flex-row (image + body); body squeezed to 40px & clipped in the
     narrow 2-col track. Stack it so the body gets full width. */
  body.wds-slug-ai-development-services .ai-cs-card { flex-direction: column; }
  body.wds-slug-ai-development-services .ai-cs-card .win-card__img { width: 100%; }
  body.wds-slug-ai-development-services .ai-cs-card__body { min-width: 0; }
}
/* === wds-tablet: slug:ai-development-services END === */

/* === wds-tablet: slug:digital-marketing-services START === */
/* Generated: 2026-06-01 | id 28 | Scope: body.wds-slug-digital-marketing-services | Band: 768–1199
 * Content card grids → 2-up. IMPORTANT: dash-* dashboard mockup rows and *-head-row icon rows
 * are decorative — left untouched. No `display`, :not(.is-hidden). */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-digital-marketing-services .dm-diff__grid:not(.is-hidden),
  body.wds-slug-digital-marketing-services .dm-icp__grid:not(.is-hidden),
  body.wds-slug-digital-marketing-services .dm-insights__grid:not(.is-hidden),
  body.wds-slug-digital-marketing-services .dm-svc__grid:not(.is-hidden),
  body.wds-slug-digital-marketing-services .dm-offices__grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* 3-col / fixed → 2 */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-digital-marketing-services .dm-diff__card,
  body.wds-slug-digital-marketing-services .dm-icp__card,
  body.wds-slug-digital-marketing-services .dm-insights__card,
  body.wds-slug-digital-marketing-services .dm-svc__col,
  body.wds-slug-digital-marketing-services .dm-office { width: 100%; height: 100%; box-sizing: border-box; }
  body.wds-slug-digital-marketing-services .dm-diff__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-digital-marketing-services .dm-icp__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-digital-marketing-services .dm-insights__grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:digital-marketing-services END === */

/* === wds-tablet: slug:ai-chatbot-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-ai-chatbot-development | Band: 768-1199 | grids: wins-grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ai-chatbot-development .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-ai-chatbot-development .win-card {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-ai-chatbot-development .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:ai-chatbot-development END === */

/* === wds-tablet: slug:generative-ai-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-generative-ai-development | Band: 768-1199 | grids: gen-benefits__grid, gen-comp__grid, gen-inds__grid, gen-problem__grid, gen-stats__grid, gen-svcs__grid, gen-uc__grid, gen-why__grid, wins-grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-generative-ai-development .gen-benefits__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-comp__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-inds__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-problem__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-stats__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-svcs__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-uc__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .gen-why__grid:not(.is-hidden),
  body.wds-slug-generative-ai-development .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-generative-ai-development .gen-benefit,
  body.wds-slug-generative-ai-development .gen-comp-card,
  body.wds-slug-generative-ai-development .gen-ind,
  body.wds-slug-generative-ai-development .gen-pillar,
  body.wds-slug-generative-ai-development .gen-stat,
  body.wds-slug-generative-ai-development .gen-svc-card,
  body.wds-slug-generative-ai-development .gen-uc-card,
  body.wds-slug-generative-ai-development .gen-why-card,
  body.wds-slug-generative-ai-development .win-card {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-generative-ai-development .gen-benefits__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-generative-ai-development .gen-comp__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-generative-ai-development .gen-stats__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-generative-ai-development .gen-svcs__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-generative-ai-development .gen-why__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-generative-ai-development .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:generative-ai-development END === */

/* === wds-tablet: slug:ai-consulting-services-company START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-ai-consulting-services-company | Band: 768-1199
 * Card + step grids -> 2-up. aic-cmp__row (comparison table) left intact. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ai-consulting-services-company .wins-grid:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-cap:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-ind:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-stats:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-why:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-phases:not(.is-hidden),
  body.wds-slug-ai-consulting-services-company .aic-arch__phases:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-ai-consulting-services-company .win-card,
  body.wds-slug-ai-consulting-services-company .aic-cap__card,
  body.wds-slug-ai-consulting-services-company .aic-ind__card,
  body.wds-slug-ai-consulting-services-company .aic-stats__card,
  body.wds-slug-ai-consulting-services-company .aic-why__card,
  body.wds-slug-ai-consulting-services-company .aic-phases__card,
  body.wds-slug-ai-consulting-services-company .aic-arch__phase { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-ai-consulting-services-company .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-consulting-services-company .aic-ind:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-consulting-services-company .aic-stats:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-consulting-services-company .aic-why:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:ai-consulting-services-company END === */

/* === wds-tablet: slug:claude-ai-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-claude-ai-development | Band: 768-1199
 * Card + cluster + process grids -> 2-up (cai-proc 6-col squeezed text -> 2-up). */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-claude-ai-development .wins-grid:not(.is-hidden),
  body.wds-slug-claude-ai-development .cai-arch__cluster:not(.is-hidden),
  body.wds-slug-claude-ai-development .cai-ind:not(.is-hidden),
  body.wds-slug-claude-ai-development .cai-prf:not(.is-hidden),
  body.wds-slug-claude-ai-development .cai-why:not(.is-hidden),
  body.wds-slug-claude-ai-development .cai-proc:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-claude-ai-development .win-card,
  body.wds-slug-claude-ai-development .cai-arch__pill,
  body.wds-slug-claude-ai-development .cai-ind__card,
  body.wds-slug-claude-ai-development .cai-prf__card,
  body.wds-slug-claude-ai-development .cai-why__card { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-claude-ai-development .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-claude-ai-development .cai-ind:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-claude-ai-development .cai-prf:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-claude-ai-development .cai-why:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:claude-ai-development END === */

/* === wds-tablet: slug:ecommerce-ai-solutions START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-ecommerce-ai-solutions | Band: 768-1199 | grids: eai-ben__grid, eai-bm__grid, eai-caps__grid, eai-inds__grid, eai-proc__grid, eai-why__grid, wins-grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ecommerce-ai-solutions .eai-ben__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .eai-bm__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .eai-caps__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .eai-inds__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .eai-proc__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .eai-why__grid:not(.is-hidden),
  body.wds-slug-ecommerce-ai-solutions .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-ecommerce-ai-solutions .eai-ben__cell,
  body.wds-slug-ecommerce-ai-solutions .eai-bm__card,
  body.wds-slug-ecommerce-ai-solutions .eai-cap,
  body.wds-slug-ecommerce-ai-solutions .eai-ind,
  body.wds-slug-ecommerce-ai-solutions .eai-proc__step,
  body.wds-slug-ecommerce-ai-solutions .eai-why__item,
  body.wds-slug-ecommerce-ai-solutions .win-card {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-ecommerce-ai-solutions .eai-ben__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-ai-solutions .eai-caps__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-ai-solutions .eai-inds__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-ai-solutions .eai-proc__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-ai-solutions .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:ecommerce-ai-solutions END === */

/* === wds-tablet: slug:salesforce-development-services START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-salesforce-development-services | Band: 768-1199 | grids: sf-clouds__grid, sf-why__grid, wins-grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-salesforce-development-services .sf-clouds__grid:not(.is-hidden),
  body.wds-slug-salesforce-development-services .sf-why__grid:not(.is-hidden),
  body.wds-slug-salesforce-development-services .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-salesforce-development-services .sf-cloud,
  body.wds-slug-salesforce-development-services .sf-why__card,
  body.wds-slug-salesforce-development-services .win-card {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-salesforce-development-services .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:salesforce-development-services END === */

/* === wds-tablet: slug:wordpress-website-management START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-wordpress-website-management | Band: 768-1199 | grids: wins-grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-wordpress-website-management .wins-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-wordpress-website-management .win-card {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-wordpress-website-management .wins-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:wordpress-website-management END === */

/* === wds-tablet: slug:adobe-commerce-managed-services START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-adobe-commerce-managed-services | Band: 768-1199 | grids: acm-care__grid, acm-cs__grid, acm-ent__grid, acm-pain__grid, acm-proc__grid, acm-rel__grid, acm-why__grid */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-adobe-commerce-managed-services .acm-care__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-cs__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-ent__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-pain__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-proc__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-rel__grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-managed-services .acm-why__grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;  /* >=2-col -> 2-up 50% */
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-adobe-commerce-managed-services .acm-badge,
  body.wds-slug-adobe-commerce-managed-services .acm-card,
  body.wds-slug-adobe-commerce-managed-services .acm-cs-card,
  body.wds-slug-adobe-commerce-managed-services .acm-ent__left,
  body.wds-slug-adobe-commerce-managed-services .acm-phase,
  body.wds-slug-adobe-commerce-managed-services .acm-rel__card,
  body.wds-slug-adobe-commerce-managed-services .acm-step {
    width: 100%; height: 100%; box-sizing: border-box;
  }
  body.wds-slug-adobe-commerce-managed-services .acm-cs__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-managed-services .acm-pain__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-managed-services .acm-proc__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-managed-services .acm-rel__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-managed-services .acm-why__grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:adobe-commerce-managed-services END === */

/* === wds-tablet: slug:b2b-ecommerce-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-b2b-ecommerce-development | Band: 768-1199 | browser-detected wide grids -> 2-up. Decorative *-mock__row / *-cmp__row left intact. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-b2b-ecommerce-development .b2b-ai:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-blog:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-caps:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-inds:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-plats:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-rel:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-tracks:not(.is-hidden),
  body.wds-slug-b2b-ecommerce-development .b2b-why:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-b2b-ecommerce-development .b2b-card,
  body.wds-slug-b2b-ecommerce-development .b2b-blog__card,
  body.wds-slug-b2b-ecommerce-development .b2b-ind,
  body.wds-slug-b2b-ecommerce-development .b2b-rel__card,
  body.wds-slug-b2b-ecommerce-development .b2b-why__card {
    width:100%; height:100%; box-sizing:border-box;
  }
  body.wds-slug-b2b-ecommerce-development .b2b-caps:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-inds:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-rel:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-why:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-ai:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-blog:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-plats:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-b2b-ecommerce-development .b2b-tracks:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:b2b-ecommerce-development END === */

/* === wds-tablet: slug:reactjs-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-reactjs-development | Band: 768-1199 | browser-detected wide grids -> 2-up. Decorative *-mock__row / *-cmp__row left intact. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-reactjs-development .rjs-adv:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-ai:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-eng:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-inds:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-rel:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-stack:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-svcs:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-tracks:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-why:not(.is-hidden),
  body.wds-slug-reactjs-development .rjs-proc:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-reactjs-development .rjs-card,
  body.wds-slug-reactjs-development .rjs-ind,
  body.wds-slug-reactjs-development .rjs-rel__card,
  body.wds-slug-reactjs-development .rjs-stack__group,
  body.wds-slug-reactjs-development .rjs-why__card,
  body.wds-slug-reactjs-development .rjs-proc__step {
    width:100%; height:100%; box-sizing:border-box;
  }
  body.wds-slug-reactjs-development .rjs-adv:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-ai:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-eng:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-inds:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-rel:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-stack:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-svcs:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-tracks:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-reactjs-development .rjs-why:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:reactjs-development END === */

/* === wds-tablet: slug:ecommerce-migration-services START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-ecommerce-migration-services | Band: 768-1199 | browser-detected wide grids -> 2-up. Decorative *-mock__row / *-cmp__row left intact. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ecommerce-migration-services .em-blog:not(.is-hidden),
  body.wds-slug-ecommerce-migration-services .em-models:not(.is-hidden),
  body.wds-slug-ecommerce-migration-services .em-platforms:not(.is-hidden),
  body.wds-slug-ecommerce-migration-services .em-why:not(.is-hidden),
  body.wds-slug-ecommerce-migration-services .em-signals:not(.is-hidden),
  body.wds-slug-ecommerce-migration-services .em-cost-drivers__list:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important;
    align-items: stretch !important;
    gap: 20px !important;
  }
  body.wds-slug-ecommerce-migration-services .em-blog__card,
  body.wds-slug-ecommerce-migration-services .em-model,
  body.wds-slug-ecommerce-migration-services .em-card {
    width:100%; height:100%; box-sizing:border-box;
  }
  body.wds-slug-ecommerce-migration-services .em-blog:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-migration-services .em-models:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-migration-services .em-platforms:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-migration-services .em-why:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ecommerce-migration-services .em-signals:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
  /* em-signals children carry desktop grid-column span/placement (span 2, 2/4, 4/6, 6/8)
     for the 8-col spanning layout; reset so they flow in the 2-col tablet grid. */
  body.wds-slug-ecommerce-migration-services .em-signals > .em-card:not(:last-child:nth-child(odd)) { grid-column: auto !important; }
}
/* === wds-tablet: slug:ecommerce-migration-services END === */


/* === wds-tablet: slug:shopify-development START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-shopify-development | Band: 768-1199 | browser-detected wide grids -> 2-up. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-shopify-development .steps:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-shopify-development .step { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-shopify-development .steps:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
  /* .service-cards is flex-wrap giving 3-up @220px (names squeezed). Force 2-up. */
  body.wds-slug-shopify-development .service-cards { flex-wrap: wrap; gap: 20px; justify-content: center; }
  body.wds-slug-shopify-development .service-card { flex: 1 1 calc(50% - 10px); max-width: calc(50% - 10px); min-width: 0; box-sizing: border-box; }
}

/* Hero visual: custom-mobile.css hides ALL [class*="__visual"] at <=1023.98 (portrait),
   so the sdv-hero CSS dashboard mockup (.sh-dash + .sh-cards-row) disappears on tablet
   portrait. Re-show it for this page, stacked full-width below the hero text. */
@media (min-width: 768px) and (max-width: 1023.98px) {
  body.wds-slug-shopify-development .sdv-hero .hero__grid { grid-template-columns: 1fr !important; gap: 32px; }  /* override desktop 1fr 1fr */
  body.wds-slug-shopify-development .sdv-hero .hero__visual { display: flex !important; width: 100%; max-width: 100%; min-width: 0; }
  body.wds-slug-shopify-development .sdv-hero .hero__visual .sh-dash,
  body.wds-slug-shopify-development .sdv-hero .hero__visual .sh-cards-row { width: 100%; max-width: 100%; min-width: 0; }
}
/* Landscape (1024-1199): visual already shows (mobile hide doesn't reach); keep it fluid. */
@media (min-width: 1024px) and (max-width: 1199px) {
  body.wds-slug-shopify-development .sdv-hero .hero__visual { min-width: 0; max-width: 100%; }
  body.wds-slug-shopify-development .sdv-hero .hero__visual .sh-dash,
  body.wds-slug-shopify-development .sdv-hero .hero__visual .sh-cards-row { max-width: 100%; min-width: 0; }
}
/* === wds-tablet: slug:shopify-development END === */

/* === wds-tablet: slug:shopify-speed-optimization START === */
/* Generated: 2026-06-01 | Scope: body.wds-slug-shopify-speed-optimization | Band: 768-1199 | browser-detected wide grids -> 2-up. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-shopify-speed-optimization .sso-stats:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-shopify-speed-optimization .sso-stat { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-shopify-speed-optimization .sso-stats:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:shopify-speed-optimization END === */

/* === wds-tablet: slug:headless-commerce-development START === */
/* Hero visual (.hc-arch — in-flow architecture diagram) is hidden on tablet portrait by
   custom-mobile.css's [class*="__visual"] hide. Re-show it stacked + fluid (safe: in-flow,
   single child). Landscape already shows it. */
@media (min-width: 768px) and (max-width: 1023.98px) {
  body.wds-slug-headless-commerce-development .hc-hero__inner { grid-template-columns: 1fr !important; gap: 32px; }
  body.wds-slug-headless-commerce-development .hc-hero__visual { display: flex !important; width: 100%; max-width: 100%; min-width: 0; justify-content: center; }
  body.wds-slug-headless-commerce-development .hc-hero__visual .hc-arch { max-width: 100%; min-width: 0; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  body.wds-slug-headless-commerce-development .hc-hero__visual { min-width: 0; max-width: 100%; }
  body.wds-slug-headless-commerce-development .hc-hero__visual .hc-arch { max-width: 100%; min-width: 0; }
}
/* === wds-tablet: slug:headless-commerce-development END === */

/* === wds-tablet: slug:adobe-commerce-development-services START === */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-adobe-commerce-development-services .steps:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-adobe-commerce-development-services .step-card { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-adobe-commerce-development-services .steps:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:adobe-commerce-development-services END === */

/* === wds-tablet: slug:testimonials START === */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-testimonials .tm-hero__counters:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-testimonials .tm-cnt { width:100%; height:100%; box-sizing:border-box; }
}
/* === wds-tablet: slug:testimonials END === */


/* === wds-tablet: slug:adobe-commerce-development-services START === */
/* Band 768-1199. Grids 3-6col -> 2-up. (Detected at landscape; mobile collapses <1024.) */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-adobe-commerce-development-services .diff-grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-development-services .industries-row1:not(.is-hidden),
  body.wds-slug-adobe-commerce-development-services .platform-grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-development-services .process-grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-development-services .related-grid:not(.is-hidden),
  body.wds-slug-adobe-commerce-development-services .three-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-adobe-commerce-development-services .diff-card,
  body.wds-slug-adobe-commerce-development-services .platform-card,
  body.wds-slug-adobe-commerce-development-services .process-card,
  body.wds-slug-adobe-commerce-development-services .card { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-adobe-commerce-development-services .diff-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-development-services .industries-row1:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-development-services .platform-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-development-services .process-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-development-services .related-grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-adobe-commerce-development-services .three-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:adobe-commerce-development-services END === */

/* === wds-tablet: slug:ai-voice-agent-development START === */
/* Band 768-1199. Grids 3-6col -> 2-up. (Detected at landscape; mobile collapses <1024.) */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ai-voice-agent-development .va-cap:not(.is-hidden),
  body.wds-slug-ai-voice-agent-development .va-comp:not(.is-hidden),
  body.wds-slug-ai-voice-agent-development .va-proc:not(.is-hidden),
  body.wds-slug-ai-voice-agent-development .va-rec:not(.is-hidden),
  body.wds-slug-ai-voice-agent-development .va-tech:not(.is-hidden),
  body.wds-slug-ai-voice-agent-development .va-types:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-ai-voice-agent-development .va-cap__card,
  body.wds-slug-ai-voice-agent-development .va-comp__card,
  body.wds-slug-ai-voice-agent-development .va-rec__card,
  body.wds-slug-ai-voice-agent-development .va-tech__card,
  body.wds-slug-ai-voice-agent-development .va-types__card,
  body.wds-slug-ai-voice-agent-development .va-proc__line { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-ai-voice-agent-development .va-cap:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-voice-agent-development .va-comp:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-voice-agent-development .va-rec:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-voice-agent-development .va-tech:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-ai-voice-agent-development .va-types:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:ai-voice-agent-development END === */

/* === wds-tablet: slug:case-studies START === */
/* Band 768-1199. Grids 3-6col -> 2-up. (Detected at landscape; mobile collapses <1024.) */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-case-studies .cs-method-spine:not(.is-hidden),
  body.wds-slug-case-studies .cs-proof-grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-case-studies .cs-proof-card { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-case-studies .cs-proof-grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:case-studies END === */

/* === wds-tablet: slug:certified-partners START === */
/* Band 768-1199. Grids 3-6col -> 2-up. (Detected at landscape; mobile collapses <1024.) */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-certified-partners .cp-cloud__grid:not(.is-hidden),
  body.wds-slug-certified-partners .cp-pay__grid:not(.is-hidden),
  body.wds-slug-certified-partners .cp-tech__grid:not(.is-hidden) {
    grid-template-columns: repeat(2, 1fr) !important; align-items: stretch !important; gap: 20px !important;
  }
  body.wds-slug-certified-partners .cp-cloud__card,
  body.wds-slug-certified-partners .cp-pay__card,
  body.wds-slug-certified-partners .cp-tech__card { width:100%; height:100%; box-sizing:border-box; }
  body.wds-slug-certified-partners .cp-cloud__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-certified-partners .cp-pay__grid:not(.is-hidden) > *:last-child:nth-child(odd),
  body.wds-slug-certified-partners .cp-tech__grid:not(.is-hidden) > *:last-child:nth-child(odd) {
    grid-column: 1 / -1; max-width: calc(50% - 10px); justify-self: center;
  }
}
/* === wds-tablet: slug:certified-partners END === */

/* === wds-tablet: slug:case-studies-mosaic START === */
/* cs-mosaic rows are nowrap marquees (16x240px = 4080px, animated). Clip overflow so the
   marquee scrolls within bounds instead of causing page horizontal scroll. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-case-studies .cs-mosaic { overflow: hidden; max-width: 100%; }
}
/* === wds-tablet: slug:case-studies-mosaic END === */

/* === wds-tablet: slug:certified-partners-strip START === */
/* cp-strip__cluster is a nowrap row of 9 badges (1272px) — wrap it so it fits. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-certified-partners .cp-strip__cluster { flex-wrap: wrap; justify-content: center; }
}
/* === wds-tablet: slug:certified-partners-strip END === */

/* === wds-tablet: slug:case-studies-bento START === */
/* cs-bento is a 6-col bento; cards span columns and overflow ~284px at landscape.
   Collapse to 2-col and reset span placement so cards fit. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-case-studies .cs-bento { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; }
  
  /* cs-method-spine SVG connector line is 1240px (built for desktop 4-col); clip + cap. */
  body.wds-slug-case-studies .cs-method-spine { overflow: hidden; }
  body.wds-slug-case-studies .cs-method-spine__line { max-width: 100%; }
}
/* === wds-tablet: slug:case-studies-bento END === */

/* === wds-tablet: slug:ai-voice-proc START === */
/* va-rossy__callout-lines 3-col -> 2; va-proc connector line overflows ~71px -> clip. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.wds-slug-ai-voice-agent-development .va-rossy__callout-lines { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; }
  body.wds-slug-ai-voice-agent-development .va-proc { overflow: hidden; }
  body.wds-slug-ai-voice-agent-development .va-proc__line { max-width: 100%; }
}
/* === wds-tablet: slug:ai-voice-proc END === */