/* WagePunch V11.4 — mobile/tablet-only finish. Desktop >=1025px unchanged.
   Keep original promotion, billing, form and navigation JavaScript. */
@media (max-width: 1024px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body.wp-visual-v11 { overflow-x: clip; }
  body.wp-visual-v11 :is(button,a,input,select,textarea) { touch-action: manipulation; }

  /* Header + accessible, predictable navigation panel. */
  body.wp-visual-v11 header.elementor-location-header {
    position: relative !important; z-index: 1000 !important;
    padding: 10px 12px !important; margin: 0 !important;
    min-height: 70px !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-element-ab5e9a7 {
    width: 100% !important; max-width: 100% !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-element-fec7745 {
    display: flex !important; align-items: center !important;
    justify-content: space-between !important; gap: 16px !important;
    height: 58px !important; min-height: 58px !important;
    padding: 7px 13px !important; border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 6px 24px rgba(48,0,9,.12) !important;
    overflow: visible !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-element-f7b8acd {
    flex: 0 1 173px !important; min-width: 0 !important;
    width: auto !important; max-width: 173px !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-element-f7b8acd img {
    width: 100% !important; max-width: 173px !important; height: auto !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-element-11958f3 {
    width: 46px !important; min-width: 46px !important;
    flex: 0 0 46px !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle {
    display: flex !important; align-items: center !important;
    justify-content: center !important;
    width: 46px !important; height: 46px !important; padding: 10px !important;
    border: 1px solid #fbd1d7 !important;
    border-radius: 12px !important;
    background: #fff5f6 !important; color: #bc0018 !important;
    cursor: pointer !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle svg {
    width: 23px !important; height: 23px !important; fill: #b80013 !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle.elementor-active {
    background: #e60019 !important; border-color: #e60019 !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle.elementor-active svg {
    fill: #fff !important;
  }
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle:focus-visible,
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu a:focus-visible {
    outline: 3px solid #ff5469 !important; outline-offset: 3px !important;
  }
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu:not([hidden]) {
    display: flex !important; flex-direction: column !important;
    position: absolute !important;
    top: calc(100% + 10px) !important; left: 0 !important; right: 0 !important;
    padding: 12px !important; gap: 2px !important;
    max-height: min(76dvh,690px) !important; overflow-y: auto !important;
    overscroll-behavior: contain !important;
    background: white !important; border: 1px solid #e6e9ef !important;
    border-radius: 17px !important; box-shadow: 0 20px 46px rgba(16,24,40,.22) !important;
    z-index: 10050 !important;
  }
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu > a {
    display: flex !important; align-items: center !important;
    min-height: 47px !important; padding: 11px 16px !important;
    border-radius: 10px !important; color: #18233a !important;
    font: 700 16px/1.3 Geist,Arial,sans-serif !important;
    text-decoration: none !important;
  }
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu > a[aria-current="page"] {
    color: #cc001c !important; background: #fff0f2 !important;
  }
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu > a:nth-last-child(2) {
    margin-top: 12px !important; justify-content: center !important;
    color: #fff !important; background: #e5071c !important;
    border: 1px solid #e5071c !important;
  }
  body.wp-visual-v11 header.elementor-location-header #wp-mobile-menu > a:last-child {
    justify-content: center !important;
    color: #df061d !important; background: #fff !important;
    border: 1px solid #ea273a !important;
  }
  /* The coupon reveal stays in the existing flow and remains fully usable. */
  body.wp-visual-v11 #wp-coupon-entry:not(.wp-coupon-nav) {max-width: min(100% - 24px,430px) !important;}
  body.wp-visual-v11 #wp-coupon-entry #wp-coupon-reveal {min-height: 44px !important;}
  body.wp-visual-v11 #wp-coupon-entry #wp-coupon-fields:not([hidden]) {box-shadow: 0 6px 20px rgba(40,0,0,.10) !important;}
  body.wp-visual-v11 #wp-coupon-entry input {font-size: 16px !important;}

  /* Comfortable page widths on tablet and mobile: no fixed-width children. */
  body.wp-visual-v11 :is(.wp11-wrap,.about-v10-container,.wp-layout-container,.wp-blog-wrap,.wp-global-footer__inner) {
    max-width: 100%;
  }
  body.wp-visual-v11 :is(.wp11-features-grid,.wp11-contact-grid,.about-v10-grid,.about-v10-split,
      .wp-benefits-grid,.wp-content-grid,.wp-blog-hero-grid,.wp-blog-article-layout) > * {
    min-width: 0;
  }
  body.wp-visual-v11 :is(.wp-compare-scroll,.wp11-table-scroll) {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }
  body.wp-visual-v11 #pricing {scroll-margin-top: 16px;}
}
@media (max-width: 767px) {
  body.wp-visual-v11 header.elementor-location-header {padding: 8px 12px !important;min-height:66px !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-element-fec7745 {height: 54px !important; min-height:54px !important; padding: 5px 10px !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-element-f7b8acd {flex-basis: 150px !important;max-width:150px !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-element-11958f3 {width:44px !important;min-width:44px !important;flex-basis:44px !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle {width:44px !important;height:44px !important;}

  /* Homepage: deliberate stacked hero, readable copy, unobstructed product image. */
  body.home.wp-visual-v11 .wp-home-hero {padding: 28px 0 18px !important;}
  body.home.wp-visual-v11 .wp-home-hero-grid {grid-template-columns: minmax(0,1fr) !important;gap:20px !important;min-height:0 !important;}
  body.home.wp-visual-v11 .wp-hero-left {width:100% !important;min-width:0 !important;}
  body.home.wp-visual-v11 .wp-home-hero h1 {
    font-size:clamp(33px,9vw,46px) !important;line-height:1.08 !important;
    letter-spacing:-.04em !important;max-width:100% !important;
  }
  body.home.wp-visual-v11 .wp-home-hero .wp-hero-lead {font-size:16px !important;line-height:1.58 !important;}
  body.home.wp-visual-v11 .wp-hero-devices {
    width:100% !important;height:260px !important;min-height:260px !important;
    margin:0 !important;overflow:visible !important;
  }
  body.home.wp-visual-v11 .wp-product-laptop {max-width: min(92%,470px) !important;}
  body.home.wp-visual-v11 .wp-product-phone {max-width:34% !important;}
  body.home.wp-visual-v11 .wp-button-row {display:flex !important;flex-wrap:wrap !important;gap:11px !important;}
  body.home.wp-visual-v11 .wp-button-row .wp-button {
    min-height:47px !important;padding:13px 16px !important;
    display:inline-flex !important;justify-content:center !important;align-items:center !important;
    text-align:center !important;
  }
  body.home.wp-visual-v11 .wp-core-features {grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px 10px !important;}
  body.home.wp-visual-v11 .wp-core-features > div {padding:4px 3px !important;}
  body.home.wp-visual-v11 .wp-core-features strong {font-size:14px !important;}
  body.home.wp-visual-v11 .wp-core-features p {font-size:12px !important;line-height:1.45 !important;}
  body.home.wp-visual-v11 .wp-compare {width:calc(100% - 24px) !important;padding:21px 14px 20px !important;margin-inline:auto !important;}
  body.home.wp-visual-v11 .wp-compare h2 {font-size:clamp(23px,6.2vw,29px) !important;line-height:1.18 !important;}
  body.home.wp-visual-v11 .wp-compare .wp-sub {font-size:14px !important;}
  body.home.wp-visual-v11 .wp-compare-scroll {border:1px solid #e2e6ee;border-radius:10px;}
  body.home.wp-visual-v11 .wp-compare table {min-width:530px !important;}
  body.home.wp-visual-v11 .wp-compare :is(th,td) {font-size:13px !important;padding:12px 10px !important;}
  body.home.wp-visual-v11 .wp-comparison-action-row {display:grid !important;grid-template-columns:1fr !important;gap:18px !important;}
  body.home.wp-visual-v11 .wp-compare-cta {display:flex !important;min-height:48px !important;margin-top:12px !important;text-align:center !important;}
  body.home.wp-visual-v11 .wp-comparison-apps {width:100% !important;min-width:0 !important;}
  body.home.wp-visual-v11 .wp-comparison-app-links {display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:9px !important;}
  body.home.wp-visual-v11 .wp-compact-app-link {min-width:0 !important;width:100% !important;min-height:49px !important;}

  /* Real feature screenshots should fill mobile cards without tiny desktop frames. */
  body.wp-visual-v11 .wp11-key-features {padding:51px 13px 58px !important;}
  body.wp-visual-v11 .wp11-features-grid {grid-template-columns:1fr !important;gap:19px !important;}
  body.wp-visual-v11 .wp11-feature-card {border-radius:17px !important;}
  body.wp-visual-v11 .wp11-feature-media {height:clamp(218px,67vw,320px) !important;padding:40px 10px 10px !important;}
  body.wp-visual-v11 .wp11-feature-body {padding:20px 19px 24px !important;}
  body.wp-visual-v11 .wp11-feature-body h3 {font-size:22px !important;}
  body.wp-visual-v11 .wp11-feature-body p {font-size:15px !important;line-height:1.56 !important;}

  /* Feature-plan matrix is intentionally swipeable, not shrunk beyond legibility. */
  body.wp-visual-v11 .wp11-feature-matrix {padding:43px 12px 55px !important;}
  body.wp-visual-v11 .wp11-feature-matrix .wp11-wrap {padding:0 !important;}
  body.wp-visual-v11 .wp11-table-scroll {border-radius:13px !important;}
  body.wp-visual-v11 .wp11-table-scroll table {min-width:660px !important;}
  body.wp-visual-v11 .wp11-table-scroll :is(th,td) {padding:13px 12px !important;}
  body.wp-visual-v11 .wp11-table-scroll tbody th {padding-left:15px !important;}
  body.wp-visual-v11 .wp11-features-cta {padding:48px 15px 55px !important;}
  body.wp-visual-v11 .wp11-primary-btn {width:100% !important;min-height:49px !important;}

  /* Contact form + about story + industry pages + blog cards. */
  body.wp-visual-v11 .wp11-contact-hero {padding:47px 18px 52px !important;}
  body.wp-visual-v11 .wp11-contact-main {padding:39px 14px !important;}
  body.wp-visual-v11 .wp11-contact-form-card {padding:24px 16px !important;border-radius:17px !important;}
  body.wp-visual-v11 .wp11-contact-form-card .elementor-field-group {padding:0 2px !important;}
  body.wp-visual-v11 .wp11-contact-form-card :is(input:not([type=hidden]),textarea) {font-size:16px !important;}
  body.wp-visual-v11 .wp11-contact-form-card button[type=submit] {width:100% !important;min-height:48px !important;}
  body.wp-visual-v11 .about-v10-main .about-v10-button-row {display:flex !important;flex-direction:column !important;}
  body.wp-visual-v11 .about-v10-main .about-v10-button-row .about-v10-btn {width:100% !important;min-height:49px !important;}
  body.wp-visual-v11 .wp-ind-detail-hero .wp-button,
  body.wp-visual-v11 .wp-final-cta .wp-button {min-height:46px !important;text-align:center !important;}
  body.wp-visual-v11 .wp-blog-actions {gap:10px !important;}
  body.wp-visual-v11 .wp-blog-article {border-radius:18px !important;}
  body.wp-visual-v11 .wp-blog-hero-visual {max-width:100% !important;}
  body.wp-visual-v11 .wp-global-footer__inner {padding-left:16px !important;padding-right:16px !important;}
  body.wp-visual-v11 .wp-global-footer a {min-height:35px;display:inline-flex;align-items:center;}
  body.wp-visual-v11 .wp-global-footer__social a {min-height:44px;min-width:44px;justify-content:center;}

  /* Clearly signal horizontal tables are swipeable; added only when needed. */
  body.wp-visual-v11 .wp-mobile-swipe-note {
    display:flex;align-items:center;gap:7px;
    margin:10px 0 10px;color:#566780 !important;
    font:700 12px/1.45 Geist,Arial,sans-serif;
  }
  body.wp-visual-v11 .wp-mobile-swipe-note:before {content:'↔';color:#d70b22;font-size:18px;line-height:1;}
}
@media(max-width:390px) {
  body.home.wp-visual-v11 .wp-button-row .wp-button {flex:1 1 100% !important;}
  body.home.wp-visual-v11 .wp-hero-devices {height:220px !important;min-height:220px !important;}
  body.home.wp-visual-v11 .wp-comparison-app-links {grid-template-columns:1fr !important;}
  body.wp-visual-v11 .wp11-feature-media {height:232px !important;}
}
@media(prefers-reduced-motion:reduce) and (max-width:1024px) {
  body.wp-visual-v11 * {scroll-behavior:auto !important;}
}
/* Elementor exports do not consistently toggle SVG visibility across page types. */
@media(max-width:1024px) {
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle:not(.elementor-active) .elementor-menu-toggle__icon--close {display:none !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle:not(.elementor-active) .elementor-menu-toggle__icon--open {display:block !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--close {display:block !important;}
  body.wp-visual-v11 header.elementor-location-header .elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--open {display:none !important;}
}
@media(max-width:767px) {
  /* Maintain air between the actual phone mockup and the four benefit icons. */
  body.home.wp-visual-v11 .wp-hero-devices {height:314px !important;min-height:314px !important;}
}
@media(max-width:390px) {
  body.home.wp-visual-v11 .wp-hero-devices {height:301px !important;min-height:301px !important;}
}