.hero-card picture{position:absolute;inset:0;display:block;width:100%;height:100%}
.hero-card picture .hero-image{width:100%;height:100%}
.hero-grid>picture{display:block;width:100%}
.hero-grid>picture .hero-img{display:block;width:100%}
/* Shared mobile UX layer for Better Logistics */
.mobile-proof{display:none}
#bl-mobile-cta{display:none}

@media (max-width:900px){
  html{scroll-padding-top:78px}
  body{padding-top:68px!important}
  body.mobile-enhanced{padding-bottom:86px}

  header{height:68px!important}
  header>.container.nav,.nav{height:68px!important;min-height:68px!important}
  header .brand-logo,.brand-logo{width:150px!important;max-width:150px!important;max-height:40px!important}
  header .mobile-menu-toggle,.mobile-menu-toggle{width:42px!important;height:42px!important;flex-basis:42px!important}
  header .mobile-nav,.mobile-nav{top:68px!important;max-height:calc(100vh - 68px);overflow-y:auto;-webkit-overflow-scrolling:touch}

  .container{width:min(calc(100% - 28px),1120px)!important}
  section{padding:56px 0!important}
  .hero,.price-hero{padding:44px 0 50px!important}

  h1{font-size:40px!important;line-height:1.06!important;letter-spacing:-2px!important}
  h2{font-size:32px!important;line-height:1.08!important;letter-spacing:-1.4px!important}
  h3{line-height:1.2}
  .lead,.hero p,.price-hero p{font-size:16.5px!important;line-height:1.58!important}
  .section-head{margin-bottom:28px!important}
  .eyebrow{font-size:11px!important}

  .hero-grid,.price-hero-grid,.split,.two,.form-grid,.faq,.price-info-grid,.price-faq-grid{grid-template-columns:1fr!important;gap:24px!important}
  .actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;margin-top:24px!important}
  .actions .btn,.hero .actions .btn,.price-hero .actions .btn{width:100%!important;min-height:48px;text-align:center}
  .micro{margin-top:14px!important;font-size:12px!important;line-height:1.45!important}

  .hero-card{min-height:270px!important;border-radius:22px!important;margin-top:2px!important}
  .hero-image{object-position:center!important}
  .hero-img{height:270px!important;border-radius:22px!important}

  .card,.step,.compare-box,.pricing-panel,.price-summary,.example-box,.quote,.brand-card,.proof-card{border-radius:20px!important}
  .card,.step,.compare-box,.pricing-panel,.price-summary,.example-box{padding:20px!important}
  .brand-card{padding:24px!important}
  .quote{padding:26px 22px!important}

  .cards,.grid3,.steps,.included-grid,.trust-grid,.compare-grid,.pricing-layout{grid-template-columns:1fr!important;gap:14px!important}
  .pricing-layout{display:grid!important}
  .pricing-panel{min-width:0!important}
  .calc-row,.country-row,.fields{grid-template-columns:1fr!important}
  .fields{gap:12px!important}
  input,select,textarea{font-size:16px!important}
  textarea{min-height:110px!important}
  form{padding:20px!important;border-radius:20px!important}

  .pricing-panel.dark{display:flex!important;flex-direction:column!important}
  .pricing-panel.dark>h3{order:0}
  .pricing-panel.dark>.calc-total{order:1;font-size:40px!important;margin-top:8px!important}
  .pricing-panel.dark>.calc-sub{order:2}
  .pricing-panel.dark>.calc-breakdown{order:3}
  .pricing-panel.dark>#pricingCta{order:4;width:100%!important;min-height:48px;text-align:center}
  .pricing-panel.dark>.pricing-disclaimer{order:5;margin-top:16px!important}
  .pricing-panel.dark>p{display:none!important}

  .check-summary{grid-template-columns:1fr!important;gap:8px!important;padding:14px!important}
  .check-summary div{display:flex;align-items:center;justify-content:space-between;gap:16px}
  .check-summary span{margin:0!important}
  .check-summary strong{text-align:right}

  .price-summary{margin-top:2px!important}
  .price-big{font-size:38px!important}
  .included-item{padding:18px!important}

  .cta,.cta-box{padding:28px 22px!important;border-radius:22px!important}
  .cta h2,.cta-box h2{font-size:30px!important}
  .cta .btn,.cta-box .btn{width:100%!important;min-height:48px;text-align:center}

  footer{padding-bottom:88px!important}

  /* Mobile-first home funnel: keep only the highest-intent path. */
  .page-home main{display:flex;flex-direction:column}
  .page-home .hero{order:1}
  .page-home .mobile-proof{display:block!important;order:2;padding:18px 0 26px!important;background:#fff}
  .page-home .pricing{order:3}
  .page-home #leistungen{order:4}
  .page-home #referenzen{order:5}
  .page-home .faq-section{order:6}
  .page-home .cta{order:7}
  .page-home .problem,
  .page-home #prozess,
  .page-home .audience,
  .page-home .benefits-section,
  .page-home .shipping-partners,
  .page-home .compare,
  .page-home .form-wrap{display:none!important}

  .mobile-proof-card{display:block;background:#001b4b;color:#fff;border-radius:22px;padding:22px;box-shadow:0 18px 50px rgba(0,27,75,.14)}
  .mobile-proof-kicker{font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#a9c2e6}
  .mobile-proof-card h2{font-size:29px!important;color:#fff;margin:8px 0 10px!important}
  .mobile-proof-card p{color:#cfdaea;margin:0 0 16px;font-size:14px;line-height:1.5}
  .mobile-proof-metrics{display:flex;align-items:center;gap:12px;margin:16px 0}
  .mobile-proof-metrics strong{font-size:34px;line-height:1}
  .mobile-proof-arrow{color:#38c878;font-size:25px;font-weight:900}
  .mobile-proof-link{font-size:14px;font-weight:850;color:#fff}

  .page-home #leistungen .card{padding:17px 18px!important}
  .page-home #leistungen .card h3{margin:6px 0!important}
  .page-home #leistungen .card p{font-size:14px!important;line-height:1.5!important}
  .page-home #leistungen .icon{margin-bottom:4px!important}

  .page-home #referenzen .ref-grid,
  .page-references .grid{display:flex!important;overflow-x:auto!important;gap:14px!important;scroll-snap-type:x mandatory;padding:2px 1px 12px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .page-home #referenzen .ref-grid::-webkit-scrollbar,
  .page-references .grid::-webkit-scrollbar{display:none}
  .page-home #referenzen .ref-card,
  .page-references .grid>.card{flex:0 0 84%!important;scroll-snap-align:start;min-width:0!important}
  .page-home #referenzen .ref-logo{height:72px!important}

  /* Fulfillment page */
  .page-fulfillment .steps .step{padding:18px!important}
  .page-fulfillment .grid3 .card{padding:18px!important}

  /* Case study: result first, evidence second, chart legible on phones. */
  .page-case-study .hero{padding-bottom:36px!important}
  .page-case-study .hero h1{font-size:38px!important}
  .page-case-study .metric{gap:10px!important}
  .page-case-study .metric-value{font-size:38px!important}
  .page-case-study .result-panel{padding:26px 18px!important;border-radius:22px!important}
  .page-case-study .result-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  .page-case-study .result-item{padding:14px 7px!important;text-align:center}
  .page-case-study .result-item strong{font-size:25px!important}
  .page-case-study .result-item span{font-size:10.5px!important;line-height:1.35!important}
  .page-case-study .proof-card{padding:8px!important}
  .page-case-study .proof-caption{font-size:12px!important;padding:0 4px}

  /* Persistent conversion CTA. It sits above Cookie Settings. */
  #bl-mobile-cta{position:fixed;left:14px;right:14px;bottom:58px;z-index:9000;background:#008040;color:#fff;border-radius:15px;box-shadow:0 14px 38px rgba(0,64,35,.28);padding:13px 16px;min-height:50px;align-items:center;justify-content:center;font:800 14px/1.2 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;text-decoration:none}
  #bl-mobile-cta.is-visible{display:flex}
  #bl-mobile-cta.is-hidden{display:none!important}
}

@media (max-width:620px){
  h1{font-size:38px!important}
  h2{font-size:30px!important}
  .hero-card,.hero-img{height:258px!important;min-height:258px!important}
  .page-case-study .hero h1{font-size:36px!important}
}