/* === DD Promo Cards
   Desktop/Tablet: 3-up, text BELOW image, 8px corners, NO shadow, larger gaps, margin above/below
   Mobile: stacked, text BELOW image, 8px corners (match desktop), NO shadow + margin below
   Aspect ratio: 4:3 on desktop + mobile
   Image fit: desktop/tablet is "contain-first" (show full image); optional per-card crop via .is-cover
   Hover: subtle zoom + tiny lift (link hint)
   Click: no black focus box on mouse/tap (keyboard focus still visible)
   Text: centred + brand heading styles (desktop + mobile)
   UPDATE: make the whole card row ~10% larger (desktop/tablet + mobile) without changing the layout rules
   No carousel. No arrows.
=== */

/* Defensive: never show arrows if any markup exists */
.ddpc-arrow{ display:none !important; }

/* Predictable sizing */
.ddpc, .ddpc *{ box-sizing:border-box; }

/* Hard kill any theme/Elementor shadows/filters that may bleed in */
.ddpc-card,
.ddpc-media,
.ddpc-card::before,
.ddpc-card::after{
  box-shadow:none !important;
  filter:none !important;
}

/* Remove iOS tap highlight + suppress click focus ring (keyboard focus still shown via :focus-visible) */
.elementor-widget-ddpc_promo_cards .ddpc-card,
.ddpc-card{
  -webkit-tap-highlight-color: transparent;
  outline: none !important;
}
.elementor-widget-ddpc_promo_cards .ddpc-card:active,
.ddpc-card:active{
  outline: none !important;
  box-shadow: none !important;
}

/* Keep an accessible focus style ONLY for keyboard users */
.elementor-widget-ddpc_promo_cards .ddpc-card:focus,
.ddpc-card:focus{
  outline: none !important;
}
.elementor-widget-ddpc_promo_cards .ddpc-card:focus:not(:focus-visible),
.ddpc-card:focus:not(:focus-visible){
  outline: none !important;
}
.elementor-widget-ddpc_promo_cards .ddpc-card:focus-visible,
.ddpc-card:focus-visible{
  outline: 2px solid rgba(0,0,0,.35) !important;
  outline-offset: 6px;
  border-radius: 10px;
}

/* -------------------------
   Desktop + Tablet (701px+)
   ------------------------- */
