/* PRBE Capital phone version 3 (localhost only, 11/06/2026). Loaded last; every rule sits inside the phone media
   query, so the computer view is the live site unchanged. Keeps the jet and the teal share rail. */
@media (max-width: 768px) {
  :root { --p3-side: 20px; --p3-gap: 52px; --p3-ink: #f4f1fa; --p3-muted: #a9a3b8; --p3-line: rgba(255,255,255,.08); }

  /* ---------- 1. Section rhythm: every section fits its content, one spacing, left-aligned ---------- */
  section:not(.hero):not(#prbeAnalyticsConsent) {
    min-height: 0 !important;
    padding: var(--p3-gap) var(--p3-side) !important;
    border-top: 1px solid var(--p3-line);
  }
  section .micro-label, section h2, section h2 *, section .subtitle, section p.subtitle,
  #growthSection p, .video-hero-section h2, #card-showcase h2, #faq h2 { text-align: left !important; }
  section .micro-label { margin: 0 0 10px !important; font-size: 10.5px !important; letter-spacing: .2em !important; }
  section h2 {
    font-family: Montserrat, Inter, sans-serif !important; font-weight: 800 !important;
    font-size: clamp(28px, 8.2vw, 34px) !important; line-height: 1.06 !important; letter-spacing: -.02em !important;
    margin: 0 0 14px !important;
  }
  section h3 { letter-spacing: -.01em; }
  section p { font-size: 15.5px; line-height: 1.55; }
  #growthSection .subtitle, #growthSection p.subtitle { font-size: 19px !important; line-height: 1.4 !important; }

  /* ---------- 2. The jet: bigger, edge to edge, no box ---------- */
  .hero { padding-top: 64px !important; padding-bottom: 0 !important; }
  .hero .hero-image {
    width: 100vw !important; margin-left: calc(50% - 50vw) !important; height: auto !important;
    aspect-ratio: 16 / 10 !important; overflow: hidden !important; position: relative !important;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 78%, transparent 100%);
            mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 78%, transparent 100%);
  }
  .hero .hero-image::after {
    content: ""; position: absolute; inset: auto 8% 6% 8%; height: 34%; pointer-events: none;
    background: radial-gradient(60% 60% at 50% 70%, rgba(0, 212, 255, .22), transparent 70%);
  }
  .hero #heroSrc, .hero #heroClip {
    width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: 38% 55% !important;
    transform: scale(1.02); transform-origin: 50% 55%;
  }
  .hero .hero-content { padding: 0 var(--p3-side) 36px !important; margin-top: -26px !important; position: relative; z-index: 2; }
  .hero .micro-label { margin-bottom: 12px !important; }
  .hero h1 { font-size: clamp(36px, 10.6vw, 44px) !important; line-height: 1.02 !important; letter-spacing: -.03em !important; margin: 0 0 12px !important; }
  .hero .hero-subtitle { font-size: 15px !important; margin: 0 0 10px !important; }
  .hero .hero-content > p:not(.hero-subtitle):not(.micro-label) { font-size: 15.5px !important; line-height: 1.5 !important; margin: 0 0 22px !important; color: var(--p3-muted) !important; }
  .hero .social-links { display: none !important; }
  .hero .hero-buttons { display: grid !important; gap: 10px !important; margin: 0 !important; }
  .hero .hero-buttons .btn-big { min-height: 54px !important; margin: 0 !important; }
  .hero .hero-buttons .btn-secondary { min-height: 48px !important; border-width: 1px !important; font-size: 12px !important; }

  /* ---------- 3. Prices: a 2 x 2 grid ---------- */
  .stat-band.home-price-band {
    display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px !important; align-content: start;
    padding-top: 30px !important; padding-bottom: 40px !important; border-top: 0;
  }
  .home-price-band .stat-item {
    min-height: 0 !important; padding: 18px 12px 16px !important; margin: 0 !important; width: auto !important;
    border: 1px solid var(--p3-line); border-radius: 16px; background: linear-gradient(180deg, rgba(168,85,247,.08), rgba(255,255,255,.015));
  }
  .home-price-band .home-stat-value { font-size: clamp(28px, 8.6vw, 36px) !important; line-height: 1 !important; }
  .home-price-band .stat-label { margin-top: 8px !important; font-size: 10px !important; letter-spacing: .14em !important; line-height: 1.35 !important; }

  /* ---------- 4. One heading font: the two Anton panels match the rest ---------- */
  .hv-panel h3 {
    font-family: Montserrat, Inter, sans-serif !important; font-weight: 800 !important;
    font-size: 26px !important; line-height: 1.1 !important; letter-spacing: -.02em !important; text-transform: none !important;
  }
  .hv-panel .hv-index { font-family: Montserrat, Inter, sans-serif !important; font-weight: 800 !important; font-size: 34px !important; }
  .split-section.hv-section { gap: 24px !important; }
  .split-section .split-content, .split-section .hv-panel { min-height: 0 !important; }
  .split-section .split-content { justify-content: flex-start !important; }
  .hv-panel { padding: 22px 18px !important; border-radius: 18px !important; }

  /* ---------- 5. The broken "Compare Services" bar becomes a real button ---------- */
  .btn-cyan {
    display: flex !important; align-items: center; justify-content: center; min-height: 52px; width: 100%;
    background: transparent !important; border: 1px solid #00d4ff !important; border-radius: 12px;
    color: #fff !important; text-decoration: none !important; font: 800 12.5px/1 Montserrat, Inter, sans-serif !important;
    letter-spacing: .16em !important; text-transform: uppercase;
  }

  /* ---------- 6. Services, corporation, video, cards, films ---------- */
  .home-section-heading { margin-bottom: 20px !important; }
  /* The four service cards were stacked (about 1,000 px); on a phone they become one row you swipe sideways,
     with the next card peeking in so people see there is more. */
  .home-service-grid {
    display: flex !important; gap: 12px !important; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scroll-padding-left: var(--p3-side); -webkit-overflow-scrolling: touch;
    margin: 0 calc(-1 * var(--p3-side)) !important; padding: 2px var(--p3-side) 10px !important; scrollbar-width: none;
  }
  .home-service-grid::-webkit-scrollbar { display: none; }
  .home-service-grid > .home-service { flex: 0 0 82%; min-width: 0; scroll-snap-align: start; margin: 0 !important; }
  .p3-swipe { display: flex; align-items: center; gap: 8px; margin: 4px 0 0; color: #a9a3b8; font: 600 11px/1 Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
  .p3-swipe i { flex: 0 0 auto; width: 22px; height: 2px; border-radius: 2px; background: rgba(255,255,255,.18); transition: background .25s, width .25s; }
  .p3-swipe i.on { width: 34px; background: #a855f7; }
  .home-service-extras { margin-top: 18px !important; }
  .shark-inner, .corporation-overview-inner, .film-shelf-inner, .home-community-inner { min-height: 0 !important; }
  .home-advisory, .home-community { justify-content: flex-start !important; }
  .home-advisory .btn-big, .home-community .btn-big { margin-top: 18px !important; }
  .video-hero-section .home-film { margin-top: 6px !important; }
  #card-showcase .card-showcase-frame { margin-top: 4px !important; border-radius: 18px !important; }
  #card-showcase .home-actions { margin-top: 14px !important; }
  .faq-container { margin-top: 12px !important; }

  /* ---------- 7. Contact and footer ---------- */
  .contact-grid { margin-bottom: 28px !important; gap: 24px !important; }
  #contact > footer { padding-top: 26px !important; text-align: left !important; }
  #contact .footer-disclaimer { text-align: left !important; font-size: 12px !important; line-height: 1.6 !important; color: #8f889e !important; }
  #contact .footer-copyright { text-align: left !important; font-size: 11px !important; letter-spacing: .06em !important; }
  #contact footer a { text-align: left !important; }
  .p3-prefs { display: inline-block; margin-top: 14px; color: #a9a3b8; font-size: 12px; text-decoration: underline; background: none; border: 0; padding: 6px 0; }

  /* ---------- 8. Floating buttons: only the teal Share stays ---------- */
  #prbeFxTop { display: none !important; }
  #prbeAnalyticsPreferences { display: none !important; }

  /* ---------- 9. Cookie notice: a small card at the bottom, not the whole screen ---------- */
  #prbeAnalyticsConsent {
    min-height: 0 !important; height: auto !important; top: auto !important;
    left: 10px !important; right: 10px !important; bottom: 10px !important;
    padding: 14px 16px !important; border-radius: 16px !important; border-top: 0;
  }
  #prbeAnalyticsConsent p { font-size: 13px !important; line-height: 1.45 !important; margin: 0 0 10px !important; }
  #prbeAnalyticsConsent button { min-height: 42px !important; padding: 8px 14px !important; font-size: 14px !important; }

  /* ---------- 10. Scroll reveals: shorter travel so text does not jump in late ---------- */
  h1, h2 { overflow-wrap: anywhere; }
}