Cap public landing page logos at half the viewport width on mobile.

Co-authored-by: Cursor <cursoragent@cursor.com>

resources/css/app.css

@@ -15,6 +15,12 @@
     display: none !important;
 }
 
+@media (max-width: 639px) {
+    .public-brand-logo {
+        max-width: 50vw;
+    }
+}
+
 /* QR create/show: flush mobile action bar to the physical screen bottom (mobile only) */
 @media (max-width: 1023px) {
     .mobile-action-bar {

resources/views/public/qr/landing.blade.php

@@ -217,7 +217,8 @@
             @if($bizHasLogo)
                 <div style="width:104px; height:104px; border-radius:20px; background:#fff; box-shadow:0 8px 32px rgba(0,0,0,0.14); border:4px solid #fff; overflow:hidden; display:flex; align-items:center; justify-content:center;">
                     <img src="{{ $bizLogoUrl }}" alt="{{ $bizName }}"
-                         style="width:100%; height:100%; object-fit:contain; padding:8px;">
+                         class="public-brand-logo"
+                         style="width:100%; height:100%; max-width:100%; object-fit:contain; padding:8px;">
                 </div>
             @else
                 <div style="width:104px; height:104px; border-radius:20px; background:{{ $bizColor }}; box-shadow:0 8px 32px rgba(0,0,0,0.18); border:4px solid #fff; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2.5rem; font-weight:900;">
@@ -389,7 +390,8 @@
             @if($churchHasLogo)
                 <div style="width:104px; height:104px; border-radius:20px; background:#fff; box-shadow:0 8px 32px rgba(0,0,0,0.14); border:4px solid #fff; overflow:hidden; display:flex; align-items:center; justify-content:center;">
                     <img src="{{ $churchLogoUrl }}" alt="{{ $churchName }}"
-                         style="width:100%; height:100%; object-fit:contain; padding:8px;">
+                         class="public-brand-logo"
+                         style="width:100%; height:100%; max-width:100%; object-fit:contain; padding:8px;">
                 </div>
             @else
                 <div style="width:104px; height:104px; border-radius:20px; background:{{ $churchColor }}; box-shadow:0 8px 32px rgba(0,0,0,0.18); border:4px solid #fff; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2rem; font-weight:900;">
@@ -697,7 +699,7 @@
         @endif
         <div class="relative flex min-h-[230px] flex-col items-center justify-end px-6 pb-7 text-center text-white">
             @if($evHasLogo)
-                <img src="{{ $evLogoUrl }}" alt="{{ $evName }}" class="mb-3 h-16 w-16 rounded-2xl bg-white object-contain p-1 shadow-lg ring-2 ring-white/40">
+                <img src="{{ $evLogoUrl }}" alt="{{ $evName }}" class="public-brand-logo mb-3 h-16 w-16 max-w-[50vw] rounded-2xl bg-white object-contain p-1 shadow-lg ring-2 ring-white/40">
             @else
                 <div class="mb-3 flex h-16 w-16 items-center justify-center rounded-2xl text-xl font-black text-white shadow-lg ring-2 ring-white/40" style="background:rgba(255,255,255,0.18); backdrop-filter:blur(6px);">{{ $evInitials }}</div>
             @endif
@@ -1090,7 +1092,7 @@
     <div class="w-full max-w-sm text-center">
         @if($appIconUrl)
             <img src="{{ $appIconUrl }}" alt="{{ $content['name'] ?? $qrCode->label }}"
-                 class="mx-auto h-20 w-20 rounded-[22px] object-cover shadow-lg">
+                 class="public-brand-logo mx-auto h-20 w-20 max-w-[50vw] rounded-[22px] object-cover shadow-lg">
         @else
             <div class="mx-auto flex h-20 w-20 items-center justify-center rounded-[22px] bg-gradient-to-br from-indigo-500 to-violet-600 shadow-lg">
                 <svg class="h-10 w-10 text-white" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24">
@@ -1280,7 +1282,7 @@
         <div class="flex items-end gap-4">
             @if($hasLogo)
                 <img src="{{ $logoUrl }}" alt="{{ $title }}"
-                     class="h-16 w-16 flex-shrink-0 rounded-2xl object-cover shadow-lg ring-2 ring-white/30">
+                     class="public-brand-logo h-16 w-16 max-w-[50vw] flex-shrink-0 rounded-2xl object-cover shadow-lg ring-2 ring-white/30">
             @else
                 <div class="flex h-16 w-16 flex-shrink-0 items-center justify-center rounded-2xl shadow-lg ring-2 ring-white/30 text-2xl font-black text-white"
                      style="background: rgba(255,255,255,0.2); backdrop-filter: blur(8px);">