@media (min-width: 701px){

  .elementor-widget-ddpc_promo_cards .ddpc,
  .ddpc{
    --ddpc-ar: 4 / 3 !important;
    --ddpc-zoom: 1.03 !important;

    display:flex;
    align-items:flex-start;

    /* Larger gaps */
    gap: clamp(41px, 3.9vw, 53px) !important;

    width:100%;
    max-width:100%;

    /* Slightly less side padding so the cards read ~10% larger on tablet */
    padding-left:22px !important;
    padding-right:22px !important;

    /* Centre the whole row */
    margin-left:auto !important;
    margin-right:auto !important;

    /* Space above + below */
    margin-top: clamp(48px, 4.5vw, 72px) !important;
    margin-bottom: clamp(90px, 7.5vw, 160px) !important;

    background:transparent !important;
  }

  /* Large desktop sizing */
  @media (min-width: 1100px){
    .elementor-widget-ddpc_promo_cards .ddpc,
    .ddpc{
      /* ~10% larger than the earlier max-width clamp */
      max-width: clamp(1089px, 73.3vw, 1406px) !important;
      padding-left:0 !important;
      padding-right:0 !important;
    }
  }

  .elementor-widget-ddpc_promo_cards .ddpc-card,
  .ddpc-card{
    flex:1 1 0%;
    min-width:0;

    position:relative;
    display:block;
    text-decoration:none;
    color:inherit;

    background:transparent;
    overflow:visible;
    border-radius:0 !important;

    cursor:pointer;
  }

  .elementor-widget-ddpc_promo_cards .ddpc-media,
  .ddpc-media{
    display:block;
    width:100%;
    border-radius:8px !important;
    overflow:hidden;
    background:#fff; /* letterbox when contain is used */
    transform: translateZ(0);
  }

  .elementor-widget-ddpc_promo_cards .ddpc-img,
  .ddpc-img{
    width:100%;
    height:100%;
    display:block;

    aspect-ratio: var(--ddpc-ar);

    object-fit:contain;
    object-position:center;

    transform:scale(1);
    transform-origin:center;
  }

  /* Optional per-card crop */
  .ddpc-card.is-cover .ddpc-img{ object-fit:cover; }

  /* Text BELOW the image — centred */
  .elementor-widget-ddpc_promo_cards .ddpc-overlay,
  .ddpc-overlay{
    position:static;
    display:block;
    padding:12px 0 0 0;
    margin:0;

    text-align:center !important;

    background:none !important;
    color:#0c0c0c;
  }

  /* Desktop/tablet title typography */
  .elementor-widget-ddpc_promo_cards .ddpc-title,
  .ddpc-title{
    display:block;
    width:100%;

    text-align:center !important;

    font-family: var(--font-sans, "neue-haas-grotesk-display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif) !important;
    font-size: clamp(16px, 2.2vw, 22px) !important;
    font-weight: var(--heading-weight, 560) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.01em !important;

    margin:0 !important;
  }

  /* Hover: subtle lift + zoom (no shadow) */
  @media (hover: hover) and (pointer: fine){

    .elementor-widget-ddpc_promo_cards .ddpc-media,
    .ddpc-media{
      transition: transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
      will-change: transform;
    }

    .elementor-widget-ddpc_promo_cards .ddpc-img,
    .ddpc-img{
      transition: transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
      will-change: transform;
    }

    .elementor-widget-ddpc_promo_cards .ddpc-card:hover .ddpc-media,
    .elementor-widget-ddpc_promo_cards .ddpc-card:focus-within .ddpc-media,
    .ddpc-card:hover .ddpc-media,
    .ddpc-card:focus-within .ddpc-media{
      transform: translateY(-2px);
    }

    .elementor-widget-ddpc_promo_cards .ddpc-card:hover .ddpc-img,
    .elementor-widget-ddpc_promo_cards .ddpc-card:focus-within .ddpc-img,
    .ddpc-card:hover .ddpc-img,
    .ddpc-card:focus-within .ddpc-img{
      transform: scale(var(--ddpc-zoom));
    }
  }
}

/* -------------------------
   Mobile (stacked, text BELOW image, match desktop corners)
   Mobile-only updates:
   - Top spacing matches bottom spacing
   - Left/right OUTER margins set to 16px (and padding removed to avoid double inset)
   ------------------------- */
@media (max-width: 700px){

  .elementor-widget-ddpc_promo_cards .ddpc,
  .ddpc{
    --ddpc-ar: 4 / 3;
    --ddpc-zoom: 1.035;
    --ddpc-vspace: clamp(44px, 8vw, 84px);

    display:flex;
    flex-direction:column;
    gap:20px;

    /* MATCH top + bottom spacing */
    margin-top: var(--ddpc-vspace) !important;
    margin-bottom: var(--ddpc-vspace) !important;

    /* Mobile-only: 16px outer margins */
    margin-left:16px !important;
    margin-right:16px !important;

    /* IMPORTANT: don't force 100% width (prevents overflow with margins) */
    width:auto !important;

    /* Remove side padding so you don't get 16px margin + 16px padding */
    padding-left:0 !important;
    padding-right:0 !important;

    /* ~10% larger overall than 640px */
    max-width:704px !important;

    background: transparent !important;
  }

  .elementor-widget-ddpc_promo_cards .ddpc-card,
  .ddpc-card{
    position:relative;
    display:block;
    text-decoration:none;
    color:inherit;

    /* Match desktop behaviour: image has radius, card itself does not need rounding */
    background: transparent;
    overflow: visible;
    border-radius: 0 !important;

    box-shadow:none !important;
    filter:none !important;

    transform: translateZ(0);
    cursor: pointer;
  }

  /* Mobile image “card” — SAME 8px corners as desktop */
  .elementor-widget-ddpc_promo_cards .ddpc-media,
  .ddpc-media{
    display:block;
    width:100%;
    border-radius:8px !important;
    overflow:hidden;
    background:#fff;
    transform: translateZ(0);
  }

  .elementor-widget-ddpc_promo_cards .ddpc-img,
  .ddpc-img{
    width:100%;
    height:100%;
    display:block;

    aspect-ratio: var(--ddpc-ar);

    /* Mobile can stay cover for punchier visuals */
    object-fit: cover;
    object-position:center;

    transform:scale(1);
    transform-origin:center;
    transition: transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
  }

  /* Mobile text BELOW image (remove overlay gradient behaviour) */
  .elementor-widget-ddpc_promo_cards .ddpc-overlay,
  .ddpc-overlay{
    position: static !important;
    left:auto; right:auto; bottom:auto;

    display:block;
    padding:12px 0 0 0;
    margin:0;

    text-align:center !important;

    background:none !important;
    color:#0c0c0c !important;
  }

  /* Mobile title typography */
  .elementor-widget-ddpc_promo_cards .ddpc-title,
  .ddpc-title{
    display:block;
    width:100%;

    text-align:center !important;

    font-family: var(--font-sans, "neue-haas-grotesk-display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif) !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em !important;

    margin:0 !important;
    max-width:none !important;
  }

  /* Small tap feedback without borders/shadows */
  .ddpc-card:active .ddpc-img{
    transform: scale(1.015);
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .ddpc-media,
  .ddpc-img{
    transition:none !important;
    transform:none !important;
  }
}
