/* Shared presentation layer. Original content, media and behavior stay intact. */
:root {
  --ios-background: #f5f5f7;
  --ios-surface: #ffffff;
  --ios-ink: #1d1d1f;
  --ios-muted: #636368;
  --ios-accent: #FF6B00;
  --ios-rose: #FF4D8D;
  --ios-amber: #FF9E00;
  --ios-brand-gradient: linear-gradient(100deg, var(--ios-rose) 0%, var(--ios-accent) 52%, var(--ios-amber) 100%);
  --ios-shine: linear-gradient(110deg, transparent 20%, rgba(255,255,255,0.12) 38%, rgba(255,255,255,0.52) 50%, rgba(255,255,255,0.12) 62%, transparent 80%);
  --ios-liquid-edge: rgba(255,255,255,0.2);
  --ios-liquid-shadow: 0 8px 24px rgba(255,107,0,0.18), inset 0 1px 1px rgba(255,255,255,0.5), inset 0 -1px 2px rgba(255,77,141,0.16);
  --ios-liquid-hover: 0 12px 30px rgba(255,77,141,0.24), inset 0 2px 3px rgba(255,255,255,0.65), inset 0 -2px 5px rgba(255,158,0,0.2);
  --ios-blue: #0071e3;
  --ios-green: #248a3d;
  --ios-line: #dedee3;
  --ios-glass: rgba(255, 255, 255, 0.76);
  --ios-menu: rgba(255, 255, 255, 0.97);
  --ios-glass-edge: rgba(255, 255, 255, 0.88);
  --ios-glass-shade: rgba(255, 255, 255, 0.35);
  --ios-accent-soft: #fff0e8;
  --ios-blue-soft: #eaf3ff;
  --ios-green-soft: #eaf5ed;
  --ios-shadow: 0 12px 40px rgba(29, 29, 31, 0.08), inset 0 1px 0 var(--ios-glass-edge);
  --ios-control-shadow: 0 4px 16px rgba(29, 29, 31, 0.08), inset 0 1px 0 var(--ios-glass-edge);
  --ios-focus: 0 0 0 4px rgba(0, 113, 227, 0.18);
  --ios-glass-gradient: linear-gradient(160deg, var(--ios-glass-edge), var(--ios-glass-shade));
  --brand-1: var(--ios-rose);
  --brand-2: var(--ios-accent);
  --brand-3: var(--ios-amber);
  --brand-dark: var(--ios-ink);
  --brand-soft: var(--ios-background);
  --brand-white: var(--ios-surface);
  --bg: var(--ios-background);
  --card: var(--ios-surface);
  --orange: var(--ios-accent);
  --orange-soft: var(--ios-accent-soft);
  --text: var(--ios-ink);
  --muted: var(--ios-muted);
  --line: var(--ios-line);
  --dark: var(--ios-ink);
}
html { scroll-padding-top: 112px; }
body {
  margin: 0;
  background: var(--ios-background) !important;
  color: var(--ios-ink) !important;
  -webkit-font-smoothing: antialiased;
}
body, body * {
  font-family: -apple-system, BlinkMacSystemFont, 'Thmanyah Sans', 'Segoe UI', sans-serif;
  letter-spacing: 0 !important;
  box-sizing: border-box;
}
h1, h2, h3, h4 { color: var(--ios-ink); }
h1, h2 { font-weight: 700 !important; }
p { line-height: 1.85; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--ios-blue); outline-offset: 4px; }
::selection { background: var(--ios-blue-soft); color: var(--ios-ink); }
.site-nav, .topbar {
  position: fixed !important;
  top: 14px !important;
  left: 20px !important;
  right: 20px !important;
  width: auto;
  max-width: 1440px;
  margin-inline: auto;
  z-index: 60;
  min-height: 64px;
  padding: 4px 0 !important;
  border: 1px solid var(--ios-glass-edge) !important;
  border-radius: 100px;
  background: var(--ios-glass) !important;
  backdrop-filter: blur(28px) saturate(1.6);
  box-shadow: var(--ios-shadow) !important;
}
.site-nav > .max-w-7xl { max-width: none; padding-inline: 24px; }
.site-nav .min-h-\[75px\] { min-height: 56px; }
.brand-mark img { height: 42px; max-height: 42px; }
.site-nav .lg\:flex { gap: 18px; }
.nav-link, .nav-links a {
  color: var(--ios-muted) !important;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 0;
}
.nav-link.active, .nav-link:hover, .nav-links a:hover { color: var(--ios-accent) !important; }
#mobile-menu-btn {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ios-glass-gradient);
  border: 1px solid var(--ios-glass-edge);
  box-shadow: var(--ios-control-shadow);
}
#mobile-menu {
  top: calc(100% + 12px);
  left: 0;
  right: 0;
  border-radius: 28px;
  background: var(--ios-menu) !important;
  border: 1px solid var(--ios-glass-edge) !important;
  backdrop-filter: blur(36px) saturate(1.6);
  box-shadow: var(--ios-shadow);
  max-height: calc(100svh - 112px);
  overflow-y: auto;
}
#mobile-menu .space-y-3 { padding: 16px; }
#mobile-menu a:not(.site-btn) { padding: 10px 16px; border-radius: 14px; color: var(--ios-ink); }
#mobile-menu a:hover { background: var(--ios-background); }
.site-btn, .btn-primary, .registration-submit, .about-product-cta, .about-cta-btn,
a.bg-blue-600, a.bg-\[\#FF6600\], .card > a {
  background: var(--ios-accent) !important;
  color: var(--ios-surface) !important;
  border: 1px solid transparent !important;
  border-radius: 999px;
  box-shadow: none !important;
  font-weight: 600 !important;
  transition: transform 0.2s, filter 0.2s;
  animation: none !important;
}
a.bg-blue-600 { background: var(--ios-blue) !important; }
.site-btn:hover, .btn-primary:hover, .registration-submit:hover { filter: brightness(1.08); transform: translateY(-1px); }
a.border-\[\#FF6600\], #story-toggle {
  background: var(--ios-glass-gradient) !important;
  color: var(--ios-ink) !important;
  border: 1px solid var(--ios-glass-edge) !important;
  box-shadow: var(--ios-control-shadow) !important;
  backdrop-filter: blur(18px);
  font-weight: 600 !important;
}
.gradient-text, .gradient-ink, .about-hero-ink, .about-question-ink {
  background: none !important;
  color: var(--ios-accent) !important;
  -webkit-text-fill-color: var(--ios-accent) !important;
}
.decorative-circle, .about-hero-orb, .footer-glow, .happy-cta-glow,
.mockup-glow, [class*="blur-3xl"], .about-question::before,
#home ~ section [class*="radial-gradient"], .page-main > section > .absolute[class*="radial-gradient"],
#home > .absolute.animate-float, #home > .absolute.animate-float-delay {
  display: none !important;
}
.page-main { background: var(--ios-background); }
section.bg-gradient-to-b, section.bg-gradient-to-br, .section-shell,
.about-hero, .about-question, .about-timeline, .about-built, .about-product, .about-cta {
  background: var(--ios-background) !important;
}
section.bg-white, #restaurants, .about-moment, .about-idea, .about-philosophy { background: var(--ios-surface) !important; }
#partners { background: var(--ios-background) !important; padding-block: 56px; }
#partners .bg-gradient-to-r, #partners .bg-gradient-to-l { background: none; }
section#home.hero-gradient {
  min-height: 660px !important;
  height: calc(100svh - 64px) !important;
  max-height: 920px;
  padding-top: 110px;
  padding-bottom: 48px;
  background-position: center;
}
#home > .max-w-7xl { width: 100%; padding-block: 40px; }
#home .hero-copy { top: 0; }
.hero-title-line { font-family: inherit !important; font-weight: 700; padding: 0; line-height: 1.45; }
#home h1 { font-size: 48px; line-height: 1.45; margin-bottom: 22px; }
#home .hero-copy > div:first-child, .hero-badge, .floating-pill, .about-hero-label {
  background: var(--ios-glass) !important;
  border: 1px solid var(--ios-glass-edge) !important;
  box-shadow: var(--ios-control-shadow) !important;
  backdrop-filter: blur(20px);
  color: var(--ios-ink) !important;
}
#home .hero-copy > div:first-child { font-weight: 500; padding: 10px 18px; }
#home .hero-copy > p { color: var(--ios-ink) !important; font-size: 18px; max-width: 510px; }
#home .hero-copy > div:last-child { margin-top: 32px; }
#home .hero-copy > div:last-child .font-bold { color: var(--ios-ink); font-size: 26px; font-weight: 600; }
.about-hero { min-height: 680px; max-height: 880px; }
.about-hero-inner { padding-block: 150px 80px; }
.about-hero-heading { font-size: 76px; line-height: 1.3; }
.about-hero-sub { font-size: 20px; }
.about-hero-label { font-size: 12px; font-weight: 500; }
.about-hero-label-dot { background: var(--ios-accent); }
.about-hero-divider { background: var(--ios-line); }
.hero-heading { font-size: 48px; line-height: 1.4; }
.hero-line { line-height: 1.4; }
.about-question-heading, .about-built-title, .about-philosophy-title,
.about-product-title, .about-cta-title, .section-title, .numbers-title { font-size: 44px; line-height: 1.4; }
.about-moment-title, .about-idea-title { font-size: 36px; line-height: 1.4; }
.about-principle-body h3 { font-size: 30px; line-height: 1.4; }
.about-moment-year { font-size: 180px; }
.about-built-dz { font-size: 140px; }
.about-product-visual { background: transparent; }
.numbers-panel, .page-shell, .hero, .about-founder-panel { border-radius: 0; border: 0; box-shadow: none; }
.numbers-panel, .page-shell, .hero { background: transparent; }
.hero { padding-inline: 0; }
.number-card, .journey-step, .story-card, .story-step-body, .testimonial-card,
.ecosystem-block, #story-panel {
  background: var(--ios-glass) !important;
  border: 1px solid var(--ios-glass-edge) !important;
  border-radius: 8px;
  box-shadow: var(--ios-control-shadow) !important;
}
.number-value { color: var(--ios-ink); font-size: 48px; }
.story-step h3 { font-size: 26px; }
.mockup-image { filter: none; }
#drivers .rounded-3xl, #restaurants .rounded-3xl { border-radius: 8px; box-shadow: none; }
section:has(> .max-w-7xl > .grid > .animate-slide-up) .relative.bg-white { padding: 0; border: 0; border-radius: 8px; box-shadow: none; background: transparent; }
.registration-page { padding-top: 120px; }
.registration-page::before { background: var(--ios-background); }
.registration-layout { gap: 48px; }
.registration-sidebar {
  background: transparent !important;
  border-radius: 0;
  box-shadow: none;
  color: var(--ios-ink);
  min-height: auto;
  padding: 32px 0;
  top: 120px;
}
.registration-sidebar::after { display: none; }
.registration-sidebar h1 { font-size: 40px; line-height: 1.4; max-width: 16ch; }
.registration-sidebar p, .registration-stats span, .registration-steps p { color: var(--ios-muted); }
.registration-kicker, .registration-heading > span, .eyebrow, .about-eyebrow {
  background: var(--ios-accent-soft);
  color: var(--ios-accent);
  border: 0;
  font-weight: 500;
}
.registration-stats div { background: transparent; border: 0; border-radius: 0; padding-inline: 0; }
.registration-stats div + div { border-inline-start: 1px solid var(--ios-line); padding-inline-start: 24px; }
.registration-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
.registration-steps li { background: transparent; padding-inline: 0; }
.registration-steps span { background: var(--ios-surface); color: var(--ios-blue); box-shadow: var(--ios-control-shadow); }
.registration-card { background: var(--ios-surface); border: 1px solid var(--ios-line); border-radius: 8px; box-shadow: none; padding: 32px; }
.registration-heading h2 { font-size: 28px; }
.form-section {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 24px 0;
}
.form-section + .form-section { border-top: 1px solid var(--ios-line); margin-top: 0; }
.form-section-title > span { background: var(--ios-blue-soft); color: var(--ios-blue); border-radius: 50%; font-weight: 500; }
.form-label { font-weight: 500; color: var(--ios-ink); }
.input-field, form input:not([type="checkbox"]):not([type="file"]):not([type="hidden"]), form select, form textarea {
  background: var(--ios-background) !important;
  color: var(--ios-ink);
  border: 1px solid var(--ios-line) !important;
  border-radius: 12px;
  min-height: 50px;
  font-size: 16px;
  box-shadow: none;
}
.input-field:focus, form input:focus, form select:focus, form textarea:focus { border-color: var(--ios-blue) !important; box-shadow: var(--ios-focus); outline: none; }
.input-file { background: var(--ios-background); border-color: var(--ios-line); font-size: 14px; border-radius: 12px; }
.input-file::file-selector-button { background: var(--ios-surface); color: var(--ios-blue); border-radius: 999px; box-shadow: var(--ios-control-shadow); font-weight: 500; }
.terms-check { background: transparent; padding-inline: 0; }
.terms-check input { accent-color: var(--ios-blue); }
.registration-submit { min-height: 52px; }
.site-footer, .unified-footer { background: var(--ios-background) !important; color: var(--ios-ink) !important; border-top: 1px solid var(--ios-line); }
.footer-column h4 { color: var(--ios-ink) !important; }
.footer-story, .footer-column a, .footer-contact-link, .footer-bottom, .footer-bottom p { color: var(--ios-muted) !important; }
.footer-bottom { border-color: var(--ios-line) !important; }
.footer-badges span, .footer-social a { color: var(--ios-ink); background: var(--ios-surface); border-color: var(--ios-line); box-shadow: none; }
.footer-logo { background: var(--ios-ink); padding: 10px; border-radius: 8px; }
.footer-cta { background: var(--ios-accent) !important; color: var(--ios-surface) !important; border: 0; box-shadow: none; }
.nav-wrap { min-height: 60px; padding-block: 8px; }
.topbar ~ main { padding-top: 130px; }
.doc { max-width: 920px; margin-inline: auto; }
.doc h2 { line-height: 1.5; font-size: 26px; }
.doc th { background: var(--ios-background); }
.doc .ack { background: var(--ios-blue-soft); border-color: var(--ios-line); border-radius: 8px; }
.card { background: var(--ios-glass); border: 1px solid var(--ios-glass-edge); border-radius: 8px; box-shadow: var(--ios-shadow); margin: 24px; }
.badge { background: var(--ios-green-soft); color: var(--ios-green); }
body:has(> .card) { background: var(--ios-background); }
@media (min-width: 1600px) { #home h1 { font-size: 54px; } }
@media (max-width: 1100px) and (min-width: 1024px) {
  .site-nav .lg\:flex { gap: 12px; }
  .site-nav > .max-w-7xl { padding-inline: 18px; }
  .nav-link { font-size: 12px; }
}
@media (max-width: 1023px) {
  .registration-layout { gap: 24px; }
  .registration-sidebar { padding-top: 8px; top: auto; }
  .registration-sidebar h1 { max-width: 100%; }
  section#home.hero-gradient { min-height: 680px !important; }
  .hero-copy { max-width: 600px; margin-inline: auto; }
  #home h1 { font-size: 42px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 96px; }
  .site-nav, .topbar { top: 10px !important; left: 12px !important; right: 12px !important; }
  .site-nav > .max-w-7xl { padding-inline: 14px; }
  .brand-mark img { height: 38px; max-height: 38px; }
  section#home.hero-gradient {
    min-height: 720px !important;
    max-height: none;
    height: auto !important;
    padding-top: 104px !important;
    padding-bottom: 64px !important;
  }
  section#home.hero-gradient::after { background: transparent; }
  section#home.hero-gradient > .max-w-7xl { padding-block: 0 !important; }
  section#home.hero-gradient .hero-copy {
    min-height: auto;
    padding-top: 32px;
    padding-bottom: 16px;
    width: min(100%, 460px);
    color: var(--ios-surface);
  }
  section#home.hero-gradient .hero-copy > div:first-child { margin-bottom: 24px; font-size: 11px; line-height: 1.7; }
  section#home.hero-gradient .hero-copy h1 { font-size: 30px; line-height: 1.55; color: var(--ios-surface); }
  section#home.hero-gradient .hero-copy h1 .hero-title-line { white-space: normal; }
  section#home.hero-gradient .hero-copy h1 .gradient-text { white-space: normal; color: var(--ios-surface) !important; -webkit-text-fill-color: var(--ios-surface) !important; padding: 0; }
  section#home.hero-gradient .hero-copy > p { color: var(--ios-surface) !important; font-size: 16px; }
  section#home.hero-gradient .hero-copy > div:nth-of-type(2) { margin-top: 28px; gap: 12px; }
  section#home.hero-gradient .hero-copy > div:last-child { margin-top: 32px; }
  section#home.hero-gradient .hero-copy > div:last-child .font-bold { color: var(--ios-surface); font-size: 24px; }
  section#home.hero-gradient .hero-copy > div:last-child .text-xs { color: var(--ios-surface); }
  .about-hero { min-height: 640px; max-height: none; }
  .about-hero-inner { padding: 128px 24px 64px; }
  .about-hero-heading { font-size: 46px; line-height: 1.4; }
  .about-hero-label { top: 0; font-size: 11px; }
  .about-hero-sub { font-size: 17px; }
  .hero-heading { font-size: 34px; line-height: 1.45; }
  .about-question-heading, .about-built-title, .about-philosophy-title,
  .about-product-title, .about-cta-title, .section-title, .numbers-title { font-size: 32px; line-height: 1.45; }
  .about-moment-title, .about-idea-title, .about-principle-body h3 { font-size: 28px; line-height: 1.45; }
  .about-moment-year { font-size: 110px; }
  .about-built-dz { font-size: 100px; }
  .registration-page { padding-top: 104px; }
  .registration-sidebar h1 { font-size: 32px; }
  .registration-card { padding: 20px; }
  .number-value { font-size: 28px; }
  .number-label { white-space: normal; font-size: 12px; }
  .happy-cta-title { font-size: 32px; line-height: 1.45; }
  .topbar { border-radius: 24px; }
  .topbar ~ main { padding-top: 180px; }
  .nav-links { gap: 4px; }
  .nav-links a { font-size: 11px; }
  .hero h1 { font-size: 30px; line-height: 1.5; }
}
/* Shared brand controls; homepage layout rules remain scoped below. */
:is(.site-btn, .btn-primary, .footer-cta, a.bg-blue-600, .registration-submit, .about-product-cta, .about-cta-btn, a.bg-\[\#FF6600\], .card > a) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--ios-brand-gradient) !important;
  color: var(--ios-surface) !important;
  border: 1px solid var(--ios-liquid-edge) !important;
  box-shadow: var(--ios-liquid-shadow) !important;
  backdrop-filter: blur(8px) saturate(1.2);
  transition: transform 240ms ease, box-shadow 300ms ease, backdrop-filter 300ms ease !important;
  filter: none !important;
}
:is(.site-btn, .btn-primary, .footer-cta, a.bg-blue-600, .registration-submit, .about-product-cta, .about-cta-btn, a.bg-\[\#FF6600\], .card > a, a.border-\[\#FF6600\], #story-toggle, .store-badge, .footer-store-btn)::after {
  content: "";
  position: absolute;
  inset: -50% -80%;
  background: var(--ios-shine);
  transform: translateX(-65%) skewX(-14deg);
  opacity: 0;
  pointer-events: none;
}
:is(a.border-\[\#FF6600\], #story-toggle, .store-badge, .footer-store-btn) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
:is(.site-btn, .btn-primary, .footer-cta, a.bg-blue-600, .registration-submit, .about-product-cta, .about-cta-btn, a.bg-\[\#FF6600\], .card > a):focus-visible {
  box-shadow: var(--ios-liquid-hover) !important;
  backdrop-filter: blur(16px) saturate(1.5);
}
@media (hover: hover) {
  :is(.site-btn, .btn-primary, .footer-cta, a.bg-blue-600, .registration-submit, .about-product-cta, .about-cta-btn, a.bg-\[\#FF6600\], .card > a):hover {
    transform: translateY(-2px);
    box-shadow: var(--ios-liquid-hover) !important;
    backdrop-filter: blur(16px) saturate(1.5);
  }
  :is(.site-btn, .btn-primary, .footer-cta, a.bg-blue-600, .registration-submit, .about-product-cta, .about-cta-btn, a.bg-\[\#FF6600\], .card > a, a.border-\[\#FF6600\], #story-toggle, .store-badge, .footer-store-btn):hover::after {
    animation: liquid-shine 850ms cubic-bezier(0.2,0.7,0.2,1) both;
  }
}
@keyframes liquid-shine {
  0% { opacity: 0; transform: translateX(-65%) skewX(-14deg); }
  20%, 70% { opacity: 1; }
  100% { opacity: 0; transform: translateX(65%) skewX(-14deg); }
}
:is(.gradient-text, .gradient-ink, .about-hero-ink, .about-question-ink, .nav-link.active, #home .hero-copy > div:last-child .font-bold) {
  background: var(--ios-brand-gradient) !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
:is([class~="bg-[#FF6600]"], .happy-cta-badge, .about-hero-label-dot) {
  background: var(--ios-brand-gradient) !important;
  color: var(--ios-surface) !important;
}
.landing-polish :is(#partners, #restaurants) .inline-flex[class~="bg-orange-50"] {
  background: var(--ios-brand-gradient) !important;
  color: var(--ios-surface) !important;
  border: 1px solid var(--ios-liquid-edge);
}
.happy-eats-cta-inner { background: var(--ios-brand-gradient); }
.happy-cta-title { color: var(--ios-surface); font-size: 44px; line-height: 1.4; }
.footer-logo {
  display: block;
  width: 160px;
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 8px;
  background: var(--ios-glass-gradient);
  border: 1px solid var(--ios-glass-edge);
  border-radius: 8px;
  box-shadow: var(--ios-control-shadow);
  backdrop-filter: blur(16px);
}
.footer-top { grid-template-columns: minmax(0,0.9fr) minmax(0,1.85fr); gap: 40px; }
.footer-links-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.footer-contact { grid-column: 1 / -1; }
.footer-contact-link { overflow-wrap: anywhere; min-width: 0; }
.footer-contact-link svg { flex-shrink: 0; }
#mobile-menu { position: absolute; z-index: 101; transform-origin: top center; overscroll-behavior: contain; }
#mobile-menu.hidden { display: none; }
#mobile-menu > div { display: grid; gap: 6px; padding: 12px !important; }
#mobile-menu a {
  display: flex !important;
  align-items: center;
  min-height: 48px;
  margin: 0 !important;
  padding: 12px 16px !important;
  font-size: 15px;
  line-height: 1.5;
  text-decoration: none;
}
#mobile-menu .site-btn { justify-content: center; }
#mobile-menu a.active:not(.brand-mark) {
  background: var(--ios-brand-gradient) !important;
  color: var(--ios-surface) !important;
  -webkit-text-fill-color: var(--ios-surface) !important;
  border: 1px solid var(--ios-liquid-edge);
  box-shadow: var(--ios-liquid-shadow);
}
.mobile-nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: var(--ios-glass-shade);
  backdrop-filter: blur(14px) saturate(0.85);
}
.mobile-nav-backdrop[hidden] { display: none; }
body.mobile-nav-open { overflow: hidden; }
body.mobile-nav-open :is(.site-nav, .topbar) { z-index: 100; }
#mobile-menu-btn svg path { transition: d 240ms ease; }
#mobile-menu-btn.menu-open svg { transform: none; }
#mobile-menu-btn.menu-open svg path { d: path("M6 6L18 18M6 18L18 6"); }
.registration-kicker, .registration-heading > span, .eyebrow, .about-eyebrow {
  background: var(--ios-brand-gradient);
  color: var(--ios-surface);
}
#mobile-menu:not(.hidden) .mobile-menu-item { animation: none !important; opacity: 1; transform: none; }
#mobile-menu:not(.hidden) { animation: menu-reveal 240ms ease both; }
#mobile-menu.mobile-menu-closing { animation: menu-dismiss 240ms ease both; pointer-events: none; }
@keyframes menu-reveal { from { opacity: 0; transform: translateY(-8px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes menu-dismiss { to { opacity: 0; transform: translateY(-8px) scale(0.98); } }
.landing-polish #home .hero-copy { min-width: 0; }
.landing-polish #home .hero-copy > div:last-child {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
  width: min(100%,400px);
  background: transparent;
  border: 0;
  padding: 16px 0;
}
.landing-polish #home .hero-copy > div:last-child > .w-px { display: none; }
.landing-polish #home .hero-copy > div:last-child > div { min-width: 0; }
.landing-polish #home .hero-copy > div:last-child > div + div:not(.w-px) { border-inline-start: 1px solid var(--ios-line); }
@media (max-width: 1023px) {
  .site-nav > .max-w-7xl > div { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: 8px; }
  .site-nav > .max-w-7xl > div > .lg\:hidden { width: 44px; min-width: 0; }
  .brand-mark { justify-self: center; min-width: 0; }
  .footer-top { grid-template-columns: minmax(0,1fr); }
  .landing-polish #home { background-position: 38% center; }
  .topbar .nav-wrap { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: 8px; padding: 4px 14px; min-height: 56px; }
  .topbar .brand { justify-self: center; }
  .topbar .brand-mark { width: auto; height: 38px; }
  .topbar .nav-links { display: none; }
  .topbar ~ main { padding-top: 112px; }
}
@media (min-width: 1024px) {
  .topbar #mobile-menu-btn, .topbar .nav-spacer, #mobile-menu { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .landing-polish #home > .max-w-7xl > .grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px; }
  .landing-polish #home .hero-copy { text-align: right; }
  .landing-polish #home h1 { font-size: 36px; }
  .landing-polish #home .hero-copy > div:nth-of-type(2) { flex-direction: column; }
  .landing-polish #home .hero-copy > div:first-child { font-size: 12px; }
}
@media (max-width: 767px) {
  .landing-polish section#home.hero-gradient {
    background: var(--ios-background);
    display: block;
    min-height: 0 !important;
    padding-top: 94px !important;
    padding-bottom: 0 !important;
  }
  .landing-polish section#home.hero-gradient::before {
    position: relative;
    display: block;
    height: auto;
    width: 100%;
    aspect-ratio: 1.45;
    background-size: cover;
    background-position: center 66%;
  }
  .landing-polish section#home.hero-gradient::after { display: none; }
  .landing-polish section#home.hero-gradient > .max-w-7xl { padding: 28px 20px 24px !important; display: block; }
  .landing-polish section#home.hero-gradient > .max-w-7xl > .grid { display: block; }
  .landing-polish section#home.hero-gradient .hero-copy { padding: 0; color: var(--ios-ink); }
  .landing-polish section#home.hero-gradient .hero-copy > div:first-child { font-size: 12px; margin-bottom: 18px; padding: 8px 12px; }
  .landing-polish section#home.hero-gradient .hero-copy > div:first-child span { flex-shrink: 0; }
  .landing-polish section#home.hero-gradient .hero-copy h1 { color: var(--ios-ink); font-size: 32px; line-height: 1.45; margin-bottom: 16px; }
  .landing-polish section#home.hero-gradient .hero-copy h1 .gradient-text {
    background: var(--ios-brand-gradient) !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
  }
  .landing-polish section#home.hero-gradient .hero-copy > p { color: var(--ios-muted) !important; font-size: 16px; }
  .landing-polish section#home.hero-gradient .hero-copy > div:nth-of-type(2) { width: 100%; margin: 22px auto 0; }
  .landing-polish section#home.hero-gradient .hero-copy > div:nth-of-type(2) a { font-size: 16px; min-height: 52px; padding: 12px 16px; }
  .landing-polish section#home.hero-gradient .hero-copy > div:last-child { margin: 22px auto 0; gap: 0; border-radius: 0; backdrop-filter: none; background: transparent !important; }
  .landing-polish section#home.hero-gradient .hero-copy > div:last-child > div { padding-inline: 8px; }
  .landing-polish section#home.hero-gradient .hero-copy > div:last-child .text-xs { color: var(--ios-muted); font-size: 12px; }
  .landing-polish #home > .absolute.bottom-6 { display: none; }
  .landing-polish #partners { padding-block: 36px; }
  .footer-links-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 20px; }
  .footer-column { min-width: 0; }
  .footer-contact { grid-column: 1 / -1; }
  .happy-cta-title { font-size: 32px; }
  .happy-cta-actions, .footer-downloads { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  :is(.store-badge, .footer-store-btn) { min-width: 0; width: 100%; }
  :is(.store-badge, .footer-store-btn) img { width: 100%; height: auto; max-height: 48px; object-fit: contain; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .section-animate, .about-section-animate { opacity: 1 !important; transform: none !important; }
}
/* About CTA: readable text on light background */
.about-cta .about-cta-eyebrow { color: var(--ios-accent) !important; }
.about-cta :is(.about-cta-title, .about-cta-sub, .about-cta-made) { color: var(--ios-ink) !important; -webkit-text-fill-color: currentColor; }
.about-cta .about-cta-bg-text { color: var(--ios-ink) !important; opacity: .05; }

/* About hero: remove empty space under header */
.about-hero { min-height: 0 !important; }
.about-hero-inner { padding-block: 120px 72px !important; }

/* Logo without background */
.brand-mark, .brand-mark img { background: transparent !important; box-shadow: none !important; }

@media (max-width: 767px) {
  .about-hero-inner { padding: 104px 24px 56px !important; }

  /* Home hero: photo starts at the top, under the header, fading into the page */
  body.landing-polish section#home.hero-gradient { padding-top: 0 !important; align-items: flex-start !important; min-height: 0 !important; }
  body.landing-polish section#home.hero-gradient::before {
    position: absolute !important; left: 0 !important; right: 0 !important; top: 0 !important; height: 500px !important; bottom: auto !important;
    background-size: cover !important; background-position: center 85% !important;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 55%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 55%, transparent 100%);
  }
  body.landing-polish section#home.hero-gradient .hero-copy { padding-top: 410px !important; margin-top: 0 !important; position: relative; z-index: 1; }
  body.landing-polish .site-nav:not(.shadow-lg) {
    background: transparent !important; border-color: transparent !important;
    box-shadow: none !important; backdrop-filter: none !important;
  }
}

.footer-logo { background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; }

/* Store badges: show the official badge only, no extra frame */
:is(.store-badge, .footer-store-btn) { padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; border-radius: 10px !important; overflow: hidden; line-height: 0; }
:is(.store-badge, .footer-store-btn) img { display: block; height: 48px; width: auto; border-radius: 10px; }

/* Happy Eats hero: keep everything inside the phone width */
@media (max-width: 767px) {
  .section-animate, .hero-copy-block, .hero-heading, .hero-line { min-width: 0 !important; max-width: 100% !important; }
  .hero-heading { font-size: 34px !important; line-height: 1.25 !important; }
  .hero-heading .hero-line, .hero-heading .gradient-ink { white-space: normal !important; display: inline; }
  .hero-heading .hero-line { display: block; }
  .hero-value-points { flex-wrap: wrap; max-width: 100%; }
}

/* Happy people: pause the auto-scrolling messages while pressed, resume on release */
.testimonial-wall.is-touch-paused .testimonial-track { animation-play-state: paused !important; }

/* Brand wordmark typeface: English "Happy Eats" only, colors untouched */
@font-face { font-family: "Open Sauce One"; src: url("fonts/OpenSauceOne-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce One"; src: url("fonts/OpenSauceOne-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce One"; src: url("fonts/OpenSauceOne-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sauce One"; src: url("fonts/OpenSauceOne-ExtraBold.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
.brand-en { font-family: "Open Sauce One", ui-sans-serif, system-ui, sans-serif !important; letter-spacing: 0.01em; }
