/* SavorIP 4.4.4 — mobile commerce-first refinement */
@media (max-width: 720px) {
  /* Home: show the promise and the first revenue action in one phone screen. */
  .hero-inner { padding-top: 86px !important; padding-bottom: 20px !important; min-height: 0 !important; }
  .hero-copy { gap: 12px !important; }
  .hero h1 { font-size: clamp(2rem, 10.4vw, 2.62rem) !important; line-height: 1.08 !important; }
  .hero-description { margin-top: 10px !important; font-size: .78rem !important; line-height: 1.55 !important; }
  .hero-actions { margin-top: 15px !important; gap: 8px !important; }
  .hero-actions .button { min-height: 46px !important; }
  .hero-visual { min-height: 0 !important; }
  .hero-savori-card { margin-top: 2px !important; min-height: 78px !important; padding: 8px 12px 8px 78px !important; }
  .hero-savori-card img { width: 62px !important; height: 62px !important; }
  .hero-proof { display: none !important; }
  .core-entry { padding-block: 22px !important; }
  .core-entry-heading { margin-bottom: 12px !important; }
  .core-entry-heading h2 { font-size: 1.45rem !important; }
  .core-entry-grid { gap: 8px !important; }
  .core-entry-card { min-height: 116px !important; padding: 14px !important; }

  /* Home menu: two commercial actions first; support links become compact. */
  .mobile-menu-inner { padding-top: calc(var(--header-height) + 18px) !important; }
  .mobile-menu nav { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; border: 0 !important; }
  .mobile-menu nav a { min-height: 54px; padding: 9px 10px !important; gap: 7px !important; align-items: center !important; border: 1px solid rgba(231,195,118,.14) !important; border-radius: 12px; font-family: var(--sans) !important; font-size: .74rem !important; line-height: 1.25 !important; background: rgba(255,255,255,.025); }
  .mobile-menu nav a span { align-self: start; font-size: .48rem !important; }
  .mobile-menu nav a.mobile-commerce-primary { grid-column: span 1; min-height: 110px; display: grid; grid-template-columns: 1fr; align-content: end !important; color: #08271f; background: var(--gold-400); border-color: var(--gold-400) !important; }
  .mobile-menu nav a.mobile-commerce-frame { color: #f3d783; background: #113a2f; border-color: rgba(231,195,118,.5) !important; }
  .mobile-menu nav a.mobile-commerce-primary span { color: currentColor !important; opacity: .66; }
  .mobile-menu nav a.mobile-commerce-primary b { font-family: var(--serif); font-size: 1.18rem; }
  .mobile-menu nav a.mobile-commerce-primary small { display: block; font-size: .59rem; opacity: .72; }
  .mobile-store-button { margin-top: 10px !important; min-height: 44px !important; }
  .mobile-menu-note { display: none; }

  /* Workspace menu uses the same clear hierarchy. */
  .app-mobile-menu { padding: 16px 14px calc(80px + env(safe-area-inset-bottom)) !important; }
  .mobile-menu-brand { margin-bottom: 10px !important; }
  .app-mobile-menu nav { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 8px !important; }
  .app-mobile-menu nav a { min-height: 58px; padding: 8px 9px !important; gap: 6px !important; align-items: center; border: 1px solid rgba(231,191,109,.13) !important; border-radius: 11px; background: rgba(255,255,255,.025); }
  .app-mobile-menu nav b { align-self: start; font-size: 8px !important; }
  .app-mobile-menu nav span { font-family: var(--sans) !important; font-size: 12px !important; font-weight: 800; }
  .app-mobile-menu nav small { margin-top: 2px !important; font-size: 8px !important; line-height: 1.3; }
  .app-mobile-menu nav a.mobile-commerce-primary { min-height: 112px; display: grid; grid-template-columns: 1fr; align-content: end; color: #08271f; background: #efca70; border-color: #efca70 !important; }
  .app-mobile-menu nav a.mobile-commerce-frame { color: #f4d98a; background: #123b30; border-color: rgba(239,202,112,.54) !important; }
  .app-mobile-menu nav a.mobile-commerce-primary b { color: currentColor !important; opacity: .65; }
  .app-mobile-menu nav a.mobile-commerce-primary span { font-family: var(--serif) !important; font-size: 20px !important; }
  .app-mobile-menu nav a.mobile-commerce-primary small { color: currentColor; opacity: .7; font-family: var(--sans) !important; font-size: 9px !important; }
  .mobile-store-link { margin-top: 9px !important; min-height: 42px !important; font-size: 10px !important; }

  /* Workspace pages: less introductory height, earlier tools. */
  .view-hero, .view-hero.compact-hero, .story-hero, .memory-hero, .studio-hero, .my-hero, .partner-hero { padding: 20px 14px !important; gap: 12px !important; }
  .view-hero h1, .compact-hero h1 { font-size: clamp(27px,8.6vw,34px) !important; line-height: 1.09 !important; }
  .view-hero-copy > p:not(.view-eyebrow) { margin-top: 10px !important; font-size: 11px !important; line-height: 1.55 !important; }
  .view-hero-facts { margin-top: 10px !important; }
  .savori-mini-card { min-height: 118px !important; }
  .savori-mini-card img { width: 42% !important; height: 125% !important; }
  .process-strip { padding: 9px 7px !important; }
  .workspace-shell { width: calc(100% - 16px) !important; }
  .tool-panel, .result-panel { padding: 15px 12px !important; }
  .panel-heading h2 { font-size: 23px !important; }

  /* Product studio: samples and editing choices appear sooner. */
  .products-hero, .product-hero { padding-block: 20px !important; min-height: 0 !important; }
  .products-hero h1, .product-hero h1 { font-size: clamp(27px,8.5vw,35px) !important; line-height: 1.08 !important; }
  .products-hero p, .product-hero p { font-size: 11px !important; line-height: 1.55 !important; }
  .product-workspace, .products-workspace { gap: 10px !important; }

  /* Space preview: canvas first, controls immediately below. */
  .canvas-layout { display: flex !important; flex-direction: column !important; gap: 10px !important; }
  .canvas-stage-panel { order: 1; padding: 8px !important; border-radius: 15px !important; }
  .canvas-control-panel { order: 2; display: block !important; }
  .canvas-toolbar { gap: 6px !important; padding-bottom: 7px !important; }
  .canvas-toolbar span { display: none !important; }
  .canvas-toolbar button, .canvas-toolbar .upload-button { min-height: 38px !important; padding-inline: 11px !important; font-size: 10px !important; }
  .canvas-wrap { min-height: 0 !important; aspect-ratio: 3 / 2; border-radius: 12px !important; }
  .canvas-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; padding-top: 8px !important; }
  .canvas-actions button { min-height: 40px !important; padding: 6px !important; font-size: 9px !important; }
  .canvas-actions button:last-child { grid-column: 1 / -1; }
  .control-block { padding: 15px 12px !important; }
  .control-block h2 { font-size: 25px !important; line-height: 1.12 !important; }
  .artwork-picker { grid-template-columns: repeat(6,minmax(0,1fr)) !important; gap: 5px !important; }
  .artwork-picker button, .artwork-picker img { min-width: 0 !important; }

  /* Bottom navigation stays quiet while the two revenue routes remain clear. */
  .app-bottom-nav a { font-size: 8px !important; }
  .app-bottom-nav a[data-route-link="products"] { color: #08271f !important; background: #efca70 !important; }
}

@media (max-width: 380px) {
  .app-header-inner, .header-inner { width: calc(100% - 16px) !important; }
  .member-account-button { padding-inline: 9px !important; font-size: 9px !important; }
  .app-language, .language-select { max-width: 72px !important; }
  .hero h1 { font-size: 1.95rem !important; }
  .mobile-menu nav a.mobile-commerce-primary, .app-mobile-menu nav a.mobile-commerce-primary { min-height: 102px; }
}
